/**
 * Thème DSFR pour LimeSurvey
 * Système de Design de l'État Français
 *
 * Ce thème utilise DSFR-Connect Bootstrap pour adapter LimeSurvey au DSFR
 * Documentation DSFR : https://www.systeme-de-design.gouv.fr/
 * DSFR-Connect : https://dsfr-connect.rame.fr/
 
 *
 * RÈGLE DE PROPRIÉTÉ (revue 2026-06, #30) : un composant = un seul
 * fichier. theme.css possède : reset/neutralisation Bootstrap, layout
 * général (header fixe, conteneurs), formulaires de base, tableaux
 * (structure), print. Toute surcharge fine de composant DSFR vit dans
 * custom.css (chargé après). Ne pas redéfinir ici un sélecteur déjà
 * stylé dans custom.css.
*/

/* Couche de cascade (issue #41) — ordre déclaré dans dsfr.min.css :
   overrides, theme, dsfr, custom. Tout le fichier vit dans `theme`. */
/* Déclaration d'ordre des couches AVANT toute création implicite : la
   première occurrence d'un nom de couche fige sa position. Ce fichier
   charge avant dsfr.min.css — sans cette ligne, `theme` serait déclarée
   première et l'ordre voulu serait perdu. */
@layer overrides, theme, dsfr, custom;

@layer theme {


/* ============================================
   IMPORTS DSFR NATIF
   ============================================ */

/*
 * DSFR natif - RESSOURCES LOCALES
 *
 * Les ressources DSFR sont hébergées localement dans les dossiers du thème
 * pour garantir l'autonomie du thème et éviter les dépendances externes.
 * - CSS: ./css/*.min.css
 * - JS: ./js/*.min.js
 * - Fonts: ./fonts/*.woff2
 * - Icons SVG: ./icons/**\/*.svg
 *
 * NOTE: On N'utilise PAS DSFR-Connect car nos templates sont déjà
 * en DSFR natif (fr-header, fr-btn, etc.). DSFR-Connect est fait
 * pour convertir les classes Bootstrap, mais on a déjà tout converti.
 *
 * Pour mettre à jour DSFR, lancer ./scripts/update-dsfr.sh (voir CONTRIBUTING.md).
 *
 * Les fichiers DSFR suivants sont chargés automatiquement par LimeSurvey
 * (déclarés dans config.xml, dans l'ordre):
 * 1. dsfr.min.css - CSS principal DSFR (variante sans data-URI depuis DSFR 1.13)
 * 2. icons.min.css - Icônes DSFR (références SVG)
 * 3. dsfr-grid-helpers.css - Helpers de grille personnalisés
 * 4. theme.css - Ce fichier (styles personnalisés)
 * 5. custom.css - Surcharges + linéarisation tableaux (PRIORITÉ ABSOLUE)
 */

/* ============================================
   VARIABLES DSFR
   ============================================ */

:root {
    /*
     * Variables DSFR natives - supportent automatiquement le mode sombre
     * Ne pas redéfinir les couleurs DSFR - utiliser les design tokens natifs
     * Documentation: https://www.systeme-de-design.gouv.fr/fondamentaux-techniques/design-tokens
     */

    /* Espacements */
    --sp-1: 0.25rem;
    --sp-2: 0.5rem;
    --sp-3: 1rem;
    --sp-4: 1.5rem;
    --sp-5: 2rem;
    --sp-6: 3rem;
}

/* ============================================
   NEUTRALISATION BOOTSTRAP
   ============================================ */

/*
 * Le thème hérite de vanilla qui charge Bootstrap.
 * On neutralise les classes Bootstrap pour éviter les conflits avec DSFR.
 */

/* Désactiver le fond gris de Bootstrap */
.bg-light {
    background-color: var(--background-default-grey) !important;
}

/* Neutraliser navbar Bootstrap (on utilise fr-header) */
.navbar {
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
}

.navbar-light,
.navbar-expand-md {
    background-color: transparent !important;
}

/* Neutraliser les containers Bootstrap */
.container,
.container-fluid {
    padding-left: 0;
    padding-right: 0;
    max-width: 100%;
}

/* Reset des boutons Bootstrap pour laisser DSFR gérer */
.btn:not(.fr-btn) {
    all: unset;
}

/* Neutraliser form-control de Bootstrap sur les inputs/textarea */
input[type="text"].form-control,
input[type="email"].form-control,
input[type="number"].form-control,
input[type="tel"].form-control,
input[type="url"].form-control,
input[type="date"].form-control,
input[type="time"].form-control,
input[type="search"].form-control,
input[type="password"].form-control,
textarea.form-control,
.form-control {
    border: none !important;
    box-shadow: inset 0 -2px 0 0 var(--border-plain-grey) !important;
    background-color: var(--background-contrast-grey) !important;
    border-radius: 0.25rem 0.25rem 0 0 !important;
}

/* Neutraliser form-control au focus */
input[type="text"].form-control:focus,
input[type="email"].form-control:focus,
input[type="number"].form-control:focus,
input[type="tel"].form-control:focus,
input[type="url"].form-control:focus,
input[type="date"].form-control:focus,
input[type="time"].form-control:focus,
input[type="search"].form-control:focus,
input[type="password"].form-control:focus,
textarea.form-control:focus,
.form-control:focus {
    background-color: var(--background-contrast-grey) !important;
    box-shadow: inset 0 -2px 0 0 var(--border-plain-grey) !important;
    outline: 2px solid var(--border-action-high-blue-france) !important;
    outline-offset: 2px !important;
    border: none !important;
}

/* ============================================
   RESET & BASE
   ============================================ */

* {
    box-sizing: border-box;
}

html {
    /* 100% (= 16px par défaut) : respecte le réglage de taille de police
       du navigateur (RGAA), contrairement à une valeur en px figée. */
    font-size: 100%;
    background-color: var(--background-default-grey);
}

body {
    font-family: "Marianne", Arial, sans-serif !important;
    font-size: 1rem;
    line-height: 1.5;
    color: var(--text-default-grey);
    background-color: var(--background-default-grey) !important;
    margin: 0;
    padding: 0;
}

/* Assurer que le body et article ont le fond par défaut */
body > article {
    background-color: var(--background-default-grey) !important;
}
/* Assurer que les containers DSFR sont blancs */
.fr-container {
    background-color: transparent;
}

/* ============================================
   HEADER DSFR (Navigation Bar)
   ============================================ */

/* Header principal */
#survey-nav.navbar {
    background-color: var(--background-default-grey) !important;
    border-bottom: 1px solid var(--border-default-grey) !important;
    box-shadow: 0 8px 8px 0 rgba(0, 0, 18, 0.1), 0 8px 16px -16px rgba(0, 0, 18, 0.32);
    min-height: 5rem;
    padding: 0 !important;
}

