/* ============================================================
   hub-gold.css — brand theme for hub.gptclaudegemini.xyz (new-api)
   Own theme, authored for our variable scheme (shadcn-style vars),
   inspired by warm "AI ops" half-tones; no third-party code.

   DARK: our brown-gold identity (matches codex-docs /
   statistics.gptclaudegemini.xyz): #0d0d0d canvas, #f9c95d gold,
   #f5f1e8 cream. Same family as console kimi-gold.
   LIGHT: warm ivory half-tones — olive-cast canvas #f4f3ec,
   green-gray ink #22261f / #6d7266, deep gold #dfa51f.

   The stock new-api toggle keeps working (newapi:theme:v1:mode).
   ============================================================ */

/* ---------- DARK MODE (our brown-gold) ---------- */
html.dark {
  color-scheme: dark;
  --background: #0d0d0d;
  --foreground: #f5f1e8;
  --card: rgba(27, 23, 18, 0.92);
  --card-foreground: #f5f1e8;
  --popover: #171310;
  --popover-foreground: #f5f1e8;
  --primary: #f9c95d;
  --primary-foreground: #1b1409;
  --secondary: #241d14;
  --secondary-foreground: #ffe2a8;
  --muted: #1a1611;
  --muted-foreground: #a79d8b;
  --accent: #f9c95d;
  --accent-foreground: #1b1409;
  --destructive: #ff776f;
  --destructive-foreground: #1a0f0d;
  --success: #72e0a5;
  --success-foreground: #0d1a12;
  --warning: #f6bd45;
  --warning-foreground: #1b1409;
  --info: #e8d5a0;
  --info-foreground: #1b1409;
  --neutral: #857761;
  --neutral-foreground: #f5f1e8;
  --border: rgba(249, 201, 93, 0.14);
  --input: rgba(249, 201, 93, 0.18);
  --ring: #f9c95d;
  --chart-1: #f9c95d;
  --chart-2: #d9912f;
  --chart-3: #72e0a5;
  --chart-4: #ff776f;
  --chart-5: #f4efe3;
  --overview-accent-1: #f9c95d;
  --overview-accent-2: #d9912f;
  --overview-accent-3: #72e0a5;
  --sidebar: #120e09;
  --sidebar-foreground: #f5f1e8;
  --sidebar-primary: #f9c95d;
  --sidebar-primary-foreground: #1b1409;
  --sidebar-accent: rgba(249, 201, 93, 0.12);
  --sidebar-accent-foreground: #ffe2a8;
  --sidebar-border: rgba(249, 201, 93, 0.12);
  --sidebar-ring: #f9c95d;
  --skeleton-base: #1a1611;
  --skeleton-highlight: #241d14;
  --table-row: #0d0d0d;
  --table-header: #17130c;
}

html.dark body {
  background:
    radial-gradient(1100px 700px at 12% -8%, rgba(217, 145, 47, 0.16), transparent 60%),
    radial-gradient(900px 620px at 88% -6%, rgba(249, 201, 93, 0.07), transparent 55%),
    #0d0d0d;
  background-attachment: fixed;
  color: #f5f1e8;
}

/* landing decorative overlay: stock ships blue/cyan radial glows —
   replace with warm gold so nothing outside the brandbook shows */
[class*="pointer-events-none"][class*="inset-0"][class*="-z-10"] {
  background-image:
    radial-gradient(60% 50% at 20% 20%, rgba(217, 145, 47, 0.28) 0%, transparent 70%),
    radial-gradient(50% 40% at 80% 15%, rgba(249, 201, 93, 0.14) 0%, transparent 70%),
    radial-gradient(40% 35% at 40% 80%, rgba(217, 145, 47, 0.12) 0%, transparent 70%) !important;
}
html.light [class*="pointer-events-none"][class*="inset-0"][class*="-z-10"] {
  background-image: none !important;
  background-color: transparent !important;
}

