/* === Charte graphique : palette de marque ASFA === */
:root {
  --brand-blue:    #67BEEC;
  --brand-lime:    #D4D800;
  --brand-purple:  #7B62A8;
  --brand-magenta: #B24794;
  --brand-purple-dark: #6a5394;
}

/* Barre de navigation collante + effet de transparence au scroll. */
.app-nav {
  background-color: #ffffff;
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
  transition: background-color .3s ease, box-shadow .3s ease, backdrop-filter .3s ease;
  /* Filet dégradé reprenant les 4 couleurs de la charte */
  border-bottom: 3px solid transparent;
  border-image: linear-gradient(90deg,
    var(--brand-blue), var(--brand-lime),
    var(--brand-purple), var(--brand-magenta)) 1;
}
/* Ajoutée en JS dès que la page n'est plus tout en haut : fond translucide + flou. */
.app-nav.nav-scrolled {
  background-color: rgba(255, 255, 255, 0.65);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  box-shadow: 0 4px 12px -2px rgba(0, 0, 0, 0.12);
}

/* Logo « ASFA » : une couleur de la charte par lettre */
.brand-logo { font-weight: 800; letter-spacing: .5px; }
.brand-logo .c1 { color: var(--brand-blue); }
.brand-logo .c2 { color: #A9AD00; } /* lime charte assombri pour rester lisible sur blanc */
.brand-logo .c3 { color: var(--brand-purple); }
.brand-logo .c4 { color: var(--brand-magenta); }

/* Lien de navigation actif : teinte bleu charte au lieu du gris */
.app-nav a.bg-gray-100 {
  background-color: rgba(103, 190, 236, 0.18) !important;
  color: #1f6f9e !important;
}

/* Badges de rôle dérivés de la charte (texte assombri pour la lisibilité) */
.badge-admin { background-color: rgba(123, 98, 168, 0.16); color: #5b4785; }
.badge-pro   { background-color: rgba(103, 190, 236, 0.20); color: #236f95; }

/* Couleur d'action primaire : on remappe le bleu Tailwind vers le violet charte
   pour rebrander tous les boutons principaux de l'application d'un seul coup. */
.bg-blue-600 { background-color: var(--brand-purple) !important; }
.hover\:bg-blue-700:hover { background-color: var(--brand-purple-dark) !important; }
.text-blue-700 { color: var(--brand-purple) !important; }
.text-blue-600 { color: var(--brand-purple) !important; }
.focus\:ring-blue-500:focus { --tw-ring-color: var(--brand-purple) !important; }

/* Bouton « charte » réutilisable (violet plein, bon contraste sur blanc) */
.btn-brand { background-color: var(--brand-purple); color: #fff; }
.btn-brand:hover { background-color: var(--brand-purple-dark); }

/* Petits ajustements visuels au-dessus de Tailwind. */
.fc .fc-event { cursor: pointer; }
.fc .fc-toolbar-title { font-size: 1rem !important; }
@media (max-width: 640px) {
  .fc .fc-toolbar.fc-header-toolbar { flex-direction: column; gap: .5rem; }
}

/* Fériés / ponts : fond plein (FullCalendar applique 30% par défaut) */
.fc .fc-bg-event { opacity: 0.95 !important; }
.fc .fc-bg-event .fc-event-title { display: none; }

/* Étiquette intégrée à la cellule du jour férié / pont (vues mois) */
.fc .afa-closed-label {
  position: absolute;
  left: 2px; right: 2px; bottom: 2px;
  font-size: 10px;
  font-weight: 700;
  text-align: center;
  color: #ffffff;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
  pointer-events: none;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  z-index: 4;
}
.fc-daygrid-day-frame { position: relative; }

/* Pause méridienne 12h-14h : fond gris atténué (les slots restent visibles) */
.fc .fc-bg-event[style*="rgb(203, 213, 225)"] {
  opacity: 0.6 !important;
}

/* Pilule sur l'en-tête de colonne (vues semaine / jour) */
.fc .afa-closed-pill {
  display: inline-block;
  margin-top: 2px;
  padding: 1px 6px;
  font-size: 10px;
  font-weight: 700;
  border-radius: 9999px;
  color: #ffffff;
}
.fc .afa-closed-pill.is-holiday { background: #dc2626; }
.fc .afa-closed-pill.is-bridge  { background: #ea580c; }
