/* ==========================================================================
   dark-mode.css — لایهٔ حالت تاریک (Dark Mode)
   --------------------------------------------------------------------------
   با فعال‌شدن [data-theme="dark"] روی <html>، تمام رنگ‌های استفاده‌شده در
   پروژه (کلاس‌های یوتیلیتی Tailwind از tailwind.css و کلاس‌های سفارشی
   app.css) بازنویسی می‌شوند. حالت پیش‌فرض همیشه روشن است؛ این فایل تا وقتی
   data-theme="dark" ست نشود هیچ‌چیزی را تغییر نمی‌دهد.
   بارگذاری: بعد از fonts.css / tailwind.css / app.css.
   ========================================================================== */

/* ---------- 1) متغیرهای رنگی ---------- */
html[data-theme="dark"] {
  color-scheme: dark;

  --dm-bg: #0e0f16;
  --dm-surface: #171927;
  --dm-surface-2: #1e2133;
  --dm-surface-3: #262a3f;
  --dm-surface-hover: #232739;

  --dm-border: #2a2e42;
  --dm-border-strong: #3b3f5c;

  --dm-text-1: #f3f4f8;
  --dm-text-2: #d6d7e6;
  --dm-text-3: #b3b5cb;
  --dm-text-4: #9294ac;
  --dm-text-5: #73758e;
  --dm-text-6: #565971;

  --dm-brand: #a48bff;
  --dm-brand-strong: #c1adff;
  --dm-brand-soft-bg: #241e42;
  --dm-brand-soft-bg-hover: #2d2554;
  --dm-brand-ring: #4d4180;
  --dm-brand-gradient: linear-gradient(135deg, #8a5cf6, #7a3fe0 45%, #3d97f5);

  --dm-iris: #7cc2ff;
  --dm-iris-soft-bg: #142236;

  --dm-red: #ff9aa2;
  --dm-red-soft-bg: #391520;
  --dm-red-ring: #5c2432;

  --dm-amber: #ffcf70;
  --dm-amber-soft-bg: #392b10;
  --dm-amber-ring: #5c471d;

  --dm-emerald: #7de9bd;
  --dm-emerald-soft-bg: #0f2e25;
  --dm-emerald-ring: #1f4c3c;

  --dm-sky: #82d4fd;
  --dm-sky-soft-bg: #102636;
  --dm-sky-ring: #1e3f55;

  --dm-shadow-color: rgba(0, 0, 0, .55);
}

/* ---------- 2) پایه ---------- */
html[data-theme="dark"] body {
  background-color: var(--dm-bg) !important;
  color: var(--dm-text-2) !important;
}
html[data-theme="dark"] body {
  transition: background-color .2s ease, color .2s ease;
}
html[data-theme="dark"] ::selection { background: var(--dm-brand-ring); color: #fff; }
html[data-theme="dark"] ::-webkit-scrollbar-thumb { background: var(--dm-surface-3); }
html[data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: var(--dm-border-strong); }

/* ---------- 3) لایوت ---------- */
html[data-theme="dark"] aside.lg\:flex {
  background-color: var(--dm-surface) !important;
  border-color: var(--dm-border) !important;
}
html[data-theme="dark"] header.sticky {
  background-color: rgba(23, 25, 39, .85) !important;
  border-color: var(--dm-border) !important;
}
html[data-theme="dark"] .x-tabbar {
  background: rgba(20, 21, 32, .92) !important;
  border-top-color: var(--dm-border) !important;
  box-shadow: 0 -10px 30px -14px rgba(0, 0, 0, .6);
}
html[data-theme="dark"] .x-tab { color: var(--dm-text-4); }
html[data-theme="dark"] .x-tab.is-active { background: var(--dm-brand-soft-bg); color: var(--dm-brand-strong); }
html[data-theme="dark"] .x-nbadge { box-shadow: 0 0 0 2px var(--dm-surface); }
html[data-theme="dark"] .x-badge { box-shadow: 0 0 0 2px var(--dm-surface); }
html[data-theme="dark"] .x-tabbar--tabs {
  border-color: var(--dm-border) !important;
  background: rgba(23, 25, 39, .92) !important;
  box-shadow: 0 10px 30px -16px rgba(0, 0, 0, .6);
}
html[data-theme="dark"] .x-sheet-backdrop { background: rgba(0, 0, 0, .55); }
html[data-theme="dark"] .x-sheet {
  background: var(--dm-surface) !important;
  box-shadow: 0 -20px 60px -20px rgba(0, 0, 0, .7);
}
html[data-theme="dark"] .x-sheet-grip { background: var(--dm-border-strong); }
html[data-theme="dark"] .x-sheet-title { color: var(--dm-text-1); }
html[data-theme="dark"] .x-sheet-user { background: var(--dm-surface-2); color: var(--dm-text-2); }
html[data-theme="dark"] .x-sheet-item { background: var(--dm-surface-2); color: var(--dm-text-3); }
html[data-theme="dark"] .x-sheet-item.is-active { background: var(--dm-brand-soft-bg); border-color: var(--dm-brand-ring); color: var(--dm-brand-strong); }
html[data-theme="dark"] .x-sheet-item--danger { background: var(--dm-red-soft-bg); color: var(--dm-red); }

/* دکمه‌های رمز/خروج هدر */
html[data-theme="dark"] .x-hdr-btn { background: var(--dm-surface-2); color: var(--dm-text-3); }
html[data-theme="dark"] .x-hdr-btn:hover { background: var(--dm-brand-soft-bg); color: var(--dm-brand-strong); }
html[data-theme="dark"] .x-hdr-btn--danger:hover { background: var(--dm-red-soft-bg); color: var(--dm-red); }
html[data-theme="dark"] .x-hdr-name { color: var(--dm-text-3); }

/* ---------- 4) کامپوننت‌ها ---------- */
html[data-theme="dark"] .panel {
  background-color: var(--dm-surface) !important;
  box-shadow: 0 0 0 1px var(--dm-border), 0 10px 28px -14px var(--dm-shadow-color) !important;
}
html[data-theme="dark"] .panel-title { color: var(--dm-text-1) !important; }
html[data-theme="dark"] .panel-subtitle { color: var(--dm-text-5) !important; }
html[data-theme="dark"] .x-section-title { color: var(--dm-text-1) !important; }
html[data-theme="dark"] .icon-chip { box-shadow: 0 0 0 1px var(--dm-border); }

/* دکمه‌ها */
html[data-theme="dark"] .btn-primary { background-image: var(--dm-brand-gradient); }
html[data-theme="dark"] .btn-secondary {
  background-color: var(--dm-surface-2) !important;
  color: var(--dm-text-2) !important;
  box-shadow: 0 0 0 1px var(--dm-border) !important;
}
html[data-theme="dark"] .btn-secondary:hover { background-color: var(--dm-surface-3) !important; }
html[data-theme="dark"] .btn-soft-brand {
  background-color: var(--dm-brand-soft-bg) !important;
  color: var(--dm-brand-strong) !important;
  box-shadow: 0 0 0 1px var(--dm-brand-ring) !important;
}
html[data-theme="dark"] .btn-soft-brand:hover { background-color: var(--dm-brand-soft-bg-hover) !important; }
html[data-theme="dark"] .btn-danger {
  background-color: var(--dm-red-soft-bg) !important;
  color: var(--dm-red) !important;
}
html[data-theme="dark"] .btn-danger:hover { background-color: var(--dm-red-ring) !important; }

/* فیلدهای فرم */
html[data-theme="dark"] .field-label { color: var(--dm-text-3) !important; }
html[data-theme="dark"] .field-input {
  background-color: var(--dm-surface-2) !important;
  color: var(--dm-text-1) !important;
  box-shadow: inset 0 0 0 1px var(--dm-border) !important;
}
html[data-theme="dark"] .field-input::placeholder { color: var(--dm-text-6) !important; }
html[data-theme="dark"] .field-input:hover { box-shadow: inset 0 0 0 1px var(--dm-border-strong) !important; }
html[data-theme="dark"] .field-input:focus {
  background-color: var(--dm-surface-3) !important;
  box-shadow: inset 0 0 0 2px var(--dm-brand) !important;
}
html[data-theme="dark"] .x-pw-eye { color: var(--dm-text-5); }
html[data-theme="dark"] .x-pw-eye:hover { color: var(--dm-brand-strong); background: var(--dm-brand-soft-bg); }

/* جدول‌ها */
html[data-theme="dark"] .table-wrap { box-shadow: 0 0 0 1px var(--dm-border) !important; }
html[data-theme="dark"] .table-base thead { background-color: var(--dm-surface-2) !important; color: var(--dm-text-4) !important; }
html[data-theme="dark"] .table-base tbody tr { border-color: var(--dm-border) !important; }
html[data-theme="dark"] .table-base tbody tr:hover { background-color: var(--dm-surface-hover) !important; }
html[data-theme="dark"] .table-wrap:has(.x-cards) { box-shadow: none !important; }
html[data-theme="dark"] .x-cards tr {
  background-color: var(--dm-surface) !important;
  box-shadow: 0 0 0 1px var(--dm-border), 0 6px 16px -10px var(--dm-shadow-color) !important;
}
html[data-theme="dark"] .x-cards td + td { border-top-color: var(--dm-border) !important; }
html[data-theme="dark"] .x-cards td::before { color: var(--dm-text-5) !important; }

/* نشان‌ها (Badges) */
html[data-theme="dark"] .badge-slate { background-color: var(--dm-surface-2) !important; color: var(--dm-text-3) !important; box-shadow: inset 0 0 0 1px var(--dm-border) !important; }
html[data-theme="dark"] .badge-amber { background-color: var(--dm-amber-soft-bg) !important; color: var(--dm-amber) !important; box-shadow: inset 0 0 0 1px var(--dm-amber-ring) !important; }
html[data-theme="dark"] .badge-emerald { background-color: var(--dm-emerald-soft-bg) !important; color: var(--dm-emerald) !important; box-shadow: inset 0 0 0 1px var(--dm-emerald-ring) !important; }
html[data-theme="dark"] .badge-sky { background-color: var(--dm-sky-soft-bg) !important; color: var(--dm-sky) !important; box-shadow: inset 0 0 0 1px var(--dm-sky-ring) !important; }
html[data-theme="dark"] .badge-red { background-color: var(--dm-red-soft-bg) !important; color: var(--dm-red) !important; box-shadow: inset 0 0 0 1px var(--dm-red-ring) !important; }
html[data-theme="dark"] .badge-brand { background-color: var(--dm-brand-soft-bg) !important; color: var(--dm-brand-strong) !important; box-shadow: inset 0 0 0 1px var(--dm-brand-ring) !important; }

/* راهنماها (hint) */
html[data-theme="dark"] .x-hint { background: var(--dm-surface-2) !important; box-shadow: inset 0 0 0 1px var(--dm-border) !important; color: var(--dm-text-4) !important; }
html[data-theme="dark"] .x-hint--warn { background: var(--dm-amber-soft-bg) !important; box-shadow: inset 0 0 0 1px var(--dm-amber-ring) !important; color: var(--dm-amber) !important; }
html[data-theme="dark"] .x-break-chip { background: var(--dm-amber-soft-bg); color: var(--dm-amber); }

/* منوی کناری */
html[data-theme="dark"] .side-link:not(.is-active) { color: var(--dm-text-4) !important; }
html[data-theme="dark"] .side-link:not(.is-active):hover { background-color: var(--dm-surface-2) !important; color: var(--dm-text-1) !important; }
html[data-theme="dark"] .side-link.is-active { background-image: var(--dm-brand-gradient); }

/* نقش‌ها (x-role) و گیرنده */
html[data-theme="dark"] .x-role { background: var(--dm-brand-soft-bg); color: var(--dm-brand-strong); }
html[data-theme="dark"] .x-role--teacher { background: var(--dm-sky-soft-bg); color: var(--dm-sky); }
html[data-theme="dark"] .x-role--assistant { background: var(--dm-red-soft-bg); color: #ff9fd0; }
html[data-theme="dark"] .x-role--unknown { background: var(--dm-surface-2); color: var(--dm-text-4); }
html[data-theme="dark"] .x-recipient strong { color: var(--dm-text-1); }
html[data-theme="dark"] .x-notes { color: var(--dm-text-4); }
html[data-theme="dark"] .x-notes .x-code { color: var(--dm-text-2); }
html[data-theme="dark"] .x-dl dt { color: var(--dm-text-5); }
html[data-theme="dark"] .x-panel-count.is-zero { background: var(--dm-surface-3); box-shadow: 0 0 0 3px var(--dm-surface); }
html[data-theme="dark"] .x-panel-count { box-shadow: 0 0 0 3px var(--dm-surface), 0 6px 14px -4px rgba(0, 0, 0, .5); }

/* ---------- 5) تقویم شمسی ---------- */
html[data-theme="dark"] .jdp-backdrop { background: rgba(0, 0, 0, .55); }
html[data-theme="dark"] .jdp-panel {
  background: var(--dm-surface);
  color: var(--dm-text-2);
  box-shadow: 0 0 0 1px var(--dm-border), 0 24px 60px -12px rgba(0, 0, 0, .6), 0 8px 20px -8px rgba(0, 0, 0, .5);
}
html[data-theme="dark"] .jdp-nav { background: var(--dm-surface-2); color: var(--dm-brand-strong); }
html[data-theme="dark"] .jdp-nav:hover { background: var(--dm-surface-3); }
html[data-theme="dark"] .jdp-select { background: var(--dm-surface-2); color: var(--dm-text-1); }
html[data-theme="dark"] .jdp-week div { color: var(--dm-text-5); }
html[data-theme="dark"] .jdp-week div:last-child { color: #ff8b93; }
html[data-theme="dark"] .jdp-day { color: var(--dm-text-2); }
html[data-theme="dark"] .jdp-day:hover { background: var(--dm-surface-2); }
html[data-theme="dark"] .jdp-day.is-friday { color: #ff8b93; }
html[data-theme="dark"] .jdp-day.is-today { box-shadow: inset 0 0 0 1.5px var(--dm-brand); color: var(--dm-brand-strong); }
html[data-theme="dark"] .jdp-day.is-selected { background: var(--dm-brand-gradient); color: #fff; box-shadow: 0 6px 14px -4px rgba(0, 0, 0, .6); }
html[data-theme="dark"] .jdp-foot { border-top-color: var(--dm-border); }
html[data-theme="dark"] .jdp-link--today { color: var(--dm-brand-strong); }
html[data-theme="dark"] .jdp-link--today:hover { background: var(--dm-brand-soft-bg); }
html[data-theme="dark"] .jdp-link--clear { color: var(--dm-text-5); }
html[data-theme="dark"] .jdp-link--clear:hover { background: var(--dm-surface-2); }

/* ---------- 6) کلاس‌های یوتیلیتی رنگی (Tailwind) ---------- */
/* پس‌زمینه‌های خنثی */
html[data-theme="dark"] .bg-white { background-color: var(--dm-surface) !important; }
html[data-theme="dark"] .bg-white\/80 { background-color: rgba(23, 25, 39, .85) !important; }
html[data-theme="dark"] .bg-surface-50 { background-color: var(--dm-bg) !important; }
html[data-theme="dark"] .bg-surface-100 { background-color: var(--dm-surface-2) !important; }
html[data-theme="dark"] .bg-ink-100 { background-color: var(--dm-surface-2) !important; }
html[data-theme="dark"] .bg-ink-400 { background-color: var(--dm-text-5) !important; }

/* متن‌ها (ink) */
html[data-theme="dark"] .text-ink-900 { color: var(--dm-text-1) !important; }
html[data-theme="dark"] .text-ink-800 { color: var(--dm-text-1) !important; }
html[data-theme="dark"] .text-ink-700 { color: var(--dm-text-2) !important; }
html[data-theme="dark"] .text-ink-600 { color: var(--dm-text-3) !important; }
html[data-theme="dark"] .text-ink-500 { color: var(--dm-text-4) !important; }
html[data-theme="dark"] .text-ink-400 { color: var(--dm-text-5) !important; }
html[data-theme="dark"] .text-ink-300 { color: var(--dm-text-6) !important; }

/* حاشیه‌ها/رینگ‌ها (ink) */
html[data-theme="dark"] .border-ink-100 { border-color: var(--dm-border) !important; }
html[data-theme="dark"] .border-ink-300 { border-color: var(--dm-border-strong) !important; }
html[data-theme="dark"] .ring-ink-100 { --tw-ring-color: var(--dm-border) !important; }
html[data-theme="dark"] .ring-ink-200 { --tw-ring-color: var(--dm-border-strong) !important; }

/* برند */
html[data-theme="dark"] .text-brand-600 { color: var(--dm-brand) !important; }
html[data-theme="dark"] .text-brand-700 { color: var(--dm-brand-strong) !important; }
html[data-theme="dark"] .hover\:text-brand-600:hover { color: var(--dm-brand) !important; }
html[data-theme="dark"] .hover\:text-brand-700:hover { color: var(--dm-brand-strong) !important; }
html[data-theme="dark"] .hover\:text-brand-800:hover { color: #ded3ff !important; }
html[data-theme="dark"] .hover\:bg-brand-50:hover { background-color: var(--dm-brand-soft-bg) !important; }
html[data-theme="dark"] .ring-brand-400 { --tw-ring-color: var(--dm-brand-ring) !important; }
html[data-theme="dark"] .hover\:ring-brand-300:hover { --tw-ring-color: var(--dm-brand) !important; }
html[data-theme="dark"] .focus\:ring-brand-500:focus { --tw-ring-color: var(--dm-brand) !important; }
html[data-theme="dark"] .file\:bg-brand-50::file-selector-button { background-color: var(--dm-brand-soft-bg) !important; }
html[data-theme="dark"] .file\:text-brand-700::file-selector-button { color: var(--dm-brand-strong) !important; }
html[data-theme="dark"] .hover\:file\:bg-brand-100:hover::file-selector-button { background-color: var(--dm-brand-soft-bg-hover) !important; }

/* آیریس (info) */
html[data-theme="dark"] .bg-iris-50 { background-color: var(--dm-iris-soft-bg) !important; }
html[data-theme="dark"] .text-iris-700 { color: var(--dm-iris) !important; }
html[data-theme="dark"] .ring-iris-200\/80 { --tw-ring-color: rgba(30, 63, 85, .8) !important; }

/* قرمز (خطا/غیبت) */
html[data-theme="dark"] .bg-red-50 { background-color: var(--dm-red-soft-bg) !important; }
html[data-theme="dark"] .text-red-600 { color: var(--dm-red) !important; }
html[data-theme="dark"] .text-red-700 { color: var(--dm-red) !important; }
html[data-theme="dark"] .hover\:text-red-600:hover { color: var(--dm-red) !important; }
html[data-theme="dark"] .hover\:bg-red-50:hover { background-color: var(--dm-red-soft-bg) !important; }
html[data-theme="dark"] .hover\:bg-red-100:hover { background-color: var(--dm-red-ring) !important; }
html[data-theme="dark"] .ring-red-200\/80 { --tw-ring-color: rgba(92, 36, 50, .8) !important; }

/* کهربایی (هشدار) */
html[data-theme="dark"] .text-amber-600 { color: var(--dm-amber) !important; }
html[data-theme="dark"] .text-amber-700 { color: var(--dm-amber) !important; }
html[data-theme="dark"] .ring-amber-200 { --tw-ring-color: var(--dm-amber-ring) !important; }

/* زمردی (موفقیت) */
html[data-theme="dark"] .text-emerald-700 { color: var(--dm-emerald) !important; }
html[data-theme="dark"] .ring-emerald-200\/80 { --tw-ring-color: rgba(31, 76, 60, .8) !important; }

/* آبی آسمانی */
html[data-theme="dark"] .text-sky-700 { color: var(--dm-sky) !important; }
html[data-theme="dark"] .hover\:bg-sky-100:hover { background-color: var(--dm-sky-ring) !important; }
html[data-theme="dark"] .ring-sky-200 { --tw-ring-color: var(--dm-sky-ring) !important; }

/* اسلیت (خنثی جایگزین) */
html[data-theme="dark"] .border-slate-100 { border-color: var(--dm-border) !important; }
html[data-theme="dark"] .ring-slate-200 { --tw-ring-color: var(--dm-border-strong) !important; }
html[data-theme="dark"] .text-slate-400 { color: var(--dm-text-5) !important; }
html[data-theme="dark"] .text-slate-500 { color: var(--dm-text-4) !important; }
html[data-theme="dark"] .text-slate-700 { color: var(--dm-text-2) !important; }
html[data-theme="dark"] .hover\:bg-slate-100:hover { background-color: var(--dm-surface-2) !important; }
html[data-theme="dark"] .hover\:text-slate-600:hover { color: var(--dm-text-2) !important; }

/* سایه‌ها: روی پس‌زمینهٔ تاریک سایهٔ کم‌رنگ دیده نمی‌شود؛ یک قاب ظریف اضافه می‌کنیم */
html[data-theme="dark"] .shadow-soft { box-shadow: 0 0 0 1px var(--dm-border), 0 8px 20px -10px var(--dm-shadow-color) !important; }
html[data-theme="dark"] .shadow-soft-xl { box-shadow: 0 0 0 1px var(--dm-border), 0 30px 70px -20px var(--dm-shadow-color) !important; }
html[data-theme="dark"] .shadow-glow { box-shadow: 0 0 0 1px var(--dm-brand-ring), 0 8px 20px -4px rgba(0, 0, 0, .5) !important; }

/* ---------- 7) فرم‌های بومی مرورگر ---------- */
html[data-theme="dark"] input[type="checkbox"],
html[data-theme="dark"] input[type="radio"] {
  accent-color: var(--dm-brand);
}
html[data-theme="dark"] select,
html[data-theme="dark"] textarea,
html[data-theme="dark"] input {
  color-scheme: dark;
}
/* اتوفیل مرورگر (کروم) که پس‌زمینهٔ روشن را زورچپان می‌کند */
html[data-theme="dark"] input:-webkit-autofill,
html[data-theme="dark"] input:-webkit-autofill:hover,
html[data-theme="dark"] input:-webkit-autofill:focus {
  -webkit-text-fill-color: var(--dm-text-1);
  -webkit-box-shadow: 0 0 0 1000px var(--dm-surface-2) inset;
  transition: background-color 9999s ease-in-out 0s;
}
html[data-theme="dark"] :focus-visible {
  outline-color: var(--dm-brand);
}

/* ---------- 8) دکمهٔ تعویض حالت روشن/تاریک ---------- */
.theme-toggle {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  flex-shrink: 0;
  border: 0;
  border-radius: 14px;
  background: #f4f4f8;
  color: #52526b;
  cursor: pointer;
  transition: background-color .18s, color .18s, transform .1s;
}
.theme-toggle:hover { background: #ebe6ff; color: #4c2cc4; }
.theme-toggle:active { transform: scale(.92); }
.theme-toggle-icon { position: absolute; transition: opacity .15s, transform .25s; }
.theme-toggle-icon--sun { opacity: 0; transform: rotate(-60deg) scale(.6); }
.theme-toggle-icon--moon { opacity: 1; transform: rotate(0) scale(1); }
html[data-theme="dark"] .theme-toggle { background: var(--dm-surface-2); color: var(--dm-text-3); }
html[data-theme="dark"] .theme-toggle:hover { background: var(--dm-brand-soft-bg); color: var(--dm-brand-strong); }
html[data-theme="dark"] .theme-toggle-icon--sun { opacity: 1; transform: rotate(0) scale(1); }
html[data-theme="dark"] .theme-toggle-icon--moon { opacity: 0; transform: rotate(60deg) scale(.6); }

/* حالت شناور، برای صفحاتی که هدر ندارند (ورود / سامانه غیرفعال) */
.theme-toggle--floating {
  position: fixed;
  top: calc(14px + env(safe-area-inset-top, 0px));
  left: 14px;
  z-index: 999;
  box-shadow: 0 6px 18px -6px rgba(30, 27, 60, .35);
}
html[data-theme="dark"] .theme-toggle--floating {
  box-shadow: 0 6px 18px -6px rgba(0, 0, 0, .6);
}

html[data-theme="dark"] .x-notice-box { background: var(--dm-surface-2); box-shadow: inset 0 0 0 1px var(--dm-border); }
html[data-theme="dark"] .x-notice-head { color: #6ee7b7; }
html[data-theme="dark"] .x-notice-sub { color: var(--dm-text-4); }
html[data-theme="dark"] .x-notice-card { background: var(--dm-surface); box-shadow: inset 0 0 0 1px var(--dm-border); }
html[data-theme="dark"] .x-notice-name { color: var(--dm-text-1); }
html[data-theme="dark"] .x-notice-class { background: var(--dm-surface-3); color: #b4b8ff; }
html[data-theme="dark"] .x-notice-date { background: rgba(16, 185, 129, .16); color: #6ee7b7; }
html[data-theme="dark"] .x-notice-reason { background: var(--dm-surface-3); color: var(--dm-text-3); }