/*
 * Theme Name: Azuléo Zelliges 2025 (enfant) v0.01
 * Theme URI: https://azuleo.tsao-tsao.com
 * Description: Thème enfant basé sur Twenty Twenty-One, version PHP classique
 * Template: twentytwentyone
 * Author: Ghyslain Clement
 * Author URI: https://ghyslain-clement.fr
 * Version: 0.0.2
 * Text Domain: azuleo-2025
*/

:root {

    --wp--custom--layout--content-size: var(--wp--style--global--content-size);
    --wp--custom--layout--wide-size: var(--wp--style--global--wide-size);

    --wp--style--layout--content-size: var(--wp--style--global--content-size);
    --wp--style--layout--wide-size: var(--wp--style--global--wide-size);

    /* Surcharge les polices globales de Twenty Twenty-One */
    --global--font-primary: var(--wp--preset--font-family--roboto-flex) !important;
    --global--font-secondary: var(--wp--preset--font-family--roboto-flex) !important; /* Utilisez la même si vous voulez une police unique */

    --wp--custom--font-weight--thin: 100;
    --wp--custom--font-weight--extra-light: 200;
    --wp--custom--font-weight--light: 300;
    --wp--custom--font-weight--regular: 400;
    --wp--custom--font-weight--medium: 500;
    --wp--custom--font-weight--semi-bold: 600;
    --wp--custom--font-weight--bold: 700;
    --wp--custom--font-weight--extra-bold: 800;
    --wp--custom--font-weight--black: 900;
    --wp--custom--font-weight--extra-black: 1000;

    /*
    * référence n° 20250823-102800-8
    */
    --global--font-size-page-title: var(--wp--preset--font-size--xxx-large) !important;
    --global--font-size-base: var(--wp--preset--font-size--normal) !important;
    --global--font-size-xxl: var(--wp--preset--font-size--xx-large) !important;
    --global--font-size-xl: var(--wp--preset--font-size--x-large) !important;
    --global--font-size-lg: var(--wp--preset--font-size--large) !important;
    --global--color-background: var(--wp--preset--color--blanc) !important;
    
    --heading--font-weight: var(--wp--custom--font-weight--medium);

    --heading--font-family: var(--wp--preset--font-family--roboto-flex) !important;
    --heading--font-size-h1: var(--wp--preset--font-size--xx-large) !important;
    --heading--font-size-h2: var(--wp--preset--font-size--x-large) !important;
    --heading--font-size-h3: var(--wp--preset--font-size--large) !important;
    --heading--font-size-page-title: var(--wp--preset--font-size--xxx-large) !important;
    --heading--font-weight-page-title: var(--wp--custom--font-weight--medium) !important;
    
    --form--border-width: 1px !important;
    --form--border-color: #000000 !important;
    --form--border-radius: 3px !important;
}

/* Supprimer la largeur max par défaut sur les titres */
h1.default-max-width,
h2.default-max-width,
h3.default-max-width,
h4.default-max-width,
h5.default-max-width,
h6.default-max-width {
    max-width: none !important;
}

