/*
Theme Name: Five Senses Prix
Theme URI: https://fivesenses.tn
Author: Five Senses SPA
Author URI: https://fivesenses.tn
Description: Thème enfant de Reina pour les pages de prix Five Senses SPA
Version: 1.2.8
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: fivesenses-prix
Template: reina

Thème enfant de Reina - Pages de tarifs pour les centres spa Five Senses
*/

/* Import du style parent */
/* Les styles du parent sont chargés via functions.php */

/* ============================================
   SUPPRESSION DU TOP HEADER NOIR UNIQUEMENT (v1.2.3)
   Ne touche PAS au header principal
   ============================================ */

/* Supprimer SEULEMENT le top-area (barre noire avec contact, etc.) */
#qodef-top-area {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    max-height: 0 !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* ============================================
   HEADER BLANC PRINCIPAL - GARDER VISIBLE (v1.2.4)
   ============================================ */

/* S'assurer que le header principal reste visible */
#qodef-page-header {
    display: block !important;
    visibility: visible !important;
}

/* Header divided (page d'accueil) - garder visible */
.qodef-header--divided #qodef-page-header-inner {
    display: flex !important;
    visibility: visible !important;
}

/* ============================================
   HEADER SECONDAIRE - PAGES DE CENTRE (v1.2.5)
   COULEURS INVERSÉES : Fond NOIR, texte CLAIR
   Identique au header principal mais inversé
   ============================================ */

/* Header secondaire sur les pages de centre - STICKY + FOND NOIR */
.qodef-header--standard #qodef-page-header {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 9999 !important;
    background: #1a1a1a !important;
    box-shadow: 0 2px 20px rgba(0, 0, 0, 0.3) !important;
    border-bottom: 1px solid rgba(201, 168, 108, 0.3) !important;
    transition: all 0.3s ease !important;
    animation: slideDown 0.4s ease-out !important;
}

/* Animation d'apparition du header */
@keyframes slideDown {
    from {
        transform: translateY(-100%);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

/* Espace pour compenser le header fixed */
.qodef-header--standard #qodef-page-outer {
    padding-top: 100px !important;
}

/* Header inner - flexbox pour logo à gauche, menu à droite */
.qodef-header--standard #qodef-page-header-inner {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 15px 40px !important;
    max-width: 1400px !important;
    margin: 0 auto !important;
}

/* Logo - style élégant */
.qodef-header--standard .qodef-header-logo-link {
    display: flex !important;
    align-items: center !important;
}

.qodef-header--standard .qodef-header-logo-link img {
    max-height: 55px !important;
    transition: all 0.3s ease !important;
    filter: brightness(1.1) !important;
}

.qodef-header--standard .qodef-header-logo-link:hover img {
    transform: scale(1.02) !important;
}

/* Navigation - alignée à droite */
.qodef-header--standard .qodef-header-navigation {
    display: flex !important;
    align-items: center !important;
}

