/* ===================================================================
   SoFitness — Design System (single source of truth)
   Estratto dal design Figma "Final Design" (home) — 22 giu 2026.
   Definisce SOLO token + @font-face: importarlo non cambia l'aspetto
   di una pagina finché i token non vengono usati. Riusabile da tutto
   il sito (oggi applicato all'admin; il pubblico seguirà col redesign).
   =================================================================== */

/* ---- Font self-hosted (no CDN, GDPR-friendly) ---- */
@font-face {
    font-family: "Newsreader";
    src: url("../fonts/newsreader/newsreader-400-d-jezSe.woff2") format("woff2");
    font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
    font-family: "Newsreader";
    src: url("../fonts/newsreader/newsreader-500-B63Pc7T.woff2") format("woff2");
    font-weight: 500; font-style: normal; font-display: swap;
}
@font-face {
    font-family: "Newsreader";
    src: url("../fonts/newsreader/newsreader-600-uQdHUZZ.woff2") format("woff2");
    font-weight: 600; font-style: normal; font-display: swap;
}
@font-face {
    font-family: "Newsreader";
    src: url("../fonts/newsreader/newsreader-400-italic-SQMF5nz.woff2") format("woff2");
    font-weight: 400; font-style: italic; font-display: swap;
}
@font-face {
    font-family: "Newsreader";
    src: url("../fonts/newsreader/newsreader-500-italic-gy_8UT-.woff2") format("woff2");
    font-weight: 500; font-style: italic; font-display: swap;
}
@font-face {
    /* solo per la firma di Sofia in fondo alla presentazione in home */
    font-family: "Great Vibes";
    src: url("../fonts/great_vibes/great-vibes-400-5o6lRLh.woff2") format("woff2");
    font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
    font-family: "Instrument Sans";
    src: url("../fonts/instrument_sans/instrument-sans-400-7-RDbvM.woff2") format("woff2");
    font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
    font-family: "Instrument Sans";
    src: url("../fonts/instrument_sans/instrument-sans-500-VVB9NwE.woff2") format("woff2");
    font-weight: 500; font-style: normal; font-display: swap;
}
@font-face {
    font-family: "Instrument Sans";
    src: url("../fonts/instrument_sans/instrument-sans-600-0wurhj4.woff2") format("woff2");
    font-weight: 600; font-style: normal; font-display: swap;
}
@font-face {
    font-family: "Inter Display";
    src: url("../fonts/inter_display/inter-display-400-CS5RUme.woff2") format("woff2");
    font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
    font-family: "Inter Display";
    src: url("../fonts/inter_display/inter-display-500-Gk4bSlM.woff2") format("woff2");
    font-weight: 500; font-style: normal; font-display: swap;
}
@font-face {
    font-family: "Inter Display";
    src: url("../fonts/inter_display/inter-display-600-vBUwhbq.woff2") format("woff2");
    font-weight: 600; font-style: normal; font-display: swap;
}
@font-face {
    font-family: "Inter Display";
    src: url("../fonts/inter_display/inter-display-400-italic-4FiRBsy.woff2") format("woff2");
    font-weight: 400; font-style: italic; font-display: swap;
}
@font-face {
    font-family: "Inter Display";
    src: url("../fonts/inter_display/inter-display-500-italic-oSIzFDi.woff2") format("woff2");
    font-weight: 500; font-style: italic; font-display: swap;
}
@font-face {
    font-family: "Inter Display";
    src: url("../fonts/inter_display/inter-display-600-italic-2iTTQnX.woff2") format("woff2");
    font-weight: 600; font-style: italic; font-display: swap;
}