/* Appliquer le style alignwide */
h1.alignwide,
h2.alignwide,
h3.alignwide,
h4.alignwide,
h5.alignwide,
h6.alignwide {
    max-width: var(--wp--custom--layout--wide-size, 1280px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.page-header {
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    border-bottom: 0 !important;
}
/*
.page-title {
    margin-left: 10%;
    margin-bottom: var(--wp--preset--font-size--xx-large) !important;
}
*/
.entry-header {
    max-width: var(--wp--custom--layout--wide-size, 1280px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
}
/*
.entry-content {
    max-width: var(--wp--custom--layout--content-size, 1024px) !important;
    margin-left: auto !important;
    margin-right: auto !important; 
}
*/
.entry-content figure {
    margin-left: -30px;
}

.entry-content figure.size-large {
   margin:0 10% 0 10% !important;
}

html {
    box-sizing: border-box;
}

*, *::before, *::after {
    box-sizing: inherit;
}

/* La référence de la réponse est : 20250824-150240-33 */

/* 1. Assure que la page utilise la hauteur complète de l'écran */
html,
body {
    /* min-width: 320px; */
    height: 100%;
    margin: 0;
    padding: 0;
}

/* 2. Configure le corps de la page pour un agencement flexible */
body {
    display: flex; 
    flex-direction: column;
    min-height: 100vh;
}

/* 3. L'article grandit pour pousser le footer vers le bas */
/* Ajoute aussi une largeur de 100% pour que le contenu s'étire */
article {
    flex-grow: 1;
/*    width: 100%; */
}


/* 4. Le footer s'étire sur toute la largeur de l'écran et a une marge au-dessus */
footer {
    /* width: 100%; */
    margin-top: 75px;
}

.footer-menu-right,
.footer-menu-left,
.footer-menu-right li,
.footer-menu-left li {
    /* color:white !important; */
    color:#e9e6df;
    /* color: var(--wp--preset--color--super-blanc) !important; */
}

footer a {
    color:white !important;
}

.footer-container {
    display: flex;
    flex-direction: row;
    margin-top:var(--wp--preset--spacing--20);
    margin-bottom:var(--wp--preset--spacing--20);
    padding-top:var(--wp--preset--spacing--20);
    padding-right:var(--wp--preset--spacing--30);
    padding-bottom:var(--wp--preset--spacing--20);
    padding-left:var(--wp--preset--spacing--30);
    /* margin-bottom: 20px !important; */
}


/* 3. Optionnel : Si vous voulez être plus spécifique et ne cibler que les divs ayant cette classe */

body > div.alignfull:nth-last-child(2) {
    flex-grow: 1;
}
/*
body {
    background-color: #ffffff !important; 
}
*/

/* html, body { */
/*    overflow-x: hidden; /* Cache la barre de défilement horizontale sur les deux éléments */
/*    overflow-y: hidden; /* Cache la barre de défilement horizontale sur les deux éléments */
/* } */

a {
    text-decoration: none !important;
}

.entry {
    flex-grow: 1;
    width: 100%;
}

/*
 * Référence: 20250822-134255-1
 * Corrige les styles de titre pour qu'ils soient prioritaires.
 */
h1.page-title,
h1.entry-title {
    font-family: var(--wp--preset--font-family--roboto-flex) !important;
    font-size: var(--wp--preset--font-size--xxx-large) !important;
    font-weight: var(--wp--custom--font-weight--medium) !important;
    /* margin-bottom: var(--wp--preset--spacing--x-large); */
}


h2.entry-title {
    font-family: var(--wp--preset--font-family--roboto-flex) !important;
    font-size: var(--wp--preset--font-size--xx-large) !important;
    font-weight: var(--wp--custom--font-weight--regular) !important;
}

h3.entry-title {
    font-family: var(--wp--preset--font-family--roboto-flex) !important;
    font-size: var(--wp--preset--font-size--large) !important;
    font-weight: var(--wp--custom--font-weight--regular) !important;
}

.singular .entry-header {
    all: revert !important;
    border-bottom: 0 !important;
    margin-bottom: 10px !important;
    padding-bottom: 0 !important;
}

div.entry-content {
    /* margin: 0 10% 0 10%; */
    margin:0;
}

/*
h1.indented-title {
    font-size: var(--wp--preset--font-size--xxx-large) !important;
}
*/

h1.wp-block-heading {
    /* Ajustez ces valeurs pour obtenir le comportement désiré */
    /* clamp(taille_minimale, taille_flexible_vw, taille_maximale); */
    font-size: clamp(2rem, 5vw, 4rem) !important;
}

.wp-site-blocks {
    background-color: #FFFFFF !important;
}

/* Assurer que les blocs respectent les tailles définies */
.entry-content > * {
    max-width: var(--wp--style--global--content-size);
    margin-left: auto;
    margin-right: auto;
}

.entry-content .alignfull {
    max-width: none;
    width: 100%;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
}

.entry-content > .alignwide {
    max-width: var(--wp--style--global--wide-size);
}

/* Style pour les blocs avec la classe 'aligncontent' */
.aligncontent {
    max-width: var(--wp--style--global--content-size); /* Ceci force la largeur à 1024px */
    margin-left: auto;
    margin-right: auto;
    padding:0px !important;
}

/* Styles pour les blocs "alignwide" et "alignfull" */
.wp-block[data-align="wide"] {
    max-width: var(--wp--custom--layout--wide-size);
    margin-left: auto;
    margin-right: auto;
}

.wp-block[data-align="full"] {
    max-width: none; /* Annule toute limitation de largeur */
    width: 100%; /* Prend toute la largeur de la vue */
    margin-left: calc(50% - 50vw); /* Centre le bloc sur toute la largeur */
    margin-right: calc(50% - 50vw);
}

/* Assurez-vous que le contenu standard utilise contentSize */
.wp-block:not([data-align="wide"]):not([data-align="full"]) {
    max-width: var(--wp--custom--layout--content-size);
    margin-left: auto;
    margin-right: auto;
}

.wp-site-blocks > .alignwide,
.wp-site-blocks > .aligncontent {
    padding-left: clamp(1rem, 4vw, 2rem);
    padding-right: clamp(1rem, 4vw, 2rem);
}

.is-layout-constrained > .alignwide {
    /* max-width: min(var(--wp--style--global--wide-size), calc(100vw - 3rem)) !important; */
    /* Assurez-vous qu'ils se centrent */
    margin-left: auto !important;
    margin-right: auto !important;
}

/* Cibler le bloc alignwide à l'intérieur de la section alignfull */
.alignfull > .alignwide {
    /* Le padding fluide résout le problème du texte collé aux bords */
    padding-left: clamp(1rem, 4vw, 2rem);
    padding-right: clamp(1rem, 4vw, 2rem);
    
    /* box-sizing est toujours recommandé ici */
    box-sizing: border-box; 
}
/*
.is-layout-constrained > :not(.alignfull) {
    max-width: none !important;
}
*/

h2 .style-guide-title {
	margin:1rem;
}

hr .style-guide-title {
	margin:1rem;
}

h1.wp-block-heading {
	font-size: 4rem;
	text-indent: 3em hanging;
}

h1.wp-block-heading>span {
	white-space: nowrap;
}

/* référence n° 20250725-090138-3 */
p:last-child {
    margin-bottom: 0 !important; /* Force la suppression de la marge */
}

.has-text-align-left {
    text-align: left;
}
.has-text-align-center {
    text-align: center;
}
.has-text-align-right {
    text-align: right;
}

.has-text-align-justify {
    text-align: justify !important;
}

.wp-block-paragraph.has-text-align-justify {
    text-align: justify !important;
}

/* Pour tous les blocs de texte */
.has-text-align-justify p {
    text-align: justify !important;
}

.wp-block-navigation {
	display: flex;
    gap: 20px;
}

.wp-block-navigation li {
    list-style: none;
}

/* Cibler spécifiquement les liens dans un menu de footer */
/*
.wp-block-navigation a {
/*    color: #FFFFFF; */
/*    color: var(--wp--preset--color--blanc);
    fill:white;
}
*/
/* Cibler spécifiquement les liens dans un menu de footer */
/*
.wp-block-navigation a img {
    width: 35px;
    max-height: 37px;
}
*/
/* Cible uniquement les images du menu social */
.social-icon {
    width: 35px;
    max-height: 37px;
}


/* Si les éléments de liste ont aussi besoin d'être blancs (rare pour le texte des <li>, mais possible) */
.wp-block-navigation li {
    color: #FFFFFF;
}

/* Vous pouvez aussi cibler le texte global de la zone de navigation du footer */
.wp-block-navigation {
    color: black;
    padding: 0;
}

/* Menu en blanc pour fond vidéo */
.entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator) {
    max-width: var(--wp--custom--layout--content-size) !important;
    margin-left: auto;
    margin-right: auto;

}

/* === AJOUT : Redimensionnement des icônes === */
/*
#icon-menu-header img {
    width: 35px;
    max-width: 35px; /* Ajuste cette valeur selon tes besoins */
/*    height: auto;
    display: block;
}
*/
/* Icônes proportionnelles à la largeur d'écran (comme le logo) */

#icon-menu-header img {
    width: 2.5vw; /* 2.5% de la largeur de l'écran */
    height: auto;
    min-width: 24px; /* Ne pas descendre en dessous de 24px */
    max-width: 40px; /* Ne pas dépasser 40px */
}

/* Espacement entre les icônes */
#icon-menu-header .menu-item {
    margin: 0 10px;
}

