/* PLANNING.CSS v2 — FullCalendar customisation */
:root {
  --fc-border-color: #e2e8f0; --fc-today-bg-color: rgba(245,158,11,.05);
  --fc-page-bg-color: #fff; --fc-neutral-bg-color: #f8fafc;
  --fc-button-bg-color: #f59e0b; --fc-button-border-color: #f59e0b;
  --fc-button-text-color: #0f172a;
  --fc-button-hover-bg-color: #eab308; --fc-button-hover-border-color: #eab308;
  --fc-event-bg-color: #6366f1; --fc-event-border-color: #6366f1;
}

.fc { font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif; }
.fc .fc-toolbar-title { font-family: Georgia,serif; font-size:1.1rem; color:#0f172a; }
.fc .fc-button { border-radius:.5rem!important; font-weight:600!important; font-size:.8rem!important; padding:.4rem .75rem!important; text-transform:none!important; }
.fc .fc-button-primary:not(:disabled).fc-button-active { background:#0f172a!important; border-color:#0f172a!important; color:#f59e0b!important; }
/* Remplacer les icônes FullCalendar par des emojis */
.fc-icon-chevron-left::before { content: '◀' !important; font-family: inherit !important; }
.fc-icon-chevron-right::before { content: '▶' !important; font-family: inherit !important; }
.fc-timegrid-slot { height:32px!important; }
.fc-timegrid-slot-label { font-size:.7rem; color:#94a3b8; }
.fc .fc-timegrid-now-indicator-line { border-color:#ef4444; }
.fc-event { border-radius:6px!important; border:none!important; font-size:.75rem!important; padding:2px 4px!important; }
.fc-event .fc-event-title { white-space:normal!important; overflow:visible!important; }
.fc-bg-event.fc-event { cursor:pointer; }
.fc-event-recurrent { opacity: .65 !important; cursor: pointer !important; }

/* Toolbar custom */
.planning-toolbar { display:flex; align-items:center; justify-content:space-between; gap:.75rem; padding:.5rem 0; margin-bottom:.5rem; flex-wrap:wrap; }
#planning-prof-filter { padding:.4rem .75rem; border:1px solid #d1d5db; border-radius:.5rem; font-size:.8rem; background:#fff; outline:none; }

/* Modales planning (overlay) */
.planning-modal-overlay > div {
  max-width: 520px; width: 100%; margin: 0 auto;
  max-height: 90vh; overflow-y: auto;
}
.planning-modal-overlay input,
.planning-modal-overlay select,
.planning-modal-overlay textarea { color: #0f172a; background: #fff; }
.planning-modal-overlay input::placeholder { color: #9ca3af; }
.planning-modal-overlay label { color: #6b7280; }

/* ═══════════════════════════════════════════════════════════════════════════
   BOOKING FLOW (reserver-essai.php)
   ═══════════════════════════════════════════════════════════════════════════ */

.booking-step { display: none; }
.booking-step.active { display: block; }

.booking-progress {
  display: flex; justify-content: center; align-items: center; gap: 0.5rem;
  margin-bottom: 1.5rem;
}
.booking-dot {
  width: 12px; height: 12px; border-radius: 9999px;
  background: #94a3b8; transition: background 0.3s;
}
.booking-dot.active  { background: #f59e0b; }
.booking-dot.done    { background: #10b981; }

.cours-card {
  border: 2px solid #e2e8f0; border-radius: 1rem; padding: 1.25rem;
  cursor: pointer; transition: all 0.2s;
}
.cours-card:hover {
  border-color: #f59e0b; box-shadow: 0 10px 15px -3px rgba(0,0,0,.1);
  transform: translateY(-2px);
}
.cours-card.selected {
  border-color: #f59e0b; background: rgba(245,158,11,.08);
  box-shadow: 0 4px 6px -4px rgba(0,0,0,.1);
}

.booking-calendar { display: grid; grid-template-columns: repeat(7,1fr); gap: 0.25rem; }
.booking-calendar-day {
  aspect-ratio: 1; display: flex; align-items: center; justify-content: center;
  border-radius: 0.5rem; cursor: pointer; font-size: .875rem; transition: background .15s;
}
.booking-calendar-day:hover            { background: rgba(245,158,11,.2); }
.booking-calendar-day.available        { background: #10b981; color: #fff; }
.booking-calendar-day.selected         { background: #f59e0b; color: #0f172a; }
.booking-calendar-day.disabled         { color: #94a3b8; cursor: not-allowed; }
.booking-calendar-day.today            { box-shadow: 0 0 0 2px rgba(245,158,11,.5); }

.booking-slots { display: grid; grid-template-columns: repeat(4,1fr); gap: .5rem; margin-top: 1rem; }
.booking-slot {
  border: 1px solid #e2e8f0; border-radius: .5rem; padding: .5rem .75rem;
  text-align: center; cursor: pointer; font-size: .875rem; transition: all .15s;
}
.booking-slot:hover    { border-color: #f59e0b; color: #f59e0b; }
.booking-slot.selected { background: #f59e0b; color: #0f172a; border-color: #f59e0b; }
.booking-slot.taken    { background: #f1f5f9; color: #94a3b8; cursor: not-allowed; }

/* ── Mobile ─────────────────────────────────────────────────────────────── */
@media (max-width: 768px) {
  #vue-planning .bg-white { padding: .75rem !important; border-radius: 1rem !important; }
  .fc .fc-toolbar { flex-direction: column !important; gap: .4rem !important; }
  .fc .fc-toolbar-title { font-size: .85rem !important; }
  .fc .fc-button { font-size: .7rem !important; padding: .4rem .65rem !important; min-height: 36px !important; }
  .fc .fc-button-group { flex-wrap: wrap; justify-content: center; }
  .fc-timegrid-slot { height: 30px !important; }
  .fc-event { font-size: .7rem !important; padding: 2px 4px !important; }
  .planning-toolbar { flex-direction: column !important; align-items: stretch !important; gap: .5rem !important; }
  .planning-toolbar-left, .planning-toolbar-actions { width: 100%; display: flex !important; flex-wrap: wrap !important; gap: .4rem !important; }
  .planning-toolbar-left > *, .planning-toolbar-actions > * { flex: 1 1 auto; min-width: calc(50% - .3rem); }
  #planning-prof-filter, #planning-search { width: 100% !important; min-width: 100% !important; }
  #planning-copy-week-btn, #planning-gen-week-btn, #planning-pdf-btn { text-align: center; }

  /* Modales plein écran sur mobile */
  .planning-modal-overlay { padding: .5rem !important; align-items: stretch !important; }
  .planning-modal-overlay > div {
    max-width: 100% !important; width: 100% !important;
    border-radius: 1rem !important; padding: 1.25rem !important;
    max-height: 95vh !important; margin: 0 !important;
  }
  .planning-modal-overlay input,
  .planning-modal-overlay select,
  .planning-modal-overlay button[type="submit"] { min-height: 44px !important; font-size: 16px !important; }
}

/* ── Très petit écran ──────────────────────────────────────────────────── */
@media (max-width: 480px) {
  .fc .fc-toolbar-title { font-size: .75rem !important; }
  .fc .fc-button { font-size: .65rem !important; padding: .35rem .5rem !important; }
  .fc-timegrid-slot { height: 26px !important; }
  .fc-event { font-size: .65rem !important; padding: 1px 3px !important; }
  .fc .fc-daygrid-day-frame { min-height: 60px; }
  .planning-toolbar-left > *, .planning-toolbar-actions > * { min-width: 100%; }
}

/* ── Print ──────────────────────────────────────────────────────────────── */
@media print {
  .planning-toolbar,.fc-header-toolbar,#planning-pdf-btn,nav{display:none!important}
  body,main{margin:0!important;padding:0!important;max-width:100%!important}
  .fc{border:1px solid #000!important}
  .fc-event{-webkit-print-color-adjust:exact;print-color-adjust:exact}
}