/*
Theme Name: CM Media — RégimeKéto
Theme URI: https://regime-keto.fr
Description: Thème enfant de CM Media appliquant la charte graphique RégimeKéto.fr v1.0 (juillet 2026) : palette végétale, duo Fraunces/Inter auto-hébergé, en-tête collant une ligne.
Author: CM INVESTISSEMENT
Template: cm-media
Version: 1.0.0
Text Domain: cm-media-keto
*/

/* =========================================================
   1. Jetons de marque (charte §3 et §4)
   ========================================================= */
:root{
  /* palette charte */
  --rk-forest:#2F5D3A;      /* vert forêt   : couleur principale */
  --rk-avocado:#A8C97F;     /* vert avocat  : accents, tags */
  --rk-terracotta:#C96F3B;  /* terracotta   : CTA, liens texte */
  --rk-cream:#FDFBF7;       /* crème        : fond de page */
  --rk-deep:#1F3D28;        /* vert profond : footer, gros titres */
  --rk-warm:#3C3A33;        /* gris chaud   : corps de texte */
  --rk-stone:#8A8375;       /* gris pierre  : métadonnées */
  --rk-cream-dark:#F5F1E8;  /* crème foncé  : encadré « L'essentiel » */
  --rk-line:#E7E2D6;

  /* remappage des variables du thème parent */
  --cm-accent:var(--rk-terracotta);
  --cm-accent-dark:#A85A2D;
  --cm-ink:var(--rk-deep);
  --cm-body:var(--rk-warm);
  --cm-muted:var(--rk-stone);
  --cm-line:var(--rk-line);
  --cm-bg:var(--rk-cream);
  --cm-bg-soft:var(--rk-cream-dark);
  --cm-header-bg:var(--rk-deep);
  --cm-header-ink:var(--rk-cream);
  --cm-font-head:'Fraunces','Playfair Display',Georgia,serif;
  --cm-font-body:'Inter',Arial,Helvetica,sans-serif;
  --cm-radius:8px;
  --cm-maxw:1200px;
}

/* Jamais de blanc pur en fond (charte §3) */
html,body{background:var(--rk-cream);}

/* =========================================================
   2. Typographie (charte §4)
   ========================================================= */
body{
  font-family:var(--cm-font-body);
  font-size:17px;
  line-height:1.7;
  color:var(--rk-warm);
}
h1,h2,h3,h4,h5,h6{font-family:var(--cm-font-head);}
h1,.cm-entry-title{
  font-family:var(--cm-font-head);font-weight:600;
  font-size:clamp(34px,4vw,40px);line-height:1.15;color:var(--rk-deep);
}
h2{font-family:var(--cm-font-head);font-weight:600;font-size:26px;color:var(--rk-deep);}
h3{font-family:var(--cm-font-body);font-weight:600;font-size:19px;color:var(--rk-warm);}

/* Largeur de lecture 700 px (charte §4) */
.cm-entry-content > p,
.cm-entry-content > ul,
.cm-entry-content > ol,
.cm-entry-content > h2,
.cm-entry-content > h3,
.cm-entry-content > blockquote{max-width:700px;}

/* Chapô */
.cm-entry-content > p.chapo,
.cm-entry-content > p:first-of-type{
  font-family:var(--cm-font-head);font-weight:400;font-size:20px;color:var(--rk-warm);
}

/* Kicker / rubrique */
.cm-kicker,.cm-badge,.cm-cat-badge{
  font-family:var(--cm-font-body);font-weight:600;font-size:12px;
  text-transform:uppercase;letter-spacing:.06em;color:var(--rk-terracotta);
}

/* Métadonnées */
.cm-meta,.cm-entry-meta,.cm-date,.cm-reading-time,figcaption,.wp-caption-text{
  font-family:var(--cm-font-body);font-weight:400;font-size:13px;color:var(--rk-stone);
}

/* Liens dans le texte : soulignés au survol uniquement (charte §6) */
.cm-entry-content a{color:var(--rk-terracotta);text-decoration:none;}
.cm-entry-content a:hover,.cm-entry-content a:focus{text-decoration:underline;}

/* =========================================================
   3. En-tête collant une ligne (desktop + mobile)
   ========================================================= */
