/* ==========================================================================
   @font-face — Polices de marque (source unique, chemins absolus)
   woff2 prioritaire (leger) + ttf en fallback.
   Fichiers : /public/theme/assets/fonts/{jost,work_sans}/
   Charge sur le front ET dans le builder (<link> dans builder.html.twig).
   ========================================================================== */

/* === JOST (titres h1-h4) === */
@font-face {
    font-family: 'Jost';
    src: url('/theme/assets/fonts/jost/Jost-Regular.woff2') format('woff2'),
         url('/theme/assets/fonts/jost/Jost-Regular.ttf') format('truetype');
    font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
    font-family: 'Jost';
    src: url('/theme/assets/fonts/jost/Jost-Medium.woff2') format('woff2'),
         url('/theme/assets/fonts/jost/Jost-Medium.ttf') format('truetype');
    font-weight: 500; font-style: normal; font-display: swap;
}
@font-face {
    font-family: 'Jost';
    src: url('/theme/assets/fonts/jost/Jost-SemiBold.woff2') format('woff2'),
         url('/theme/assets/fonts/jost/Jost-SemiBold.ttf') format('truetype');
    font-weight: 600; font-style: normal; font-display: swap;
}
@font-face {
    font-family: 'Jost';
    src: url('/theme/assets/fonts/jost/Jost-Bold.woff2') format('woff2'),
         url('/theme/assets/fonts/jost/Jost-Bold.ttf') format('truetype');
    font-weight: 700; font-style: normal; font-display: swap;
}

/* === WORK SANS (textes / boutons / UI) === */
@font-face {
    font-family: 'Work Sans';
    src: url('/theme/assets/fonts/work_sans/WorkSans-Regular.woff2') format('woff2'),
         url('/theme/assets/fonts/work_sans/WorkSans-Regular.ttf') format('truetype');
    font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
    font-family: 'Work Sans';
    src: url('/theme/assets/fonts/work_sans/WorkSans-Medium.woff2') format('woff2'),
         url('/theme/assets/fonts/work_sans/WorkSans-Medium.ttf') format('truetype');
    font-weight: 500; font-style: normal; font-display: swap;
}
@font-face {
    font-family: 'Work Sans';
    src: url('/theme/assets/fonts/work_sans/WorkSans-SemiBold.woff2') format('woff2'),
         url('/theme/assets/fonts/work_sans/WorkSans-SemiBold.ttf') format('truetype');
    font-weight: 600; font-style: normal; font-display: swap;
}
@font-face {
    font-family: 'Work Sans';
    src: url('/theme/assets/fonts/work_sans/WorkSans-Bold.woff2') format('woff2'),
         url('/theme/assets/fonts/work_sans/WorkSans-Bold.ttf') format('truetype');
    font-weight: 700; font-style: normal; font-display: swap;
}

/* ==========================================================================
   THEME MAURIN
   Variables globales projet / client
   ========================================================================== */

