/*! Telaio 1.0.0 · tokens.css · GMC Autoriparazioni (token 1.0.0) · generato il 2026-09-26 · non modificare a mano */
@layer bricks, telaio;
@layer telaio.tokens, telaio.base, telaio.layout, telaio.components, telaio.utilities;

@layer telaio.tokens {
  :root {
    /* Colori: famiglie e sfumature (generate in OKLCH) */
    --white: #ffffff;
    --black: #000000;
    --primary: #004aad;
    --primary-ultra-light: #f2f7ff;
    --primary-light: #dbe9ff;
    --primary-semi-light: #a1c6ff;
    --primary-semi-dark: #1953ac;
    --primary-dark: #033378;
    --primary-ultra-dark: #031738;
    --primary-hover: #003988;
    --secondary: #334155;
    --secondary-ultra-light: #f4f7fb;
    --secondary-light: #e2e8f1;
    --secondary-semi-light: #b9c5d6;
    --secondary-semi-dark: #4c596c;
    --secondary-dark: #2e3947;
    --secondary-ultra-dark: #131921;
    --secondary-hover: #222f42;
    --tertiary: #007e9b;
    --tertiary-ultra-light: #ecf9fe;
    --tertiary-light: #cfeef9;
    --tertiary-semi-light: #90cfe5;
    --tertiary-semi-dark: #006279;
    --tertiary-dark: #003f4f;
    --tertiary-ultra-dark: #001c25;
    --tertiary-hover: #006881;
    --accent: #d62828;
    --accent-ultra-light: #fff4f2;
    --accent-light: #ffe0db;
    --accent-semi-light: #ffaba1;
    --accent-semi-dark: #a8000f;
    --accent-dark: #6f0006;
    --accent-ultra-dark: #320605;
    --accent-hover: #bb0012;
    --base: #334155;
    --base-ultra-light: #f4f7fb;
    --base-light: #e2e8f1;
    --base-semi-light: #b9c5d6;
    --base-semi-dark: #4c596c;
    --base-dark: #2e3947;
    --base-ultra-dark: #131921;
    --base-hover: #222f42;
    --neutral: #07070a;
    --neutral-ultra-light: #f7f7f7;
    --neutral-light: #e7e8e9;
    --neutral-semi-light: #c3c4c7;
    --neutral-semi-dark: #57585c;
    --neutral-dark: #37383b;
    --neutral-ultra-dark: #18181a;
    --neutral-hover: #010101;
    --success: #1a7f37;
    --success-ultra-light: #eefbef;
    --success-light: #d3f2d6;
    --success-semi-light: #98d6a0;
    --success-semi-dark: #0f6a2b;
    --success-dark: #004517;
    --success-ultra-dark: #001f07;
    --success-hover: #006927;
    --warning: #9a6700;
    --warning-ultra-light: #fef5ea;
    --warning-light: #f8e5ca;
    --warning-semi-light: #e4bd88;
    --warning-semi-dark: #774f00;
    --warning-dark: #4d3200;
    --warning-ultra-dark: #241500;
    --warning-hover: #805500;
    --danger: #cf222e;
    --danger-ultra-light: #fff4f3;
    --danger-light: #ffdfdc;
    --danger-semi-light: #ffaaa4;
    --danger-semi-dark: #a7031b;
    --danger-dark: #6e000e;
    --danger-ultra-dark: #320607;
    --danger-hover: #b2001d;
    --info: #0969da;
    --info-ultra-light: #f2f7ff;
    --info-light: #dae9ff;
    --info-semi-light: #9fc6ff;
    --info-semi-dark: #0053b2;
    --info-dark: #003476;
    --info-ultra-dark: #021737;
    --info-hover: #0056b7;

    /* Superfici */
    --bg-body: var(--white);
    --bg-ultra-light: var(--base-ultra-light);
    --bg-light: var(--base-ultra-light);
    --bg-dark: var(--neutral-ultra-dark);
    --bg-ultra-dark: var(--neutral);

    /* Colori: testo sopra ogni colore (--on-*) e colore usabile come testo (--*-text) */
    --on-primary: var(--white);
    --primary-text: var(--primary);
    --on-secondary: var(--white);
    --secondary-text: var(--secondary);
    --on-tertiary: var(--white);
    --tertiary-text: var(--tertiary-semi-dark);
    --on-accent: var(--white);
    --accent-text: var(--accent);
    --on-base: var(--white);
    --base-text: var(--base);
    --on-neutral: var(--white);
    --neutral-text: var(--neutral);
    --on-success: var(--white);
    --success-text: var(--success);
    --on-warning: var(--white);
    --warning-text: var(--warning);
    --on-danger: var(--white);
    --danger-text: var(--danger);
    --on-info: var(--white);
    --info-text: var(--info);

    /* Ruoli su superfici chiare (--light-*) e scure (--dark-*) */
    --light-text-color: var(--base-ultra-dark);
    --light-text-color-muted: var(--base-semi-dark);
    --light-heading-color: var(--base-ultra-dark);
    --light-link-color: var(--primary);
    --light-link-color-hover: var(--primary-semi-dark);
    --light-link-color-strong: var(--primary);
    --light-focus-color: var(--primary);
    --light-border-color: var(--base-light);
    --dark-text-color: var(--base-ultra-light);
    --dark-text-color-muted: var(--base-semi-light);
    --dark-heading-color: var(--white);
    --dark-link-color: var(--primary-semi-light);
    --dark-link-color-hover: var(--primary-light);
    --dark-focus-color: var(--primary-semi-light);
    --dark-border-color: color-mix(in oklch, var(--white) 18%, transparent);
    --input-border-color: var(--base-semi-dark);

    /* Ruoli attivi (le superfici .bg--* li riassegnano) */
    --text-color: var(--light-text-color);
    --text-color-muted: var(--light-text-color-muted);
    --heading-color: var(--light-heading-color);
    --link-color: var(--light-link-color);
    --link-color-hover: var(--light-link-color-hover);
    --focus-color: var(--light-focus-color);
    --border-color: var(--light-border-color);

    /* Tipografia (fluida tra le due viewport) */
    --root-font-size: 100%;
    --heading-font-family: "Manrope", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --text-font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --heading-font-weight: 500;
    --text-font-weight: 400;
    --heading-line-height: calc(1em + 0.4rem);
    --text-line-height: 1.5;
    --text-max-width: 65ch;
    --text-xs: 0.75rem;
    --text-s: clamp(0.7722rem, 0.8537rem - 0.0906vw, 0.8333rem);
    --text-m: 1rem;
    --text-l: clamp(1.2rem, 1.1683rem + 0.1407vw, 1.295rem);
    --text-xl: clamp(1.44rem, 1.361rem + 0.3511vw, 1.677rem);
    --text-xxl: clamp(1.728rem, 1.5801rem + 0.6574vw, 2.1717rem);
    --h1: clamp(2.4883rem, 2.1037rem + 1.7093vw, 3.6421rem);
    --h2: clamp(2.0736rem, 1.8273rem + 1.0945vw, 2.8124rem);
    --h3: clamp(1.728rem, 1.5801rem + 0.6574vw, 2.1717rem);
    --h4: clamp(1.44rem, 1.361rem + 0.3511vw, 1.677rem);
    --h5: clamp(1.2rem, 1.1683rem + 0.1407vw, 1.295rem);
    --h6: 1rem;

    /* Spaziature e layout */
    --space-xxs: clamp(0.544rem, 0.4693rem + 0.3319vw, 0.768rem);
    --space-xs: clamp(0.68rem, 0.5867rem + 0.4148vw, 0.96rem);
    --space-s: clamp(0.85rem, 0.7333rem + 0.5185vw, 1.2rem);
    --space-m: clamp(1.0625rem, 0.9167rem + 0.6481vw, 1.5rem);
    --space-l: clamp(1.3281rem, 1.1458rem + 0.8102vw, 1.875rem);
    --space-xl: clamp(1.6602rem, 1.4323rem + 1.0127vw, 2.3438rem);
    --space-xxl: clamp(2.0752rem, 1.7904rem + 1.2659vw, 2.9297rem);
    --section-space-xs: clamp(2.572rem, 1.7147rem + 3.8104vw, 5.144rem);
    --section-space-s: clamp(3.4722rem, 2.3148rem + 5.144vw, 6.9444rem);
    --section-space-m: clamp(4.6875rem, 3.125rem + 6.9444vw, 9.375rem);
    --section-space-l: clamp(6.3281rem, 4.2188rem + 9.375vw, 12.6562rem);
    --section-space-xl: clamp(8.543rem, 5.6953rem + 12.6563vw, 17.0859rem);
    --section-space-xxl: clamp(11.533rem, 7.6887rem + 17.0859vw, 23.066rem);
    --gutter: clamp(1rem, 0.5rem + 2.2222vw, 2.5rem);
    --content-width: 80.625rem;
    --content-width-narrow: 52.5rem;
    --section-header-width: 48rem;
    --header-height: 7.5rem;
    --content-gap: var(--space-s);
    --container-gap: var(--space-xl);
    --grid-gap: var(--space-m);
    --flow-space: 1em;
    --grid-min-2: 20rem;
    --grid-min-3: 16rem;
    --grid-min-4: 13rem;
    --grid-min-5: 11rem;
    --grid-min-6: 9rem;

    /* Forma: raggi, bordi, bottoni, ombre */
    --radius-s: 0.3125rem;
    --radius-m: 0.625rem;
    --radius-l: 1.25rem;
    --radius-xl: 1.875rem;
    --radius: var(--radius-m);
    --radius-pill: 9999px;
    --border-width: 1px;
    --input-radius: var(--radius-s);
    --btn-radius: var(--radius-s);
    --btn-border-width: 2px;
    --btn-font-family: var(--heading-font-family);
    --btn-font-weight: 700;
    --btn-padding-block: 0.75em;
    --btn-padding-inline: 1.5em;
    --shadow-s: none;
    --shadow-m: none;
    --shadow-l: none;

    /* Interazione e accessibilità */
    --target-size: 2.75rem;
    --focus-width: 3px;
    --focus-offset: 2px;
    --transition-duration: 180ms;
    --transition-timing: cubic-bezier(0.2, 0.7, 0.2, 1);
    --transition: color var(--transition-duration) var(--transition-timing), background-color var(--transition-duration) var(--transition-timing), border-color var(--transition-duration) var(--transition-timing), box-shadow var(--transition-duration) var(--transition-timing), transform var(--transition-duration) var(--transition-timing), opacity var(--transition-duration) var(--transition-timing);
    --icon-check: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
  }
}