/* Responsive : icônes plus petites sur tablette */
/*
@media (max-width: 768px) {
    #icon-menu-header img {
        max-width: 28px;
    }
    
    #icon-menu-header .menu-item {
        margin: 0 6px;
    }
}
*/
/* Responsive : icônes encore plus petites sur mobile */
/*
@media (max-width: 480px) {
    #icon-menu-header img {
        max-width: 24px;
    }
    
    #icon-menu-header .menu-item {
        margin: 0 4px;
    }
}
*/
#word-menu-header a {
	font-size: var(--global--font-size-lg);
}

/* référence n° 20250730-092405-8 */

/* Styles pour le menu principal et les sous-menus */
.submenu-list {
   /* list-style: none; /* Supprime les puces du menu principal */
    padding: 10px 15px; /* Assure que le padding n'ajoute pas d'espace non désiré */
    margin: 0; /* Assure que la marge n'ajoute pas d'espace non désiré */
    gap: var(--wp--preset--spacing--40); /* Augmente le gap du menu principal */
}

/* Cache tous les sous-menus */
.submenu-list .sub-menu {
    display: none;
    position: absolute;
    background-color: rgba(233, 230, 223, 0.9); /* Couleur de fond pour le sous-menu */
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.3); /* Ombre légère */
    z-index: 999; /* Assure que le sous-menu est au-dessus du contenu */
    flex-direction: column; /* Pour afficher les éléments de sous-menu en colonne */
    align-items: flex-end;
    gap: 0; /* Réinitialise le gap si défini par le parent */
    list-style: none; /* Supprime les puces des sous-menus */
    padding: 0; /* Réinitialise le padding pour les sous-menus */
    margin: 0; /* Réinitialise la marge pour les sous-menus */
}

