:root { --card-radius: 1rem; }
.card { border-radius: var(--card-radius); }
.btn, .form-control, .form-select { border-radius: .8rem; }
.navbar-brand { letter-spacing: .5px; }
.table thead th { font-size: .85rem; text-transform: uppercase; letter-spacing: .02em; color: #6c757d; }
.badge { font-weight: 600; }
/* Limiter la largeur max du site */
.container {
  max-width: 1800px;
}

/* Limiter la largeur des formulaires */
form {
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
}

/* Optionnel : un peu plus d’espace sur les champs */
form .form-control,
form .form-select {
  min-height: 45px;
}

/* Réduire la police du tableau des tâches */
.tasks-table {
  font-size: 0.9rem; /* un peu plus petit */
  table-layout: auto;   /* largeur des colonnes = contenu */
  width: 100%;
}

.tasks-table th,
.tasks-table td {
  padding: 0.4rem 0.6rem; /* resserre les cellules */
  vertical-align: middle;

}

.tasks-table td:nth-child(2) { 
  white-space: normal; /* description : permet le retour à la ligne */
}

/* Centrer et aérer */
#calendar {
  max-width: 100%;
  margin: 20px auto;
  background: #fff;
  border-radius: 12px;
  padding: 15px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}

/* Boutons de navigation */
.fc .fc-button {
  border-radius: 8px !important;
  padding: 6px 12px !important;
  border: none !important;
  background: #007bff !important;
  color: white !important;
  font-weight: 500;
}

.fc .fc-button:hover {
  background: #0056b3 !important;
}

/* Titre du calendrier */
.fc-toolbar-title {
  font-size: 1.2rem !important;
  font-weight: bold !important;
}

/* Cases du calendrier */
.fc-daygrid-day {
  transition: background 0.2s ease-in-out;
}

.fc-daygrid-day:hover {
  background: #f8f9fa;
  cursor: pointer;
}

