/* ==========================================================
   PAHEKO 1.3.20 — SOCLE ADMIN STABLE
   Objectif :
   - réduire légèrement l'interface sans casser les dialogues
   - arrondir doucement cadres et boutons
   - préserver les menus déroulants Paheko
   - éviter les chevauchements liés aux overflow / z-index
   ========================================================== */


/* ==========================================================
   1. VARIABLES
   ========================================================== */

:root {
    --custom-menu-width: 153px;          /* menu Paheko réduit d'environ 10 % */
    --custom-radius-frame: 12px;         /* arrondi des cadres */
    --custom-radius-button: 999px;       /* boutons façon pilule */
    --custom-radius-field: 10px;         /* champs de formulaire */
}


/* ==========================================================
   2. RÉDUCTION DU MENU — SANS CASSER LES DIALOGUES
   Paheko met la classe dialog sur html, pas sur body.
   ========================================================== */

@media screen and (min-width: 982px) {

    #menu {
        width: var(--custom-menu-width) !important;
        font-size: 90% !important;
    }

    html:not(.dialog) body:not(.public):not(.raw) main {
        margin-left: var(--custom-menu-width) !important;
    }

    #menu .logo {
        min-height: 90px !important;
    }

    #menu .logo a {
        width: 135px !important;
        padding: 9px !important;
        padding-bottom: 0 !important;
    }

    #menu .logo img {
        max-width: 135px !important;
        max-height: 80px !important;
    }

    #menu a {
        padding: .36em .36em .36em .9em !important;
    }

    #menu li li a {
        font-size: .78em !important;
        padding-left: 1.8em !important;
    }

    #menu h3 span[data-icon]::before {
        right: .35rem !important;
        top: .36rem !important;
        font-size: 18pt !important;
    }
}


/* ==========================================================
   3. RÉDUCTION DOUCE DES PAGES — PAS DES DIALOGUES
   ========================================================== */

@media screen and (min-width: 982px) {
    html:not(.dialog) body:not(.public):not(.raw) main {
        font-size: 90%;
    }
}


/* ==========================================================
   4. TITRES — AJUSTEMENT LÉGER
   ========================================================== */

html:not(.dialog) body:not(.public):not(.raw) main h1,
html:not(.dialog) body:not(.public):not(.raw) main h1.main {
    margin-top: .15rem !important;
    margin-bottom: .65rem !important;
    padding-bottom: .35rem !important;
    line-height: 1.15 !important;
}


/* ==========================================================
   5. CADRES ARRONDIS — SANS OVERFLOW HIDDEN
   Important :
   Ne jamais mettre overflow:hidden sur fieldset, section, .block,
   sinon les menus déroulants Paheko sont coupés.
   ========================================================== */

html:not(.dialog) body:not(.public):not(.raw) main fieldset,
html:not(.dialog) body:not(.public):not(.raw) main .block,
html:not(.dialog) body:not(.public):not(.raw) main .help,
html:not(.dialog) body:not(.public):not(.raw) main .alert,
html:not(.dialog) body:not(.public):not(.raw) main .message,
html:not(.dialog) body:not(.public):not(.raw) main .error,
html:not(.dialog) body:not(.public):not(.raw) main .success,
html:not(.dialog) body:not(.public):not(.raw) main .confirm,
html:not(.dialog) body:not(.public):not(.raw) main .info,
html:not(.dialog) body:not(.public):not(.raw) main .wikiContent,
html:not(.dialog) body:not(.public):not(.raw) main article,
html:not(.dialog) body:not(.public):not(.raw) main section,
html:not(.dialog) body:not(.public):not(.raw) main aside {
    border-radius: var(--custom-radius-frame) !important;
    overflow: visible !important;
}


/* ==========================================================
   6. TABLEAUX
   On arrondit, mais on laisse overflow visible pour les menus.
   ========================================================== */

html:not(.dialog) body:not(.public):not(.raw) main table {
    border-radius: var(--custom-radius-frame) !important;
    overflow: visible !important;
}

