/* ============================================================
   CAPA Breizh — Abonnements : styles front (charte)
   Police Poppins · #2F4C48 (texte) · #278076 (liens/accent) · #826a13 (doré)
   ============================================================ */

.capa-wrap{
  --vert:#278076;
  --fonce:#2F4C48;
  --or:#9a8840;
  --creme:#faf9f6;
  --vert-clair:#eef7f4;
  --sep:rgba(39,128,118,.15);
  font-family:'Poppins',sans-serif;
  color:var(--fonce);
  max-width:1040px;margin:0 auto;padding:10px;
  box-sizing:border-box;
}
.capa-wrap *{box-sizing:border-box;}
.capa-wrap a{color:var(--vert);text-decoration:none;}
.capa-wrap a:hover{text-decoration:underline;}

.capa-h2{font-size:26px;font-weight:700;color:var(--fonce);text-align:center;margin:0 0 26px;}
.capa-h3{font-size:18px;font-weight:600;color:var(--fonce);margin:0 0 12px;}
.capa-info{text-align:center;font-size:16px;padding:30px 0;}

/* ---- Étapes ---- */
.capa-etape{display:none;}
.capa-etape.is-active{display:block;animation:capaFade .35s ease;}
@keyframes capaFade{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:none;}}

.capa-back{
  background:none;border:none;color:var(--vert);font-family:inherit;font-size:14px;
  font-weight:600;cursor:pointer;margin-bottom:16px;padding:0;
}
.capa-back:hover{text-decoration:underline;}

/* ============================================================
   ÉTAPE 1 — Type de formule
   ============================================================ */