.qodef-header--standard .qodef-header-navigation > ul {
    display: flex !important;
    align-items: center !important;
    gap: 5px !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

/* Liens de navigation - COULEURS INVERSÉES (texte clair sur fond noir) */
.qodef-header--standard .qodef-header-navigation > ul > li > a {
    color: #ffffff !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    padding: 12px 18px !important;
    transition: all 0.3s ease !important;
    position: relative !important;
    text-decoration: none !important;
}

.qodef-header--standard .qodef-header-navigation > ul > li > a:hover {
    color: #c9a86c !important;
}

/* Effet souligné doré au survol */
.qodef-header--standard .qodef-header-navigation > ul > li > a::after {
    content: '' !important;
    position: absolute !important;
    bottom: 5px !important;
    left: 50% !important;
    width: 0 !important;
    height: 2px !important;
    background: linear-gradient(90deg, #c9a86c, #d4b87a) !important;
    transition: all 0.3s ease !important;
    transform: translateX(-50%) !important;
}

.qodef-header--standard .qodef-header-navigation > ul > li > a:hover::after,
.qodef-header--standard .qodef-header-navigation > ul > li.current-menu-item > a::after {
    width: 25px !important;
}

/* Menu item actif */
.qodef-header--standard .qodef-header-navigation > ul > li.current-menu-item > a,
.qodef-header--standard .qodef-header-navigation > ul > li.current-menu-ancestor > a {
    color: #c9a86c !important;
}

/* Bouton Réserver - style doré */
.qodef-header--standard .widget_reina_core_button a,
.qodef-header--standard .qodef-button,
.qodef-header--standard #fs-reserver-btn {
    background: linear-gradient(135deg, #c9a86c 0%, #d4b87a 50%, #a08050 100%) !important;
    color: #ffffff !important;
    padding: 12px 28px !important;
    border-radius: 25px !important;
    font-weight: 600 !important;
    font-size: 13px !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    box-shadow: 0 4px 15px rgba(201, 168, 108, 0.3) !important;
    transition: all 0.3s ease !important;
    border: none !important;
    text-decoration: none !important;
}

.qodef-header--standard .widget_reina_core_button a:hover,
.qodef-header--standard .qodef-button:hover,
.qodef-header--standard #fs-reserver-btn:hover {
    background: linear-gradient(135deg, #d4b87a 0%, #c9a86c 50%, #b89060 100%) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(201, 168, 108, 0.4) !important;
}

/* Icône menu mobile - couleur claire */
.qodef-header--standard .qodef-opener-icon {
    color: #ffffff !important;
}

.qodef-header--standard .qodef-opener-icon:hover {
    color: #c9a86c !important;
}

/* Responsive - mobile */
@media (max-width: 1024px) {
    .qodef-header--standard #qodef-page-header-inner {
        padding: 12px 20px !important;
    }
    
    .qodef-header--standard .qodef-header-navigation > ul > li > a {
        padding: 10px 12px !important;
        font-size: 12px !important;
    }
}

/* ============================================
   AMÉLIORATION DU 2ÈME HEADER NOIR (Pages Centre) (v1.2.3)
   C'est le header avec le logo Five Senses et le menu NOS CURES, RITUELS, etc.
   ============================================ */

/* Header secondaire noir sur les pages de centre */
.fs-prix-hero-header,
.prix-page-header,
.fs-centre-header {
    background: linear-gradient(135deg, #1a1a1a 0%, #2a2a2a 100%) !important;
    padding: 30px 0 !important;
    text-align: center !important;
    border-bottom: 1px solid rgba(201, 168, 108, 0.3) !important;
}

/* Logo dans le header secondaire */
.fs-prix-hero-header img,
.prix-page-header img {
    max-height: 80px !important;
    margin-bottom: 20px !important;
}

/* Titre du centre */
.fs-prix-hero-header h1,
.fs-centre-title {
    font-family: 'Cormorant Garamond', serif !important;
    font-size: 48px !important;
    font-weight: 400 !important;
    font-style: italic !important;
    color: #ffffff !important;
    margin-bottom: 15px !important;
}

/* Sous-titre avec étoiles */
.fs-prix-hero-header .stars,
.fs-centre-stars {
    color: #c9a86c !important;
    font-size: 18px !important;
    letter-spacing: 3px !important;
    margin-bottom: 10px !important;
}

/* Infos de contact */
.fs-prix-hero-header .contact-info,
.fs-centre-info {
    display: flex !important;
    justify-content: center !important;
    gap: 30px !important;
    flex-wrap: wrap !important;
    color: #999999 !important;
    font-size: 14px !important;
}

.fs-prix-hero-header .contact-info a {
    color: #c9a86c !important;
    text-decoration: none !important;
    transition: all 0.3s ease !important;
}

.fs-prix-hero-header .contact-info a:hover {
    color: #d4b87a !important;
}

/* Navigation secondaire (NOS CURES, RITUELS, etc.) */
.fs-prix-navigation,
.fs-centre-nav {
    background: #1a1a1a !important;
    padding: 15px 0 !important;
    border-top: 1px solid rgba(201, 168, 108, 0.2) !important;
}

.fs-prix-navigation ul {
    display: flex !important;
    justify-content: center !important;
    gap: 40px !important;
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    flex-wrap: wrap !important;
}

.fs-prix-navigation ul li a {
    color: #999999 !important;
    text-decoration: none !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    text-transform: uppercase !important;
    letter-spacing: 2px !important;
    transition: all 0.3s ease !important;
    padding: 10px 0 !important;
    position: relative !important;
}

.fs-prix-navigation ul li a:hover,
.fs-prix-navigation ul li a.active {
    color: #c9a86c !important;
}

.fs-prix-navigation ul li a::after {
    content: '' !important;
    position: absolute !important;
    bottom: 0 !important;
    left: 0 !important;
    width: 0 !important;
    height: 2px !important;
    background: linear-gradient(90deg, #c9a86c, #d4b87a) !important;
    transition: width 0.3s ease !important;
}

.fs-prix-navigation ul li a:hover::after,
.fs-prix-navigation ul li a.active::after {
    width: 100% !important;
}

/* Icône menu mobile */
#qodef-page-header .qodef-opener-icon {
    color: #1a1a1a !important;
}

#qodef-page-header .qodef-opener-icon:hover {
    color: #c9a86c !important;
}

/* Variables CSS Five Senses */
:root {
    --fs-gold: #c9a86c;
    --fs-gold-light: #d4b87a;
    --fs-gold-dark: #a08050;
    --fs-black: #1a1a1a;
    --fs-dark: #222222;
    --fs-gray: #2a2a2a;
    --fs-text: #999999;
    --fs-text-light: #cccccc;
    --fs-white: #ffffff;
}

/* ============================================
   CORRECTION CRITIQUE - CACHER LE WIDGET "NOS SERVICES"
   Ce widget s'affiche incorrectement dans le header
   ============================================ */

/* Cacher le widget "Nos Services" dans le header - TOUTES les méthodes */
.qodef-header-widget-area-one,
.widget_nav_menu.qodef-header-widget-area-one,
#nav_menu-2,
#nav_menu-2.widget_nav_menu,
.qodef-header-widget-area-one .widget_nav_menu,
[data-area="header-widget-one"],
.widget.widget_nav_menu.qodef-header-widget-area-one,
aside.widget_nav_menu,
.qodef-widget-holder .widget_nav_menu,
#qodef-page-header .widget_nav_menu,
header .widget_nav_menu:not(.qodef-header-navigation .widget_nav_menu) {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
    position: absolute !important;
    left: -9999px !important;
    top: -9999px !important;
    pointer-events: none !important;
    max-width: 0 !important;
    max-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    clip: rect(0,0,0,0) !important;
}

/* Cacher spécifiquement le titre "Nos Services" qui apparaît */
.widgettitle:contains("Nos Services"),
h2.widgettitle {
    display: none !important;
}

/* ============================================
   CORRECTION HEADER - SOUS-MENU QUI DÉBORDE
   Appliqué sur TOUTES les pages
   ============================================ */

/* Cacher tous les sous-menus par défaut */
.qodef-header-navigation .sub-menu,
.qodef-header-navigation .qodef-drop-down-second,
.qodef-header-navigation ul ul,
.qodef-drop-down-second--full-width .qodef-drop-down-second,
#qodef-page-header .sub-menu,
#qodef-page-header .qodef-drop-down-second,
header .sub-menu,
header .qodef-drop-down-second {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    position: absolute !important;
    left: 0 !important;
    top: 100% !important;
    z-index: 9999 !important;
}

/* Afficher au survol seulement */
.qodef-header-navigation .menu-item:hover > .sub-menu,
.qodef-header-navigation .menu-item:hover > .qodef-drop-down-second,
.qodef-header-navigation li:hover > ul,
#qodef-page-header .menu-item:hover > .sub-menu,
#qodef-page-header .menu-item:hover > .qodef-drop-down-second,
header .menu-item:hover > .sub-menu,
header .menu-item:hover > .qodef-drop-down-second {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
}

/* Style des sous-menus quand visibles */
.qodef-header-navigation .sub-menu,
.qodef-header-navigation .qodef-drop-down-second,
#qodef-page-header .sub-menu,
header .sub-menu {
    background: #1a1a1a !important;
    border: 1px solid rgba(201, 168, 108, 0.2) !important;
    box-shadow: 0 10px 30px rgba(0,0,0,0.5) !important;
    min-width: 200px !important;
    max-width: 280px !important;
    padding: 10px 0 !important;
}

/* Liens dans les sous-menus */
.qodef-header-navigation .sub-menu a,
.qodef-header-navigation .qodef-drop-down-second a,
#qodef-page-header .sub-menu a,
header .sub-menu a {
    color: #cccccc !important;
    padding: 10px 20px !important;
    display: block !important;
    font-size: 14px !important;
    border-bottom: 1px solid rgba(255,255,255,0.05) !important;
    transition: all 0.3s ease !important;
}

.qodef-header-navigation .sub-menu a:hover,
.qodef-header-navigation .qodef-drop-down-second a:hover,
#qodef-page-header .sub-menu a:hover,
header .sub-menu a:hover {
    color: #c9a86c !important;
    background: rgba(201, 168, 108, 0.1) !important;
}

/* Empêcher le débordement du header */
#qodef-page-header,
.qodef-page-header,
header {
    overflow: visible !important;
}

/* ============================================
   CORRECTION FOOTER
   ============================================ */

footer,
.qodef-page-footer,
#qodef-page-footer,
.site-footer {
    background-color: #1a1a1a !important;
    color: #999999 !important;
}

.qodef-page-footer h1,
.qodef-page-footer h2,
.qodef-page-footer h3,
.qodef-page-footer h4,
.qodef-page-footer h5,
.qodef-page-footer h6,
.site-footer h1,
.site-footer h2,
.site-footer h3,
.site-footer h4,
.site-footer h5,
.site-footer h6 {
    color: #ffffff !important;
}

.qodef-page-footer a,
.site-footer a {
    color: #c9a86c !important;
}

.qodef-page-footer a:hover,
.site-footer a:hover {
    color: #d4b87a !important;
}

/* ============================================
   PAGES DE PRIX - CACHER LE TITRE QODE
   ============================================ */

.page-template-page-prix-zodiac .qodef-page-title,
.page-template-page-prix-nahrawess .qodef-page-title,
.page-template-page-prix-omarkhayam .qodef-page-title,
.page-template-page-prix-lesultan .qodef-page-title,
.page-template-page-prix-thesindbad .qodef-page-title,
.page-template-page-prix-samiraclub .qodef-page-title,
.page-template-page-prix-khayamgarden .qodef-page-title,
.page-template-page-nos-centres .qodef-page-title,
.page-template-templatespage-prix-zodiac-php .qodef-page-title,
.page-template-templatespage-prix-nahrawess-php .qodef-page-title,
.page-template-templatespage-prix-omarkhayam-php .qodef-page-title,
.page-template-templatespage-prix-lesultan-php .qodef-page-title,
.page-template-templatespage-prix-thesindbad-php .qodef-page-title,
.page-template-templatespage-prix-samiraclub-php .qodef-page-title,
.page-template-templatespage-prix-khayamgarden-php .qodef-page-title,
.page-template-templatespage-nos-centres-php .qodef-page-title {
    display: none !important;
}

/* ============================================
   PAGES DE PRIX - FULL WIDTH
   ============================================ */

/* Supprimer toutes les marges et paddings du container */
.page-template-page-prix-zodiac #qodef-page-outer,
.page-template-page-prix-nahrawess #qodef-page-outer,
.page-template-page-prix-omarkhayam #qodef-page-outer,
.page-template-page-prix-lesultan #qodef-page-outer,
.page-template-page-prix-thesindbad #qodef-page-outer,
.page-template-page-prix-samiraclub #qodef-page-outer,
.page-template-page-prix-khayamgarden #qodef-page-outer,
.page-template-page-nos-centres #qodef-page-outer,
.page-template-templatespage-prix-zodiac-php #qodef-page-outer,
.page-template-templatespage-prix-nahrawess-php #qodef-page-outer,
.page-template-templatespage-prix-omarkhayam-php #qodef-page-outer,
.page-template-templatespage-prix-lesultan-php #qodef-page-outer,
.page-template-templatespage-prix-thesindbad-php #qodef-page-outer,
.page-template-templatespage-prix-samiraclub-php #qodef-page-outer,
.page-template-templatespage-prix-khayamgarden-php #qodef-page-outer,
.page-template-templatespage-nos-centres-php #qodef-page-outer {
    padding: 0 !important;
    margin: 0 !important;
}