/* Container du header */
#survey-nav .container-fluid {
    max-width: 78rem;
    margin: 0 auto;
    padding: 0 1rem;
}

/* Logo / Brand */
#survey-nav .navbar-brand {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--text-action-high-blue-france) !important;
    padding: 1.5rem 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

#survey-nav .logo-container img {
    max-height: 3rem;
    width: auto;
}

/* Bouton toggle mobile */
#survey-nav .navbar-toggler {
    border: 1px solid var(--border-plain-grey);
    border-radius: 0.25rem;
    padding: 0.5rem;
    background: transparent;
}

#survey-nav .navbar-toggler:focus {
    outline: 2px solid var(--border-action-high-blue-france);
    outline-offset: 2px;
    box-shadow: none;
}

/* Navigation items */
#survey-nav .navbar-nav {
    gap: 0.5rem;
}

#survey-nav .navbar-nav .nav-item {
    margin: 0;
}

#survey-nav .navbar-nav .nav-link {
    color: var(--text-default-grey) !important;
    padding: 0.75rem 1rem;
    font-weight: 500;
    text-decoration: none;
    border-radius: 0.25rem;
    transition: background-color 0.2s;
}

#survey-nav .navbar-nav .nav-link:hover,
#survey-nav .navbar-nav .nav-link:focus {
    background-color: var(--background-alt-grey);
    color: var(--text-action-high-blue-france) !important;
}

/* Dropdown menus */
#survey-nav .dropdown-menu {
    border: 1px solid var(--border-default-grey);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1);
    border-radius: 0.25rem;
    padding: 0.5rem 0;
}

#survey-nav .dropdown-item {
    padding: 0.75rem 1rem;
    color: var(--text-default-grey);
    transition: background-color 0.2s;
}

#survey-nav .dropdown-item:hover,
#survey-nav .dropdown-item:focus {
    background-color: var(--background-alt-grey);
    color: var(--text-action-high-blue-france);
}

/* ============================================
   CONTENEUR PRINCIPAL
   ============================================ */

#outerframeContainer {
    background-color: var(--background-alt-grey);
    min-height: 100vh;
    padding-top: 6rem; /* Espace pour le header fixed */
}

.container-fluid {
    max-width: 78rem;
    margin: 0 auto;
    padding: 2rem 1rem;
}
.progress {
    height: 0.5rem;
    background-color: #E3E3E3;
    border-radius: 0.25rem;
    overflow: hidden;
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.1);
}
.progress-text {
    margin-top: 0.5rem;
    font-size: 0.875rem;
    color: var(--text-mention-grey);
    text-align: center;
}

/* ============================================
   GROUPES DE QUESTIONS
   ============================================ */

.group-container,
.ls-group {
    margin-bottom: 3rem;
}

.group-name,
.ls-group-name h3 {
    font-size: 1.75rem;
    font-weight: 700;
    color: var(--text-action-high-blue-france);
    margin-bottom: 1rem;
    line-height: 1.25;
}

.group-description,
.ls-group-description {
    font-size: 1rem;
    color: var(--text-mention-grey);
    margin-bottom: 2rem;
    line-height: 1.5;
}

/* ============================================
   QUESTIONS
   ============================================ */

.question-container,
.ls-question,
.question-wrapper {
    background-color: var(--background-raised-grey);
    padding: 2rem;
    margin-bottom: 1.5rem;
    border-radius: 0.5rem;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
}

.question-text,
.ls-question-text,
.questiontext {
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--text-label-grey);
    margin-bottom: 1rem;
    line-height: 1.5;
}

.question-help,
.ls-question-help,
.question-help-text {
    font-size: 0.875rem;
    color: var(--text-mention-grey);
    margin-top: 0.5rem;
    font-style: italic;
}

.question-mandatory,
.asterisk {
    color: var(--error-425-625);
    font-weight: 700;
    margin-left: 0.25rem;
}

/* ============================================
   VALIDATION MESSAGES - DSFR STYLE
   ============================================ */

/* Messages de validation (info) - style DSFR */
.question-valid-container {
    font-size: 0.875rem;
    line-height: 1.5;
    margin-top: 0.25rem;
    color: var(--text-mention-grey);
}

/* Messages d'erreur EM - style DSFR */
.ls-em-error,
.em_num_answers {
    font-size: 0.875rem;
    line-height: 1.5;
    margin-top: 0.25rem;
    color: var(--error-425-625);
    font-weight: 400;
}

/* État d'erreur sur l'input */
input.error,
textarea.error,
select.error,
.fr-input--error,
input.fr-input--error,
textarea.fr-input--error {
    border-color: var(--error-425-625) !important;
    box-shadow: inset 0 -2px 0 0 var(--error-425-625) !important;
}

