/* ═══════════════════════════════════════════════════════════════════
   VITA — gutenberg-vita.css
   Chargé à la fois dans l'éditeur Gutenberg ET sur le front-end.
   Ne pas dupliquer dans style.css.
   Les @font-face sont déjà déclarés dans style.css (Divi les charge).
   Ce fichier réexpose uniquement les familles via font-family pour
   que Gutenberg les reconnaisse sans re-télécharger les fichiers.
═══════════════════════════════════════════════════════════════════ */

/* ── Variables VITA (miroir de style.css + theme.json) ──────────── */
:root {
  --vita-principal    : #A50042;
  --vita-accentuation : #73002E;
  --vita-dark-crimson : #7C0031;
  --vita-secondaire   : #FFC300;
  --vita-or           : #FFC300;
  --vita-texte        : #0C0635;
  --vita-navy         : #0C0635;
  --vita-action       : #FF8940;
  --vita-green        : #66CC99;
  --vita-famille      : #D1F0E0;
  --vita-procreation  : #FFDCC6;
  --vita-citation     : #FFEDB2;
  --vita-bg           : #F3F3F5;
  --vita-grey         : #EDEDF0;
  --vita-black-30     : rgba(0, 0, 0, 0.30);
  --vita-white        : #ffffff;
}

/* ── @font-face titres (nécessaire pour l'éditeur Gutenberg) ─────── */
@font-face {
  font-family  : 'HerokidBoldCondensed';
  src          : url('/wp-content/uploads/et-fonts/Herokid-BoldCondensed.woff2') format('woff2'),
                 url('/wp-content/uploads/et-fonts/Herokid-BoldCondensed.woff')  format('woff'),
                 url('/wp-content/uploads/et-fonts/Herokid-BoldCondensed.otf')   format('opentype');
  font-weight  : normal;
  font-style   : normal;
  font-display : swap;
}

/* ── Body éditeur ────────────────────────────────────────────────── */
/* font-family sans !important sur .wp-block pour ne pas écraser les titres
   (Gutenberg pose .wp-block directement sur l'élément heading) */
.editor-styles-wrapper {
  font-family      : 'IBMPlexSans', sans-serif;
  font-size        : 17px;
  line-height      : 1.6;
  color            : var(--vita-texte);
  background-color : #ffffff !important;
}

.editor-styles-wrapper .wp-block {
  font-size   : 17px;
  line-height : 1.6;
  color       : var(--vita-texte);
}

/* ── Titres — spécificité (0,2,1) > (0,2,0) de .wp-block ────────── */
/* .wp-block-heading est la classe Gutenberg posée sur h1/h2/h3/h4/h5/h6 */
.editor-styles-wrapper h1,
.editor-styles-wrapper h2,
.editor-styles-wrapper h3,
.editor-styles-wrapper .wp-block-heading[class*="wp-block"] {
  font-family : 'HerokidBoldCondensed', sans-serif !important;
  font-weight : normal !important;
  color       : #A50042 !important;
  line-height : 1.15 !important;
}

.editor-styles-wrapper h4,
.editor-styles-wrapper h5,
.editor-styles-wrapper h6 {
  font-family : 'HerokidNarrow', sans-serif !important;
  font-weight : normal !important;
  color       : #A50042 !important;
}

/* ── Liens ───────────────────────────────────────────────────────── */
.editor-styles-wrapper a {
  color : var(--vita-principal);
}

/* ── Bloc citation ───────────────────────────────────────────────── */
.editor-styles-wrapper blockquote,
.editor-styles-wrapper .wp-block-quote,
.wp-block-quote {
  background-color : #FFEDB2 !important;
  border-left      : none !important;
  padding          : 25px !important;
  border-radius    : 25px 0 25px 25px !important;
  color            : #A50042 !important;
  font-style       : italic !important;
}

.editor-styles-wrapper .wp-block-quote p,
.wp-block-quote p {
  color      : #A50042 !important;
  font-style : italic !important;
}

/* ── Bloc séparateur ─────────────────────────────────────────────── */
.editor-styles-wrapper .wp-block-separator,
.wp-block-separator {
  border-color : var(--vita-secondaire) !important;
  border-width : 2px !important;
}

