/* SQUELETTE UNIQUEMENT (sans toucher les bordures internes)
   Piloté par attributes et variables CSS sur #planningTableWithNames
   Variables: --skel-color / --skel-width (définies côté JS)
   Contour du tableau = géré par le frame externe (JS)
*/

#planningTableWithNames[data-skel="1"] { border-collapse: collapse; }

/* Trait horizontal sous les jours (en-tête) */
#planningTableWithNames[data-skel="1"] thead th {
  border-bottom-color: var(--skel-color, #cbd5e1) !important; /* slate-300 */
  border-bottom-width: var(--skel-width, 1px) !important;
  border-bottom-style: solid !important;
  /* Pas de bordure supérieure pour éviter un double trait sous le cadre */
  border-top-width: 0 !important;
}

/* Trait horizontal aligné au-dessus de la première ligne de corps (effet continu sous l'en-tête) */
#planningTableWithNames[data-skel="1"] tbody tr:first-child > th,
#planningTableWithNames[data-skel="1"] tbody tr:first-child > td {
  border-top-color: var(--skel-color, #cbd5e1) !important;
  border-top-width: var(--skel-width, 1px) !important;
  border-top-style: solid !important;
}

/* Séparateur vertical entre Compétences (col 1) et Horaires (col 2)
  (hors bande de validation) */
#planningTableWithNames[data-skel="1"] thead tr:not(.valide-band-row) > th:nth-child(1),
#planningTableWithNames[data-skel="1"] tbody tr > th:nth-child(1),
#planningTableWithNames[data-skel="1"] tbody tr > td:nth-child(1),
#planningTableWithNames[data-skel="1"] tfoot tr > th:nth-child(1),
#planningTableWithNames[data-skel="1"] tfoot tr > td:nth-child(1) {
  border-right-color: var(--skel-color, #cbd5e1) !important;
  border-right-width: var(--skel-width, 1px) !important;
  border-right-style: solid !important;
  /* Enlever la bordure extérieure gauche interne (évite le double trait avec le cadre) */
  border-left-width: 0 !important;
}

/* Séparateur vertical à droite d'Horaires (après col 2)
  (hors bande de validation) */
#planningTableWithNames[data-skel="1"] thead tr:not(.valide-band-row) > th:nth-child(2),
#planningTableWithNames[data-skel="1"] tbody tr > th:nth-child(2),
#planningTableWithNames[data-skel="1"] tbody tr > td:nth-child(2),
#planningTableWithNames[data-skel="1"] tfoot tr > th:nth-child(2),
#planningTableWithNames[data-skel="1"] tfoot tr > td:nth-child(2) {
  border-right-color: var(--skel-color, #cbd5e1) !important;
  border-right-width: var(--skel-width, 1px) !important;
  border-right-style: solid !important;
  /* Empêcher le doublon sur le séparateur: aucune bordure gauche sur la 2e colonne */
  border-left-width: 0 !important;
}

/* Les coins arrondis restent gérés par le frame externe */

/* Tfoot: cohérence de squelette (bordures supérieures des cellules) */
#planningTableWithNames[data-skel="1"] tfoot th,
#planningTableWithNames[data-skel="1"] tfoot td {
  border-top-color: var(--skel-color, #cbd5e1) !important;
  border-top-width: var(--skel-width, 1px) !important;
  border-top-style: solid !important;
  /* Pas de bordure inférieure pour éviter le double trait avec le cadre */
  border-bottom-width: 0 !important;
}

/* Supprimer les bordures extérieures droite sur la dernière colonne (évite le double trait avec le cadre) */
#planningTableWithNames[data-skel="1"] tr > th:last-child,
#planningTableWithNames[data-skel="1"] tr > td:last-child {
  border-right-width: 0 !important;
}

/* Supprimer la bordure basse de la dernière ligne du corps pour éviter un doublon avec le tfoot/cadre */
#planningTableWithNames[data-skel="1"] tbody tr:last-child > th,
#planningTableWithNames[data-skel="1"] tbody tr:last-child > td {
  border-bottom-width: 0 !important;
}

/* Bande de validation: appliquer le séparateur sur le côté droit de la cellule fusionnée (colspan=2)
   pour l'aligner exactement avec le séparateur entre "Horaires" (col 2) et le 1er jour (col 3) */
#planningTableWithNames[data-skel="1"] thead tr.valide-band-row > th[colspan="2"] {
  border-right-color: var(--skel-color, #cbd5e1) !important;
  border-right-width: var(--skel-width, 1px) !important;
  border-right-style: solid !important;
}

/* Empêcher toute bordure droite sur les cellules ✓ de la bande pour éviter un doublon visuel */
#planningTableWithNames[data-skel="1"] thead tr.valide-band-row > th.valide-col {
  border-right-width: 0 !important;
}

/* ==========================
   LIGNES INTERNES (optionnelles)
   Pilotées par data-inner-v / data-inner-h et variables CSS
   ========================== */

/* Verticales entre jours (appliquer un séparateur à gauche des colonnes de jours à partir de la 2e journée) */
/* D’abord, neutraliser toute bordure droite sur les colonnes de jours */
#planningTableWithNames[data-inner-v="1"] thead tr:not(.valide-band-row) > th:nth-child(n+3),
#planningTableWithNames[data-inner-v="1"] tbody tr > td:nth-child(n+3),
#planningTableWithNames[data-inner-v="1"] tfoot tr > th:nth-child(n+3),
#planningTableWithNames[data-inner-v="1"] tfoot tr > td:nth-child(n+3) {
  border-right: none !important;
}
/* Puis tracer le séparateur entre jours en bordure gauche à partir de la 4e colonne (jour 2 et suivants) */
#planningTableWithNames[data-inner-v="1"] thead tr:not(.valide-band-row) > th:nth-child(n+4),
#planningTableWithNames[data-inner-v="1"] tbody tr > td:nth-child(n+4),
#planningTableWithNames[data-inner-v="1"] tfoot tr > th:nth-child(n+4),
#planningTableWithNames[data-inner-v="1"] tfoot tr > td:nth-child(n+4) {
  border-left-color: var(--inner-vlines-color, #94a3b8) !important;
  border-left-width: var(--inner-vlines-width, 1px) !important;
  border-left-style: var(--inner-vlines-style, solid) !important;
}
/* Ne rien appliquer dans la bande de validation, on garde la logique dédiée */
#planningTableWithNames[data-inner-v="1"] thead tr.valide-band-row > th { border-left-width: 0 !important; border-right-width: 0 !important; }

/* Horizontales entre lignes (tbody uniquement, pas d’en-tête ni bande ni tfoot) */
#planningTableWithNames[data-inner-h="1"] tbody tr > th,
#planningTableWithNames[data-inner-h="1"] tbody tr > td {
  /* Bordure supérieure fine configurable */
  border-top-color: var(--inner-hlines-color, #cbd5e1) !important;
  border-top-width: var(--inner-hlines-width, 1px) !important;
  border-top-style: var(--inner-hlines-style, solid) !important;
}
/* La 1re ligne du tbody n’a pas de bordure supérieure personnalisée (déjà gérée par le squelette) */
#planningTableWithNames[data-inner-h="1"] tbody tr:first-child > th,
#planningTableWithNames[data-inner-h="1"] tbody tr:first-child > td {
  border-top-width: 0 !important;
}

/* Le pinceau applique des bordures inline !important et devient prioritaire ligne par ligne */