/* État valide sur l'input */
.fr-input--valid,
input.fr-input--valid,
textarea.fr-input--valid {
    box-shadow: inset 0 -2px 0 0 var(--success-425-625) !important;
}


/* ============================================
   INPUTS & FORM CONTROLS (DSFR)
   ============================================ */

/*
 * Neutralisation Bootstrap pour les champs de formulaire
 * Bootstrap ajoute des bordures et styles qui entrent en conflit avec DSFR
 */
.form-control,
input.form-control,
textarea.form-control,
select.form-control {
    all: unset;
    display: block;
    width: 100%;
}

/*
 * Styles DSFR pour les champs input/textarea
 * Conformément aux spécifications DSFR v1.11
 * https://www.systeme-de-design.gouv.fr/
 */

/* Inputs texte - État normal */
input[type="text"],
input[type="email"],
input[type="number"],
input[type="tel"],
input[type="url"],
input[type="date"],
input[type="time"],
input[type="search"],
input[type="password"],
textarea {
    /* Fond gris DSFR */
    /* DISABLED - Let DSFR thead background-image show through */
    /*     background-color: var(--background-contrast-grey); */

    /* Bordure uniquement en bas (gris foncé/noir) */
    border: none;
    border-radius: 0.25rem 0.25rem 0 0;
    box-shadow: inset 0 -2px 0 0 var(--border-plain-grey);

    /* Typographie */
    color: var(--text-default-grey);
    font-family: "Marianne", Arial, sans-serif;
    font-size: 1rem;
    line-height: 1.5rem;

    /* Espacement */
    padding: 0.5rem 1rem;

    /* Layout */
    display: block;
    width: 100%;
    max-height: 2.5rem;
}

/* Textarea spécifique */
textarea {
    min-height: 5rem;
    max-height: none;
    resize: vertical;
}

/* État focus - CRITIQUE pour DSFR */
input[type="text"]:focus,
input[type="email"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="url"]:focus,
input[type="date"]:focus,
input[type="time"]:focus,
input[type="search"]:focus,
input[type="password"]:focus,
textarea:focus {
    /* IMPORTANT: Le fond gris doit RESTER au focus */
    background-color: var(--background-contrast-grey) !important;

    /* La bordure en bas reste grise (ne change PAS en bleu) */
    box-shadow: inset 0 -2px 0 0 var(--border-plain-grey);

    /* Outline DSFR pour la prise de focus (accessibilité) - C'EST ÇA qui devient bleu */
    outline: 2px solid var(--border-action-high-blue-france);
    outline-offset: 2px;
}

/* État disabled */
input[type="text"]:disabled,
input[type="email"]:disabled,
input[type="number"]:disabled,
input[type="tel"]:disabled,
input[type="url"]:disabled,
input[type="date"]:disabled,
input[type="time"]:disabled,
input[type="search"]:disabled,
input[type="password"]:disabled,
textarea:disabled {
    background-color: var(--background-disabled-grey);
    color: var(--text-disabled-grey);
    box-shadow: inset 0 -2px 0 0 var(--border-disabled-grey);
    cursor: not-allowed;
}

/* Placeholder style DSFR */
input::placeholder,
textarea::placeholder {
    color: var(--text-mention-grey);
    font-style: italic;
    opacity: 1;
}

/* ============================================
   SELECT / LISTE DÉROULANTE (DSFR)
   ============================================ */

/*
 * Styles DSFR pour les <select>
 * https://www.systeme-de-design.gouv.fr/composants-et-modeles/composants/liste-deroulante
 */

/* Select - État normal */
select,
.fr-select,
select.form-control {
    /* Fond gris DSFR */
    /* DISABLED - Let DSFR thead background-image show through */
    /*     background-color: var(--background-contrast-grey); */

    /* Bordure uniquement en bas (gris foncé/noir) */
    border: none;
    border-radius: 0.25rem 0.25rem 0 0;
    box-shadow: inset 0 -2px 0 0 var(--border-plain-grey);

    /* Typographie */
    color: var(--text-default-grey);
    font-family: "Marianne", Arial, sans-serif;
    font-size: 1rem;
    line-height: 1.5rem;

    /* Espacement */
    padding: 0.5rem 1rem;

    /* Layout */
    display: block;
    width: 100%;
}

/* Select - État focus */
select:focus,
.fr-select:focus,
select.form-control:focus {
    /* Le fond gris reste */
    background-color: var(--background-contrast-grey) !important;

    /* La bordure reste grise/noire */
    box-shadow: inset 0 -2px 0 0 var(--border-plain-grey);

    /* Outline bleu pour la prise de focus */
    outline: 2px solid var(--border-action-high-blue-france);
    outline-offset: 2px;
}

/* Select - État disabled */
select:disabled,
.fr-select:disabled {
    background-color: var(--background-disabled-grey);
    color: var(--text-disabled-grey);
    box-shadow: inset 0 -2px 0 0 var(--border-disabled-grey);
    cursor: not-allowed;
}

/* Groupe de select DSFR */
.fr-select-group {
    position: relative;
    margin-bottom: 1.5rem;
}

.fr-select-group:last-child {
    margin-bottom: 0;
}

/* ============================================
   MESSAGES & VALIDATION DSFR
   ============================================ */

/*
 * Styles DSFR pour les messages de validation
 * https://www.systeme-de-design.gouv.fr/composants-et-modeles/composants/champ-de-saisie
 */

/* Groupe de messages */
.fr-messages-group {
    margin-top: 0.25rem;
    display: block;
}

/* Message individuel */
.fr-message {
    font-size: 0.75rem;
    line-height: 1.25rem;
    margin: 0.25rem 0;
    padding: 0;
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
}

