/* =====================================================================
   Zenve BI — Celestial Stars Revolving Circular Logo Loading Clip
   Dynamic Thematic Adaptation per Dashboard & Page Domain
   Supports dynamic CSS custom properties:
     --zdl-primary, --zdl-secondary, --zdl-accent, --zdl-light, --zdl-dark
     --zdl-glow, --zdl-glow-border, --zdl-core-border, --zdl-core-inner
     --zdl-bg-tint, --zdl-badge-bg, --zdl-badge-border, --zdl-badge-color
     --zdl-star-glow1, --zdl-star-glow2, --zdl-runner-grad, --zdl-title-grad
   ===================================================================== */

/* Full Dashboard Overlay — Light Luxury Theme Matching Destination Domain */
#zenve-dragon-loader {
  --zdl-primary: #38bdf8;
  --zdl-secondary: #38bdf8;
  --zdl-accent: #7dd3fc;
  --zdl-light: #bae6fd;
  --zdl-dark: #0284c7;
  --zdl-glow: rgba(56, 189, 248, 0.22);
  --zdl-glow-border: rgba(56, 189, 248, 0.38);
  --zdl-core-border: rgba(56, 189, 248, 0.68);
  --zdl-core-inner: #f0f9ff;
  --zdl-bg-tint: rgba(255, 255, 255, 0.96);
  --zdl-badge-bg: rgba(56, 189, 248, 0.12);
  --zdl-badge-border: rgba(56, 189, 248, 0.35);
  --zdl-badge-color: #0284c7;
  --zdl-star-color: #38bdf8;
  --zdl-star-glow1: rgba(56, 189, 248, 0.95);
  --zdl-star-glow2: rgba(56, 189, 248, 0.70);
  --zdl-runner-grad: linear-gradient(90deg, transparent, #7dd3fc, #38bdf8, #0284c7, transparent);
  --zdl-title-grad: linear-gradient(135deg, #0f172a 0%, #1e293b 35%, #0284c7 70%, #38bdf8 100%);

  position: fixed !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  z-index: 99999 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  background: radial-gradient(circle at 50% 42%, rgba(255, 255, 255, 0.98) 0%, var(--zdl-bg-tint, rgba(240, 253, 250, 0.96)) 45%, rgba(248, 250, 252, 0.95) 75%, rgba(241, 245, 249, 0.94) 100%) !important;
  backdrop-filter: blur(16px) saturate(160%) !important;
  -webkit-backdrop-filter: blur(16px) saturate(160%) !important;
  opacity: 0;
  pointer-events: none;
  visibility: hidden;
  transition: opacity 0.22s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.22s cubic-bezier(0.16, 1, 0.3, 1), background 0.3s ease;
  box-sizing: border-box !important;
  overflow: hidden !important;
}

#zenve-dragon-loader.zdl-active {
  opacity: 1 !important;
  pointer-events: auto !important;
  visibility: visible !important;
}

@media (min-width: 1024px) {
  #zenve-dragon-loader {
    left: 224px !important;
    width: calc(100vw - 224px) !important;
  }
}

