/* Shared EasyUC appearance. Classic deliberately retains the original base styles. */
html[data-ui-theme="aurora"] {
  color-scheme: light;
  --ui-bg: #f5f3fc;
  --ui-text: #3a3660;
  --ui-heading: #1f1b3d;
  --ui-muted: #5f5b85;
  --ui-surface: rgba(255,255,255,.76);
  --ui-surface-solid: #fff;
  --ui-surface-soft: #f2eefc;
  --ui-border: rgba(91,63,217,.16);
  --ui-accent: #7b5cff;
  --ui-accent-text: #5b3fd9;
  --ui-primary-gradient: linear-gradient(135deg,#6a4cf0 0%,#9a47de 55%,#c8418e 100%);
  --ui-shadow: 0 10px 30px rgba(47,30,99,.08), 0 2px 5px rgba(47,30,99,.03);
  --ui-sidebar: rgba(27,19,59,.92);
  --ui-sidebar-text: #eeeafa;
  --ui-background-image: radial-gradient(ellipse at 8% 12%,rgba(123,92,255,.20),transparent 55%),radial-gradient(ellipse at 92% 6%,rgba(224,82,156,.13),transparent 55%),radial-gradient(ellipse at 96% 96%,rgba(255,154,85,.15),transparent 55%),radial-gradient(ellipse at 30% 100%,rgba(46,196,182,.14),transparent 55%);
  --teal: #7b5cff; --teal-ink: #5b3fd9; --teal-soft: #eee8ff;
  --violet: #7b5cff; --violet-ink: #5b3fd9; --violet-soft: #eee8ff;
  --orange: #ff9a55; --orange-ink: #8a5300; --orange-soft: #fff0e5;
  --green: #087a59; --green-soft: #e0f4ed;
  --red: #c41d56; --red-soft: #fde8ef;
  --amber: #8a5300; --amber-soft: #fff1d9;
}
html[data-ui-theme="midnight"] {
  color-scheme: dark;
  --ui-bg: #0b1020;
  --ui-text: #c7cddc;
  --ui-heading: #e6e8f0;
  --ui-muted: #9aa3b8;
  --ui-surface: rgba(19,26,49,.88);
  --ui-surface-solid: #131a31;
  --ui-surface-soft: #182039;
  --ui-border: rgba(255,255,255,.14);
  --ui-accent: #7c8cff;
  --ui-accent-text: #a9b4ff;
  --ui-primary-gradient: linear-gradient(135deg,#5364da 0%,#7350c8 65%,#8a45af 100%);
  --ui-shadow: 0 16px 40px rgba(0,0,0,.25), 0 0 0 1px rgba(124,140,255,.03);
  --ui-sidebar: rgba(6,9,20,.94);
  --ui-sidebar-text: #c7cddc;
  --ui-background-image: radial-gradient(900px 620px at 18% -8%,rgba(124,140,255,.14),transparent 62%),radial-gradient(820px 560px at 100% 18%,rgba(34,211,238,.08),transparent 60%),radial-gradient(1000px 700px at 62% 112%,rgba(167,139,250,.09),transparent 62%);
  --teal: #7c8cff; --teal-ink: #a9b4ff; --teal-soft: #242e55;
  --violet: #a78bfa; --violet-ink: #c4b5fd; --violet-soft: #2d2548;
  --orange: #fbad72; --orange-ink: #fdba74; --orange-soft: #37291e;
  --green: #6ee7b7; --green-soft: #15382f;
  --red: #fda4af; --red-soft: #3c2130;
  --amber: #fcd34d; --amber-soft: #3b301d;
}
html:is([data-ui-theme="aurora"],[data-ui-theme="midnight"]) {
  --ui-on-accent: #fff;
  --ui-font: 'Poppins','Helvetica Neue',Arial,sans-serif;
  --font-body: var(--ui-font); --font-head: var(--ui-font);
  --ink: var(--ui-heading); --ink-2: var(--ui-text); --ink-3: var(--ui-muted);
  --paper: var(--ui-surface-solid); --paper-2: var(--ui-surface-soft); --paper-3: var(--ui-surface-soft);
  --line: var(--ui-border); --line-2: var(--ui-border);
  --radius: 12px;
  scrollbar-color: var(--ui-border) transparent;
}
html:is([data-ui-theme="aurora"],[data-ui-theme="midnight"]) body {
  background-color: var(--ui-bg);
  background-image: var(--ui-background-image);
  background-attachment: fixed;
  color: var(--ui-text);
}
html:is([data-ui-theme="aurora"],[data-ui-theme="midnight"]) :focus-visible {
  outline: 2px solid var(--ui-accent); outline-offset: 3px;
}
html:is([data-ui-theme="aurora"],[data-ui-theme="midnight"]) ::selection { background: var(--teal-soft); color: var(--ui-heading); }
html:is([data-ui-theme="aurora"],[data-ui-theme="midnight"]) input::placeholder,
html:is([data-ui-theme="aurora"],[data-ui-theme="midnight"]) textarea::placeholder { color: var(--ui-muted); opacity: 1; }
html:is([data-ui-theme="aurora"],[data-ui-theme="midnight"]) input:is([type="checkbox"],[type="radio"]) { accent-color: var(--ui-accent); }
html:is([data-ui-theme="aurora"],[data-ui-theme="midnight"]) option { background: var(--ui-surface-solid); color: var(--ui-text); }

/* The picker is available in all three themes; no Classic page styles are replaced. */
.theme-picker { position: relative; flex: 0 0 auto; font: 500 13px/1.4 var(--font-body); color: var(--ink-2); }
.theme-picker__trigger { display: flex; align-items: center; justify-content: center; gap: 7px; min-height: 36px; padding: 7px 10px; border: 1px solid var(--line); border-radius: 999px; background: var(--paper); color: var(--ink-2); cursor: pointer; list-style: none; white-space: nowrap; user-select: none; }
.theme-picker__trigger::-webkit-details-marker { display: none; }
.theme-picker__trigger:hover, .theme-picker[open] .theme-picker__trigger { color: var(--teal-ink); background: var(--teal-soft); border-color: var(--teal); }
.theme-picker__chevron { transition: transform .15s ease; }
.theme-picker[open] .theme-picker__chevron { transform: rotate(180deg); }
.theme-picker__menu { position: absolute; z-index: 120; top: calc(100% + 10px); right: 0; width: 292px; max-width: calc(100vw - 32px); padding: 10px; background: var(--ui-surface-solid,var(--paper)); color: var(--ink-2); border: 1px solid var(--line); border-radius: 16px; box-shadow: 0 16px 40px rgba(12,16,40,.18); }
.theme-picker__heading { margin: 4px 8px 10px; color: var(--ink-3); font-size: 11px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; }
.theme-picker__option { display: flex; align-items: center; width: 100%; gap: 10px; margin: 4px 0; padding: 10px; border: 1px solid transparent; border-radius: 10px; background: transparent; color: var(--ink-2); font: inherit; text-align: left; cursor: pointer; }
.theme-picker__option:hover { background: var(--paper-2); }
.theme-picker__option[aria-pressed="true"] { background: var(--teal-soft); border-color: var(--teal); color: var(--teal-ink); }
.theme-picker__copy { min-width: 0; flex: 1; }
.theme-picker__copy strong { display: block; font-size: 13px; font-weight: 600; }
.theme-picker__copy small { display: block; margin-top: 3px; color: var(--ink-3); font-size: 11px; line-height: 1.5; font-weight: 400; white-space: normal; }
.theme-picker__check { opacity: 0; font-weight: 700; }
.theme-picker__option[aria-pressed="true"] .theme-picker__check { opacity: 1; }
.theme-picker__swatch { flex: 0 0 32px; height: 32px; border: 1px solid rgba(126,125,155,.25); border-radius: 10px; }
.theme-picker__swatch--aurora { background: linear-gradient(135deg,#dcd0ff,#f7e9f7 55%,#cfece8); }
.theme-picker__swatch--midnight { background: radial-gradient(at top right,#345a77,transparent 75%),linear-gradient(135deg,#352c69,#0b1020); }
.theme-picker__swatch--classic { background: linear-gradient(135deg,#fff 48%,#0f2629 49%,#12a19a); }
.auth-top__tools { display: flex; align-items: center; gap: 16px; }
.app-bar .theme-picker { margin-left: 4px; }
/* Make room for the added navigation and design picker while preserving Classic's appearance. */
@media (min-width: 1181px) and (max-width: 1800px) {
  html[data-ui-theme="classic"] body.site { --header-h: 104px; }
  html[data-ui-theme="classic"] .site .sh__inner { max-width: none; display: grid; grid-template-columns: auto minmax(0, 1fr); grid-template-rows: 56px 48px; }
  html[data-ui-theme="classic"] .site .sh__menu { display: contents; }
  html[data-ui-theme="classic"] .site .sh__brand { grid-column: 1; grid-row: 1; }
  html[data-ui-theme="classic"] .site .sh__brand::after { display: none; }
  html[data-ui-theme="classic"] .site .sh__aside { grid-column: 2; grid-row: 1; justify-content: flex-end; }
  html[data-ui-theme="classic"] .site .sh__nav { grid-column: 1 / -1; grid-row: 2; min-width: 0; border-top: 1px solid var(--border); }
  html[data-ui-theme="classic"] .site .sh__nav ul { justify-content: space-between; }
  html[data-ui-theme="classic"] .site .sh__nav a { padding: 0 8px; height: 44px; }
}
@media (max-width: 600px) {
  .app-bar .theme-picker__trigger [data-theme-current], .app-bar .theme-picker__chevron { display: none; }
  .auth-top { flex-wrap: wrap; gap: 12px; }
  .auth-top__tools { gap: 10px; }
}
@media (prefers-reduced-motion: reduce) { .theme-picker__chevron { transition: none; } }
@media print { .theme-picker { display: none !important; } }