/* dark-only patches for hardcoded light utilities */
html.dark .bg-white\/95,
html.dark .bg-white\/90,
html.dark .bg-white\/80,
html.dark .bg-white\/70,
html.dark .bg-white {
  background-color: rgba(24, 20, 15, 0.92) !important;
}
html.dark [class*="bg-white/"] { backdrop-filter: blur(8px); }
html.dark .bg-muted\/20,
html.dark .bg-muted\/30 { background-color: rgba(26, 22, 17, 0.4) !important; }
html.dark .text-slate-900, html.dark .text-slate-800,
html.dark .text-zinc-900, html.dark .text-gray-900, html.dark .text-gray-800 { color: #f5f1e8 !important; }
html.dark .text-slate-700, html.dark .text-slate-600,
html.dark .text-zinc-700, html.dark .text-zinc-600,
html.dark .text-gray-700, html.dark .text-gray-600 { color: #c9bfab !important; }
html.dark .text-slate-500, html.dark .text-slate-400,
html.dark .text-zinc-500, html.dark .text-zinc-400,
html.dark .text-gray-500, html.dark .text-gray-400 { color: #857761 !important; }

html.dark [class*="bg-gradient-to-r"][class*="bg-clip-text"] {
  background-image: linear-gradient(90deg, #ffe2a8, #f9c95d 45%, #d9912f) !important;
  -webkit-background-clip: text;
  background-clip: text;
}

html.dark ::-webkit-scrollbar { width: 10px; height: 10px; }
html.dark ::-webkit-scrollbar-track { background: transparent; }
html.dark ::-webkit-scrollbar-thumb { background: #2b2418; border-radius: 8px; border: 2px solid #0d0d0d; }
html.dark ::-webkit-scrollbar-thumb:hover { background: #4a3c22; }

html.dark ::selection { background: rgba(249, 201, 93, 0.3); color: #f5f1e8; }

/* brand police: stock ships Tailwind blue accents — recolor to gold */
html.dark [class*="text-blue-"] { color: #ffe2a8 !important; }
html.dark [class*="bg-blue-"] { background-color: rgba(249, 201, 93, 0.45) !important; }
html.dark [class*="border-blue-"] { border-color: rgba(249, 201, 93, 0.3) !important; }
html.dark [class*="ring-blue-"], html.dark [class*="from-blue-"], html.dark [class*="via-blue-"] { --tw-ring-color: rgba(249,201,93,.4); }
html.dark [class*="from-blue-"][class*="bg-clip-text"],
html.dark [class*="from-violet-"][class*="bg-clip-text"],
html.dark [class*="from-indigo-"][class*="bg-clip-text"] {
  background-image: linear-gradient(90deg, #ffe2a8, #f9c95d 45%, #d9912f) !important;
  -webkit-background-clip: text;
  background-clip: text;
}

/* accent police part 2: emerald/sky/violet/green remnants → brand family */
html.dark [class*="text-emerald-"] { color: #72e0a5 !important; }
html.dark [class*="text-green-"] { color: #72e0a5 !important; }
html.dark [class*="text-sky-"], html.dark [class*="text-cyan-"] { color: #e8d5a0 !important; }
html.dark [class*="text-violet-"], html.dark [class*="text-purple-"], html.dark [class*="text-indigo-"] { color: #ffe2a8 !important; }
html.dark [class*="bg-emerald-"], html.dark [class*="bg-green-"] { background-color: rgba(114, 224, 165, 0.4) !important; }
html.dark [class*="bg-violet-"], html.dark [class*="bg-purple-"], html.dark [class*="bg-indigo-"] { background-color: rgba(249, 201, 93, 0.4) !important; }
html.dark [class*="border-emerald-"], html.dark [class*="border-green-"] { border-color: rgba(114, 224, 165, 0.5) !important; }
html.dark [class*="border-violet-"], html.dark [class*="border-purple-"], html.dark [class*="border-indigo-"] { border-color: rgba(249, 201, 93, 0.5) !important; }

/* ---------- LIGHT MODE (warm cream, beige-gold family) ---------- */
html.light {
  color-scheme: light;
  --background: #f6f1e4;
  --foreground: #2b2114;
  --card: #ffffff;
  --card-foreground: #2b2114;
  --popover: #fffdf8;
  --popover-foreground: #2b2114;
  --primary: #dfa51f;
  --primary-foreground: #241a06;
  --secondary: #f6efdd;
  --secondary-foreground: #7a5c1e;
  --muted: #f5efe0;
  --muted-foreground: #8a7b5f;
  --accent: #f6efdc;
  --accent-foreground: #7a5c1e;
  --destructive: #d95c4a;
  --destructive-foreground: #fffaf7;
  --success: #4e9e77;
  --success-foreground: #f2fff8;
  --warning: #d9912f;
  --warning-foreground: #241a06;
  --info: #8a7b5f;
  --info-foreground: #fffdf5;
  --neutral: #a79d8b;
  --neutral-foreground: #2b2114;
  --border: #ece3cf;
  --input: #e2d8c0;
  --ring: #c98f1b;
  --chart-1: #dfa51f;
  --chart-2: #b7791f;
  --chart-3: #4e9e77;
  --chart-4: #d95c4a;
  --chart-5: #8a7b5f;
  --overview-accent-1: #dfa51f;
  --overview-accent-2: #b7791f;
  --overview-accent-3: #4e9e77;
  --sidebar: #fbf7ec;
  --sidebar-foreground: #2b2114;
  --sidebar-primary: #c98f1b;
  --sidebar-primary-foreground: #241a06;
  --sidebar-accent: #f6efdd;
  --sidebar-accent-foreground: #7a5c1e;
  --sidebar-border: #efe5d0;
  --sidebar-ring: #c98f1b;
  --skeleton-base: #f0e9d6;
  --skeleton-highlight: #faf5e8;
  --table-row: #fffcf4;
  --table-header: #f6efdd;
}

html.light body {
  background:
    radial-gradient(1100px 640px at 14% -8%, rgba(223, 165, 31, 0.15), transparent 58%),
    radial-gradient(900px 560px at 86% -6%, rgba(255, 196, 103, 0.12), transparent 55%),
    radial-gradient(1200px 520px at 50% 10%, rgba(255, 255, 255, 0.85), transparent 62%),
    linear-gradient(180deg, #f7f2e6, #f3eddd);
  background-attachment: fixed;
  color: #2b2114;
}

/* headline gradient: bronze for contrast on ivory */
html.light [class*="bg-gradient-to-r"][class*="bg-clip-text"] {
  background-image: linear-gradient(90deg, #b7791f, #d9912f 50%, #8a5a12) !important;
  -webkit-background-clip: text;
  background-clip: text;
}

html.light ::-webkit-scrollbar { width: 10px; height: 10px; }
html.light ::-webkit-scrollbar-track { background: transparent; }
html.light ::-webkit-scrollbar-thumb { background: #dcd8c8; border-radius: 8px; border: 2px solid #f4f3ec; }
html.light ::-webkit-scrollbar-thumb:hover { background: #c9c5b0; }

html.light ::selection { background: rgba(223, 165, 31, 0.3); color: #22261f; }

html.light [class*="text-blue-"] { color: #8a5a12 !important; }
html.light [class*="bg-blue-"] { background-color: rgba(217, 145, 47, 0.4) !important; }
html.light [class*="border-blue-"] { border-color: rgba(217, 145, 47, 0.35) !important; }
html.light [class*="from-blue-"][class*="bg-clip-text"],
html.light [class*="from-violet-"][class*="bg-clip-text"],
html.light [class*="from-indigo-"][class*="bg-clip-text"] {
  background-image: linear-gradient(90deg, #b7791f, #d9912f 50%, #8a5a12) !important;
  -webkit-background-clip: text;
  background-clip: text;
}

/* accent police part 2: emerald/sky/violet/green remnants → brand family */
html.light [class*="text-emerald-"], html.light [class*="text-green-"] { color: #3f8a67 !important; }
html.light [class*="text-sky-"], html.light [class*="text-cyan-"] { color: #8a6d2f !important; }
html.light [class*="text-violet-"], html.light [class*="text-purple-"], html.light [class*="text-indigo-"] { color: #8a5a12 !important; }
html.light [class*="bg-emerald-"], html.light [class*="bg-green-"] { background-color: rgba(78, 158, 119, 0.35) !important; }
html.light [class*="bg-violet-"], html.light [class*="bg-purple-"], html.light [class*="bg-indigo-"] { background-color: rgba(217, 145, 47, 0.35) !important; }
html.light [class*="border-emerald-"], html.light [class*="border-green-"] { border-color: rgba(78, 158, 119, 0.5) !important; }
html.light [class*="border-violet-"], html.light [class*="border-purple-"], html.light [class*="border-indigo-"] { border-color: rgba(217, 145, 47, 0.5) !important; }

/* ---------- depth & glass layer v2 (рецепты сняты computed-стилями
   с orvexa-react и codex-docs: диагональный стеклянный градиент,
   blur+saturate, двойной inner-блик, золотые пилюли и код-чипы) ---------- */

/* карточки: фарфор на креме — крупный радиус, тёплая тень, блики кромок */
html.light div[class*="rounded-xl"][class*="border"]:not([class*="bg-gradient"]),
html.light div[class*="rounded-2xl"][class*="border"]:not([class*="bg-gradient"]),
html.light div[class*="rounded-3xl"][class*="border"]:not([class*="bg-gradient"]) {
  border-radius: 20px !important;
  background-image: linear-gradient(145deg, rgba(255, 255, 255, 0.99), rgba(255, 252, 244, 0.92)) !important;
  box-shadow:
    0 22px 50px -22px rgba(148, 113, 40, 0.22),
    0 2px 10px -6px rgba(148, 113, 40, 0.1),
    inset 0 1px 0 rgba(255, 255, 255, 0.96),
    inset 0 -1px 0 rgba(255, 255, 255, 0.55) !important;
}
html.dark div[class*="rounded-xl"][class*="border"]:not([class*="bg-gradient"]),
html.dark div[class*="rounded-2xl"][class*="border"]:not([class*="bg-gradient"]),
html.dark div[class*="rounded-3xl"][class*="border"]:not([class*="bg-gradient"]) {
  background-image: linear-gradient(145deg, rgba(42, 33, 20, 0.5), rgba(16, 13, 9, 0.3)) !important;
  box-shadow:
    0 16px 44px rgba(0, 0, 0, 0.35),
    0 2px 8px -2px rgba(0, 0, 0, 0.3),
    inset 0 1px 0 rgba(249, 201, 93, 0.13),
    inset 0 -1px 0 rgba(255, 255, 255, 0.03) !important;
  -webkit-backdrop-filter: blur(24px) saturate(1.35) !important;
  backdrop-filter: blur(24px) saturate(1.35) !important;
}

/* строки таблиц: стеклянные ряды, золотой ховер */
html.dark tbody tr { background-color: transparent; }
html.dark tbody tr:hover { background-color: rgba(249, 201, 93, 0.05) !important; }
html.light tbody tr:hover { background-color: rgba(217, 145, 47, 0.05) !important; }

/* топбар и плавающие панели: тёплое стекло */
header [class*="backdrop-blur"] {
  background-color: rgba(252, 251, 244, 0.72) !important;
  -webkit-backdrop-filter: blur(22px) saturate(1.5) !important;
  backdrop-filter: blur(22px) saturate(1.5) !important;
  border-bottom: 1px solid rgba(226, 224, 210, 0.7);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8);
}
html.dark header [class*="backdrop-blur"] {
  background-color: rgba(19, 15, 10, 0.72) !important;
  border-bottom-color: rgba(249, 201, 93, 0.12);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
}
html.light [class*="sticky"][class*="top-0"]:not(header) {
  -webkit-backdrop-filter: blur(22px) saturate(1.5);
  backdrop-filter: blur(22px) saturate(1.5);
}

/* сайдбар консоли: тёплый градиент + тень от кромки + золотая линия */
html.light aside[class*="fixed"], html.light aside[class*="sticky"] {
  background-image: linear-gradient(180deg, rgba(255, 255, 255, 0.65), rgba(250, 249, 242, 0.4)) !important;
  -webkit-backdrop-filter: blur(20px) saturate(1.35) !important;
  backdrop-filter: blur(20px) saturate(1.35) !important;
  border-right: 1px solid rgba(226, 224, 210, 0.7) !important;
  box-shadow: 14px 0 44px -18px rgba(66, 78, 69, 0.14);
}
html.dark aside[class*="fixed"], html.dark aside[class*="sticky"] {
  background-image: linear-gradient(180deg, rgba(42, 33, 20, 0.35), rgba(10, 8, 5, 0.2)) !important;
  -webkit-backdrop-filter: blur(20px) saturate(1.3) !important;
  backdrop-filter: blur(20px) saturate(1.3) !important;
  border-right: 1px solid rgba(249, 201, 93, 0.1) !important;
  box-shadow: 18px 0 56px -20px rgba(0, 0, 0, 0.55);
}

/* главная кнопка: золотой градиент + тёплое свечение + inset-кольцо */
html.light a[class*="bg-primary"], html.light button[class*="bg-primary"],
html.light a[class*="bg-blue-"], html.light button[class*="bg-blue-"] {
  background-image: linear-gradient(145deg, #f0c356, var(--primary) 60%, #c98f1b) !important;
  box-shadow: 0 12px 26px -10px rgba(191, 127, 0, 0.55), inset 0 1px 0 rgba(255, 255, 255, 0.55) !important;
}
html.dark a[class*="bg-primary"], html.dark button[class*="bg-primary"],
html.dark a[class*="bg-blue-"], html.dark button[class*="bg-blue-"] {
  background-image: linear-gradient(145deg, #f6cd6b, #f9c95d 55%, #d9912f) !important;
  box-shadow: 0 14px 30px -12px rgba(249, 201, 93, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.4), inset 0 0 0 1px rgba(249, 201, 93, 0.22) !important;
}
a[class*="bg-primary"]:active, button[class*="bg-primary"]:active,
a[class*="bg-blue-"]:active, button[class*="bg-blue-"]:active {
  transform: translateY(1px) scale(0.99);
}

/* контурные кнопки и пилюли-вкладки: тёплые бежевые чипы, золотой ховер */
html.dark button[class*="rounded-full"]:not([class*="bg-primary"]):not([class*="bg-blue"]) {
  background-color: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.1);
}
html.light button[class*="rounded-full"]:not([class*="bg-primary"]):not([class*="bg-blue"]):not([class*="border-primary"]) {
  background-color: #f6efdd;
  border: 1px solid #ece3cf;
}
html.dark button[class*="border"]:not([class*="bg-primary"]):not([class*="bg-blue"]):hover {
  border-color: rgba(249, 201, 93, 0.4) !important;
  box-shadow: 0 8px 22px -10px rgba(0, 0, 0, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.06);
}
html.light button[class*="border"]:not([class*="bg-primary"]):not([class*="bg-blue"]):hover {
  border-color: rgba(217, 145, 47, 0.45) !important;
  box-shadow: 0 8px 22px -12px rgba(66, 78, 69, 0.2);
}

/* поля ввода: тёмное стекло / белые на креме с мягкой тенью */
html.dark input, html.dark textarea, html.dark select {
  background-color: rgba(255, 255, 255, 0.035) !important;
  border-color: rgba(255, 255, 255, 0.1) !important;
}
html.light input:not([type="checkbox"]):not([type="radio"]), html.light textarea, html.light select {
  background-color: #ffffff !important;
  border-color: #ece3cf !important;
  box-shadow: 0 8px 20px -14px rgba(148, 113, 40, 0.2);
}
html.light ::placeholder { color: #b3a68a; }

/* код: тёмная inset-панель + золотые инлайн-чипы */
html.dark pre {
  background-color: rgba(13, 11, 8, 0.85) !important;
  border: 1px solid rgba(249, 201, 93, 0.12);
  border-radius: 12px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04), inset 0 0 24px rgba(0, 0, 0, 0.4);
}
html.dark :not(pre) > code {
  background-color: rgba(249, 201, 93, 0.08) !important;
  border: 1px solid rgba(249, 201, 93, 0.16);
  border-radius: 8px;
  padding: 1px 6px;
  color: #ffe2a8;
}
html.light :not(pre) > code {
  background-color: rgba(217, 145, 47, 0.08) !important;
  border: 1px solid rgba(217, 145, 47, 0.22);
  border-radius: 8px;
  padding: 1px 6px;
  color: #8a5a12;
}

/* золотой скроллбар в тёмной */
html.dark ::-webkit-scrollbar-thumb { background: rgba(249, 201, 93, 0.26); border: 2px solid #0d0d0d; }
html.dark ::-webkit-scrollbar-thumb:hover { background: rgba(249, 201, 93, 0.42); }

/* фокус полей: мягкое золотое кольцо */
html.light input:focus-visible, html.light textarea:focus-visible,
html.light select:focus-visible {
  border-color: var(--ring) !important;
  box-shadow: 0 0 0 3px rgba(223, 165, 31, 0.18) !important;
}
html.dark input:focus-visible, html.dark textarea:focus-visible,
html.dark select:focus-visible {
  border-color: var(--ring) !important;
  box-shadow: 0 0 0 3px rgba(249, 201, 93, 0.22) !important;
}

/* ---------- shared: footer + landing trim ---------- */
footer .custom-footer ~ * { display: none !important; }
footer .custom-footer { padding: 0 !important; }
footer div[class*="rounded-2xl"][class*="bg-muted"] {
  padding: 6px 12px !important;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}
footer div[class*="py-5"] { padding-top: 4px !important; padding-bottom: 8px !important; }

div[class*="min-h-svh"] > div[class*="bg-muted/10"][class*="border-border/40"] ~ *:not(footer) {
  display: none !important;
}