.submenu-list.menu-video .sub-menu {
    background-color: rgba(233, 230, 223, 0.9) !important; /* Couleur de fond pour le sous-menu */
  /*  z-index: 9999 !important; /* Assure que le sous-menu est au-dessus du contenu */
}

/* .submenu-list.menu-normal .sub-menu {
    /* background-color: rgba(255, 255, 255, 0.9) !important; /* Couleur de fond pour le sous-menu */
    /* z-index: 9999 !important; /* Assure que le sous-menu est au-dessus du contenu */
/* }

/* Affiche le sous-menu quand la classe 'active' est présente */
.submenu-list .menu-item-has-children.active > .sub-menu {
    display: flex;
}

/* Styles pour les éléments de menu principaux qui ont des sous-menus */
.submenu-list .menu-item-has-children {
    position: relative; /* Nécessaire pour positionner les sous-menus absolument */
}

.submenu-list .sub-menu li {
    width:100%;
    text-align: right;
}

/* Ajustements pour les liens des sous-menus */
.submenu-list .sub-menu a {
    padding: 10px 15px;
    text-decoration: none;
    display: block; /* Chaque lien prend toute la largeur disponible */
    white-space: nowrap; /* Empêche le texte de se couper */
}

.submenu-list .sub-menu a:hover {
    background-color: #8f8f8f;
}

/* référence n° 20250801-072221-21 */

    /* Ajuste l'espacement et met le texte en majuscules */ 
.wp-block-navigation.-menu,
.woocommerce-MyAccount-navigation {
    gap: 30px; /* Augmente l'écart entre les éléments de 30px */
}

.wp-block-navigation.-menu > li > a
.woocommerce-MyAccount-navigation > li > a {
    text-transform: uppercase !important; /* Met le texte des liens en majuscules */
}

:where(.wp-block-columns) {
	/* margin-bottom: 0 !important; */
}

p {
  /*
  * référence n° 20250823-101631-6
  */
  font-size: var(--wp--preset--font-size--normal);
}

.footer-menu-center figure {
    margin-top: 10px;
    padding-left: 40px;
}

.footer-social-txt {
    margin-bottom: 0.75em;
    color: #ffffff;
    font-size: var(--wp--preset--font-size--medium);
}

input[type="text"] {
    border: 1px solid black !important;
    border-radius: 4px !important;
}

