/* =========================================================
   ZAREMOB COMMERCE-FIRST HEADER
   Mobile-first responsive layout. One overlay open at a time.
   ========================================================= */

.zaremob-header { position:relative; z-index:1100; width:100%; color:var(--dark-text); background:var(--dark-brand); box-shadow:0 8px 30px rgba(0,0,0,.22); }
.zm-header-main { background:var(--dark-brand); border-bottom:1px solid rgba(255,255,255,.08); }
.zm-header-container { width:min(calc(100% - 24px),var(--container)); margin-inline:auto; min-width:0; }
.zm-header-main .zm-header-container { min-height:92px; display:flex; align-items:center; gap:14px; }
.zaremob-brand { display:inline-flex; align-items:center; flex:0 1 auto; min-width:0; text-decoration:none; }
.zaremob-brand-logo { display:block; width:auto; height:50px; max-width:260px; object-fit:contain; }
.zm-header-spacer { flex:1 1 auto; min-width:10px; }
.zm-menu-button,.zm-account-button,.zm-cart-button { display:inline-flex; align-items:center; justify-content:center; gap:7px; min-height:58px; padding:8px 10px; border:0; border-radius:12px; background:transparent; color:#fff; -webkit-text-fill-color:#fff; text-decoration:none; cursor:pointer; font:inherit; }
.zm-menu-button { flex:0 0 auto; }
.zm-menu-lines { display:flex; flex-direction:column; gap:5px; width:26px; }
.zm-menu-lines i { display:block; height:3px; width:100%; border-radius:999px; background:#fff; transition:.18s; }
.zm-menu-button:hover,.zm-menu-button:focus-visible,.zm-account-button:hover,.zm-account-button:focus-visible,.zm-cart-button:hover,.zm-cart-button:focus-visible { background:rgba(201,163,106,.12); outline:none; }
.zm-menu-button:focus-visible,.zm-account-button:focus-visible,.zm-cart-button:focus-visible { box-shadow:0 0 0 2px var(--gold); }
.zm-control-label { font-size:14px; font-weight:700; white-space:nowrap; }
.zm-icon { display:inline-flex; align-items:center; justify-content:center; width:30px; height:30px; position:relative; }
.zm-icon svg { width:100%; height:100%; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.zm-cart-button { position:relative; }
.zm-cart-badge { position:absolute; top:4px; right:2px; min-width:21px; height:21px; padding:0 5px; display:flex; align-items:center; justify-content:center; border-radius:999px; background:var(--gold); color:#111; font-size:11px; font-weight:900; }

.zm-search-row { background:linear-gradient(180deg,#141414,#101010); padding:12px 0; border-bottom:1px solid rgba(255,255,255,.08); }
.zm-search-row .zm-header-container { display:flex; align-items:stretch; gap:10px; }
.zm-shop-button { flex:0 0 auto; min-width:150px; display:inline-flex; align-items:center; justify-content:center; gap:10px; border:1px solid rgba(201,163,106,.7); border-radius:14px; background:linear-gradient(145deg,#d5a45f,#9b642b); color:#fff; font:inherit; font-size:18px; font-weight:800; cursor:pointer; box-shadow:0 7px 20px rgba(154,98,42,.2); }
.zm-shop-button .zm-icon { width:28px; height:28px; }
.zm-shop-button:hover,.zm-shop-button:focus-visible { filter:brightness(1.06); outline:none; box-shadow:0 0 0 2px rgba(240,210,154,.7),0 8px 24px rgba(154,98,42,.28); }
.zm-chevron { font-size:23px; line-height:1; margin-top:-5px; }
.zm-search-form { flex:1 1 auto; min-width:0; display:flex; align-items:stretch; background:#faf9f7; border:1px solid #ddd7cf; border-radius:14px; overflow:visible; }
.zm-search-form input[type="search"] { flex:1 1 auto; min-width:0; height:58px; padding:0 18px; border:0; outline:none; background:transparent; color:#333; font:inherit; font-size:17px; }
.zm-search-form input[type="search"]::placeholder { color:#777; opacity:1; }
.zm-search-scope,.zm-search-submit { flex:0 0 58px; width:58px; height:58px; border:0; cursor:pointer; }
.zm-search-scope { background:#111820; color:#fff; border-inline-start:1px solid rgba(255,255,255,.08); font-size:28px; font-weight:900; }
.zm-search-submit { background:linear-gradient(145deg,#d5a45f,#9b642b); color:#fff; border-radius:0 13px 13px 0; }
.zm-search-submit svg { width:27px; height:27px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; }
.zm-search-scope:hover,.zm-search-scope:focus-visible { background:#202933; outline:none; }

.zm-utility-row { background:#f8f5ef; color:#171717; }
.zm-utility-row .zm-header-container { min-height:62px; display:flex; align-items:center; }
.zm-utility-group { display:flex; align-items:stretch; width:100%; min-width:0; }
.zm-utility-button,.zm-utility-link { min-height:62px; padding:0 18px; display:inline-flex; align-items:center; justify-content:center; gap:8px; border:0; border-inline-end:1px solid rgba(20,20,20,.12); background:transparent; color:#171717; text-decoration:none; font:inherit; font-size:15px; font-weight:700; white-space:nowrap; cursor:pointer; }
.zm-utility-button:hover,.zm-utility-button:focus-visible,.zm-utility-link:hover,.zm-utility-link:focus-visible { background:#eee8de; color:#8c5e2d; outline:none; }
.zm-utility-group > :first-child .zm-utility-button,.zm-utility-group > :first-child.zm-utility-link { border-inline-start:1px solid rgba(20,20,20,.12); }
.zm-globe { font-size:25px; line-height:1; }

.zm-panel-layer { position:absolute; inset-inline:0; top:100%; z-index:1200; pointer-events:none; }
.zm-panel { width:min(1100px,calc(100% - 24px)); margin:0 auto; background:#171717; color:#fff; border:1px solid rgba(201,163,106,.38); border-top:0; border-radius:0 0 18px 18px; box-shadow:0 22px 50px rgba(0,0,0,.45); pointer-events:auto; }
.zm-panel[hidden] { display:none; }
.zm-panel-inner { padding:22px; }
.zm-panel-heading { display:flex; align-items:baseline; justify-content:space-between; gap:20px; margin-bottom:16px; }
.zm-panel-heading strong,.zm-panel-inner h3 { color:#fff; }
.zm-panel-heading span { color:#aaa; font-size:13px; }
.zm-shop-grid { display:grid; grid-template-columns:1fr 1.3fr 1fr; gap:22px; }
.zm-shop-grid h3 { margin:0 0 10px; font-size:13px; color:var(--gold); text-transform:uppercase; letter-spacing:.08em; }
.zm-panel-feature,.zm-category-column a,.zm-panel-menu a { display:block; padding:10px 12px; color:#fff; text-decoration:none; border-radius:9px; }
.zm-panel-feature:hover,.zm-category-column a:hover,.zm-panel-menu a:hover { background:rgba(201,163,106,.12); color:#f0d29a; }
.zm-panel-feature small,.zm-panel-disabled small,.zm-auth-button small,.zm-account-links small,.zm-account-seller small { display:block; margin-top:3px; color:#8f8f8f; font-size:11px; }
.zm-category-column { columns:2; column-gap:16px; }
.zm-category-column h3 { column-span:all; }
.zm-panel-disabled { display:block; padding:10px 12px; color:#777; opacity:.72; }
.zm-scope-inner { display:flex; align-items:center; flex-wrap:wrap; gap:9px; }
.zm-scope-inner > strong { flex:0 0 100%; margin-bottom:2px; color:#f0d29a; }
.zm-scope-option,.zm-category-chip { border:1px solid rgba(201,163,106,.28); background:#202020; color:#ddd; border-radius:9px; padding:9px 12px; cursor:pointer; font:inherit; }
.zm-scope-option.is-active,.zm-scope-option:hover,.zm-category-chip:hover { background:var(--gold); color:#111; border-color:var(--gold); }
.zm-scope-category-wrap { flex:1 1 100%; padding-top:8px; border-top:1px solid rgba(255,255,255,.08); }
.zm-scope-category-wrap > span { display:block; color:#aaa; font-size:12px; margin-bottom:7px; }
.zm-scope-category-list { display:flex; flex-wrap:wrap; gap:7px; }
.zm-account-panel-inner { display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:20px; }
.zm-account-panel-inner strong { display:block; color:#f0d29a; margin-bottom:7px; }
.zm-account-panel-inner p { margin:0 0 12px; color:#aaa; font-size:13px; line-height:1.5; }
.zm-auth-actions { display:flex; gap:8px; }
.zm-auth-button { flex:1; padding:12px; border:1px solid rgba(201,163,106,.4); border-radius:9px; text-align:center; color:#777; }
.zm-account-links,.zm-account-seller { border-inline-start:1px solid rgba(255,255,255,.08); padding-inline-start:18px; }
.zm-account-links span,.zm-account-seller span { display:block; padding:9px 0; color:#aaa; }
.zm-compact-inner { display:flex; flex-wrap:wrap; gap:7px; }
.zm-choice { min-width:110px; display:flex; justify-content:space-between; gap:15px; padding:10px 12px; border-radius:8px; color:#fff; text-decoration:none; background:#202020; }
.zm-choice:hover,.zm-choice.is-active { background:var(--gold); color:#111; }
.zm-choice small { opacity:.7; }
.zm-collections-inner { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.zm-collections-inner > strong { margin-inline-end:10px; color:#f0d29a; }
.zm-mobile-menu-inner { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; }
.zm-mobile-menu-inner a { padding:12px; }

.sr-only { position:absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; border:0!important; }

@media (max-width:900px) {
    .zm-header-main .zm-header-container { min-height:78px; gap:8px; }
    .zaremob-brand-logo { height:38px; max-width:150px; }
    .zm-menu-button { min-width:56px; width:56px; min-height:54px; flex-direction:column; gap:3px; border:1px solid rgba(201,163,106,.9); border-radius:12px; background:rgba(17,17,17,.58); box-shadow:0 0 0 1px rgba(201,163,106,.12),0 0 16px rgba(201,163,106,.13); }
    .zm-menu-button .zm-control-label { font-size:11px; font-weight:900; }
    .zm-menu-lines { width:28px; gap:4px; }
    .zm-menu-lines i { height:3px; }
    .zm-account-button,.zm-cart-button { min-width:50px; min-height:54px; flex-direction:column; padding:3px 2px; }
    .zm-account-button .zm-control-label,.zm-cart-button .zm-control-label { font-size:11px; }
    .zm-icon { width:27px; height:27px; }
    .zm-cart-badge { top:2px; right:0; }
    .zm-search-row { padding:0; }
    .zm-search-row .zm-header-container { gap:5px; }
    .zm-shop-button { min-width:112px; padding:0 9px; font-size:15px; }
    .zm-search-form input[type="search"] { height:48px; padding-inline:12px; font-size:14px; }
    .zm-search-scope,.zm-search-submit { flex-basis:48px; width:48px; height:48px; }
    .zm-utility-row { background:linear-gradient(to bottom, transparent 0, transparent 4px, #f8f5ef 4px, #f8f5ef calc(100% - 4px), transparent calc(100% - 4px), transparent 100%); }
    .zm-utility-row .zm-header-container { min-height:46px; }
    .zm-utility-group { overflow-x:auto; scrollbar-width:none; }
    .zm-utility-group::-webkit-scrollbar { display:none; }
    .zm-utility-button,.zm-utility-link { min-height:46px; padding:0 14px; font-size:11px; }
    .zm-panel { width:calc(100% - 16px); border-radius:0 0 14px 14px; }
    .zm-panel-inner { padding:16px; }
    .zm-shop-grid,.zm-account-panel-inner { grid-template-columns:1fr; gap:12px; }
    .zm-category-column { columns:2; }
    .zm-account-links,.zm-account-seller { border-inline-start:0; border-top:1px solid rgba(255,255,255,.08); padding:12px 0 0; }
    .zm-mobile-menu-inner { grid-template-columns:1fr; }
}

@media (max-width:560px) {
    .zm-header-container { width:calc(100% - 16px); }
    .zm-header-main .zm-header-container { min-height:72px; gap:5px; }
    .zaremob-brand-logo { height:34px; max-width:145px; }
    .zm-menu-button { min-width:54px; width:54px; min-height:52px; }
    .zm-account-button,.zm-cart-button { min-width:44px; width:44px; min-height:52px; }
    .zm-account-button .zm-icon,.zm-cart-button .zm-icon { width:25px; height:25px; }
    .zm-account-button .zm-control-label,.zm-cart-button .zm-control-label { font-size:11px; }
    .zm-menu-lines { width:28px; }
    .zm-search-row .zm-header-container { gap:5px; }
    .zm-shop-button { min-width:96px; padding:0 7px; font-size:11px; gap:4px; }
    .zm-shop-button .zm-icon { width:24px; height:24px; }
    .zm-search-form input[type="search"] { font-size:13px; padding-inline:9px; }
    .zm-search-scope,.zm-search-submit { flex-basis:44px; width:44px; height:46px; }
    .zm-utility-button,.zm-utility-link { min-height:44px; padding:0 12px; font-size:11px; }
    .zm-utility-group > * { flex:0 0 auto; }
}

@media (min-width:901px) {
    .zm-menu-button { order:5; }
    .zm-header-main .zm-header-container { gap:18px; }
}

html[dir="rtl"] .zm-category-column, html[dir="rtl"] .zm-panel, html[dir="rtl"] .zm-utility-group { direction:rtl; }
html[dir="rtl"] .zm-search-submit { border-radius:13px 0 0 13px; }
html[dir="rtl"] .zm-account-links, html[dir="rtl"] .zm-account-seller { border-inline-start:0; border-inline-end:1px solid rgba(255,255,255,.08); padding-inline-start:0; padding-inline-end:18px; }

@media (max-width:380px) {
    .zm-header-container { width:calc(100% - 12px); }
    .zm-header-main .zm-header-container { min-height:68px; gap:4px; }
    .zaremob-brand-logo { height:31px; max-width:132px; }
    .zm-menu-button { min-width:50px; width:50px; min-height:48px; }
    .zm-account-button,.zm-cart-button { min-width:40px; width:40px; min-height:48px; }
    .zm-account-button .zm-control-label,.zm-cart-button .zm-control-label { font-size:11px; }
    .zm-menu-lines { width:25px; gap:4px; }
    .zm-menu-lines i { height:3px; }
    .zm-shop-button { min-width:90px; font-size:11px; }
    .zm-search-form input[type="search"] { font-size:12px; }
    .zm-search-scope,.zm-search-submit { flex-basis:42px; width:42px; height:44px; }
}