/* Message info (bleu) */
.fr-message--info::before {
    content: "";
    flex-shrink: 0;
    width: 1rem;
    height: 1rem;
    background-image: url("../files/icons/inline/5653463befa6.svg");
    background-size: contain;
    background-repeat: no-repeat;
    margin-top: 0.125rem;
}

/* Message succès (vert) */
.fr-message--valid {
    color: var(--success-425-625);
}

.fr-message--valid::before {
    content: "";
    flex-shrink: 0;
    width: 1rem;
    height: 1rem;
    background-image: url("../files/icons/inline/e4ce7b2083b6.svg");
    background-size: contain;
    background-repeat: no-repeat;
    margin-top: 0.125rem;
}

/* Message erreur (rouge) */
.fr-message--error {
    color: var(--error-425-625);
}

.fr-message--error::before {
    content: "";
    flex-shrink: 0;
    width: 1rem;
    height: 1rem;
    background-image: url("../files/icons/inline/38b44148d105.svg");
    background-size: contain;
    background-repeat: no-repeat;
    margin-top: 0.125rem;
}

/* États fr-input-group --error et --valid */
/* Note: Les box-shadow sont gérées par DSFR natif pour éviter les conflits */
/* Les règles --error et --valid sont désactivées pour laisser DSFR gérer nativement les bordures */

/* Label hint text */
.fr-label .fr-hint-text {
    display: block;
    font-size: 0.75rem;
    line-height: 1.25rem;
    color: var(--text-mention-grey);
    font-weight: 400;
    margin-top: 0.25rem;
}

/* ============================================
   RADIO BUTTONS (DSFR)
   ============================================ */

/* Container pour les radios */
.radio-item,
.checkbox-item,
.answer-item {
    display: flex;
    align-items: flex-start;
    margin-bottom: 0.75rem;
    position: relative;
}

/* Exception: items numériques avec grille DSFR - ne pas appliquer flex */
.answer-item.numeric-item,
.answer-item.text-item {
    display: block;
}

/* IMPORTANT: Dans les tableaux, ces classes ne doivent PAS avoir de flex/margin */
table .radio-item,
table .checkbox-item,
table .answer-item,
table td.radio-item,
table td.checkbox-item,
table td.answer-item {
    display: table-cell !important;
    margin-bottom: 0 !important;
    padding: 0.5rem !important;
    position: static !important;
}

/* ============================================
   RADIO/CHECKBOX - DSFR NATIF
   ============================================ */

/* Le DSFR gère les radio/checkbox dans .fr-radio-group et .fr-checkbox-group */
/* Aucun override nécessaire - le DSFR fait tout */

/* Dans les tableaux, centrer les inputs */
table input[type="radio"],
table input[type="checkbox"] {
    margin: 0 auto;
}
/* Laisser DSFR gérer les boutons avec classes DSFR */

.btn-primary:hover,
input[type="submit"]:hover {
    background-color: var(--background-action-high-blue-france-hover);
    box-shadow: inset 0 0 0 1px var(--background-action-high-blue-france-hover);
}

.btn-primary:active {
    background-color: var(--background-action-high-blue-france-active);
}

.btn-primary:focus {
    outline: 2px solid var(--border-action-high-blue-france);
    outline-offset: 2px;
}

.btn-primary:disabled {
    background-color: var(--background-disabled-grey);
    color: var(--text-disabled-grey) !important;
    cursor: not-allowed;
    box-shadow: inset 0 0 0 1px var(--background-disabled-grey);
}
.btn-secondary:hover,
.btn-outline:hover {
    background-color: var(--background-action-low-blue-france-hover);
}

.btn-secondary:active {
    background-color: var(--background-action-low-blue-france-active);
}

.btn-secondary:focus {
    outline: 2px solid var(--border-action-high-blue-france);
    outline-offset: 2px;
}
.btn-link:hover,
/* ============================================
/* Les boutons de navigation DSFR n'ont pas besoin de ces marges */
.fr-container .fr-btn {
    margin-top: 0 !important;
    padding-top: 0.5rem !important;
    padding-bottom: 0.5rem !important;
}

/* ============================================
   QUESTIONS À MULTIPLES ENTRÉES NUMÉRIQUES
   ============================================ */

/* Alignement horizontal des préfixes, input et suffixes */
.ls-input-group {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    width: 100%;
}

