/* ================================================================
   design-tokens.css — WebApp Pinturas
   Aesthetic: "Technical Industrial Manual"
   Dense information + clear hierarchy. Dark base + amber accent.
   ================================================================ */

@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@400;500;600;700&family=Barlow:wght@400;500;600;700&display=swap');

:root {
    /* ── Backgrounds ─────────────────────────────────────────── */
    --bg-page:      #0F172A;   /* Near-black page background */
    --bg-surface:   #1E293B;   /* Panels, modal headers */
    --bg-card:      #FFFFFF;   /* Card surfaces */
    --bg-muted:     #F1F5F9;   /* Alternating rows, neutral areas */

    /* ── Accent ──────────────────────────────────────────────── */
    --accent:       #D97706;   /* Amber/ochre — evokes pigments */
    --accent-hover: #B45309;

    /* ── Semantic Colors ─────────────────────────────────────── */
    --blue:         #2563EB;   /* Replaces #007bff */
    --success:      #16A34A;
    --danger:       #DC2626;
    --warning:      #D97706;
    --info:         #0891B2;

    /* ── Text ────────────────────────────────────────────────── */
    --text-primary:   #0F172A;
    --text-secondary: #475569;
    --text-muted:     #94A3B8;

    /* ── Borders & Shadows ───────────────────────────────────── */
    --border:       #E2E8F0;
    --shadow-card:  0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.08);
    --shadow-lg:    0 8px 25px rgba(0,0,0,0.15);

    /* ── Navigation ──────────────────────────────────────────── */
    --nav-bg:       #0F172A;
    --nav-border:   #D97706;   /* Accent line at bottom of nav */
    --nav-active:   #D97706;

    /* ── Layout ──────────────────────────────────────────────── */
    --radius:       8px;
    --radius-lg:    12px;

    /* ── Typography ──────────────────────────────────────────── */
    --font-display: 'Barlow Condensed', 'Segoe UI', sans-serif;
    --font-body:    'Barlow', 'Segoe UI', sans-serif;
    --font-mono:    'JetBrains Mono', 'Courier New', monospace;
}