@media (max-width: 768px) {

/*
 * référence n° 20250823-104936-10
 */

    .footer-container {
        flex-direction: column;
    }

    .footer-menu-right {
        order: 1; /* Apparaît en premier */
    }

    .footer-menu-left {
        order: 2; /* Apparaît en deuxième */
    }

    .footer-menu-center {
        order: 3; /* Apparaît en troisième */
    }

/*
 * référence n° 20250823-111143-12
 */
  /* Centre la liste ul et ses éléments li */
  .footer-menu-right ul,
  .footer-menu-left ul,
  .footer-menu-center ul {
    justify-content: center; /* Pour un flexbox */
    text-align: center;      /* Pour les navigateurs plus anciens */
    width: 100%;             /* S'assure que la liste prend toute la largeur */
  }

  /* Centre les éléments de la liste */
  .footer-menu-right li,
  .footer-menu-left li,
  .footer-menu-center li {
    text-align: center;
    justify-content: center; /* Au cas où les li seraient des flexbox */
  }
  
  /* Assurez-vous que le conteneur est un flexbox en colonne */
  .footer-menu-center div {
    display: flex;
    flex-direction: column;
  }
    /*
     * Le `<figure>` a une valeur d'ordre plus élevée pour le placer en bas.
     * La valeur '99' est arbitraire, mais elle doit être plus grande
     * que l'ordre des autres éléments pour les positionner au-dessus.
     */
    .footer-menu-center figure {
        margin-top: 40px;
        order: 99;
    }
}
 /*******************************************/
 
/* référence n° 20250823-164042-72 */
/* Styles pour masquer le bouton hamburger sur grand écran */
.nav-toggle {
    display: none;
}


.div-sep-breadcrumb {
	height: var(--wp--preset--spacing--base);
}

/* Styles pour le bouton hamburger sur les écrans mobiles */
@media (max-width: 768px) {
    /* Masque le menu de pages */
    #word-menu-header {
        display: none !important;
    }
    
    /* Affiche l'icône du hamburger */
    .nav-toggle {
        display: block !important;
        cursor: pointer;
    }

   /* Styles pour l'icône à trois barres */
    .nav-toggle img {
        width: 30px;
        height: auto;
    }

    /* Affiche le menu de pages lorsque le bouton est cliqué */
    #word-menu-header.is-open {
        display: block !important;
/*        position: absolute;
        top: 100%;
        left: 0;
        width: 100%; */
        float: right;

/*         background-color: rgba(8, 18, 66, 0.8); */
        background-color: rgba(255, 255, 255, 0.8); /* Couleur de fond pour le sous-menu */
        box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.3); /* Ombre légère */
        z-index: 999;
    }

    /* Styles pour les éléments de la liste de menu */
    #word-menu-header ul {
        list-style: none;
        padding: 0;
        margin: 0;
        display: flex;
        flex-direction: column; /* Affiche les éléments en colonne */
    }

    /* Cache les sous-menus par défaut sur les mobiles */
    #word-menu-header .sub-menu {
/*        position: static; /* Annule la position absolue */
        padding-left: 15px; /* Ajoute un décalage pour les distinguer */
        position: absolute;
        right: 10px;
        top: 40px;
/*        width: 150px; /* Ou la largeur que vous souhaitez */
/*        background-color: white;
        border: 1px solid #ccc;
        box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); */
        box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.3); /* Ombre légère */
        z-index: 1000;
        display: none; /* Toujours caché par défaut */
    }


    /* Affiche les sous-menus au clic sur les mobiles */
    /* #word-menu-header .menu-item-has-children.is-open > .sub-menu { */
    #word-menu-header .menu-item-has-children.active > .sub-menu {
        display: block;
    }
    
    /* .submenu-list.menu-video { */
    /*    background-color: rgba(8, 18, 66, 0.8); /* Couleur de fond pour le sous-menu */
    /*    background-color: rgba(255, 255, 255, 0.8); /* Blanc avec opacité */
    /* } */

    /* Règle pour les pages spécifiques où le menu doit être blanc */
    body.home #word-menu-header,
    body.search #word-menu-header,
    body.error404 #word-menu-header {
        background-color: rgba(230, 233, 223, 0.8);
        box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.3); /* Ombre légère */
    }
}

of-breadcrumb {
    width: 100% !important;
}

