/* (v1.17.13) Ajout de box-sizing global pour éviter les débordements */
*,
*::before,
*::after {
    box-sizing: border-box;
}

/**
 * (Modifié) v1.17.23 - Style du titre de session en bloc.
 * Feuille de style pour le shortcode [digiforma_calendar_view]
 *
 * MODIFIÉ v3.3
 * - Ajout du style moderne pour #df-calendar-show-my-profile
 *
 * MODIFIÉ (Fonctionnalité: Résultats Stagiaires)
 * - Ajout des styles pour .df-session-result-badge
 */
 
.df-calendar-wrapper { 
    max-width: 100%; 
    margin: 20px auto; 
}

.df-calendar-nav { 
    display: flex; 
    gap: 15px; 
    margin-bottom: 20px; 
    background: #f9f9f9; 
    padding: 12px; 
    border-radius: 5px; 
    flex-wrap: wrap; 
    align-items: flex-end;
}
.df-calendar-nav h3 {
    margin-top: 0;
    margin-bottom: 5px;
    font-size: 1.2em;
}
.df-nav-group { 
    display: flex; 
    flex-direction: column; 
    gap: 5px; 
    min-width: 150px; 
    flex-grow: 1; /* (v1.16.44) */
}
/* (v1.16.75) Groupe de recherche */
.df-nav-group-search {
    position: relative; /* Pour le conteneur de suggestions */
    flex-grow: 2; /* Plus large que les autres */
    min-width: 250px;
    z-index: 10; /* Pour que les suggestions passent au-dessus des autres filtres */
}
.df-nav-group-search input[type="search"] {
    width: 100%;
    padding: 6px 8px;
    border-radius: 4px;
    border: 1px solid #ccc;
    height: 38px;
    font-size: 0.9em;
    /* box-sizing: border-box; (v1.17.10) Géré globalement */
}

/* (v1.16.75) Conteneur de suggestions */
.df-search-suggestions {
    position: absolute;
    top: 100%; /* Juste en dessous de l'input */
    left: 0;
    right: 0;
    background: #fff;
    border: 1px solid #ccc;
    border-top: none;
    border-radius: 0 0 4px 4px;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
    z-index: 1000;
    max-height: 400px;
    overflow-y: auto;
}
.df-search-suggestions h4 {
    font-size: 0.8em;
    text-transform: uppercase;
    color: #777;
    font-weight: bold;
    padding: 8px 12px;
    margin: 0;
    background: #f9f9f9;
    border-bottom: 1px solid #eee;
    border-top: 1px solid #eee;
}
.df-search-suggestions h4:first-child {
    border-top: none;
}
.df-suggestion-item {
    display: block;
    padding: 10px 12px;
    font-size: 0.9em;
    color: #333;
    text-decoration: none;
    cursor: pointer;
    border-bottom: 1px solid #f0f0f0;
}
.df-suggestion-item:last-child {
    border-bottom: none;
}
.df-suggestion-item:hover {
    background: #f5f5f5;
    color: #000;
}
.df-suggestion-item-code {
    font-size: 0.9em;
    color: #555;
    margin-left: 8px;
}
.df-search-no-results {
    padding: 15px;
    font-style: italic;
    color: #777;
    text-align: center;
}
.df-search-no-results.is-error {
    color: #a94442;
    font-style: normal;
    font-weight: bold;
}
/* (v1.16.99) Style pour le "chargement..." dans les suggestions */
.df-search-loading {
    padding: 10px;
    font-style: italic;
    font-size: 0.9em;
    text-align: left;
}


.df-nav-group label { 
    font-weight: bold; 
    font-size: 0.85em; 
} 
.df-nav-group select { 
    width: 100%; 
    padding: 6px 8px; 
    border-radius: 4px; 
    border: 1px solid #ccc; 
    height: 38px; 
    font-size: 0.9em; 
}
/* (v1.16.44) Style pour le sélecteur stagiaire désactivé */
.df-nav-group select:disabled {
    background: #f0f0f0;
    cursor: not-allowed;
}

