/* ============================================================
   common.css — cockpit.land-soft.com
   David Colter | April 2026

   Shared design tokens and reset.
   Load this first on every Cockpit page.
   Never put layout or component styles here.
   ============================================================ */


/* ── Variables — Dark mode (default) ───────────────────────── */
:root {
    --bg:            #0f0f14;
    --bg-left:       #13131a;
    --bg-card:       #16161e;
    --bg-card-hover: #1c1c26;
    --bg-inner:      #1e1e28;
    --border:        #2a2a38;
    --border-light:  #38384a;
    --text:          #e8e8f0;
    --text-muted:    #7878a0;
    --text-dim:      #4a4a68;

    --green:         #27ae60;
    --green-bg:      #0d2e1a;
    --green-light:   #2ecc71;
    --amber:         #e67e22;
    --amber-bg:      #2e1a08;
    --red:           #e74c3c;
    --red-bg:        #2e0d0d;
    --blue:          #3498db;
    --blue-bg:       #0d1e2e;
    --purple:        #9b59b6;
    --purple-bg:     #1a0d2e;

    --roth-color:    #27ae60;
    --roth-bg:       #0d2e1a;
    --trad-color:    #3498db;
    --trad-bg:       #0d1e2e;

    --left-width:    390px;
    --radius:        10px;
    --radius-sm:     6px;
    --transition:    all 0.2s ease;
    --font-mono:     'SF Mono', 'Fira Code', 'Consolas', monospace;
}

/* ── Light mode ─────────────────────────────────────────────── */
@media (prefers-color-scheme: light) {
    :root {
        --bg:            #f0f0f5;
        --bg-left:       #e8e8f0;
        --bg-card:       #ffffff;
        --bg-card-hover: #f5f5fa;
        --bg-inner:      #f8f8fc;
        --border:        #dcdce8;
        --border-light:  #c8c8d8;
        --text:          #1a1a2e;
        --text-muted:    #5a5a7a;
        --text-dim:      #9898b0;

        --green:         #1e8449;
        --green-bg:      #eaf5ef;
        --green-light:   #1a9e50;
        --amber:         #c0620a;
        --amber-bg:      #fef3e8;
        --red:           #c0392b;
        --red-bg:        #fdf0ee;
        --blue:          #2471a3;
        --blue-bg:       #eaf3fb;
        --purple:        #7d3c98;
        --purple-bg:     #f5eafb;

        --roth-color:    #1e8449;
        --roth-bg:       #eaf5ef;
        --trad-color:    #2471a3;
        --trad-bg:       #eaf3fb;
    }
}

/* ── Reset ──────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

body {
    font-family: -apple-system, BlinkMacSystemFont, 'Helvetica Neue', sans-serif;
    background: var(--bg);
    color: var(--text);
    font-size: 17px;
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
}