html:not(.dialog) body:not(.public):not(.raw) main table thead,
html:not(.dialog) body:not(.public):not(.raw) main table tbody,
html:not(.dialog) body:not(.public):not(.raw) main table tfoot,
html:not(.dialog) body:not(.public):not(.raw) main table tr,
html:not(.dialog) body:not(.public):not(.raw) main table th,
html:not(.dialog) body:not(.public):not(.raw) main table td {
    overflow: visible !important;
}


/* ==========================================================
   7. BOUTONS ARRONDIS — TAILLES ET COULEURS D'ORIGINE
   ========================================================== */

html:not(.dialog) body:not(.public):not(.raw) main button,
html:not(.dialog) body:not(.public):not(.raw) main input[type="submit"],
html:not(.dialog) body:not(.public):not(.raw) main input[type="button"],
html:not(.dialog) body:not(.public):not(.raw) main input[type="reset"],
html:not(.dialog) body:not(.public):not(.raw) main a.button,
html:not(.dialog) body:not(.public):not(.raw) main .button,
html:not(.dialog) body:not(.public):not(.raw) main .icn-btn,
html:not(.dialog) body:not(.public):not(.raw) main .menu-btn > b {
    border-radius: var(--custom-radius-button) !important;
}


/* ==========================================================
   8. CHAMPS DE FORMULAIRE ARRONDIS
   ========================================================== */

html:not(.dialog) body:not(.public):not(.raw) main textarea,
html:not(.dialog) body:not(.public):not(.raw) main input[type="text"],
html:not(.dialog) body:not(.public):not(.raw) main input[type="email"],
html:not(.dialog) body:not(.public):not(.raw) main input[type="password"],
html:not(.dialog) body:not(.public):not(.raw) main input[type="number"],
html:not(.dialog) body:not(.public):not(.raw) main input[type="date"],
html:not(.dialog) body:not(.public):not(.raw) main input[type="time"],
html:not(.dialog) body:not(.public):not(.raw) main input[type="url"],
html:not(.dialog) body:not(.public):not(.raw) main input[type="search"],
html:not(.dialog) body:not(.public):not(.raw) main select {
    border-radius: var(--custom-radius-field) !important;
}


/* ==========================================================
   9. MENU-BTN PAHEKO
   Structure native :
   .menu-btn > b
   .menu-btn > span > span
   On ne déplace pas le menu. On sécurise seulement l'affichage.
   ========================================================== */

html:not(.dialog) body:not(.public):not(.raw) main .menu-btn {
    overflow: visible !important;
}

html:not(.dialog) body:not(.public):not(.raw) main .menu-btn.active {
    z-index: 5000 !important;
}

html:not(.dialog) body:not(.public):not(.raw) main .menu-btn > span {
    overflow: visible !important;
    z-index: 5001 !important;
}

html:not(.dialog) body:not(.public):not(.raw) main .menu-btn > span > span {
    overflow: visible !important;
}

/* Les zones d'actions doivent laisser sortir les menus */
html:not(.dialog) body:not(.public):not(.raw) main .actions,
html:not(.dialog) body:not(.public):not(.raw) main p.actions,
html:not(.dialog) body:not(.public):not(.raw) main td.actions {
    overflow: visible !important;
}


/* ==========================================================
   10. DROPDOWN PAHEKO
   Exemple : filtre catégorie membres.
   ========================================================== */

html:not(.dialog) body:not(.public):not(.raw) main nav.dropdown,
html:not(.dialog) body:not(.public):not(.raw) main fieldset.shortFormRight nav.dropdown {
    overflow: visible !important;
    z-index: 1000 !important;
}

html:not(.dialog) body:not(.public):not(.raw) main nav.dropdown.open,
html:not(.dialog) body:not(.public):not(.raw) main fieldset.shortFormRight nav.dropdown.open {
    z-index: 6000 !important;
}

html:not(.dialog) body:not(.public):not(.raw) main nav.dropdown ul,
html:not(.dialog) body:not(.public):not(.raw) main fieldset.shortFormRight nav.dropdown ul {
    z-index: 6001 !important;
    max-height: 70vh !important;
    overflow-y: auto !important;
}


/* ==========================================================
   11. SHORTFORMRIGHT
   On ne change pas la largeur native de Paheko.
   On évite seulement de couper les menus.
   ========================================================== */

