/* 
 ██████  ██       ██████  ██████   █████  ██      
██       ██      ██    ██ ██   ██ ██   ██ ██      
██   ███ ██      ██    ██ ██████  ███████ ██      
██    ██ ██      ██    ██ ██   ██ ██   ██ ██      
 ██████  ███████  ██████  ██████  ██   ██ ███████  */
                                                  
html {
    --header-bottom: var(--wp-admin--admin-bar--height, 0px); /* Surchargé par theme_builder.php si sticky header activé pour ajuster */
    scroll-behavior: smooth;
    scroll-padding-top: calc(var(--header-bottom) + 30px);        
}

button, .elementor-button, .elementor-button-link {
    cursor: pointer;
}

/* Animation de fermeture */
/* Utilisé par bouton de fermeture d'un element Elementor */
.informapic-slump {
    transition : opacity .3s ease, transform .3s ease !important;
    opacity    : 0 !important;
    transform  : scale(.8)!important;
    pointer-events : none;
}

/* 
 ██████  ██      ██████       ██████  ██       ██████  ██████   █████  ██      
██    ██ ██      ██   ██     ██       ██      ██    ██ ██   ██ ██   ██ ██      
██    ██ ██      ██   ██     ██   ███ ██      ██    ██ ██████  ███████ ██      
██    ██ ██      ██   ██     ██    ██ ██      ██    ██ ██   ██ ██   ██ ██      
 ██████  ███████ ██████       ██████  ███████  ██████  ██████  ██   ██ ███████  */                                                           
                                                                               
@keyframes fadeIn {
	to {
		opacity: 1;
	}
}
main#content{
  opacity: 0;
  animation: fadeIn .5s ease-in forwards;
	animation-delay: .7s;
}

/* Titre de page */
.page-header .entry-title{
	font-size: 3em;
	text-align: center;
	font-family: var(--e-global-typography-accent-font-family);
}

.p-no-margin p {
    margin: 0 !important;
}

/* PLUGINS BASE */
.forminator-input,.forminator-textarea{
	border-radius: 5px!important;
	background-color: #f7f6f6!important;
}

/* BLOG POST */
.htbuilder-post-area img{
	max-height: 100px;
	width: auto;
}
.post-navigation{
	display: flex;
	justify-content: space-between;
}
.post-navigation .next-post{
	text-align: right;
}
.elementor-widget-bl-post-featured-image img{
	max-height: 300px;
    object-fit: cover;
}

/* ARCHIVE TEMPLATE */
:is(.archive,.search) .page-header .entry-title {
		text-decoration: underline;
		margin-bottom: 50px;
		font-size: 2em!important;
}
:is(.archive,.search) article .entry-title{
	font-size : 2em!important;
}
:is(.archive,.search) article{
		border-bottom: 1px dashed;
		padding: 20px 0;
		text-align: center;
}
:is(.archive,.search) article .wp-post-image{
		max-width: 200px;
		max-height: 100px;
    object-fit: contain;
		object-position: center center;
		margin: 10px 0;
}


/*  
███████ ██ ██   ██ ███████     
██      ██  ██ ██  ██          
█████   ██   ███   ███████     
██      ██  ██ ██       ██     
██      ██ ██   ██ ███████                             
*/


/* Corrige le max-width de la zone de commentaires pour les pages */
.page #comments,
.page .comments-area {
    margin: 0 auto;
    max-width: min(100%, 1140px);
}

/************************/
/*      HTMEGA NAV      */
/************************/
.htbuilder-nav ul > li > ul, .htbuilder-nav ul > li > ul > li{
	min-width: max-content;
	width: auto;
}

.htbuilder-nav ul .sub-menu{
	border-radius: 5px;
}

/* HTMEGA Menu */
.htbuilder-nav .htbuilder-mainmenu > .menu-item-has-children > a:after {
  content: "";
  display: inline-block;
  height: 10px;
  width: 10px;
  position: absolute;
  margin-left: -45%;
  margin-top: 1.5em;
  background-color: var(--e-global-color-primary);
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26 16.043'%3E%3Cpath d='M0.5,3.022L13,15.522L25.5,3.022L23,0.522L13,10.522L3,0.522L0.5,3.022z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26 16.043'%3E%3Cpath d='M0.5,3.022L13,15.522L25.5,3.022L23,0.522L13,10.522L3,0.522L0.5,3.022z'/%3E%3C/svg%3E");
  -webkit-mask-size: contain;
  mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
}