body.single-post .entry-header .entry-title {
    display: none;
}

.wp-block-latest-posts__post-title,
.wp-block-latest-posts > li > *:first-child {
    font-size: var(--global--font-size-lg) !important;
}

.wp-block-latest-posts__post-excerpt {
    margin: 0 10% 0 10% !important;
}
/***
  * règlages css pour modification du menu de woocommerce
  ***/
/*
.woocommerce-MyAccount-navigation {

}
*/
/*******************************************/

@media (max-width: 768px) {
    /* Cible les listes et sous-listes du sitemap */
    .entry-content ul,
    .wsp-container ul {
        /* Diminue l'indentation pour les écrans de moins de 768px de large */
        padding-left: 30px !important;
    }

    h1.wp-block-heading {
        font-size: 2.5rem;
        text-indent: 0 hanging;
    }

    /* Cibler spécifiquement les liens dans un menu de footer */

    .wp-block-navigation a img {
        width:25px;
        height:25px;
    }

    .submenu-list {
        display: flex;
        flex-direction: column;
        padding-left: 15px;
    }
}

@media (max-width: 512px) {
    /* Cible les listes et sous-listes du sitemap */
    .entry-content ul,
    .wsp-container ul {
        /* Diminue l'indentation pour les écrans de moins de 768px de large */
        padding-left: 20px !important;
    }

    .entry-content p {
        margin-left: 8% !important;
        margin-right: 8% !important; 
    }

    h1.wp-block-heading {
        font-size: 1.8rem;
        text-indent: 1.5em hanging;
    }
}

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

    .alignfull, .full-max-width {
        width: 100% !important;
    }

    .entry-content p {
        margin-left: 10% !important;
        margin-right: 10% !important; 
    }
}

@media (max-width: 768px) {
    /* ... (code existant omis) ... */

    /* CORRECTION : Rendre le menu principal vertical (wp-block-navigation est le conteneur Flex) */
     #word-menu-header .submenu-list {
        padding-left: 15px;
        gap:0;
     }
/*
    .submenu-list {
        display: flex;
        flex-direction: column;
        position: absolute;
        right: 0;
        top: 0;
    }
*/
    /* Chaque élément li prend toute la largeur du container */
    .submenu-list li {
        width: 100%;
    }

    /* NOUVELLES RÈGLES : li 100% + ferrage droit */
    .submenu-list li a {
        width: 100%;
        padding: 10px 15px;
        text-align: right;
        display: block; 
    }

    .submenu-list a:hover {
        background-color: #8f8f8f;
    }

    /* NOUVELLE RÈGLE : couleur hover grise */
    .submenu-list li:hover {
        background-color: #f0f0f0;
    }
}

/* Header responsive : passage en colonne sur mobile */
@media (max-width: 768px) {
    /* Change la direction du header */

    .wp-block-group.alignwide .wp-block-columns {
        flex-direction: column !important;
    }
/*
    .wp-block-group.alignwide > .wp-block-columns {
        flex-direction: column !important;
        align-items: center !important;
    }
    */
    /* Logo centré, prend toute la largeur */
    .wp-block-group.alignwide .wp-block-column:first-child {
        flex-basis: 100% !important;
        text-align: center;
        margin-bottom: 20px !important;
    }
    
    /* Logo plus petit sur mobile */
/*
    .wp-block-group.alignwide .wp-block-column:first-child img {
        width: 60% !important;
        margin: 20px auto !important;
    }
    */
    /* Menu centré, prend toute la largeur */
    /*
    #icon-menu-header {
        flex-basis: 100% !important;
        justify-content: center !important;
    } */
}

/* Version encore plus petite pour très petits écrans */
/*
@media (max-width: 480px) {
    .wp-block-group.alignwide .wp-block-column:first-child img {
        width: 50% !important;
        margin: 10px auto !important;
    }
}
*/
/*
.logo-column {
    flex-basis: 60%;
    margin-bottom: 0 !important;
}
*/
.logo-column img {
/*    width: 80% !important;
    height: auto;
    margin: 40px;*/
}

