/* =====================================================================
   TEMA VECTRAFLEET — visual do app do motorista
   Usa os mesmos nomes de variáveis da calculadora original (--g2g-*),
   só que com a identidade da VectraFleet (tema escuro):
   Vectra Navy, Vector Orange, Steel Tint, fonte Inter.
   ===================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Inter:opsz,wght@14..32,400;14..32,500;14..32,600;14..32,700;14..32,800&family=JetBrains+Mono:wght@500;600&display=swap');

:root {
    /* Identidade VectraFleet (tema escuro do design system) */
    --vf-surface: #08162B;
    --vf-surface-raised: #10223D;
    --vf-ink: #EEF3F9;
    --vf-ink-muted: #9FB0C6;
    --vf-line: #22385A;
    --vf-line-strong: #5C7393;
    --vf-navy: #0B1F3A;
    --vf-navy-light: #1E4A8A;
    --vf-orange: #F26419;
    --vf-orange-bright: #FF7A2E;
    --vf-orange-ink: #FF8A47;
    --vf-orange-soft: #3D2213;
    --vf-steel: #33496B;
    --vf-success: #4CC796;
    --vf-success-soft: #12382E;
    --vf-warning: #F2B04A;
    --vf-warning-soft: #3A2A10;
    --vf-danger: #FF7B6E;
    --vf-danger-soft: #3D1A1A;

    /* Mesmos nomes usados pela calculadora */
    --g2g-bg: var(--vf-surface);
    --g2g-bg-menu: rgba(8, 22, 43, 0.92);
    --g2g-surface: rgba(16, 34, 61, 0.92);
    --g2g-surface-2: rgba(8, 22, 43, 0.70);
    --g2g-card: linear-gradient(180deg, #10223D, #0C1B34);
    --g2g-border: var(--vf-line);
    --g2g-border-soft: rgba(34, 56, 90, 0.75);
    --g2g-glow: 0 1px 2px rgba(0, 0, 0, 0.45);
    --g2g-accent: var(--vf-orange-ink);
    --g2g-primary: var(--vf-orange);
    --g2g-primary-hover: #D9530F;
    --g2g-text: var(--vf-ink);
    --g2g-muted: var(--vf-ink-muted);
    --g2g-hint: var(--vf-ink-muted);
    --g2g-label: #C3D0E0;
    --g2g-box: var(--vf-warning);
    --g2g-success: var(--vf-success);
    --g2g-danger: var(--vf-danger);
    --g2g-warning: var(--vf-warning);
    --g2g-font: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
    --g2g-font-display: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
    --g2g-font-mono: 'JetBrains Mono', Consolas, monospace;
}

@media screen {
    html { color-scheme: dark; }
    body {
        font-family: var(--g2g-font);
        color: var(--g2g-text);
        background:
            radial-gradient(900px 460px at 85% -10%, rgba(30, 74, 138, 0.35), transparent 62%),
            radial-gradient(700px 420px at 0% 110%, rgba(242, 100, 25, 0.08), transparent 60%),
            var(--g2g-bg);
        background-attachment: fixed;
        font-optical-sizing: auto;
        -webkit-font-smoothing: antialiased;
    }
    .container { max-width: 1240px !important; }

    .g2g-card {
        background: var(--g2g-card);
        border: 1px solid var(--g2g-border);
        border-radius: 8px;
        box-shadow: var(--g2g-glow);
    }
    .g2g-label {
        font-family: var(--g2g-font);
        font-size: 12px; font-weight: 600; letter-spacing: 0.06em;
        text-transform: uppercase; color: var(--vf-ink-muted);
    }
    :focus-visible { outline: 2px solid var(--vf-orange); outline-offset: 2px; }
}