/*
Theme Name: KMCB — Krav Maga Club Boulogne
Theme URI: https://kmcb.fr
Author: Krav Maga Club Boulogne
Description: Thème sur mesure pour le site du Krav Maga Club Boulogne (KMCB) — design noir/or, cinq pages (Accueil, Qui sommes-nous, Le Krav Maga, Horaires & tarifs, Séance découverte).
Version: 1.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: kmcb-theme
*/

:root{
  --ink:#0E0E10;
  --ink-soft:#19181C;
  --ink-card:#211F23;
  --gold:#E3A712;
  --gold-bright:#F7C948;
  --paper:#EFEBE3;
  --paper-dim:#C9C4B8;
  --steel:#8B8A8E;
  --line: rgba(239,235,227,0.12);
  --line-strong: rgba(239,235,227,0.22);
  --font-display:'Anton', 'Arial Narrow', sans-serif;
  --font-body:'Google Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono:'IBM Plex Mono', 'Courier New', monospace;
}

*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  background:var(--ink);
  color:var(--paper);
  font-family:var(--font-body);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%; display:block;}
a{color:inherit;}

.wrap{max-width:1120px; margin:0 auto; padding:0 24px;}

.eyebrow{
  font-family:var(--font-mono); font-size:12px; letter-spacing:.18em;
  text-transform:uppercase; color:var(--gold); display:flex; align-items:center; gap:10px;
}
/* Plus de trait décoratif devant les intitulés (signature visuelle à éviter). */

.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  font-family:var(--font-mono); font-weight:600; font-size:14px; letter-spacing:.06em; text-transform:uppercase;
  text-decoration:none; padding:16px 30px; border-radius:2px; border:1px solid transparent;
  cursor:pointer; transition:transform .15s ease, background .2s ease, border-color .2s ease, color .2s ease, box-shadow .2s ease;
}
.btn:active{transform:translateY(1px);}
.btn-primary{background:var(--gold); color:var(--ink);}
.btn-primary:hover{background:var(--gold-bright);}
.btn-ghost{background:transparent; color:var(--paper); border-color:var(--line-strong);}
.btn-ghost:hover{border-color:var(--paper); background:rgba(239,235,227,.06);}

section{padding:96px 0;}
@media (max-width:640px){ section{padding:64px 0;} }

h1,h2,h3{font-family:var(--font-display); font-weight:400; text-transform:uppercase; letter-spacing:.01em; line-height:1.08;}

.reveal{opacity:0; transform:translateY(18px); transition:opacity .7s ease, transform .7s ease;}
.reveal.in{opacity:1; transform:none;}

/* ---------- top bar / nav ---------- */
.topbar{
  position:sticky; top:0; z-index:50;
  background:var(--ink);
  border-bottom:1px solid var(--line);
}
.topbar-inner{
  display:flex; align-items:center; justify-content:space-between;
  padding:16px 24px;
}
.brand{
  font-family:var(--font-mono); font-size:13px; letter-spacing:.1em; text-transform:uppercase;
  text-decoration:none; color:var(--paper); display:flex; align-items:center; gap:10px;
  flex-shrink:0;
}
.brand-logo{height:55px; width:auto; display:block; flex-shrink:0;}
.brand-mark{width:10px; height:10px; background:var(--gold); transform:rotate(45deg); flex-shrink:0;}
.brand small{color:var(--steel); font-weight:400;}

.nav-links{display:flex; align-items:center; gap:34px;}
.nav-links a{
  font-family:var(--font-mono); font-size:12px; letter-spacing:.08em; text-transform:uppercase;
  text-decoration:none; color:var(--paper-dim); transition:color .2s ease;
  position:relative; padding:4px 0; white-space:nowrap;
}
.nav-links a:hover, .nav-links a.active{color:var(--paper);}
.nav-links a.active::after{
  content:""; position:absolute; left:0; right:0; bottom:-6px; height:2px; background:var(--gold);
}
/* Les boutons de la barre ne doivent jamais voir leur libellé coupé en
   deux : avec un compte admin ou instructeur, la navigation gagne un lien
   supplémentaire (« Dashboard admin »/« Dashboard instructeur ») qui
   comprimait « Mon espace » sur deux lignes. On fige donc les boutons et
   on laisse la liste de liens absorber la contrainte. */
.nav-right{display:flex; align-items:center; gap:24px; flex-shrink:0;}
.nav-right .btn{padding:10px 18px; font-size:12px; white-space:nowrap;}
/* Aucun libellé de navigation ne doit se couper en deux : on resserre
   l'espacement quand la place manque plutôt que de casser les mots. */
@media (max-width:1400px){ .nav-links{gap:20px;} }
@media (max-width:1180px){ .nav-links{gap:14px;} .nav-right{gap:14px;} }
@media (max-width:640px){
  .nav-right{gap:12px;}
  .nav-right .btn{padding:8px 12px; font-size:10px; letter-spacing:.03em;}
}

.burger{display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:8px;}
.burger span{width:22px; height:2px; background:var(--paper); display:block;}

@media (max-width:900px){
  .nav-links{
    position:fixed; inset:79px 0 0 0; background-color:var(--ink);
    flex-direction:column; align-items:flex-start; gap:0;
    padding:20px 24px; transform:translateX(100%); transition:transform .3s ease;
    border-top:1px solid var(--line);
    z-index:60; isolation:isolate; overflow-y:auto;
  }
  .nav-links.open{transform:translateX(0);}
  .nav-links a{width:100%; padding:18px 0; border-bottom:1px solid var(--line); font-size:14px;}
  .burger{display:flex;}
}

/* ---------- hero (site-wide, inner pages) ---------- */
.hero{
  position:relative; padding:110px 0 100px; overflow:hidden;
  background:
    repeating-linear-gradient(135deg, rgba(227,167,18,0.09) 0px, rgba(227,167,18,0.09) 2px, transparent 2px, transparent 46px),
    radial-gradient(ellipse at 20% 15%, rgba(227,167,18,0.14), transparent 55%),
    var(--ink);
}
.hero-inner{position:relative; z-index:2;}
.hero h1{font-size:clamp(40px, 7vw, 88px); line-height:1.05; margin:22px 0 20px; max-width:840px;}
.hero h1 span{color:var(--gold);}
@media (max-width:640px){ .hero h1{font-size:clamp(50px, 13vw, 88px);} }
.hero p.lead{font-size:clamp(16px,2vw,19px); color:var(--paper-dim); max-width:540px; margin-bottom:40px;}
.hero-actions{display:flex; flex-wrap:wrap; align-items:center; gap:22px;}

.hero-small{padding:80px 0 32px;}
.hero-small h1{font-size:clamp(36px,6vw,64px); max-width:100%;}

/* Retour à l'espace membre : même gabarit que les boutons secondaires du
   site (contour), plutôt qu'un simple lien. La flèche s'écarte au survol,
   petit rappel du sens de navigation. */
.kmcb-back-link{
  display:inline-flex; align-items:center; gap:8px; margin-bottom:18px;
  font-family:var(--font-mono); font-weight:600; font-size:12px;
  letter-spacing:.06em; text-transform:uppercase;
  padding:10px 18px; border-radius:2px;
  background:transparent; color:var(--paper); border:1px solid var(--line-strong);
  text-decoration:none;
  transition:border-color .2s ease, background .2s ease, color .2s ease, gap .2s ease;
}
.kmcb-back-link:hover{
  color:var(--paper); border-color:var(--paper);
  background:rgba(239,235,227,.06); gap:12px;
}

.price-stub{
  display:flex; align-items:center; gap:16px; border:1px dashed var(--line-strong); padding:14px 20px;
  font-family:var(--font-mono);
}
.price-stub .amount{font-family:var(--font-display); font-size:34px; color:var(--paper); line-height:1;}
.price-stub .detail{font-size:12px; color:var(--steel); max-width:170px; line-height:1.4;}

/* ---------- two-col text/media sections ---------- */
.split{border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:var(--ink-soft);}
.split-bg-section{position:relative; overflow:hidden; isolation:isolate;}
.split-bg{position:absolute; inset:-15% 0; z-index:0; will-change:transform;}
.split-bg img{width:100%; height:100%; object-fit:cover; display:block; filter:brightness(.9);}
.split-bg-section::after{
  content:""; position:absolute; inset:0; z-index:0;
  background:linear-gradient(180deg, rgba(14,14,16,.88), rgba(14,14,16,.78) 45%, rgba(14,14,16,.92));
}
.split-bg-section .split-grid{position:relative; z-index:1;}
.split-grid{display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:start;}
@media (max-width:800px){ .split-grid{grid-template-columns:1fr; gap:36px;} }
.split h2{font-size:clamp(30px,4vw,44px); margin-bottom:22px; max-width:460px;}
.split-copy p{color:var(--paper-dim); margin-bottom:16px; max-width:480px;}
.split-copy strong{color:var(--paper); font-weight:600;}

.chips{display:flex; flex-direction:column; gap:1px; background:var(--line);}
.chip{background:var(--ink-soft); padding:22px 24px; display:flex; align-items:baseline; gap:16px;}
.chip .num{font-family:var(--font-mono); color:var(--gold); font-size:13px; flex-shrink:0;}
.chip .txt{font-family:var(--font-display); font-size:21px; letter-spacing:0; text-transform:uppercase; color:var(--paper);}
.chip .txt small{display:block; font-family:var(--font-body); letter-spacing:normal; text-transform:none; color:var(--steel); font-size:16px; margin-top:5px;}

.pillars-photo{width:100%; margin-top:46px; border-radius:2px; border:1px solid var(--line); display:block; object-fit:cover; aspect-ratio:21/8;}
@media (max-width:640px){ .pillars-photo{aspect-ratio:4/3; margin-top:32px;} }

/* ---------- pillars (4 principles grid) ---------- */
.pillars-head{margin-bottom:46px;}
.pillars-head h2{font-size:clamp(30px,4vw,44px); margin:18px 0 10px;}
.pillars-head p{color:var(--paper-dim); max-width:480px;}
.pillars-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line);}
@media (max-width:900px){ .pillars-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:520px){ .pillars-grid{grid-template-columns:1fr;} }
.pillar{background:var(--ink); padding:32px 26px;}
.pillar .pnum{font-family:var(--font-mono); color:var(--gold); font-size:12px; letter-spacing:.1em;}
.pillar h3{font-size:22px; margin:16px 0 10px;}
.pillar p{color:var(--steel); font-size:14px; font-family:var(--font-body); text-transform:none; letter-spacing:normal;}