:root {
    /* ---- Colori: superfici ---- */
    --ds-bg: #faf8f4;            /* fondo app (crema caldo) */
    --ds-surface: #ffffff;       /* card/pannelli */
    --ds-surface-2: #f5f3ee;     /* superficie alternata leggermente più calda */

    /* ---- Colori: testo ---- */
    --ds-ink: #18181a;           /* near-black: superfici scure, bottoni primari, testo forte */
    --ds-heading: #111111;       /* titoli */
    --ds-text: #494949;          /* body/secondario */
    --ds-muted: #8a8a8a;         /* placeholder/disabilitato (decorativo, NON per testo informativo) */
    --ds-text-muted: #6b6b6b;    /* testo grigio informativo conforme AA (header tabella, info, date) */

    /* ---- Colori: verde (brand) ---- */
    --ds-green: #1e3b2f;         /* verde foresta: sidebar/superfici scure */
    --ds-green-deep: #163832;    /* verde più scuro (hover/bordi) */
    --ds-green-mid: #235347;     /* verde medio (accenti interattivi) */
    --ds-on-green: #ffffff;      /* testo su verde */
    --ds-on-green-soft: #cbd3c3; /* testo attenuato su verde */
    --ds-surface-on-green: rgba(255, 255, 255, 0.05);
    --ds-border-on-green: rgba(255, 255, 255, 0.12);

    /* ---- Colori: accento (vinaccia) + brand secondari ---- */
    --ds-claret: #7a1b32;        /* accento principale / CTA */
    --ds-claret-deep: #670626;   /* vinaccia profonda (hover) */
    --ds-pink: #ffbdc5;
    --ds-sage: #8eb69b;
    --ds-mint: #daf1de;

    /* ---- Bordi / linee ---- */
    --ds-border: rgba(17, 17, 17, 0.10);
    --ds-border-soft: rgba(17, 17, 17, 0.06);

    /* ---- Stati ---- */
    --ds-success: #2e7d52;
    --ds-success-bg: #e7f3ec;
    --ds-danger: #b3261e;
    --ds-danger-bg: #fbe9e7;
    --ds-warning: #9a6a00;
    --ds-warning-bg: #fdf3df;
    --ds-info-bg: var(--ds-mint);

    /* ---- Tipografia ---- */
    --ds-font-serif: "Newsreader", Georgia, "Times New Roman", serif;
    --ds-font-display: "Inter Display", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; /* titoli + testi (home/Figma) */
    --ds-font-sans: "Instrument Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; /* label bottoni */
    --ds-font-signature: "Great Vibes", "Snell Roundhand", cursive; /* firma di Sofia */

    /* ---- Raggi ---- */
    --ds-radius-sm: 12px;
    --ds-radius: 16px;     /* bottoni, input */
    --ds-radius-lg: 20px;  /* card */
    --ds-radius-xl: 24px;  /* pannelli grandi */
    --ds-radius-pill: 999px;

    /* ---- Spaziature ---- */
    --ds-space-1: 4px;
    --ds-space-2: 8px;
    --ds-space-3: 12px;
    --ds-space-4: 16px;
    --ds-space-5: 20px;
    --ds-space-6: 24px;
    --ds-space-8: 32px;
    --ds-space-10: 40px;
    --ds-space-12: 48px;
    --ds-space-16: 64px;

    /* ---- Ombre (morbide, tinta verde brand) ---- */
    --ds-shadow-sm: 0 1px 3px rgba(30, 59, 47, 0.05);
    --ds-shadow: 0 10px 30px rgba(30, 59, 47, 0.07);
    --ds-shadow-lg: 0 24px 60px rgba(30, 59, 47, 0.12);

    /* ---- Tracking tipografico ---- */
    --ds-tracking-display: -2px;
    --ds-tracking-tight: -1px;
    --ds-tracking-body: -0.23px;
    --ds-tracking-ui: -0.5px;

    /* ---- Token layout pubblico (--sf-*) ----
       Promossi a :root dallo scope .sf-home per renderli disponibili a TUTTE le
       pagine pubbliche col nuovo design system (home + about + future pagine) e ai
       componenti condivisi di components.css. Valori invariati rispetto a .sf-home. */
    --sf-shadow-soft: 0 8px 16px rgba(0, 0, 0, 0.06);
    --sf-edge: 66px;              /* gutter laterale unico: header, hero, sezioni, footer */
    --sf-quote-text: #60645c;
    --sf-bg-warm: #f6f0e9;
    --sf-border-warm: #ebe5dd;
    --sf-ink-80: rgba(24, 24, 24, 0.8);
    --sf-sub-2: #323431;
    --sf-green-80: rgba(30, 59, 47, 0.8);
    --sf-green-05: rgba(30, 59, 47, 0.05);
    --sf-green-line: rgba(30, 59, 47, 0.3);
    --sf-green-chip: #2c4f44;
    --sf-mint-line: #f2f8f5;
    --sf-hairline: rgba(5, 5, 5, 0.08);
    --sf-btn-white-hover: #e9e3d9;
}