/* =====================================================================
   لاله ۴ — تم «نئون آبی»: شیشه سرمه‌ای با لبه‌های فیروزه‌ای درخشان
   روی حالت تیره سوار می‌شود (data-theme='dark' + data-skin='neon')
   ===================================================================== */
:root[data-skin='neon'] {
  /* دیوار فرماندهی */
  --w-bg: #030a1f; --w-bg-2: #0a1d4d; --w-chrome: #050f2b;
  --w-tile: rgba(10, 30, 78, 0.62); --w-tile-2: rgba(36, 86, 170, 0.22);
  --w-line: rgba(64, 196, 255, 0.24); --w-line-2: rgba(120, 190, 255, 0.1);
  --w-ink: #eef7ff; --w-dim: #a3c6ec; --w-faint: #7398c4;
  --w-track: rgba(110, 170, 255, 0.13); --w-grid: rgba(110, 170, 255, 0.09);
  --w-zone: rgba(80, 160, 255, 0.05); --w-future: rgba(80, 160, 255, 0.04);
  --w-mark: rgba(64, 220, 255, 0.55); --w-pulse: #ff4d8d;
  --w-gold: #ffcc4d; --w-gold-2: #ffe39a;
  --w-a1: #22e1ff; --w-a2: #4f8dff; --w-a3: #ff5fb1; --w-a4: #b07cff; --w-a5: #ffcc4d; --w-a6: #42f5b0;
  --w-good: #2ef2a6; --w-ok: #a6f36b; --w-warn: #ffb547; --w-bad: #ff4d7d; --w-ready: #1d5ab8;
  --w-on-accent: #031026;
  --w-shadow: 0 0 0 1px rgba(64, 196, 255, 0.05), 0 18px 40px -22px rgba(0, 120, 255, 0.55);
  --k1: #22e1ff; --k2: #4f8dff; --k3: #2ef2a6; --k4: #b07cff;
  --k5: #ff5fd0; --k6: #ffcc4d; --k7: #ff4d7d; --k8: #8cf56b;
  --neon: #22e1ff; --neon-2: #4f8dff;

  /* ماژول‌های کامل */
  --bg: #061233; --bg-deep: #040c26; --surface: #0b1d47; --surface-2: #0f2556; --surface-3: #142d66;
  --line: #1c3b78; --line-strong: #2b5299;
  --ink: #eaf4ff; --ink-2: #bdd4f0; --muted: #8eaad2; --faint: #6984ad;
  --turq: #22d3ff; --turq-strong: #86ecff; --turq-tint: #0d2f5c; --turq-soft: #154a85;
  --brass: #ff6fb6; --brass-strong: #ff9ccc; --brass-tint: #3a1840;
  --pom: #ff5a83; --pom-tint: #3d1630; --leaf: #2ef2a6; --leaf-tint: #0c3340;
  --amber: #ffbf47; --amber-tint: #3a2c15;
  --deep: #0a2257; --deep-2: #0f2d70;
  --rail: #07153a; --rail-2: #0d1f4d; --rail-ink: #d8e8ff; --rail-faint: #7c97c2;
  --gold: #ffcc4d; --gold-soft: #ffe39a; --gold-tint: #2c2a3a;
  --chrome: #050f2b; --chrome-2: #0a1a45;
  --marble: none;
  --shadow: 0 0 0 1px rgba(64, 196, 255, 0.06), 0 14px 34px -18px rgba(0, 110, 255, 0.5);
}

