/* ======================
	   Cartes offres
	   ====================== */
	.cc-offres-cards{ margin:8px auto 24px; display:flex; flex-wrap:wrap; justify-content:center; gap:16px;
	  max-width: calc(4 * 320px + 3 * 16px + 32px); }
	.cc-offres-cards .cc-offer-family{ display:inline-flex; flex-wrap:nowrap; gap:16px; margin:0 8px 16px; vertical-align:top; align-items:stretch; }
	.cc-offres-cards .cc-glue{
	  display:inline-flex;
	  flex-wrap:wrap;
	  gap:16px;
	  margin:0 8px 16px;
	  vertical-align:top;
	  max-width: calc(4 * 320px + 3 * 16px);
	}
	.cc-glue > .cc-offer-family{
	  margin:0;
	}

	.cc-card{
	  width:320px;
	  max-width:100%;
	  background: #fff;
      border: 1px solid #e5e7eb;
	  border-radius:16px;
	  box-shadow: 0 2px 8px rgba(0,0,0,.06);
	  padding:18px;
	  display:flex;
	  flex-direction:column;
	  gap:10px;
	  height:100%;
	  box-sizing:border-box;
	  color: #1a1a2e;
	}
	
	.cc-card:hover {
	  transform: scale(1.02);
	  box-shadow: 0 8px 24px rgba(0,0,0,.12);
	}

	/* Dégradé coloré par type */
	.cc-offer-family[data-type="en_ligne"] .cc-card {
	    background-color: #fff;
	    background-image: linear-gradient(to right, rgba(11,107,203,0.06), rgba(11,107,203,0.02));
	}
	.cc-offer-family[data-type="presentiel"] .cc-card {
	    background-color: #fff;
	    background-image: linear-gradient(to right, rgba(17,122,66,0.06), rgba(17,122,66,0.02));
	}
	.cc-offer-family[data-type="hybride"] .cc-card {
	    background-color: #fff;
	    background-image: linear-gradient(to right, rgba(15,118,110,0.06), rgba(15,118,110,0.02));
	}
	.cc-offer-family[data-type="cours_collectif"] .cc-card {
	    background-color: #fff;
	    background-image: linear-gradient(to right, rgba(107,33,168,0.06), rgba(107,33,168,0.02));
	}

	/* Badges adaptés au fond sombre */
	.cc-badge{ align-self:flex-start; font-size:12px; padding:4px 8px; border-radius:999px; border:1px solid rgba(11,107,203,0.4); background:rgba(11,107,203,0.08); color:#0b6bcb; }
	.cc-badge.is-pres { border-color:rgba(17,122,66,0.4); background:rgba(17,122,66,0.08); color:#117a42; }
	.cc-badge.is-hybrid { border-color:rgba(15,118,110,0.4); background:rgba(15,118,110,0.08); color:#0f766e; }
	.cc-badge.is-collective { border-color:rgba(107,33,168,0.4); background:rgba(107,33,168,0.08); color:#6b21a8; }

	.cc-title{ font-size:20px; line-height:1.25; margin:2px 0 4px; color:#1a1a2e;  }
	.cc-price{ display:block; text-align:center; font-size:24px; font-weight:800; margin:2px 0; color:#1a1a2e; }
	.cc-subprice-inline{ font-size:14px; font-weight:600; color:#6b7280; }
	.cc-includes{ margin:6px 0 8px; padding:0; list-style:none; }
	.cc-includes li{ position:relative; margin:6px 0; padding-left:20px; text-align:left; color:#374151;  }
	.cc-includes li::before{ content:''; position:absolute; left:0; top:50%; transform:translateY(-50%) rotate(45deg);
	  width:6px; height:12px; border-right:2px solid #6b7280; border-bottom:2px solid #6b7280; }
	.cc-offer-family[data-type="en_ligne"] .cc-includes li::before { border-color:#0b6bcb; }
	.cc-offer-family[data-type="presentiel"] .cc-includes li::before { border-color:#117a42; }
	.cc-offer-family[data-type="hybride"] .cc-includes li::before { border-color:#0f766e; }
	.cc-offer-family[data-type="cours_collectif"] .cc-includes li::before { border-color:#6b21a8; }

	.cc-card .button{ margin-top:auto; }
	.cc-offres-cards .cc-card .button.button-primary.cc-choose {
	    color: #fff !important;
	    border: none !important;
	    border-radius: 12px !important;
	    font-size: 15px !important;
	    font-weight: 600 !important;
	    padding: 10px 16px !important;
	    position: relative;
	    overflow: hidden;
	    transition: box-shadow .3s ease, filter .3s ease;
	}
	.cc-offer-family[data-type="en_ligne"] .cc-choose {
	    background: #0b6bcb !important;
	}
	.cc-offer-family[data-type="presentiel"] .cc-choose {
	    background: #117a42 !important;
	}
	.cc-offer-family[data-type="hybride"] .cc-choose {
	    background: #0f766e !important;
	}
	.cc-offer-family[data-type="cours_collectif"] .cc-choose {
	    background: #6b21a8 !important;
	}

	/* Reflet lumineux */
	.cc-offres-cards .cc-card .button.button-primary.cc-choose::before {
	  content: '';
	  position: absolute;
	  top: 0;
	  left: -100%;
	  width: 60%;
	  height: 100%;
	  background: linear-gradient(
		120deg,
		transparent 0%,
		rgba(255,255,255,0.15) 50%,
		transparent 100%
	  );
	  transition: left .4s ease;
	}
	.cc-offres-cards .cc-card .button.button-primary.cc-choose::before {
	    content: '';
	    position: absolute;
	    top: 0;
	    left: -100%;
	    width: 60%;
	    height: 100%;
	    background: linear-gradient(120deg, transparent 0%, rgba(255,255,255,0.2) 50%, transparent 100%);
	    transition: left .4s ease;
	}
	.cc-offres-cards .cc-card .button.button-primary.cc-choose:not(.is-unavailable):hover::before {
	    left: 150%;
	}
	.cc-offer-family[data-type="en_ligne"] .cc-choose:not(.is-unavailable):hover {
	    background: #0a5aa8 !important;
	    box-shadow: 0 0 15px rgba(11,107,203,0.35) !important;
	}
	.cc-offer-family[data-type="presentiel"] .cc-choose:not(.is-unavailable):hover {
	    background: #0e6235 !important;
	    box-shadow: 0 0 15px rgba(17,122,66,0.35) !important;
	}
	.cc-offer-family[data-type="hybride"] .cc-choose:not(.is-unavailable):hover {
	    background: #0c5f58 !important;
	    box-shadow: 0 0 15px rgba(15,118,110,0.35) !important;
	}
	.cc-offer-family[data-type="cours_collectif"] .cc-choose:not(.is-unavailable):hover {
	    background: #581c87 !important;
	    box-shadow: 0 0 15px rgba(107,33,168,0.35) !important;
	}

	.cc-offres-cards .cc-card .button.button-primary.cc-choose:focus-visible{ outline:2px solid rgba(255,255,255,0.5); outline-offset:2px; }

	/* Badge "Cours collectif" — déjà géré ci-dessus */

	/* Sous-titre collé au titre */
	.cc-subtitle{
	  text-align:center;
	  font-size:14px;
	  font-weight:700;
	  margin-top:-6px;
	  line-height:1.25;
	}
	.cc-offer-family[data-type="en_ligne"] .cc-subtitle { color:#0b6bcb; }
	.cc-offer-family[data-type="presentiel"] .cc-subtitle { color:#117a42; }
	.cc-offer-family[data-type="hybride"] .cc-subtitle { color:#0f766e; }
	.cc-offer-family[data-type="cours_collectif"] .cc-subtitle { color:#6b21a8; }

	.cc-subtitle .cc-sub-online{ display:inline-block; margin-top:2px; }

	/* Petits écrans */
	@media (max-width:380px){
	  .cc-card{ width:100%; max-width:360px; }
	  .cc-offres-cards{ max-width:100%; gap:12px; }
	  .cc-offres-cards .cc-offer-family{ gap:12px; margin-bottom:12px; }
	}
	
	@media (max-width:680px){
	  .cc-offres-cards{ padding:0 8px; box-sizing:border-box; width:100%; }
	  .cc-offres-cards .cc-offer-family{ flex-wrap:wrap; width:100%; margin:0 0 12px; align-items:flex-start; }
	  .cc-glue{ width:100%; margin:0 0 12px; box-sizing:border-box; }
	  .cc-card{ width:100% !important; max-width:100% !important; box-sizing:border-box; height:auto !important; }
	}

	/* Centre le titre */
	.cc-offres-cards .cc-card .cc-title{
	  text-align: center;
	}

	/* Voir plus */
	.cc-includes-wrap{ position: relative; }
	.cc-includes-wrap.is-collapsed .cc-includes{
	  max-height: 160px;
	  overflow: hidden;
	  position: relative;
	}
	.cc-includes-wrap.is-collapsed .cc-includes {
		mask-image: linear-gradient(to bottom, black 40%, transparent 100%);
		-webkit-mask-image: linear-gradient(to bottom, black 40%, transparent 100%);
	}
	.cc-includes-wrap.is-collapsed::after {
		display: none;
	}
	.cc-see-more{
	  position: absolute;
	  left: 50%;
	  bottom: 0px;
	  transform: translateX(-50%);
	  z-index: 2;
	  background: transparent;
	  border: 0;
	  color: rgba(0,0,0,0.6);
	  font-size: 13px;
	  font-weight: 700;
	  line-height: 1;
	  cursor: pointer;
	  padding: 0;
	  text-align: center;
	  white-space: nowrap;
	  text-decoration: none;
	}
	.cc-see-more:hover,
	.cc-see-more:focus{
	  text-decoration: underline;
	  background: transparent;
	  color: #111;
	}
	.cc-includes-wrap.is-expanded .cc-includes{ max-height: none; }
	.cc-includes-wrap.is-expanded::after{ display: none; }
		
	/* ======================
	   Notes / champs (généraux)
	   ====================== */
	.cc-login-note{ border:1px solid #e5e7eb; background:#f9fafb; border-radius:8px; padding:12px; color:#374151; }
	.cc-field-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:12px; }
	.cc-field input, .cc-form-wrap textarea{ width:100%; }

	/* ======================
   MODALE fiche coaching
   ====================== */

	/* Overlay sombre */
	.cc-modal-overlay{
	  position: fixed; inset: 0;
	  background: rgba(0,0,0,.55);
	  z-index: 9998;
	}

	/* Conteneur modal centré */
	.cc-modal{
	  position: fixed; inset: 0;
	  display: flex; align-items: center; justify-content: center;
	  padding: 24px;                 /* espace périphérique */
	  background: transparent;
	  z-index: 9999;
	}

	/* Boîte : ne touche jamais le haut/bas (48px chacun) */
	.cc-modal-box{
	  position: relative;
	  width: 100%;
	  max-width: 640px;
	  max-height: calc(100vh - 96px);
	  background-color: #fff;
	  background-image: none;
	  border: 1px solid #e5e7eb;
	  border-radius: 16px;
	  box-shadow: 0 12px 30px rgba(0,0,0,.12);
	  display: flex;
	  flex-direction: column;
	  overflow: hidden; 
	}

	/* Contenu scrollable à l’intérieur de la boîte
	   (form ou bloc login) */
	.cc-modal-box form#cc-demande-form,
	.cc-modal-box .cc-login-note{
	  flex: 1 1 auto;
	  overflow: auto;
	  padding: 0 24px 24px;
	  scrollbar-width: thin;
	  scrollbar-color: #d1d5db transparent;
	}

	/* Scrollbar arrondie (WebKit) */
	.cc-modal-box form#cc-demande-form::-webkit-scrollbar,
	.cc-modal-box .cc-login-note::-webkit-scrollbar{ width:8px; }
	.cc-modal-box form#cc-demande-form::-webkit-scrollbar-thumb,
	.cc-modal-box .cc-login-note::-webkit-scrollbar-thumb{
	  background-color: #d1d5db;
	  border-radius: 8px;
	}
	.cc-modal-box form#cc-demande-form::-webkit-scrollbar-track,
	.cc-modal-box .cc-login-note::-webkit-scrollbar-track{ background:transparent; }

	/* Croix */
	.cc-modal-close{
	  position: absolute; top: 10px; right: 10px;
	  background: none;
	  border: 0;
	  font-size: 24px;
	  line-height: 1;
	  color: #9ca3af;
	  cursor: pointer;
	  transition: color .15s;
	}
	.cc-modal-close:hover{ color:#111; background: none; box-shadow: none; }

	/* Bouton primaire cohérent */
	.cc-modal .button.button-primary{
      background: rgb(43,108,176) !important; border-color: rgb(43,108,176) !important; color:#fff !important;
	  border-radius:12px; padding:10px 16px; font-weight:600;
	}
	.cc-modal .button.button-primary:hover { background:#135e96 !important; border-color:#135e96 !important; }
	.cc-modal .button.button-primary:focus-visible{ outline:2px solid rgba(255,255,255,0.5); outline-offset:2px; }


	/* Empêche le scroll du fond */
	body.cc-modal-open{ overflow: hidden; }

	@media (max-width: 640px){
	  .cc-modal.is-open{
	    align-items: stretch !important;
	    justify-content: flex-end !important;
	    padding: 0 !important;
	  }
	  .cc-modal-box{
	    margin: 0 !important;
	    width: 100% !important;
	    max-width: 100% !important;
	    height: 100dvh !important;
	    max-height: 100dvh !important;
	    border-radius: 0 !important;
	    transform: translateX(100%);
	    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	  }
	  .cc-modal.is-open .cc-modal-box{
	    transform: translateX(0) !important;
	  }
	}

		
	/* --- Titre modale sur 2 lignes, réservé pour la croix --- */
	#cc-modal-title{
	  margin: 20px 24px 12px;
	  text-align: center;
	  font-size: 22px;
	  line-height: 1.25;
	  padding-right: 44px;
	  color: #1a1a2e;
	}
	#cc-modal-title .cc-title-sub{
	  display: block;
	  font-weight: 600;
	  color: #555;
	}

	@media (max-width: 480px){
	  #cc-modal-title{
	    font-size: 17px;
	  }
	  #cc-modal-title .cc-title-sub{
	    display: block;
	    margin-top: 6px;
	    padding-top: 6px;
	    border-top: 1px solid #e5e7eb;
	  }
	}

	/* --- Grille 3 colonnes âge/taille/poids --- */
	.cc-grid-3{
	  display: grid;
	  grid-template-columns: repeat(3, 1fr);
	  gap: 12px;
	}
	@media (max-width: 640px){
	  .cc-grid-3{ grid-template-columns: 1fr; }
	}

	/* Harmonisation des champs */
	.cc-modal-box input[type="text"],
	.cc-modal-box input[type="number"],
	.cc-modal-box textarea {
	  width: 100%;
	}

	/* --- Modale FORM (connecté) --- */
	.cc-modal-box.is-form {
	  max-width: 640px;     /* largeur standard */
	  width: 100%;
	  max-height: calc(100vh - 96px); /* marge haut/bas 48px */
	  display: flex;
	  flex-direction: column;
	  overflow: hidden;     /* masque le débordement du contenu */
	}
	.cc-modal-box.is-form form#cc-demande-form {
	  flex: 1 1 auto;
	  overflow: auto;       /* scroll interne si besoin */
	  padding: 0 24px 24px;
	}

	/* --- Modale LOGIN (non connecté) --- */
	.cc-modal-box.is-login {
	  max-width: 750px;
	  width: 95vw;
	  max-height: calc(100vh - 96px);
	  overflow: visible;
	}
	.cc-modal-box.is-login .cc-login-note {
	  overflow: visible;
	  padding: 24px;
	}
	/* Optionnel : sur très petits écrans, pour éviter bord à bord */
	@media (max-height: 600px) {
	  .cc-modal-box.is-login {
		max-height: calc(100vh - 48px);
	  }
	}
		
	/* Quand on est sur sa propre fiche coach : bouton inactif + style visuel */
	.cc-offres-cards.is-coach-owner .cc-card .cc-choose[disabled]{
	  opacity: .55;
	  cursor: not-allowed;
	  filter: grayscale(15%);
	}
	
	.cc-intro{ color:#374151; font-size:14.5px; }
	.cc-required-note{
	  margin: -6px 0 12px;
	  font-size: 13px;
	  color: #9ca3af;
	  font-style: italic;
	}
	.cc-collectif-only small { color:#9ca3af; }
		
	/* Harmonisation des champs */
	.cc-modal-box input[type="text"],
	.cc-modal-box input[type="number"],
	.cc-modal-box textarea,
	.cc-modal-box select {
	  width: 100%;
	  box-sizing: border-box;
	  font-size: 16px;
	  line-height: 1.25;
	  padding: 10px 12px;
	  border: 1px solid #e5e7eb;
	  border-radius: 10px;
	  background: #fff;
	  color: #111;
	}

	.cc-modal-box select {
	  height: 42px;
	  padding-right: 32px;
	}

	.cc-field label { display:block; font-weight:500; color:#374151; }
	.cc-field small { color:#9ca3af; }

	/* Grilles utiles */
	.cc-grid-2 { display:grid; grid-template-columns:repeat(2,1fr); gap:12px; }
	@media (max-width:640px){ .cc-grid-2 { grid-template-columns:1fr; } }
		
	/* Corrige l'espacement autour de "Tranche d’âge du groupe" */
	.cc-collectif-only .cc-grid-2 .cc-field {
	  margin-bottom: 0;        /* supprime le vide sous les champs âge */
	}

	.cc-age-legend {
	  display: block;
	  margin-top: 4px !important;
	  margin-bottom: 18px;
	  color: #9ca3af;
	  font-size: 13px;
	}
	.cc-collectif-only .cc-field-health-group { margin-top: 10px; }

	/* Cases à cocher jolies en grille */
	.cc-checkbox-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
	@media (max-width:640px){ .cc-checkbox-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
	.cc-checkbox {
	  display:flex; align-items:center; gap:8px;
	  border:1px solid #e5e7eb; border-radius:10px; padding:8px 10px; background:#fff;
	}
	.cc-checkbox input[type="checkbox"]{ width:16px; height:16px; }
		
	/* === Planner hebdo === */
	.cc-planner {
	  --cell: 34px;
	  --border: #e5e7eb;
	  --active: rgba(59,130,246,0.35);
	  --active-b: rgba(59,130,246,0.6);
	  --hover: rgba(0,0,0,0.03);
	  border: 1px solid var(--border);
	  border-radius: 12px;
	  background: #fafafa;
	  width: 100%;
	  overflow: hidden;
	}

	.cc-planner table {
	  border-collapse: separate;
	  border-spacing: 0;
	  width: 100%;      /* prend toute la largeur dispo */
	  table-layout: fixed;
	}

	.cc-planner th,
	.cc-planner td {
	  border-right: 1px solid var(--border);
	  border-bottom: 1px solid var(--border);
	}

	.cc-planner th {
	  background: #f3f4f6;
	  font-weight: 600;
	  font-size: 13px;
	  color: #374151;
	  padding: 8px 6px;
	  position: sticky;
	  top: 0;
	  z-index: 1;
	}

	.cc-planner .col-day { text-align: center; }
	.cc-planner .col-time {
	  width: 72px;
	  position: sticky;
	  left: 0;
	  z-index: 1;
	  background: #f3f4f6;
	}

	.cc-planner td.cell {
	  height: var(--cell);
	  cursor: pointer;
	  user-select: none;
	  background: transparent;
	}
	.cc-planner td.cell:hover { background: var(--hover); }
	.cc-planner td.cell.is-on { 
	  background: var(--active);
	  box-shadow: inset 0 0 0 1px var(--active-b);
	}

	@media (max-width:640px){
	  .cc-planner { --cell: 30px; }
	  .cc-planner .col-time {
	    width: 44px;
	    font-size: 11px;
	  }
	  .cc-planner td.col-time,
	  .cc-planner th.col-time {
	    padding: 4px 2px;
	  }
	}

	/* Actions planner centrées et boutons petits gris */
	.cc-planner-actions{
	  margin-top: 12px;
	  display: flex;
	  flex-wrap: wrap;
	  gap: 8px;
	  justify-content: center;
	  align-items: center;
	}

	.cc-planner-actions .button {
	  background: #f3f4f6;
	  color: #374151;
	  border: 1px solid #d1d5db;
	  font-size: 13px;
	  padding: 4px 10px;
	  border-radius: 8px;
	}
	.cc-planner-actions .button:hover {
	  background: #e5e7eb;
	}

	/* Aération entre planning et message coach */
	.cc-presentiel-only { margin-bottom: 18px; }
	#cc-planner-summary { margin-top: 8px; color: #374151; }

	/* le libellé d'heure est déplacé vers la bordure supérieure (la ligne) */
	.cc-planner .col-time .time-label{
	  display: block;
	  position: relative;
	  top: calc(-0.5 * var(--cell)); /* colle l’heure sur la ligne au-dessus */
	  line-height: 1;                /* évite l'effet “descente” */
	}

	/* ne pas décaler l’en-tête "Heure" */
	.cc-planner .col-time-head {
	  position: sticky; /* inchangé */
	  top: 0;
	  z-index: 2;
	}

	/* les cellules ont un trait subtil au milieu (repère entre deux heures) */
	.cc-planner td.cell {
	  position: relative;   /* nécessaire pour le ::after */
	  height: var(--cell);
	  cursor: pointer;
	  user-select: none;
	  background: transparent;
	}
	.cc-planner td.cell::after{
	  content: "";
	  position: absolute;
	  left: 0; right: 0;
	  top: 50%;
	  border-top: 1px solid #eef0f2; /* très léger */
	  pointer-events: none;
	}

	/* états existants conservés */
	.cc-planner td.cell:hover { background: var(--hover); }
	.cc-planner td.cell.is-on {
	  background: var(--active);
	  box-shadow: inset 0 0 0 1px var(--active-b);
	}

	/* petit ajustement sur mobiles où la cellule est plus petite */
	@media (max-width:640px){
	  .cc-planner .col-time .time-label{ top: calc(-0.5 * var(--cell)); }
	}	
	
	/* adoucit le tout premier label si tu trouves qu'il “mange” la bordure haute */
	.cc-planner tbody tr:first-child .col-time .time-label {
	  top: calc(-0.45 * var(--cell));
	}	
	
	/* 2.1 — On garde ta colonne d’heures sticky, mais on cache
        sa bordure basse pour ne pas doubler le trait “entre heures” */
	.cc-planner th.col-time,
	.cc-planner td.col-time {
	  border-bottom-color: transparent; /* ← enlève le trait sous les heures uniquement */
	}

	/* 2.2 — Les labels d’heure restent “sur la ligne” (bordure supérieure) */
	.cc-planner .col-time .time-label{
	  display: block;
	  position: relative;
	  top: calc(-0.5 * var(--cell));
	  line-height: 1;
	}

	/* 2.3 — SUPPRIMER le trait central à l’intérieur des cellules (si présent) */
	.cc-planner td.cell::after { content: none !important; }

	/* (optionnel) Si tu avais donné un style spécial au tout premier label,
	   tu peux aussi le laisser vide proprement : pas nécessaire d’autre règle. */
		
	/* Titre de champ “allumé” + hauteur uniforme pour l’alignement sur 2 colonnes */
	.cc-label-title{
	  display:block;
	  font-weight:normal;
	  color:#374151;
	  line-height:1.25;
	  margin-bottom:6px;
	  min-height:2.5em;
	}

	/* Sur petits écrans, inutile de réserver 2 lignes */
	@media (max-width:640px){
	  .cc-label-title{ min-height:0; }
	}	
		
	/* Base : indispo coach = hachures grises (clic autorisé) */
	.cc-planner td.cell.coach-off{
	  background: repeating-linear-gradient(
	    45deg,
	    rgba(0,0,0,0.04),
	    rgba(0,0,0,0.04) 6px,
	    rgba(0,0,0,0.01) 6px,
	    rgba(0,0,0,0.01) 12px
	  );
	  cursor: pointer;
	}
	.cc-planner td.cell.coach-off:hover{
	  background: repeating-linear-gradient(
	    45deg,
	    rgba(0,0,0,0.04),
	    rgba(0,0,0,0.04) 6px,
	    rgba(0,0,0,0.01) 6px,
	    rgba(0,0,0,0.01) 12px
	  );
	}
	.cc-planner td.cell.coach-off.is-on{
	  background:
	    repeating-linear-gradient(
	      45deg,
	      rgba(59,130,246,.35),
	      rgba(59,130,246,.35) 6px,
	      transparent 6px,
	      transparent 12px
	    ),
	    repeating-linear-gradient(
	      45deg,
	      rgba(0,0,0,0.04),
	      rgba(0,0,0,0.04) 6px,
	      rgba(0,0,0,0.01) 6px,
	      rgba(0,0,0,0.01) 12px
	    );
	  box-shadow: inset 0 0 0 1px #93c5fd;
	}

	/* Sélection utilisateur (sur créneaux CLiquables) : conservé */
	.cc-planner td.cell.is-on {
	  background: var(--active);     /* bleu clair */
	  box-shadow: inset 0 0 0 1px var(--active-b);
	}

	/* Légende */
	.cc-planner-legend{
	  margin-top: 8px;
	  display: flex; align-items: center; gap: 8px; justify-content: center;
	  color:#374151; font-size:13px;
	}
	@media (max-width:640px){
	  .cc-planner-legend .legend-text{
	    font-size: 11px;
	  }
	}
	.cc-planner-legend .swatch{
	  display:inline-block; width:16px; height:16px; border:1px solid #d1d5db; border-radius:4px;
	}
	.cc-planner-legend .swatch-coach{ background:#f3f4f6; }
	.cc-planner-legend .swatch-you{ background:#dbeafe; }
	.cc-planner-legend .legend-sep{ opacity:.6; }
		
	.cc-planner-legend .swatch-free{ background:#fafafa; }
	.cc-planner-legend .swatch-off{
	  background: repeating-linear-gradient(
	    45deg,
	    rgba(0,0,0,0.08),
	    rgba(0,0,0,0.08) 6px,
	    rgba(0,0,0,0.02) 6px,
	    rgba(0,0,0,0.02) 12px
	  );
	}
	.cc-planner-legend .swatch-you{ background:rgba(59,130,246,0.35); } /* inchangé */
		
	/* --- Aération formulaire collectif --- */
	.cc-collectif-only .cc-field { 
	  margin-bottom: 14px;              /* espace régulier entre les blocs */
	}

	/* Espace juste après "Nombre de personnes" (avant la grille des âges) */
	#cc-group-size-help {
	  display: block;
	  margin-top: 6px;
	  color: #9ca3af;
	}
	.cc-collectif-only .cc-grid-2 {
	  margin-top: 8px;                  /* décollage visuel des blocs Âge min / max */
	}

	/* Espace entre "Points santé (groupe)" et "Disponibilités" */
	.cc-collectif-only { 
	  margin-bottom: 18px;              /* la section collectif respire avant le planning */
	}
	/* --- Aération formulaire individuel (mêmes écarts que collectif) --- */
	.cc-individuel-only .cc-field {
	  margin-bottom: 14px;              /* même rythme vertical que le collectif */
	}

	/* Quand un champ est suivi d’une grille 2 colonnes, on décolle légèrement */
	.cc-individuel-only .cc-grid-2 {
	  margin-top: 8px;                  /* cohérent avec .cc-collectif-only .cc-grid-2 */
	}

	/* L’ensemble de la section individuel respire avant le planning (présentiel/hybride) */
	.cc-individuel-only {
	  margin-bottom: 18px;              /* même logique que la section collectif */
	}
		
	/* Rappel offre — version texte simple alignée */
	.cc-choice-reminder{
	  border: none;
	  background: transparent;
	  border-radius: 0;
	  padding: 0;
	  margin: 8px 0 16px;
	  font-size: 14px;
	  line-height: 1.4;
	  display: block;
	  color: #374151;
	}

	/* On n’utilise plus la “puce/badge” ni la grille flex */
	.cc-choice-reminder .cc-chip,
	.cc-choice-reminder .cc-offer-title,
	.cc-choice-reminder .cc-offer-price,
	.cc-choice-reminder .cc-offer-sub{
	  all: unset;          /* retire tout style résiduel */
	}
		
	/* Bouton "Offre indisponible" — fond transparent, texte seul */
	.cc-offres-cards .cc-card .button.button-primary.cc-choose.is-unavailable[disabled],
	.cc-offres-cards .cc-card .button.button-primary.cc-choose.is-unavailable[disabled]:hover,
	.cc-offres-cards .cc-card .button.button-primary.cc-choose.is-unavailable[disabled]:focus,
	.cc-offres-cards .cc-card .button.button-primary.cc-choose.is-unavailable[disabled]:focus-visible {
		background: transparent !important;
		border: none !important;          /* pas de contour */
		color: #4b5563 !important;        /* texte gris foncé */
		cursor: default;                  /* plus de curseur barré */
		box-shadow: none;
		outline: none;
	}
		
	/* Bloc CTA en bas de carte */
	.cc-cta-block{
		position:relative;
		margin-top:auto;
		text-align:center;
	}
	.cc-includes-wrap + .cc-cta-block {
		padding-top: 24px;
	}
		
	/* Quand la carte a une pill de notif,
   on "triche" en tirant visuellement le bas vers le bas
   sans augmenter la hauteur flex réelle */
	/* On réserve plus d'air sous la carte,
   parce qu'on va faire tomber la pill plus bas */
	.cc-card.has-notify-pill {
		position: relative;
		margin-bottom: 40px; /* avant: 28px */
	}

	/* On “annule” ce margin-bottom pour l'alignement visuel
	   (même technique qu’avant mais sync à 40px maintenant) */
	.cc-card.has-notify-pill::after {
		content: "";
		position: absolute;
		left: 0;
		right: 0;
		bottom: -40px; /* avant: -28px */
		height: 40px;  /* avant: 28px */
	}

	/* --- Bouton "Me notifier" : état normal + hover propre --- */
	.cc-notify-pill{
		position:absolute;
		left:50%;
		bottom:-28px;
		transform:translateX(-50%);
		background:#ffffff;
		border:1px solid #d1d5db;
		border-radius:999px;
		padding:6px 12px;
		font-size:12px;
		line-height:1.2;
		font-weight:500;
		color:#374151; /* texte gris un peu plus foncé qu’avant (#4b5563 → #374151) */
		cursor:pointer;
		white-space:nowrap;
		box-shadow:0 4px 12px rgba(0,0,0,.07);
		transition:all .15s ease-in-out;
	}

	/* Hover/focus : léger fond gris + bord + texte inchangés (lisibilité top) */
	.cc-notify-pill:hover,
	.cc-notify-pill:focus{
		background:#f3f4f6;   /* gris clair, contraste suffisant */
		border-color:#cbd5e1; /* un peu plus marqué */
		color:#111827;        /* texte plus foncé au survol */
		box-shadow:0 6px 14px rgba(0,0,0,.10);
	}

	/* Active (clic) : effet "pressé" plus doux */
	.cc-notify-pill:active{
		background:#e5e7eb;
		box-shadow:0 2px 6px rgba(0,0,0,.12) inset;
	}
		
	/* ======================
   MODALE "prévenez-moi"
   ====================== */
	/* Overlay sombre dédié à la popup d'alerte dispo */
	.cc-notify-overlay {
	  position: fixed;
	  inset: 0;
	  background: rgba(0,0,0,0.55); /* fond sombre semi-transparent */
	  z-index: 99998;
	  display: none;
	}

	/* Conteneur modal centré */
	.cc-notify-modal {
	  position: fixed;
	  inset: 0;
	  display: flex;
	  align-items: center;
	  justify-content: center;
	  background: transparent;
	  padding: 24px;
	  z-index: 99999;
	  display: none;
	}

	/* Boîte blanche */
	.cc-notify-box {
	  position: relative;
	  width: 100%;
	  max-width: 380px;
	  border-radius: 16px;
	  padding: 20px;
	  font-family: system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,'Helvetica Neue',Arial,sans-serif;
	  color: #1a1a2e;
	}
	.cc-notify-close {
	  position: absolute;
	  top: 10px;
	  right: 12px;
	  background: none;
	  border: 0;
	  font-size: 20px;
	  line-height: 1;
	  color: #9ca3af;
	  cursor: pointer;
	}
	.cc-notify-close:hover,
	.cc-notify-close:focus {
	  color: #111;
	  background: none;
	  box-shadow: none;
	}
	.cc-price-hint {
	  font-size: 18px;
	  color: #374151;
	  margin-top: 2px;
	  font-weight: 400;
	}
		
	/* Auth modale */
	.cc-auth-wrap {
		display: grid;
		grid-template-columns: 1.4fr 1px 1fr;
		gap: 0;
		padding: 24px;
		min-height: 300px;
	}
	.cc-auth-col {
		padding: 0 24px;
		display: flex;
		flex-direction: column;
		gap: 14px;
	}
	.cc-auth-col:first-child {
		padding-left: 0;
	}
	.cc-auth-col:last-child {
		padding-right: 0;
	}
	.cc-auth-divider {
	  background: #e5e7eb;
	  width: 1px;
	}
	.cc-auth-title {
	  font-size: 1.2rem;
	  font-weight: 700;
	  color: #1a1a2e;
	  margin: 0 0 8px;
	}
	.cc-auth-field {
		display: flex;
		flex-direction: column;
		gap: 6px;
	}
	.cc-auth-field label {
	  font-size: 13px;
	  font-weight: 500;
	  color: #374151;
	}
	.cc-auth-field input {
		width: 100%;
		box-sizing: border-box;
		background: #fff;
		border: 1px solid #e5e7eb;
		border-radius: 8px;
		padding: 10px 12px;
		font-size: 14px;
		color: #111;
		outline: none;
	}
	.cc-auth-field input:focus {
		border-color: #7aa2ff;
		box-shadow: 0 0 0 2px rgba(122,162,255,0.2);
	}
	.cc-auth-btn {
	  margin-top: auto;
	  background: rgb(43,108,176);
	  color: #fff;
	  border: none;
	  border-radius: 8px;
	  padding: 10px 16px;
	  font-size: 14px;
	  font-weight: 700;
	  cursor: pointer;
	  transition: background .2s ease;
	}
	.cc-auth-btn:hover {
	  background: #135e96;
	}
	.cc-auth-feedback {
		font-size: 13px;
		padding: 8px 12px;
		border-radius: 6px;
	}
	.cc-auth-feedback.is-error {
	  background: #fee2e2;
	  border: 1px solid rgba(220,38,38,0.4);
	  color: #991b1b;
	}
	.cc-auth-feedback.is-success {
	  background: #dcfce7;
	  border: 1px solid rgba(34,197,94,0.4);
	  color: #166534;
	}
	.cc-auth-lost-password {
	  font-size: 12px;
	  color: #9ca3af;
	  text-decoration: underline;
	}
	.cc-auth-lost-password:hover {
	  color: #111;
	}
	.cc-auth-note {
	  font-size: 11px;
	  color: #9ca3af;
	  margin: 0;
	}
	.cc-auth-note a {
	  color: #9ca3af;
	  text-decoration: underline;
	}
	@media (max-width: 640px) {
		.cc-auth-wrap {
			grid-template-columns: 1fr;
		}
		.cc-auth-divider {
			width: 100%;
			height: 1px;
			margin: 8px 0;
		}
		.cc-auth-col {
			padding: 0;
		}
	}