/* ==========================================================================
   FERMA Infrastructure Intelligence Platform — Theme tokens
   Official identity for the Federal Roads Maintenance Agency portal.
   ========================================================================== */

:root {
    /* Brand palette */
    --ferma-green: #006B3F;
    --ferma-green-dark: #003F2A;
    --ferma-road-asphalt: #2F3437;
    --ferma-road-asphalt-dark: #1F2427;
    --ferma-safety-yellow: #F6C343;
    --ferma-warning-amber: #F59E0B;
    --ferma-white: #FFFFFF;
    --ferma-cloud: #F4F6F8;
    --ferma-border: #D9DEE5;
    --ferma-text: #111827;
    --ferma-muted: #6B7280;
    --ferma-success: #198754;
    --ferma-danger: #DC3545;
    --ferma-info: #0D6EFD;

    /* Derived / semantic tokens */
    --ferma-critical: #B42318;
    --ferma-surface: var(--ferma-white);
    --ferma-surface-alt: var(--ferma-cloud);
    --ferma-on-brand: var(--ferma-white);

    /* Layout metrics */
    --ferma-sidebar-width: 264px;
    --ferma-sidebar-collapsed: 76px;
    --ferma-topbar-height: 64px;
    --ferma-radius: 10px;
    --ferma-radius-sm: 7px;
    --ferma-radius-lg: 16px;

    /* Elevation */
    --ferma-shadow-sm: 0 1px 2px rgba(17, 24, 39, 0.06), 0 1px 3px rgba(17, 24, 39, 0.08);
    --ferma-shadow-md: 0 4px 12px rgba(17, 24, 39, 0.08);
    --ferma-shadow-lg: 0 12px 32px rgba(17, 24, 39, 0.14);

    /* Typography */
    --ferma-font: "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
    --ferma-font-mono: "Cascadia Code", "Consolas", ui-monospace, monospace;

    /* Motion */
    --ferma-transition: 180ms cubic-bezier(0.4, 0, 0.2, 1);
}

* {
    box-sizing: border-box;
}

html,
body {
    margin: 0;
    padding: 0;
}

body {
    font-family: var(--ferma-font);
    color: var(--ferma-text);
    background-color: var(--ferma-surface-alt);
    font-size: 0.94rem;
    line-height: 1.5;
}

a {
    color: var(--ferma-green);
    text-decoration: none;
}

a:hover {
    color: var(--ferma-green-dark);
    text-decoration: underline;
}

code {
    font-family: var(--ferma-font-mono);
}

/* Primary action button in FERMA green */
.ferma-btn-primary {
    background-color: var(--ferma-green);
    border: 1px solid var(--ferma-green);
    color: var(--ferma-on-brand);
    font-weight: 600;
}

.ferma-btn-primary:hover,
.ferma-btn-primary:focus {
    background-color: var(--ferma-green-dark);
    border-color: var(--ferma-green-dark);
    color: var(--ferma-on-brand);
}

/* ----- Accessibility: visible focus everywhere (WCAG 2.1 AA) ----- */
:focus-visible {
    outline: 3px solid var(--ferma-info);
    outline-offset: 2px;
    border-radius: 3px;
}

.ferma-skip-link {
    position: absolute;
    left: -9999px;
    top: 0;
    z-index: 2000;
    background: var(--ferma-green-dark);
    color: #fff;
    padding: 0.6rem 1rem;
    border-radius: 0 0 var(--ferma-radius-sm) 0;
}

.ferma-skip-link:focus {
    left: 0;
    color: #fff;
    text-decoration: none;
}

/* Environment badge */
.ferma-envbadge {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    background: var(--ferma-safety-yellow);
    color: var(--ferma-road-asphalt-dark);
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 0.2rem 0.55rem;
    border-radius: 999px;
}

/* Reduced motion support */
@media (prefers-reduced-motion: reduce) {
    * {
        transition: none !important;
        animation: none !important;
    }
}
