/* Miaara Header Builder – by Tamil Nadu Digital */
.mh-header{--mh-accent:#b3124f;--mh-text:#1d1d1f;--mh-muted:#6b6b72;--mh-line:#e7e3e6;
	position:relative;z-index:999;background:#fff;color:var(--mh-text);width:100%;box-sizing:border-box}
.mh-header *,.mh-header *::before,.mh-header *::after{box-sizing:border-box}
.mh-header button{font:inherit;background:none;border:0;padding:0;margin:0;cursor:pointer;color:inherit;line-height:1;box-shadow:none}
.mh-header button:hover,.mh-header button:focus{background:none;color:inherit}
.mh-header a{text-decoration:none}
.mh-sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- Grid ---------- */
.mh-inner{display:grid;align-items:center;column-gap:28px;row-gap:0;max-width:1320px;margin:0 auto;padding:14px 20px}
.mh-menu-inline .mh-inner{grid-template-columns:auto 1fr minmax(200px,340px) auto;grid-template-areas:"logo nav search icons"}
.mh-menu-below .mh-inner{grid-template-columns:auto 1fr auto;grid-template-areas:"logo search icons" "nav nav nav"}
.mh-menu-inline.mh-no-search .mh-inner{grid-template-columns:auto 1fr auto;grid-template-areas:"logo nav icons"}
.mh-logo{grid-area:logo}
.mh-nav{grid-area:nav;min-width:0}
.mh-search{grid-area:search;width:100%;justify-self:center}
.mh-menu-below .mh-search{max-width:620px}
.mh-icons{grid-area:icons;display:flex;align-items:center;justify-content:flex-end;gap:18px}
.mh-burger,.mh-search-toggle{display:none}

/* ---------- Logo ---------- */
.mh-logo a{display:inline-flex;align-items:center}
.mh-logo img{display:block;width:160px;height:auto;max-width:100%}
.mh-logo .mh-logo-mobile{display:none}
.mh-logo-text{font-size:24px;font-weight:700;letter-spacing:.02em;color:var(--mh-text)}

/* ---------- Desktop menu ---------- */
.mh-nav ul{list-style:none;margin:0;padding:0}
.mh-nav > ul{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:4px}
.mh-menu-below .mh-nav{border-top:1px solid var(--mh-line);margin-top:12px}
.mh-nav > ul > li{position:relative}
.mh-nav > ul > li > a{position:relative;display:flex;align-items:center;gap:6px;padding:14px 14px;color:var(--mh-text);
	font-size:14px;font-weight:500;letter-spacing:.03em;text-transform:uppercase;transition:color .2s}
.mh-nav > ul > li > a:hover,.mh-nav > ul > li.current-menu-item > a,.mh-nav > ul > li.current-menu-ancestor > a{color:var(--mh-accent)}
.mh-underline-yes .mh-nav > ul > li > a::after{content:"";position:absolute;left:14px;right:14px;bottom:8px;height:2px;background:var(--mh-accent);
	transform:scaleX(0);transform-origin:left;transition:transform .25s}
.mh-underline-yes .mh-nav > ul > li > a:hover::after,.mh-underline-yes .mh-nav > ul > li.current-menu-item > a::after{transform:scaleX(1)}
.mh-nav .menu-item-has-children > a::before{content:"";order:2;width:6px;height:6px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;
	transform:rotate(45deg) translateY(-2px);margin-left:2px}
.mh-nav .sub-menu{position:absolute;top:100%;left:0;min-width:220px;background:#fff;padding:8px 0;border-radius:6px;
	box-shadow:0 12px 32px rgba(0,0,0,.12);opacity:0;visibility:hidden;transform:translateY(8px);transition:all .2s;z-index:50}
.mh-nav .sub-menu .sub-menu{top:0;left:100%}
.mh-nav li:hover > .sub-menu,.mh-nav li:focus-within > .sub-menu{opacity:1;visibility:visible;transform:none}
.mh-nav .sub-menu li{position:relative}
.mh-nav .sub-menu a{display:flex;justify-content:space-between;align-items:center;padding:9px 18px;font-size:14px;color:var(--mh-text);transition:background .15s,color .15s}
.mh-nav .sub-menu a:hover{background:#f7f3f5;color:var(--mh-accent)}
.mh-nav .sub-menu .menu-item-has-children > a::before{transform:rotate(-45deg)}

/* ---------- Search ---------- */
.mh-search-form{position:relative;display:flex;align-items:center;height:46px;margin:0;border:1.5px solid var(--mh-line);
	border-radius:30px;background:#faf8f9;transition:border-color .2s,background .2s}
.mh-search-form:focus-within{border-color:var(--mh-accent);background:#fff}
.mh-search-input{flex:1;min-width:0;height:100%;border:0!important;outline:0;background:transparent!important;padding:0 8px 0 20px!important;
	font-size:14px;color:var(--mh-text);box-shadow:none!important;margin:0}
.mh-search-input::-webkit-search-cancel-button{-webkit-appearance:none}
.mh-search-input::placeholder{color:#9a969a}
.mh-header .mh-search-btn{flex:0 0 auto;display:flex;align-items:center;justify-content:center;height:calc(100% - 8px);aspect-ratio:1;margin-right:4px;
	border-radius:inherit;background:var(--mh-accent);color:#fff;font-size:17px}
.mh-header .mh-search-btn:hover{background:var(--mh-accent);filter:brightness(1.08)}
.mh-search-btn svg{width:18px;height:18px;fill:#fff}
.mh-spinner{display:none;width:16px;height:16px;margin-right:8px;border:2px solid var(--mh-line);border-top-color:var(--mh-accent);border-radius:50%;animation:mh-spin .7s linear infinite}
.mh-loading .mh-spinner{display:block}
@keyframes mh-spin{to{transform:rotate(360deg)}}

.mh-results{position:absolute;top:calc(100% + 8px);left:0;right:0;background:#fff;border-radius:10px;box-shadow:0 16px 40px rgba(0,0,0,.15);
	max-height:70vh;overflow-y:auto;display:none;z-index:1000;text-align:left}
.mh-results.show{display:block}
.mh-r-item{display:flex;align-items:center;gap:12px;padding:10px 14px;border-bottom:1px solid #f1eef0;color:var(--mh-text);transition:background .15s}
.mh-r-item:hover,.mh-r-item.is-active{background:#f7f3f5}
.mh-r-img{flex:0 0 48px;width:48px;height:48px;border-radius:6px;object-fit:cover;background:#f3f3f3}
.mh-r-body{flex:1;min-width:0}
.mh-r-title{display:block;font-size:14px;font-weight:500;line-height:1.35;color:var(--mh-text);overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.mh-r-title mark{background:none;color:var(--mh-accent);font-weight:700;padding:0}
.mh-r-meta{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;margin-top:3px;font-size:12px;color:var(--mh-muted)}
.mh-r-sku{background:#f2eef0;padding:1px 7px;border-radius:4px;font-family:ui-monospace,Menlo,Consolas,monospace}
.mh-r-sku mark{background:#ffe08a;color:inherit;padding:0}
.mh-r-price{font-weight:600;color:var(--mh-accent)}
.mh-r-price del{opacity:.55;font-weight:400;margin-right:4px}
.mh-r-price ins{text-decoration:none}
.mh-r-oos{color:#c0392b}
.mh-r-empty{padding:18px 14px;font-size:14px;color:var(--mh-muted);text-align:center}
.mh-r-all{display:block;padding:12px 14px;text-align:center;font-size:13px;font-weight:600;color:var(--mh-accent);background:#fcfafb;letter-spacing:.03em}
.mh-r-all:hover{text-decoration:underline}

/* ---------- Icons ---------- */
.mh-icon-link{display:inline-flex;align-items:center;gap:8px;color:var(--mh-text);transition:color .2s}
.mh-icon-link:hover{color:var(--mh-accent)}
.mh-ic{position:relative;display:inline-flex;font-size:22px;line-height:1}
.mh-ic svg,.mh-burger svg,.mh-search-toggle svg{width:22px;height:22px;fill:currentColor}
.mh-ic i{font-size:inherit}
.mh-icon-label{font-size:13px;font-weight:500;white-space:nowrap}
.mh-cart-count{position:absolute;top:-7px;right:-9px;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--mh-accent);
	color:#fff;font-size:11px;font-weight:700;line-height:18px;text-align:center;font-style:normal}
.mh-cart-count.is-empty{display:none}

/* ---------- Drawer ---------- */
.mh-overlay{position:fixed;inset:0;background:rgba(0,0,0,.45);opacity:0;visibility:hidden;transition:opacity .3s;z-index:99998}
.mh-drawer{position:fixed;top:0;left:0;bottom:0;width:310px;max-width:86vw;background:#fff;z-index:99999;transform:translateX(-100%);
	transition:transform .3s ease;display:flex;flex-direction:column;overflow:hidden;box-shadow:4px 0 30px rgba(0,0,0,.12)}
.mh-drawer-open .mh-overlay{opacity:1;visibility:visible}
.mh-drawer-open .mh-drawer{transform:none}
.admin-bar .mh-drawer{top:46px}
@media (min-width:783px){.admin-bar .mh-drawer{top:32px}}
.mh-drawer-head{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;border-bottom:1px solid var(--mh-line);
	font-weight:600;font-size:15px;letter-spacing:.06em;text-transform:uppercase}
.mh-drawer-close svg{width:22px;height:22px;fill:currentColor}
.mh-drawer-nav{flex:1;overflow-y:auto}
.mh-drawer-nav ul{list-style:none;margin:0;padding:0}
.mh-drawer-nav li{position:relative;border-bottom:1px solid var(--mh-line)}
.mh-drawer-nav a{display:block;padding:14px 56px 14px 18px;color:var(--mh-text);font-size:15px}
.mh-drawer-nav .sub-menu{display:none;background:#faf8f9}
.mh-drawer-nav .sub-menu li{border-bottom:0;border-top:1px solid var(--mh-line)}
.mh-drawer-nav .sub-menu a{padding-left:32px;font-size:14px}
.mh-drawer-nav .sub-menu .sub-menu a{padding-left:46px}
.mh-drawer-nav li.mh-sub-open > .sub-menu{display:block}
.mh-header .mh-sub-toggle{position:absolute;top:0;right:0;width:52px;height:50px;display:flex;align-items:center;justify-content:center;border-left:1px solid var(--mh-line)}
.mh-sub-toggle span{width:8px;height:8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg) translateY(-2px);transition:transform .2s}
.mh-sub-open > .mh-sub-toggle span{transform:rotate(-135deg) translateY(-2px)}
.mh-drawer-foot{border-top:1px solid var(--mh-line);padding:14px 18px}
.mh-drawer-foot a{display:flex;align-items:center;gap:10px;color:var(--mh-text);font-weight:500}
.mh-drawer-foot svg{width:20px;height:20px;fill:currentColor}
body.mh-noscroll{overflow:hidden}

/* ---------- Sticky ---------- */
.mh-header.mh-is-fixed{position:fixed;top:0;left:0;right:0;animation:mh-drop .3s ease}
.admin-bar .mh-header.mh-is-fixed{top:32px}
@media (max-width:782px){.admin-bar .mh-header.mh-is-fixed{top:0}}
.mh-sticky-shadow.mh-is-fixed{box-shadow:0 4px 18px rgba(0,0,0,.08)}
.mh-is-fixed.mh-menu-below .mh-inner{padding-top:8px;padding-bottom:0}
@keyframes mh-drop{from{opacity:.4}to{opacity:1}} /* no transform: keeps fixed drawer working */

/* ---------- Tablet + Mobile (≤1024px) ---------- */
@media (max-width:1024px){
	.mh-header .mh-inner,.mh-header.mh-menu-inline .mh-inner,.mh-header.mh-menu-below .mh-inner{
		grid-template-columns:1fr auto 1fr;grid-template-areas:"burger logo icons" "search search search";column-gap:12px;padding:10px 16px}
	.mh-nav{display:none}
	.mh-burger{display:inline-flex;grid-area:burger;justify-self:start}
	.mh-logo{justify-self:center}
	.mh-logo .mh-logo-main.has-mobile{display:none}
	.mh-logo .mh-logo-mobile{display:block}
	.mh-icons{gap:16px}
	.mh-icon-label{display:none}
	.mh-search{max-width:none!important;margin-top:10px}
	.mh-search-form{height:42px}
	.mh-msearch-toggle .mh-search{display:none}
	.mh-msearch-toggle.mh-search-open .mh-search{display:block;animation:mh-fade .2s ease}
	.mh-msearch-toggle .mh-search-toggle{display:inline-flex}
	.mh-results{max-height:60vh}
}
@media (max-width:480px){
	.mh-header .mh-inner{padding:8px 12px}
	.mh-icons{gap:14px}
	.mh-r-img{flex-basis:42px;width:42px;height:42px}
	.mh-search-input{font-size:16px} /* stops iOS zoom */
}
@keyframes mh-fade{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}