/* ===========================
   FRONT – Base
   =========================== */
.gcb-wrap{max-width:860px;margin:0 auto;color:#111827;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif}
.gcb-form{display:grid;gap:18px}
.gcb-label{display:block;margin:0 0 6px;font-weight:600}
.gcb-input{width:100%;padding:12px 16px;border:1px solid #d1d5db;border-radius:12px;background:#fff;box-sizing:border-box}
.gcb-grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width:680px){.gcb-grid2{grid-template-columns:1fr}}

/* ===========================
   FRONT – Calendar
   =========================== */
.gcb-calendar{border:1px solid #e5e7eb;border-radius:12px;overflow:hidden;background:#fff}
.gcb-cal-header{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;border-bottom:1px solid #f1f5f9;background-color:#c3d2bb;}
.gcb-cal-nav{border:1px solid #e5e7eb;background:#fff;border-radius:8px;width:34px;height:34px;line-height:34px;text-align:center}
.gcb-cal-title{font-weight:700}
.gcb-cal-weekdays{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;padding:8px 10px;background:#f8fafc;font-size:12px;color:#6b7280;text-align:center}
.gcb-cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;padding:10px}
.gcb-day{border:1px solid #e5e7eb;background:#fff;border-radius:10px;padding:10px 0;text-align:center}
.gcb-day.is-disabled{opacity:.35;pointer-events:none}
.gcb-day.is-available{border:2px solid #15803d}       /* dispo = bordure verte foncée */
.gcb-day.is-selected{background:#dcfce7 !important; border:2px solid #15803d} /* sélection = fond vert clair */
.gcb-day:not(.is-disabled){cursor:pointer}


/* ===========================
   FRONT – Slots
   =========================== */
.gcb-slots{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-bottom:8px}
@media (max-width:720px){.gcb-slots{grid-template-columns:repeat(3,1fr)}}
@media (max-width:520px){.gcb-slots{grid-template-columns:repeat(2,1fr)}}
.gcb-slot{display:flex;align-items:center;justify-content:space-between;gap:10px;border:1px solid #e5e7eb;border-radius:10px;padding:10px 12px;background:#fff;min-height:44px;cursor:pointer}
.gcb-slot.is-disabled{opacity:.4;pointer-events:none;cursor:not-allowed}
.gcb-slot.is-selected{background:#dcfce7;border:2px solid #15803d}
.gcb-slot.is-available{border:2px solid #15803d}
.gcb-slot-time{font-weight:600}

/* ===========================
   FRONT – Button & Alerts
   =========================== */
.gcb-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 18px;border-radius:12px;background:#15803d;color:#fff;font-weight:700;border:none}
.gcb-btn:hover{background:#166534}
.gcb-btn-spinner{display:none;width:16px;height:16px;border-radius:999px;border:2px solid rgba(255,255,255,.6);border-left-color:transparent;animation:gcbspin .8s linear infinite}
.gcb-btn.is-loading .gcb-btn-text{opacity:.6}
.gcb-btn.is-loading .gcb-btn-spinner{display:inline-block}
@keyframes gcbspin{to{transform:rotate(360deg)}}

.gcb-alert{border-radius:10px;padding:12px}
.gcb-ok{background:#16a34a;color:#fff}
.gcb-ko{background:#dc2626;color:#fff}

/* ===========================
   FRONT – Participants
   =========================== */
.gcb-party-row{display:flex;align-items:center;gap:10px;margin:6px 0 8px}
.gcb-qty{width:40px;height:40px;border:1px solid #d1d5db;border-radius:10px;background:#f3f4f6;font-size:18px;line-height:38px;text-align:center;transition:.15s background,.15s transform;cursor:pointer}
.gcb-qty:hover{background:#e5e7eb}
.gcb-qty:active{transform:scale(0.98)}
.gcb-party-input{max-width:90px;text-align:center}
.gcb-participants{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media (max-width:680px){.gcb-participants{grid-template-columns:1fr}}
.hidden{display:none}

/* --- Cacher compteur & noms pour les cours individuels (quand classe activée) --- */
/* Ajoute .gcb-mode-individuel sur .gcb-wrap côté JS quand le cours sélectionné est de type "individuel" */
.gcb-mode-individuel .gcb-party,
.gcb-mode-individuel #gcb-participants{ display:none !important; }

/* --- Déplacer les noms des participants au-dessus du calendrier (mode activable) --- */
/* Ajoute .gcb-participants-top sur .gcb-wrap pour réordonner visuellement sans toucher au HTML */
.gcb-participants-top .gcb-form{ display:flex; flex-direction:column; gap:18px; }
.gcb-participants-top #gcb-participants{ order: 30; }
.gcb-participants-top .gcb-calendar{ order: 40; }
.gcb-participants-top #gcb-slots{ order: 50; }

/* Astuce: le label du bloc "Participants" est inclus dans les champs ajoutés dynamiquement,
   donc le déplacement ci-dessus suffit pour l’ordre visuel. */

/* ===========================
   ADMIN – Responsive & Table UX
   =========================== */
.gcb-admin-wrap .gcb-admin-table-wrap{overflow:auto}
.gcb-admin-wrap .gcb-admin-table th,
.gcb-admin-wrap .gcb-admin-table td{vertical-align:middle}
.gcb-admin-wrap .gcb-admin-courses th,
.gcb-admin-wrap .gcb-admin-courses td{white-space:nowrap}
@media (max-width:900px){
  .gcb-admin-wrap .gcb-admin-courses th:nth-child(6),
  .gcb-admin-wrap .gcb-admin-courses td:nth-child(6),
  .gcb-admin-wrap .gcb-admin-courses th:nth-child(7),
  .gcb-admin-wrap .gcb-admin-courses td:nth-child(7){white-space:initial}
}

/* Inputs plus “tap-friendly” en admin */
.gcb-admin-wrap input.small-text{min-width:80px}
.gcb-admin-wrap .regular-text{max-width:100%;width:100%}
.gcb-admin-range .description{display:inline-block;margin-left:8px;color:#6b7280}

/* Un peu d’air pour le bouton "Ajouter un cours" */
#gcb-add-course{margin-top:6px}
/* Cache label + compteur + champs quand type=individuel (classe posée par JS) */
.gcb-mode-individuel .gcb-party,
.gcb-mode-individuel #gcb-participants { display:none !important; }

/* === Loaders génériques (calendrier & slots) === */
.gcb-calendar{ position: relative; }            /* pour overlay */
.gcb-slots{ position: relative; min-height: 48px; } /* garde une hauteur même vide */

.gcb-calendar.is-loading::after,
.gcb-slots.is-loading::after{
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(255,255,255,0.6);
  border-radius: 12px;
}

.gcb-calendar.is-loading::before,
.gcb-slots.is-loading::before{
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 28px;
  height: 28px;
  margin: -14px 0 0 -14px;
  border: 3px solid rgba(21,128,61,0.25);
  border-top-color: #15803d;
  border-radius: 50%;
  animation: gcbspin .8s linear infinite;
}

/* Visuel demandé : jour dispo = bordure verte, jour sélectionné = fond vert clair */
.gcb-day.is-available{ border: 2px solid #15803d; }
.gcb-day.is-selected{ background:#dcfce7 !important; border:2px solid #15803d; }
/* Clics explicites */
.gcb-day.is-available{ cursor:pointer; }
.gcb-day.is-disabled, .gcb-day.is-past{ cursor:default; }
.gcb-slot.is-available{ cursor:pointer; }
.gcb-slot.is-disabled{ cursor:not-allowed; }

/* champs cliquables */
.gcb-wrap input[type="date"],
.gcb-wrap input[type="time"],
.gcb-wrap select,
.gcb-wrap button{ cursor:pointer; }

/* ============================================================================
   INFORMATIONS DE CAPACITÉ (places restantes)
   ============================================================================ */

.gcb-capacity-info {
  grid-column: 1 / -1;
  background: #eff6ff;
  border: 1px solid #3b82f6;
  border-radius: 8px;
  padding: 8px 12px;
  text-align: center;
  font-size: 14px;
  font-weight: 600;
  color: #1e40af;
  margin-top: -4px;
}

.gcb-capacity-info small {
  font-weight: 400;
  color: #60a5fa;
}

.gcb-slots {
  position: relative;
}

.gcb-slot {
  position: relative;
}

.gcb-qty.is-disabled {
  opacity: 0.3;
  cursor: not-allowed;
  pointer-events: none;
}

.gcb-party-info {
  padding: 8px 12px;
  background: #eff6ff;
  border: 1px solid #bfdbfe;
  border-radius: 8px;
  text-align: center;
}