/* Admin theme (2026-10): one look for every admin screen.
   The dashboard is token-driven, so this file restyles all pages at once by redefining the
   tokens and the shared pieces (shell, cards, buttons, tables, forms, badges). It changes no
   layout: nothing moves, only how it looks. Loaded after admin-dashboard.css. */

/* ---- tokens ------------------------------------------------------------------------------ */
:root {
  --admin-bg: #f4f5fb;
  --admin-card: #ffffff;
  --admin-card-soft: #f7f7fd;
  --admin-text: #14162b;
  --admin-muted: #6b7190;
  --admin-border: #e4e6f2;
  --admin-shadow: 0 24px 60px -30px rgba(40, 36, 120, .28);
  --admin-shadow-soft: 0 14px 34px -22px rgba(40, 36, 120, .22);
  --admin-blue: #5b4df0;
  --admin-blue-soft: rgba(91, 77, 240, .10);
  --admin-green: #10b981;
  --admin-radius: 18px;
  --admin-accent-2: #22b8e6;
  --admin-grad: linear-gradient(135deg, #6d5efc 0%, #8b7bff 55%, #22c3ee 130%);
  --admin-glow-1: rgba(109, 94, 252, .14);
  --admin-glow-2: rgba(34, 195, 238, .10);
  /* older inline styles in the templates use these names */
  --border: var(--admin-border); --surface: var(--admin-card); --surface-2: var(--admin-card-soft);
  --fg: var(--admin-text); --fg-muted: var(--admin-muted); --bg: var(--admin-card-soft);
}
[data-theme="dark"] {
  --admin-bg: #090b11;
  --admin-card: #11151f;
  --admin-card-soft: #161b28;
  --admin-text: #edf0f7;
  --admin-muted: #8a94a8;
  --admin-border: #232a3a;
  --admin-shadow: 0 26px 60px -28px rgba(0, 0, 0, .7);
  --admin-shadow-soft: 0 16px 36px -24px rgba(0, 0, 0, .6);
  --admin-blue: #8375ff;
  --admin-blue-soft: rgba(109, 94, 252, .16);
  --admin-green: #34d399;
  --admin-glow-1: rgba(109, 94, 252, .20);
  --admin-glow-2: rgba(34, 195, 238, .10);
}

/* ---- page ------------------------------------------------------------------------------- */
body.admin-body {
  background:
    radial-gradient(900px 460px at 88% -8%, var(--admin-glow-1), transparent 62%),
    radial-gradient(760px 420px at -6% 108%, var(--admin-glow-2), transparent 62%),
    var(--admin-bg);
  background-attachment: fixed;
  -webkit-font-smoothing: antialiased;
  letter-spacing: -.003em;
}
body.admin-body ::selection { background: color-mix(in srgb, var(--admin-blue) 35%, transparent); }
body.admin-body * { scrollbar-width: thin; scrollbar-color: var(--admin-border) transparent; }

/* calmer type: the old shell used 800–900 weights everywhere */
.admin-body h1, .admin-body h2, .admin-body h3, .admin-body h4 { font-weight: 700; letter-spacing: -.02em; }
.admin-body strong, .admin-body b { font-weight: 650; }
.topbar h1 { font-size: 22px; letter-spacing: -.02em; }
.page-heading-row h2, .welcome h2 { font-size: clamp(22px, 2.4vw, 28px); letter-spacing: -.025em; }
.page-heading-row p { font-size: .95rem; }

/* ---- shell: rail, sidebar, top bar --------------------------------------------------------- */
.icon-sidebar {
  background: color-mix(in srgb, var(--admin-card) 78%, transparent);
  -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
}
.rail-link { border-radius: 13px; }
.rail-link.active {
  background: var(--admin-grad); color: #fff;
  box-shadow: 0 10px 22px -10px var(--admin-blue);
}
.rail-link.active::after {
  content: ""; position: absolute; inset-inline-start: -12px; top: 12px; bottom: 12px; width: 3px; border-radius: 99px; background: var(--admin-blue);
}
.expanded-sidebar { background: transparent; }
.expanded-card {
  border-radius: 20px; box-shadow: none;
  background: color-mix(in srgb, var(--admin-card) 86%, transparent);
  -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
}
.module-title-icon { background: var(--admin-grad); color: #fff; box-shadow: 0 8px 18px -10px var(--admin-blue); }
.menu-row { border-radius: 12px; font-weight: 600; color: var(--admin-muted); }
.menu-row:hover { color: var(--admin-text); }
.menu-row.active {
  color: var(--admin-text);
  background: linear-gradient(90deg, color-mix(in srgb, var(--admin-blue) 22%, transparent), color-mix(in srgb, var(--admin-blue) 4%, transparent));
}
.menu-row.active svg { color: var(--admin-blue); }
.topbar {
  background: color-mix(in srgb, var(--admin-bg) 72%, transparent);
  border-bottom-color: color-mix(in srgb, var(--admin-border) 70%, transparent);
}
.avatar-button { background: var(--admin-grad); box-shadow: 0 8px 20px -10px var(--admin-blue); }
.topbar-locale-select { border-radius: 12px; background: var(--admin-card); }

/* ---- surfaces ---------------------------------------------------------------------------- */
.overview-card, .settings-panel, .settings-card, .stat-card, .module-overview-card, .home-panel {
  border-radius: var(--admin-radius);
  border-color: var(--admin-border);
  background: var(--admin-card);
  box-shadow: var(--admin-shadow-soft);
}
.settings-panel__head h3, .overview-head h3 { font-size: 1.05rem; }
.settings-panel__head p { color: var(--admin-muted); }
.settings-callout { border-radius: 14px; border-color: var(--admin-border); background: var(--admin-card-soft); }
.settings-subhead { color: var(--admin-muted); text-transform: uppercase; letter-spacing: .08em; font-size: .72rem; font-weight: 700; }

/* ---- buttons ----------------------------------------------------------------------------- */
.primary-action, .secondary-action { border-radius: 12px; min-height: 40px; padding-inline: 16px; font-weight: 650; letter-spacing: 0; }
.primary-action { background: var(--admin-grad); color: #fff; box-shadow: 0 12px 26px -16px var(--admin-blue); }
.secondary-action {
  background: var(--admin-card); color: var(--admin-text);
  border: 1px solid var(--admin-border);
}
.secondary-action:hover { background: var(--admin-card-soft); }
.primary-action:focus-visible, .secondary-action:focus-visible { outline: 3px solid color-mix(in srgb, var(--admin-blue) 45%, transparent); outline-offset: 2px; }
.primary-action:disabled, .secondary-action:disabled { opacity: .5; cursor: not-allowed; filter: none; box-shadow: none; transform: none; }
.module-overview-card a { background: var(--admin-grad); border-radius: 11px; }
.text-link, .admin-body a:not([class]) { color: var(--admin-blue); }

/* ---- forms ------------------------------------------------------------------------------- */
.admin-input, .admin-select,
.settings-field input, .settings-field select, .settings-field textarea,
.modal-field input, .modal-field select, .modal-field textarea {
  border-radius: 12px; padding: 10px 12px;
  border-color: var(--admin-border);
  background: color-mix(in srgb, var(--admin-bg) 60%, var(--admin-card));
  color: var(--admin-text);
}
.admin-input::placeholder, .settings-field input::placeholder, .settings-field textarea::placeholder { color: color-mix(in srgb, var(--admin-muted) 70%, transparent); }
.settings-field > span, .modal-field > label { color: var(--admin-muted); font-weight: 600; font-size: .82rem; }
.admin-body input[type="checkbox"], .admin-body input[type="radio"] { accent-color: var(--admin-blue); }

/* ---- tables ------------------------------------------------------------------------------ */
.table-wrap { border: 1px solid var(--admin-border); border-radius: 14px; background: var(--admin-card); }
.data-table th {
  position: sticky; top: 0; z-index: 1;
  background: var(--admin-card-soft); color: var(--admin-muted);
  font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .07em;
}
.data-table th, .data-table td { padding: 13px 14px; }
.data-table tbody tr:last-child td { border-bottom: 0; }
.data-table td a:not([class]) { color: var(--admin-text); font-weight: 600; text-decoration: none; }
.data-table td a:not([class]):hover { color: var(--admin-blue); }

/* ---- badges and messages ------------------------------------------------------------------- */
.settings-badge {
  border-color: color-mix(in srgb, var(--admin-blue) 40%, transparent);
  background: var(--admin-blue-soft); color: var(--admin-blue); font-weight: 650;
}
.settings-flash { border-radius: 12px; padding: 12px 16px; font-size: .9rem; border: 1px solid transparent; }
.settings-flash--ok { background: color-mix(in srgb, var(--admin-green) 12%, transparent); color: var(--admin-green); border-color: color-mix(in srgb, var(--admin-green) 35%, transparent); }
.settings-flash--err { background: rgba(248, 113, 113, .12); color: #ef4444; border-color: rgba(248, 113, 113, .38); }
[data-theme="dark"] .settings-flash--err { color: #fca5a5; }
.stat-icon { border-radius: 12px; box-shadow: 0 10px 20px -12px currentColor; }
.stat-blue { background: linear-gradient(135deg, #5b4df0, #8b7bff); }
.stat-purple { background: linear-gradient(135deg, #7c3aed, #c084fc); }
.stat-green { background: linear-gradient(135deg, #059669, #34d399); }
.stat-orange { background: linear-gradient(135deg, #ea580c, #fb923c); }

/* ---- dialogs and toasts -------------------------------------------------------------------- */
.modal-overlay { -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); background: rgba(8, 10, 18, .6); }
.modal-overlay > * { border-radius: 20px; border: 1px solid var(--admin-border); box-shadow: var(--admin-shadow); }
.toast { border-radius: 12px; background: var(--admin-card); border-color: var(--admin-border); color: var(--admin-text); }

/* header buttons never wrap onto two lines */
.page-heading-row .primary-action, .page-heading-row .secondary-action { white-space: nowrap; }