:is(.current-menu-item,.current-menu-ancestor) > a{
	color: var(--e-global-color-accent);
}

.htbuilder-nav ul .sub-menu li a i:is(.fa,.fas){
	font-size: 20px;
	margin-right: 10px;
}

/* MOBILE NAVIGATION */
.htbuilder-mobile-close{
	right: 0;
	left: unset;
}
.htbuilder-mobile-menu{ 
	padding: 0;
}
.htbuilder-mobile-menu-area{
	height: fit-content;
	min-height: 100px;	
	width: 100%;
	border-bottom: 5px solid var(--e-global-color-accent);
}
.htbuilder-mobile-menu ul li a{
	border-bottom: 1px dotted var( --e-global-color-primary);
	display: block;
	padding-left: 30px;
	color: var(--e-global-color-text);
	line-height: 40px;
}
.htbuilder-mobile-menu ul :is(li a:hover, li.menu-item.active > a){
	border-left: 10px solid var(--e-global-color-accent);
	padding-left: 20px;
	color: var(--e-global-color-accent);
}
.htbuilder-mobile-menu .sub-menu li a {
	margin-left: 8px;
	padding-left: 28px;
	border-left: 2px solid var(--e-global-color-accent);
}
.htbuilder-mobile-menu .menu-expand{
	left: 3px;
	top: -1px;
	color: var(--e-global-color-accent);
}
/* Corrige le menu HTMEGA pour que les sous-menu soient accessibles via la touche "tab" */
.htbuilder-nav .menu-item-has-children:focus-within .sub-menu {
    opacity: 1 !important;
    visibility: visible !important;
}

/* Corrige le z-index des nav-menu HTMEGA */
.e-con:has(.htbuilder-nav li:hover),
.e-con:has(.htbuilder-nav li:focus-within) {
    z-index: 100;
}

/* Sous-menu basculé à gauche */
.htbuilder-nav .sub-menu.flip-left {
	left: auto !important;
	right: 100% !important;
}
/* 1er niveau : aligné sur le bord droit du parent */
.htbuilder-mainmenu > li > .sub-menu.flip-left {
	right: 0 !important;
}

/* Retour à la ligne quand il n'y a pas assez de place */
.htbuilder-nav .sub-menu.wrap {
	width: max-content !important;
	max-width: var(--space) !important;
	min-width: min-content !important;
}
.htbuilder-nav .sub-menu.wrap > li {
	min-width: auto !important;
}

/************************/
/*      HTMEGA MODAL    */
/************************/
/* Corrige le z-index de la modal HTMEGA */
.htmega-modal-area{
	z-index: 9999!important;
}
.htb-tooltip{
	width: max-content;
}


/* 
██     ██  ██████   ██████   ██████  ██████  ███    ███ ███    ███ ███████ ██████   ██████ ███████     
██     ██ ██    ██ ██    ██ ██      ██    ██ ████  ████ ████  ████ ██      ██   ██ ██      ██          
██  █  ██ ██    ██ ██    ██ ██      ██    ██ ██ ████ ██ ██ ████ ██ █████   ██████  ██      █████       
██ ███ ██ ██    ██ ██    ██ ██      ██    ██ ██  ██  ██ ██  ██  ██ ██      ██   ██ ██      ██          
 ███ ███   ██████   ██████   ██████  ██████  ██      ██ ██      ██ ███████ ██   ██  ██████ ███████                                                                                                  
  */

/* Applique le style Hello aussi pour les pages produits en Elementor */
body.single-product .site-main {
    margin-inline-end: auto;
    margin-inline-start: auto;
    width: 100%;
}
@media (max-width: 575px) {
    body.single-product .site-main {
        padding-inline-end: 10px;
        padding-inline-start: 10px;
    }
}
@media (min-width: 576px) {
    body.single-product .site-main {
        max-width: 500px;
    }
}
@media (min-width: 768px) {
    body.single-product .site-main {
        max-width: 600px;
    }
}
@media (min-width: 992px) {
    body.single-product .site-main {
        max-width: 800px;
    }
}
@media (min-width: 1200px) {
    body.single-product .site-main {
        max-width: 1140px;
    }
}


/* 
███    ███  ██████  ██████   █████  ██      
████  ████ ██    ██ ██   ██ ██   ██ ██      
██ ████ ██ ██    ██ ██   ██ ███████ ██      
██  ██  ██ ██    ██ ██   ██ ██   ██ ██      
██      ██  ██████  ██████  ██   ██ ███████  */

