/* 
 * DOCUMENTATION JP — CSS RÉORGANISÉ
 * ----------------------------------------------------------
 * Fichier : assets/css/jp-faq.css
 * Rôle : Section FAQ.
 *
 * Lecture conseillée :
 * 1. fondations et structure du composant ;
 * 2. éléments internes et états ;
 * 3. adaptations responsive et compatibilité.
 *
 * IMPORTANT : l'ordre de cascade est volontairement préservé lorsqu'un déplacement
 * pourrait modifier le rendu. Les doublons retirés sont uniquement ceux dont une
 * déclaration strictement identique existe plus loin dans le même contexte CSS.
  */

/* * FICHIER CSS RÉORGANISÉ
 * Fichier : assets/css/jp-faq.css
 * Rôle : Styles du composant ou du module indiqué par le nom du fichier.
 *
 * Organisation :
 * 1. Styles de base du module
 * 2. États et interactions
 * 3. Adaptations responsives, dans l’ordre du fichier d’origine
 *
 * Maintenance : l’ordre des règles est conservé afin de respecter la cascade CSS.
 * Les doublons strictement identiques dans un même bloc ont été supprimés. */

/* *
 * jp-faq.css
 * Rôle : Module FAQ.
 *
 * Organisation du fichier :
 * 1. Variables et fondations éventuelles
 * 2. Structure principale du composant
 * 3. États, variantes et interactions
 * 4. Adaptations responsives
 *
 * Les doublons strictement identiques ont été supprimés. Les surcharges
 * volontaires et les fallbacks compatibles ont été conservés pour ne pas
 * modifier le rendu ou le comportement existant. */

/* =========================================================
   FAQ : accordéons Tout savoir
   ========================================================= */

/* Carte accordéon FAQ */

.jp-faq details {
        background: #fff;
        border-radius: 14px;
        padding: 18px 20px;
        margin-bottom: 14px;
        box-shadow: 0 8px 22px rgba(0,0,0,.06);
        line-height: 1.75;
}

/*  CIBLE — FAQ : .jp-faq details:last-child  */

.jp-faq details:last-child {
        margin-bottom: 0;
}

/* Question FAQ */

.jp-faq summary {
        cursor: pointer;
        font-size: 15px;
        font-weight: 900;
        color: var(--jp-dark);
        list-style: none;
        display: flex;
        align-items: center;
        justify-content: space-between;
}

/* Zone gauche de la question avec icône */

.jp-faq-summary-left {
        display: flex;
        align-items: center;
        gap: 12px;
}

/* Icône de question FAQ */

.jp-faq-icon {
        width: 24px;
        height: 24px;
        background: var(--jp-main);
        -webkit-mask: var(--icon) center/contain no-repeat;
        mask: var(--icon) center/contain no-repeat;
        flex-shrink: 0;
}

/*  CIBLE — FAQ : .jp-faq summary:before  */

.jp-faq summary:before {
        display: none;
}

/* Chevrons FAQ */

.jp-faq summary:after {
        content: "⌄";
        color: var(--jp-main);
        font-size: 22px;
        font-weight: 900;
        transition: .25s;
}

/*  CIBLE — Composant : details[open] summary:after  */

details[open] summary:after {
        transform: rotate(180deg);
}

/* Réponses FAQ */

.jp-faq details p, .jp-faq details li {
        font-weight: 300;
        line-height: 1.8;
        color: #475569;
        font-size: 13px;
}

/*  CIBLE — FAQ : .jp-faq details[open] summary  */

.jp-faq details[open] summary {
        margin-bottom: 16px;
}

/*  CIBLE — FAQ : .jp-faq details > *:last-child  */

.jp-faq details > *:last-child {
        margin-bottom: 0 !important;
}

/*  CIBLE — FAQ : .jp-faq details p  */

.jp-faq details p {
        margin-top: 0 !important;
        margin-bottom: 8px !important;
}

/*  CIBLE — FAQ : .jp-faq details p:last-child  */

.jp-faq details p:last-child {
        margin-bottom: 0 !important;
}

/*  CIBLE — FAQ : .jp-faq details ul, .jp-faq details ol  */

.jp-faq details ul, .jp-faq details ol {
        margin-top: 0 !important;
        margin-bottom: 8px !important;
}

/*  CIBLE — FAQ : .jp-faq details ul:last-child, .jp-faq details ol:last-child  */

.jp-faq details ul:last-child, .jp-faq details ol:last-child {
        margin-bottom: 0 !important;
}