/* Shared GLM appearance tokens. Mode and palette are independent. */
:root,
html[data-ui-theme="light"][data-ui-theme-palette="mint"] {
  color-scheme: light;
  --theme-on-accent: #ffffff;
  --theme-on-warning: #ffffff;
  --theme-success: #176b46;
  --theme-success-tint: #e3f5ea;
  --theme-warning: #855300;
  --theme-warning-tint: #fff0d1;
  --theme-danger: #b02d3a;
  --theme-danger-tint: #ffecef;
  --theme-info: #245f9b;
  --theme-info-tint: #e8f1ff;
  --theme-neutral-tint: #edf1ef;
  --theme-instagram: #9d367b;
  --theme-nav-text: #f0f8f4;
  --theme-nav-muted: #b6cec4;
  --theme-page: #f6f9f8;
  --theme-surface: #ffffff;
  --theme-raised: #eaf2ef;
  --theme-text: #162a25;
  --theme-muted: #536860;
  --theme-border: #c8d8d1;
  --theme-accent: #087f68;
  --theme-accent-hover: #066651;
  --theme-accent-tint: #e0f3ec;
  --theme-nav: #102d28;
  --theme-nav-selected: #1e5145;
  --theme-accent-gradient: linear-gradient(135deg, #087f68 0%, #42b993 100%);
  --theme-shadow: 0 10px 30px rgba(16, 45, 40, .08);
}
html[data-ui-theme="dark"][data-ui-theme-palette="mint"] {
  color-scheme: dark;
  --theme-on-accent: #0a2b22;
  --theme-on-warning: #352002;
  --theme-success: #83d8a1;
  --theme-success-tint: #183829;
  --theme-warning: #efc279;
  --theme-warning-tint: #49371b;
  --theme-danger: #ff9aaa;
  --theme-danger-tint: #492633;
  --theme-info: #9ccaff;
  --theme-info-tint: #21364e;
  --theme-neutral-tint: #2a3431;
  --theme-instagram: #eba1d3;
  --theme-nav-text: #f1faf5;
  --theme-nav-muted: #b5cac1;
  --theme-page: #101916;
  --theme-surface: #17251f;
  --theme-raised: #20352d;
  --theme-text: #eff8f3;
  --theme-muted: #b3c9bf;
  --theme-border: #385247;
  --theme-accent: #73d9b6;
  --theme-accent-hover: #97e9cb;
  --theme-accent-tint: #183f34;
  --theme-nav: #0b1513;
  --theme-nav-selected: #21443a;
  --theme-accent-gradient: linear-gradient(135deg, #087f68 0%, #73d9b6 100%);
  --theme-shadow: 0 10px 30px rgba(0, 0, 0, .24);
}
html[data-ui-theme="light"][data-ui-theme-palette="ocean"] {
  color-scheme: light;
  --theme-on-accent: #ffffff;
  --theme-on-warning: #ffffff;
  --theme-success: #176b46;
  --theme-success-tint: #e3f5ea;
  --theme-warning: #855300;
  --theme-warning-tint: #fff0d1;
  --theme-danger: #b02d3a;
  --theme-danger-tint: #ffecef;
  --theme-info: #245f9b;
  --theme-info-tint: #e8f1ff;
  --theme-neutral-tint: #edf1f5;
  --theme-instagram: #9d367b;
  --theme-nav-text: #f1f6fc;
  --theme-nav-muted: #b8cce1;
  --theme-page: #f4f8fc;
  --theme-surface: #ffffff;
  --theme-raised: #e7f0fa;
  --theme-text: #172b45;
  --theme-muted: #536b84;
  --theme-border: #c9d8e7;
  --theme-accent: #2563a6;
  --theme-accent-hover: #194d86;
  --theme-accent-tint: #e4f0fc;
  --theme-nav: #122c49;
  --theme-nav-selected: #24517c;
  --theme-accent-gradient: linear-gradient(135deg, #2563a6 0%, #55a9d9 100%);
  --theme-shadow: 0 10px 30px rgba(18, 44, 73, .08);
}
html[data-ui-theme="dark"][data-ui-theme-palette="ocean"] {
  color-scheme: dark;
  --theme-on-accent: #081b2d;
  --theme-on-warning: #352002;
  --theme-success: #83d8a1;
  --theme-success-tint: #183829;
  --theme-warning: #efc279;
  --theme-warning-tint: #49371b;
  --theme-danger: #ff9aaa;
  --theme-danger-tint: #492633;
  --theme-info: #9ccaff;
  --theme-info-tint: #21364e;
  --theme-neutral-tint: #293542;
  --theme-instagram: #eba1d3;
  --theme-nav-text: #f1f6fc;
  --theme-nav-muted: #b7c6d5;
  --theme-page: #0f1723;
  --theme-surface: #182536;
  --theme-raised: #21354a;
  --theme-text: #eff5fc;
  --theme-muted: #b7c6d5;
  --theme-border: #3b536b;
  --theme-accent: #72b8f0;
  --theme-accent-hover: #9bcdf7;
  --theme-accent-tint: #183b5d;
  --theme-nav: #0a1422;
  --theme-nav-selected: #20415d;
  --theme-accent-gradient: linear-gradient(135deg, #2563a6 0%, #72b8f0 100%);
  --theme-shadow: 0 10px 30px rgba(0, 0, 0, .25);
}
html[data-ui-theme="light"][data-ui-theme-palette="sand"] {
  color-scheme: light;
  --theme-on-accent: #ffffff;
  --theme-on-warning: #ffffff;
  --theme-success: #176b46;
  --theme-success-tint: #e3f5ea;
  --theme-warning: #855300;
  --theme-warning-tint: #fff0d1;
  --theme-danger: #b02d3a;
  --theme-danger-tint: #ffecef;
  --theme-info: #245f9b;
  --theme-info-tint: #e8f1ff;
  --theme-neutral-tint: #f0ece7;
  --theme-instagram: #9d367b;
  --theme-nav-text: #fff8f0;
  --theme-nav-muted: #d9c5b4;
  --theme-page: #faf7f1;
  --theme-surface: #fffdf9;
  --theme-raised: #f1e8db;
  --theme-text: #332a23;
  --theme-muted: #6f6054;
  --theme-border: #dfd0bd;
  --theme-accent: #a86238;
  --theme-accent-hover: #864a2b;
  --theme-accent-tint: #f7e8d9;
  --theme-nav: #352923;
  --theme-nav-selected: #5a3e31;
  --theme-accent-gradient: linear-gradient(135deg, #a86238 0%, #d69562 100%);
  --theme-shadow: 0 10px 30px rgba(53, 41, 35, .09);
}
html[data-ui-theme="dark"][data-ui-theme-palette="sand"] {
  color-scheme: dark;
  --theme-on-accent: #351b0f;
  --theme-on-warning: #352002;
  --theme-success: #83d8a1;
  --theme-success-tint: #183829;
  --theme-warning: #efc279;
  --theme-warning-tint: #49371b;
  --theme-danger: #ff9aaa;
  --theme-danger-tint: #492633;
  --theme-info: #9ccaff;
  --theme-info-tint: #21364e;
  --theme-neutral-tint: #382d27;
  --theme-instagram: #eba1d3;
  --theme-nav-text: #fff5ec;
  --theme-nav-muted: #d7bfae;
  --theme-page: #1e1714;
  --theme-surface: #2b211d;
  --theme-raised: #3a2b24;
  --theme-text: #fff5ec;
  --theme-muted: #d7bfae;
  --theme-border: #63493b;
  --theme-accent: #e2a173;
  --theme-accent-hover: #f0bd99;
  --theme-accent-tint: #523126;
  --theme-nav: #1b1210;
  --theme-nav-selected: #493128;
  --theme-accent-gradient: linear-gradient(135deg, #a86238 0%, #e2a173 100%);
  --theme-shadow: 0 10px 30px rgba(0, 0, 0, .26);
}

html[data-ui-theme] body { background: var(--theme-page); color: var(--theme-text); }
html[data-ui-theme] .shell > aside,
html[data-ui-theme] .sp-sidebar {
  --theme-text: var(--theme-nav-text);
  --theme-muted: var(--theme-nav-muted);
  --theme-on-accent: var(--theme-nav-text);
  background: var(--theme-nav);
  color: var(--theme-nav-text);
}
html[data-ui-theme] .shell > aside nav button.selected,
html[data-ui-theme] .shell > aside .company-icon,
html[data-ui-theme] .sp-sidebar .active {
  background: var(--theme-nav-selected);
  color: var(--theme-nav-text);
}
html[data-ui-theme] main.login,
html[data-ui-theme] .password-gate { background: var(--theme-page); color: var(--theme-text); }
html[data-ui-theme] main.login .login-brand { color: var(--theme-text); }
html[data-ui-theme] main.login h1 span { color: var(--theme-muted); }
html[data-ui-theme] input,
html[data-ui-theme] select,
html[data-ui-theme] textarea { accent-color: var(--theme-accent); }
html[data-ui-theme] .primary { background: var(--theme-accent-gradient); }
html[data-ui-theme] .ui-language-bar {
  background: var(--theme-surface);
  color: var(--theme-text);
  border-color: var(--theme-border);
}
html[data-ui-theme] .ui-language-bar select {
  background: var(--theme-surface);
  color: var(--theme-text);
  border-color: var(--theme-border);
}
html[data-ui-theme],
html[data-ui-theme] body,
html[data-ui-theme] aside,
html[data-ui-theme] header,
html[data-ui-theme] .panel,
html[data-ui-theme] button,
html[data-ui-theme] input,
html[data-ui-theme] select,
html[data-ui-theme] textarea {
  transition: background-color 180ms ease, border-color 180ms ease, color 180ms ease, box-shadow 180ms ease;
}
.ui-theme-control {
  display: grid;
  gap: 10px;
  min-width: min(360px, 100%);
}
.ui-theme-heading {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 600;
}
.ui-theme-group {
  display: grid;
  gap: 6px;
}
.ui-theme-group > span {
  color: var(--theme-muted);
  font-size: 11px;
}
.ui-theme-segmented {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 4px;
  padding: 3px;
  border: 1px solid var(--theme-border);
  border-radius: 10px;
  background: var(--theme-raised);
}
.ui-theme-segmented button,
.ui-theme-palette button {
  min-height: 32px;
  padding: 6px 8px;
  border-radius: 7px;
  font-size: 12px;
}
.ui-theme-segmented button[aria-pressed="true"] {
  background: var(--theme-surface);
  color: var(--theme-accent);
  box-shadow: var(--theme-shadow);
  font-weight: 600;
}
.ui-theme-palette {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
}
.ui-theme-palette button {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 6px;
  border: 1px solid var(--theme-border);
  background: var(--theme-surface);
}
.ui-theme-palette button[aria-pressed="true"] {
  border-color: var(--theme-accent);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--theme-accent) 18%, transparent);
}
.ui-theme-swatch {
  width: 18px;
  height: 18px;
  flex: none;
  border-radius: 6px;
  background: var(--swatch);
  box-shadow: inset 0 0 0 1px #0002;
}
.ui-theme-error,
.platform-theme [role="alert"] {
  color: var(--theme-danger);
  font-size: 11px;
}
.platform-theme {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 6px 8px;
  font-size: 12px;
}
.platform-theme > label { margin: 0; color: var(--theme-muted); font-size: 11px; }
.platform-theme select {
  min-height: 32px;
  max-width: 160px;
  border: 1px solid var(--theme-border);
  border-radius: 8px;
  padding: 5px 8px;
  background: var(--theme-surface);
  color: var(--theme-text);
}
.platform-theme [role="alert"] { grid-column: 1 / -1; }
@media (max-width: 1100px) {
  .platform-topbar .platform-theme label,
  .platform-topbar .platform-language label { display: none; }
  .platform-topbar .topbar-context > strong { display: none; }
}
@media (max-width: 600px) {
  .ui-theme-control { min-width: 0; }
  .ui-theme-segmented button,
  .ui-theme-palette button { font-size: 11px; padding-inline: 5px; }
  .platform-theme select { max-width: 130px; }
  .login-brand { flex-wrap: wrap; }
  .platform-topbar .account-name { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  html[data-ui-theme],
  html[data-ui-theme] body,
  html[data-ui-theme] aside,
  html[data-ui-theme] header,
  html[data-ui-theme] .panel,
  html[data-ui-theme] button,
  html[data-ui-theme] input,
  html[data-ui-theme] select,
  html[data-ui-theme] textarea { transition: none; }
}