.page-template-page-prix-zodiac #qodef-page-inner,
.page-template-page-prix-nahrawess #qodef-page-inner,
.page-template-page-prix-omarkhayam #qodef-page-inner,
.page-template-page-prix-lesultan #qodef-page-inner,
.page-template-page-prix-thesindbad #qodef-page-inner,
.page-template-page-prix-samiraclub #qodef-page-inner,
.page-template-page-prix-khayamgarden #qodef-page-inner,
.page-template-page-nos-centres #qodef-page-inner,
.page-template-templatespage-prix-zodiac-php #qodef-page-inner,
.page-template-templatespage-prix-nahrawess-php #qodef-page-inner,
.page-template-templatespage-prix-omarkhayam-php #qodef-page-inner,
.page-template-templatespage-prix-lesultan-php #qodef-page-inner,
.page-template-templatespage-prix-thesindbad-php #qodef-page-inner,
.page-template-templatespage-prix-samiraclub-php #qodef-page-inner,
.page-template-templatespage-prix-khayamgarden-php #qodef-page-inner,
.page-template-templatespage-nos-centres-php #qodef-page-inner {
    padding: 0 !important;
    margin: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
}

.page-template-page-prix-zodiac .qodef-content-grid,
.page-template-page-prix-nahrawess .qodef-content-grid,
.page-template-page-prix-omarkhayam .qodef-content-grid,
.page-template-page-prix-lesultan .qodef-content-grid,
.page-template-page-prix-thesindbad .qodef-content-grid,
.page-template-page-prix-samiraclub .qodef-content-grid,
.page-template-page-prix-khayamgarden .qodef-content-grid,
.page-template-page-nos-centres .qodef-content-grid,
.page-template-templatespage-prix-zodiac-php .qodef-content-grid,
.page-template-templatespage-prix-nahrawess-php .qodef-content-grid,
.page-template-templatespage-prix-omarkhayam-php .qodef-content-grid,
.page-template-templatespage-prix-lesultan-php .qodef-content-grid,
.page-template-templatespage-prix-thesindbad-php .qodef-content-grid,
.page-template-templatespage-prix-samiraclub-php .qodef-content-grid,
.page-template-templatespage-prix-khayamgarden-php .qodef-content-grid,
.page-template-templatespage-nos-centres-php .qodef-content-grid {
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important;
}

