/* ============================================================================
   Studio Labs — light-bridge.css  v1.0.0 (2026-10-23)
   Purpose: brings the legacy pages (login, register, dashboard, legal pages,
            suggestions, success, bot demos) onto the studio.css look by
            remapping the old portfolio.css / auth.css / dashboard.css tokens
            to the paper palette and serif/grotesk type. Load it LAST.
   Replaces: the dark green-on-black legacy theme on those pages.
   Deactivate-safe: yes — remove the <link> and the pages fall back to the
            old dark theme unchanged.
   ============================================================================ */

:root {
  /* portfolio.css tokens → studio palette */
  --green: #0f7a45;
  --green-dark: #0b5e35;
  --green-mid: #0f7a45;
  --green-dim: rgba(15,122,69,0.10);
  --green-glow: rgba(15,122,69,0.14);
  --green-border: rgba(15,122,69,0.35);
  --bg: #f6f3ec;
  --bg2: #efeadf;
  --bg3: #e9e3d6;
  --surface: #fffdf8;
  --card: #fffdf8;
  --border: #d9d2c2;
  --border-light: #cfc7b5;
  --text: #15140f;
  --text-muted: #5c584c;
  --text-dim: #6e695c;
  --grad: #0f7a45;
  --grad-text: linear-gradient(90deg, #0f7a45, #0f7a45);
  --grad-glow: none;
  --shadow-sm: 0 1px 2px rgba(21,20,15,.06);
  --shadow-md: 0 8px 24px -12px rgba(21,20,15,.25);
  --shadow-lg: 0 20px 40px -20px rgba(21,20,15,.3);
  --shadow-glow: none;
  --shadow-card: 0 0 0 1px #d9d2c2;
  --font: 'Inter Tight', 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --dark: #f6f3ec;
  --dark-surface: #efeadf;
  --dark-card: #fffdf8;
  --dark-border: #d9d2c2;
  --dark-hover: #e9e3d6;
  --accent: #0f7a45;
  --primary: #0f7a45;
  --primary-dark: #0b5e35;
  --gold-grad: #0f7a45;
  --accent-glow: rgba(15,122,69,0.10);
  /* bot-demo.css tokens */
  --white: #15140f;
}

html body { background: var(--paper, #f6f3ec); color: var(--ink, #15140f); font-family: var(--sans); }
body h1, body h2, body h3 { font-family: var(--serif); font-weight: 400; letter-spacing: -0.01em; color: var(--ink); }
body h1 { font-size: clamp(2.6rem, 6vw, 4.8rem); line-height: 1.02; }
body h2 { font-size: clamp(1.9rem, 3.6vw, 2.8rem); line-height: 1.08; }
body h3 { font-size: clamp(1.35rem, 2.2vw, 1.7rem); line-height: 1.15; }
body h4, body h5, body h6 { font-family: var(--sans); color: var(--ink); }
body p, body li, body td, body label { color: var(--ink-2); }

/* Gradient-text spans from the old theme → solid accent */
[style*="background-clip:text"], [style*="background-clip: text"], .gradient-text, .grad-text {
  background: none !important; -webkit-text-fill-color: var(--accent) !important; color: var(--accent) !important;
}

/* Old buttons → new pill buttons */
.btn-primary, .btn.btn-primary, button.btn-primary, .auth-btn, .btn-submit, .auth-submit {
  background: var(--ink) !important; color: var(--paper) !important; border: 1.5px solid var(--ink) !important;
  border-radius: 999px !important; box-shadow: none !important; font-family: var(--sans); font-weight: 600;
}
.btn-primary:hover, .auth-btn:hover, .btn-submit:hover, .auth-submit:hover { background: var(--accent) !important; border-color: var(--accent) !important; }
.btn-outline, .btn-secondary, .btn-ghost-old { background: transparent !important; color: var(--ink) !important; border: 1.5px solid var(--ink) !important; border-radius: 999px !important; }

/* Inputs */
body input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]),
body select, body textarea {
  background: var(--card) !important; color: var(--ink) !important; border: 1.5px solid var(--rule) !important; border-radius: 10px;
}
body input:focus, body select:focus, body textarea:focus { border-color: var(--accent) !important; outline: none; box-shadow: none !important; }
body ::placeholder { color: #8a8475; }

/* Cards / panels in the old theme */
.card, .auth-card, .dash-card, .stat-card, .legal-card, .project-card, .invoice-card {
  background: var(--card) !important; border-color: var(--rule) !important; box-shadow: none !important;
}

/* ── Auth pages (login / register) ─────────────────────────────────────── */
.auth-page { background: var(--paper) !important; }
.auth-layout { padding-top: 0 !important; min-height: calc(100vh - 105px); }
.auth-panel--brand { background: var(--paper-2) !important; border-right: 1px solid var(--rule) !important; }
.auth-panel--brand::before, .auth-panel--brand::after { display: none !important; }
.auth-panel--brand * { color: var(--ink) !important; }

/* ── Dashboard ─────────────────────────────────────────────────────────── */
.dashboard-body { background: var(--paper) !important; }
.dash-nav { background: rgba(246,243,236,.95) !important; border-bottom: 1px solid var(--rule) !important; backdrop-filter: blur(8px); }
.dash-nav a, .dash-nav span, .dash-nav button { color: var(--ink) !important; }
.dash-sidebar { background: var(--paper-2) !important; border-right: 1px solid var(--rule) !important; }
.dash-sidebar-nav a { color: var(--ink-2) !important; }
.dash-sidebar-nav a.active, .dash-sidebar-nav a:hover { background: var(--card) !important; color: var(--ink) !important; }

/* ── Legal + content pages ─────────────────────────────────────────────── */
.legal-page { max-width: 820px; margin: 0 auto; padding: clamp(48px, 8vw, 96px) var(--gutter); }
.legal-page h2 { margin-top: 2.2rem; }
.legal-page a { color: var(--accent); }

/* Old site footer/nav pieces that might remain inside content */
.section-label { color: var(--accent) !important; }
.hamburger { display: none !important; }

/* Bot demo pages */
.demo-sidebar, .sidebar { background: var(--paper-2) !important; border-color: var(--rule) !important; }
.chat-window, .chat-container { background: var(--card) !important; border-color: var(--rule) !important; }
.bot-message .message-content { background: var(--paper-2) !important; color: var(--ink) !important; border-color: var(--rule) !important; }
.user-message .message-content { background: var(--ink) !important; color: var(--paper) !important; }
.bot-avatar, .user-avatar { background: var(--accent-soft) !important; }

/* Legacy reveal animations were driven by js/portfolio.js, which these pages
   no longer load — show the content outright. */
.reveal, .reveal-left, .reveal-right, .reveal-scale, .stagger-reveal > * { opacity: 1 !important; transform: none !important; }

/* Dashboard brand */
.dash-nav .nav-logo { display: inline-flex; align-items: center; gap: 10px; font-family: var(--serif) !important; font-size: 1.6rem !important; color: var(--ink) !important; text-decoration: none; }
.dash-nav .nav-logo img { width: 64px; height: 64px; }