/* Stage container */
.zdl-stage {
  position: relative;
  width: 400px;
  height: 400px;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Ambient Pulsing Starlight Aura */
.zdl-ambient-aura {
  position: absolute;
  width: 340px;
  height: 340px;
  border-radius: 50%;
  background: radial-gradient(circle, var(--zdl-glow, rgba(16, 185, 129, 0.22)) 0%, color-mix(in srgb, var(--zdl-secondary, #059669) 24%, transparent) 45%, color-mix(in srgb, var(--zdl-primary, #10b981) 4%, transparent) 65%, transparent 72%);
  filter: blur(34px);
  animation: zdlAuraPulse 3.5s ease-in-out infinite alternate;
  pointer-events: none;
  transition: background 0.3s ease;
}

@keyframes zdlAuraPulse {
  0% { transform: scale(0.92); opacity: 0.7; }
  100% { transform: scale(1.12); opacity: 1; }
}

/* Outer Celestial Orbit Ring (Dashed Starlight Track) */
.zdl-orbit-track-outer {
  position: absolute;
  width: 260px;
  height: 260px;
  border-radius: 50%;
  border: 1.5px dashed var(--zdl-glow-border, rgba(16, 185, 129, 0.35));
  box-shadow: 0 0 20px var(--zdl-glow, rgba(16, 185, 129, 0.14)), inset 0 0 16px var(--zdl-glow, rgba(16, 185, 129, 0.06));
  pointer-events: none;
  transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

/* Inner Celestial Orbit Ring */
.zdl-orbit-track-inner {
  position: absolute;
  width: 174px;
  height: 174px;
  border-radius: 50%;
  border: 1px dashed var(--zdl-glow-border, rgba(5, 150, 105, 0.28));
  box-shadow: 0 0 14px var(--zdl-glow, rgba(16, 185, 129, 0.12));
  pointer-events: none;
  transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

/* Circular Halo framing the Logo */
.zdl-logo-halo {
  position: absolute;
  width: 122px;
  height: 122px;
  border-radius: 50%;
  border: 1.5px solid var(--zdl-glow-border, rgba(16, 185, 129, 0.40));
  box-shadow: 0 0 22px var(--zdl-glow, rgba(16, 185, 129, 0.22));
  animation: zdlHaloSpin 20s linear infinite;
  pointer-events: none;
  transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

@keyframes zdlHaloSpin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/* Central Zenve Logo in a Perfect Circle */
.zdl-emblem-core {
  position: absolute;
  width: 96px;
  height: 96px;
  border-radius: 50% !important;
  background: radial-gradient(circle at 38% 34%, #ffffff 0%, #f8fafc 62%, var(--zdl-core-inner, #ecfdf5) 100%);
  border: 2.5px solid var(--zdl-core-border, rgba(16, 185, 129, 0.68));
  box-shadow: 
    0 14px 36px -4px var(--zdl-glow, rgba(5, 150, 105, 0.22)),
    0 4px 16px rgba(15, 23, 42, 0.06),
    0 0 26px var(--zdl-glow, rgba(16, 185, 129, 0.24)),
    inset 0 0 16px var(--zdl-glow, rgba(16, 185, 129, 0.12));
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 20;
  animation: zdlEmblemBreathe 3s ease-in-out infinite;
  transition: border-color 0.3s ease, background 0.3s ease, box-shadow 0.3s ease;
}

.zdl-emblem-core img {
  width: 64px;
  height: 64px;
  object-fit: contain;
  filter: drop-shadow(0 2px 6px var(--zdl-glow, rgba(5, 150, 105, 0.3)));
}

@keyframes zdlEmblemBreathe {
  0%, 100% {
    transform: scale(1);
    box-shadow: 
      0 14px 36px -4px var(--zdl-glow, rgba(5, 150, 105, 0.22)),
      0 4px 16px rgba(15, 23, 42, 0.06),
      0 0 26px var(--zdl-glow, rgba(16, 185, 129, 0.24)),
      inset 0 0 16px var(--zdl-glow, rgba(16, 185, 129, 0.12));
  }
  50% {
    transform: scale(1.05);
    box-shadow: 
      0 18px 44px -2px var(--zdl-glow, rgba(5, 150, 105, 0.32)),
      0 6px 20px rgba(15, 23, 42, 0.08),
      0 0 34px var(--zdl-glow, rgba(16, 185, 129, 0.36)),
      inset 0 0 22px var(--zdl-glow, rgba(16, 185, 129, 0.18));
  }
}

/* REVOLVING CELESTIAL ORBITS CARRYING THE STARS */
.zdl-orbit-outer {
  position: absolute;
  width: 260px;
  height: 260px;
  border-radius: 50%;
  pointer-events: none;
  z-index: 10;
  animation: zdlOrbitCW 8s linear infinite;
}

.zdl-orbit-inner {
  position: absolute;
  width: 174px;
  height: 174px;
  border-radius: 50%;
  pointer-events: none;
  z-index: 11;
  animation: zdlOrbitCCW 11s linear infinite;
}

@keyframes zdlOrbitCW {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

@keyframes zdlOrbitCCW {
  0% { transform: rotate(360deg); }
  100% { transform: rotate(0deg); }
}

/* Precise Star Holder Positions along the circumference */
.zdl-star-holder {
  position: absolute;
  transform: translate(-50%, -50%);
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}

/* Outer orbit star placements (circle of radius 130px, center 130px, 130px) */
.zdl-star-pos-0   { top: 0px;   left: 130px; }
.zdl-star-pos-60  { top: 65px;  left: 243px; }
.zdl-star-pos-120 { top: 195px; left: 243px; }
.zdl-star-pos-180 { top: 260px; left: 130px; }
.zdl-star-pos-240 { top: 195px; left: 17px;  }
.zdl-star-pos-300 { top: 65px;  left: 17px;  }

/* Inner orbit star placements (circle of radius 87px, center 87px, 87px) */
.zdl-star-pos-in-45  { top: 25px;  left: 149px; }
.zdl-star-pos-in-135 { top: 149px; left: 149px; }
.zdl-star-pos-in-225 { top: 149px; left: 25px;  }
.zdl-star-pos-in-315 { top: 25px;  left: 25px;  }

/* Star Visual Styling */
.zdl-star {
  display: block;
  filter: drop-shadow(0 0 6px var(--zdl-star-glow1, rgba(56, 189, 248, 0.95))) drop-shadow(0 0 14px var(--zdl-star-glow2, rgba(56, 189, 248, 0.70)));
  animation: zdlStarTwinkle 2.4s ease-in-out infinite alternate;
  transition: filter 0.25s ease;
}

.zdl-star-lg { width: 28px; height: 28px; }
.zdl-star-md { width: 20px; height: 20px; }
.zdl-star-sm { width: 14px; height: 14px; }
.zdl-star-xs { width: 10px; height: 10px; }

.zdl-delay-0 { animation-delay: 0s; }
.zdl-delay-1 { animation-delay: 0.35s; }
.zdl-delay-2 { animation-delay: 0.75s; }
.zdl-delay-3 { animation-delay: 1.15s; }
.zdl-delay-4 { animation-delay: 1.55s; }
.zdl-delay-5 { animation-delay: 1.95s; }

@keyframes zdlStarTwinkle {
  0% {
    transform: scale(0.85) rotate(0deg);
    filter: drop-shadow(0 0 4px var(--zdl-star-glow1, rgba(56, 189, 248, 0.75))) drop-shadow(0 0 8px var(--zdl-star-glow2, rgba(56, 189, 248, 0.45)));
    opacity: 0.8;
  }
  50% {
    transform: scale(1.22) rotate(20deg);
    filter: drop-shadow(0 0 10px var(--zdl-star-glow1, rgba(56, 189, 248, 1))) drop-shadow(0 0 22px var(--zdl-star-glow2, rgba(56, 189, 248, 0.9)));
    opacity: 1;
  }
  100% {
    transform: scale(0.92) rotate(0deg);
    filter: drop-shadow(0 0 5px var(--zdl-star-glow1, rgba(56, 189, 248, 0.8))) drop-shadow(0 0 10px var(--zdl-star-glow2, rgba(56, 189, 248, 0.55)));
    opacity: 0.85;
  }
}

/* Floating Stardust Particles */
.zdl-stardust {
  position: absolute;
  border-radius: 50%;
  background: var(--zdl-accent, #7dd3fc);
  box-shadow: 0 0 6px var(--zdl-primary, #38bdf8), 0 0 12px var(--zdl-star-glow2, rgba(56, 189, 248, 0.7));
  pointer-events: none;
  animation: zdlStardustFloat 2.6s ease-in-out infinite alternate;
  transition: background 0.25s ease, box-shadow 0.25s ease;
}

.zdl-dust-1 { width: 4px; height: 4px; top: 18%; left: 24%; animation-delay: 0.2s; }
.zdl-dust-2 { width: 3px; height: 3px; top: 22%; left: 74%; animation-delay: 0.8s; }
.zdl-dust-3 { width: 5px; height: 5px; top: 76%; left: 78%; animation-delay: 1.4s; }
.zdl-dust-4 { width: 3px; height: 3px; top: 80%; left: 22%; animation-delay: 1.8s; }

@keyframes zdlStardustFloat {
  0% { transform: translateY(0px) scale(0.7); opacity: 0.35; }
  100% { transform: translateY(-8px) scale(1.3); opacity: 0.95; }
}

/* Loading Typography & Thematic Category Badge */
.zdl-caption {
  margin-top: 24px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  z-index: 10;
  text-align: center;
}

/* Domain / Category Pill Badge */
.zdl-category-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 3.5px 14px;
  border-radius: 99px;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  background: var(--zdl-badge-bg, #d1fae5);
  border: 1px solid var(--zdl-badge-border, #a7f3d0);
  color: var(--zdl-badge-color, #065f46);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
  margin-bottom: 2px;
  transition: background 0.3s ease, border-color 0.3s ease, color 0.3s ease;
}

.zdl-title {
  font-family: 'Sora', sans-serif;
  font-size: 14px;
  font-weight: 800;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  background: var(--zdl-title-grad, linear-gradient(135deg, #0f172a 0%, #1e293b 35%, #059669 70%, #10b981 100%));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  filter: drop-shadow(0 1px 2px var(--zdl-glow, rgba(5, 150, 105, 0.18)));
  transition: filter 0.3s ease;
}

.zdl-subtitle {
  font-family: 'Manrope', sans-serif;
  font-size: 12px;
  font-weight: 600;
  color: #475569;
  letter-spacing: 0.04em;
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 18px;
}

.zdl-status-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--zdl-primary, #10b981);
  box-shadow: 0 0 8px var(--zdl-primary, rgba(16, 185, 129, 0.7));
  animation: zdlDotPulse 1.2s ease-in-out infinite;
  transition: background 0.3s ease, box-shadow 0.3s ease;
}

@keyframes zdlDotPulse {
  0%, 100% { opacity: 0.45; transform: scale(0.85); }
  50% { opacity: 1; transform: scale(1.3); }
}

.zdl-progress-track {
  width: 170px;
  height: 3px;
  background: rgba(15, 23, 42, 0.08);
  border-radius: 99px;
  overflow: hidden;
  position: relative;
  margin-top: 4px;
}

.zdl-progress-runner {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 45%;
  background: var(--zdl-runner-grad, linear-gradient(90deg, transparent, #34d399, #10b981, #059669, transparent));
  animation: zdlProgressRun 1.3s ease-in-out infinite;
  transition: background 0.3s ease;
}

@keyframes zdlProgressRun {
  0% { left: -50%; }
  100% { left: 110%; }
}

/* =====================================================================
   Authoritative Sidebar Domain Font Colors
   Each domain title matches its exact design token and loading-star color
   ===================================================================== */
.sidebar-scope nav button[data-domain="Executive Dashboard"] .sidebar-label,
.sidebar-scope nav button[data-domain="Executive Dashboard"] .sidebar-icon-wrap { color: #38bdf8 !important; }

.sidebar-scope nav button[data-domain="Revenue & Sales"] .sidebar-label,
.sidebar-scope nav button[data-domain="Revenue & Sales"] .sidebar-icon-wrap { color: #00f2fe !important; }

.sidebar-scope nav button[data-domain="Orders & Operations"] .sidebar-label,
.sidebar-scope nav button[data-domain="Orders & Operations"] .sidebar-icon-wrap { color: #38bdf8 !important; }

.sidebar-scope nav button[data-domain="Products & Inventory"] .sidebar-label,
.sidebar-scope nav button[data-domain="Products & Inventory"] .sidebar-icon-wrap { color: #a855f7 !important; }

.sidebar-scope nav button[data-domain="Pharmacy"] .sidebar-label,
.sidebar-scope nav button[data-domain="Pharmacy"] .sidebar-icon-wrap { color: #f97316 !important; }

.sidebar-scope nav button[data-domain="Veterinary Services"] .sidebar-label,
.sidebar-scope nav button[data-domain="Veterinary Services"] .sidebar-icon-wrap { color: #ec4899 !important; }

.sidebar-scope nav button[data-domain="Doctors"] .sidebar-label,
.sidebar-scope nav button[data-domain="Doctors"] .sidebar-icon-wrap { color: #06b6d4 !important; }

.sidebar-scope nav button[data-domain="Clinics & Hospitals"] .sidebar-label,
.sidebar-scope nav button[data-domain="Clinics & Hospitals"] .sidebar-icon-wrap { color: #8b5cf6 !important; }

.sidebar-scope nav button[data-domain="Customers 360°"] .sidebar-label,
.sidebar-scope nav button[data-domain="Customers 360°"] .sidebar-icon-wrap { color: #10b981 !important; }

.sidebar-scope nav button[data-domain="Pets 360°"] .sidebar-label,
.sidebar-scope nav button[data-domain="Pets 360°"] .sidebar-icon-wrap { color: #f59e0b !important; }

.sidebar-scope nav button[data-domain="Employees & HR"] .sidebar-label,
.sidebar-scope nav button[data-domain="Employees & HR"] .sidebar-icon-wrap { color: #6366f1 !important; }

.sidebar-scope nav button[data-domain="Finance & Accounting"] .sidebar-label,
.sidebar-scope nav button[data-domain="Finance & Accounting"] .sidebar-icon-wrap { color: #eab308 !important; }

.sidebar-scope nav button[data-domain="Marketing"] .sidebar-label,
.sidebar-scope nav button[data-domain="Marketing"] .sidebar-icon-wrap { color: #f43f5e !important; }

.sidebar-scope nav button[data-domain="Vendors & Procurement"] .sidebar-label,
.sidebar-scope nav button[data-domain="Vendors & Procurement"] .sidebar-icon-wrap { color: #14b8a6 !important; }

.sidebar-scope nav button[data-domain="Logistics & Delivery"] .sidebar-label,
.sidebar-scope nav button[data-domain="Logistics & Delivery"] .sidebar-icon-wrap { color: #3b82f6 !important; }

.sidebar-scope nav button[data-domain="Zenve Fashion"] .sidebar-label,
.sidebar-scope nav button[data-domain="Zenve Fashion"] .sidebar-icon-wrap { color: #d946ef !important; }

.sidebar-scope nav button[data-domain="B2B / Enterprise"] .sidebar-label,
.sidebar-scope nav button[data-domain="B2B & Enterprise"] .sidebar-label,
.sidebar-scope nav button[data-domain="B2B / Enterprise"] .sidebar-icon-wrap,
.sidebar-scope nav button[data-domain="B2B & Enterprise"] .sidebar-icon-wrap { color: #2563eb !important; }

.sidebar-scope nav button[data-domain="Import & Export"] .sidebar-label,
.sidebar-scope nav button[data-domain="Import & Export"] .sidebar-icon-wrap { color: #0284c7 !important; }

.sidebar-scope nav button[data-domain="Subscriptions"] .sidebar-label,
.sidebar-scope nav button[data-domain="Subscriptions"] .sidebar-icon-wrap { color: #8b5cf6 !important; }

.sidebar-scope nav button[data-domain="Reports & Analytics"] .sidebar-label,
.sidebar-scope nav button[data-domain="Reports & Analytics"] .sidebar-icon-wrap { color: #38bdf8 !important; }

.sidebar-scope nav button[data-domain="AI Assistant"] .sidebar-label,
.sidebar-scope nav button[data-domain="AI Assistant"] .sidebar-icon-wrap { color: #a855f7 !important; }

.sidebar-scope nav button[data-domain="Alerts & Notifications"] .sidebar-label,
.sidebar-scope nav button[data-domain="Alerts & Notifications"] .sidebar-icon-wrap { color: #ef4444 !important; }

.sidebar-scope nav button[data-domain="Audit & Compliance"] .sidebar-label,
.sidebar-scope nav button[data-domain="Audit & Compliance"] .sidebar-icon-wrap { color: #64748b !important; }

.sidebar-scope nav button[data-domain="System Health"] .sidebar-label,
.sidebar-scope nav button[data-domain="System Health"] .sidebar-icon-wrap { color: #10b981 !important; }

.sidebar-scope nav button[data-domain="Settings"] .sidebar-label,
.sidebar-scope nav button[data-domain="Settings"] .sidebar-icon-wrap { color: #94a3b8 !important; }