.df-nav-group-buttons { 
    display: flex; 
    align-items: flex-end; 
    gap: 5px; 
    flex-grow: 0; /* (v1.16.44) */
}
.df-nav-group-buttons .button {
    padding: 0 10px;
    height: 38px; 
    line-height: 36px;
    font-size: 1em; 
    font-weight: 600; 
    cursor: pointer;
}

/* NOUVEAU v3.3: Style "moderne" pour "Mon Profil" */
#df-calendar-show-my-profile {
    background-color: #ffffff;
    border: 1px solid #5e4682; /* Bordure violette */
    color: #5e4682; /* Texte violet */
    font-weight: 600;
    box-shadow: 0 1px 3px rgba(0,0,0,0.08); /* Ombre subtile */
    transition: background-color 0.2s, color 0.2s, transform 0.2s, box-shadow 0.2s;
}
#df-calendar-show-my-profile:hover {
    background-color: #5e4682; /* Fond violet au survol */
    color: #ffffff; /* Texte blanc au survol */
    transform: translateY(-1px); /* Léger soulèvement */
    box-shadow: 0 4px 8px rgba(94, 70, 130, 0.2); /* Ombre plus prononcée */
}
#df-calendar-show-my-profile:active {
    transform: translateY(0);
    box-shadow: 0 1px 3px rgba(0,0,0,0.08);
}


.df-calendar-layout {
    display: grid;
    /* (v1.17.09) Modification: Sidebar fixe au lieu de % */
    grid-template-columns: 1fr 400px; 
    gap: 20px;
}
.df-calendar-main { }
.df-calendar-sidebar { 
    position: -webkit-sticky; 
    position: sticky;
    top: 32px; /* Fallback (sera écrasé par le style inline) */
    align-self: flex-start; 
}

.df-calendar-sticky-nav { display: none; } 

.df-calendar-title {
    font-size: 1.8em;
    font-weight: 600;
    margin-top: 0;
    margin-bottom: 15px;
    border-bottom: 1px solid #eee;
    padding-bottom: 10px;
}

/* Grille 5+2 jours */
.df-calendar-grid { 
    display: grid; 
    table-layout: fixed; 
    /* 50px (Sem) + 5 jours (1fr) + 2 jours (0.5fr) */
    grid-template-columns: 50px repeat(5, 1fr) 0.5fr 0.5fr; 
    border-left: 1px solid #e0e0e0; 
    border-top: 1px solid #e0e0e0; 
}
.df-calendar-week-header, .df-calendar-week-number {
    font-weight: bold;
    text-align: center;
    padding: 10px 5px;
    background: #f5f5f5;
    border-right: 1px solid #e0e0e0;
    border-bottom: 1px solid #e0e0e0;
    font-size: 0.9em;
    writing-mode: vertical-rl; 
    transform: rotate(180deg); 
}
.df-calendar-week-number {
    background: #fcfcfc;
    font-size: 0.85em;
    color: #777;
}

.df-calendar-header { 
    font-weight: bold; 
    text-align: center; 
    padding: 10px 5px; 
    background: #f5f5f5; 
    border-right: 1px solid #e0e0e0; 
    border-bottom: 1px solid #e0e0e0; 
    font-size: 0.85em; 
}

/* Style colonnes Semaine, Samedi, Dimanche */
.df-calendar-week-header {
    background-color: rgba(94, 70, 130, 0.05); 
}
.df-calendar-week-number {
    background-color: rgba(94, 70, 130, 0.02); 
}

.df-calendar-header:nth-child(7),
.df-calendar-header:nth-child(8) {
    background-color: #f0f0f0; 
}
.df-calendar-day:nth-child(8n+7),
.df-calendar-day:nth-child(8n+8) {
    background-color: #f9f9f9; 
}
.df-calendar-day:nth-child(8n+7).is-padding,
.df-calendar-day:nth-child(8n+8).is-padding {
    background-color: #f7f7f7;
}

.df-calendar-day { 
    border-right: 1px solid #e0e0e0; 
    border-bottom: 1px solid #e0e0e0; 
    padding: 8px; 
    min-height: 120px; 
    background: #fff; 
    overflow: hidden;
    transition: border-color 0.3s, border-width 0.3s;
    cursor: pointer; 
}
.df-calendar-day.is-padding { 
    background: #fdfdfd; 
    cursor: default; 
} 
.df-calendar-day-number { 
    font-weight: bold; 
    font-size: 0.9em; 
    color: #333; 
}

