/**
 * AW GROUP Global Loading Framework - Stylesheet
 * نظام ومؤشر التحميل الكروي الفاخر (Spherical Ring Loader) - مجموعة الوكالة التجارية
 * Version: 3.0 (Compact Single-Line Edition)
 */

:root {
    --aw-load-primary: var(--brand-primary, #891811); --aw-load-primary-light: var(--brand-primary-light, #E30613); --aw-load-primary-hover: var(--brand-primary-hover, #70130E); --aw-load-metallic-dark: var(--metallic-dark, #1A1A1A); --aw-load-metallic-silver: var(--metallic-silver, #8C8C8C); --aw-load-metallic-border: var(--metallic-border, rgba(140, 140, 140, 0.35)); --aw-load-orb-bg: rgba(255, 255, 255, 0.96); --aw-load-text: #111827; --aw-load-warning: #b45309; --aw-load-warning-bg: rgba(245, 158, 11, 0.14); --aw-load-danger: #b91c1c; --aw-load-danger-bg: rgba(239, 68, 68, 0.16); --aw-load-orb-shadow: 0 16px 40px -8px rgba(137, 24, 17, 0.28), 0 0 0 1px rgba(255, 255, 255, 0.8) inset;
}

[data-theme="dark"] {
    --aw-load-orb-bg: rgba(26, 28, 33, 0.96); --aw-load-metallic-border: rgba(255, 255, 255, 0.18); --aw-load-text: #f8fafc; --aw-load-warning: #fbbf24; --aw-load-warning-bg: rgb(243, 209, 150); --aw-load-danger: #f87171; --aw-load-danger-bg: rgba(239, 68, 68, 0.25); --aw-load-orb-shadow: 0 20px 45px -8px rgba(0, 0, 0, 0.75), 0 0 0 1px rgba(255, 255, 255, 0.12) inset;
}

/* 1. الحاوية الشاملة لطبقة التراكب (Backdrop Overlay) */
.aw-loading-overlay { position: fixed; inset: 0; width: 100vw; height: 100vh; height: 100dvh; background: radial-gradient(circle at 50% 50%, rgba(17, 24, 39, 0.55) 0%, rgba(10, 12, 16, 0.82) 100%); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); display: flex; align-items: center; justify-content: center; z-index: 999999; opacity: 0; visibility: hidden; pointer-events: none; transition: opacity 0.12s ease-out, visibility 0.12s ease-out; box-sizing: border-box; padding: 16px; font-family: var(--font-family, "Cairo", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif); }
.aw-loading-overlay.is-active { opacity: 1 !important; visibility: visible !important; pointer-events: auto !important; }

/* 2. الحاوية الكروية وتأثير الزوم إن والزوم آوت (Spherical Container & Zoom) */
.aw-loading-orb-container { position: relative !important; width: 108px !important; height: 108px !important; max-width: 108px !important; max-height: 108px !important; min-width: 108px !important; min-height: 108px !important; display: flex !important; align-items: center !important; justify-content: center !important; transform: scale(0.6); opacity: 0; transition: transform 0.18s cubic-bezier(0.175, 0.885, 0.32, 1.275), opacity 0.12s ease; box-sizing: border-box !important; margin: auto !important; }
.aw-loading-overlay.is-active .aw-loading-orb-container { transform: scale(1) !important; opacity: 1 !important; }
.aw-loading-overlay.is-closing .aw-loading-orb-container { transform: scale(0.2) !important; opacity: 0 !important; transition: transform 0.18s ease-in, opacity 0.15s ease; }

