/* ==========================================================================
   Sky Theme — white + sky blue redesign (UI only, no logic).
   Loaded LAST on admin panel, login and store pages. Overrides tokens only
   plus light component polish; no ids/selectors used by JS are changed.
   ========================================================================== */

/* ---------- Admin panel: light (default) ---------- */
html[data-theme="light"],
html:not([data-theme]) {
  color-scheme: light;
  --bg: #f4f9fe;
  --bg-elev: #ffffff;
  --surface: #ffffff;
  --surface-2: #f2f8fd;
  --surface-3: #e8f3fc;
  --border: #dbeaf6;
  --border-strong: #c2dcf0;
  --ring: rgba(14, 165, 233, .35);
  --input: #ffffff;
  --sidebar: #ffffff;
  --sidebar-border: #e2eef8;
  --text: #0f2a44;
  --text-muted: #4f6b85;
  --text-dim: #7d93a8;
  --primary: #0ea5e9;
  --primary-hover: #0284c7;
  --primary-active: #0369a1;
  --primary-fg: #ffffff;
  --primary-soft: rgba(14, 165, 233, .12);
  --accent: #38bdf8;
  --info: #0ea5e9;
  --shadow-xs: 0 1px 2px rgba(14, 60, 110, .05);
  --shadow-sm: 0 2px 6px rgba(14, 60, 110, .06);
  --shadow-md: 0 8px 24px -8px rgba(14, 90, 160, .14);
  --shadow-pop: 0 20px 50px -12px rgba(14, 90, 160, .22);
  --radius: 12px;
  --radius-md: 14px;
  --radius-lg: 18px;
}

/* ---------- Admin panel: dark ---------- */
html[data-theme="dark"] {
  color-scheme: dark;
  --bg: #071321;
  --bg-elev: #0a1a2c;
  --surface: #0d2034;
  --surface-2: #11283f;
  --surface-3: #15304b;
  --border: #1a3550;
  --border-strong: #24476a;
  --ring: rgba(56, 189, 248, .4);
  --input: #0f243a;
  --sidebar: #08182a;
  --sidebar-border: #142c45;
  --text: #e6f2fc;
  --text-muted: #9cb6cc;
  --text-dim: #6f8aa3;
  --primary: #38bdf8;
  --primary-hover: #0ea5e9;
  --primary-active: #0284c7;
  --primary-fg: #04162a;
  --primary-soft: rgba(56, 189, 248, .14);
  --accent: #7dd3fc;
  --info: #38bdf8;
  --shadow-md: 0 8px 24px -8px rgba(0, 0, 0, .45);
  --shadow-pop: 0 20px 50px -12px rgba(0, 0, 0, .6);
  --radius: 12px;
  --radius-md: 14px;
  --radius-lg: 18px;
}