/* Container principal full width */
.page-template-page-prix-zodiac .qodef-page-content-section,
.page-template-page-prix-nahrawess .qodef-page-content-section,
.page-template-page-prix-omarkhayam .qodef-page-content-section,
.page-template-page-prix-lesultan .qodef-page-content-section,
.page-template-page-prix-thesindbad .qodef-page-content-section,
.page-template-page-prix-samiraclub .qodef-page-content-section,
.page-template-page-prix-khayamgarden .qodef-page-content-section,
.page-template-page-nos-centres .qodef-page-content-section,
.page-template-templatespage-prix-zodiac-php .qodef-page-content-section,
.page-template-templatespage-prix-nahrawess-php .qodef-page-content-section,
.page-template-templatespage-prix-omarkhayam-php .qodef-page-content-section,
.page-template-templatespage-prix-lesultan-php .qodef-page-content-section,
.page-template-templatespage-prix-thesindbad-php .qodef-page-content-section,
.page-template-templatespage-prix-samiraclub-php .qodef-page-content-section,
.page-template-templatespage-prix-khayamgarden-php .qodef-page-content-section,
.page-template-templatespage-nos-centres-php .qodef-page-content-section {
    padding: 0 !important;
    margin: 0 !important;
}

/* Article et contenu full width */
.page-template-page-prix-zodiac article,
.page-template-page-prix-nahrawess article,
.page-template-page-prix-omarkhayam article,
.page-template-page-prix-lesultan article,
.page-template-page-prix-thesindbad article,
.page-template-page-prix-samiraclub article,
.page-template-page-prix-khayamgarden article,
.page-template-page-nos-centres article,
.page-template-templatespage-prix-zodiac-php article,
.page-template-templatespage-prix-nahrawess-php article,
.page-template-templatespage-prix-omarkhayam-php article,
.page-template-templatespage-prix-lesultan-php article,
.page-template-templatespage-prix-thesindbad-php article,
.page-template-templatespage-prix-samiraclub-php article,
.page-template-templatespage-prix-khayamgarden-php article,
.page-template-templatespage-nos-centres-php article {
    padding: 0 !important;
    margin: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
}