/* Conteneur du header avec icônes et logo */
.header-columns {
    display: flex;
/*    align-items: center; */
    justify-content: space-between;
    padding-top: var(--wp--preset--spacing--20);
    padding-bottom: var(--wp--preset--spacing--20);
    padding-left: 0; /* Pas de marge gauche */
    padding-right: 0; /* Pas de marge droite */
    z-index: 999;
}

/* Colonne du logo */
.logo-column {
    flex-basis: 60%;
    margin-bottom: 0 !important;
    padding: 40px 0; /* Espacement vertical uniquement */
}

/* Image du logo */
.logo-column img {
    width: 80% !important;
    height: auto;
    margin: 0; /* Plus de marge autour */
}

/* Media query - SIMPLE */

@media (max-width: 768px) {
    .logo-column {
        flex-basis: 100%;
        text-align: center;
    }
}

@media (max-width: 768px) {
    .logo-column {
        flex-basis: 100% !important;
        min-width: 100%; /* Force la largeur sur Firefox */
    }
}

/* Menu de navigation avec mots */
#word-menu-header {
    flex-basis: 30%;
    z-index: 999;
    display: flex;
    justify-content: center;
}

#word-menu-header ul {
    padding: 0 !important;
}
/* Mobile : menu caché par défaut */
/*
@media (max-width: 768px) {
    #word-menu-header {
        position: fixed;
        top: 80px; /* Ajuste selon la hauteur de ton header */
/*        left: 0;
        right: 0;
        width: 100%;
        height: calc(100vh - 80px);
        background: white;
        z-index: 9998;
        display: none; /* Caché par défaut */
/*        flex-direction: column;
        justify-content: flex-start;
        padding: 20px;
        overflow-y: auto;
    }
    
    /* Quand le menu est ouvert */
/*    #word-menu-header.open {
        display: flex;
    }
}
*/
/* Mobile : positionner le menu sous le header */
@media (max-width: 768px) {
    #word-menu-header {
        position: absolute;
        top: 100%;
        right:0;
    }
}

 /* Juste sous le header */
/*        left: 0;
        right: 0;
        width: 100%;
        background: white;
        z-index: 9998;
        padding: 20px;
        box-shadow: 0 4px 10px rgba(0,0,0,0.2);
*/

/* Mobile < 768px : taille fixe petite */
@media (max-width: 768px) {
    #word-menu-header ul li a {
        font-size: 22px;
    }
}

/* Tablet 768-1200px : clamp() actif */
@media (min-width: 768px) and (max-width: 1280px) {
    #word-menu-header ul li a {
        font-size: clamp(24px, 2.5vw, 32px);
    }
}

/* Desktop > 1200px : taille fixe grande */
@media (min-width: 1280px) {
    #word-menu-header ul li a {
        font-size: 32px;
    }
}

/* Desktop > 1200px : taille fixe grande */
@media (max-width: 480px) {
    #word-menu-header ul li a {
        font-size: 18px;
    }
}

/* Desktop > 1200px : taille fixe grande */
@media (max-width: 360px) {
    #word-menu-header ul li a {
        font-size: 16px;
    }
}

#word-menu-header .menu-video.submenu-list {
    padding: 0 10px !important;
}

/* ============================================
   MÉTADONNÉES D'ARTICLE (date, auteur, catégories)
   Référence : 20251212-post-meta-footer
   ============================================ */

/* ============================================
   MÉTADONNÉES D'ARTICLE (date, auteur, catégories)
   Référence : 20251212-post-meta-footer
   ============================================ */

/* Lien de l'auteur (dans .byline) */
.entry-footer .byline a {
    color: #0073aa !important;
}

.entry-footer .byline a:hover {
    color: #005177 !important;
}

/* Lien "Modifier" */
.entry-footer .edit-link a,
.entry-footer .post-edit-link {
    color: #d63638 !important; /* Rouge pour Modifier */
}

.entry-footer .edit-link a:hover,
.entry-footer .post-edit-link:hover {
    color: #a02020 !important;
}

/* Liens des catégories */
.entry-footer .cat-links a {
    color: #0073aa !important;
}

.entry-footer .cat-links a:hover {
    color: #005177 !important;
}

/* Liens des tags (si vous en avez) */
.entry-footer .tags-links a {
    color: #0073aa !important;
}

.entry-footer .tags-links a:hover {
    color: #005177 !important;
}