/* =================================================================
   EmiliaParts V2 — theme.css
   Charte graphique Option A4 figée le 29 avril 2026
   v2 (1er mai 2026) : ajout palette équipementiers (--pb-*)
   ================================================================= */

/* --------------------------------------------------------------
   Reset minimal
   -------------------------------------------------------------- */
*, *::before, *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html { scroll-behavior: smooth; }

body {
    font-family: 'Inter', -apple-system, 'Segoe UI', Roboto, sans-serif;
    color: var(--ep-text);
    background: var(--ep-white);
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

img { max-width: 100%; display: block; height: auto; }
button { font-family: inherit; cursor: pointer; }
a { color: inherit; }

/* --------------------------------------------------------------
   PALETTE — Variables CSS (charte A4 franco-italienne)
   -------------------------------------------------------------- */
:root {
    /* ──── Couleurs primaires (identité) ──── */

    /* Rouge — Ferrari, CTAs principaux, alertes urgence */
    --ep-red:         #CD212A;
    --ep-red-dark:    #A01820;
    --ep-red-light:   #FCEBEB;

    /* Bleu — Maserati, France, actions info, "en commande" */
    --ep-blue:        #0055A4;
    --ep-blue-dark:   #003D75;
    --ep-blue-light:  #E6F1FB;

    /* Vert — Alfa Romeo, "en stock", validation */
    --ep-green:       #008C45;
    --ep-green-dark:  #006633;
    --ep-green-light: #EAF3DE;

    /* Orange — "stock faible", attention */
    --ep-orange:        #F57C00;
    --ep-orange-light:  #FAEEDA;
    --ep-orange-dark:   #854F0B;

    /* ──── Neutres (structure) ──── */

    --ep-black:        #000000;
    --ep-text:         #1A1A1A;
    --ep-text-muted:   #6B6B6B;
    --ep-text-subtle:  #999999;

    --ep-white:        #FFFFFF;
    --ep-bg-soft:      #FAFAFA;
    --ep-bg-section:   #F5F5F5;

    --ep-border:        #E5E5E5;
    --ep-border-soft:   #F0F0F0;
    --ep-border-strong: #1A1A1A;

    /* ──── Couleurs équipementiers (--pb-* = product brand) ──── */
    /* Ajout 1er mai 2026 (étape 3D PATCH3).
       Inspirées du 1er site EmiliaParts.com (ePages) pour cohérence
       de marque. Utilisées via [data-pb-key="..."] dans le partial
       article_grid.php (mémo §13 extension). */

    /* Tubistyle — or chaud (italie, premium tuning, échappement perf) */
    --pb-tubistyle:        #D4A93C;
    --pb-tubistyle-dark:   #A8842D;
    --pb-tubistyle-light:  #FAF3E1;

    /* Capristo — anthracite (allemand, sobre, ingénierie) */
    --pb-capristo:         #3A3A40;
    --pb-capristo-dark:    #1F1F23;
    --pb-capristo-light:   #ECECEE;

    /* Ansa — bronze (heritage classique, métal brossé) */
    --pb-ansa:             #8B5A3C;
    --pb-ansa-dark:        #6B4329;
    --pb-ansa-light:       #F5EBE2;

    /* Hill Engineering — anthracite bleuté (évite clash vert Alfa) */
    --pb-hill:             #2D3A4A;
    --pb-hill-dark:        #1A2330;
    --pb-hill-light:       #E8ECF1;

    /* Accessoires — noir (goodies, lego, playmobil) */
    --pb-accessoires:      #1A1A1A;
    --pb-accessoires-dark: #000000;
    --pb-accessoires-light:#F0F0F0;

    /* ──── Layout ──── */

    --ep-radius-sm:    4px;
    --ep-radius:       6px;
    --ep-radius-md:    8px;
    --ep-radius-lg:    10px;

    --ep-max-width:    1280px;

    /* ──── Transitions ──── */

    --ep-tr-fast:      0.15s ease;
    --ep-tr:           0.2s ease;

    /* ──── Alias rétro-compatibles (5 mai 2026) ──── */
    /* Bug historique : layout.css utilisait var(--ep-primary, #8B0000)
       mais --ep-primary n'a jamais été défini → fallback #8B0000 utilisé
       partout au lieu du vrai rouge italien #CD212A.
       Solution : on alias --ep-primary sur --ep-red pour la cohérence
       sans avoir à toucher aux 19 occurrences dans layout.css. */
    --ep-primary:      var(--ep-red);
    --ep-primary-dark: var(--ep-red-dark);
    --ep-bg-muted:     var(--ep-bg-soft);
}

/* --------------------------------------------------------------
   TYPOGRAPHIE
   -------------------------------------------------------------- */
h1, h2, h3, h4, h5, h6 {
    color: var(--ep-black);
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -0.3px;
}

h1 { font-size: clamp(28px, 4vw, 42px); }
h2 { font-size: clamp(22px, 2.8vw, 28px); }
h3 { font-size: clamp(18px, 2vw, 22px); }
h4 { font-size: 16px; }

p { line-height: 1.6; }

code, kbd, samp, pre {
    font-family: 'Courier New', Consolas, Monaco, monospace;
}

/* --------------------------------------------------------------
   FILETS DRAPEAUX (signature visuelle)
   -------------------------------------------------------------- */
.ep-flag-strip {
    height: 3px;
    display: flex;
}
.ep-flag-strip > div { flex: 1; }

/* Drapeau italien — au-dessus du header */
.ep-flag-italian-green { background: var(--ep-green); }
.ep-flag-italian-white {
    background: var(--ep-white);
    border-top: 1px solid var(--ep-border);
    border-bottom: 1px solid var(--ep-border);
}
.ep-flag-italian-red { background: var(--ep-red); }

/* Drapeau français — sous le header */
.ep-flag-french-blue { background: var(--ep-blue); }
.ep-flag-french-white {
    background: var(--ep-white);
    border-top: 1px solid var(--ep-border);
    border-bottom: 1px solid var(--ep-border);
}
.ep-flag-french-red { background: var(--ep-red); }