/* AL HADI STORE — App-style UI + interaction stability */
html{background:var(--bg);-webkit-tap-highlight-color:transparent}
body{perspective:none;transform:none;overflow-x:hidden}
.header{position:sticky;top:0;z-index:80;background:var(--card);backdrop-filter:none!important;-webkit-backdrop-filter:none!important;box-shadow:0 4px 18px rgba(0,0,0,.16)}
.brand img{filter:none;transform:none!important}
.brand:hover img{transform:none!important}
.icon-btn:hover{transform:none;box-shadow:none}
.searchbar:focus-within{transform:none;box-shadow:inset 0 2px 6px rgba(0,0,0,.3),0 0 0 2px var(--gold-glow)}
.btn{transform:none!important;box-shadow:0 4px 12px rgba(0,0,0,.18);transition:background .18s,box-shadow .18s,transform .12s}
.btn:hover{transform:translateY(-1px)!important}
.btn:active{transform:scale(.98)!important}
.hero-banner{box-shadow:0 12px 28px rgba(0,0,0,.25);border-radius:18px}
.hero-slide img,.hero-slide.active:hover img{transform:none!important}
.hero-text{transform:none!important}
.product-grid,.product-row,.row,.home-row{perspective:none}
.pcard{transform:none!important;transition:box-shadow .18s,transform .12s!important;filter:none!important;opacity:1!important;will-change:auto}
.pcard:hover{transform:translateY(-2px)!important;box-shadow:0 10px 24px rgba(0,0,0,.24);z-index:3}
.pcard:active{transform:scale(.985)!important}
.pcard-img::after{display:none!important}
.pcard:hover .pcard-img img{transform:scale(1.03)!important}
.section-reveal,.section-reveal.in-view{opacity:1!important;transform:none!important}
.overlay{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;background:rgba(0,0,0,.62)!important}
.modal{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
.modal-bg{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;background:rgba(0,0,0,.62)!important}
.modal-box{filter:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;transform:none!important;opacity:1!important;pointer-events:auto!important}
#productModal .modal-box{max-height:calc(100vh - 24px);max-height:calc(100svh - 24px);overflow:auto;-webkit-overflow-scrolling:touch}
.botnav{background:rgba(20,18,15,.98)!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;border-top:1px solid var(--line);box-shadow:0 -8px 24px rgba(0,0,0,.3)}
.botnav button{min-height:58px;font-size:.66rem;gap:4px}
.botnav button:active{transform:scale(.96)}
@media(max-width:760px){
 body{padding-bottom:68px!important}
 .header{position:sticky}
 .header-main{padding:10px 12px!important;gap:9px}
 .brand-txt span{display:none}
 .brand-txt b{font-size:.9rem}
 .searchbar{order:3;width:100%;height:42px}
 .header-main{flex-wrap:wrap}
 .header-actions{margin-left:auto;gap:2px}
 .header-actions .icon-btn{width:38px;height:38px}
 .header-actions .account-btn,.header-actions #adminBtn{display:none}
 .catbar{display:none}
 .marquee{margin-top:0}
 main.wrap{padding-left:12px!important;padding-right:12px!important}
 .hero-banner{min-height:230px;border-radius:16px;margin-top:12px}
 .hero-text{padding:24px!important}
 .hero-text h2{font-size:1.8rem}
 .cat-circles-row{overflow-x:auto;padding-bottom:4px}
 .cat-circle{flex:0 0 auto}
 .product-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
 .pcard{border-radius:13px}
 .pcard-body{padding:10px!important}
 .pcard-add{min-height:38px}
 .modal{padding:10px 8px!important;align-items:flex-end!important}
 /* Product page opens as a real full-screen page (like a native app screen),
    not a popup card floating over a dimmed background. */
 #productModal{padding:0!important;align-items:stretch!important}
 #productModal .modal-bg{display:none}
 #productModal .modal-box{width:100%;max-width:none;height:100vh;height:100svh;max-height:100vh;max-height:100svh;border-radius:0;margin:0;box-shadow:none!important;-webkit-overflow-scrolling:touch;overflow-y:auto}
 #productModal .modal-close{top:10px;right:10px}
 .modal-box{border-radius:18px}
 .drawer{width:min(100%,420px)!important}
 footer{padding-bottom:12px}
}
@media(min-width:761px){
 main.wrap{max-width:1180px}
}

/* ===== VIP APP HOME COMMAND BAR ===== */
.app-command{margin:16px 0 20px;padding:14px;border:1px solid rgba(214,39,44,.22);border-radius:20px;background:linear-gradient(135deg,var(--card),rgba(214,39,44,.06));box-shadow:0 12px 32px rgba(0,0,0,.14);display:flex;align-items:center;gap:14px;justify-content:space-between;position:relative;z-index:5}
.app-command-main{display:flex;align-items:center;gap:18px;min-width:0;flex:1}
.app-welcome{display:flex;align-items:center;gap:10px;min-width:190px}.app-welcome b{display:block;color:var(--navy);font-size:.92rem}.app-welcome small{display:block;color:var(--muted);font-size:.69rem;margin-top:2px;white-space:nowrap}.app-live-dot{width:9px;height:9px;border-radius:50%;background:#35b56a;box-shadow:0 0 0 5px rgba(53,181,106,.12);flex:none}
.app-search-jump{height:44px;border:1px solid rgba(214,39,44,.35);background:var(--bg);border-radius:13px;padding:0 14px;display:flex;align-items:center;gap:10px;color:var(--muted);min-width:220px;max-width:390px;flex:1;cursor:pointer;text-align:left;transition:border-color .18s,box-shadow .18s}.app-search-jump svg{flex:none;color:var(--gold)}.app-search-jump>span{font-size:.86rem;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.app-search-jump:hover{border-color:rgba(214,39,44,.6);box-shadow:0 0 0 3px rgba(214,39,44,.12)}.app-search-jump kbd{margin-left:auto;flex:none;border:1px solid var(--line);border-bottom-width:2px;border-radius:6px;padding:2px 6px;font-size:.62rem;color:var(--muted);background:var(--card)}
.app-quick-actions{display:flex;gap:6px;align-items:center}.app-quick-actions button{position:relative;border:1px solid rgba(214,39,44,.16);background:var(--bg);border-radius:12px;padding:9px 12px;color:var(--navy);font-weight:700;font-size:.72rem;display:flex;align-items:center;gap:6px;cursor:pointer;transition:.18s}.app-quick-actions button svg{flex:none;color:var(--gold)}.app-quick-actions button:hover{background:rgba(214,39,44,.1);border-color:rgba(214,39,44,.4);transform:translateY(-1px);box-shadow:0 4px 12px rgba(0,0,0,.08)}.app-quick-actions button:active{transform:translateY(0) scale(.97)}.app-quick-actions i{position:absolute;right:3px;top:3px;min-width:15px;height:15px;border-radius:8px;background:var(--gold);color:#fff;font-size:.55rem;font-style:normal;display:grid;place-items:center;padding:0 3px;font-weight:800}
/* Settings drawer */
.store-settings{position:fixed;inset:0;z-index:100000;pointer-events:none}.store-settings.open{pointer-events:auto}.settings-backdrop{position:absolute;inset:0;background:rgba(8,10,14,.55);opacity:0;transition:opacity .2s}.store-settings.open .settings-backdrop{opacity:1}.settings-panel{position:absolute;right:0;top:0;height:100%;width:min(390px,94vw);background:var(--card);box-shadow:-18px 0 45px rgba(0,0,0,.25);transform:translateX(105%);transition:transform .25s;overflow:auto;padding:22px}.store-settings.open .settings-panel{transform:translateX(0)}.settings-head{display:flex;justify-content:space-between;align-items:flex-start}.settings-head button{width:38px;height:38px;border:1px solid var(--line);border-radius:12px;background:var(--bg);font-size:25px;line-height:1;cursor:pointer}.settings-kicker{font-size:.63rem;letter-spacing:.16em;color:var(--gold);font-weight:800}.settings-head h3{margin:3px 0 0;color:var(--navy);font-size:1.45rem}.settings-profile{margin:22px 0;padding:14px;border-radius:16px;background:linear-gradient(135deg,rgba(214,39,44,.12),rgba(214,39,44,.04));display:flex;align-items:center;gap:12px}.settings-avatar{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:var(--navy);color:#fff;font-weight:900}.settings-profile b,.settings-profile span{display:block}.settings-profile span{font-size:.72rem;color:var(--muted);margin-top:3px}.settings-group{border-top:1px solid var(--line);padding-top:15px;margin-top:15px}.setting-row,.setting-link{width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;border:0;background:transparent;text-align:left;padding:13px 2px;color:var(--navy);cursor:pointer;text-decoration:none}.setting-row span:first-child{display:flex;align-items:center;gap:11px}.setting-row span:first-child svg{flex:none;color:var(--gold)}.setting-text{display:block;font-style:normal}.setting-row b{display:block;font-size:.86rem}.setting-row small{display:block;color:var(--muted);font-size:.68rem;margin-top:2px}.setting-row strong,.setting-link span{color:var(--muted);font-size:1.2rem}.setting-link{align-items:center}.setting-link svg{flex:none;color:var(--gold);margin-right:11px}.setting-switch{width:42px;height:24px;border-radius:20px;background:#bbb;position:relative;display:block;flex:none;transition:.2s}.setting-switch:after{content:"";position:absolute;width:18px;height:18px;left:3px;top:3px;background:white;border-radius:50%;transition:.2s}.setting-switch.on{background:var(--gold)}.setting-switch.on:after{left:21px}.settings-title{font-size:.62rem;font-weight:900;letter-spacing:.14em;color:var(--muted);margin-bottom:4px}.setting-link{border-bottom:1px solid rgba(0,0,0,.05);font-size:.82rem}.settings-footer{text-align:center;color:var(--muted);font-size:.68rem;padding:26px 0 10px}
html.app-compact .pcard-body{padding:8px!important}html.app-compact .product-grid{gap:8px!important}html.app-compact .pcard{border-radius:10px}
html.app-dark{filter:none}html.app-dark body{background:#0f1115;color:#eee}html.app-dark .app-command,html.app-dark .settings-panel,html.app-dark .app-search-jump{background:#171a20;color:#eee;border-color:#2c3039}html.app-dark .app-welcome b,html.app-dark .app-quick-actions button,html.app-dark .settings-head h3,html.app-dark .setting-row,html.app-dark .setting-link{color:#fff}
@media(max-width:760px){.app-command{display:block;margin:10px 0 14px;padding:10px;border-radius:17px}.app-command-main{display:block}.app-welcome{margin:2px 2px 9px}.app-welcome small{white-space:normal}.app-search-jump{max-width:none;width:100%;height:42px}.app-search-jump kbd{display:none}.app-quick-actions{margin-top:8px;display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.app-quick-actions button{padding:9px 4px;justify-content:center;flex-direction:column;font-size:.6rem;gap:3px}.app-quick-actions button>span{display:block}.app-quick-actions i{right:6px;top:2px}.settings-panel{padding:18px}.settings-head h3{font-size:1.25rem}}

/* Marketplace directory */
.marketplace-tools{display:flex;gap:10px;margin:18px 0}.marketplace-tools input,.marketplace-tools select{min-height:44px;border:1px solid var(--line);border-radius:10px;padding:0 13px;background:var(--card);color:var(--text)}.marketplace-tools input{flex:1}.marketplace-directory{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.marketplace-shop{border:1px solid var(--line);border-radius:16px;background:var(--card);padding:16px}.marketplace-shop h3{margin:0 0 5px;color:var(--navy)}.marketplace-shop p{font-size:.78rem;color:var(--muted);margin:0 0 12px;line-height:1.5}.marketplace-shop .shop-products{display:grid;gap:8px}.marketplace-product{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px;border-radius:10px;background:var(--bg);font-size:.78rem}.marketplace-product b{color:var(--navy)}

/* Seller Center */
.seller-modal-box{max-width:920px!important}.seller-shell{padding:28px}.seller-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;border-bottom:1px solid var(--line);padding-bottom:20px}.seller-head h2{margin:4px 0 5px;color:var(--navy)}.seller-head p{margin:0;color:var(--muted);font-size:.85rem}.seller-status{border-radius:999px;padding:7px 11px;background:rgba(53,181,106,.12);color:#25834c;font-size:.68rem;font-weight:800;white-space:nowrap}.seller-status.pending{background:rgba(224,165,60,.14);color:#9b6811}.seller-status.rejected{background:rgba(192,57,43,.12);color:#a32e21}.seller-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:16px;margin-top:20px}.seller-card{border:1px solid var(--line);border-radius:16px;padding:18px;background:var(--card)}.seller-card h3{margin:0 0 6px;color:var(--navy);font-size:1rem}.seller-card p{color:var(--muted);font-size:.8rem;line-height:1.55}.seller-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:14px}.seller-kpi{padding:13px;border-radius:12px;background:var(--bg);border:1px solid var(--line)}.seller-kpi b{display:block;font-size:1.25rem;color:var(--navy)}.seller-kpi span{font-size:.68rem;color:var(--muted)}.seller-form{display:grid;gap:11px;margin-top:14px}.seller-form input,.seller-form textarea,.seller-form select{width:100%}.seller-form textarea{min-height:84px;resize:vertical}.seller-note{font-size:.75rem;color:var(--muted);padding:10px 12px;border-radius:10px;background:var(--bg)}.seller-list{display:grid;gap:9px;margin-top:12px}.seller-list-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 12px;background:var(--bg);border-radius:10px;font-size:.78rem}.seller-list-row small{color:var(--muted)}
@media(max-width:760px){.marketplace-tools{display:grid;grid-template-columns:1fr}.marketplace-directory{grid-template-columns:1fr}.seller-modal-box{width:100%!important;max-height:calc(100svh - 14px)!important}.seller-shell{padding:20px 14px}.seller-head{display:block}.seller-status{display:inline-block;margin-top:12px}.seller-grid{grid-template-columns:1fr}.seller-kpis{grid-template-columns:repeat(3,1fr)}.seller-card{padding:14px}}
