/* EBRS design tokens — the single source of truth for colour, space, type, radius,
   shadow and motion. Page stylesheets reference SEMANTIC tokens only; the primitive
   ramps below exist to define the semantics and are not for direct use.
   Not linked from views/html-to-pdf/** — iText cannot resolve var(). */

:root {
    /* ---- primitives: green (500 = Bangladesh flag green) ---- */
    --ebrs-green-50: #E8F3EF;
    --ebrs-green-100: #C9E3DA;
    --ebrs-green-200: #97C9B8;
    --ebrs-green-300: #5FAB93;
    --ebrs-green-400: #2A8B6E;
    --ebrs-green-500: #006A4E;
    --ebrs-green-600: #005941;
    --ebrs-green-700: #004734;
    --ebrs-green-800: #003527;
    --ebrs-green-900: #00231A;

    /* ---- primitives: red (500 = Bangladesh flag red) ---- */
    --ebrs-red-50: #FEECEE;
    --ebrs-red-100: #FCD0D5;
    --ebrs-red-200: #F9A3AC;
    --ebrs-red-300: #F76F7D;
    --ebrs-red-400: #F5495B;
    --ebrs-red-500: #F42A41;
    --ebrs-red-600: #DB2239;
    --ebrs-red-700: #C81E32;
    --ebrs-red-800: #A01828;
    --ebrs-red-900: #78121E;

    /* ---- primitives: neutral (faint green cast, so greys belong to the same system) ---- */
    --ebrs-neutral-0: #FFFFFF;
    --ebrs-neutral-50: #F7F9F8;
    --ebrs-neutral-100: #EFF2F1;
    --ebrs-neutral-200: #E1E6E4;
    --ebrs-neutral-300: #C8D0CD;
    --ebrs-neutral-400: #9AA5A1;
    --ebrs-neutral-500: #6B7671;
    --ebrs-neutral-600: #4F5754;
    --ebrs-neutral-700: #3A403E;
    --ebrs-neutral-800: #262B29;
    --ebrs-neutral-900: #151918;

    /* ---- primitives: support hues, low chroma so green and red stay the brand ---- */
    --ebrs-amber-50: #FEF6EC;
    --ebrs-amber-500: #B45309;
    --ebrs-blue-50: #E8EEFB;
    --ebrs-blue-600: #1E40AF;

    /* ---- semantic: surfaces ---- */
    --ebrs-color-canvas: var(--ebrs-green-50);
    --ebrs-color-surface: var(--ebrs-neutral-0);
    --ebrs-color-surface-sunken: var(--ebrs-neutral-50);
    --ebrs-color-surface-raised: var(--ebrs-neutral-100);

    /* ---- semantic: foreground ---- */
    --ebrs-color-fg: var(--ebrs-neutral-800);
    --ebrs-color-fg-strong: var(--ebrs-neutral-900);
    --ebrs-color-fg-muted: var(--ebrs-neutral-600);
    /* 4.71:1 on --ebrs-color-surface ONLY; 4.46:1 on -sunken and 4.18:1 on -raised both fail
       AA, so step up to --ebrs-color-fg-muted on any surface other than white. */
    --ebrs-color-fg-subtle: var(--ebrs-neutral-500);
    --ebrs-color-fg-on-accent: var(--ebrs-neutral-0);

    /* ---- semantic: borders ---- */
    --ebrs-color-border: var(--ebrs-neutral-200);
    --ebrs-color-border-strong: var(--ebrs-neutral-300);

    /* ---- semantic: accent ---- */
    --ebrs-color-accent: var(--ebrs-green-500);
    --ebrs-color-accent-hover: var(--ebrs-green-600);
    --ebrs-color-accent-subtle: var(--ebrs-green-50);
    --ebrs-color-accent-emphasis: var(--ebrs-green-700);

    /* ---- semantic: status ---- */
    --ebrs-color-success: var(--ebrs-green-600);
    --ebrs-color-success-subtle: var(--ebrs-green-50);
    /* danger is red-700, NOT red-500: flag red is 4.00:1 on white and fails AA for text. */
    --ebrs-color-danger: var(--ebrs-red-700);
    --ebrs-color-danger-hover: var(--ebrs-red-800);
    --ebrs-color-danger-subtle: var(--ebrs-red-50);
    --ebrs-color-danger-brand: var(--ebrs-red-500); /* non-text only — rules, bars, indicators */
    --ebrs-color-warning: var(--ebrs-amber-500);
    --ebrs-color-warning-subtle: var(--ebrs-amber-50);
    --ebrs-color-info: var(--ebrs-blue-600);
    --ebrs-color-info-subtle: var(--ebrs-blue-50);
    --ebrs-color-focus: var(--ebrs-green-400);

    /* ---- semantic: space (4px base) ---- */
    --ebrs-space-3xs: 2px;
    --ebrs-space-2xs: 4px;
    --ebrs-space-xs: 8px;
    --ebrs-space-sm: 12px;
    --ebrs-space-md: 16px;
    --ebrs-space-lg: 24px;
    --ebrs-space-xl: 32px;
    --ebrs-space-2xl: 48px;
    --ebrs-space-3xl: 64px;

    /* ---- semantic: type ---- */
    --ebrs-font-sans: 'Inter', system-ui, -apple-system, 'Segoe UI', Arial, sans-serif;
    --ebrs-font-size-2xs: 11px;
    --ebrs-font-size-xs: 12px;
    --ebrs-font-size-sm: 13px;
    --ebrs-font-size-md: 14px;
    --ebrs-font-size-lg: 16px;
    --ebrs-font-size-xl: 20px;
    --ebrs-font-size-2xl: 24px;
    --ebrs-font-size-3xl: 30px;
    --ebrs-line-tight: 1.25;
    --ebrs-line-base: 1.5;
    --ebrs-line-loose: 1.7;
    --ebrs-font-weight-regular: 400;
    --ebrs-font-weight-medium: 500;
    --ebrs-font-weight-semibold: 600;
    --ebrs-font-weight-bold: 700;
    --ebrs-tracking-wide: 0.04em;

    /* ---- semantic: radius ---- */
    --ebrs-radius-xs: 3px;
    --ebrs-radius-sm: 4px;
    --ebrs-radius-md: 6px;
    --ebrs-radius-lg: 10px;
    --ebrs-radius-pill: 999px;

    /* ---- semantic: shadow ---- */
    --ebrs-shadow-xs: 0 1px 2px rgba(0, 0, 0, .06);
    --ebrs-shadow-sm: 0 1px 3px rgba(0, 0, 0, .08);
    --ebrs-shadow-md: 0 2px 8px rgba(0, 0, 0, .10);
    --ebrs-shadow-lg: 0 8px 24px rgba(0, 0, 0, .12);
    /* Solid on purpose: a translucent ring composites to 1.79:1 and misses the 3:1
       non-text floor on an icon button or chip that has no border to change. */
    --ebrs-focus-ring: 0 0 0 3px var(--ebrs-color-focus);
    --ebrs-focus-ring-inverse: 0 0 0 3px rgba(255, 255, 255, .65);

    /* ---- semantic: motion and control sizing ---- */
    --ebrs-transition-fast: 120ms ease;
    --ebrs-transition-base: 180ms ease;
    --ebrs-control-height-sm: 30px;
    --ebrs-control-height-md: 34px;
    --ebrs-control-height-lg: 40px;
}

/* Focus is a system-level guarantee, not a per-component decision. */
:focus-visible {
    outline: 2px solid var(--ebrs-color-focus);
    outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}