/* --- MAIN STYLE --- */
/* Ce fichier importe tous les autres fichiers CSS. */

@import url("base.css");
@import url("layout.css");
@import url("ui-elements.css");
@import url("data-views.css");
@import url("modals.css");
@import url("components/bascule-card.css");
@import url("components/modal-badge.css");
@import url("components/step-counter.css");
@import url("components/pale-circle-marker.css");
@import url("components/pale-circle-marker.css");
@import url("components/step-chkbx.css");
@import url("components/step-chx_thm.css");
@import url("components/step-chkbx_bord.css");
@import url("components/quiz3.css");
@import url("components/step-buttons.css");
@import url("components/linked-modal-button.css");
@import url("components/step-text_modal.css");

/* --- Menu Links --- */
.menu-link-sm {
    padding-left: 1.5rem; /* 24px indentation */
    padding-top: 4px;
    padding-bottom: 4px;
    font-size: 0.9em;
    margin-bottom: 2px;
    display: block;
    text-decoration: none;
    color: #475569; /* slate-600 */
    transition: background-color 0.2s ease, color 0.2s ease;
}

.menu-link-sm:hover {
    background-color: #f1f5f9; /* slate-100 */
    color: #0f172a; /* slate-900 */
}

/* --- Limite de hauteur et scroll pour les sous-menus du panneau latéral --- */

/* Cible toutes les listes de navigation dans le panneau */
#side-panel nav[id$="-links-nav"] {
    /*
     * Calcule la hauteur maximale pour environ 5 éléments.
     * Cette valeur peut être ajustée.
     * (hauteur approximative d'un lien + espace) * 5
     * (24px + 8px) * 5 = 160px
     */
    max-height: 160px;
    overflow-y: auto; /* Affiche une barre de défilement si le contenu dépasse */
    padding-right: 8px; /* Ajoute un petit espace pour que la barre de scroll ne colle pas au texte */
}

/* Style optionnel pour la barre de défilement (WebKit browsers comme Chrome/Safari) */
#side-panel nav[id$="-links-nav"]::-webkit-scrollbar {
    width: 6px;
}

#side-panel nav[id$="-links-nav"]::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 3px;
}

#side-panel nav[id$="-links-nav"]::-webkit-scrollbar-thumb {
    background: #ccc;
    border-radius: 3px;
}

#side-panel nav[id$="-links-nav"]::-webkit-scrollbar-thumb:hover {
    background: #aaa;
}
/* --- Responsive Video Container --- */
.video-container {
    position: relative;
    overflow: hidden;
    width: 100%;
    padding-top: 56.25%; /* 16:9 Aspect Ratio */
    margin: 1rem 0; /* Add some vertical space */
}

.video-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

.step-card-content img {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

/* Neutralise le style du lien dans le titre principal */
#background-title a.title-as-link {
    color: inherit; /* Hérite de la couleur de son parent h1 */
    text-decoration: none; /* Pas de soulignement */
    cursor: pointer; /* Garde le curseur main */
}

/* Optionnel : supprime le changement de couleur au survol si nécessaire */
#background-title a.title-as-link:hover {
    color: inherit;
    text-decoration: none;
}