.rk-header{
  position:sticky;top:0;z-index:1000;
  background:var(--rk-deep);color:var(--rk-cream);
  border-bottom:1px solid rgba(253,251,247,.12);
}
.rk-header-inner{
  max-width:var(--cm-maxw);margin:0 auto;padding:0 20px;
  display:flex;align-items:center;gap:24px;min-height:68px;
}
.rk-brand{display:flex;align-items:center;gap:10px;flex:0 0 auto;text-decoration:none;}
/* Logo officiel : ratio 361x74. Hauteur pilotée, largeur auto.
   Taille mini de la charte (120 px de large) respectée à toutes les tailles d'écran. */
.rk-brand img,.rk-logo{height:38px;width:auto;max-width:none;display:block;}

.rk-nav{flex:1 1 auto;}
.rk-nav ul{list-style:none;margin:0;padding:0;display:flex;gap:4px;}
.rk-nav li{position:relative;}
.rk-nav > ul > li > a{
  display:block;padding:10px 12px;border-radius:6px;
  font-family:var(--cm-font-body);font-weight:600;font-size:15px;
  color:var(--rk-cream);text-decoration:none;white-space:nowrap;
}
.rk-nav > ul > li > a:hover,
.rk-nav > ul > li:focus-within > a{background:rgba(168,201,127,.16);color:#fff;}
/* rubrique active en terracotta (charte §3) */
.rk-nav > ul > li.current-menu-item > a,
.rk-nav > ul > li.current-menu-parent > a,
.rk-nav > ul > li.current-menu-ancestor > a{color:var(--rk-terracotta);}
/* chevron sur les rubriques à sous-menu */
.rk-nav > ul > li.menu-item-has-children > a::after{content:" ▾";font-size:11px;opacity:.75;}

/* sous-menus */
.rk-nav ul ul{
  position:absolute;left:0;top:100%;min-width:250px;
  background:var(--rk-cream);border:1px solid var(--rk-line);
  border-radius:var(--cm-radius);padding:8px;
  flex-direction:column;gap:0;
  box-shadow:0 10px 28px rgba(31,61,40,.14);
  opacity:0;visibility:hidden;transform:translateY(6px);
  transition:opacity .16s ease,transform .16s ease,visibility .16s;
}
.rk-nav li:hover > ul,
.rk-nav li:focus-within > ul{opacity:1;visibility:visible;transform:translateY(0);}
.rk-nav ul ul a{
  display:block;padding:9px 12px;border-radius:6px;
  font-size:15px;font-weight:400;color:var(--rk-warm);text-decoration:none;
}
.rk-nav ul ul a:hover{background:var(--rk-cream-dark);color:var(--rk-forest);}

/* actions à droite */
.rk-actions{display:flex;align-items:center;gap:10px;flex:0 0 auto;}
.rk-search-toggle{
  background:none;border:0;cursor:pointer;padding:8px;border-radius:6px;
  color:var(--rk-cream);display:inline-flex;line-height:0;
}
.rk-search-toggle:hover{background:rgba(168,201,127,.16);}
.rk-subscribe{
  background:var(--rk-terracotta);color:var(--rk-cream);
  font-family:var(--cm-font-body);font-weight:600;font-size:14px;
  padding:10px 18px;border-radius:8px;text-decoration:none;
  border:0;box-shadow:none;white-space:nowrap;
}
.rk-subscribe:hover{background:#A85A2D;color:var(--rk-cream);text-decoration:none;}

/* tiroir de recherche */
.rk-searchbar{display:none;background:var(--rk-deep);border-top:1px solid rgba(253,251,247,.12);}
.rk-searchbar.is-open{display:block;}
.rk-searchbar .cm-container,.rk-searchbar-inner{
  max-width:var(--cm-maxw);margin:0 auto;padding:14px 20px;
}
.rk-searchbar input[type=search],.rk-searchbar input[type=text]{
  width:100%;padding:12px 14px;border-radius:8px;
  border:1px solid rgba(253,251,247,.28);
  background:rgba(253,251,247,.06);color:var(--rk-cream);
  font-family:var(--cm-font-body);font-size:16px;
}
.rk-searchbar input::placeholder{color:rgba(253,251,247,.55);}
.rk-searchbar .search-submit,.rk-searchbar button[type=submit]{display:none;}

/* burger mobile */
.rk-burger{
  display:none;background:none;border:0;cursor:pointer;padding:8px;
  color:var(--rk-cream);border-radius:6px;line-height:0;
}
.rk-burger:hover{background:rgba(168,201,127,.16);}

@media (max-width:1100px){
  .rk-nav > ul > li > a{padding:10px 8px;font-size:14px;}
}
@media (max-width:960px){
  .rk-burger{display:inline-flex;order:-1;}
  .rk-nav{
    display:none;position:fixed;left:0;right:0;top:68px;bottom:0;
    background:var(--rk-deep);overflow-y:auto;padding:12px 20px 40px;
  }
  .rk-nav.is-open{display:block;}
  .rk-nav ul{flex-direction:column;gap:0;}
  .rk-nav > ul > li > a{padding:14px 8px;font-size:17px;border-bottom:1px solid rgba(253,251,247,.10);}
  .rk-nav > ul > li.menu-item-has-children > a::after{content:"";}
  /* sous-menus dépliés en mobile */
  .rk-nav ul ul{
    position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;
    background:transparent;border:0;border-radius:0;padding:0 0 10px 14px;
  }
  .rk-nav ul ul a{color:rgba(253,251,247,.82);font-size:15px;padding:9px 8px;}
  .rk-nav ul ul a:hover{background:rgba(168,201,127,.14);color:#fff;}
  .rk-brand img,.rk-logo{height:34px;}
  .rk-subscribe{padding:9px 13px;font-size:13px;}
}
@media (max-width:520px){
  .rk-brand img,.rk-logo{height:28px;}   /* ≈137 px de large : au-dessus du minimum charte */
  .rk-subscribe{padding:8px 11px;font-size:12px;}
  .rk-header-inner{gap:12px;padding:0 14px;min-height:60px;}
  .rk-nav{top:60px;}
}

/* on masque l'en-tête et la nav d'origine du thème parent */
.cm-header,.cm-nav-wrap,.cm-topbar{display:none !important;}

/* =========================================================
   4. Composants (charte §6)
   ========================================================= */
/* Boutons */
.rk-btn,.wp-block-button__link,button,input[type=submit],.cm-btn{
  font-family:var(--cm-font-body);font-weight:600;
  background:var(--rk-terracotta);color:var(--rk-cream);
  border:0;border-radius:8px;padding:11px 20px;box-shadow:none;cursor:pointer;
}
.rk-btn:hover,.wp-block-button__link:hover{background:#A85A2D;color:var(--rk-cream);}
.rk-btn--secondary,.is-style-outline .wp-block-button__link{
  background:transparent;color:var(--rk-forest);
  border:1.5px solid var(--rk-forest);
}
.rk-btn--secondary:hover{background:rgba(47,93,58,.07);color:var(--rk-forest);}

/* Tags de rubrique */
.rk-tag,.cm-badge,.cm-cat-badge,.cm-entry-cat a{
  display:inline-block;background:rgba(168,201,127,.20);color:var(--rk-deep);
  font-family:var(--cm-font-body);font-weight:600;font-size:12px;
  text-transform:uppercase;letter-spacing:.04em;
  padding:4px 10px;border-radius:999px;text-decoration:none;
}

/* Encadré « L'essentiel » du plugin Squelette Éditorial */
.se-essentiel,.rk-essentiel{
  background:var(--rk-cream-dark);
  border-left:3px solid var(--rk-forest);
  border-radius:0 var(--cm-radius) var(--cm-radius) 0;
  padding:20px 24px;margin:28px 0;max-width:700px;
}
.se-essentiel > *:last-child,.rk-essentiel > *:last-child{margin-bottom:0;}
.se-essentiel ul,.rk-essentiel ul{margin-bottom:0;}
.se-essentiel li,.rk-essentiel li{margin-bottom:.5em;}

/* Encadré disclaimer médical */
.rk-disclaimer{
  background:#F4F3F0;color:var(--rk-stone);
  border-radius:var(--cm-radius);padding:16px 20px;margin:32px 0;
  font-size:14px;line-height:1.6;max-width:700px;
}
.rk-disclaimer strong{color:var(--rk-warm);}

/* Encadré affiliation */
.rk-affiliation{
  background:rgba(168,201,127,.14);border-radius:var(--cm-radius);
  padding:14px 18px;margin:24px 0;font-size:14px;color:var(--rk-warm);max-width:700px;
}

/* Citations */
blockquote{
  background:rgba(168,201,127,.16);border-left:3px solid var(--rk-avocado);
  color:var(--rk-deep);font-style:normal;border-radius:0 var(--cm-radius) var(--cm-radius) 0;
}

/* FAQ du plugin */
.se-faq + h3,.se-faq ~ h3{color:var(--rk-deep);font-family:var(--cm-font-head);font-weight:600;}

/* =========================================================
   5. Pied de page (charte §3 : vert profond)
   ========================================================= */
.cm-footer,.site-footer,footer.cm-footer{
  background:var(--rk-deep);color:rgba(253,251,247,.82);
}
.cm-footer a,.site-footer a{color:var(--rk-avocado);}
.cm-footer a:hover,.site-footer a:hover{color:var(--rk-cream);}
.cm-footer h2,.cm-footer h3,.site-footer h2,.site-footer h3{color:var(--rk-cream);}

/* Cartes d'article */
.cm-card,.cm-post-card{background:var(--rk-cream);border-color:var(--rk-line);}
.cm-card h2 a,.cm-post-card h2 a{color:var(--rk-deep);}
.cm-card h2 a:hover{color:var(--rk-terracotta);}

/* Accessibilité : focus visible partout */
a:focus-visible,button:focus-visible,input:focus-visible{
  outline:2px solid var(--rk-terracotta);outline-offset:2px;
}

/* =========================================================
   Navigation article précédent / suivant — remise en flux normal
   Bug : the_post_navigation génère <a> en display:inline contenant un
   <small> en display:block ; le libellé « Article précédent » déborde
   au-dessus du fond beige. Cause = le lien inline, pas un position:absolute.
   Le markup du thème est <a><span class="cm-prev/next"><small>LIBELLÉ</small>Titre</span></a>.
   ========================================================= */
.cm-post-nav{margin:32px 0;}
.cm-post-nav .nav-links{
  display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between;width:100%;
}
.cm-post-nav .nav-previous,
.cm-post-nav .nav-next{flex:1 1 320px;margin:0;padding:0;background:none;}
/* le fond et le padding passent sur le lien, en display:block (corrige le débordement) */
.cm-post-nav a{
  display:block;position:relative;
  background:var(--rk-cream-dark);
  border-radius:var(--cm-radius);
  padding:14px 18px;text-decoration:none;color:var(--rk-deep);
}
.cm-post-nav a:hover{background:var(--rk-terracotta);color:var(--rk-cream);}
.cm-post-nav .cm-prev,.cm-post-nav .cm-next{display:block;}
/* le libellé reste un petit sur-titre, sans contaminer le titre (qui est hors du <small>) */
.cm-post-nav small{
  display:block;margin-bottom:6px;
  font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--rk-stone);
}
.cm-post-nav a:hover small{color:rgba(253,251,247,.85);}
.cm-post-nav .nav-next{text-align:right;}
@media (max-width:560px){
  .cm-post-nav .nav-previous,.cm-post-nav .nav-next{flex:1 1 100%;}
  .cm-post-nav .nav-next{text-align:left;}
}

/* =========================================================
   Menu légal du pied de page — logé dans la 1re colonne (footer.php enfant)
   Le parent ne style pas .cm-footer-nav quand les widgets sont actifs :
   la liste s'affichait à puces, pleine largeur. On la remet en liste propre,
   au même gabarit que les menus de widgets du pied de page.
   ========================================================= */
.cm-footer-nav{margin-top:18px;}
.cm-footer-nav ul{list-style:none;margin:0;padding:0;}
.cm-footer-nav li{
  padding:7px 0;border-bottom:1px solid rgba(253,251,247,.10);
}
.cm-footer-nav li:last-child{border-bottom:0;}
.cm-footer-nav a{display:block;font-size:.9rem;line-height:1.4;}

/* =========================================================
   Suppression de la colonne latérale (sidebar-1 vidée)
   La grille .cm-content-area réserve 1fr + 340px ; sans sidebar,
   on la replie sur une seule colonne. Le contenu des articles et
   pages est centré à une largeur de lecture ; les listes (accueil,
   archives, recherche) gardent la pleine largeur du conteneur.
   ========================================================= */
.cm-content-area{grid-template-columns:1fr !important;}
.cm-sidebar{display:none !important;}
.single .cm-content-area > .cm-primary,
.page .cm-content-area > .cm-primary{
  max-width:820px;margin-inline:auto;width:100%;
}

/* Bloc maillage interne « À lire également » */
.se-maillage{
  margin-top:2.5rem;padding:1.4rem 1.6rem;
  background:#FDFBF7;border:1px solid #E7E1D6;border-left:4px solid #C96F3B;border-radius:6px;
}
.se-maillage-titre{
  margin-top:0;margin-bottom:.7rem;font-size:1.15rem;line-height:1.2;color:#2F5D3A;
}
.se-maillage ul{margin:0;padding-left:1.1rem;}
.se-maillage li{margin:.35rem 0;}
.se-maillage a{color:#C96F3B;text-decoration:none;font-weight:600;}
.se-maillage a:hover{text-decoration:underline;}