dialog {
	color: var(--e-global-color-text);
}

/* Le <dialog> ne porte ni overflow ni border-radius (suspects du bug Safari) */
.informapic-modal {
	border: none;
	padding: 0;
	text-align: left;
	background: none;
	overflow: visible;
}

.informapic-modal::backdrop {
	background: rgba(0, 0, 0, 0.5);
}

/* L'arrondi est porté par le conteneur interne */
.informapic-modal .modal-container {
	display: flex;
	flex-direction: column;
	width: 100%;
	border-radius: 5px;
	overflow: hidden;
}

.informapic-modal .header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	border-bottom: 2px solid silver;
	background: white;
}

.informapic-modal .header .title {
	flex-grow: 2;
}

.informapic-modal .title,
.informapic-modal .content {
	padding: 10px;
}

.informapic-modal .close i.fas {
	pointer-events: none;
}

.informapic-modal .buttons {
	display: flex;
	flex-direction: row-reverse;
}

.informapic-modal .content {
	max-height: 80vh;
	overflow-y: auto;
	background: white;
}

.informapic-modal .content iframe {
	display: block;
	max-width: 100%;
	border: 0;
}

.informapic-modal .header:has(.no-title) {
	background: transparent !important;
	border: none !important;
}

/* Plein écran (règles séparées : une règle invalide annulerait l'autre si groupées) */
.informapic-modal .modal-container:fullscreen .content {
	max-height: 100%;
}
.informapic-modal .modal-container:fullscreen {
	border-radius: 0;
}
.informapic-modal .modal-container:-webkit-full-screen .content {
	max-height: 100%;
}
.informapic-modal .modal-container:-webkit-full-screen {
	border-radius: 0;
}

/* SURCHARGE GLOBAL-MODAL */
body:has(.global-modal[open]) {
	overflow: hidden;
}

.global-modal {
	background: none;
	width: 100% !important; /* pour surcharger la largeur du widget */
	height: 100%;
	max-width: 100%;
	max-height: 100%;
	border-radius: 0;
}

.global-modal .modal-container {
	height: 100%;
	border-radius: 0;
}

.global-modal .no-title + .buttons {
	position: fixed;
	top: 0;
	right: 0;
	z-index: 1; /* pour passer au-dessus de .content */
}

.global-modal .buttons button {
	width: 40px;
	height: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
	border: none;
	border-radius: 0;
	background-color: #3b3b3bff;
}

.global-modal .buttons button.close {
	background-color: red;
}

.global-modal .content {
	width: 100%;
	height: 100%;
	max-height: 100%;
	padding: 0;
	margin: auto;
}

.global-modal iframe {
	width: 100%;
	border: none;
}

/* Animation désactivée tant que le rendu Safari n'est pas validé */
.informapic-modal[open] .modal-container {
	animation: none;
    /* animation: modal-in 0.25s ease-out; */
}

@keyframes modal-in {
    from {
        opacity: 0;
        transform: translateY(-20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}


/* 
 █████  ██████  ███    ███ ██ ███    ██     ██████   █████  ██████  
██   ██ ██   ██ ████  ████ ██ ████   ██     ██   ██ ██   ██ ██   ██ 
███████ ██   ██ ██ ████ ██ ██ ██ ██  ██     ██████  ███████ ██████  
██   ██ ██   ██ ██  ██  ██ ██ ██  ██ ██     ██   ██ ██   ██ ██   ██ 
██   ██ ██████  ██      ██ ██ ██   ████     ██████  ██   ██ ██   ██  */

#wpadminbar .ab-submenu + .ab-submenu {
    padding: 0;
}

#wp-admin-bar-wpfc-toolbar-parent { 
    display: none; 
}


/* 
███████ ██      ███████ ███    ███ ███████ ███    ██ ████████  ██████  ██████  
██      ██      ██      ████  ████ ██      ████   ██    ██    ██    ██ ██   ██ 
█████   ██      █████   ██ ████ ██ █████   ██ ██  ██    ██    ██    ██ ██████  
██      ██      ██      ██  ██  ██ ██      ██  ██ ██    ██    ██    ██ ██   ██ 
███████ ███████ ███████ ██      ██ ███████ ██   ████    ██     ██████  ██   ██  */
                                                                               
                                                                               

/* TODO -> metter dans customizer */
.elementor-add-section-inner :is(.elementor-add-htmega-template-button, .htmega-ai-section-sparkle){
    display: none!important;
}