html:not(.dialog) body:not(.public):not(.raw) main .shortFormRight,
html:not(.dialog) body:not(.public):not(.raw) main fieldset.shortFormRight {
    overflow: visible !important;
}


/* ==========================================================
   12. FENÊTRES D'ÉDITION / DIALOGUES
   Restaure le comportement natif Paheko.
   ========================================================== */

html.dialog body,
body.raw {
    font-size: initial !important;
}

html.dialog body main,
body.raw main {
    margin-left: 0 !important;
    width: 100% !important;
    max-width: none !important;
}

/* L'éditeur de code Paheko doit rester plein écran */
html.dialog:has(form.editor),
html.dialog:has(form.editor) body,
html.dialog:has(form.editor) main {
    padding: 0 !important;
    margin: 0 !important;
    height: 100% !important;
}

/* ==========================================================
   PAHEKO ADMIN — COUCHE VISUELLE CASINO BOHÈME
   À ajouter SOUS le socle stable
   Ambiance : casino chic, bohème, crème, vert feutre, or, terracotta
   ========================================================== */


/* ==========================================================
   VARIABLES DU THÈME
   ========================================================== */

:root {
    --casino-green: #123a33;
    --casino-green-2: #1d5b50;
    --casino-green-soft: #e4f0ec;

    --casino-gold: #c79a3c;
    --casino-gold-light: #f1d993;
    --casino-gold-soft: #f7ecd0;

    --casino-bordeaux: #8e2f2f;
    --casino-bordeaux-soft: #f2d9d5;

    --casino-terracotta: #b96545;

    --casino-cream: #fff8ec;
    --casino-paper: #f6e8cf;
    --casino-card: #fffaf1;

    --casino-text: #2b2118;
    --casino-muted: #6f6254;

    --casino-border: rgba(156, 111, 39, .38);
    --casino-border-soft: rgba(199, 154, 60, .24);

    --casino-shadow-soft: 0 2px 8px rgba(52, 35, 15, .10);
    --casino-shadow-card: 0 5px 16px rgba(52, 35, 15, .14);

    /* Tu peux mettre 0px si tu veux des cadres droits */
    --custom-radius-frame: 12px;
    --custom-radius-field: 10px;
    --custom-radius-button: 999px;
}


/* ==========================================================
   FOND GÉNÉRAL
   ========================================================== */

html:not(.dialog) body:not(.public):not(.raw) {
    background:
        radial-gradient(circle at top left, rgba(199, 154, 60, .18), transparent 27%),
        radial-gradient(circle at bottom right, rgba(142, 47, 47, .10), transparent 30%),
        linear-gradient(180deg, #fffaf1 0%, #f4e3c7 100%) !important;

    color: var(--casino-text) !important;
}

html:not(.dialog) body:not(.public):not(.raw) main {
    background: transparent !important;
    color: var(--casino-text) !important;
}


/* ==========================================================
   MENU LATÉRAL — TABLE DE CASINO CHIC
   ========================================================== */

html:not(.dialog) body:not(.public):not(.raw) #menu {
    background:
        linear-gradient(180deg, #0d2925 0%, var(--casino-green) 55%, #2a1711 100%) !important;

    border-right: 1px solid rgba(241, 217, 147, .35) !important;
    box-shadow: 4px 0 16px rgba(43, 33, 24, .22);
}

html:not(.dialog) body:not(.public):not(.raw) #menu .logo {
    background:
        radial-gradient(circle at center, rgba(241, 217, 147, .18), transparent 62%),
        rgba(255, 255, 255, .045) !important;

    border-bottom: 1px solid rgba(241, 217, 147, .24) !important;
}

html:not(.dialog) body:not(.public):not(.raw) #menu h3 a {
    color: rgba(255, 248, 236, .94) !important;
    text-shadow: 0 1px 1px rgba(0, 0, 0, .28);
}

html:not(.dialog) body:not(.public):not(.raw) #menu h3 a:hover {
    background: rgba(241, 217, 147, .14) !important;
    color: #ffffff !important;
}