/* Supprimer les marges du body pour ces pages */
.page-template-page-prix-zodiac #main,
.page-template-page-prix-nahrawess #main,
.page-template-page-prix-omarkhayam #main,
.page-template-page-prix-lesultan #main,
.page-template-page-prix-thesindbad #main,
.page-template-page-prix-samiraclub #main,
.page-template-page-prix-khayamgarden #main,
.page-template-page-nos-centres #main,
.page-template-templatespage-prix-zodiac-php #main,
.page-template-templatespage-prix-nahrawess-php #main,
.page-template-templatespage-prix-omarkhayam-php #main,
.page-template-templatespage-prix-lesultan-php #main,
.page-template-templatespage-prix-thesindbad-php #main,
.page-template-templatespage-prix-samiraclub-php #main,
.page-template-templatespage-prix-khayamgarden-php #main,
.page-template-templatespage-nos-centres-php #main {
    padding: 0 !important;
    margin: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
}


/* ============================================
   CORRECTION v1.2.8 - HEADER MOBILE
   Basé sur l'analyse du thème parent Reina
   ============================================ */

/* ============================================
   1. CACHER LE HEADER MOBILE REINA
   ID exact: #qodef-page-mobile-header
   ============================================ */

#qodef-page-mobile-header {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    max-height: 0 !important;
    overflow: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