/* Préfixes et suffixes */
.ls-input-group-extra {
    flex-shrink: 0;
    font-size: 0.875rem;
    color: var(--text-mention-grey, #666);
}

/* L'input group DSFR doit prendre la largeur restante */
.ls-input-group .fr-input-group {
    flex: 1;
    min-width: 0; /* Permet au flex item de shrink en dessous de sa taille de contenu */
}

/* Sur mobile, empiler verticalement */
@media (max-width: 767.98px) {
    .ls-input-group {
        flex-direction: column;
        align-items: stretch;
        gap: 0.25rem;
    }

    .ls-input-group-extra {
        font-size: 0.75rem;
    }
}

@media (max-width: 767.98px) {
    .survey-navigation {
        flex-direction: column;
    }

    .survey-navigation button,
    .survey-navigation .btn {
        width: 100%;
    }
}
.alert::before {
    content: '';
    flex-shrink: 0;
    width: 1.5rem;
    height: 1.5rem;
    background-size: contain;
    background-repeat: no-repeat;
}

/* Info */
.alert-info {
    background-color: var(--background-contrast-info);
    border-left-color: var(--info-425-625);
    color: var(--info-425-625);
}

/* Success */
.alert-success {
    background-color: var(--background-contrast-success);
    border-left-color: var(--success-425-625);
    color: var(--success-425-625);
}

/* Warning */
.alert-warning {
    background-color: var(--background-contrast-warning);
    border-left-color: var(--warning-425-625);
    color: var(--warning-425-625);
}

/* Error/Danger */
.alert-error,
.alert-danger {
    background-color: var(--background-contrast-error);
    border-left-color: var(--error-425-625);
    color: var(--error-425-625);
}

/* ============================================
   ERREURS DE VALIDATION
   ============================================ */

.error-message,
.em_num_answers,
.ls-em-error {
    color: var(--error-425-625);
    font-size: 0.875rem;
    margin-top: 0.25rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.error-message::before,
.em_num_answers::before {
    content: '';
    width: 1rem;
    height: 1rem;
    background-image: url("../files/icons/inline/38b44148d105.svg");
    background-size: contain;
    flex-shrink: 0;
}

input.error,
textarea.error,
select.error,
.has-error input,
.has-error textarea,
.has-error select {
    border-color: var(--error-425-625);
    border-bottom-color: var(--error-425-625);
}

input.error:focus,
textarea.error:focus,
select.error:focus {
    box-shadow: inset 0 -2px 0 0 var(--error-425-625);
}
/* Footer DSFR fond par défaut (override DSFR et custom) */
footer.fr-footer,
.fr-footer {
    background-color: var(--background-default-grey) !important;
}
.modal-backdrop.show {
    opacity: 1;
}
.modal.show {
    display: block;
}
.modal-dialog {
    position: relative;
    width: auto;
    margin: 0 auto;
    max-width: 500px;
    pointer-events: none;
}
/* Carte de la modale - style DSFR */
/* Header DSFR */
.modal-title {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--text-title-grey);
    line-height: 1.5;
}
.modal-header .btn-close:hover {
    background-color: var(--background-alt-grey);
}
/* Body */
.modal-body p {
    margin-bottom: 0;
}
.modal-footer .btn {
    margin: 0;
}

/* Responsive */
@media (min-width: 576px) {
    .modal-dialog {
        max-width: 500px;
        margin: 1.75rem auto;
    }
}
.modal.show .modal-dialog {
    transform: none;
}

/* ============================================
   RESPONSIVE
   ============================================ */

@media (max-width: 767.98px) {
    body {
        font-size: 0.875rem;
    }

    .container-fluid {
        padding: 1rem 0.5rem;
    }

    .question-container {
        padding: 1rem;
    }

    .question-text {
        font-size: 1rem;
    }
}

/* ============================================
   ACCESSIBILITÉ
   ============================================ */

.sr-only,
.visually-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border-width: 0 !important;
}

.visually-hidden-focusable:focus {
    position: static !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    overflow: visible !important;
    clip: auto !important;
    white-space: normal !important;
}

/* Focus visible pour tous les éléments interactifs */
*:focus-visible {
    outline: 2px solid #0a76f6;
    outline-offset: 2px;
}

/* ============================================
   UTILITAIRES
   ============================================ */

.text-center {
    text-align: center;
}

.text-right {
    text-align: right;
}

/* Spacing utilities removed - now using DSFR utilities (fr-mb-*w, fr-mt-*w, fr-p-*w) */

/* ============================================
   CORRECTIONS TABLEAUX DSFR
   ============================================ */

/* Fond des tbody : la règle historique posait ici --background-alt-grey
   !important — en @layer, l'important de la couche theme bat ceux de
   custom, ce qui rendait IMPOSSIBLE toute correction aval et produisait
   des tableaux gris (clair) / décalés du fond de page (sombre) selon que
   la famille re-peignait ses lignes ou non (#41, revue 2026-06-12).
   Le fond unifié (transparent, hérite de la carte question) est désormais
   posé par custom.css — plus aucune déclaration de fond tbody ici. */

/* Reset du fond gris par défaut du DSFR sur tous les td */
.fr-table--bordered table tbody td {
    background-color: transparent !important;
}

/* Application manuelle de l'alternance avec les classes LimeSurvey */
/* Backgrounds removed for responsive mobile linearization */
.fr-table--bordered table tbody tr.ls-odd td,
.fr-table--bordered table tbody tr.ls-odd th,
.fr-table--bordered table tbody tr.ls-even td,
.fr-table--bordered table tbody tr.ls-even th {
    background-color: transparent !important;
}


/* ============================================
   ÉTATS D'ERREUR ET DE VALIDITÉ POUR TABLEAUX
   S'applique sur tous les écrans (pas seulement mobile)
   ============================================ */

/* États d'erreur et de validité pour les inputs dans les tableaux */
.fr-table table tbody tr td .fr-input-group .fr-input.fr-input--error,
.fr-table--bordered table tbody tr td .fr-input-group .fr-input.fr-input--error,
div[class*="fr-table"] table tbody tr td .fr-input-group .fr-input.fr-input--error,
.fr-table table tbody tr td .fr-input.fr-input--error,
.fr-table--bordered table tbody tr td .fr-input.fr-input--error,
div[class*="fr-table"] table tbody tr td .fr-input.fr-input--error,
table.radio-array tbody tr td .fr-input-group .fr-input.fr-input--error,
table.radio-array tbody tr td .fr-input.fr-input--error,
table.questions-list tbody tr td .fr-input-group .fr-input.fr-input--error,
table.questions-list tbody tr td .fr-input.fr-input--error,
table.table tbody tr td .fr-input-group .fr-input.fr-input--error,
table.table tbody tr td .fr-input.fr-input--error,
.fr-input-group--error .fr-input.fr-input--error {
    border-color: var(--error-425-625) !important;
    box-shadow: inset 0 -2px 0 0 var(--error-425-625) !important;
}