/* Style pour la case surlignée */
.df-calendar-day.is-highlighted {
    outline: 3px solid #5e4682; 
    outline-offset: -2px; 
    box-shadow: 0 0 8px rgba(94, 70, 130, 0.5);
}

.df-session-item { 
    color: #fff; 
    padding: 5px 8px; 
    border-radius: 4px; 
    font-size: 0.85em; 
    margin-top: 5px; 
    cursor: pointer; 
    transition: background 0.2s, opacity 0.3s;
    height: 2.2em; 
    line-height: 1.2em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis; 
    /* box-sizing: border-box; (v1.17.10) Géré globalement */
}
.df-session-item:hover { 
    opacity: 1 !important; 
}

.df-session-item.is-faded {
    opacity: 0.4;
}

/* Styles pour Interne/Externe/Passé */
.df-session-item.style-internal {
    background-color: #fff !important;
    border: 2px solid; 
    color: #333 !important; 
    line-height: 1.0em; 
    padding: 3px 6px; 
}

/* (v1.16.59) Style pour Externe */
.df-session-item.style-external {
    border: 2px solid #000;
    padding: 3px 6px; /* Ajuster le padding pour compenser la bordure */
    line-height: 1.0em; 
}

/* Styles pour la carte de détails (Session) */
.df-session-card { 
    background: #fff; 
    border: 1px solid #e0e0e0; 
    border-radius: 5px; 
    padding: 15px 20px; 
}
.df-session-card-header {
    margin-bottom: 15px;
}

/* (v1.16.38) Nouveau design du titre (Modifié v1.17.23) */
.df-session-card h3.df-session-training-title {
    margin-top: 0;
    margin-bottom: 15px; /* Espace accru */
    font-size: 1.5em;
    font-weight: 700;
    color: #fff; /* Texte en blanc */
    padding: 10px 15px; /* Padding pour le bloc */
    border-radius: 4px; /* Coins arrondis */
    /* La couleur de fond (background-color) est gérée en inline via PHP */
}
/* Fin (v1.16.38) */

/* (v1.16.60) Conteneur pour la date et le tag */
.df-session-date-container {
    display: flex;
    align-items: center;
    gap: 10px;
    /* flex-wrap: wrap; */ /* MODIFIÉ: Retiré pour forcer la même ligne */
}

.df-session-date-clickable {
    font-weight: 600;
    color: #5e4682; /* (Sera écrasé par style inline) */
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.95em;
    background-color: rgba(94, 70, 130, 0.05); /* (Sera écrasé par style inline) */
    padding: 4px 8px;
    border-radius: 4px;
    transition: background-color 0.2s, color 0.2s;
}
.df-session-date-clickable:hover {
    background-color: rgba(94, 70, 130, 0.1); /* (Sera écrasé par style inline en JS/PHP) */
    filter: brightness(1.1); /* Ajout d'un filtre pour le survol dynamique */
}
.df-session-date-clickable svg {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    stroke: #5e4682; /* (Sera écrasé par style inline) */
}

/* (v1.16.60) Tag pour Interne/Mixte/Externe */
.df-session-modality-tag {
    font-size: 0.85em;
    font-weight: 600;
    padding: 4px 8px;
    border-radius: 4px;
    color: #333;
    background-color: #f0f0f0;
    text-transform: capitalize;
}


.df-session-meta-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    font-size: 0.9em;
    color: #555;
    border-bottom: 1px solid #eee;
    padding-bottom: 15px;
    margin-bottom: 15px;
}
.df-meta-item {
    background: #f4f4f4;
    border-radius: 4px;
    padding: 5px 10px;
    flex-grow: 1;
    text-align: center;
    border: 1px solid #e0e0e0;
}
.df-meta-item strong {
    display: block;
    font-size: 0.85em;
    color: #777;
    text-transform: uppercase;
    margin-bottom: 2px;
}
.df-meta-item span {
    font-weight: 600;
    color: #333;
}

/* Styles pour les tags de stagiaires */
.df-session-trainees strong { 
    display: block; 
    margin-bottom: 10px; 
}
.df-session-trainees ul { 
    list-style-type: disc; 
    padding-left: 20px; 
    margin: 0; 
}
.df-session-trainees li { 
    font-size: 0.9em; 
}