/* ---------- rounds (séance découverte) ---------- */
.rounds-head{margin-bottom:54px;}
.rounds-head h2{font-size:clamp(30px,4vw,44px); margin:18px 0 10px;}
.rounds-head p{color:var(--paper-dim); max-width:460px;}
.round{display:grid; grid-template-columns:64px 1fr auto; gap:24px; align-items:center; padding:26px 0; border-top:1px solid var(--line);}
.round:last-child{border-bottom:1px solid var(--line);}
.round-no{font-family:var(--font-mono); color:var(--gold); font-size:13px; letter-spacing:.05em;}
.round-title{font-family:var(--font-display); font-size:clamp(20px,2.6vw,28px); letter-spacing:.01em;}
.round-desc{color:var(--steel); font-size:14px; margin-top:6px; max-width:520px; font-weight:400; text-transform:none; letter-spacing:normal; font-family:var(--font-body);}
.round-time{font-family:var(--font-mono); font-size:20px; color:var(--paper-dim); white-space:nowrap;}
@media (max-width:640px){
  .round{grid-template-columns:40px 1fr; row-gap:8px;}
  .round-time{grid-column:2; font-size:15px; color:var(--gold);}
}
.rounds-total{display:flex; justify-content:space-between; align-items:center; padding-top:22px; margin-top:4px;
  font-family:var(--font-mono); font-size:13px; color:var(--steel); letter-spacing:.08em; text-transform:uppercase;}
.rounds-total span:last-child{color:var(--paper); font-size:16px;}

/* ---------- timeline (histoire) ---------- */
.timeline{border-top:1px solid var(--line);}
/* La colonne du texte est bornée à la largeur réelle des paragraphes (640px)
   pour que la photo vienne se placer juste à côté du texte au lieu d'être
   repoussée contre le bord droit de la page. */
.tl-item{display:grid; grid-template-columns:120px minmax(0,640px) 240px; gap:28px 36px; padding:36px 0; border-bottom:1px solid var(--line); align-items:start; justify-content:start;}
@media (max-width:860px){
  .tl-item{grid-template-columns:120px 1fr;}
  .tl-photo{grid-column:1 / -1; order:3; margin-top:4px;}
}
@media (max-width:640px){
  .tl-item{grid-template-columns:1fr; gap:10px;}
  .tl-photo{grid-column:1; width:96px; height:96px;}
}
.tl-year{font-family:var(--font-mono); color:var(--gold); font-size:15px; letter-spacing:.05em;}
.tl-item h3{font-size:clamp(20px,2.6vw,26px); margin-bottom:10px;}
.tl-item p{color:var(--paper-dim); font-size:15px; max-width:640px;}
.tl-item p + p{margin-top:10px;}
.tl-photo{width:240px; height:240px;}
.tl-photo img{
  width:100%; height:100%; object-fit:cover; display:block;
  border-radius:2px; border:1px solid var(--line-strong);
  filter:grayscale(12%) contrast(1.05);
}

/* ---------- info / equipment cards grid ---------- */
.infos{background:var(--ink-soft); border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
.infos h2{font-size:clamp(30px,4vw,44px); margin:18px 0 46px;}
.infos-grid{display:grid; grid-template-columns:repeat(4, 1fr); gap:1px; background:var(--line);}
@media (max-width:900px){ .infos-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:520px){ .infos-grid{grid-template-columns:1fr;} }
.info-card{background:var(--ink-soft); padding:30px 26px;}
.info-card svg{width:26px; height:26px; stroke:var(--gold); margin-bottom:18px;}
.info-card h3{font-family:var(--font-mono); font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--steel); margin-bottom:10px; font-weight:500;}
.info-card p{font-size:15px; color:var(--paper);}
.info-card p + p{margin-top:4px; color:var(--paper-dim);}

/* ---------- tariff cards ---------- */
.tariffs-grid{display:grid; grid-template-columns:1fr 1fr 1fr; gap:2px; background:var(--line-strong); margin-top:46px;}
@media (max-width:900px){ .tariffs-grid{grid-template-columns:1fr; gap:1px;} }
.tariff-card{background:var(--ink); padding:40px 36px; display:flex; flex-direction:column;}
.tariff-card.featured{background:var(--ink);}
.tariff-label{font-family:var(--font-mono); font-size:14px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--gold);}
.tariff-price{font-family:var(--font-display); font-weight:400; font-size:clamp(38px,5vw,54px); margin:14px 0 4px;}
.tariff-price small{font-family:var(--font-mono); font-size:14px; color:var(--steel); text-transform:none; letter-spacing:normal;}
.tariff-sub{font-family:var(--font-mono); font-size:12px; color:var(--steel); margin-bottom:22px;}
.tariff-installments{
  display:inline-block; font-family:var(--font-display); font-weight:400; text-transform:uppercase;
  letter-spacing:.01em; font-size:22px; color:var(--gold); background:rgba(227,167,18,.12);
  border:1px solid var(--gold); padding:6px 16px; border-radius:2px; margin:2px 0 18px; white-space:nowrap;
}
.tariff-for{color:var(--paper-dim); font-size:15.5px; font-weight:700; margin-bottom:22px; line-height:1.5; min-height:48px;}
.tariff-list{list-style:none; display:flex; flex-direction:column; gap:10px; margin-bottom:28px;}
.tariff-list li{font-size:14px; color:var(--paper-dim); display:flex; gap:10px;}
.tariff-list li::before{content:"•"; color:var(--gold); flex-shrink:0;}
.tariff-card .btn{margin-top:auto; letter-spacing:.015em;}

/* ---------- FAQ accordion ---------- */
/* Écart resserré entre la FAQ et la section « Nous trouver » qui la suit. */
.faq{padding-bottom:40px;}
.faq + section{padding-top:40px;}
.faq h2{font-size:clamp(30px,4vw,44px); margin:18px 0 46px;}
.faq-item{border-top:1px solid var(--line);}
.faq-item:last-child{border-bottom:1px solid var(--line);}
.faq-q{
  width:100%; background:none; border:none; color:var(--paper);
  font-family:var(--font-body); font-size:17px; font-weight:600; text-align:left;
  padding:22px 0; display:flex; justify-content:space-between; align-items:center; gap:20px; cursor:pointer;
}
.faq-q .plus{font-family:var(--font-mono); color:var(--gold); font-size:20px; flex-shrink:0; transition:transform .25s ease;}
.faq-item.open .plus{transform:rotate(45deg);}
.faq-a{max-height:0; overflow:hidden; transition:max-height .3s ease;}
/* Réponses sur toute la largeur du bloc, comme la question au-dessus. */
.faq-a p{color:var(--paper-dim); padding-bottom:22px; max-width:none; font-size:15px;}

/* ---------- booking / contact form ---------- */
.booking{
  background: radial-gradient(ellipse at 80% 20%, rgba(227,167,18,0.12), transparent 55%), var(--ink);
  border-top:1px solid var(--line);
}
.booking-grid{display:grid; grid-template-columns:1fr 1fr; gap:64px;}
@media (max-width:860px){ .booking-grid{grid-template-columns:1fr; gap:40px;} }
.booking h2{font-size:clamp(30px,4vw,44px); margin:18px 0 16px;}
.booking-copy p{color:var(--paper-dim); max-width:420px; margin-bottom:14px;}
.booking-copy ul{list-style:none; margin-top:26px; display:flex; flex-direction:column; gap:12px;}
.booking-copy li{display:flex; gap:10px; font-size:14px; color:var(--paper-dim);}
.booking-copy li::before{content:"•"; color:var(--gold); flex-shrink:0;}

form.card{background:var(--ink-card); border:1px solid var(--line); padding:34px;}
.field{margin-bottom:20px;}
.field label{display:block; font-family:var(--font-mono); font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--steel); margin-bottom:8px;}
.field input, .field select, .field textarea{
  width:100%; background:var(--ink-soft); border:1px solid var(--line-strong); color:var(--paper);
  padding:13px 14px; font-family:var(--font-body); font-size:15px; border-radius:1px;
}
.field textarea{resize:vertical; min-height:100px;}
.field input:focus, .field select:focus, .field textarea:focus{
  outline:2px solid var(--gold); outline-offset:1px; border-color:var(--gold);
}
.field-row{display:grid; grid-template-columns:1fr 1fr; gap:16px;}
@media (max-width:480px){ .field-row{grid-template-columns:1fr;} }
form.card .btn{width:100%; margin-top:6px;}
.form-note{font-size:12px; color:var(--steel); margin-top:14px; line-height:1.5;}
.form-status{font-size:13px; margin-top:14px; color:var(--gold-bright); display:none;}
.form-status.show{display:block;}

/* ---------- cta banner ---------- */
.cta-banner{
  background: radial-gradient(ellipse at 30% 30%, rgba(227,167,18,0.14), transparent 60%), var(--ink-soft);
  border-top:1px solid var(--line); border-bottom:1px solid var(--line);
  text-align:center;
}
.cta-banner h2{font-size:clamp(30px,5vw,54px); margin:18px 0 30px;}
.cta-banner .eyebrow{justify-content:center;}
.cta-banner .eyebrow::before{display:none;}
.cta-banner-actions{display:flex; justify-content:center; gap:20px; flex-wrap:wrap;}

/* ---------- stats row (hero) ---------- */
.stats-row{display:flex; gap:44px; flex-wrap:wrap; margin-top:54px; padding-top:34px; border-top:1px solid var(--line);}
.stats-row--hero{grid-column:1 / -1; justify-content:space-between; margin-top:64px;}
@media (max-width:860px){ .stats-row--hero{justify-content:flex-start; gap:28px 44px; margin-top:36px;} }
.stat{font-family:var(--font-mono);}
.stat .n{font-family:var(--font-display); font-size:clamp(26px,3vw,36px); color:var(--paper); display:block;}
.stat .l{font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--steel);}