/* ============================================
   2. FORCER LE HEADER DESKTOP À RESTER VISIBLE SUR MOBILE
   Annuler la règle du thème parent qui cache #qodef-page-header à 1024px
   ============================================ */

@media only screen and (max-width: 1024px) {
    /* Forcer le header desktop à rester visible */
    #qodef-page-header {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
    
    #qodef-page-header-inner {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
        flex-wrap: wrap !important;
        padding: 10px 15px !important;
    }
    
    /* Logo visible */
    .qodef-header-logo-link {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
    
    /* Navigation responsive */
    .qodef-header-navigation {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        width: 100% !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
        margin-top: 8px !important;
    }
    
    .qodef-header-navigation > ul {
        display: flex !important;
        flex-wrap: nowrap !important;
        gap: 5px !important;
        visibility: visible !important;
        opacity: 1 !important;
        justify-content: flex-start !important;
        padding-bottom: 5px !important;
    }
    
    .qodef-header-navigation > ul > li {
        display: inline-block !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
    
    .qodef-header-navigation > ul > li > a {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        padding: 8px 12px !important;
        font-size: 11px !important;
        white-space: nowrap !important;
    }
}

/* ============================================
   3. AJUSTEMENTS RESPONSIVE SPÉCIFIQUES
   ============================================ */

/* Tablettes (768px - 1024px) */
@media (min-width: 768px) and (max-width: 1024px) {
    #qodef-page-header-inner {
        padding: 12px 20px !important;
    }
    
    .qodef-header-navigation > ul > li > a {
        padding: 10px 15px !important;
        font-size: 12px !important;
    }
    
    .qodef-header-logo-link img {
        max-height: 55px !important;
    }
}

/* Mobile (max 767px) */
@media (max-width: 767px) {
    #qodef-page-header-inner {
        padding: 8px 10px !important;
    }
    
    .qodef-header-navigation > ul > li > a {
        padding: 6px 10px !important;
        font-size: 10px !important;
    }
    
    .qodef-header-logo-link img {
        max-height: 45px !important;
    }
}

/* Très petit mobile (max 480px) */
@media (max-width: 480px) {
    .qodef-header-navigation > ul > li > a {
        padding: 5px 8px !important;
        font-size: 9px !important;
    }
    
    .qodef-header-logo-link img {
        max-height: 40px !important;
    }
}

/* ============================================
   4. HEADER PAGES TEMPLATE (standard) - RESPONSIVE
   ============================================ */

@media only screen and (max-width: 1024px) {
    .qodef-header--standard #qodef-page-header {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        z-index: 999999 !important;
        background: #1a1a1a !important;
    }
    
    .qodef-header--standard #qodef-page-header-inner {
        padding: 10px 15px !important;
    }
    
    .qodef-header--standard .qodef-header-navigation > ul > li > a {
        color: #ffffff !important;
    }
    
    .qodef-header--standard .qodef-header-navigation > ul > li > a:hover {
        color: #c9a86c !important;
    }
    
    .qodef-header--standard #qodef-page-outer {
        padding-top: 100px !important;
    }
}

/* ============================================
   5. HEADER PAGE ACCUEIL (divided) - RESPONSIVE
   ============================================ */

@media only screen and (max-width: 1024px) {
    .qodef-header--divided #qodef-page-header {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        z-index: 999999 !important;
        background: rgba(26, 26, 26, 0.95) !important;
    }
    
    .qodef-header--divided #qodef-page-header-inner {
        padding: 10px 15px !important;
    }
    
    .qodef-header--divided .qodef-header-navigation > ul > li > a {
        color: #ffffff !important;
    }
    
    .qodef-header--divided .qodef-header-navigation > ul > li > a:hover {
        color: #c9a86c !important;
    }
    
    .qodef-header--divided #qodef-page-outer {
        padding-top: 90px !important;
    }
}