.capa-types{display:flex;gap:24px;flex-wrap:wrap;justify-content:center;}
.capa-type{
  flex:1;min-width:280px;max-width:420px;
  background:#fff;border:2px solid var(--sep);border-radius:22px;
  padding:34px 28px;cursor:pointer;text-align:center;
  font-family:inherit;transition:border-color .2s,transform .2s,box-shadow .2s;
  display:flex;flex-direction:column;gap:10px;
}
.capa-type:hover{border-color:var(--vert);transform:translateY(-3px);box-shadow:0 16px 40px rgba(39,128,118,.14);}
.capa-type-titre{font-size:22px;font-weight:700;color:var(--fonce);}
.capa-type-sub{font-size:15px;color:#6b7671;font-weight:400;}

/* ============================================================
   ÉTAPE 2 — Choix de l'abonnement (toggle + cartes)
   ============================================================ */
.capa-toggle-wrap{text-align:center;margin-bottom:30px;}
.capa-toggle{
  display:inline-flex;background:var(--vert-clair);border-radius:50px;padding:5px;gap:4px;
}
.capa-toggle-opt{
  border:none;background:transparent;font-family:inherit;font-weight:600;font-size:15px;
  color:#6b7671;padding:11px 24px;border-radius:50px;cursor:pointer;transition:all .25s ease;
}
.capa-toggle-opt.is-active{background:var(--vert);color:#fff;box-shadow:0 4px 14px rgba(39,128,118,.3);}
.capa-toggle-note{font-size:14px;color:var(--vert);font-weight:500;margin:14px 0 0;}

.capa-cards{display:flex;gap:22px;align-items:stretch;justify-content:center;flex-wrap:wrap;margin:90px 0 60px 0;}
.capa-card-abo{
  flex:1;min-width:260px;max-width:320px;
  background:#fff;border:1px solid var(--sep);border-radius:22px;
  padding:28px 24px;text-align:center;position:relative;
  display:flex;flex-direction:column;
}
.capa-card-abo.is-featured{
  border:2px solid var(--vert);box-shadow:0 20px 50px rgba(39,128,118,.16);
  transform:translateY(-8px);
}
.capa-star{
  position:absolute;top:-15px;left:50%;transform:translateX(-50%);
  background:var(--vert);color:#fff;font-size:13px;font-weight:600;
  padding:6px 16px;border-radius:50px;white-space:nowrap;
  display:inline-flex;align-items:center;gap:6px;
}
.capa-star img{width:16px;height:16px;}
.capa-card-titre{font-size:16px;font-weight:600;color:#6b7671;margin:6px 0 18px;text-transform:uppercase;letter-spacing:.03em;}

.capa-prix{display:flex;align-items:baseline;justify-content:center;gap:6px;margin-bottom:10px;}
.capa-prix-montant{font-size:44px;font-weight:800;color:var(--fonce);line-height:1;}
.capa-card-abo.is-featured .capa-prix-montant{color:var(--or);}
.capa-prix-unite{font-size:15px;color:#6b7671;font-weight:500;}
.capa-prix-sous{font-size:13px;color:#8a9490;margin:10px 0 0;}
.capa-prix-eco{
  display:inline-block;margin:12px 0 0;font-size:13px;font-weight:600;
  color:var(--vert);background:var(--vert-clair);padding:4px 14px;border-radius:20px;
}

/* Divider + mention séances */
.capa-card-divider{
  height:0;border-top:2px solid rgba(39,128,118,.15);
  margin:20px 0 16px;width:100%;
}
.capa-card-mention{
  font-size:12.5px;line-height:1.5;color:#6b7671;margin:0 0 4px;text-align:center;
}

.capa-abonne{margin-top:22px;width:100%;}

/* Mention légale sous les blocs */
.capa-legal-mention{
  text-align:center;font-size:13px;line-height:1.6;color:#8a9490;
  margin:34px auto 0;max-width:680px;
}

.capa-paiement-secu{text-align:center;margin-top:34px;color:#8a9490;font-size:14px;}
.capa-secu-txt{margin:8px 0 0;}

/* ============================================================
   ÉTAPES 3 & 4 — Formulaire + paiement
   ============================================================ */
.capa-recap{
  background:var(--vert-clair);border-radius:12px;padding:12px 18px;
  font-weight:600;color:var(--fonce);margin-bottom:22px;text-align:center;
}
.capa-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.capa-field{display:flex;flex-direction:column;}
.capa-field.capa-full{grid-column:1 / -1;}
.capa-field label{font-size:14px;font-weight:600;color:var(--fonce);margin-bottom:6px;}
.capa-field input,.capa-field select{
  font-family:inherit;font-size:15px;padding:12px 14px;
  border:1px solid #d7e3e0;border-radius:12px;background:#fff;color:var(--fonce);
  width:100%;
}
.capa-field input:focus,.capa-field select:focus{outline:none;border-color:var(--vert);}

#capa-payment-element{margin:10px 0 18px;}

/* ---- Champ mot de passe avec œil ---- */
.capa-pass-wrap{position:relative;}
.capa-pass-wrap input{padding-right:46px;}
.capa-eye{
  position:absolute;right:10px;top:50%;transform:translateY(-50%);
  width:28px;height:28px;border:none;background:transparent;cursor:pointer;padding:0;
  background-repeat:no-repeat;background-position:center;background-size:22px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 24 24' fill='none' stroke='%236b7671' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E");
}
.capa-eye.is-on{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 24 24' fill='none' stroke='%23278076' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19m-6.72-1.07a3 3 0 1 1-4.24-4.24'/%3E%3Cline x1='1' y1='1' x2='23' y2='23'/%3E%3C/svg%3E");
}

/* ============================================================
   Boutons
   ============================================================ */
.capa-btn{
  background:var(--vert);color:#fff !important;border:none;cursor:pointer;font-family:inherit;
  padding:14px 30px;border-radius:50px;font-weight:700;font-size:15px;
  transition:transform .2s,background .2s;margin-top:20px;
  text-decoration:none;display:inline-block;text-align:center;
}
.capa-btn:hover{transform:scale(1.03);text-decoration:none;color:#fff !important;}
.capa-btn:disabled{opacity:.6;cursor:default;transform:none;}
.capa-btn-light{background:var(--vert-clair);color:var(--fonce) !important;margin-right:10px;}
.capa-btn-light:hover{color:var(--fonce) !important;}
.capa-btn-danger{background:#a93226;color:#fff !important;}
.capa-abonne{background:var(--or);}
.capa-card-abo.is-featured .capa-abonne{background:var(--vert);}

/* ============================================================
   Dashboard
   ============================================================ */
.capa-card-info{
  border:1px solid var(--sep);border-radius:18px;padding:22px 24px;
  margin-bottom:18px;background:#fbfdfc;
}
.capa-card-info p{margin:7px 0;}
.capa-card-info select{
  font-family:inherit;padding:11px 14px;border:1px solid #d7e3e0;border-radius:12px;margin-right:10px;
}
.capa-badge{padding:3px 12px;border-radius:12px;font-size:13px;font-weight:600;}
.capa-actif{background:#d5f5e3;color:#1e6b4f;}
.capa-incomplet{background:#fdebd0;color:#9c640c;}
.capa-paiement_echoue{background:#fadbd8;color:#a93226;}
.capa-resilie{background:#eaecee;color:#566573;}
.capa-hint{font-size:13px;color:#6b7671;margin-top:10px;}
.capa-pending{color:#9c640c;font-weight:600;}

/* ============================================================
   Connexion
   ============================================================ */
.capa-login{max-width:440px;}
.capa-login .login-username,.capa-login .login-password{margin-bottom:14px;}
.capa-login label{display:block;font-weight:600;font-size:14px;margin-bottom:6px;color:var(--fonce);}
.capa-login input[type=text],.capa-login input[type=password]{
  width:100%;font-family:inherit;font-size:15px;padding:12px 14px;
  border:1px solid #d7e3e0;border-radius:12px;
}
.capa-login .login-remember{font-size:14px;margin:6px 0 14px;color:#6b7671;}
.capa-login .button-primary,.capa-login #wp-submit{
  background:var(--vert)!important;border:none!important;color:#fff!important;
  font-family:inherit!important;font-weight:700!important;font-size:15px!important;
  padding:13px 30px!important;border-radius:50px!important;cursor:pointer;
  box-shadow:none!important;text-shadow:none!important;height:auto!important;
}
.capa-login .button-primary:hover{transform:scale(1.03);}
.capa-forgot{margin-top:16px;font-size:14px;}

/* ============================================================
   Messages
   ============================================================ */
.capa-msg{margin-top:16px;padding:13px 18px;border-radius:12px;}
.capa-msg-success{background:#d5f5e3;color:#1e6b4f;}
.capa-error{color:#a93226;margin-top:12px;font-size:14px;}

/* ============================================================
   Responsive
   ============================================================ */
@media(max-width:768px){
  .capa-cards{flex-direction:column;align-items:center;}
  .capa-card-abo,.capa-card-abo.is-featured{transform:none;width:100%;max-width:100%;}
  .capa-form-grid{grid-template-columns:1fr;}
  .capa-types{flex-direction:column;align-items:center;}
}

/* ============================================================
   Prix sur les cartes "type" (étape 1)
   ============================================================ */
.capa-type-prix{
  margin-top:14px;font-size:26px;font-weight:800;color:var(--or);
  display:flex;align-items:baseline;gap:6px;justify-content:center;flex-wrap:wrap;
}
.capa-apd{font-size:13px;font-weight:500;color:#6b7671;}
.capa-mois{font-size:14px;font-weight:500;color:#6b7671;}

/* ============================================================
   Dashboard — layout menu latéral
   ============================================================ */
.capa-dash-layout{
  display:flex;gap:28px;align-items:flex-start;
  width:80%;max-width:850px;margin:0 auto;
}
.capa-side{flex:0 0 220px;position:sticky;top:20px;}
.capa-side nav{display:flex;flex-direction:column;gap:4px;
  background:#fbfdfc;border:1px solid var(--sep);border-radius:16px;padding:12px;}
.capa-nav-link{
  padding:12px 16px;border-radius:10px;font-weight:600;font-size:15px;color:var(--fonce);
  text-decoration:none;transition:background .2s,color .2s;
}
.capa-nav-link:hover{background:var(--vert-clair);text-decoration:none;}
.capa-nav-link.is-active{background:var(--vert);color:#fff;}
.capa-nav-logout{color:#a93226;margin-top:8px;border-top:1px solid var(--sep);border-radius:0 0 10px 10px;}
.capa-nav-logout:hover{background:#fadbd8;}

.capa-side-content{flex:1;min-width:0;}
.capa-panel{display:none;}
.capa-panel.is-active{display:block;animation:capaFade .3s ease;}

.capa-danger-zone{border-color:#f3cfca;background:#fef7f6;}

/* ---- Tables paiements / factures ---- */
.capa-table{width:100%;border-collapse:collapse;margin-top:8px;}
.capa-table th,.capa-table td{padding:12px 14px;text-align:left;font-size:14px;border-bottom:1px solid var(--sep);}
.capa-table th{color:var(--fonce);font-weight:600;}
.capa-table a{color:var(--vert);font-weight:600;}

/* ============================================================
   Modales
   ============================================================ */
.capa-modal{
  display:none;position:fixed;inset:0;background:rgba(34,33,72,.45);
  z-index:99999;align-items:center;justify-content:center;padding:20px;
}
.capa-modal.is-open{display:flex;animation:capaFade .2s ease;}
.capa-modal-box{
  background:#fff;border-radius:20px;padding:30px;max-width:480px;width:100%;
  font-family:'Poppins',sans-serif;color:var(--fonce);
}
.capa-modal-box h3{margin:0 0 14px;font-size:20px;color:var(--fonce);}
.capa-modal-box p{font-size:15px;line-height:1.5;margin:10px 0;}
.capa-modal-box input[type=text]{
  width:100%;padding:12px 14px;border:1px solid #d7e3e0;border-radius:12px;
  font-family:inherit;font-size:15px;margin-top:6px;
}
.capa-check{display:flex;align-items:center;gap:8px;font-size:14px;margin:14px 0;cursor:pointer;}
.capa-modal-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:20px;}
.capa-modal-actions .capa-btn{margin-top:0;}

@media(max-width:1024px){
  .capa-dash-layout{width:92%;max-width:850px;}
}
@media(max-width:768px){
  .capa-dash-layout{flex-direction:column;width:100%;gap:18px;}
  .capa-side{position:static;width:100%;flex:none;}
  .capa-side nav{flex-direction:row;flex-wrap:wrap;gap:6px;}
  .capa-nav-link{flex:1;min-width:120px;text-align:center;}
  .capa-nav-logout{border-top:none;border-radius:10px;margin-top:0;}
  .capa-table{font-size:13px;}
  .capa-table th,.capa-table td{padding:9px 8px;}
}
@media(max-width:480px){
  .capa-side nav{flex-direction:column;}
  .capa-nav-link{min-width:0;text-align:left;}
}

/* Bloc résiliation : marge 80px au-dessus */
.capa-resil-block{margin-top:80px !important;}

/* Cases de consentement CGV / RGPD */
.capa-consents{margin:22px 0;display:flex;flex-direction:column;gap:12px;}
.capa-consents .capa-check{
  display:flex;align-items:flex-start;gap:10px;font-size:14px;line-height:1.5;color:var(--fonce);cursor:pointer;
}
.capa-consents .capa-check input{margin-top:3px;accent-color:var(--vert);flex-shrink:0;}

/* Bloc évolution programmée */
.capa-evolution-future{
  border-left:4px solid var(--or);background:#fdfbf4;
}
.capa-evolution-future .capa-h3{color:var(--or);}

/* Bloc résiliation programmée */
.capa-resil-future{
  border-left:4px solid #a93226;background:#fdf6f5;
}
.capa-resil-future .capa-h3{color:#a93226;}

/* Badge paiement en cours (SEPA) */
.capa-badge.capa-paiement_en_cours{background:#fef4e5;color:#9c640c;}