:root {
    /* ----------------------------------------------------------------------
       1. Palette marque Maurin
       ---------------------------------------------------------------------- */

    --maurin-primary: #3A7FF8;
    --maurin-secondary: #2567DE;
    --maurin-accent: #3A7FF8;
    --maurin-text: #212221;
    --maurin-bg-soft: #f6f6f6;
    --maurin-white: #ffffff;
    --maurin-light-gray: #f6f6f6;
    --maurin-black: #2c2c2c;

    /* ----------------------------------------------------------------------
       2. Typographies
       Jost      = titres (h1-h4)   -> --theme-title-font
       Work Sans = textes / boutons -> --theme-text-font / --theme-button-font
       Les @font-face sont declares en haut de CE fichier.
       ---------------------------------------------------------------------- */

    --maurin-font-primary: 'Jost', -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
    --maurin-font-secondary: 'Work Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;

    --theme-font-primary: var(--maurin-font-primary);
    --theme-font-secondary: var(--maurin-font-secondary);
    --theme-title-font: var(--maurin-font-primary);
    --theme-text-font: var(--maurin-font-secondary);
    --theme-button-font: var(--maurin-font-secondary);

    /* ----------------------------------------------------------------------
    Radius / arrondis
    ---------------------------------------------------------------------- */

   --maurin-section-radius: 18px;
   --maurin-image-radius: 18px;
   --maurin-button-radius: 999px;

   /* Variables semantiques radius */
   --theme-section-radius: var(--maurin-section-radius);
   --theme-section-container-radius: var(--maurin-section-radius);
   --theme-card-radius: var(--maurin-section-radius);
   --theme-image-radius: var(--maurin-image-radius);
   --theme-button-radius: var(--maurin-button-radius);

 /* ----------------------------------------------------------------------
    Boutons
    ---------------------------------------------------------------------- */

   --maurin-button-height: 48px;
   --maurin-button-padding-x: 22px;
   --maurin-button-font-size: 15px;
   --maurin-button-font-weight: 600;   /* Work Sans SemiBold (poids reellement charge) */

   --theme-button-height: var(--maurin-button-height);
   --theme-button-padding-x: var(--maurin-button-padding-x);
   --theme-button-font-size: var(--maurin-button-font-size);
   --theme-button-font-weight: var(--maurin-button-font-weight);

    /* ----------------------------------------------------------------------
       3. Variables semantiques globales
       Ces variables sont celles que les composants/widgets doivent utiliser.
       ---------------------------------------------------------------------- */

    /* Sections */
    --theme-section-title-color: var(--maurin-primary);
    --theme-eyebrow-color: var(--maurin-accent);   /* pre-titre : rouge pour le moment, change ICI */
    --theme-section-subtitle-color: var(--maurin-text);
    --theme-section-text-color: var(--maurin-text);
    --theme-section-background: var(--maurin-white);
    --theme-section-container-radius: var(--maurin-section-radius);

    /* Blocs de contenu */
    --theme-block-title-color: var(--maurin-secondary);
    --theme-block-subtitle-color: var(--maurin-text);
    --theme-block-text-color: var(--maurin-text);

    /* Boutons */
    --theme-button-bg: var(--maurin-primary);
    --theme-button-bg-hover: var(--maurin-secondary);
    --theme-button-text-color: var(--maurin-white);

    /* Bordures / contours / accents */
    --theme-border-accent-color: var(--maurin-accent);

    /* Medias / cards */
    --theme-card-radius: 18px;
    --theme-card-border-color: var(--maurin-accent);
    --theme-card-background: var(--maurin-light-gray);
    --theme-card-media-bg: var(--maurin-light-gray);
    --theme-card-border-hover: var(--maurin-primary);
    --theme-price-color: var(--maurin-primary);
    --theme-indicator-bg: var(--maurin-light-gray);

    /* Fonds */
    --theme-bg-default: var(--maurin-bg-soft);
    --theme-bg-light: var(--maurin-bg-soft);
    --theme-bg-white: var(--maurin-white);

    /* Texte global */
    --theme-text-color: var(--maurin-text);
    --theme-link-color: var(--maurin-primary);
    --theme-link-hover-color: var(--maurin-secondary);
}



/* ==========================================================================
   Classes utilitaires optionnelles
   ========================================================================== */

.theme-text-primary { color: var(--maurin-primary); }
.theme-text-secondary { color: var(--maurin-secondary); }
.theme-text-accent { color: var(--maurin-accent); }
.theme-bg-soft { background-color: var(--maurin-bg-soft); }
.theme-bg-primary { background-color: var(--maurin-primary); }
.theme-border-accent { border-color: var(--maurin-accent); }


/* ==========================================================================
   TOKENS COMPOSANTS — Panneau de controle de la marque
   Tout ce qui varie d'un client a l'autre se regle ICI (et nulle part ailleurs).
   Les composants lisent ces variables ; le builder n'ecrit une valeur inline
   que si l'utilisateur surcharge explicitement une section.
   ========================================================================== */
:root {
    /* Typo — TAILLES (titres, sous-titres, texte) */
    --theme-title-size: 42px;          /* ex. Maurin 48px / Renault 32px */
    --theme-subtitle-size: 18px;
    --theme-text-size: 16px;
    --theme-eyebrow-size: 13px;
    --theme-card-title-size: 20px;
    --theme-card-subtitle-size: 15px;
    /* --theme-button-font-size deja defini plus haut (15px) */

    /* Typo — POIDS */
    --theme-title-weight: 600;
    --theme-subtitle-weight: 500;
    --theme-eyebrow-weight: 700;
    --theme-card-title-weight: 600;
    --theme-card-subtitle-weight: 500;
    /* --theme-button-font-weight deja defini plus haut (600) */

    /* Couleur manquante : hover texte bouton (les autres couleurs sont deja definies plus haut) */
    --theme-button-text-hover: var(--maurin-white);
}