/* 3. شريط التقدم الدائري المحيط بالشعار (SVG Circular Progress Ring) */
.aw-loading-svg-ring { position: absolute !important; inset: 0 !important; width: 108px !important; height: 108px !important; max-width: 108px !important; max-height: 108px !important; transform: rotate(-90deg) !important; overflow: visible !important; z-index: 4 !important; }
.aw-loading-svg-track { fill: none !important; stroke: rgba(22, 163, 74, 0.18) !important; stroke-width: 3.5 !important; }
[data-theme="dark"] .aw-loading-svg-track { stroke: rgba(74, 222, 128, 0.14) !important; }
.aw-loading-svg-bar { fill: none !important; stroke: url(#awGreenMetallicGradient) !important; stroke-width: 4 !important; stroke-linecap: round !important; transition: stroke-dashoffset 0.28s cubic-bezier(0.16, 1, 0.3, 1), stroke 0.25s ease; filter: drop-shadow(0 0 6px rgba(34, 197, 94, 0.75)) drop-shadow(0 0 1px rgba(255, 255, 255, 0.8)); }

/* 4. الحلقات الدائرية المتعاكسة والتوهج الكروي (Concentric Dynamic Rings) */
.aw-loading-ring-outer { position: absolute !important; inset: -4px !important; border-radius: 50% !important; border: 2px solid rgba(140, 140, 140, 0.2) !important; border-top-color: #FF3B47 !important; border-right-color: #891811 !important; border-left-color: #E30613 !important; animation: awOrbSpinCw 1.25s cubic-bezier(0.5, 0.12, 0.48, 0.88) infinite; filter: drop-shadow(0 0 6px rgba(227, 6, 19, 0.65)); z-index: 5 !important; pointer-events: none !important; }
.aw-loading-ring-inner { position: absolute !important; inset: 4px !important; border-radius: 50% !important; border: 1.8px dashed rgba(160, 160, 160, 0.5) !important; border-top-color: #FFFFFF !important; border-bottom-color: #8C8C8C !important; animation: awOrbSpinCcw 2.2s linear infinite; filter: drop-shadow(0 0 4px rgba(255, 255, 255, 0.45)); z-index: 5 !important; pointer-events: none !important; }
[data-theme="dark"] .aw-loading-ring-inner { border-color: rgba(255, 255, 255, 0.35) !important; border-top-color: #FFFFFF !important; border-bottom-color: #8C8C8C !important; }
.aw-loading-glow-pulse { position: absolute !important; inset: 7px !important; border-radius: 50% !important; background: radial-gradient(circle, rgba(227, 6, 19, 0.28) 0%, rgba(137, 24, 17, 0.04) 65%, transparent 75%) !important; animation: awOrbPulseGlow 1.8s ease-in-out infinite; z-index: 1 !important; }

@keyframes awOrbSpinCw { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }
@keyframes awOrbSpinCcw { 0% { transform: rotate(360deg); } 100% { transform: rotate(0deg); } }
@keyframes awOrbPulseGlow { 0%, 100% { transform: scale(0.95); opacity: 0.55; } 50% { transform: scale(1.15); opacity: 0.85; } }

/* 5. النواة الكروية المركزية والشعار (Core Orb & Logo) */
.aw-loading-core-orb { width: 86px !important; height: 86px !important; max-width: 86px !important; max-height: 86px !important; min-width: 86px !important; min-height: 86px !important; border-radius: 50% !important; background: var(--aw-load-orb-bg) !important; border: 1px solid var(--aw-load-metallic-border) !important; box-shadow: var(--aw-load-orb-shadow) !important; display: flex !important; align-items: center !important; justify-content: center !important; position: relative !important; z-index: 3 !important; overflow: hidden !important; padding: 6px !important; box-sizing: border-box !important; }
.aw-loading-core-orb::before { content: ''; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; height: 50% !important; background: linear-gradient(180deg, rgba(255, 255, 255, 0.45) 0%, rgba(255, 255, 255, 0) 100%) !important; border-radius: 86px 86px 0 0 !important; pointer-events: none !important; }
.aw-loading-logo { width: 64px !important; height: 64px !important; max-width: 64px !important; max-height: 64px !important; min-width: 40px !important; object-fit: contain !important; display: block !important; margin: 0 auto !important; z-index: 4 !important; filter: drop-shadow(0 2px 6px rgba(0, 0, 0, 0.25)) !important; }

/* 6. حالات التنبيه والخطأ (Warning & Fatal Badges) */
.aw-loading-status-badge { display: none; position: absolute; top: 116px; left: 50%; transform: translateX(-50%); align-items: center; gap: 6px; padding: 6px 12px; border-radius: 8px; font-size: 0.72rem; font-weight: 700; white-space: nowrap; z-index: 10; box-shadow: 0 6px 18px rgba(0, 0, 0, 0.25); }
.aw-loading-overlay.is-warning .aw-loading-status-badge.warning-badge { display: inline-flex; background: var(--aw-load-warning-bg); border: 1px solid rgba(245, 158, 11, 0.45); color: var(--aw-load-warning); backdrop-filter: blur(8px); }
.aw-loading-overlay.is-fatal .aw-loading-status-badge.fatal-badge { display: inline-flex; background: var(--aw-load-danger-bg); border: 1px solid rgba(239, 68, 68, 0.5); color: var(--aw-load-danger); backdrop-filter: blur(8px); }
.aw-loading-overlay.is-fatal .aw-loading-svg-bar { stroke: var(--aw-load-danger) !important; filter: drop-shadow(0 0 6px rgba(220, 38, 38, 0.7)) !important; }
.aw-loading-overlay.is-fatal .aw-loading-ring-outer, .aw-loading-overlay.is-fatal .aw-loading-ring-inner { animation-play-state: paused; }

/* 7. أزرار الإجراءات عند التعثر (Retry & Dismiss) */
.aw-loading-actions { display: none; position: absolute; top: 154px; left: 50%; transform: translateX(-50%); gap: 8px; white-space: nowrap; z-index: 10; }
.aw-loading-overlay.is-fatal .aw-loading-actions { display: flex; }
.aw-loading-action-btn { min-height: 30px; padding: 4px 10px; border-radius: var(--radius-sm, 6px); font-size: 0.72rem; font-weight: 800; display: inline-flex; align-items: center; justify-content: center; gap: 5px; white-space: nowrap; cursor: pointer; font-family: inherit; transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1); }
.aw-loading-action-btn i { font-size: 0.8rem; }

/* 8. التوافق مع تفضيلات الحركة (Reduced Motion) */
@media (prefers-reduced-motion: reduce) {
    .aw-loading-orb-container, .aw-loading-overlay { transition: none !important; }
    .aw-loading-ring-outer, .aw-loading-ring-inner, .aw-loading-glow-pulse { animation: none !important; }
}