/* ---------- پس‌زمینه: شفق آبی و صورتی با شبکه ظریف ---------- */
:root[data-skin='neon'] body { background: var(--w-bg); }
:root[data-skin='neon'] .wx-app {
  background:
    radial-gradient(45% 40% at 5% 0%, rgba(34, 225, 255, 0.2), transparent 70%),
    radial-gradient(45% 50% at 100% 100%, rgba(255, 95, 208, 0.16), transparent 70%),
    radial-gradient(50% 45% at 60% 45%, rgba(79, 141, 255, 0.14), transparent 70%),
    repeating-linear-gradient(0deg, rgba(110, 170, 255, 0.035) 0 1px, transparent 1px 44px),
    repeating-linear-gradient(90deg, rgba(110, 170, 255, 0.035) 0 1px, transparent 1px 44px),
    linear-gradient(160deg, #071640 0%, #030a1f 55%, #0a0a2e 100%);
}

/* ---------- سربرگ و داک ---------- */
:root[data-skin='neon'] .wx-bar { background: linear-gradient(90deg, rgba(4, 14, 44, 0.92), rgba(12, 38, 98, 0.92) 50%, rgba(4, 14, 44, 0.92)); border-bottom-color: rgba(34, 225, 255, 0.28); backdrop-filter: blur(12px); }
:root[data-skin='neon'] .wx-bar::after { background: linear-gradient(90deg, transparent, var(--neon) 25%, #ff5fd0 50%, var(--neon) 75%, transparent); opacity: 0.85; box-shadow: 0 0 12px var(--neon); }
:root[data-skin='neon'] .wx-tabs { background: rgba(3, 12, 40, 0.6); border-color: rgba(34, 225, 255, 0.2); }
:root[data-skin='neon'] .wx-tab { color: #a3c6ec; }
:root[data-skin='neon'] .wx-tab[aria-current='page'] { background: linear-gradient(135deg, #1f6bff, var(--neon)); color: #fff; box-shadow: 0 0 18px -2px rgba(34, 225, 255, 0.7); }
:root[data-skin='neon'] .wx-acts .icon-btn { background: rgba(34, 225, 255, 0.07); border-color: rgba(34, 225, 255, 0.25); }
:root[data-skin='neon'] .wx-acts .icon-btn:hover { background: rgba(34, 225, 255, 0.18); border-color: var(--neon); box-shadow: 0 0 14px -3px var(--neon); }
:root[data-skin='neon'] .wx-acts .ask-btn { background: linear-gradient(135deg, #7b4dff, #ff5fd0); color: #fff; box-shadow: 0 0 18px -4px #ff5fd0; }
:root[data-skin='neon'] .wx-bar .property-btn { background: rgba(34, 225, 255, 0.07); border-color: rgba(34, 225, 255, 0.22); }
:root[data-skin='neon'] .wx-bar .property-btn .p-ic { background: rgba(34, 225, 255, 0.16); color: var(--neon); }
:root[data-skin='neon'] .wx-bar .property-menu { background: #0a1a45; }
:root[data-skin='neon'] .wx-meta small, :root[data-skin='neon'] .wx-pagetitle span { color: #7fa3cf; }
:root[data-skin='neon'] .wx-back:hover { border-color: var(--neon); }
:root[data-skin='neon'] .wx-dock { background: rgba(4, 13, 40, 0.88); border-top-color: rgba(34, 225, 255, 0.22); backdrop-filter: blur(12px); }
:root[data-skin='neon'] .dock-btn { color: #93b4dc; }
:root[data-skin='neon'] .dock-btn:hover { background: rgba(34, 225, 255, 0.1); }
:root[data-skin='neon'] .dock-btn[aria-current='page'] { background: rgba(34, 225, 255, 0.16); color: #9ff0ff; }
:root[data-skin='neon'] .dock-lab { color: #5a7bab; }

/* ---------- کاشی‌ها و شاخص‌ها: شیشه با لبه نئونی ---------- */
:root[data-skin='neon'] .wtile,
:root[data-skin='neon'] .kchip { backdrop-filter: blur(10px) saturate(1.3); }
:root[data-skin='neon'] .wtile {
  border-color: color-mix(in srgb, var(--ac) 42%, transparent);
  background:
    radial-gradient(70% 60% at 100% 0%, color-mix(in srgb, var(--ac) 16%, transparent), transparent 70%),
    linear-gradient(180deg, rgba(16, 44, 108, 0.55), rgba(6, 20, 58, 0.7));
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--ac) 25%, transparent), 0 0 24px -12px var(--ac);
}
:root[data-skin='neon'] .kchip {
  border-color: color-mix(in srgb, var(--ac) 60%, transparent);
  background:
    radial-gradient(130% 120% at 100% 0%, color-mix(in srgb, var(--ac) 30%, transparent), transparent 62%),
    linear-gradient(165deg, rgba(18, 48, 116, 0.7), rgba(6, 20, 58, 0.8) 75%);
  box-shadow: 0 0 22px -8px var(--ac), inset 0 1px 0 color-mix(in srgb, var(--ac) 35%, transparent);
}
:root[data-skin='neon'] .kc-ic { color: #fff; background: radial-gradient(circle at 35% 30%, color-mix(in srgb, var(--ac) 45%, #fff), var(--ac) 55%, color-mix(in srgb, var(--ac) 60%, #000)); border-radius: 50%; box-shadow: 0 0 16px -2px var(--ac); }
:root[data-skin='neon'] .kc-val { text-shadow: 0 0 22px color-mix(in srgb, var(--ac) 70%, transparent); }
:root[data-skin='neon'] .wt-ic { border-radius: 50%; }
:root[data-skin='neon'] .walert li { background: rgba(20, 50, 120, 0.35); }

/* ---------- لایه عمیق ---------- */
:root[data-skin='neon'] .deep { background: rgba(2, 8, 28, 0.72); }
:root[data-skin='neon'] .deep-card { background: linear-gradient(170deg, #0b2058, #050f2e); border-color: rgba(34, 225, 255, 0.3); box-shadow: 0 0 60px -20px rgba(34, 225, 255, 0.5), 0 40px 90px -30px #000; }
:root[data-skin='neon'] .deep-head { background: linear-gradient(90deg, #071a4d, #0f2f78); }
:root[data-skin='neon'] .dh-ic { background: rgba(34, 225, 255, 0.16); color: var(--neon); }
:root[data-skin='neon'] .dh-t p { color: #9fbfe6; }
:root[data-skin='neon'] .dbtn:hover { border-color: var(--neon); background: rgba(34, 225, 255, 0.12); }

/* ---------- صفحه بارگذاری ---------- */
:root[data-skin='neon'] .wboot { background: radial-gradient(55% 60% at 50% 55%, #0c2152 0%, #061436 50%, #020818 100%); }
:root[data-skin='neon'] .wboot-bar i { background: linear-gradient(90deg, #4f8dff, var(--neon), #ff5fd0); }
:root[data-skin='neon'] .wb-photo { filter: drop-shadow(0 0 50px rgba(34, 225, 255, 0.14)); }

/* ---------- ماژول‌های کامل ---------- */
:root[data-skin='neon'] .wx-stage.page-mode {
  background:
    radial-gradient(40% 40% at 0% 0%, rgba(34, 225, 255, 0.1), transparent 70%),
    radial-gradient(40% 40% at 100% 100%, rgba(255, 95, 208, 0.08), transparent 70%),
    var(--bg);
}
:root[data-skin='neon'] .panel, :root[data-skin='neon'] .card { border-color: rgba(64, 196, 255, 0.2); }

/* =====================================================================
   انتخاب تم
   ===================================================================== */
.look-wrap { position: relative; }
.look-menu {
  position: absolute; top: calc(100% + 8px); inset-inline-end: 0; z-index: 90; width: 236px; padding: 6px;
  display: grid; gap: 4px; border-radius: 14px; background: #0d1a22; border: 1px solid rgba(255, 255, 255, 0.14);
  box-shadow: 0 24px 50px -16px rgba(0, 0, 0, 0.85);
}
.look-menu[hidden] { display: none; }
:root[data-skin='neon'] .look-menu { background: #0a1a45; border-color: rgba(34, 225, 255, 0.3); }
.look-menu h4 { font-size: 11px; color: #8ea5a0; padding: 4px 8px 2px; font-weight: 600; margin: 0; }
.look-opt { display: flex; align-items: center; gap: 10px; padding: 7px 8px; border: 1px solid transparent; border-radius: 10px; background: transparent; color: #eef3f1; font-size: 12.5px; font-weight: 700; text-align: start; }
.look-opt:hover { background: rgba(255, 255, 255, 0.07); }
.look-opt[aria-checked='true'] { border-color: rgba(255, 255, 255, 0.28); background: rgba(255, 255, 255, 0.06); }
.look-opt small { display: block; font-size: 10.5px; font-weight: 500; color: #9db1ad; }
.look-opt .tick { margin-inline-start: auto; width: 16px; height: 16px; opacity: 0; color: #2ef2a6; }
.look-opt[aria-checked='true'] .tick { opacity: 1; }
.look-sw { width: 40px; height: 26px; border-radius: 8px; flex: none; border: 1px solid rgba(255, 255, 255, 0.2); }
.look-sw.neon { background: linear-gradient(135deg, #22e1ff 0 30%, #4f8dff 30% 55%, #ff5fd0 55% 78%, #071640 78%); box-shadow: 0 0 12px -2px #22e1ff; }
.look-sw.emerald { background: linear-gradient(135deg, #22d3a0 0 30%, #f7c04a 30% 55%, #38bdf8 55% 78%, #0f1a20 78%); }
.look-sw.light { background: linear-gradient(135deg, #059669 0 30%, #b7791f 30% 55%, #0284c7 55% 78%, #f1f2ee 78%); }