/* ============================================================
   Mega Header Menu — feuille de style éditable
   Variables principales injectées par PHP : --mhm-accent, --mhm-container
   ============================================================ */

:root{
	/* Accent : on utilise TA variable de thème --accent si elle existe,
	   sinon le repli injecté par le plugin (filtre mhm_accent). */
	--mhm-accent:var(--accent, var(--mhm-accent-fallback, #f00075));
	--mhm-container:1200px;

	/* Fonds — redéfinis-les ici (ou dans ton CSS additionnel) pour utiliser tes couleurs */
	--mhm-bg:#010318;        /* barre du haut            */
	--mhm-bg-2:#010318;      /* panel du tiroir          */
	--mhm-bg-3:#010318;      /* colonnes de sous-menus   */
	--mhm-surface:rgba(255,255,255,.05);  /* champs de recherche & petites surfaces */
	--mhm-line:rgba(255,255,255,.08);
	--mhm-text:#ffffff;      /* texte principal — blanc pur pour un contraste max */
	--mhm-muted:#b8a7b0;
	--mhm-dim:#8d7d86;
	--mhm-radius:8px;
	--mhm-panel-w:340px;     /* largeur panel desktop    */
	--mhm-col-w:280px;       /* largeur d'une colonne    */
}

/* ---------- Conteneur général ---------- */
.mhm-header{background:var(--mhm-bg);color:var(--mhm-text);width:100%;box-sizing:border-box;font-family:inherit;}
.mhm-header *{box-sizing:border-box;}
.mhm-header a{color:inherit;text-decoration:none;}

.mhm-bar{
	display:flex;align-items:center;gap:16px;
	width:100%;max-width:var(--mhm-container,1200px);
	margin:0 auto;padding:0 20px;
}

/* Tailles d'icônes forcées (certains thèmes mettent svg{height:auto}). */
.mhm-header svg,.mhm-drawer svg{flex:0 0 auto;}
.mhm-trigger svg{width:18px;height:18px;}
.mhm-action svg{width:20px;height:20px;}
.mhm-search__icon svg,.mhm-panel__search svg{width:16px;height:16px;}
.mhm-close svg{width:20px;height:20px;stroke:#fff;}

/* ---------- Barre supérieure ---------- */
.mhm-bar--top{min-height:64px;border-bottom:.5px solid var(--mhm-line);}
.mhm-logo{display:flex;align-items:center;flex:0 0 auto;max-width:180px;}
.mhm-logo-img{display:inline-flex;align-items:center;line-height:0;max-width:100%;}
.mhm-logo-img img{max-width:100%;max-height:46px;width:auto;height:auto;display:block;}
.mhm-logo-text{font-size:20px;font-weight:600;color:var(--mhm-accent);white-space:nowrap;}

/* Recherche : remplit l'espace dispo, fond foncé en permanence */
.mhm-search{
	flex:1 1 auto;display:flex;align-items:center;gap:8px;
	background:var(--mhm-surface);border:.5px solid var(--mhm-line);
	border-radius:999px;padding:9px 16px;min-width:0;
}
.mhm-search__icon{display:flex;color:var(--mhm-dim);}
.mhm-search input[type="search"]{
	flex:1 1 auto;font-size:14px;min-width:0;padding:0;margin:0;
	background:transparent !important;border:0 !important;outline:0 !important;
	color:var(--mhm-text) !important;box-shadow:none !important;
	-webkit-appearance:none;appearance:none;
}
.mhm-search input[type="search"]:focus,
.mhm-search input[type="search"]:hover{
	background:transparent !important;color:var(--mhm-text) !important;box-shadow:none !important;outline:0 !important;
}
.mhm-search input[type="search"]::placeholder{color:var(--mhm-dim);opacity:1;}
.mhm-search:focus-within{border-color:var(--mhm-accent);}

/* Compte / panier alignés à droite */
.mhm-actions{display:flex;align-items:center;gap:22px;flex:0 0 auto;margin-left:auto;}
.mhm-action{display:flex;flex-direction:column;align-items:center;gap:3px;font-size:13px;position:relative;color:var(--mhm-text);transition:color .15s;}
.mhm-action:hover{color:var(--mhm-accent);}
.mhm-action--cart .mhm-cart-count{
	position:absolute;top:-7px;right:-8px;background:var(--mhm-accent);color:#fff;
	font-size:10px;line-height:1;font-weight:600;min-width:16px;height:16px;border-radius:999px;
	display:flex;align-items:center;justify-content:center;padding:0 4px;
}
.mhm-cart-count.is-empty{display:none;}

/* ---------- Barre navigation ---------- */
.mhm-bar--nav{min-height:52px;border-bottom:.5px solid var(--mhm-line);}
.mhm-trigger{
	display:inline-flex;align-items:center;gap:8px;flex:0 0 auto;cursor:pointer;line-height:1;
	background:var(--mhm-accent);color:#fff;border:.5px solid transparent;border-radius:var(--mhm-radius);
	padding:9px 15px;font-size:12px;font-weight:600;letter-spacing:.5px;text-transform:uppercase;
	transition:box-shadow .2s,filter .2s;
}
.mhm-trigger:hover{filter:brightness(1.05);box-shadow:0 0 5px var(--mhm-accent),0 0 14px var(--mhm-accent);}
.mhm-trigger__short{display:none;}

.mhm-nav ul{display:flex;align-items:center;gap:20px;list-style:none;margin:0;padding:0;}
.mhm-nav li{margin:0;padding:0;}
.mhm-nav a{font-size:1rem;color:#fff;white-space:nowrap;transition:color .15s;}
.mhm-nav a:hover{color:var(--mhm-accent);}
.mhm-nav--left{flex:0 1 auto;}
.mhm-nav--right{flex:0 0 auto;margin-left:auto;}
.mhm-search--mobile{display:none;}

/* ---------- Overlay + tiroir ---------- */
.mhm-overlay{position:fixed;inset:0;background:rgba(5,9,17,.55);opacity:0;pointer-events:none;transition:opacity .25s;z-index:99998;}
.mhm-overlay.is-open{opacity:1;pointer-events:auto;}
.mhm-overlay[hidden]{display:block;}

.mhm-drawer{
	position:fixed;top:0;left:0;height:100%;display:flex;align-items:stretch;
	transform:translateX(-100%);transition:transform .28s ease;z-index:99999;
	font-family:inherit;color:var(--mhm-text);max-width:100vw;
	overflow-x:auto;overflow-y:hidden;scroll-behavior:smooth;
}
.mhm-drawer.is-open{transform:translateX(0);}
.mhm-drawer[hidden]{display:flex;}
.mhm-drawer a{color:inherit;text-decoration:none;}
.mhm-drawer ul{list-style:none;margin:0;padding:0;}

/* Décalage sous la barre d'admin WordPress (uniquement si connecté) */
.admin-bar .mhm-drawer{top:32px;height:calc(100% - 32px);}
.admin-bar .mhm-overlay{top:32px;}
@media screen and (max-width:782px){
	.admin-bar .mhm-drawer{top:46px;height:calc(100% - 46px);}
	.admin-bar .mhm-overlay{top:46px;}
}

.mhm-panel{
	width:var(--mhm-panel-w);max-width:90vw;height:100%;flex:0 0 auto;position:relative;
	background:var(--mhm-bg-2);border-right:.5px solid rgba(255,255,255,.1);
	display:flex;flex-direction:column;overflow-y:auto;-webkit-overflow-scrolling:touch;
}

.mhm-panel__head{
	display:flex;align-items:center;justify-content:space-between;
	padding:16px 18px;border-bottom:.5px solid var(--mhm-line);
	position:sticky;top:0;background:var(--mhm-bg-2);z-index:2;
}
.mhm-panel__title{font-size:13px;font-weight:600;letter-spacing:.6px;text-transform:uppercase;}
.mhm-close{
	background:rgba(255,255,255,.08);color:#fff;border:0;cursor:pointer;width:30px;height:30px;border-radius:var(--mhm-radius);
	display:flex;align-items:center;justify-content:center;transition:background .15s;
}
.mhm-close:hover{background:var(--mhm-accent);}

/* Recherche du tiroir */
.mhm-panel__search{
	display:flex;align-items:center;gap:8px;margin:14px 18px 6px;color:var(--mhm-dim);
	background:var(--mhm-surface);border:.5px solid var(--mhm-line);border-radius:var(--mhm-radius);padding:9px 12px;
}
.mhm-panel__search input[type="search"]{
	flex:1;font-size:13px;min-width:0;padding:0;
	background:transparent !important;border:0 !important;outline:0 !important;
	color:var(--mhm-text) !important;box-shadow:none !important;-webkit-appearance:none;appearance:none;
}
.mhm-panel__search input[type="search"]:focus,
.mhm-panel__search input[type="search"]:hover{background:transparent !important;color:var(--mhm-text) !important;box-shadow:none !important;outline:0 !important;}
.mhm-panel__search input[type="search"]::placeholder{color:var(--mhm-dim);opacity:1;}

/* Sections */
.mhm-section{padding:8px 18px;}
.mhm-section__label{font-size:11px;letter-spacing:.8px;text-transform:uppercase;color:var(--mhm-dim);margin:10px 0 8px;}
.mhm-section--selection .mhm-section__label{color:var(--mhm-accent);}
.mhm-section--selection ul{display:flex;flex-direction:column;gap:8px;}
.mhm-section--selection a{
	display:block;background:rgba(255,255,255,.04);border:.5px solid rgba(255,255,255,.06);border-radius:var(--mhm-radius);
	padding:11px 13px;font-size:1rem;transition:border-color .15s;
}
.mhm-section--selection a:hover{border-color:var(--mhm-accent);}

/* ---------- Liste catalogue (niveau 1, dans le panel) ---------- */
.mhm-label{
	flex:1 1 auto;min-width:0;
	white-space:normal;              /* autorise le retour à la ligne, autant de lignes que nécessaire */
	line-height:1.25;
}
.mhm-cat-list{display:flex;flex-direction:column;}
.mhm-cat-list__item{
	display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;
	padding:12px 2px;font-size:1rem;color:var(--mhm-text);cursor:pointer;
	background:none;border:0;border-bottom:.5px solid rgba(255,255,255,.06);text-align:left;font-family:inherit;
	transition:color .15s;
}
.mhm-cat-list__item:last-child{border-bottom:0;}
.mhm-cat-list__item:hover{color:var(--mhm-accent);}
.mhm-cat-list__item.is-active{color:var(--mhm-accent);font-weight:500;}
.mhm-caret{width:7px;height:7px;flex:0 0 auto;border-top:2px solid var(--mhm-dim);border-right:2px solid var(--mhm-dim);transform:rotate(45deg);}
.mhm-cat-list__item:hover .mhm-caret,.mhm-cat-list__item.is-active .mhm-caret{border-color:var(--mhm-accent);}

/* Repli de la liste source brute (avant JS / si JS off : reste lisible) */
.mhm-cat .menu .sub-menu{padding-left:14px;}
.mhm-cat .menu a{display:block;padding:10px 2px;font-size:14px;border-bottom:.5px solid rgba(255,255,255,.06);}
.mhm-js .mhm-cat > .menu{display:none;}

/* ---------- Colonnes desktop (Miller columns) ---------- */
.mhm-col{
	width:var(--mhm-col-w);max-width:80vw;height:100%;flex:0 0 auto;overflow-y:auto;
	background:var(--mhm-bg-3);border-right:.5px solid rgba(255,255,255,.08);
	animation:mhm-col-in .2s ease;
}
@keyframes mhm-col-in{from{opacity:0;transform:translateX(-10px);}to{opacity:1;transform:translateX(0);}}
.mhm-col__head{
	display:flex;align-items:center;justify-content:space-between;gap:8px;
	padding:14px 16px 10px;position:sticky;top:0;background:var(--mhm-bg-3);
	border-bottom:.5px solid var(--mhm-line);
}
.mhm-col__title{font-size:0.8rem;letter-spacing:.6px;text-transform:uppercase;color:var(--mhm-dim);}
.mhm-viewall{font-size:0.8rem;color:var(--mhm-accent);white-space:nowrap;text-decoration:underline;}
.mhm-col-list{display:flex;flex-direction:column;padding:6px 16px 16px;}
.mhm-col-list__item{
	display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;
	padding:11px 2px;font-size:1rem;color:var(--mhm-text);cursor:pointer;
	background:none;border:0;border-bottom:.5px solid rgba(255,255,255,.05);text-align:left;font-family:inherit;
	transition:color .15s;
}
.mhm-col-list__item:last-child{border-bottom:0;}
.mhm-col-list__item:hover{color:var(--mhm-accent);}
.mhm-col-list__item.is-active{color:var(--mhm-accent);font-weight:500;}

/* ---------- Footer du tiroir ---------- */
.mhm-foot{margin-top:auto;display:flex;gap:18px;flex-wrap:wrap;padding:16px 18px;border-top:.5px solid var(--mhm-line);}
.mhm-foot a{font-size:0.9rem;color:var(--mhm-muted);}
.mhm-foot a:hover{color:#fff;}

/* ---------- Drill-down mobile (overlay sur le panel) ---------- */
.mhm-stack{
	position:absolute;inset:0;z-index:5;background:var(--mhm-bg-2);
	display:flex;flex-direction:column;
}
.mhm-stack__head{
	display:flex;align-items:center;gap:10px;padding:14px 16px;border-bottom:.5px solid var(--mhm-line);
	position:sticky;top:0;background:var(--mhm-bg-2);
}
.mhm-stack__back{
	background:rgba(255,255,255,.08);color:#fff;border:0;cursor:pointer;width:32px;height:32px;border-radius:var(--mhm-radius);
	display:flex;align-items:center;justify-content:center;flex:0 0 auto;
}
.mhm-stack__back:hover{background:var(--mhm-accent);}
.mhm-stack__title{flex:1;font-size:14px;font-weight:500;text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.mhm-stack__view{flex:1;overflow-y:auto;padding:6px 16px 18px;animation:mhm-view-in .22s ease;}
.mhm-stack__view.is-back{animation:mhm-view-back .22s ease;}
@keyframes mhm-view-in{from{opacity:0;transform:translateX(24px);}to{opacity:1;transform:translateX(0);}}
@keyframes mhm-view-back{from{opacity:0;transform:translateX(-24px);}to{opacity:1;transform:translateX(0);}}
.mhm-stack__view .mhm-col-list__item{font-size:15px;padding:13px 2px;}

body.mhm-locked{overflow:hidden;}

/* ============================================================
   Responsive — bascule à 1024px
   ============================================================ */
@media (max-width:1023px){
	.mhm-bar{padding:0 16px;}
	.mhm-bar--top{min-height:58px;gap:10px;}
	.mhm-actions{gap:18px;}
	.mhm-action span{display:none;}
	/* La recherche du haut passe dans la barre nav, à droite du bouton Menu */
	.mhm-bar--top .mhm-search{display:none;}
	.mhm-bar--nav{min-height:52px;gap:12px;}
	.mhm-trigger__full{display:none;}
	.mhm-trigger__short{display:inline;}
	.mhm-nav--left,.mhm-nav--right{display:none;}
	.mhm-search--mobile{display:flex;flex:1 1 auto;padding:7px 14px;}

	/* Le tiroir prend toute la largeur, les colonnes desktop sont neutralisées */
	.mhm-panel{width:100vw;max-width:100vw;}
	.mhm-col{display:none;}
}
