/* Créneaux types par temps d'accueil, natifs Le Fil (js/accueils/creneaux.js). Style de Le Fil : encre, filets, aucune couleur décorative (ambre = ce qui
   bloque), cibles de 44 px et plus, sept tailles de texte (12, 14, 16, 18, 24, 30), aucun effet. Remplace le rendu classique de reglages.js (.acl-modele*).
   Les feuilles (.fb-voile / .fb-feuille, css/fil-budget.css) sont posées dans <body> : elles héritent des jetons de <html>. */
.fc { color: var(--f-encre); font: 400 16px/1.5 Inter, system-ui, sans-serif; }
.fc *, .fc *::before, .fc *::after, .fc-feuille *, .fc-feuille *::before, .fc-feuille *::after { box-sizing: border-box; }
.fc [hidden], .fc-feuille [hidden] { display: none !important; }
.fc :focus-visible, .fc-feuille :focus-visible { outline: 2px solid var(--f-encre); outline-offset: 3px; }

/* Les trois temps */
.fc-segments { display: flex; gap: 4px; padding: 4px; background: var(--f-surface-2); border: 1px solid var(--f-filet); border-radius: 14px; }
.fc-segment { display: flex; flex: 1 1 auto; align-items: center; justify-content: center; gap: 6px; min-width: 0; min-height: 48px; padding: 0 6px; border: 0; border-radius: 10px; background: transparent; color: var(--f-encre-2); font: 500 14px/1.2 Inter, system-ui, sans-serif; cursor: pointer; }
.fc-segment[aria-selected="true"] { background: var(--f-encre); color: var(--f-fond); }
.fc-segment-lib { min-width: 0; white-space: nowrap; }
.fc-segment-n { flex: none; min-width: 22px; padding: 3px 6px; border: 1px solid currentColor; border-radius: 99px; font: 500 12px/1 Inter, system-ui, sans-serif; font-variant-numeric: tabular-nums; text-align: center; opacity: .8; }
@media (min-width: 640px) { .fc-segments { display: inline-flex; } .fc-segment { flex: 0 0 auto; padding: 0 24px; } }

/* Un temps : sa règle, ses créneaux, puis les formules à ajouter */
.fc-panneau { margin-top: 14px; }
.fc-regle { margin: 0 0 10px; color: var(--f-encre-2); font: 400 14px/1.4 Inter, system-ui, sans-serif; }
.fc-note { margin: 0 0 10px; color: var(--f-attention); font: 500 14px/1.4 Inter, system-ui, sans-serif; }
.fc-vide { margin: 0; padding: 4px 0 6px; color: var(--f-encre-2); font: 400 14px/1.4 Inter, system-ui, sans-serif; }
.fc-liste { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap: 8px; margin: 0; padding: 0; list-style: none; }
.fc-modele { margin: 0; min-width: 0; }
.fc-ligne { position: relative; display: grid; gap: 2px; width: 100%; min-height: 72px; padding: 12px 40px 12px 16px; border: 1px solid var(--f-filet); border-radius: 18px; background: var(--f-surface); color: var(--f-encre); font: inherit; text-align: left; }
button.fc-ligne { cursor: pointer; }
button.fc-ligne:hover { background: var(--f-surface-2); }
button.fc-ligne::after { content: ''; position: absolute; top: 50%; right: 18px; width: 8px; height: 8px; border-top: 2px solid var(--f-encre-3); border-right: 2px solid var(--f-encre-3); transform: translateY(-50%) rotate(45deg); }
.fc-ligne-haut { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; min-width: 0; }
.fc-nom { font: 600 16px/1.3 Inter, system-ui, sans-serif; overflow-wrap: anywhere; }
.fc-etiquette { padding: 2px 8px; border: 1px solid var(--f-filet); border-radius: 10px; color: var(--f-encre-2); font: 500 12px/1.4 Inter, system-ui, sans-serif; }
.fc-ligne-quand { font: 500 14px/1.4 Inter, system-ui, sans-serif; font-variant-numeric: tabular-nums; }
.fc-ligne-qui { color: var(--f-encre-2); font: 400 14px/1.4 Inter, system-ui, sans-serif; overflow-wrap: anywhere; }
.fc-modele[data-inactif] .fc-ligne { opacity: .6; }

.fc-ajout { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--f-filet); }
.fc-ajout-lib { margin: 0 0 8px; color: var(--f-encre-2); font: 500 14px/1.3 Inter, system-ui, sans-serif; }
.fc-formules { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 150px), 1fr)); gap: 8px; }
.fc-formule { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 2px; min-width: 0; min-height: 56px; padding: 8px 14px; border: 1px solid var(--f-filet); border-radius: 14px; background: var(--f-surface); color: var(--f-encre); font: inherit; text-align: left; cursor: pointer; }
.fc-formule:hover { background: var(--f-surface-2); }
.fc-formule-lib { font: 500 14px/1.3 Inter, system-ui, sans-serif; overflow-wrap: anywhere; }
.fc-formule-lib::before { content: '+'; margin-right: 6px; color: var(--f-encre-3); }
.fc-formule-heures { color: var(--f-encre-2); font: 400 12px/1.4 Inter, system-ui, sans-serif; font-variant-numeric: tabular-nums; }

/* Choix (formule, jours, groupes, encadrants) */
.fc-choix-groupe { display: flex; flex-wrap: wrap; gap: 8px; }
.fc-choix { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; padding: 0 14px; border: 1px solid var(--f-filet); border-radius: 14px; background: var(--f-surface); color: var(--f-encre); font: 500 14px/1.2 Inter, system-ui, sans-serif; cursor: pointer; }
.fc-choix[aria-pressed="true"], .fc-choix[aria-checked="true"] { background: var(--f-encre); color: var(--f-fond); border-color: var(--f-encre); }
.fc-jours { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; }
.fc-jours .fc-choix { min-width: 0; padding: 0; }

/* Feuille d'un créneau */
.fc-feuille-corps { display: grid; gap: 14px; }
.fc-heures { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.fc-message { margin: 0; color: var(--f-encre-2); font: 400 14px/1.4 Inter, system-ui, sans-serif; }
.fc-message:empty { display: none; }
@media (max-width: 480px) {
  .fb-voile:has(.fc-feuille) { padding: 0; }
  .fc-feuille { width: 100%; padding: 18px 12px 12px; border-radius: 30px 30px 0 0; border-bottom: 0; }
  .fc-feuille .fb-feuille-actions { bottom: -12px; margin: 0 -12px -12px; padding: 12px; }
  .fc-jours { gap: 3px; }
}
@media (prefers-reduced-motion: reduce) { .fc-feuille { animation: none; } }