html:not(.dialog) body:not(.public):not(.raw) #menu > ul > li.current > h3 > a,
html:not(.dialog) body:not(.public):not(.raw) #menu > ul > li.current_parent > h3 > a {
    background:
        linear-gradient(90deg, var(--casino-gold-light), var(--casino-gold)) !important;

    color: #1f2a1f !important;
    font-weight: 800 !important;
    text-shadow: none !important;
}

html:not(.dialog) body:not(.public):not(.raw) #menu > ul > li.current span[data-icon]::before,
html:not(.dialog) body:not(.public):not(.raw) #menu > ul > li.current_parent span[data-icon]::before {
    color: #1f2a1f !important;
}

html:not(.dialog) body:not(.public):not(.raw) #menu li ul {
    background: rgba(255, 255, 255, .045) !important;
}

html:not(.dialog) body:not(.public):not(.raw) #menu li li a {
    color: rgba(255, 248, 236, .86) !important;
}

html:not(.dialog) body:not(.public):not(.raw) #menu li li a:hover {
    background: rgba(241, 217, 147, .13) !important;
    color: #ffffff !important;
}

html:not(.dialog) body:not(.public):not(.raw) #menu li li.current a {
    background: rgba(199, 154, 60, .24) !important;
    color: #ffffff !important;
    font-weight: 800 !important;
}


/* ==========================================================
   TITRES
   ========================================================== */

html:not(.dialog) body:not(.public):not(.raw) main h1,
html:not(.dialog) body:not(.public):not(.raw) main h1.main {
    color: var(--casino-green) !important;
    border-bottom: 1px solid rgba(199, 154, 60, .35) !important;
    font-weight: 850 !important;
}

html:not(.dialog) body:not(.public):not(.raw) main h1::after,
html:not(.dialog) body:not(.public):not(.raw) main h1.main::after {
    content: "";
    display: block;

    width: 78px;
    height: 3px;

    margin-top: .45rem;

    background:
        linear-gradient(90deg, var(--casino-gold), var(--casino-bordeaux), var(--casino-gold)) !important;

    border-radius: 999px;
}

html:not(.dialog) body:not(.public):not(.raw) main h2 {
    color: var(--casino-green) !important;
    font-weight: 750 !important;
}

html:not(.dialog) body:not(.public):not(.raw) main h3 {
    color: var(--casino-bordeaux) !important;
    font-weight: 700 !important;
}

html:not(.dialog) body:not(.public):not(.raw) main small,
html:not(.dialog) body:not(.public):not(.raw) main .desc,
html:not(.dialog) body:not(.public):not(.raw) main .description {
    color: var(--casino-muted) !important;
}


/* ==========================================================
   CADRES / BLOCS
   ========================================================== */

html:not(.dialog) body:not(.public):not(.raw) main fieldset,
html:not(.dialog) body:not(.public):not(.raw) main .block,
html:not(.dialog) body:not(.public):not(.raw) main .help,
html:not(.dialog) body:not(.public):not(.raw) main .alert,
html:not(.dialog) body:not(.public):not(.raw) main .message,
html:not(.dialog) body:not(.public):not(.raw) main .error,
html:not(.dialog) body:not(.public):not(.raw) main .success,
html:not(.dialog) body:not(.public):not(.raw) main .confirm,
html:not(.dialog) body:not(.public):not(.raw) main .info,
html:not(.dialog) body:not(.public):not(.raw) main .wikiContent,
html:not(.dialog) body:not(.public):not(.raw) main article,
html:not(.dialog) body:not(.public):not(.raw) main section,
html:not(.dialog) body:not(.public):not(.raw) main aside {
    background:
        linear-gradient(180deg, rgba(255, 250, 241, .98), rgba(255, 246, 229, .96)) !important;

    border: 1px solid var(--casino-border) !important;
    box-shadow: var(--casino-shadow-soft);
}

html:not(.dialog) body:not(.public):not(.raw) main legend {
    color: var(--casino-green) !important;
    font-weight: 800 !important;
}


/* ==========================================================
   ONGLET DES PAGES — STYLE JETONS DISCRETS
   ========================================================== */

html:not(.dialog) body:not(.public):not(.raw) main nav.tabs {
    border-bottom-color: rgba(199, 154, 60, .30) !important;
}