/* ---------- planning / schedule list ---------- */
.schedule-list{border-top:1px solid var(--line);}
.schedule-row{
  display:grid; grid-template-columns:150px auto 1fr auto; align-items:center; gap:24px;
  padding:24px 0; border-bottom:1px solid var(--line);
}
.schedule-day{font-family:var(--font-display); font-size:clamp(20px,2.4vw,26px); letter-spacing:.01em;}
.schedule-time{font-family:var(--font-mono); color:var(--paper-dim); font-size:16px; display:flex; align-items:center; gap:10px;}
.schedule-place{font-family:var(--font-body); color:var(--paper); font-size:16px; text-align:center;}
.schedule-time svg{width:16px; height:16px; stroke:var(--gold); flex-shrink:0;}
.schedule-levels{display:flex; gap:10px; flex-wrap:wrap; justify-content:flex-end;}
.level-badge{
  font-family:var(--font-mono); font-size:11px; letter-spacing:.06em; text-transform:uppercase;
  padding:7px 14px; border-radius:999px; white-space:nowrap;
}
.level-badge.debutant{background:var(--gold); color:var(--ink);}
.level-badge.intermediaire{background:transparent; border:1px solid var(--line-strong); color:var(--paper-dim);}
@media (max-width:640px){
  .schedule-row{grid-template-columns:1fr; gap:10px; text-align:left;}
  .schedule-place{text-align:left;}
  .schedule-levels{justify-content:flex-start;}
}

/* ============================================================
   Contenu éditable WordPress (the_content / blocs Gutenberg)
   Ces styles s'appliquent automatiquement au contenu que vous
   tapez dans l'éditeur — aucune extension nécessaire.
   ============================================================ */
.wp-content-area{ padding:40px 0 96px; }
@media (max-width:640px){ .wp-content-area{ padding:24px 0 64px; } }

.wp-content-area h1, .wp-content-area h2, .wp-content-area h3{
  font-family:var(--font-display); font-weight:400; text-transform:uppercase; letter-spacing:.01em;
  color:var(--paper); margin:48px 0 20px;
}
.wp-content-area h1:first-child, .wp-content-area h2:first-child, .wp-content-area h3:first-child{ margin-top:0; }
.wp-content-area h2{ font-size:clamp(28px,4vw,40px); }
.wp-content-area h3{ font-size:clamp(20px,2.6vw,26px); margin-top:32px; }

.wp-content-area p{ color:var(--paper-dim); font-size:16px; line-height:1.7; margin:0 0 18px; max-width:none; }
.wp-content-area p strong{ color:var(--paper); font-weight:600; }
.wp-content-area a{ color:var(--gold); text-decoration:underline; }

.wp-content-area ul, .wp-content-area ol{ color:var(--paper-dim); padding-left:22px; margin:0 0 18px; }
.wp-content-area li{ margin-bottom:8px; }

.wp-content-area .wp-block-columns{
  display:flex; flex-wrap:wrap; align-items:normal;
  gap:32px; margin:0 0 18px;
}
.wp-content-area .wp-block-column{
  flex-grow:1; flex-basis:0; min-width:0;
  background:var(--ink-soft); border:1px solid var(--line); padding:28px;
}
@media (max-width:781px){
  .wp-content-area .wp-block-columns{ flex-wrap:wrap; }
  .wp-content-area .wp-block-column{ flex-basis:100%; }
}

.wp-content-area .wp-block-image{ margin:0 0 18px; }
.wp-content-area .wp-block-image img{
  width:100%; height:auto; display:block; border-radius:2px;
  aspect-ratio:1 / 1; object-fit:cover;
}
.wp-content-area .wp-block-image figcaption{
  font-family:var(--font-mono); font-size:12px; color:var(--steel); margin-top:10px; text-align:left;
}

.wp-content-area .wp-block-button__link{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  font-family:var(--font-mono); font-weight:600; font-size:14px; letter-spacing:.06em; text-transform:uppercase;
  text-decoration:none; padding:16px 30px; border-radius:2px; background:var(--gold); color:var(--ink);
}
.wp-content-area .wp-block-button__link:hover{ background:var(--gold-bright); }

.wp-content-area hr{ border:none; border-top:1px solid var(--line); margin:36px 0; }

/* Section "Nos instructeurs" : mise en avant des noms au sein des colonnes */
.wp-content-area .wp-block-column h3{ margin-bottom:6px; }
.wp-content-area .wp-block-column p{ max-width:none; }

/* ---------- page légale (politique de confidentialité) ---------- */
/* Gabarit dédié, colonne de lecture étroite + sommaire, pensé pour un
   document long : interlignage plus généreux, rythme vertical marqué
   entre sections, tableaux et listes lisibles. Sans effet sur les
   autres pages (index.php garde ses propres règles .wp-content-area). */
.legal-page{ padding:56px 0 96px; }
@media (max-width:640px){ .legal-page{ padding:32px 0 64px; } }

.legal-page-grid{ display:grid; grid-template-columns:240px 1fr; gap:64px; align-items:start; }
@media (max-width:900px){ .legal-page-grid{ grid-template-columns:1fr; gap:32px; } }

.legal-toc{
  position:sticky; top:186px; background:var(--ink-card); border:1px solid var(--line);
  border-radius:2px; padding:26px 24px;
  /* Reste entièrement navigable même sur écran court : défilement interne. */
  max-height:calc(100vh - 200px); overflow-y:auto;
}
@media (max-width:900px){ .legal-toc{ position:static; max-height:none; overflow:visible; } }
.legal-toc .eyebrow{ margin-bottom:16px; }
.legal-toc ol{ list-style:none; counter-reset:toc; display:flex; flex-direction:column; gap:12px; }
.legal-toc li{ counter-increment:toc; }
.legal-toc a{
  display:flex; gap:9px; font-family:var(--font-mono); font-size:13px; line-height:1.4;
  color:var(--paper-dim); text-decoration:none; transition:color .15s ease;
}
.legal-toc a::before{ content:counter(toc) "."; color:var(--gold); flex-shrink:0; }
.legal-toc a:hover{ color:var(--paper); }

.legal-content{ max-width:700px; }
.legal-content > *:first-child{ margin-top:0; }
.legal-content > p:first-child{
  font-family:var(--font-mono); font-size:12px; letter-spacing:.04em; color:var(--steel);
  font-style:normal; margin-bottom:48px; padding-bottom:24px; border-bottom:1px solid var(--line);
}
.legal-content > p:first-child em{ font-style:normal; }

.legal-content h2, .legal-content h3{ scroll-margin-top:186px; color:var(--paper); }
.legal-content h2{
  font-size:clamp(24px,3vw,32px); line-height:1.15; margin:64px 0 22px;
  padding-top:40px; border-top:1px solid var(--line);
}
.legal-content h2:first-of-type{ margin-top:0; padding-top:0; border-top:none; }
.legal-content h3{ font-size:clamp(17px,2.1vw,20px); line-height:1.3; margin:36px 0 16px; color:var(--gold); }

.legal-content p{ font-size:16px; line-height:1.8; color:var(--paper-dim); margin:0 0 20px; max-width:none; }
.legal-content p strong{ color:var(--paper); font-weight:600; }
.legal-content a{ color:var(--gold); text-decoration-thickness:1px; text-underline-offset:3px; }
.legal-content a:hover{ color:var(--gold-bright); }

.legal-content ul{ margin:0 0 24px; padding-left:22px; display:flex; flex-direction:column; gap:12px; }
.legal-content li{ color:var(--paper-dim); line-height:1.7; }
.legal-content li::marker{ color:var(--gold); }

.legal-content figure.wp-block-table{ margin:0 0 32px; overflow-x:auto; }
.legal-content table{ width:100%; border-collapse:collapse; font-size:14.5px; }
.legal-content th, .legal-content td{
  border:1px solid var(--line); padding:13px 16px; text-align:left; vertical-align:top; line-height:1.55;
}
.legal-content th{
  font-family:var(--font-mono); font-size:11px; letter-spacing:.06em; text-transform:uppercase;
  color:var(--gold); background:rgba(227,167,18,0.06); font-weight:600;
}
.legal-content td{ color:var(--paper-dim); }
.legal-content td strong{ color:var(--paper); }

/* ---------- footer ---------- */
footer{padding:50px 0; border-top:1px solid var(--line);}
.footer-inner{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:20px;}
footer .brand{opacity:.8;}
.social{display:flex; gap:18px; flex-wrap:wrap;}
.social a{font-family:var(--font-mono); font-size:12px; letter-spacing:.06em; text-decoration:none; color:var(--steel); text-transform:uppercase;}
.social a:hover{color:var(--paper);}
.footer-bottom{display:flex; justify-content:space-between; align-items:flex-end; flex-wrap:wrap; gap:20px;}
.footer-fine{font-family:var(--font-mono); font-size:11px; color:var(--steel); margin-top:26px; letter-spacing:.03em; flex:1 1 320px; min-width:0;}
.footer-legal-links{display:flex; flex-wrap:wrap; gap:6px 10px; align-items:center;}
.footer-fed-logo{height:48px; width:auto; flex-shrink:0; opacity:.9; margin-left:auto;}
@media (max-width:640px){
  .footer-bottom{justify-content:center;}
  .footer-fed-logo{margin-left:0;}
}

:focus-visible{outline:2px solid var(--gold); outline-offset:2px;}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  .reveal{opacity:1; transform:none; transition:none;}
}

/* ---------- hero avec photo (page d'accueil) ---------- */
.hero-photo-grid{display:grid; grid-template-columns:.9fr 1.1fr; gap:40px; align-items:start;}
.hero-photo-wrap{position:relative; width:100%; max-width:620px; margin:0 auto;}
.hero-photo-wrap--sm{max-width:496px;}
.hero-photo-wrap::before{
  content:""; position:absolute; inset:-12%; z-index:-1;
  background:radial-gradient(ellipse at center, rgba(227,167,18,0.20), transparent 70%);
}
.hero-photo-wrap img{width:100%; filter:contrast(1.05);}

