/**
 * Design tokens — the single source of truth for the Ibaiondo club visual
 * identity (Sprint U1). Every colour, spacing, radius, shadow and font size
 * used across the app resolves to one of these custom properties, so the
 * whole look can be retuned here without touching a single view.
 *
 * Palette is derived from the club's blues (Sprint U1 Phase 1, approved):
 * if the club later supplies exact brand hex codes, swap them in here only.
 */
:root {

    /* --- Club palette: blues + white --- */
    --c-blue-dark: #0b2447;   /* deep navy — header, headings, splash */
    --c-blue: #1565c0;        /* medium blue — primary actions, links */
    --c-blue-strong: #0f4c9a; /* pressed/hover primary */
    --c-blue-light: #e3f0fc;  /* light blue — tints, hovers, chips */
    --c-blue-accent: #4fa3e3; /* light-blue accent — highlights */
    --c-white: #ffffff;

    /* --- Status colours (unchanged semantics) --- */
    --c-success: #2e9e5b;
    --c-success-tint: #e6f4ec;
    --c-warning: #e0a021;
    --c-warning-tint: #fbf1dc;
    --c-danger: #d64545;
    --c-danger-tint: #fbe9e9;
    --c-danger-strong: #b23636;

    /* --- Neutrals / surfaces --- */
    --c-bg: #f4f7fb;          /* app background */
    --c-surface: #ffffff;     /* cards */
    --c-border: #e2e8f0;      /* hairlines */
    --c-ink: #16283d;         /* primary text */
    --c-muted: #5c6b7a;       /* secondary text */
    --c-on-dark: #ffffff;     /* text on dark blue */
    --c-on-dark-muted: #b8cbe4;

    /* --- Typography --- */
    --font-sans: "Segoe UI", system-ui, -apple-system, Roboto, Helvetica, Arial, sans-serif;
    --fs-xs: 0.75rem;   /* 12 */
    --fs-sm: 0.875rem;  /* 14 */
    --fs-md: 1rem;      /* 16 — base */
    --fs-lg: 1.125rem;  /* 18 */
    --fs-xl: 1.375rem;  /* 22 */
    --fs-2xl: 1.75rem;  /* 28 */
    --lh-tight: 1.25;
    --lh-normal: 1.5;
    --fw-regular: 400;
    --fw-medium: 600;
    --fw-bold: 700;

    /* --- Spacing scale (8pt-based) --- */
    --sp-1: 4px;
    --sp-2: 8px;
    --sp-3: 12px;
    --sp-4: 16px;
    --sp-5: 20px;
    --sp-6: 24px;
    --sp-8: 32px;
    --sp-10: 40px;

    /* --- Radius --- */
    --radius-sm: 8px;
    --radius: 14px;
    --radius-lg: 20px;
    --radius-pill: 999px;

    /* --- Shadows (subtle) --- */
    --shadow-sm: 0 1px 2px rgba(11, 36, 71, 0.06), 0 1px 3px rgba(11, 36, 71, 0.08);
    --shadow: 0 2px 8px rgba(11, 36, 71, 0.10);
    --shadow-lg: 0 8px 24px rgba(11, 36, 71, 0.14);

    /* --- Layout --- */
    --content-max: 640px;
    --content-max-wide: 1000px;
    --touch-min: 48px;       /* minimum touch target (accessibility) */
    --header-h: 60px;

    /* --- Motion --- */
    --transition: 150ms ease;
}