/* ---------- Store: light ---------- */
html:root,
html:root[data-theme="white-blue"],
html:root[data-theme="light"] {
  --bg-canvas: #f4f9fe;
  --bg-surface: #ffffff;
  --bg-card: #ffffff;
  --bg-card-inner: #f2f8fd;
  --bg-hover: #e8f3fc;
  --bg-subtle: #f0f7fd;
  --bg-glass: rgba(255, 255, 255, .82);
  --border-color: #dbeaf6;
  --border-strong: #c2dcf0;
  --border-focus: #0ea5e9;
  --border-glass: rgba(14, 165, 233, .14);
  --border-glow: rgba(14, 165, 233, .3);
  --text-main: #0f2a44;
  --text-sub: #34506b;
  --text-muted: #5b7690;
  --text-dim: #6b8196;
  --brand-primary: #0278b8;
  --brand-accent: #38bdf8;
  --brand-hover: #0284c7;
  --brand-light: rgba(14, 165, 233, .08);
  --brand-light-hover: rgba(14, 165, 233, .15);
  --brand-gradient: linear-gradient(135deg, #0b94d9 0%, #0278b8 55%, #03659c 100%);
  --brand-gradient-hover: linear-gradient(135deg, #0a8bcc 0%, #026fab 55%, #035a8b 100%);
  --brand-glow: 0 10px 28px -10px rgba(14, 165, 233, .55);
  --btn-primary: #0278b8;
  --btn-primary-hover: #03659c;
  --hero-bg: linear-gradient(160deg, #e0f2fe 0%, #f4f9fe 60%, #ffffff 100%);
  --ksv-store-chrome-gradient: linear-gradient(180deg, #0c4a6e 0%, #075985 55%, #0369a1 100%);
  --ksv-store-chrome-border: rgba(125, 211, 252, .35);
  --ksv-store-chrome-shadow: 0 10px 30px -12px rgba(3, 105, 161, .45), inset 0 1px 0 rgba(255, 255, 255, .1);
}

/* ---------- Store: dark ---------- */
html:root[data-theme="dark"],
html:root[data-theme="dark-mode"],
html body.dark-mode {
  --bg-canvas: #071321;
  --bg-surface: #0a1a2c;
  --bg-card: #0d2034;
  --bg-card-inner: #11283f;
  --bg-hover: #15304b;
  --bg-subtle: #0c1e31;
  --bg-glass: rgba(10, 26, 44, .82);
  --border-color: #1a3550;
  --border-strong: #24476a;
  --border-focus: #38bdf8;
  --text-main: #e6f2fc;
  --text-sub: #c0d5e6;
  --text-muted: #9cb6cc;
  --text-dim: #6f8aa3;
  --brand-primary: #38bdf8;
  --brand-accent: #7dd3fc;
  --brand-hover: #0ea5e9;
  --brand-light: rgba(56, 189, 248, .14);
  --brand-light-hover: rgba(56, 189, 248, .24);
  --brand-gradient: linear-gradient(135deg, #38bdf8 0%, #0284c7 100%);
  --brand-gradient-hover: linear-gradient(135deg, #7dd3fc 0%, #0ea5e9 100%);
  --btn-primary: #38bdf8;
  --btn-primary-hover: #0ea5e9;
  --hero-bg: linear-gradient(160deg, #0b2440 0%, #071321 70%);
  --ksv-store-chrome-border: #1a3550;
}

/* ---------- Typography (Kurdish / Arabic first) ---------- */
html[dir="rtl"] body,
html[dir="rtl"] button,
html[dir="rtl"] input,
html[dir="rtl"] select,
html[dir="rtl"] textarea {
  font-family: "Vazirmatn", "Plus Jakarta Sans", system-ui, sans-serif;
}
body { line-height: 1.65; -webkit-font-smoothing: antialiased; }

/* ---------- Shared polish ---------- */
::selection { background: rgba(14, 165, 233, .22); }

button, .btn, a.btn, input, select, textarea {
  transition: background-color .18s ease, border-color .18s ease, box-shadow .18s ease, color .18s ease, transform .18s ease;
}
.btn:active, button:active { transform: translateY(1px); }

input:focus-visible, select:focus-visible, textarea:focus-visible,
button:focus-visible, a:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(14, 165, 233, .28);
}

.card, .panel, .ksv-card-surface {
  border-radius: var(--radius-lg, 18px);
}

table thead th {
  letter-spacing: .01em;
}
table tbody tr { transition: background-color .15s ease; }

/* Sidebar active item: soft sky pill */
.sidebar a.active, .sidebar .active > a, .nav-item.active, .sidebar-link.active {
  background: var(--primary-soft);
  color: var(--primary-hover);
}
html[data-theme="dark"] .sidebar a.active,
html[data-theme="dark"] .nav-item.active,
html[data-theme="dark"] .sidebar-link.active { color: var(--primary); }

/* Scrollbars */
* { scrollbar-width: thin; scrollbar-color: rgba(14, 165, 233, .35) transparent; }
*::-webkit-scrollbar { width: 8px; height: 8px; }
*::-webkit-scrollbar-thumb { background: rgba(14, 165, 233, .3); border-radius: 8px; }

/* Mobile comfort */
@media (max-width: 640px) {
  input, select, textarea { font-size: 16px; }
  .btn, button { min-height: 42px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; animation: none !important; }
}

/* ==========================================================================
   STORE REDESIGN v2 — light glass header, sky ticker, light footer
   (light theme only; dark theme keeps deep-navy chrome)
   ========================================================================== */
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) body:not(.dark-mode) {
  --sky-50: #f0f9ff; --sky-100: #e0f2fe; --sky-200: #bae6fd; --sky-300: #7dd3fc;
  --sky-500: #0ea5e9; --sky-600: #0284c7; --sky-700: #0369a1; --ink: #0f2a44; --ink-2: #4f6b85;
}

/* Header */
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .header-sticky#ksv-header {
  background: rgba(255, 255, 255, .88) !important;
  border-bottom: 1px solid #e2eef8 !important;
  box-shadow: 0 8px 24px -18px rgba(3, 105, 161, .35) !important;
}
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .header-sticky#ksv-header::before,
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .header-sticky#ksv-header::after { display: none !important; }
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .header-sticky#ksv-header .brand-name { color: var(--ink) !important; background: none !important; -webkit-text-fill-color: currentColor !important; }
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .header-sticky#ksv-header .brand-slogan { color: var(--ink-2) !important; }
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .header-sticky#ksv-header .brand-logo-image-frame { box-shadow: 0 0 0 1px #e2eef8 !important; }

html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .header-sticky#ksv-header .nav-menu-bar {
  background: var(--sky-50) !important; border: 1px solid #e2eef8 !important; box-shadow: none !important;
}
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .header-sticky#ksv-header .nav-menu-link {
  color: var(--ink-2) !important; background: transparent !important; box-shadow: none !important; border-color: transparent !important;
}
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .header-sticky#ksv-header .nav-menu-link:hover { color: var(--sky-700) !important; background: #fff !important; }
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .header-sticky#ksv-header .nav-menu-link.active {
  color: #fff !important; background: linear-gradient(135deg, #0b94d9, #0278b8 55%, #03659c) !important;
  box-shadow: 0 6px 16px -8px rgba(2, 132, 199, .7) !important;
}
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .header-sticky#ksv-header .nav-menu-link svg,
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .header-sticky#ksv-header .nav-menu-ico { color: inherit !important; }

html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .header-sticky#ksv-header .nav-search-bar {
  background: var(--sky-50) !important; border: 1px solid #dbeaf6 !important; box-shadow: none !important;
}
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .header-sticky#ksv-header .nav-search-bar:focus-within { background: #fff !important; border-color: var(--sky-300) !important; box-shadow: 0 0 0 4px rgba(14,165,233,.12) !important; }
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .header-sticky#ksv-header .ksv-search-input { color: var(--ink) !important; }
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .header-sticky#ksv-header .ksv-search-input::placeholder { color: #8399ad !important; }
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .header-sticky#ksv-header .nav-search-bar svg { color: var(--sky-600) !important; }
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .header-sticky#ksv-header .nav-search-shortcut {
  background: #fff !important; color: var(--ink-2) !important; border: 1px solid #dbeaf6 !important;
}