/* ── Bouton par défaut ───────────────────────────────────────────── */
.editor-styles-wrapper .wp-block-button__link,
.wp-block-button__link {
  background-color : var(--vita-principal) !important;
  color            : #fff !important;
  border-radius    : 25px !important;
  font-weight      : 700 !important;
  padding          : 10px 24px !important;
  border           : none !important;
  transition       : background-color 0.2s ease;
}

.editor-styles-wrapper .wp-block-button__link:hover,
.wp-block-button__link:hover {
  background-color : var(--vita-accentuation) !important;
}

/* ── Outline button ──────────────────────────────────────────────── */
.editor-styles-wrapper .wp-block-button.is-style-outline .wp-block-button__link,
.wp-block-button.is-style-outline .wp-block-button__link {
  background-color : transparent !important;
  border           : 2px solid var(--vita-principal) !important;
  color            : var(--vita-principal) !important;
}

/* ── Classes couleur texte — générées par theme.json ────────────── */
.has-vita-principal-color    { color : var(--vita-principal)    !important; }
.has-vita-accentuation-color { color : var(--vita-accentuation) !important; }
.has-vita-dark-crimson-color { color : var(--vita-dark-crimson) !important; }
.has-vita-secondaire-color   { color : var(--vita-secondaire)   !important; }
.has-vita-texte-color        { color : var(--vita-texte)        !important; }
.has-vita-navy-color         { color : var(--vita-navy)         !important; }
.has-vita-gold-color         { color : var(--vita-or)           !important; }
.has-vita-action-color       { color : var(--vita-action)       !important; }
.has-vita-green-color        { color : var(--vita-green)        !important; }
.has-vita-famille-color      { color : var(--vita-famille)      !important; }
.has-vita-procreation-color  { color : var(--vita-procreation)  !important; }
.has-vita-citation-color     { color : var(--vita-citation)     !important; }
.has-vita-bg-color           { color : var(--vita-bg)           !important; }
.has-vita-grey-color         { color : var(--vita-grey)         !important; }
.has-vita-black-30-color     { color : var(--vita-black-30)     !important; }
.has-vita-white-color        { color : var(--vita-white)        !important; }

/* ── Classes couleur fond — générées par theme.json ─────────────── */
.has-vita-principal-background-color    { background-color : var(--vita-principal)    !important; }
.has-vita-accentuation-background-color { background-color : var(--vita-accentuation) !important; }
.has-vita-dark-crimson-background-color { background-color : var(--vita-dark-crimson) !important; }
.has-vita-secondaire-background-color   { background-color : var(--vita-secondaire)   !important; }
.has-vita-texte-background-color        { background-color : var(--vita-texte)        !important; }
.has-vita-navy-background-color         { background-color : var(--vita-navy)         !important; }
.has-vita-gold-background-color         { background-color : var(--vita-or)           !important; }
.has-vita-action-background-color       { background-color : var(--vita-action)       !important; }
.has-vita-green-background-color        { background-color : var(--vita-green)        !important; }
.has-vita-famille-background-color      { background-color : var(--vita-famille)      !important; }
.has-vita-procreation-background-color  { background-color : var(--vita-procreation)  !important; }
.has-vita-citation-background-color     { background-color : var(--vita-citation)     !important; }
.has-vita-bg-background-color           { background-color : var(--vita-bg)           !important; }
.has-vita-grey-background-color         { background-color : var(--vita-grey)         !important; }
.has-vita-black-30-background-color     { background-color : var(--vita-black-30)     !important; }
.has-vita-white-background-color        { background-color : var(--vita-white)        !important; }

/* ── Tailles de texte — générées par theme.json ─────────────────── */
.has-small-font-size  { font-size : 14px !important; }
.has-normal-font-size { font-size : 17px !important; }
.has-medium-font-size { font-size : 22px !important; }
.has-large-font-size  { font-size : 32px !important; }
.has-xlarge-font-size { font-size : 48px !important; }

/* ── Largeur max du contenu dans l'éditeur ───────────────────────── */
.editor-styles-wrapper .wp-block {
  max-width : 860px;
}