.hero-carousel{position:relative;}
.hero-carousel-img{animation:heroCarouselFade 20s ease-in-out infinite;}
.hero-carousel-img--1{position:relative; z-index:1;}
.hero-carousel-img--2{
  position:absolute; inset:0; z-index:2;
  width:100%; height:100%; object-fit:contain;
  animation-delay:10s;
}
@keyframes heroCarouselFade{
  0%, 45%  { opacity:1; }
  50%, 95% { opacity:0; }
  100%     { opacity:1; }
}
@media (prefers-reduced-motion: reduce){
  .hero-carousel-img{animation:none;}
  .hero-carousel-img--1{opacity:1;}
  .hero-carousel-img--2{opacity:0;}
}
@media (max-width:900px){
  .hero.hero-photo{padding-top:16px;}
  .hero-photo-grid{grid-template-columns:1fr; padding-top:0;}
  .hero-photo-wrap{
    order:-1; max-width:none;
    width:calc(100% + 64px); margin-left:-32px; margin-right:-32px; margin-bottom:8px;
  }
}

/* ---------- formulaires (shortcodes kmcb_render_*) ---------- */
.kmcb-form-card{
  background:var(--ink-card); border:1px solid var(--line); padding:34px; border-radius:2px;
}
.kmcb-form-card *{ box-sizing:border-box; }
.kmcb-form-card h3{ font-family:var(--font-display); font-weight:400; text-transform:uppercase; font-size:26px; margin:0 0 10px; color:var(--paper); }
.kmcb-sub{ color:var(--paper-dim); font-size:14px; margin:0 0 24px; line-height:1.5; }
.kmcb-step-indicator{ font-family:var(--font-mono); font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:var(--gold); margin:0 0 20px; }
.kmcb-wizard-back{
  display:inline-flex; align-items:center; gap:6px; margin:0 0 20px; padding:0;
  background:none; border:none; cursor:pointer;
  font-family:var(--font-mono); font-size:12px; letter-spacing:.06em; text-transform:uppercase;
  color:var(--gold); transition:gap .2s ease, color .2s ease;
}
.kmcb-wizard-back:hover{ gap:10px; color:var(--gold-bright); }
.kmcb-field{ margin-bottom:18px; }
.kmcb-field-row{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
@media (max-width:480px){ .kmcb-field-row{ grid-template-columns:1fr; } }
.kmcb-field label{
  display:block; font-family:var(--font-mono); font-size:11px; letter-spacing:.08em;
  text-transform:uppercase; color:var(--steel); margin-bottom:7px;
}
.kmcb-field input, .kmcb-field select, .kmcb-field textarea{
  width:100%; background:var(--ink-soft); border:1px solid var(--line-strong); color:var(--paper);
  padding:12px 13px; font-family:var(--font-body); font-size:15px; border-radius:1px;
}
.kmcb-field textarea{ resize:vertical; min-height:100px; }
.kmcb-field input:focus, .kmcb-field select:focus, .kmcb-field textarea:focus{
  outline:2px solid var(--gold); outline-offset:1px; border-color:var(--gold);
}
.kmcb-field-checkbox .kmcb-checkbox-label{
  display:flex; align-items:flex-start; gap:10px; text-transform:none; letter-spacing:normal;
  font-family:var(--font-body); font-size:13px; color:var(--paper-dim); line-height:1.5; cursor:pointer;
}
.kmcb-field-checkbox input[type="checkbox"]{
  width:auto; flex-shrink:0; margin-top:3px; accent-color:var(--gold); cursor:pointer;
}
/* Le rendu natif de <input type="file"> (bouton + libellé) est trop
   peu fiable d'un moteur à l'autre (bouton sans texte visible dans
   certains environnements) — on masque l'input et on affiche un
   déclencheur maison via son <label>, sans perdre l'accessibilité
   (le label ouvre le sélecteur de fichier nativement, sans JS). */
.kmcb-file-upload{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
.kmcb-file-upload .kmcb-file-input{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}
.kmcb-field .kmcb-file-btn{
  display:inline-block; background:var(--gold); color:var(--ink); border:none; border-radius:1px;
  padding:10px 18px; font-family:var(--font-mono); font-size:12px; text-transform:uppercase;
  letter-spacing:.05em; cursor:pointer; margin:0; white-space:nowrap;
}
.kmcb-field .kmcb-file-btn:hover{ background:var(--gold-bright); }
.kmcb-file-input:focus-visible + .kmcb-file-btn{ outline:2px solid var(--gold); outline-offset:2px; }
.kmcb-file-name{ color:var(--paper-dim); font-size:13px; word-break:break-all; }
.kmcb-btn{ width:100%; }
.kmcb-note{ font-size:12px; color:var(--steel); margin-top:12px; line-height:1.5; }
.kmcb-alert{ padding:14px 16px; border-radius:2px; font-size:14px; margin-bottom:20px; line-height:1.5; }
.kmcb-alert-success{ background:rgba(227,167,18,.14); border:1px solid var(--gold); color:var(--paper); }
.kmcb-alert-error{ background:rgba(212,60,42,.12); border:1px solid #D43C2A; color:var(--paper); }
.kmcb-hp{ position:absolute; left:-9999px; top:-9999px; }

/* ---------- nav — connexion / espace membre ---------- */
.nav-links a.nav-login{
  display:inline-flex; align-items:center; justify-content:center;
  color:var(--gold); border:1px solid var(--gold); border-radius:2px;
  padding:8px 16px; white-space:nowrap;
  transition:background .2s ease, color .2s ease;
}
.nav-links a.nav-login:hover{ background:var(--gold); color:var(--ink); }
.nav-links-logout{ display:none; }
@media (max-width:900px){
  .nav-logout-desktop{ display:none; }
  .nav-links-logout{ display:block; }
  .nav-links a.nav-login{ width:auto; display:inline-flex; margin-top:14px; border:1px solid var(--gold); padding:12px 20px; }
}

/* ---------- espace membre ---------- */
.kmcb-profile-photo{ width:96px; height:96px; border-radius:50%; object-fit:cover; flex-shrink:0; border:1px solid var(--line-strong); }
.kmcb-profile-photo-empty{ background:var(--ink-soft); }
.kmcb-infos-list{ list-style:none; margin:0 0 24px; padding:16px 0 0; border-top:1px solid var(--line); }
.kmcb-infos-list li{
  display:flex; justify-content:space-between; gap:16px; padding:8px 0; font-size:14px;
  color:var(--paper); border-bottom:1px solid var(--line);
}
.kmcb-infos-list li:last-child{ border-bottom:none; }
.kmcb-infos-list li span{
  font-family:var(--font-mono); font-size:11px; letter-spacing:.05em; text-transform:uppercase;
  color:var(--steel);
}
.kmcb-onglets{ margin-top:20px; }
.kmcb-onglet-bloc{ margin-bottom:36px; }
.kmcb-onglet-bloc h3{
  font-family:var(--font-mono); font-size:13px; letter-spacing:.08em; text-transform:uppercase;
  color:var(--gold); margin-bottom:16px;
}
.kmcb-ressource{ background:var(--ink-card); border:1px solid var(--line); padding:24px; border-radius:2px; margin-bottom:1px; }
.kmcb-ressource h4{ color:var(--paper); font-size:17px; margin:0 0 10px; }
.kmcb-ressource div{ color:var(--paper-dim); font-size:14px; line-height:1.6; }

/* .wp-content-area a force le doré + souligné (bon pour les liens de texte,
   mauvais pour les boutons .btn qu'elle contient) — on reprend la main ici. */
.wp-content-area .btn{ text-decoration:none; }
.wp-content-area .btn-primary{ color:var(--ink); }
.wp-content-area .btn-ghost{ color:var(--paper); }

/* ---------- espace membre — carte d'état (avant/après essai, actif) ---------- */
.kmcb-etat-card{
  background:var(--ink-card); border:1px solid var(--line-strong); border-radius:2px;
  padding:34px; margin-bottom:8px;
}
.kmcb-etat-avant{ border-color:var(--gold); }
.kmcb-etat-felicitations{ border-color:var(--gold); background:rgba(227,167,18,.08); }
.kmcb-etat-badge{
  display:inline-block; font-family:var(--font-mono); font-size:11px; letter-spacing:.08em;
  text-transform:uppercase; color:var(--gold); border:1px solid var(--gold); border-radius:20px;
  padding:5px 14px; margin-bottom:16px;
}
.kmcb-etat-card h2{ font-size:clamp(22px,3vw,30px); margin:0 0 14px; }
.kmcb-etat-card .kmcb-sub{ color:var(--paper-dim); font-size:15px; line-height:1.6; margin-bottom:14px; max-width:560px; }

.kmcb-seance-card{
  background:var(--ink-soft); border:1px solid var(--line); border-radius:2px; padding:22px 24px; margin:20px 0;
}
.kmcb-seance-date{ font-family:var(--font-display); font-weight:400; text-transform:uppercase; font-size:22px; color:var(--paper); margin:0 0 8px; }
.kmcb-seance-lieu{ color:var(--paper-dim); font-size:14px; line-height:1.5; margin:0; }
.kmcb-countdown{ color:var(--gold); font-weight:600; font-size:14px; margin:12px 0 0; }

.kmcb-etat-actions{ display:flex; flex-wrap:wrap; gap:12px; margin-top:20px; align-items:flex-start; }
.kmcb-etat-actions details summary{ list-style:none; }
.kmcb-etat-actions details summary::-webkit-details-marker{ display:none; }
.kmcb-etat-actions details select{
  background:var(--ink-soft); border:1px solid var(--line-strong); color:var(--paper);
  padding:10px 12px; border-radius:1px; font-size:14px; max-width:280px;
}
.kmcb-etat-detail{ display:none; margin-top:26px; padding-top:22px; border-top:1px solid var(--line); }
.kmcb-etat-detail:target, #preparer-seance:target{ display:block; }
.kmcb-etat-detail ul{ color:var(--paper-dim); padding-left:20px; margin:10px 0; }
.kmcb-etat-detail li{ margin-bottom:6px; }

.kmcb-reduction-breakdown{ list-style:none; margin:0 0 20px; padding:14px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.kmcb-reduction-breakdown li{ display:flex; justify-content:space-between; gap:12px; padding:4px 0; font-size:14px; color:var(--paper-dim); }
.kmcb-reduction-breakdown .kmcb-reduction-total{ margin-top:6px; padding-top:10px; border-top:1px solid var(--line); font-weight:600; color:var(--paper); }
.kmcb-reduction-breakdown .kmcb-reduction-total span:last-child{ color:var(--gold); font-size:17px; }

.kmcb-signalement-form{ margin-top:18px; }
.kmcb-btn-small{ width:auto; padding:10px 18px; font-size:12px; }
/* Pratiquants mineurs : documents FEKM à télécharger (formulaire découverte) */
.kmcb-minor-docs-list{ display:flex; flex-direction:column; gap:12px; margin:16px 0; }
.kmcb-minor-doc{ display:flex; flex-wrap:wrap; align-items:center; gap:8px 14px; }
.kmcb-minor-doc .btn{ white-space:normal; text-align:left; }
.kmcb-minor-docs-warning{ margin-top:14px; padding:12px 14px; border:1px solid #D43C2A; border-left-width:4px; border-radius:4px; background:rgba(212,60,42,.10); color:var(--paper); font-size:14px; line-height:1.5; }
/* Pointage de la remise des documents (page Présences instructeur, espace membre) */
.kmcb-minor-docs-check{ display:flex; flex-direction:column; gap:6px; margin-top:8px; }
/* Infobulle de définition d'un indicateur (dashboards) */
.kmcb-infobulle{ display:inline-block; margin-left:4px; color:var(--gold); cursor:help; font-size:12px; }
.kmcb-minor-doc-form{ display:flex; flex-wrap:wrap; align-items:center; gap:6px 12px; }

/* La grille s'adapte au nombre de cartes (2 tarifs après un cours
   d'essai, jamais de colonne fantôme). */
.kmcb-tarifs-grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(300px, 1fr)); gap:2px; background:var(--line-strong); margin-top:8px; }
.kmcb-tarifs-grid .kmcb-form-card{ background:var(--ink-card); }
@media (max-width:900px){ .kmcb-tarifs-grid{ grid-template-columns:1fr; } }

.kmcb-planning-table{ width:100%; border-collapse:collapse; }
.kmcb-planning-table td{ padding:10px 0; border-bottom:1px solid var(--line); color:var(--paper-dim); font-size:14px; }
.kmcb-planning-table tr:last-child td{ border-bottom:none; }
.kmcb-planning-table td:first-child{ color:var(--paper); font-weight:600; }

.kmcb-actualite, .kmcb-evenement{ padding:16px 0; border-top:1px solid var(--line); }
.kmcb-actualite:first-of-type, .kmcb-evenement:first-of-type{ border-top:none; padding-top:0; }
.kmcb-actualite h4, .kmcb-evenement h4{ color:var(--paper); font-size:16px; margin:0 0 4px; }
.kmcb-actualite div, .kmcb-evenement div{ color:var(--paper-dim); font-size:14px; line-height:1.6; }

.kmcb-documents-list{ list-style:none; padding:0; margin:0; }
.kmcb-documents-list li{ padding:10px 0; border-top:1px solid var(--line); }
.kmcb-documents-list li:first-child{ border-top:none; }
.kmcb-documents-list a{ color:var(--gold); text-decoration:underline; }

.kmcb-fermetures-list{ list-style:none; padding:0; margin:0; }
.kmcb-fermetures-list li{ padding:10px 0; border-top:1px solid var(--line); color:var(--paper-dim); font-size:14px; }
.kmcb-fermetures-list li:first-child{ border-top:none; }
.kmcb-fermetures-list strong{ color:var(--paper); }
.kmcb-fermeture-type{ color:var(--paper-dim); font-size:13px; }

/* ---------- "Ma progression" — tableau de bord de présence ---------- */
.kmcb-prochaines-list{ list-style:none; margin:0; padding:0; }
.kmcb-prochaine-item{
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:14px;
  padding:16px 0; border-top:1px solid var(--line);
}
.kmcb-prochaine-item:first-child{ border-top:none; padding-top:0; }
.kmcb-prochaine-date strong{ display:block; color:var(--paper); font-size:15px; }
.kmcb-prochaine-date .kmcb-note{ margin-top:2px; }
.kmcb-prochaine-actions{ display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
.kmcb-prochaine-actions form{ margin:0; }
.kmcb-prochaine-actions .btn{ width:auto; }
/* Repère temporel de la séance la plus proche. */
.kmcb-delai-badge{
  display:inline-block; margin-top:4px; padding:3px 10px; border-radius:999px;
  background:rgba(227,167,18,.14); border:1px solid var(--gold);
  font-family:var(--font-mono); font-size:11px; letter-spacing:.06em;
  text-transform:uppercase; color:var(--gold);
}
/* « Ajouter à mon agenda » : bouton au même gabarit que la réponse de
   présence, mais toujours en contour — l'action principale reste la
   réponse, qui passe en plein une fois la venue annoncée. */
.kmcb-prochaine-actions .btn{ text-decoration:none; }

/* Connexion des membres, servie sur /espace-membre/ pour ne pas divulguer
   l'adresse masquée du back-office (voir inc/member-login.php). */
.kmcb-login-card{ max-width:460px; }
.kmcb-login-oubli{ margin-top:22px; border-top:1px solid var(--line); padding-top:16px; }
.kmcb-login-oubli summary{
  cursor:pointer; font-family:var(--font-mono); font-size:12px;
  letter-spacing:.06em; text-transform:uppercase; color:var(--steel);
}
.kmcb-login-oubli summary:hover{ color:var(--paper-dim); }
.kmcb-login-oubli form{ margin-top:16px; }

.kmcb-stats-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:2px; background:var(--line-strong); }
.kmcb-stat-card{ background:var(--ink-card); padding:24px 20px; text-align:center; }
.kmcb-stat-value{ font-family:var(--font-display); font-weight:400; font-size:34px; color:var(--gold); margin:0 0 6px; }
.kmcb-stat-value-small{ font-size:18px; text-transform:capitalize; }
.kmcb-stat-label{ font-family:var(--font-mono); font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--steel); margin:0; }
.kmcb-stats-grid-2{ grid-template-columns:repeat(2,1fr); }
.kmcb-stats-grid-3{ grid-template-columns:repeat(3,1fr); }
@media (max-width:760px){
  .kmcb-stats-grid{ grid-template-columns:1fr 1fr; }
  .kmcb-stats-grid-2,
  .kmcb-stats-grid-3{ grid-template-columns:1fr; }
}

.kmcb-rings-grid{ display:flex; flex-wrap:wrap; gap:28px; margin-top:8px; }
.kmcb-ring-card{ flex:1 1 220px; min-width:200px; text-align:center; }
.kmcb-ring-card-empty{ display:flex; flex-direction:column; justify-content:center; padding:20px 12px; border:1px dashed var(--line-strong); border-radius:2px; }
.kmcb-ring-svg{ display:block; margin:0 auto 12px; }
.kmcb-ring-bg{ fill:none; stroke:var(--line-strong); stroke-width:10; }
.kmcb-ring-fg{
  fill:none; stroke:var(--gold); stroke-width:10; stroke-linecap:round;
  transform:rotate(-90deg); transform-origin:50% 50%; transition:stroke-dashoffset .4s ease;
}
.kmcb-ring-text{ font-family:var(--font-display); font-size:22px; fill:var(--paper); }
.kmcb-ring-title{ color:var(--paper); font-size:15px; margin:0 0 6px; text-transform:none; }
.kmcb-ring-phrase{ color:var(--paper-dim); font-size:13px; line-height:1.5; margin:0; }
.kmcb-ring-details{ margin-top:10px; text-align:left; }
.kmcb-ring-details summary{ cursor:pointer; color:var(--gold); font-size:12px; font-family:var(--font-mono); text-transform:uppercase; letter-spacing:.05em; }
.kmcb-ring-details div{ color:var(--paper-dim); font-size:12px; line-height:1.5; margin-top:8px; }

.kmcb-bar-chart-wrap{ overflow-x:auto; }
.kmcb-bar-chart{ display:block; height:180px; width:auto; max-width:100%; }
.kmcb-bar-rect{ fill:var(--gold); }
.kmcb-bar-value{ fill:var(--paper); font-size:12px; font-family:var(--font-mono); }
.kmcb-bar-label{ fill:var(--steel); font-size:11px; font-family:var(--font-mono); text-transform:uppercase; }

.kmcb-table-scroll{ overflow-x:auto; }
.kmcb-historique-table{ min-width:520px; }
.kmcb-historique-table th{
  text-align:left; padding:8px 12px 8px 0; font-family:var(--font-mono); font-size:11px;
  letter-spacing:.05em; text-transform:uppercase; color:var(--steel); border-bottom:1px solid var(--line-strong);
}
.kmcb-historique-table td{ padding:10px 12px 10px 0; }

/* ---------- bandeau compte à rebours "prochain cours" (accueil) ---------- */
.countdown-bar{
  background:var(--ink-soft); border-bottom:1px solid var(--line-strong);
  position:sticky; top:79px; z-index:40;
}
.countdown-inner{
  display:flex; align-items:center; justify-content:center; flex-wrap:wrap;
  gap:32px; padding:16px 24px;
}
.countdown-label{ display:flex; flex-direction:column; align-items:center; text-align:center; gap:4px; }
.countdown-label .eyebrow{ margin:0; justify-content:center; }
.countdown-label .eyebrow::before{ display:none; }
.countdown-date{
  font-family:var(--font-display); font-weight:400; text-transform:uppercase;
  font-size:22px; color:var(--paper);
}
.countdown-timer{ display:flex; align-items:center; gap:22px; }
.countdown-block{ display:flex; flex-direction:column; align-items:center; min-width:44px; }
.countdown-num{
  font-family:var(--font-display); font-weight:400;
  font-size:30px; line-height:1; color:var(--gold);
}
.countdown-unit{
  font-family:var(--font-mono); font-size:10px; letter-spacing:.08em; text-transform:uppercase;
  color:var(--steel); margin-top:4px;
}
@media (max-width:760px){
  .countdown-bar{ position:static; }
  .countdown-inner{ text-align:center; padding:16px; gap:6px; }
  .countdown-label{ align-items:center; width:100%; }
  .countdown-timer{ gap:14px; }
  .countdown-num{ font-size:24px; }
}

/* ---------- espace membre — identité, action, progression unifiée ----------
   Chaque bloc reprend les composants déjà existants (.kmcb-form-card, anneaux
   SVG, graphique barres, var(--gold)) : la couleur de grade est un fil
   conducteur discret, appliquée en scopant --gold/--gold-bright sur tout le
   conteneur .kmcb-membre-espace (voir template-espace-membre.php), jamais en
   dupliquant les styles des composants. */
.kmcb-membre-espace{ display:flex; flex-direction:column; gap:16px; margin-top:32px; }

/* Boutons secondaires colorés par le grade dès l'état normal (pas seulement
   au survol) — le fil de couleur doit rester visible sans interaction. */
.kmcb-membre-espace .btn-ghost{ border-color:var(--gold); color:var(--gold); }
.kmcb-membre-espace .btn-ghost:hover{ background:var(--gold); color:var(--ink); border-color:var(--gold); }
.kmcb-membre-espace .kmcb-etat-card{ border-left:3px solid var(--gold); }

/* ---------- dashboards admin/instructeur — graphiques, filtres, pagination ---------- */
.kmcb-chart-wrap{ position:relative; height:220px; margin-bottom:16px; }

.kmcb-dashboard-filters{ display:flex; gap:10px; margin:16px 0; flex-wrap:wrap; }
.kmcb-dashboard-filters input[type="search"]{
  flex:1; min-width:220px; background:var(--ink-soft); border:1px solid var(--line-strong); color:var(--paper);
  padding:10px 14px; border-radius:1px; font-size:14px;
}

.kmcb-dashboard-filter-chips{ display:flex; gap:8px; flex-wrap:wrap; margin-bottom:20px; }
.kmcb-filter-chip{
  display:inline-block; font-family:var(--font-mono); font-size:11px; letter-spacing:.05em; text-transform:uppercase;
  color:var(--paper-dim); border:1px solid var(--line-strong); border-radius:20px; padding:7px 14px; text-decoration:none;
  transition:color .2s ease, border-color .2s ease, background .2s ease;
}
.kmcb-filter-chip:hover{ border-color:var(--gold); color:var(--gold); }
.kmcb-filter-chip.active{ background:var(--gold); border-color:var(--gold); color:var(--ink); }
.kmcb-filter-chip.kmcb-filter-reset{ border-style:dashed; }

.kmcb-dashboard-pagination{ display:flex; gap:6px; margin-top:16px; flex-wrap:wrap; }

.kmcb-identity-card{
  background:var(--ink-card); border:1px solid var(--line-strong); border-radius:2px; padding:28px 30px;
  border-left:3px solid var(--gold);
}
.kmcb-identity-main{ display:flex; align-items:center; gap:20px; flex-wrap:wrap; }
/* Pastille « dossier complet » — poussée à droite de la carte d'identité,
   dans la teinte du grade (var(--gold) est redéfinie par la carte). */
.kmcb-dossier-ok{
  margin-left:auto; display:flex; flex-direction:column; gap:3px; text-align:right;
  padding:12px 16px; border:1px solid var(--gold); border-radius:2px;
  background:rgba(227,167,18,.14);
}
.kmcb-dossier-ok-title{
  font-family:var(--font-mono); font-size:12px; letter-spacing:.08em; text-transform:uppercase;
  color:var(--gold);
}
.kmcb-dossier-ok-detail{ font-size:13px; color:var(--paper-dim); }
@media (max-width:640px){
  .kmcb-dossier-ok{ margin-left:0; width:100%; text-align:left; align-items:flex-start; }
}
.kmcb-identity-text .kmcb-etat-badge{ margin-bottom:8px; }
.kmcb-identity-text h2{ font-size:clamp(20px,2.6vw,26px); margin:0 0 6px; }
.kmcb-identity-meta{ font-size:14px; color:var(--paper-dim); margin:0; }
.kmcb-identity-grade{ color:var(--gold); font-weight:600; }
.kmcb-identity-sep{ margin:0 8px; color:var(--line-strong); }

.kmcb-identity-edit{ margin-top:22px; padding-top:20px; border-top:1px solid var(--line); }
.kmcb-identity-edit summary{
  cursor:pointer; list-style:none; display:inline-flex; align-items:center; gap:8px;
  font-family:var(--font-mono); font-size:12px; letter-spacing:.06em; text-transform:uppercase;
  color:var(--gold); border:1px solid var(--gold); border-radius:20px; padding:9px 18px;
}
.kmcb-identity-edit summary::-webkit-details-marker{ display:none; }
.kmcb-identity-edit[open] summary{ background:var(--gold); color:var(--ink); }
.kmcb-identity-edit-body{ margin-top:22px; }

.kmcb-progress-split{ display:grid; grid-template-columns:repeat(auto-fit, minmax(320px, 1fr)); gap:2px; background:var(--line-strong); margin-top:18px; }
.kmcb-progress-panel{ background:var(--ink-card); padding:22px 24px; }
.kmcb-progress-panel h4{
  font-family:var(--font-mono); font-size:12px; letter-spacing:.06em; text-transform:uppercase;
  color:var(--gold); margin:0 0 14px;
}
.kmcb-progress-numbers{ display:flex; gap:28px; flex-wrap:wrap; }
.kmcb-progress-numbers strong{
  display:block; font-family:var(--font-display); font-weight:400;
  font-size:26px; color:var(--paper);
}
.kmcb-progress-numbers span{
  font-family:var(--font-mono); font-size:10px; letter-spacing:.06em; text-transform:uppercase;
  color:var(--steel); margin-top:2px; display:block;
}

/* Bascule espace membre <-> dashboard du personnel : le bouton vit sur
   la ligne de l'accroche « Espace privé », jamais dans le menu. */
.kmcb-eyebrow-row{ display:flex; align-items:center; gap:16px; flex-wrap:wrap; }
.kmcb-eyebrow-row .eyebrow{ margin:0; }
.kmcb-eyebrow-switch{ white-space:nowrap; }

/* Choix de tarif après le cours d'essai : le formulaire vit derrière
   un bouton — la carte reste une comparaison de prix. */
.kmcb-tarif-choix{ margin-top:16px; }
.kmcb-tarif-choix summary{ list-style:none; cursor:pointer; display:block; text-align:center; }
.kmcb-tarif-choix summary::-webkit-details-marker{ display:none; }
.kmcb-tarif-choix[open] summary{ display:none; }
.kmcb-tarif-choix-form{ margin-top:18px; }
/* Repli garanti même sur les navigateurs au comportement <details>
   défaillant : le formulaire n'existe visuellement qu'une fois ouvert. */
.kmcb-tarif-choix:not([open]) .kmcb-tarif-choix-form{ display:none; }
/* Les deux cartes de tarif gardent leurs lignes alignées : la zone de
   description réserve deux lignes, que le texte en occupe une ou deux. */
.kmcb-tarifs-grid > .kmcb-form-card > .kmcb-sub{ min-height:3.4em; }

/* ---------- Outils instructeur en front-office (chantier #139) ----------
   Pensés mobile d'abord : l'appel se fait sur téléphone au bord du
   tatami — cibles tactiles généreuses, un geste par membre. */

/* Liste des séances / des membres */
.kmcb-appel-seances{ list-style:none; margin:0; padding:0; }
.kmcb-appel-seance{
  display:flex; align-items:center; justify-content:space-between; gap:14px;
  padding:12px 0; border-bottom:1px solid var(--line);
}
.kmcb-appel-seance:last-child{ border-bottom:none; }
.kmcb-appel-seance .kmcb-note{ display:block; margin-top:2px; }
.kmcb-appel-compte{ color:var(--paper-dim); font-weight:400; }

/* Feuille d'appel */
.kmcb-appel-liste{ list-style:none; margin:0; padding:0; }
.kmcb-appel-membre{
  display:flex; align-items:center; justify-content:space-between; gap:14px;
  padding:12px 0; border-bottom:1px solid var(--line); flex-wrap:wrap;
}
.kmcb-appel-membre:last-child{ border-bottom:none; }
.kmcb-appel-identite{ min-width:150px; }
.kmcb-appel-identite .kmcb-note{ display:block; margin-top:2px; }
.kmcb-appel-choix{ display:flex; gap:6px; flex-wrap:wrap; }
.kmcb-appel-pill{ cursor:pointer; }
.kmcb-appel-pill input{ position:absolute; opacity:0; pointer-events:none; }
.kmcb-appel-pill span{
  display:flex; align-items:center; justify-content:center;
  min-height:44px; padding:8px 14px;
  border:1px solid var(--line-strong); border-radius:4px;
  font-size:14px; color:var(--paper-dim); user-select:none;
  transition:background .15s, border-color .15s, color .15s;
}
.kmcb-appel-pill input:focus-visible + span{ outline:2px solid var(--gold); outline-offset:2px; }
.kmcb-appel-pill input:checked + span{ color:#121212; font-weight:600; }
.kmcb-appel-pill-pending input:checked + span{ background:var(--paper-dim); border-color:var(--paper-dim); }
.kmcb-appel-pill-present input:checked + span{ background:var(--gold); border-color:var(--gold); }
.kmcb-appel-pill-absent input:checked + span{ background:#b3564d; border-color:#b3564d; color:var(--paper); }
.kmcb-appel-pill-excused input:checked + span{ background:#8b8b84; border-color:#8b8b84; }
.kmcb-appel-pill input:disabled + span{ opacity:.55; cursor:not-allowed; }

/* Barre d'enregistrement toujours à portée de pouce (fond opaque : lisible par-dessus la liste) */
.kmcb-appel-valider{
  position:sticky; bottom:0; z-index:5; margin:18px -12px 0; padding:10px 12px calc(10px + env(safe-area-inset-bottom));
  background:var(--ink, #121212); border-top:1px solid var(--line-strong);
}
.kmcb-appel-valider .btn{ width:100%; }
.kmcb-appel-etat{ margin:0 0 8px; font-size:13px; color:var(--paper-dim); text-align:center; }
.kmcb-appel-etat.is-modifie{ color:var(--gold); font-weight:600; }
.kmcb-appel-reset{ margin:14px 0 0; text-align:center; }
.kmcb-appel-reset .is-danger{ color:#e0897f; border-color:#b3564d; }

/* Formulaire de contact */
.kmcb-contact{ max-width:640px; margin:0 auto; text-align:left; }
.kmcb-contact-piege{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }

/* Recherche, filtres et action groupée */
.kmcb-appel-outils .screen-reader-text{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.kmcb-appel-outils{ display:flex; flex-direction:column; gap:12px; }
.kmcb-appel-outils input[type="search"]{
  width:100%; min-height:44px; padding:8px 12px; font:inherit; font-size:16px;
  background:transparent; color:var(--paper); border:1px solid var(--line-strong); border-radius:4px; -webkit-appearance:none; appearance:none;
}
.kmcb-appel-outils input[type="search"]::placeholder{ color:var(--paper-dim); }
.kmcb-appel-outils input[type="search"]:focus{ outline:2px solid var(--gold); outline-offset:1px; }
.kmcb-appel-filtres{ display:flex; gap:6px; flex-wrap:wrap; }
.kmcb-appel-filtre{
  min-height:40px; padding:6px 12px; border:1px solid var(--line-strong); border-radius:999px;
  background:transparent; color:var(--paper-dim); font:inherit; font-size:13px; cursor:pointer;
}
.kmcb-appel-filtre.is-actif{ background:var(--paper); border-color:var(--paper); color:#121212; font-weight:600; }
.kmcb-appel-membre[hidden], .kmcb-form-card[hidden]{ display:none; }
.kmcb-appel-membre.is-modifie .kmcb-appel-identite strong::after{ content:" •"; color:var(--gold); }

.kmcb-appel-duree label{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.kmcb-appel-duree input[type="number"]{ width:90px; }
.kmcb-appel-duree{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; }

/* Techniques par séance */
.kmcb-appel-choix-seance select{ width:100%; max-width:420px; }
.kmcb-techniques-programme summary{
  cursor:pointer; font-size:16px; padding:4px 0; color:var(--paper);
}
.kmcb-techniques-programme[open] summary{ margin-bottom:10px; }
.kmcb-techniques-uv{ margin:14px 0 4px; color:var(--gold); font-size:14px; text-transform:uppercase; letter-spacing:.06em; }
.kmcb-techniques-item{
  display:flex; align-items:center; gap:12px;
  padding:10px 8px; border-bottom:1px solid var(--line); cursor:pointer;
}
.kmcb-techniques-item:last-child{ border-bottom:none; }
.kmcb-techniques-item input[type="checkbox"]{ width:20px; height:20px; flex-shrink:0; accent-color:var(--gold); }

/* Suivi pédagogique */
.kmcb-suivi-uv summary{ cursor:pointer; font-size:16px; padding:4px 0; color:var(--paper); }
.kmcb-suivi-uv[open] summary{ margin-bottom:10px; }
.kmcb-suivi-liste{ list-style:none; margin:0; padding:0; }
.kmcb-suivi-item{
  display:flex; align-items:center; justify-content:space-between; gap:14px;
  padding:10px 0; border-bottom:1px solid var(--line); flex-wrap:wrap;
}
.kmcb-suivi-item:last-child{ border-bottom:none; }
.kmcb-suivi-item-libelle{ flex:1; min-width:200px; }
.kmcb-suivi-item-libelle .kmcb-note{ display:block; margin-top:2px; }
.kmcb-suivi-select-validated_in_training{ border-color:var(--gold); }

/* Suivi pédagogique : « Vue en cours le … » bien visible (pastille
   dorée), « Pas encore abordée » discret. */
.kmcb-suivi-item-validation{ min-width:230px; text-align:right; }
.kmcb-suivi-vue{
  display:inline-flex; flex-direction:column; align-items:flex-end; gap:3px;
  padding:9px 14px; border-radius:6px;
  background:var(--gold); color:#121212; font-weight:700; font-size:15px; line-height:1.3;
}
.kmcb-suivi-vue em{ font-style:normal; font-weight:600; font-size:13px; opacity:.85; }
.kmcb-suivi-vue-dates{ font-weight:500; font-size:13px; }
.kmcb-suivi-vue-non{ background:transparent; color:var(--paper-dim); border:1px solid var(--line-strong); font-weight:600; }
@media (max-width:640px){
  .kmcb-suivi-item-validation{ text-align:left; min-width:0; }
  .kmcb-suivi-vue{ width:100%; align-items:flex-start; }
}

/* Mobile : l'appel passe en colonnes, pastilles en grille 2×2 */
@media (max-width:640px){
  .kmcb-appel-membre{ flex-direction:column; align-items:stretch; }
  .kmcb-appel-choix{ display:grid; grid-template-columns:repeat(4,1fr); gap:6px; }
  .kmcb-appel-pill span{ padding:8px 4px; font-size:13px; }
  .kmcb-appel-seance{ flex-wrap:wrap; }
  .kmcb-suivi-item{ flex-direction:column; align-items:stretch; }
  .kmcb-suivi-item-validation select{ width:100%; }
}

/* ---- Avis Google (page d'accueil) ---- */
section.avis{padding-top:0;}
.avis .avis-head{display:flex; align-items:flex-end; justify-content:space-between; gap:30px; flex-wrap:wrap; margin-bottom:42px;}
.avis .avis-head h2{font-size:clamp(30px,4vw,44px); margin-top:18px;}
.avis .avis-head h2 span{color:var(--gold);}
.avis-note{display:flex; flex-direction:column; align-items:flex-end; gap:5px;}
.avis-note-chiffre{font-family:var(--font-display); font-size:46px; color:var(--paper); line-height:1;}
.avis-etoiles{color:var(--gold); letter-spacing:3px; font-size:16px;}
.avis-note .avis-etoiles{font-size:20px;}
a.avis-count{color:var(--paper-dim); font-size:14px; text-decoration:underline; text-underline-offset:3px;}
a.avis-count:hover{color:var(--gold);}
.avis-carrousel{position:relative;}
.avis-grid{display:flex; gap:14px; overflow-x:auto; scroll-snap-type:x mandatory; -ms-overflow-style:none; scrollbar-width:none; outline:none;}
.avis-grid::-webkit-scrollbar{display:none;}
.avis-card{background:var(--ink-card); border:1px solid var(--line); border-radius:2px; padding:26px 24px; margin:0; display:flex; flex-direction:column; gap:14px; flex:0 0 calc((100% - 28px)/3); scroll-snap-align:start;}
.avis-fleche{position:absolute; top:50%; transform:translateY(-50%); z-index:2; width:44px; height:44px; border-radius:999px; border:1px solid var(--line-strong); background:var(--ink-card); color:var(--gold); font-size:26px; line-height:1; cursor:pointer; display:flex; align-items:center; justify-content:center; padding:0 0 4px; transition:border-color .2s ease, color .2s ease, opacity .2s ease;}
.avis-fleche:hover{border-color:var(--gold); color:var(--gold-bright);}
.avis-fleche-prev{left:-16px;}
.avis-fleche-next{right:-16px;}
.avis-fleche[disabled]{opacity:.3; cursor:default;}
.avis-fleche[disabled]:hover{border-color:var(--line-strong); color:var(--gold);}
.avis-card blockquote{color:var(--paper-dim); font-size:15.5px; line-height:1.65; flex:1;}
.avis-card figcaption{color:var(--paper); font-weight:600; font-size:14.5px;}
.avis-actions{display:flex; gap:14px; margin-top:38px; flex-wrap:wrap;}
@media (max-width:900px){
  .avis-card{flex-basis:calc(100% - 30px);}
  .avis-note{align-items:flex-start;}
  .avis-fleche-prev{left:-8px;}
  .avis-fleche-next{right:-8px;}
}

/* Planning : équipement par créneau (baskets / gants de boxe) */
.schedule-note{ display:inline-flex; align-items:center; gap:6px; margin-left:12px; font-family:var(--font-mono); font-size:12px; letter-spacing:.04em; text-transform:uppercase; color:var(--gold); white-space:nowrap; vertical-align:middle; }
.schedule-note-emoji{ font-size:18px; line-height:1; font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif; flex:none; }
@media (max-width:640px){ .schedule-note{ display:flex; margin:6px 0 0; } }

/* ============================================================
   Mode compact des espaces privés (mission du 2026-09-20, point 9).
   Identité KMCB inchangée (logo, couleurs, typographie) : seul l'espace
   vertical occupé par l'habillage marketing est réduit, uniquement sur
   les 4 pages privées (voir inc/espace-compact.php). Jamais sur les
   pages publiques.
   ============================================================ */
.kmcb-espace-compact .hero-small{ padding:26px 0 18px; }
.kmcb-espace-compact .hero-small h1{ font-size:clamp(22px,4vw,30px); margin:8px 0 6px; line-height:1.15; }
.kmcb-espace-compact .hero-small p.lead{ font-size:14px; margin-bottom:0; max-width:100%; }
.kmcb-espace-compact .kmcb-eyebrow-row{ margin-bottom:4px; }

/* Le compte à rebours garde sa fonction (savoir quand a lieu le prochain
   cours) mais devient une carte discrète, non collante : sur une page de
   travail, un bloc qui reste figé à l'écran en scrollant coûte plus de
   place qu'il n'apporte d'information. */
.kmcb-espace-compact .countdown-bar{ position:static; }
.kmcb-espace-compact .countdown-inner{ padding:8px 16px; gap:16px; }
.kmcb-espace-compact .countdown-date{ font-size:13px; }
.kmcb-espace-compact .countdown-timer{ gap:10px; }
.kmcb-espace-compact .countdown-block{ min-width:30px; }
.kmcb-espace-compact .countdown-num{ font-size:17px; }
.kmcb-espace-compact .countdown-unit{ font-size:8px; }

@media (max-width:640px){
  .kmcb-espace-compact .hero-small{ padding:20px 0 14px; }
  .kmcb-espace-compact .countdown-inner{ padding:8px; gap:4px; }
}

/* ============================================================
   KMCB — Dashboard membre : sidebar + structure à deux zones
   (chantier "Mon espace" du 2026-09-20, référence dashboard.png,
   Lot A). N'existe que sur /espace-membre/ quand le visiteur est
   membre ou personnel du club (voir template-espace-membre.php) ;
   n'affecte aucune autre page.
   ============================================================ */
.kmcb-dashboard-shell{
  display:flex;
  align-items:flex-start;
}
.kmcb-dashboard-sidebar{
  flex:0 0 168px;
  width:168px;
  background:#151417;
  border-right:1px solid var(--line);
  position:sticky;
  top:0;
  align-self:flex-start;
  min-height:100vh;
  padding:20px 0;
  box-sizing:border-box;
}
.kmcb-dashboard-nav{ display:flex; flex-direction:column; gap:2px; padding:0 10px; }
.kmcb-dashboard-nav-item{
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px;
  border-radius:4px;
  border-left:2px solid transparent;
  color:var(--paper-dim);
  text-decoration:none;
  font-size:12.5px;
  letter-spacing:.02em;
  text-transform:uppercase;
  transition:background .2s, color .2s, border-color .2s;
}
.kmcb-dashboard-nav-item:hover{ background:rgba(239,235,227,0.05); color:var(--paper); }
.kmcb-dashboard-nav-item.is-active{
  background:rgba(227,167,18,0.10);
  border-left-color:var(--gold);
  color:var(--paper);
}
.kmcb-dashboard-nav-item.is-active .kmcb-sidebar-icon{ color:var(--gold); }
.kmcb-sidebar-icon{ flex:0 0 auto; color:currentColor; }

.kmcb-dashboard-main{ flex:1; min-width:0; }
.kmcb-dashboard-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:12px;
  padding:22px 32px;
  border-bottom:1px solid var(--line);
}
.kmcb-dashboard-header-text .eyebrow{ margin-bottom:2px; }
.kmcb-dashboard-header-text h1{ font-size:clamp(26px,3vw,38px); margin:0; line-height:1.1; }
.kmcb-dashboard-header-actions{ display:flex; gap:10px; flex-wrap:wrap; }
.kmcb-dashboard-main > .wp-content-area{ padding:28px 32px; }
.kmcb-dashboard-main > .wp-content-area .wrap{ max-width:1200px; margin:0; padding:0; }

@media (max-width:900px){
  .kmcb-dashboard-shell{ flex-direction:column; align-items:stretch; }
  .kmcb-dashboard-header{ padding:16px 18px; }
  .kmcb-dashboard-main > .wp-content-area{ padding:18px; }
  .kmcb-dashboard-main{ max-width:100%; overflow-x:hidden; }
}

/* Tablette ET mobile (≤900px) — retour utilisateur du 2026-09-21 :
   jamais de menu hamburger/panneau hors-écran, le menu latéral reste
   affiché en permanence, dans le flux normal de la page, juste sous le
   bandeau "Prochain cours" (rendu par header.php avant ce bloc). Même
   rail horizontal compact à toutes les largeurs sous 900px. */
@media (max-width:900px){
  .kmcb-dashboard-sidebar{
    flex:0 0 auto;
    position:static;
    width:100%;
    min-height:auto;
    padding:12px 0;
    border-right:none;
    border-bottom:1px solid var(--line);
  }
  .kmcb-dashboard-nav{ flex-direction:row; flex-wrap:nowrap; overflow-x:visible; padding:8px 4px; gap:2px; }
  .kmcb-dashboard-nav-item{
    flex:1 1 0; width:auto; min-width:0; flex-direction:column; gap:3px; font-size:9px; padding:8px 2px;
    text-align:center; border-left:none; border-bottom:2px solid transparent;
    white-space:normal; line-height:1.2; word-break:break-word; hyphens:auto;
  }
  .kmcb-dashboard-nav-item .kmcb-sidebar-icon{ width:17px; height:17px; }
  .kmcb-dashboard-nav-item.is-active{ border-left-color:transparent; border-bottom-color:var(--gold); }
}

/* ============================================================
   KMCB — Dashboard membre : barre de statistiques + carte "Mon
   prochain cours" (chantier "Mon espace" du 2026-09-20, référence
   dashboard.png, Lot B). Toutes les valeurs viennent de fonctions
   déjà existantes (inc/attendance-stats.php, inc/ranks-schema.php) —
   aucune nouvelle règle métier, uniquement de la mise en forme.
   ============================================================ */
.kmcb-stats-bar{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:1px;
  background:var(--line);
  border:1px solid var(--line-strong);
  border-radius:2px;
  overflow:hidden;
  margin-bottom:24px;
}
.kmcb-stat-tile{
  background:var(--ink-card);
  padding:18px 20px;
  display:flex;
  flex-direction:column;
  gap:4px;
}
.kmcb-stat-label{
  font-family:var(--font-mono); font-size:11px; letter-spacing:.08em; text-transform:uppercase;
  color:var(--steel);
}
.kmcb-stat-value{ font-size:22px; color:var(--paper); line-height:1.2; }
.kmcb-stat-value-ok{ color:#8FBF6B; }
.kmcb-stat-value-warn{ color:#E07A5F; }
.kmcb-stat-detail{ font-size:12.5px; color:var(--paper-dim); }
.kmcb-stat-footnote{ font-size:12px; color:var(--gold); margin-top:2px; }
.kmcb-stat-bar{ height:4px; background:var(--line); border-radius:2px; margin-top:6px; overflow:hidden; }
.kmcb-stat-bar-fill{ height:100%; background:var(--gold); border-radius:2px; }
@media (max-width:900px){
  .kmcb-stats-bar{ grid-template-columns:repeat(2, 1fr); }
}
@media (max-width:480px){
  .kmcb-stats-bar{ grid-template-columns:1fr; }
}

/* Carte "Mon prochain cours" — bloc de date vertical à gauche, infos
   au centre, actions en bas. Réutilise .kmcb-form-card / .kmcb-etat-actions
   pour rester visuellement cohérente avec le reste de la page. */
.kmcb-next-course-card{ border-left:3px solid var(--gold); }
.kmcb-next-course-body{ display:flex; gap:24px; align-items:center; flex-wrap:wrap; margin-top:12px; }
.kmcb-next-course-dateblock{
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  background:var(--ink-soft); border:1px solid var(--line-strong); border-radius:2px;
  padding:14px 22px; min-width:96px; text-align:center; flex-shrink:0;
}
.kmcb-next-course-day{ font-family:var(--font-mono); font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--gold); }
.kmcb-next-course-num{ font-family:var(--font-display); font-size:36px; line-height:1.1; color:var(--paper); }
.kmcb-next-course-month{ font-size:12px; color:var(--paper-dim); }
.kmcb-next-course-info{ display:flex; flex-direction:column; gap:4px; }
.kmcb-next-course-time{ font-size:17px; color:var(--paper); margin:0; font-weight:600; }
.kmcb-next-course-info .kmcb-delai-badge{ margin-top:4px; align-self:flex-start; }
@media (max-width:640px){
  .kmcb-next-course-body{ gap:14px; }
  .kmcb-next-course-dateblock{ min-width:80px; padding:10px 16px; }
  .kmcb-next-course-num{ font-size:28px; }
}

/* ============================================================
   KMCB — "Ma progression" (chantier "Mon espace" du 2026-09-20,
   référence dashboard.png, Lot C).
   ============================================================ */
.kmcb-unit-bars{ display:flex; flex-direction:column; gap:8px; margin-top:14px; }
.kmcb-unit-bar-row{ display:grid; grid-template-columns:1fr 90px 36px; align-items:center; gap:10px; }
.kmcb-unit-bar-label{ font-size:12px; color:var(--paper-dim); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.kmcb-unit-bar-track{ height:5px; background:var(--line); border-radius:3px; overflow:hidden; }
.kmcb-unit-bar-fill{ height:100%; background:var(--gold); border-radius:3px; }
.kmcb-unit-bar-pct{ font-size:11px; color:var(--paper-dim); text-align:right; }
@media (max-width:480px){
  .kmcb-unit-bar-row{ grid-template-columns:1fr 60px 30px; }
}

/* ============================================================
   KMCB — Contenu pédagogique, actualités, fermetures, pied de page
   du dashboard (chantier "Mon espace" du 2026-09-20, référence
   dashboard.png, Lot D).
   ============================================================ */
.kmcb-actualites-grid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(240px, 1fr)); gap:20px; margin-top:8px; }
.kmcb-actualite-card{ background:var(--ink-card); border:1px solid var(--line); border-radius:2px; overflow:hidden; }
.kmcb-actualite-image img{ display:block; width:100%; height:140px; object-fit:cover; }
.kmcb-actualite-body{ padding:16px 18px; }
.kmcb-actualite-body h4{ color:var(--paper); font-size:16px; margin:2px 0 8px; }
.kmcb-actualite-body div{ color:var(--paper-dim); font-size:14px; line-height:1.6; }

.kmcb-closures-bar{ display:flex; flex-direction:column; gap:14px; }
.kmcb-closures-next{ display:flex; align-items:center; gap:16px; flex-wrap:wrap; }
.kmcb-closures-next .kmcb-sidebar-icon{ color:var(--gold); width:26px; height:26px; flex-shrink:0; }
.kmcb-closures-next-text{ margin:2px 0 0; color:var(--paper-dim); font-size:14px; }
.kmcb-closures-next-text strong{ color:var(--paper); }
.kmcb-closures-more summary{ cursor:pointer; color:var(--paper-dim); font-size:13px; }
.kmcb-closures-more[open] summary{ margin-bottom:10px; }

/* ============================================================
   KMCB — Ordre de contenu suggéré pour le mobile (chantier "Mon
   espace" du 2026-09-20, Lot E) : Bonjour membre, Prochain cours,
   Statistiques, Progression, Contenu pédagogique, Actualités,
   Vacances. Uniquement via CSS (ordre visuel), le HTML garde l'ordre
   desktop — aucune donnée déplacée, aucune logique dupliquée.
   ============================================================ */
@media (max-width:640px){
  .kmcb-membre-espace{ display:flex; flex-direction:column; }
  #kmcb-mon-compte{ order:1; }
  .kmcb-next-course-card{ order:2; }
  .kmcb-stats-bar{ order:3; }
  .kmcb-progression-card{ order:4; }
  .kmcb-actualites-card{ order:5; }
  .kmcb-evenements-card{ order:6; }
  #kmcb-documents{ order:7; }
  .kmcb-licence-card{ order:8; }
  .kmcb-closures-bar{ order:9; }
  #kmcb-ressources{ order:10; }
}
