/* Veo Forest & Gold theme (mirrors VeoStoryStudio src/theme/tokens.ts). ASCII only. */
@import url("https://fonts.googleapis.com/css2?family=Playfair+Display:wght@600;700&family=Inter:wght@400;500;600;700;800&display=swap");

:root {
  color-scheme: dark;
  --gg-forest: #0A1D13; --gg-deep: #050B08; --gg-lift: #10301F; --gg-emerald: #1F7A4D;
  --gg-gold: #D4AF37; --gg-gold-light: #F3D27A; --gg-gold-deep: #A8862A; --gg-ink: #1A1405;
  --gg-sheet: #0F2619; --gg-card-solid: #132E1F; --gg-text-soft: #D3DCD6;
  --primary: #D4AF37 !important;
  --primary-hover: #A8862A !important;
  --primary-soft: rgba(212, 175, 55, 0.14) !important;
  --sidebar-bg: #0A1D13 !important;
  --sidebar-text: #D3DCD6 !important;
  --sidebar-active-bg: rgba(212, 175, 55, 0.14) !important;
  --sidebar-active-text: #F3D27A !important;
  --page-bg: #0A1D13 !important;
  --card-bg: #132E1F !important;
  --border: rgba(255, 255, 255, 0.10) !important;
  --text-main: #F4F1E8 !important;
  --text-muted: #A3B3A9 !important;
  --success: #4ADE80 !important;
  --warning: #F5B544 !important;
  --danger: #F87171 !important;
  --bg: #0A1D13 !important;
  --bg-2: #132E1F !important;
  --panel: #132E1F !important;
  --ink: #F4F1E8 !important;
  --text: #F4F1E8 !important;
  --muted: #A3B3A9 !important;
  --primary-2: #A8862A !important;
  --accent: #D4AF37 !important;
  --accent-2: #A8862A !important;
  --tint-blue: rgba(212, 175, 55, 0.10) !important;
  --tint-pink: rgba(212, 175, 55, 0.10) !important;
  --btn: #D4AF37 !important;
  --btn-ink: #1A1405 !important;
  --line: rgba(255, 255, 255, 0.10) !important;
  --ok: #4ADE80 !important;
  --warn: #F5B544 !important;
  --bad: #F87171 !important;
  --primary-rgb: 212, 175, 55 !important;
  --accent-rgb: 212, 175, 55 !important;
  --shadow: 0 8px 28px rgba(0, 0, 0, 0.35) !important;
  --font-display: "Playfair Display", Georgia, "Times New Roman", serif !important;
  --font-body: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif !important;
  --radius: 18px !important;
}