html:not(.dialog) body:not(.public):not(.raw) main nav.tabs li:first-child::before,
html:not(.dialog) body:not(.public):not(.raw) main nav.tabs li:last-child::after {
    display: none !important;
}

html:not(.dialog) body:not(.public):not(.raw) main nav.tabs li a {
    background: rgba(255, 250, 241, .92) !important;
    color: var(--casino-green) !important;

    border: 1px solid rgba(199, 154, 60, .42) !important;
    font-weight: 800 !important;
    text-decoration: none !important;

    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .45);
}

html:not(.dialog) body:not(.public):not(.raw) main nav.tabs li a:hover {
    background: rgba(241, 217, 147, .34) !important;
    color: var(--casino-green) !important;
}

html:not(.dialog) body:not(.public):not(.raw) main nav.tabs li.current a,
html:not(.dialog) body:not(.public):not(.raw) main nav.tabs .current a {
    background:
        linear-gradient(180deg, var(--casino-bordeaux), #6f2020) !important;

    color: #fff8ec !important;
    border-color: #6f2020 !important;
}


/* ==========================================================
   BOUTONS — CASINO CHIC
   ========================================================== */

html:not(.dialog) body:not(.public):not(.raw) main button,
html:not(.dialog) body:not(.public):not(.raw) main input[type="submit"],
html:not(.dialog) body:not(.public):not(.raw) main input[type="button"],
html:not(.dialog) body:not(.public):not(.raw) main input[type="reset"],
html:not(.dialog) body:not(.public):not(.raw) main a.button,
html:not(.dialog) body:not(.public):not(.raw) main .button,
html:not(.dialog) body:not(.public):not(.raw) main .icn-btn,
html:not(.dialog) body:not(.public):not(.raw) main .actions a,
html:not(.dialog) body:not(.public):not(.raw) main .actions button,
html:not(.dialog) body:not(.public):not(.raw) main .menu-btn > b {
    background:
        linear-gradient(180deg, var(--casino-green-2), var(--casino-green)) !important;

    border: 1px solid rgba(18, 58, 51, .90) !important;
    color: #fff8ec !important;

    font-weight: 800 !important;
    text-decoration: none !important;

    box-shadow: var(--casino-shadow-soft);
}

html:not(.dialog) body:not(.public):not(.raw) main button:hover,
html:not(.dialog) body:not(.public):not(.raw) main input[type="submit"]:hover,
html:not(.dialog) body:not(.public):not(.raw) main input[type="button"]:hover,
html:not(.dialog) body:not(.public):not(.raw) main a.button:hover,
html:not(.dialog) body:not(.public):not(.raw) main .button:hover,
html:not(.dialog) body:not(.public):not(.raw) main .icn-btn:hover,
html:not(.dialog) body:not(.public):not(.raw) main .actions a:hover,
html:not(.dialog) body:not(.public):not(.raw) main .actions button:hover,
html:not(.dialog) body:not(.public):not(.raw) main .menu-btn > b:hover {
    background:
        linear-gradient(180deg, var(--casino-gold-light), var(--casino-gold)) !important;

    color: var(--casino-green) !important;
    border-color: var(--casino-gold) !important;
}


/* ==========================================================
   CHAMPS DE FORMULAIRE
   ========================================================== */

html:not(.dialog) body:not(.public):not(.raw) main input[type="text"],
html:not(.dialog) body:not(.public):not(.raw) main input[type="email"],
html:not(.dialog) body:not(.public):not(.raw) main input[type="password"],
html:not(.dialog) body:not(.public):not(.raw) main input[type="number"],
html:not(.dialog) body:not(.public):not(.raw) main input[type="date"],
html:not(.dialog) body:not(.public):not(.raw) main input[type="time"],
html:not(.dialog) body:not(.public):not(.raw) main input[type="url"],
html:not(.dialog) body:not(.public):not(.raw) main input[type="search"],
html:not(.dialog) body:not(.public):not(.raw) main select,
html:not(.dialog) body:not(.public):not(.raw) main textarea {
    background: #fffdf8 !important;
    border: 1px solid rgba(199, 154, 60, .44) !important;
    color: var(--casino-text) !important;
    box-shadow: inset 0 1px 2px rgba(80, 55, 20, .05);
}

html:not(.dialog) body:not(.public):not(.raw) main input:focus,
html:not(.dialog) body:not(.public):not(.raw) main select:focus,
html:not(.dialog) body:not(.public):not(.raw) main textarea:focus {
    border-color: var(--casino-gold) !important;
    box-shadow: 0 0 0 3px rgba(199, 154, 60, .20) !important;
    outline: none !important;
}


/* ==========================================================
   TABLEAUX / LISTES
   ========================================================== */

html:not(.dialog) body:not(.public):not(.raw) main table {
    background: rgba(255, 250, 241, .96) !important;
    border: 1px solid rgba(199, 154, 60, .34) !important;
    box-shadow: var(--casino-shadow-soft);
}

html:not(.dialog) body:not(.public):not(.raw) main table thead th,
html:not(.dialog) body:not(.public):not(.raw) main table thead td {
    background:
        linear-gradient(180deg, rgba(241, 217, 147, .55), rgba(245, 231, 207, .96)) !important;

    color: var(--casino-green) !important;
    font-weight: 850 !important;
    border-color: var(--casino-border-soft) !important;
}

html:not(.dialog) body:not(.public):not(.raw) main table tbody td,
html:not(.dialog) body:not(.public):not(.raw) main table tbody th {
    border-color: var(--casino-border-soft) !important;
}

html:not(.dialog) body:not(.public):not(.raw) main table tbody tr:nth-child(even) td,
html:not(.dialog) body:not(.public):not(.raw) main table tbody tr:nth-child(even) th {
    background: rgba(255, 248, 236, .72) !important;
}

html:not(.dialog) body:not(.public):not(.raw) main table tbody tr:hover td,
html:not(.dialog) body:not(.public):not(.raw) main table tbody tr:hover th {
    background: rgba(241, 217, 147, .25) !important;
}


/* ==========================================================
   CARTES D’ACCUEIL ADMIN
   ========================================================== */

html:not(.dialog) body:not(.public):not(.raw) main nav.home ul li a {
    background:
        radial-gradient(circle at top left, rgba(199, 154, 60, .22), transparent 36%),
        linear-gradient(180deg, rgba(255, 250, 241, .98), rgba(255, 246, 229, .96)) !important;

    border: 1px solid rgba(199, 154, 60, .38) !important;
    box-shadow: var(--casino-shadow-card);

    color: var(--casino-green) !important;
    text-decoration: none !important;
}

html:not(.dialog) body:not(.public):not(.raw) main nav.home ul li a:hover {
    border-color: var(--casino-gold) !important;
    box-shadow: 0 7px 20px rgba(52, 35, 15, .18);
}

html:not(.dialog) body:not(.public):not(.raw) main nav.home ul li a span,
html:not(.dialog) body:not(.public):not(.raw) main nav.home ul li a strong,
html:not(.dialog) body:not(.public):not(.raw) main nav.home ul li a b {
    color: var(--casino-green) !important;
    opacity: 1 !important;
}


/* ==========================================================
   MESSAGES
   ========================================================== */

html:not(.dialog) body:not(.public):not(.raw) main .success {
    background: rgba(225, 239, 229, .94) !important;
    border-color: rgba(28, 90, 79, .34) !important;
}

html:not(.dialog) body:not(.public):not(.raw) main .error,
html:not(.dialog) body:not(.public):not(.raw) main .alert {
    background: rgba(249, 224, 215, .96) !important;
    border-color: rgba(142, 47, 47, .34) !important;
}

html:not(.dialog) body:not(.public):not(.raw) main .info,
html:not(.dialog) body:not(.public):not(.raw) main .message,
html:not(.dialog) body:not(.public):not(.raw) main .confirm {
    background: rgba(255, 248, 236, .96) !important;
    border-color: rgba(199, 154, 60, .38) !important;
}


/* ==========================================================
   MENUS DÉROULANTS PAHEKO
   Position native conservée par le socle stable.
   Ici on ne change que l’apparence.
   ========================================================== */

html:not(.dialog) body:not(.public):not(.raw) main .menu-btn > span > span {
    background: #fffaf1 !important;
    border: 1px solid rgba(199, 154, 60, .58) !important;
    border-top: 2px solid var(--casino-gold) !important;
    box-shadow: 0 7px 22px rgba(52, 35, 15, .25) !important;
}

html:not(.dialog) body:not(.public):not(.raw) main .menu-btn > span > span a,
html:not(.dialog) body:not(.public):not(.raw) main .menu-btn > span > span button {
    background: #fffaf1 !important;
    color: var(--casino-text) !important;
}

html:not(.dialog) body:not(.public):not(.raw) main .menu-btn > span > span a:hover,
html:not(.dialog) body:not(.public):not(.raw) main .menu-btn > span > span button:hover {
    background: rgba(241, 217, 147, .34) !important;
    color: var(--casino-green) !important;
}


/* ==========================================================
   DROPDOWNS PAHEKO
   Exemple : filtre catégories
   ========================================================== */

html:not(.dialog) body:not(.public):not(.raw) main nav.dropdown ul,
html:not(.dialog) body:not(.public):not(.raw) main fieldset.shortFormRight nav.dropdown ul {
    background: #fffaf1 !important;
    border: 1px solid rgba(199, 154, 60, .58) !important;
    box-shadow: 0 7px 22px rgba(52, 35, 15, .25) !important;
}

html:not(.dialog) body:not(.public):not(.raw) main nav.dropdown a {
    color: var(--casino-text) !important;
}

html:not(.dialog) body:not(.public):not(.raw) main nav.dropdown a:hover {
    background: rgba(241, 217, 147, .34) !important;
    color: var(--casino-green) !important;
}


/* ==========================================================
   MOBILE — LISIBILITÉ
   ========================================================== */

@media screen and (max-width: 981px) {
    html:not(.dialog) body:not(.public):not(.raw) main nav.home ul li a {
        background: #fffaf1 !important;
        color: var(--casino-green) !important;
    }

    html:not(.dialog) body:not(.public):not(.raw) main nav.home ul li a span,
    html:not(.dialog) body:not(.public):not(.raw) main nav.home ul li a strong,
    html:not(.dialog) body:not(.public):not(.raw) main nav.home ul li a b {
        color: var(--casino-green) !important;
        opacity: 1 !important;
    }
}
/* ==========================================================
   PATCH MOBILE — BULLES DE SOUS-MENU DU MENU BAS
   Exemple : Assistant aux messages collectifs / Réservations
   ========================================================== */

@media screen and (max-width: 981px) {

    /* Conteneur des bulles de sous-menu */
    html:not(.dialog) body:not(.public):not(.raw) #menu > ul > li > ul {
        background: transparent !important;
        border: none !important;
        box-shadow: none !important;
    }

    /* Chaque bulle */
    html:not(.dialog) body:not(.public):not(.raw) #menu > ul > li > ul > li {
        background: transparent !important;
    }

    /* Lien dans la bulle */
    html:not(.dialog) body:not(.public):not(.raw) #menu > ul > li > ul > li > a {
        background: #fff8ec !important;
        color: #123a33 !important;

        border: 1px solid rgba(199, 154, 60, .55) !important;
        border-radius: 999px !important;

        box-shadow: 0 4px 14px rgba(52, 35, 15, .22) !important;

        font-weight: 800 !important;
        text-shadow: none !important;
        opacity: 1 !important;
    }

    /* Texte interne de la bulle */
    html:not(.dialog) body:not(.public):not(.raw) #menu > ul > li > ul > li > a span,
    html:not(.dialog) body:not(.public):not(.raw) #menu > ul > li > ul > li > a strong,
    html:not(.dialog) body:not(.public):not(.raw) #menu > ul > li > ul > li > a b {
        color: #123a33 !important;
        opacity: 1 !important;
        text-shadow: none !important;
    }

    /* Survol / appui */
    html:not(.dialog) body:not(.public):not(.raw) #menu > ul > li > ul > li > a:hover,
    html:not(.dialog) body:not(.public):not(.raw) #menu > ul > li > ul > li > a:focus {
        background: linear-gradient(180deg, #f1d993, #c79a3c) !important;
        color: #123a33 !important;
        border-color: #c79a3c !important;
    }
}