html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .header-sticky#ksv-header .icon-circle-btn {
  background: #fff !important; border: 1px solid #dbeaf6 !important; color: var(--sky-700) !important; box-shadow: none !important;
}
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .header-sticky#ksv-header .icon-circle-btn:hover { background: var(--sky-50) !important; border-color: var(--sky-300) !important; }
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .header-sticky#ksv-header .lang-icon-text { color: var(--sky-700) !important; }
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .header-sticky#ksv-header .btn-auth-nav {
  background: linear-gradient(135deg, #0b94d9, #0278b8 55%, #03659c) !important; color: #fff !important; border: 0 !important;
  box-shadow: 0 8px 20px -10px rgba(2, 132, 199, .8) !important;
}
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .header-sticky#ksv-header .user-profile-pill { background: var(--sky-50) !important; border: 1px solid #dbeaf6 !important; color: var(--ink) !important; }
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .header-sticky#ksv-header .user-name-text { color: var(--ink) !important; }

/* VIP ticker bar */
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .ksv-vip-ticker-bar {
  background: linear-gradient(90deg, #03659c, #0278b8 50%, #0b8fd2) !important; border: 0 !important; box-shadow: none !important;
}
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .ksv-vip-ticker-bar * { border-color: rgba(255,255,255,.25) !important; }
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .ksv-vip-ticker-bar .ticker-static-text { color: #fff !important; }
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .ksv-vip-ticker-bar .ticker-compact-pill-wrap { background: rgba(255,255,255,.12) !important; box-shadow: none !important; }
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .ksv-vip-ticker-bar .ticker-badge-capsule { background: #fff !important; color: var(--sky-700) !important; box-shadow: none !important; }
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .ksv-vip-ticker-bar .ticker-badge-label { color: var(--sky-700) !important; }
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .ksv-vip-ticker-bar .ticker-action-pill { background: rgba(255,255,255,.18) !important; color: #fff !important; }
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .ksv-vip-ticker-bar .ticker-action-lbl,
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .ksv-vip-ticker-bar .ticker-dismiss-btn { color: #fff !important; }

/* ==========================================================================
   PANEL REDESIGN v2 — one brand color (sky) everywhere
   ========================================================================== */
html .telegram-app {
  --tg-accent: #0ea5e9;
  --tg-accent-2: #38bdf8;
}
html .telegram-app .tg-hero {
  background:
    radial-gradient(circle at 12% 0%, rgba(125, 211, 252, .35), transparent 40%),
    linear-gradient(135deg, #075985 0%, #0369a1 55%, #0284c7 100%) !important;
  border-color: rgba(125, 211, 252, .35) !important;
}
html .telegram-app .tg-hero p { color: rgba(240, 249, 255, .85) !important; }
html .telegram-app .tg-hero .tg-kicker { color: #bae6fd !important; }

/* Primary/green "add" actions in panel → sky (success badges stay green) */
html .stock-premium .btn-primary,
html .btn.btn-primary,
html button.btn-primary,
html a.btn-primary {
  background: linear-gradient(135deg, #0b94d9, #0278b8 55%, #03659c) !important;
  border-color: transparent !important;
  color: #fff !important;
  box-shadow: 0 8px 20px -10px rgba(2, 132, 199, .75) !important;
}
html .btn.btn-primary:hover { background: linear-gradient(135deg, #0284c7, #0369a1) !important; }

/* Page hero cards in panel: soft sky glow instead of green */
html[data-theme="light"] .page-hero,
html[data-theme="light"] .stock-hero,
html[data-theme="light"] .royal-hero {
  background: linear-gradient(135deg, #ffffff 0%, #f0f9ff 100%) !important;
  border-color: #dbeaf6 !important;
}

/* ==========================================================================
   STORE PROMO POPUP — light sky card
   ========================================================================== */
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .ksv-promo-card {
  background: #ffffff !important; border: 1px solid #dbeaf6 !important;
  box-shadow: 0 30px 80px -20px rgba(3, 105, 161, .45) !important;
}
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .ksv-promo-media,
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .ksv-promo-default-art {
  background: radial-gradient(circle at 50% 0%, #7dd3fc 0%, #0ea5e9 45%, #0369a1 100%) !important;
}
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .ksv-promo-art-glow { background: radial-gradient(circle, rgba(255,255,255,.35), transparent 70%) !important; }
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .ksv-promo-art-sub { color: rgba(255,255,255,.9) !important; }
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .ksv-promo-badge-tag { background: rgba(255,255,255,.18) !important; border-color: rgba(255,255,255,.45) !important; color: #fff !important; }
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .ksv-promo-info { background: #ffffff !important; }
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .ksv-promo-title { color: #0f2a44 !important; }
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .ksv-promo-desc { color: #4f6b85 !important; }
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .ksv-promo-cta-btn {
  background: linear-gradient(135deg, #0b94d9, #0278b8 55%, #03659c) !important; color: #fff !important;
  box-shadow: 0 12px 28px -12px rgba(2, 132, 199, .8) !important; border: 0 !important;
}
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .ksv-promo-close-btn { background: rgba(255,255,255,.9) !important; color: #0369a1 !important; border: 0 !important; }
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .ksv-promo-timer-fill { stroke: #ffffff !important; }
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .ksv-promo-timer-badge { color: #fff !important; }

/* Stock: "all services" card + add button in brand sky */
html .stock-royal-card.is-all { --svc-color: #0ea5e9 !important; }
html .stock-royal-icon.is-all {
  background: color-mix(in oklab, #0ea5e9 16%, var(--surface)) !important;
  border-color: color-mix(in oklab, #0ea5e9 40%, transparent) !important;
}
html .btn.primary {
  background: linear-gradient(135deg, #0b94d9, #0278b8 55%, #03659c) !important;
  border-color: transparent !important; color: #fff !important;
  box-shadow: 0 8px 20px -10px rgba(2, 132, 199, .75) !important;
}
html .btn.primary:hover { background: linear-gradient(135deg, #0284c7, #0369a1) !important; }

/* ==========================================================================
   STORE MOBILE BOTTOM BAR — white glass, sky active
   ========================================================================== */
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) body .mobile-bottom-nav {
  background: rgba(255, 255, 255, .94) !important;
  border-top: 1px solid #e2eef8 !important;
  box-shadow: 0 -10px 30px -18px rgba(3, 105, 161, .35) !important;
  backdrop-filter: blur(18px) saturate(180%) !important;
}
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) body .mobile-bottom-nav .mobile-nav-item { color: #4f6b85 !important; }
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) body .mobile-bottom-nav .mobile-nav-label { color: #4f6b85 !important; }
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) body .mobile-bottom-nav .mobile-nav-icon-wrap {
  background: #f0f9ff !important; border: 1px solid #dbeaf6 !important; color: #0369a1 !important; box-shadow: none !important;
}
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) body .mobile-bottom-nav .mobile-nav-svg { color: #0369a1 !important; stroke: currentColor !important; }
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) body .mobile-bottom-nav .mobile-nav-item.active .mobile-nav-icon-wrap {
  background: linear-gradient(135deg, #0b94d9, #0278b8 55%, #03659c) !important; border-color: transparent !important; color: #fff !important;
  box-shadow: 0 8px 18px -8px rgba(2, 132, 199, .8) !important;
}
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) body .mobile-bottom-nav .mobile-nav-item.active .mobile-nav-svg { color: #fff !important; }
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) body .mobile-bottom-nav .mobile-nav-item.active .mobile-nav-label { color: #0369a1 !important; font-weight: 800 !important; }

/* ==========================================================================
   CUSTOMER AREA (profile, orders, warranty, settings) — sky active states
   ========================================================================== */
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .profile-tab-item.active,
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .sub-tab-pill.active,
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .order-filter-pill.active,
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .subs-toggle-btn.active {
  background: linear-gradient(135deg, #0b94d9, #0278b8 55%, #03659c) !important;
  color: #ffffff !important;
  border-color: transparent !important;
  box-shadow: 0 10px 22px -12px rgba(2, 132, 199, .85) !important;
}
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .profile-tab-item.active *,
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .sub-tab-pill.active *,
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .order-filter-pill.active * { color: #ffffff !important; }
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .profile-tab-item.active [class*="count"],
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .sub-tab-pill.active [class*="count"],
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .order-filter-pill.active [class*="count"] {
  background: rgba(255, 255, 255, .22) !important; color: #fff !important;
}
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .profile-tab-item:not(.active):hover,
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .sub-tab-pill:not(.active):hover,
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .order-filter-pill:not(.active):hover {
  background: #f0f9ff !important; color: #0369a1 !important;
}

/* Order cards */
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .ksv-act-btn.details {
  background: linear-gradient(135deg, #0b94d9, #0278b8 55%, #03659c) !important; color: #fff !important; border-color: transparent !important;
}
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .ksv-order-card.is-latest-order-highlight {
  border-color: #7dd3fc !important;
  box-shadow: 0 0 0 3px rgba(14, 165, 233, .12), 0 18px 40px -24px rgba(3, 105, 161, .45) !important;
}
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .ksv-order-card.is-latest-order-highlight > div:first-child {
  background: linear-gradient(90deg, #03659c, #0278b8 50%, #0b8fd2) !important;
}
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) body .profile-main-container [id^="tab-"] .sub-tab-pill.active,
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) body .profile-main-container #profile-tabs-bar .profile-tab-item.active {
  background: linear-gradient(135deg, #0b94d9, #0278b8 55%, #03659c) !important; color: #fff !important; border-color: transparent !important;
}
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) body .profile-main-container .sub-tab-pill.active .sub-pill-badge,
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) body .profile-main-container .order-filter-pill.active span[class],
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) body .profile-main-container .profile-tab-item.active [class*="badge"] {
  background: rgba(255, 255, 255, .25) !important; color: #ffffff !important;
}
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) body .profile-main-container .sub-pill-badge { background: #e0f2fe !important; color: #0369a1 !important; }
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) body #tab-subs .sub-tab-pill.active,
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) body #tab-orders .sub-tab-pill.active,
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) body #tab-warranty .sub-tab-pill.active,
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) body #tab-settings .sub-tab-pill.active {
  background: linear-gradient(135deg, #0b94d9, #0278b8 55%, #03659c) !important; color: #fff !important; border-color: transparent !important;
  box-shadow: 0 10px 22px -12px rgba(2, 132, 199, .85) !important;
}
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) body #tab-subs .sub-tab-pill.active .sub-pill-badge,
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) body #tab-orders .sub-tab-pill.active .sub-pill-badge,
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) body #tab-warranty .sub-tab-pill.active .sub-pill-badge,
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) body #tab-settings .sub-tab-pill.active .sub-pill-badge {
  background: rgba(255, 255, 255, .25) !important; color: #fff !important;
}
/* 2FA security card: deep sky instead of near-black */
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) body #ksv-2fa-panel {
  background: linear-gradient(145deg, #0c4a6e 0%, #075985 50%, #0369a1 100%) !important;
  border-color: rgba(125, 211, 252, .35) !important;
}
/* Mobile header icons readable on white */
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .header-sticky#ksv-header .notif-bell-icon,
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) .header-sticky#ksv-header .icon-circle-btn svg { color: #0369a1 !important; stroke: #0369a1 !important; }
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) body #tab-orders .order-filter-pill.active,
html:not([data-theme="dark"]):not([data-theme="dark-mode"]) body #tab-warranty .order-filter-pill.active {
  background: linear-gradient(135deg, #0b94d9, #0278b8 55%, #03659c) !important; color: #fff !important; border-color: transparent !important;
}