.df-trainee-tag-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
/* (v1.16.61) Amélioration lisibilité */
.df-trainee-tag {
    background: #fdfdfd;
    border: 1px solid #e0e0e0;
    border-left: 4px solid #5e4682; /* (Sera écrasé par style inline) */
    border-radius: 4px;
    padding: 6px 12px;
    text-decoration: none;
    color: #333; /* (Modifié v1.17.16) Couleur par défaut */
    font-size: 0.9em;
    font-weight: 600; /* Plus lisible */
    transition: all 0.2s;
}
.df-trainee-tag:hover {
    background: #f9f9f9;
    border-color: #ccc;
    /* (v1.17.15) Retrait : la couleur inline doit persister */
    /* border-left-color: #5e4682; */ 
    color: #000;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}

/* Styles pour le détail stagiaire */
.df-trainee-link {
    color: #333; /* (Modifié v1.17.16) Couleur par défaut */
    text-decoration: none; /* (Modifié v1.17.15) Retrait du soulignement */
    cursor: pointer;
    /* (v1.17.16) Transition pour la couleur */
    transition: color 0.2s;
}
.df-trainee-link:hover {
    /* (Modifié v1.17.22) Utilise la variable CSS définie en inline, avec un fallback */
    color: var(--trainee-hover-color, #5e4682);
}

.df-back-to-session,
.df-back-to-trainee {
    display: inline-block;
    margin-bottom: 15px;
    color: #5e4682;
    text-decoration: none;
    font-size: 0.9em;
}
.df-back-to-session:hover,
.df-back-to-trainee:hover {
    text-decoration: underline;
}

.df-trainee-title {
    margin-top: 0;
    margin-bottom: 5px;
}
/* (v1.16.35) Style du lien entreprise */
a.df-trainee-company-link {
    text-decoration: none;
}
.df-trainee-company-subtitle {
    display: block;
    font-size: 0.95em;
    font-weight: 500;
    color: #777;
    margin-top: -5px;
    margin-bottom: 15px;
    transition: color 0.2s;
}
a.df-trainee-company-link:hover .df-trainee-company-subtitle {
    color: #5e4682;
}

.df-trainee-session-list { 
    margin-top: 15px;
}
.df-trainee-session-list h4 {
    font-size: 1.1em;
    margin-top: 15px;
    margin-bottom: 10px;
    border-bottom: 1px solid #eee;
    padding-bottom: 5px;
}

/* Tiroir sessions passées */
.df-past-sessions-toggle .df-toggle-link {
    text-decoration: none;
    color: inherit;
    display: block;
}
.df-past-sessions-toggle .df-toggle-link:hover h4 {
    color: #5e4682;
}
.df-past-sessions-toggle .df-toggle-link h4 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px; 
    transition: color 0.2s;
}
.df-past-sessions-toggle .df-toggle-link h4 span {
    display: inline-block;
    transition: transform 0.3s;
    font-size: 1.2em;
}
/* CORRECTION: Appliquer la rotation uniquement au dernier span (la flèche) */
.df-past-sessions-toggle .df-toggle-link h4 span.is-open:last-child {
    transform: rotate(90deg);
}
.df-past-sessions-content {
    overflow: hidden;
}

/* (v1.16.64) Bloc Inscription */
.df-session-registration {
    margin-top: 20px;
    border-top: 1px solid #eee;
    padding-top: 15px;
}
.df-session-registration .df-toggle-link {
    text-decoration: none;
    color: inherit;
    display: block;
}
.df-session-registration .df-toggle-link:hover h4 {
    /* (v1.16.69) Changement de style au survol */
    color: #fff;
    filter: brightness(1.15);
}
.df-session-registration .df-toggle-link h4 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 0; /* Ajustement */
    margin-bottom: 0; /* Ajustement */
    /* (v1.16.69) Style "bouton" pour le tiroir */
    background-color: #5e4682; /* (v1.16.70) Couleur par défaut, sera écrasée par JS */
    color: #fff;
    padding: 10px 15px;
    border-radius: 4px;
    transition: color 0.2s, background-color 0.2s, filter 0.2s;
}
.df-session-registration .df-toggle-link h4 span {
    display: inline-block;
    transition: transform 0.3s;
    font-size: 1.2em;
}
/* CORRECTION: Appliquer la rotation uniquement au dernier span (la flèche) */
.df-session-registration .df-toggle-link h4 span.is-open:last-child {
    transform: rotate(90deg);
}