/* Calendar */
#calendar {
    max-width: 100%;
    margin: 2rem auto;
    background: rgba(255, 255, 255, 0.1); /* effet glass */
    backdrop-filter: blur(8px);
    border-radius: 1rem;
    padding: 1rem;
    color: #fff;
  }
  .fc .fc-toolbar-title {
    font-size: 1.4rem;
    font-weight: bold;
    color: #00d4ff;
  }
  .fc .fc-daygrid-day-number,
  .fc .fc-list-day-text {
    color: #fff;
    font-weight: bold;
  }
  .fc .fc-col-header-cell-cushion {
    color: #ccc;
    font-weight: 600;
  }
  .fc-event {
    border: none;
    border-radius: 6px;
    font-size: 0.85rem;
    padding: 2px 4px;
  }
  .legend {
    display: flex;
    gap: 1rem;
    margin-top: 1rem;
    font-size: 0.9rem;
  }
  .legend span {
    display: inline-flex;
    align-items: center;
    gap: 5px;
  }
  .legend i {
    display: inline-block;
    width: 12px;
    height: 12px;
    border-radius: 3px;
  }
  .legend .todo { background: #ff4d4d; }
  .legend .progress { background: #ffc107; }
  .legend .done { background: #28a745; }

/* Indicateurs de tri Tablesort */
th {
  cursor: pointer;
  position: relative;
  user-select: none;
  padding-right: 20px !important;
}

th::after {
  content: "⇅";  /* flèches neutres */
  position: absolute;
  right: 5px;
  font-size: 0.8rem;
  color: #bbb;
}

th.sort-up::after {
  content: "▲";  /* flèche haut */
  color: #000;
}

th.sort-down::after {
  content: "▼";  /* flèche bas */
  color: #000;
}
/* Grande image dans la page détail */
.project-image {
	max-width: 600px;   /* largeur max */
    max-height: 400px;  /* hauteur max */
    width: auto;        /* largeur auto = garde le ratio */
    height: auto;       /* hauteur auto = garde le ratio */
    border-radius: 8px; 
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
}
/* Miniature dans le dashboard */
.project-thumb {
    max-width: 400px;
    max-height: 350px;
    width: auto;
    height: auto;
    border-radius: 6px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.navbar-logo {
    max-height: 100px;   /* ✅ limite la hauteur */
    width: auto;        /* garde le ratio */
    height: auto;       /* garde le ratio */
}

.navbar {
    padding-top: 0.0rem;
    padding-bottom: 0.0rem;
}

.dashboard-card {
    background: #fff; /* ✅ fond blanc */
    color: #000; /* ✅ texte noir */
    border-radius: 1rem;
    box-shadow: 0 4px 20px rgba(0,0,0,0.2);
    padding: 2rem;
  }

  .dashboard-card h2 {
    font-weight: 700;
    margin-bottom: 1.5rem;
    color: #333;
  }

  .dashboard-table th, 
  .dashboard-table td {
    vertical-align: middle;
  }
  
  .admin-card {
    background: #fff; /* ✅ fond blanc */
    color: #000; /* ✅ texte noir */
    border-radius: 1rem;
    box-shadow: 0 4px 20px rgba(0,0,0,0.2);
    padding: 2rem;
  }
  .admin-card h2 {
    font-weight: 700;
    margin-bottom: 1.5rem;
    color: #333;
  }
  .admin-table th, 
  .admin-table td {
    vertical-align: middle;
  }
  
  .attachments-cell {
  white-space: normal;   /* ✅ permet le retour à la ligne */
  max-width: 200px;      /* limite largeur pour éviter débordements */
  word-wrap: break-word; /* coupe les noms trop longs */
}

.thumb-video {
  width: 112px;
  height: 63px;      /* ~16:9 */
  object-fit: cover;
  background: #000;
}
.thumb-video:focus {
  outline: 2px solid #0d6efd66;
  outline-offset: 2px;
}

#media-filters .form-label { font-weight: 600; }
#media-filters input::placeholder { color: #9aa0a6; }
#f-count { line-height: 1; }

/* Masque infaillible pour les items filtrés */
.is-hidden { display: none !important; }

/* Miniature dans la timeline (plus compacte) */
.video-thumb-sm {
  width: 112px;
  height: 63px;    /* ratio 16:9 réduit */
  object-fit: cover;
  border-radius: 4px;
  background-color: #000;
  flex-shrink: 0;
}	

#timeline .list-group-item {
  padding: 6px 10px;
}

#timeline .list-group-item .fw-semibold {
  font-size: 0.9rem;
}

#timeline .list-group-item .small {
  font-size: 0.75rem;
}

.timeline-index {
  width: 24px;
  height: 24px;
  line-height: 24px;
  border-radius: 50%;
  background-color: #0d6efd; /* bleu Bootstrap */
  color: #fff;
  font-weight: 600;
  text-align: center;
  font-size: 0.8rem;
  flex-shrink: 0;
}

/* miniature compacte */
.video-thumb-sm{ width:60px; height:34px; object-fit:cover; background:#000; border-radius:4px; }

/* pastilles numérotées */
.timeline-index, .lib-index-badge{
  width:22px; height:22px; line-height:22px;
  border-radius:50%; background:#0d6efd; color:#fff;
  font-weight:600; font-size:.75rem; text-align:center; flex-shrink:0;
}

/* badge en médiathèque, discret */
.lib-index-badge{ background:#6c757d; margin-right:.25rem; display:none; }
.lib-index-badge.is-visible{ display:inline-flex; justify-content:center; align-items:center; }	

/* Miniature compacte timeline */
.video-thumb-sm{ width:60px; height:34px; object-fit:cover; background:#000; border-radius:4px; }

/* Pastilles numérotées */
.timeline-index{
  width:22px; height:22px; line-height:22px; border-radius:50%;
  background:#0d6efd; color:#fff; font-weight:600; font-size:.75rem;
  text-align:center; flex-shrink:0;
}

/* Badge de positions dans la médiathèque (peut avoir "1, 4, 7") */
.lib-index-badge{
  display:none; background:#6c757d; color:#fff; font-weight:600;
  border-radius:2px; padding:0 8px; height:22px; line-height:22px;
  font-size:.62rem; white-space:nowrap;
  min-width: 100px;
}
.lib-index-badge.is-visible{ display:inline-block; }


/* Items médiathèque incompatibles : visuel atténué mais clics autorisés */
.is-incompatible {
  opacity: .6;
  filter: grayscale(.25);
}

/* Bouton Ajouter clairement non-autorisé */
.is-incompatible .add-to-timeline {
  cursor: not-allowed;
}

#btnPlayTimeline[disabled] {
  opacity: 0.7;
  cursor: not-allowed;
}


[data-readonly="1"], [data-readonly="1"] *[draggable] {
  user-select: none;
  cursor: not-allowed !important;
}

.is-locked {
  pointer-events: none !important;
  opacity: .55;
}

.lock-badge {
  display: inline-flex; align-items: center; gap: .5rem;
  background: #fff3cd; color: #664d03; border: 1px solid #ffe69c;
  border-radius: .5rem; padding: .5rem .75rem; margin-bottom: 1rem;
}