/* Shared visual language for every route rendered by the Hub Manager shell. */
:root[data-trygc-page="index"] {
  --font-sans: "Plus Jakarta Sans", "Inter", "Segoe UI", sans-serif;
  --font-condensed: "Outfit", "Plus Jakarta Sans", sans-serif;
  --gc-orange: #e8630c;
  --gc-orange-soft: #ffeddd;
  --gc-purple: #7c3aed;
  --success: #059669;
  --warning: #d97706;
  --danger: #dc2626;
  --background: #f2eef6;
  --foreground: #171022;
  --card: #ffffff;
  --muted: #ece6f1;
  --muted-foreground: #675d75;
  --border: #ddd3e5;
  --input: #ffffff;
  --ring: #e8630c;
}

:root[data-trygc-page="index"].dark,
:root[data-trygc-page="index"][data-theme="dark"] {
  color-scheme: dark;
  --gc-orange: #ff6b1a;
  --gc-orange-soft: rgba(255, 107, 26, .14);
  --gc-purple: #a679ef;
  --success: #34d399;
  --warning: #fbbf24;
  --danger: #fb7185;
  --background: #0c0914;
  --foreground: #f8f6fc;
  --card: #151022;
  --muted: #281f40;
  --muted-foreground: #a99fb5;
  --border: rgba(255, 255, 255, .09);
  --input: #1e1730;
  --ring: #ff6b1a;
}

html[data-trygc-page="index"],
html[data-trygc-page="index"] body,
html[data-trygc-page="index"] #root {
  font-family: var(--font-sans);
  background: var(--background);
  color: var(--foreground);
}

html[data-trygc-page="index"] #root :where(button, input, select, textarea) { font-family: inherit; }
html[data-trygc-page="index"] #root :where(h1, h2, h3, h4) { font-family: var(--font-condensed); letter-spacing: -.035em; }
html[data-trygc-page="index"] #root :where(button, a, input, select, textarea, [role="button"]):focus-visible { outline: 3px solid color-mix(in srgb, var(--gc-orange) 35%, transparent); outline-offset: 2px; }
html[data-trygc-page="index"] #root :where(button, [role="button"], a[href]) { transition: transform .16s ease, border-color .16s ease, background-color .16s ease, box-shadow .16s ease; }
html[data-trygc-page="index"] #root :where(button, [role="button"]):not(:disabled):hover { border-color: color-mix(in srgb, var(--gc-orange) 45%, var(--border)); }

/* Neutral primitives retain a single card, border, and type treatment across feature pages. */
html[data-trygc-page="index"] #root :where(.bg-card, .bg-background, .bg-white) { border-color: var(--border); }
html[data-trygc-page="index"] #root :where(.text-foreground, .text-slate-900, .text-slate-800) { color: var(--foreground); }
html[data-trygc-page="index"] #root :where(.text-muted-foreground, .text-slate-500, .text-slate-600) { color: var(--muted-foreground); }
html[data-trygc-page="index"] #root :where(.text-gc-orange, .text-orange-600, .text-orange-700) { color: var(--gc-orange); }
html[data-trygc-page="index"] #root :where(.bg-gc-orange, .bg-orange-600) { background-color: var(--gc-orange); }
html[data-trygc-page="index"] #root :where(.border-gc-orange, .border-orange-600) { border-color: var(--gc-orange); }

html[data-trygc-page="index"].dark #root nav :where(a, button),
html[data-trygc-page="index"][data-theme="dark"] #root nav :where(a, button) { color: var(--gcui-text-2); }

@media (prefers-reduced-motion: reduce) {
  html[data-trygc-page="index"] #root *, html[data-trygc-page="index"] #root *::before, html[data-trygc-page="index"] #root *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}