.df-registration-drawer {
    overflow: hidden;
    padding-top: 15px; /* Marge interne quand ouvert */
}
.df-registration-form-group {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.df-registration-form-group label {
    font-weight: bold;
    font-size: 0.9em;
}
.df-registration-form-group textarea {
    width: 100%;
    min-height: 100px;
    font-family: inherit;
    font-size: 0.95em;
    /* (v1.17.15) Style pour correspondre aux filtres */
    padding: 6px 8px;
    border-radius: 4px;
    border: 1px solid #ccc;
}
.df-registration-form-group button {
    align-self: flex-start; /* Aligner le bouton à gauche */
}
/* (v1.17.08) Style moderne pour le bouton de soumission (couleur via JS) */
/* (Modifié v1.17.15) Harmonisation du style */
.df-registration-submit {
    background-color: #5e4682; /* Couleur par défaut (via JS) */
    border-color: #5e4682; /* Couleur par défaut (via JS) */
    color: #fff !important;
    transition: filter 0.2s;
    
    /* (v1.17.15) Harmonisation style */
    padding: 0 12px;
    height: 38px; 
    line-height: 38px;
    font-size: 0.95em; 
    font-weight: 600 !important; 
    cursor: pointer;
    border-radius: 4px;
    text-align: center;
    border: 1px solid transparent; /* (via JS) */
}
.df-registration-submit:hover {
    filter: brightness(1.15);
    color: #fff !important; /* Assurer la couleur au survol */
}
.df-registration-status {
    font-size: 0.9em;
    font-weight: bold;
    margin-top: 10px;
    padding: 8px 12px;
    border-radius: 4px;
    display: none; /* Caché par défaut */
}
.df-registration-status.is-success {
    background-color: #dff0d8;
    border: 1px solid #d6e9c6;
    color: #3c763d;
}
.df-registration-status.is-error {
    background-color: #f2dede;
    border: 1px solid #ebccd1;
    color: #a94442;
}
/* Fin (v1.16.64) */


/* Styles pour la liste moderne des sessions */
.df-trainee-session-cards {
    list-style-type: none;
    padding-left: 0;
    margin: 0;
}
.df-trainee-session-cards li {
    margin-bottom: 10px;
    /* (v1.16.33) Style du conteneur LI pour la vue Entreprise */
    background: #fdfdfd;
    border: 1px solid #e0e0e0;
    border-radius: 5px;
    overflow: hidden;
    transition: box-shadow 0.2s, border-color 0.2s;
}
.df-trainee-session-cards li:hover {
    box-shadow: 0 4px 10px rgba(0,0,0,0.05);
    border-color: #ccc;
}

.df-trainee-session-cards a.df-trainee-session-link {
    display: flex;
    align-items: stretch;
    text-decoration: none;
    color: #333;
    /* (v1.16.33) Retirer les bordures/bg du lien, ils sont sur le LI */
    border: none;
    background: transparent;
    border-radius: 0;
    box-shadow: none;
}
.df-trainee-session-cards a.df-trainee-session-link:hover {
     /* (v1.16.33) Annuler le hover du lien, il est sur le LI */
    box-shadow: none;
    border-color: transparent;
}

.session-card-date {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 10px 15px;
    background-color: #ccc; 
    color: #fff;
    flex-shrink: 0;
    min-width: 65px; 
    /* box-sizing: border-box; (v1.17.10) Géré globalement */
    /* (v1.16.33) Assurer le radius sur le LI */
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
}
.session-card-day {
    font-size: 1.8em;
    font-weight: bold;
    line-height: 1;
}
.session-card-month {
    font-size: 0.9em;
    font-weight: 600;
    text-transform: uppercase;
}

.session-card-info {
    display: flex;
    flex-direction: column;
    justify-content: flex-start; 
    padding: 10px 15px;
    flex-grow: 1;
}

.session-card-title {
    font-size: 1em;
    font-weight: 600;
    margin-bottom: 3px;
}
.session-card-code {
    font-size: 0.85em;
    color: #777;
}

.session-card-title-group {
    display: flex;
    align-items: baseline;
    gap: 10px;
    flex-wrap: wrap; 
}
.session-card-title-group .session-card-title {
    margin-bottom: 0; 
}

/* --- NOUVEAU (Résultats Stagiaires) --- */
.df-session-result-badge { 
    font-weight: bold; 
    font-size: 0.9em; 
    margin-top: 5px; /* S'affiche sous le titre/code */
    display: inline-block;
}
.df-session-result-badge.is-passed { color: #28a745; } /* Vert */
.df-session-result-badge.is-failed { color: #dc3545; } /* Rouge */
.df-session-result-badge.is-pending { color: #6c757d; } /* Gris */
/* --- FIN NOUVEAU --- */


/* (v1.16.33) Style pour la liste des stagiaires dans la vue Entreprise */
.session-card-info-trainees {
    padding: 10px 15px;
    background: #f7f7f7; /* Fond gris clair */
    border-top: 1px solid #e0e0e0;
}
.session-card-info-trainees .df-trainee-tag-list-compact {
    margin-top: 0; 
    gap: 5px; 
}
.session-card-info-trainees .df-trainee-tag-list-compact .df-trainee-tag {
    font-size: 0.8em; 
    padding: 3px 6px;
    /* (v1.16.61) Cohérence style */
    border-left-width: 3px;
    font-weight: 500;
}


/* ====================================================== */
/* --- BLOC CORRIGÉ (Vue "Détail du Jour") --- */
/* ====================================================== */
.df-day-detail-card h3 { 
    margin-top: 0; 
    font-size: 1.3em; 
    margin-bottom: 15px; 
}
.df-day-detail-card .df-trainee-session-list p {
    font-size: 0.9em;
}

/* 1. Force le conteneur <a> à utiliser flex (comme dans la vue Stagiaire) */
.df-day-detail-card .df-trainee-session-cards a.df-trainee-session-link {
    display: flex;
    align-items: stretch;
    text-decoration: none;
    color: #333;
    border: none;
    background: transparent;
    border-radius: 0;
    box-shadow: none;
}
.df-day-detail-card .df-trainee-session-cards a.df-trainee-session-link:hover {
    box-shadow: none;
    border-color: transparent;
}

/* 2. Restaure la taille de la boîte de date (que nous avons remplie en JS) 
.df-day-detail-card .session-card-date {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 10px 15px;
    flex-shrink: 0; /* Empêche la date de rétrécir 
    min-width: 65px; /* Donne une largeur fixe 
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
    
    /* (Propriétés de l'ancien sélecteur .df-day-detail-card .session-card-date) 
    color: #fff; /* Assure que le texte de la date est blanc 
}*/

/* 3. Assure que le bloc d'info prend la place restante */
.df-day-detail-card .session-card-info {
    flex-grow: 1; /* Prend le reste de la largeur */
    /* (Propriétés de l'ancien sélecteur .session-card-info) */
    display: flex;
    flex-direction: column;
    justify-content: flex-start; 
    padding: 10px 15px;
}

/* 4. S'assurer que les LI ont la bonne bordure */
.df-day-detail-card .df-trainee-session-cards li {
    border: 1px solid #e0e0e0;
}
/* --- FIN DE LA CORRECTION --- */


/* Grille de sessions liées */
.df-session-related-container {
    margin-top: 20px;
}
.df-related-sessions h4 {
    margin-top: 0;
    margin-bottom: 10px;
    font-size: 1.1em;
}
.df-related-sessions ul {
    list-style-type: none;
    padding: 0;
    margin: 0;
    border-top: 1px solid #eee;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding-top: 10px;
}
.df-related-sessions li {
    /* (v1.16.33) Retiré flex-grow, min-width */
    border-bottom: none;
}
/* (v1.16.33) Nouveau style pour les liens liés */
.df-related-sessions a.df-related-session-item {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 50px;
    width: 60px; /* Largeur fixe */
    padding: 0; /* Géré par les enfants */
    text-decoration: none;
    font-size: 0.9em;
    font-weight: bold;
    /* (v1.16.57) Correction: La couleur doit être sur le span */
    border-radius: 4px;
    text-align: center;
    transition: filter 0.2s;
    overflow: hidden; /* Pour les coins arrondis */
    background: transparent; /* Le fond est sur l'enfant */
}
.df-related-sessions a.df-related-session-item:hover {
    background-color: transparent; 
    filter: brightness(1.15); 
}
.df-related-date {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    background-color: #5e4682; /* Fallback */
    color: #fff; /* (v1.16.57) Couleur appliquée ici */
}
.df-related-day {
    font-size: 1.4em;
    font-weight: 700;
    line-height: 1;
}
.df-related-month {
    font-size: 0.8em;
    text-transform: uppercase;
}
/* Fin (v1.16.33) */


@media (max-width: 960px) { 
    .df-calendar-layout {
        /* (v1.17.09) Passage à 1 colonne */
        grid-template-columns: 1fr; 
    }
    .df-calendar-sidebar {
        position: relative; 
        top: auto;
        margin-top: 20px;
    }
    .df-calendar-nav { 
        flex-direction: row; 
        flex-wrap: wrap;
    }
    .df-nav-group select {
        min-width: 180px; 
        /*width: auto;*/
        font-size: 0.9em;
    }
    /* (v1.16.44) S'assurer que les groupes ont une taille de base */
    .df-nav-group {
        min-width: 180px;
    }

    /* (v1.18.0) Ajustement du bandeau de connexion pour tablettes */
    .df-public-login-banner {
        max-width: 100%; /* Prend toute la largeur */
        margin-right: 0;
        margin-left: 0;
    }
    .df-login-main-row {
        flex-wrap: wrap; /* Permet aux champs de passer à la ligne si pas assez de place */
    }
}

@media (max-width: 768px) {
    /* (v1.17.10) Réduire la marge du wrapper pour éviter le débordement */
    .df-calendar-wrapper {
        margin: 10px auto;
    }
    
    .df-calendar-nav { 
        flex-direction: column; 
        align-items: stretch; 
    }
    /* (v1.17.08) Mettre la recherche en premier */
    .df-nav-group-search {
        order: -1;
    }

    /* (v1.17.09) Masquer la grille avec !important */
    #df-calendar-grid,
    #df-calendar-current-month-title {
        display: none !important;
    }
    
    .df-nav-group select { 
        min-width: 100%; 
    }
    
    /* (v1.17.11) Correction : Remplacer min-width: 100% par 0 */
    .df-nav-group {
        min-width: 0;
    }
    .df-nav-group-search {
        min-width: 0;
    }
    
    .df-calendar-day { 
        min-height: 80px; 
        font-size: 0.8em; 
    }
    .df-session-item { 
        font-size: 0.75em; 
        padding: 3px 5px; 
        height: 2.2em; 
    } 
    /* Grille 5+2 jours mobile */
    .df-calendar-grid { 
        grid-template-columns: 30px repeat(5, 1fr) 0.5fr 0.5fr; 
    }
    .df-calendar-week-header, .df-calendar-week-number { 
        writing-mode: horizontal-tb; 
        transform: none; 
        padding: 5px 2px; 
        font-size: 0.7em; 
    }
    
    .df-related-sessions li {
        /* (v1.16.33) Ajustement taille mobile */
        width: 50px;
    }
    .df-related-sessions a.df-related-session-item {
        height: 45px;
        width: 50px;
    }
    .df-related-day {
        font-size: 1.2em;
    }
    .df-related-month {
        font-size: 0.7em;
    }

    /* (v1.18.0) Styles du bandeau de connexion sur mobile */
    .df-public-login-banner {
        margin-top: 10px;
        margin-bottom: 10px;
        padding: 10px;
    }
    .df-login-main-row {
        /* (v1.18.0) CORRECTION : Commenté pour forcer la ligne unique */
        /* flex-direction: column; */
        gap: 5px;
    }
    .df-login-field.df-login-submit {
        flex-grow: 1; /* Le bouton prend la place restante */
    }
    .df-login-field.df-login-submit button {
        width: 100%;
    }
}


/* ================================================ */
/* (v1.18.0) NOUVEAU: Styles pour le bandeau de connexion public COMPACT */
/* ================================================ */

.df-public-login-banner {
    background: #f9f9f9;
    border: 1px solid #e0e0e0;
    border-radius: 5px;
    padding: 10px 15px;
    margin-bottom: 20px;
    
    /* (v1.18.0) Alignement à droite, largeur de la sidebar */
    max-width: 400px;
    margin-left: auto;
    margin-right: 0;
}

/* Ligne d'en-tête (Titre + Lien MDP) */
.df-login-header-row {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 8px;
}
.df-login-prompt {
    font-size: 1.1em;
    font-weight: 600;
    color: #333;
}
.df-login-links {
    text-align: right;
}
.df-login-links a {
    font-size: 0.85em;
    color: #5e4682;
    text-decoration: none;
}
.df-login-links a:hover {
    text-decoration: underline;
}

/* Ligne principale (Champs + Bouton) */
.df-login-main-row {
    display: flex;
    flex-wrap: nowrap; /* Force la ligne unique */
    align-items: stretch;
    gap: 8px;
}
.df-login-field {
    display: flex;
    flex-direction: column;
    flex-grow: 1; /* Les champs grandissent */
    flex-basis: 0; /* Permet à flex-grow de fonctionner */
}
/* (v1.18.0) Style compact pour les champs */
.df-login-field input[type="text"],
.df-login-field input[type="password"] {
    padding: 6px 8px;
    border-radius: 4px;
    border: 1px solid #ccc;
    height: 32px; /* Plus petit */
    font-size: 0.9em;
    width: 100%;
}
.df-login-field.df-login-submit {
    flex-grow: 0; /* Le bouton ne grandit pas */
    flex-shrink: 0; /* Le bouton ne rétrécit pas */
}
/* (v1.18.0) Style compact pour le bouton */
.df-login-submit button {
    padding: 0 12px;
    height:32px;
    font-size: 0.9em; /* Plus petit */
    font-weight: 600 !important; 
    cursor: pointer;
    border-radius: 4px;
    background: #5e4682;
    border-color: #5e4682;
    color: #fff;
    white-space: nowrap; /* Empêche le texte du bouton de passer à la ligne */
}
.df-login-submit button:hover {
    background: #135e96;
    border-color: #135e96;
}

/* (v1.18.0) Style pour les messages d'erreur dans le bandeau */
.df-login-error {
    font-size: 0.9em;
    font-weight: bold;
    color: #a94442;
    background: #f2dede;
    border: 1px solid #ebccd1;
    padding: 8px 12px;
    border-radius: 4px;
    flex-basis: 100%; /* Prend toute la largeur */
    margin-bottom: 8px; /* Espace si erreur s'affiche */
    text-align: center;
}

/* (v1.18.0) S'assurer que le formulaire gère les erreurs */
.df-public-login-form {
    display: flex;
    flex-wrap: wrap; /* Permet à l'erreur de prendre 100% et de repousser le reste */
    align-items: flex-start;
}
/* Forcer les en-têtes et les lignes principales à prendre 100% de largeur */
.df-login-header-row,
.df-login-main-row {
    flex-basis: 100%;
}

/* ================================================ */
/* NOUVEAU (Tâche 3) - Styles de Pagination         */
/* ================================================ */

.df-pagination-controls {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 15px;
    padding-top: 10px;
    border-top: 1px solid #eee;
}
.df-pagination-info {
    font-size: 0.9em;
    font-weight: 600;
    color: #555;
}
.df-pagination-controls .button {
    /* Style des boutons Préc/Suiv */
    padding: 0 10px;
    height: 32px; 
    line-height: 30px;
    font-size: 0.9em; 
    font-weight: 600; 
    cursor: pointer;
    background-color: #f9f9f9;
    border: 1px solid #ccc;
    color: #5e4682;
    transition: background-color 0.2s, border-color 0.2s;
}
.df-pagination-controls .button:hover {
    background-color: #f1f1f1;
    border-color: #999;
}
.df-pagination-controls .button:disabled {
    background-color: #fdfdfd;
    border-color: #f0f0f0;
    color: #bbb;
    cursor: not-allowed;
    opacity: 0.7;
}