.fr-table table tbody tr td .fr-input-group .fr-input.fr-input--valid,
.fr-table--bordered table tbody tr td .fr-input-group .fr-input.fr-input--valid,
div[class*="fr-table"] table tbody tr td .fr-input-group .fr-input.fr-input--valid,
.fr-table table tbody tr td .fr-input.fr-input--valid,
.fr-table--bordered table tbody tr td .fr-input.fr-input--valid,
div[class*="fr-table"] table tbody tr td .fr-input.fr-input--valid,
table.radio-array tbody tr td .fr-input-group .fr-input.fr-input--valid,
table.radio-array tbody tr td .fr-input.fr-input--valid,
table.questions-list tbody tr td .fr-input-group .fr-input.fr-input--valid,
table.questions-list tbody tr td .fr-input.fr-input--valid,
table.table tbody tr td .fr-input-group .fr-input.fr-input--valid,
table.table tbody tr td .fr-input.fr-input--valid,
.fr-input-group--valid .fr-input.fr-input--valid {
    box-shadow: inset 0 -2px 0 0 var(--success-425-625) !important;
}

/* ============================================
   MULTIPLE NUMERIC QUESTIONS - GRID FIX
   ============================================ */

/* Neutraliser les styles de liste par défaut - UNIQUEMENT pour questions numériques */
ul.numeric-list {
    list-style: none !important;
    padding-left: 0 !important;
    margin-left: 0 !important;
}

/* Items de liste - retirer les puces et marges - UNIQUEMENT pour items numériques */
ul.numeric-list li,
li.numeric-item {
    list-style: none !important;
    padding-left: 0 !important;
    margin-left: 0 !important;
}

/* Forcer les lignes de grille dynamiques (total/remaining) sans puces */
li.ls-group-total,
li.ls-group-remaining,
li.ls-group-dynamic {
    list-style: none !important;
    padding-left: 0 !important;
    margin-left: 0 !important;
}

/* ============================================
   SLIDERS - AJUSTEMENT MARGE DROITE
   ============================================ */

/* Ajouter une marge à droite pour les sliders horizontaux dans les questions numériques multiples */
.ls-slider-item-horizontal .fr-range-group {
    margin-right: 1.5rem;
}

/* Sur mobile, retirer la marge supplémentaire */
@media (max-width: 767.98px) {
    .ls-slider-item-horizontal .fr-range-group {
        margin-right: 0;
    }
}

/* S'assurer que les colonnes prennent 100% sur mobile */
@media (max-width: 47.99em) {
    ul.numeric-list .fr-col-12.fr-col-md-6 {
        flex: 0 0 100% !important;
        max-width: 100% !important;
        width: 100% !important;
    }
}

/* La section « ARRAY TABLES - DSFR STYLE » a été déplacée en tête de
   custom.css (#41) : ses règles doivent battre fr-table du DSFR, ce que
   la spécificité assurait avant @layer mais que la couche `theme`
   (sous `dsfr`) ne permet plus. */