html, body {
  color-scheme: dark !important;
  background: linear-gradient(180deg, #0E2A1B 0%, #0A1D13 35%, #07130D 70%, #050B08 100%) fixed !important;
  background-color: #0A1D13 !important;
  color: #F4F1E8 !important;
  font-family: var(--font-body) !important;
}
a { color: #F3D27A; }
::selection { background: rgba(212, 175, 55, 0.35); color: #F4F1E8; }

/* Sidebar */
.studio-side {
  background: radial-gradient(420px 220px at 0% 0%, rgba(212, 175, 55, 0.16), transparent 60%), linear-gradient(180deg, #0E2A1B, #050B08) !important;
  color: #D3DCD6 !important;
  border-right: 1px solid rgba(255, 255, 255, 0.08) !important;
}
.side-brand { background: transparent !important; border-bottom-color: rgba(255, 255, 255, 0.08) !important; }
.side-brand .brand, .side-who-copy strong { color: #F4F1E8 !important; }
.side-nav-label { color: #A3B3A9 !important; letter-spacing: 0.18em !important; }
.side-link { color: #D3DCD6 !important; border-radius: 12px !important; }
.side-link:hover, .side-link.is-active { background: rgba(212, 175, 55, 0.14) !important; color: #F3D27A !important; border-color: rgba(212, 175, 55, 0.30) !important; }
.side-link.is-active .side-link-mark { background: #D4AF37 !important; color: #1A1405 !important; }
.side-foot { border-top-color: rgba(255, 255, 255, 0.08) !important; }
.side-who-copy span { color: #A3B3A9 !important; }

/* Header */
.studio-head { background: rgba(7, 19, 12, 0.92) !important; border-bottom-color: rgba(255, 255, 255, 0.10) !important; color: #F4F1E8 !important; }
.studio-head h1, .panel h2, h1, h2, h3 { font-family: var(--font-display) !important; letter-spacing: -0.01em !important; text-transform: none !important; color: #F4F1E8; }
.studio-head h1 { font-size: 1.35rem !important; }

/* Buttons: gold gradient, ink text */
.btn, button.btn, .btn-primary {
  background: linear-gradient(180deg, #F3D27A, #D4AF37 55%, #B8922C) !important;
  color: #1A1405 !important; border-color: #A8862A !important;
  border-radius: 999px !important; font-weight: 700 !important;
  box-shadow: 0 4px 12px rgba(212, 175, 55, 0.25);
}
.btn:hover { background: linear-gradient(180deg, #D9B85F, #B8962E 55%, #9C7A22) !important; }
.btn-secondary, .btn-ghost, .btn.btn-secondary, .btn.btn-ghost {
  background: rgba(255, 255, 255, 0.08) !important; color: #F4F1E8 !important;
  border: 1px solid rgba(255, 255, 255, 0.16) !important; box-shadow: none !important; border-radius: 999px !important;
}
.btn-danger, .btn.btn-danger { background: #7F1D1D !important; color: #FEE2E2 !important; border-color: #E5534B !important; }

/* Surfaces */
.panel, .table-wrap, .note-panel, .note-panel:not([hidden]), .house-dlg-panel, .ag-preview-panel, .ag-card, .pa-preview,
.ov-widget, .ov-bridge-row, .wk-card, .pay-card, .bill-card, .wk-rules li, .wk-ref-apps-list li,
.sr-stat, .stat, .cost-box div, .sr-hub-create, .sr-hub-nav-item, .sr-hub-workers, .sr-hub-dest-group,
.sr-inbox-row, .sr-inbox-compose, .hm-row, .hm-msg, .sr-platform-toggles, .hw-midday-list li, .hw-steps li,
.ag-pick, button.ag-pick, .ag-card-meta div, .ag-signed-callout, .ag-signed-banner, .ag-rate-chip, .ag-empty-mark {
  background: #132E1F !important; border-color: rgba(255, 255, 255, 0.10) !important; color: #F4F1E8 !important;
}
.panel, .table-wrap, .note-panel { border-radius: 22px !important; box-shadow: var(--shadow) !important; }
.panel h2 { font-size: 1.25rem !important; border-bottom-color: rgba(255, 255, 255, 0.08) !important; }
.note-panel-head, .house-dlg-head, .house-dlg-foot, .ag-preview-subject, .ag-preview-foot { background: #0F2619 !important; border-color: rgba(255, 255, 255, 0.10) !important; color: #F4F1E8 !important; }
.wk-card, .bill-card { background: radial-gradient(420px 140px at 100% 0%, rgba(212, 175, 55, 0.10), transparent 60%), #132E1F !important; }
.wk-card.is-manager, .bill-card.is-ok { background: radial-gradient(420px 140px at 100% 0%, rgba(74, 222, 128, 0.12), transparent 60%), #132E1F !important; }
.ov-widget-bridge { background: linear-gradient(180deg, #10301F, #132E1F) !important; border-color: rgba(74, 222, 128, 0.35) !important; }
.ov-widget-val { color: #D4AF37 !important; font-size: 1.7rem !important; }
.sr-stat-accent { background: linear-gradient(180deg, rgba(212, 175, 55, 0.18), #132E1F) !important; border-color: rgba(212, 175, 55, 0.45) !important; }
.sr-stat strong, .stat strong, .ov-widget-val, .bill-amt, .pay-card-due strong { font-family: var(--font-display) !important; }
.pay-card.is-due { background: linear-gradient(90deg, rgba(245, 181, 68, 0.16), #132E1F) !important; border-color: rgba(245, 181, 68, 0.5) !important; }
.ag-preview-frame { background: #FFFFFF !important; } /* document preview stays paper-white */

/* Heroes */
.sr-hero, .ov-hero, .set-hero, .sr-pulse, .auth-card { position: relative; overflow: hidden; border-radius: 26px !important; box-shadow: 0 22px 48px rgba(0, 0, 0, 0.45) !important; }
.sr-hero, .ov-hero, .set-hero {
  color: #F4F1E8 !important; border: 1px solid rgba(212, 175, 55, 0.22) !important;
  background: radial-gradient(520px 260px at 100% 120%, rgba(212, 175, 55, 0.38), transparent 60%), linear-gradient(120deg, #0F3A24 0%, #145032 55%, #2F4A26 100%) !important;
}
.sr-kicker, .sr-pulse-kicker, .ov-hero .sr-kicker, .set-hero .sr-kicker { color: #F3D27A !important; }
.sr-hero-title, .sr-pulse-title, .ov-hero h2, .set-hero h2, .auth-subtitle { font-family: var(--font-display) !important; color: #F4F1E8 !important; text-transform: none !important; }
.sr-hero-title em, .sr-pulse-title em { color: #F3D27A !important; font-style: italic !important; }
.sr-hero-sub, .sr-pulse-sub, .ov-hero p, .set-hero p { color: #D3DCD6 !important; }

/* Tables */
th, .data-table th, .sr-platform-th, .sr-hub-dest-mark-th { background: #0F2619 !important; color: #D4AF37 !important; letter-spacing: 0.1em !important; border-color: rgba(255, 255, 255, 0.10) !important; }
td { border-color: rgba(255, 255, 255, 0.08) !important; color: #F4F1E8; }
tbody tr:nth-child(even) td, tbody tr:nth-child(even) { background: rgba(255, 255, 255, 0.025) !important; }
table tr:hover td { background: rgba(212, 175, 55, 0.07) !important; }

/* Pills */
.wk-pill, .badge, .ov-bridge-badge, .sr-status { border-radius: 999px !important; font-weight: 800 !important; }
.ov-bridge-badge, .sr-status-muted, .ag-status-pill.ag-draft { background: rgba(255, 255, 255, 0.08) !important; color: #D3DCD6 !important; }
.wk-avatar { background: #0A1D13 !important; color: #F3D27A !important; border: 1px solid rgba(212, 175, 55, 0.4) !important; }

/* Forms */
input, select, textarea, .ag-fields .sr-field input, .ag-fields .sr-field textarea, .ag-fields .sr-field select {
  background-color: rgba(255, 255, 255, 0.05) !important; color: #F4F1E8 !important; border-color: rgba(255, 255, 255, 0.14) !important;
}
input[type="checkbox"], input[type="radio"], input[type="range"] { accent-color: #D4AF37; }
input[type="color"], .pa-color-row input[type="color"] { background-color: transparent !important; }
select option { background: #0F2619; color: #F4F1E8; }
input::placeholder, textarea::placeholder { color: #9DAEA3 !important; }
input:focus, select:focus, textarea:focus { outline: 2px solid rgba(212, 175, 55, 0.55) !important; outline-offset: 1px; border-color: #D4AF37 !important; }
.sr-hub-switch::after { background: #F4F1E8 !important; }

/* Auth */
.auth-screen-admin { background: radial-gradient(1000px 480px at 10% -10%, rgba(212, 175, 55, 0.22), transparent 50%), linear-gradient(180deg, #0E2A1B, #050B08) !important; }
.auth-screen-staff { background: linear-gradient(180deg, #102618, #0a1810) !important; }
.auth-screen-staff .auth-card-staff { border-color: rgba(255,255,255,0.12) !important; box-shadow: 0 12px 32px rgba(0,0,0,0.35) !important; }
.auth-card { background: rgba(16, 42, 28, 0.88) !important; border: 1px solid rgba(212, 175, 55, 0.25) !important; color: #F4F1E8 !important; }

/* Upload-quality page (inline <style> in upload-quality-ui.js) */
.uq-page { color: #F4F1E8 !important; --display: "Playfair Display", Georgia, serif !important; }

/* Developer Console: re-point its private tokens (dev-console-ui.js stays untouched) */
.dcx {
  --dc-badbg: rgba(229, 83, 75, 0.16) !important; --dc-badtx: #FCA5A5 !important;
  --dc-okbg: rgba(74, 222, 128, 0.14) !important; --dc-oktx: #86EFAC !important;
  --dc-warnbg: rgba(245, 181, 68, 0.16) !important; --dc-warntx: #FCD58A !important;
  --dc-neubg: rgba(255, 255, 255, 0.08) !important; --dc-neutx: #D3DCD6 !important;
  --dc-line2: rgba(255, 255, 255, 0.16) !important; --dc-zebra: rgba(255, 255, 255, 0.03) !important;
  --dc-sub: #A3B3A9 !important; --dc-th: #D4AF37 !important;
}

/* Boot bar */
.studio-boot { padding: 1.4rem 1.2rem; }
.studio-boot-bar { margin-top: .85rem; height: 6px; border-radius: 99px; overflow: hidden; background: rgba(255, 255, 255, 0.10); }
.studio-boot-bar::after { content: ""; display: block; height: 100%; width: 40%; background: linear-gradient(90deg, #A8862A, #F3D27A); animation: studioBootSlide 1s ease-in-out infinite; }
@keyframes studioBootSlide { 0% { transform: translateX(-40%); } 100% { transform: translateX(280%); } }
@media (max-width: 900px) { .sr-hero, .ov-hero, .set-hero { padding: 1.15rem !important; } }
@media print { html, body { background: #fff !important; color: #000 !important; } }

/* Leftover pale surfaces -> forest/gold (rename pass 2026-10-12). QR/receipts/doc previews stay white. */
.sr-hub-dest-row, .sr-hub-dest-row.sr-hub-group-row, .sr-platform-toggles > .sr-platform-toggle { background: transparent !important; color: #F4F1E8 !important; border-bottom-color: rgba(255, 255, 255, 0.08) !important; }
.sr-hub-dest-row:active { background: rgba(212, 175, 55, 0.06) !important; }
.sr-hub-dest-row:has(input:checked), .sr-hub-dest-row.sr-hub-group-row:has(input:checked), .sr-platform-toggles > .sr-platform-toggle:has(input:checked) { background: rgba(212, 175, 55, 0.10) !important; }
.sr-hub-dest-row:has(input:checked) .sr-hub-switch { background: #1F7A4D !important; }
.sr-hub-dest-row:focus-within .sr-hub-switch { box-shadow: 0 0 0 3px rgba(212, 175, 55, 0.35) !important; }
.pay-strip-stat { background: #0F2619 !important; border-color: rgba(255, 255, 255, 0.10) !important; }
.pay-strip-stat strong { color: #F4F1E8 !important; }
.pay-strip-stat span { color: #A3B3A9 !important; }
.pay-strip-stat.is-accent { background: rgba(212, 175, 55, 0.12) !important; border-color: rgba(212, 175, 55, 0.40) !important; }
.pay-strip-stat.is-accent strong { color: #F3D27A !important; }
.ag-steps li { background: rgba(255, 255, 255, 0.05) !important; border-color: rgba(255, 255, 255, 0.12) !important; color: #D3DCD6 !important; }
.ag-steps strong { background: #D4AF37 !important; color: #1A1405 !important; }
.sr-pulse, .ov-pulse {
  background: radial-gradient(640px 220px at 100% 0%, rgba(212, 175, 55, 0.14), transparent 55%), radial-gradient(520px 200px at 0% 100%, rgba(31, 122, 77, 0.22), transparent 50%), linear-gradient(160deg, #132E1F, #0A1D13) !important;
  border-color: rgba(212, 175, 55, 0.22) !important; color: #F4F1E8 !important;
}
.sr-pulse-bar { background: rgba(255, 255, 255, 0.10) !important; border-color: rgba(255, 255, 255, 0.12) !important; }
.sr-pulse-legend { color: #A3B3A9 !important; }

/* Pass 2: staff-pay summary strip + Producer Social "Posting lanes" rows */
.pay-strip {
  background: radial-gradient(700px 180px at 0% 0%, rgba(212, 175, 55, 0.12), transparent 55%), linear-gradient(145deg, #132E1F, #0A1D13) !important;
  border-color: rgba(212, 175, 55, 0.28) !important;
}
.sr-social-health-row { background: #0F2619 !important; border-color: rgba(255, 255, 255, 0.10) !important; color: #F4F1E8 !important; }
.sr-social-health-row.is-ready { border-color: rgba(74, 222, 128, 0.30) !important; }
.sr-social-health-row.is-off { background: rgba(248, 113, 113, 0.10) !important; border-color: rgba(248, 113, 113, 0.35) !important; }
.sr-social-health-copy strong { color: #F4F1E8 !important; }
.sr-social-health-copy span { color: #A3B3A9 !important; }
.sr-social-health-plat { background: rgba(212, 175, 55, 0.14) !important; color: #F3D27A !important; border-color: rgba(212, 175, 55, 0.40) !important; }

/* EDITORFIX 2026-10-18: Queue editor drawer (Scheduled Reels + Scheduled Posts) used a hard-coded white gradient
   (styles.css .sr-drawer) under the theme's light text. Dark forest sheet, light text, dark inputs, gold accents. */
.sr-drawer { background: linear-gradient(180deg, #10301F 0%, #0F2619 40%, #0A1D13 100%) !important; color: #F4F1E8 !important; border-left: 1px solid rgba(212, 175, 55, 0.25) !important; }
.sr-drawer .sr-drawer-head, .sr-drawer .sr-drawer-foot { border-color: rgba(255, 255, 255, 0.10) !important; background: transparent !important; }
.sr-drawer .sr-kicker { color: #D4AF37 !important; }
.sr-drawer .sr-drawer-title { color: #F3D27A !important; }
.sr-drawer .sr-drawer-sub, .sr-drawer .meta, .sr-drawer .field-hint, .sr-drawer small { color: #C3CFC7 !important; }
.sr-drawer label, .sr-drawer .sr-field > span, .sr-drawer .sr-label, .sr-drawer legend, .sr-drawer h3, .sr-drawer strong { color: #E9E4D4 !important; }
.sr-drawer input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]), .sr-drawer textarea, .sr-drawer select {
  background: #071510 !important; color: #F4F1E8 !important; border: 1px solid rgba(212, 175, 55, 0.30) !important; -webkit-text-fill-color: #F4F1E8;
}
.sr-drawer input::placeholder, .sr-drawer textarea::placeholder { color: #8FA197 !important; -webkit-text-fill-color: #8FA197; }
.sr-drawer input[type="datetime-local"], .sr-drawer input[type="date"], .sr-drawer input[type="time"] { color-scheme: dark; }
.sr-drawer .sr-drawer-close { background: rgba(212, 175, 55, 0.12) !important; color: #F3D27A !important; border-color: rgba(212, 175, 55, 0.35) !important; }
.sr-drawer .sr-msg { color: #E9E4D4; }