/* Responsive - scroll horizontal sur mobile */
@media (max-width: 48em) {
    .ls-table-wrapper {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
}

/* La section « ARRAY COLUMN TABLES » (table.array-radio) a été déplacée en
   tête de custom.css (#41), comme ARRAY TABLES : doit battre fr-table. */

/* Section « INCREASE/SAME/DECREASE TABLES » déplacée en tête de custom.css (#41) : doit battre fr-table (couche dsfr). */

/* Section « YES/NO/UNCERTAIN TABLES » déplacée en tête de custom.css (#41) : doit battre fr-table (couche dsfr). */

/* Section « DUAL SCALE TABLES » déplacée en tête de custom.css (#41). */

/* ========================================
   Question Type: Multiple Short Text (Type Q)
   Input On Demand - Saisie à la demande
   ======================================== */

/* Container padding pour éviter le débordement des champs */
.multiple-short-txt .answer-container {
    padding: 0 1rem;
}

/* Style du bouton "Ajouter une ligne" en DSFR */
.selector--inputondemand-addlinebutton,
button.selector--inputondemand-addlinebutton,
.btn.selector--inputondemand-addlinebutton {
    /* Reset Bootstrap */
    all: unset;

    /* Bouton secondaire DSFR */
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    background-color: transparent !important;
    color: var(--text-action-high-blue-france, #000091) !important;
    border: 1px solid var(--text-action-high-blue-france, #000091) !important;
    padding: 0.5rem 1rem !important;
    font-family: "Marianne", Arial, sans-serif !important;
    font-size: 1rem !important;
    font-weight: 500 !important;
    line-height: 1.5rem !important;
    border-radius: 0.25rem !important;
    cursor: pointer !important;
    transition: background-color 0.2s, color 0.2s, border-color 0.2s !important;
    text-decoration: none !important;
    box-sizing: border-box !important;
    box-shadow: none !important;
}

.selector--inputondemand-addlinebutton:hover,
button.selector--inputondemand-addlinebutton:hover,
.btn.selector--inputondemand-addlinebutton:hover {
    background-color: var(--background-action-high-blue-france-hover, #1212ff) !important;
    color: var(--text-inverted-blue-france) !important;
    border-color: var(--background-action-high-blue-france-hover, #1212ff) !important;
    text-decoration: none !important;
}

.selector--inputondemand-addlinebutton:active,
button.selector--inputondemand-addlinebutton:active,
.btn.selector--inputondemand-addlinebutton:active {
    background-color: var(--background-action-high-blue-france-active, #2323ff) !important;
    color: var(--text-inverted-blue-france) !important;
    border-color: var(--background-action-high-blue-france-active, #2323ff) !important;
}

.selector--inputondemand-addlinebutton:focus,
button.selector--inputondemand-addlinebutton:focus,
.btn.selector--inputondemand-addlinebutton:focus {
    outline: 2px solid var(--text-action-high-blue-france, #000091) !important;
    outline-offset: 2px !important;
}

/* Icône dans le bouton */
.selector--inputondemand-addlinebutton i,
.selector--inputondemand-addlinebutton .ri-arrow-down-s-line,
.selector--inputondemand-addlinebutton .fa {
    margin-right: 0.25rem;
    display: inline-block;
    vertical-align: middle;
}

/* Convertir l'icône FontAwesome en icône DSFR visuelle */
.selector--inputondemand-addlinebutton .fa-chevron-down::before,
.selector--inputondemand-addlinebutton .ri-arrow-down-s-line::before {
    content: "▼";
    font-family: "Marianne", Arial, sans-serif;
    font-size: 0.75rem;
}

/* Fix pour les champs qui dépassent */
.selector--inputondemand-list .form-control,
.selector--inputondemand-list .dsfr-input,
.selector--inputondemand-list .fr-input {
    max-width: 100%;
    box-sizing: border-box;
}

/* Fix pour les rows Bootstrap dans les questions on-demand */
.selector--inputondemand-list .row {
    margin: 0;
}

.selector--inputondemand-list .row > div {
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}

/* Alignement du conteneur du bouton */
.text-end {
    text-align: right;
    margin-top: 1rem;
}

/* Marge gauche pour les labels des questions Multiple Short Text */
/* Pour les templates DSFR */
.multiple-short-txt .fr-label,
.multiple-short-txt label.fr-label {
    margin-left: 0.25rem; /* !important déposé (#41) : custom.css remet 0 */
}

/* Pour les templates Bootstrap (input on demand) */
.selector--inputondemand-list .control-label,
.selector--inputondemand-list label.control-label,
.selector--inputondemand-list-item .control-label,
.selector--inputondemand-list-item label,
.multiple-short-txt .selector--inputondemand-list .control-label,
.multiple-short-txt .control-label,
li.selector--inputondemand-list-item label.control-label {
    margin-left: 0.25rem !important;
}

/* === Utility classes DSFR custom === */

/* Text alignment utility - right */
.lsd-text-right {
    text-align: right !important;
}

/* === Array Dropdown Tables (Question type F) === */

/* Force normal table display for array dropdown tables - DESKTOP ONLY */
/* Bloc @media dropdown-array (desktop) déplacé en tête de custom.css (#41). */


/* === Bootstrap Buttons Radio (List Radio avec affichage boutons) === */

/* Conteneur principal des boutons */
.bootstrap-buttons-div {
    margin-bottom: 0.5rem;
}

/* Masquer le radio natif mais le garder accessible */
.bootstrap-buttons-div .btn-check {
    position: absolute;
    clip: rect(0, 0, 0, 0);
    pointer-events: none;
}

/* Style des boutons (labels) - État non sélectionné */
.bootstrap-buttons-div label.btn {
    all: unset;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: transparent !important;
    color: var(--text-action-high-blue-france, #000091) !important;
    border: 1px solid var(--text-action-high-blue-france, #000091) !important;
    padding: 0.5rem 1rem !important;
    font-family: "Marianne", Arial, sans-serif !important;
    font-size: 1rem !important;
    font-weight: 500 !important;
    line-height: 1.5rem !important;
    border-radius: 0.25rem !important;
    cursor: pointer !important;
    transition: background-color 0.2s, color 0.2s !important;
    text-decoration: none !important;
    box-sizing: border-box !important;
    box-shadow: none; /* !important déposé (#41) : custom.css pose le liseré */
    width: 100%;
    text-align: center;
}

/* Hover */
.bootstrap-buttons-div label.btn:hover {
    background-color: var(--background-action-high-blue-france-hover, #1212ff) !important;
    color: var(--text-inverted-grey, #ffffff) !important;
}

/* Focus visible */
.bootstrap-buttons-div .btn-check:focus-visible + label.btn {
    outline: 2px solid #0a76f6;
    outline-offset: 2px;
}

/* État sélectionné (checked) */
.bootstrap-buttons-div .btn-check:checked + label.btn,
.bootstrap-buttons-div .form-check.active label.btn {
    background-color: var(--background-action-high-blue-france, #000091) !important;
    color: var(--text-inverted-grey, #ffffff) !important;
    border-color: var(--background-action-high-blue-france, #000091) !important;
}

/* Hover sur bouton sélectionné */
.bootstrap-buttons-div .btn-check:checked + label.btn:hover,
.bootstrap-buttons-div .form-check.active label.btn:hover {
    background-color: var(--background-action-high-blue-france-hover, #1212ff) !important;
}

/* Responsive: Ajuster la disposition sur mobile */
@media (max-width: 767.98px) {
    .bootstrap-buttons-div {
        margin-bottom: 0.75rem;
    }
}

/* === Champ "Autre" pour les Bootstrap Buttons Radio === */

/* Alignement vertical du label avec l'input */
.fr-grid-row[id^="div"][id$="other"].answer-item {
    align-items: center;
}

/* Marge entre label et input sur mobile */
.fr-grid-row[id^="div"][id$="other"].answer-item .fr-label {
    margin-bottom: 0.5rem;
}

/* Sur desktop, retirer la marge et aligner */
@media (min-width: 768px) {
    .fr-grid-row[id^="div"][id$="other"].answer-item .fr-label {
        margin-bottom: 0;
        padding-top: 0.5rem; /* Aligner avec le padding de l'input */
    }
}

/* ========================================================================
   Neutralisation des styles awesome-bootstrap-checkbox pour DSFR
   ======================================================================== */

/* Désactiver les styles Bootstrap checkbox/radio SAUF pour les labels DSFR (.fr-label)
   awesome-bootstrap-checkbox ajoute des pseudo-éléments sur tous les labels,
   mais on doit préserver ceux du DSFR qui utilisent .fr-label */
.fr-radio-group label:not(.fr-label)::before,
.fr-radio-group label:not(.fr-label)::after,
.fr-checkbox-group label:not(.fr-label)::before,
.fr-checkbox-group label:not(.fr-label)::after {
    content: none !important;
    display: none !important;
}

/* Retirer le padding-left ajouté par awesome-bootstrap-checkbox */
.answer-item:has(.fr-radio-group),
.answer-item:has(.fr-checkbox-group) {
    padding-left: 0 !important;
}

/* ============================================
   SOFT MANDATORY QUESTIONS - DSFR STYLE
   ============================================ */

/* Forcer l'affichage du groupe de checkbox DSFR pour soft mandatory */
.question-valid-container .fr-checkbox-group {
    display: flex !important;
    align-items: center;
    gap: 0.5rem;
    margin-top: 1rem;
    margin-bottom: 1rem;
}

/* CRITIQUE: Contrer l'opacity:0 du DSFR sur les checkboxes pour rendre visible la checkbox soft mandatory */
.question-valid-container .fr-checkbox-group input[type="checkbox"] {
    opacity: 1 !important;
    position: relative !important;
    flex-shrink: 0;
    margin: 0 !important;
}

/* S'assurer que le label DSFR fonctionne correctement */
.question-valid-container .fr-checkbox-group .fr-label {
    padding-left: 0 !important;
    margin: 0 !important;
    cursor: pointer;
    line-height: 1.5rem;
}

/* ============================================
   PRINT STYLES - DSFR THEME
   ============================================ */

@media print {
    /* Masquer les boutons et éléments de navigation */
    button,
    .btn,
    .fr-btn,
    input[type="submit"],
    input[type="button"],
    .survey-navigation,
    .ls-move-btn,
    .question-nav,
    nav {
        display: none !important;
    }

    /* Réduction du header */
    header,
    .survey-header,
    .fr-header {
        font-size: 10pt !important;
        padding: 0.2cm !important;
        margin-bottom: 0.3cm !important;
    }

    header h1,
    .survey-header h1 {
        font-size: 14pt !important;
        margin: 0.1cm 0 !important;
    }

    /* Optimiser pour l'impression - réduction globale des tailles et marges */
    body {
        font-size: 11pt !important;
        line-height: 1.3 !important;
        padding: 0.5cm !important;
    }

    /* Curseurs (sliders) : afficher uniquement la valeur sélectionnée */
    .slider-container,
    .fr-range-group,
    input[type="range"] {
        display: none !important;
    }

    /* Afficher la valeur du slider en gras */
    .slider-value,
    output,
    .fr-range-group output {
        display: block !important;
        font-weight: bold !important;
        font-size: 11pt !important;
        margin: 0.2cm 0 !important;
    }

    /* Éviter que les questions soient coupées entre deux pages */
    .question-wrapper,
    .question-container,
    .dsfr-question {
        page-break-inside: avoid !important;
        page-break-before: auto !important;
        margin-bottom: 0.3cm !important;
        padding: 0.2cm !important;
    }

    /* Réduction des marges et espacements */
    .fr-mb-2w,
    .fr-mb-3w,
    .fr-mb-4w,
    .fr-mb-6w {
        margin-bottom: 0.2cm !important;
    }

    .fr-mt-2w,
    .fr-mt-3w,
    .fr-mt-4w {
        margin-top: 0.2cm !important;
    }

    .fr-p-2w,
    .fr-p-3w,
    .fr-p-4w {
        padding: 0.1cm !important;
    }

    /* Réduction des titres */
    h1, h2, h3, h4, h5, h6 {
        margin-top: 0.2cm !important;
        margin-bottom: 0.1cm !important;
        line-height: 1.2 !important;
    }

    h1 { font-size: 16pt !important; }
    h2 { font-size: 14pt !important; }
    h3 { font-size: 12pt !important; }
    h4, h5, h6 { font-size: 11pt !important; }

    /* Textarea : hauteur minimale et ajustement au contenu */
    textarea,
    .fr-input[type="textarea"],
    .print-control {
        min-height: 1.5em !important;
        height: auto !important;
        overflow: visible !important;
        resize: none !important;
        padding: 0.1cm !important;
        border: 1px solid var(--border-plain-grey) !important;
    }

    /* Textarea vide : hauteur d'une ligne */
    textarea:empty,
    textarea:not(:valid) {
        height: 1.5em !important;
    }

    /* Input : hauteur réduite */
    input[type="text"],
    input[type="number"],
    input[type="email"],
    .fr-input,
    .form-control.print-control {
        height: auto !important;
        padding: 0.05cm 0.1cm !important;
        border: 1px solid var(--border-plain-grey) !important;
    }

    /* Labels et textes de questions */
    .question-text,
    .ls-label-question {
        font-weight: bold !important;
        margin-bottom: 0.1cm !important;
    }

    /* Réduction des espacements dans les grilles */
    .fr-grid-row {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    /* Tableaux : marges réduites */
    table {
        margin-bottom: 0.2cm !important;
    }

    table th,
    table td {
        padding: 0.1cm !important;
    }

    /* Radio et checkboxes : taille réduite */
    input[type="radio"],
    input[type="checkbox"],
    .input-radio:before,
    .input-checkbox:before {
        width: 0.4cm !important;
        height: 0.4cm !important;
    }

    /* Messages d'aide : texte plus petit */
    .question-help,
    .ls-questionhelp {
        font-size: 9pt !important;
        margin-top: 0.1cm !important;
    }

    /* Groupes de questions */
    .ls-group-container {
        page-break-inside: avoid !important;
        margin-bottom: 0.4cm !important;
    }
}
}