/* =====================================================================
   মোবাইল ডিজাইন (শুধু ৭৯৯px পর্যন্ত) — পরিষ্কার, হালকা, অ্যাপের মতো
   • ডেস্কটপ (৮০০px+) এ এই ফাইলের কোনো নিয়ম প্রযোজ্য নয় — ডেস্কটপ আগের মতোই
   • ব্যাকগ্রাউন্ড সাদা; প্রাইমারি রঙ শুধু উপরের লোগো/কার্ট ব্যান্ডে + বাটন/অ্যাকসেন্টে
   • রঙ: শুধু hex/rgba (পুরনো ফোনে color-mix ইত্যাদি নেই)
   • অ্যাডমিন → সেটিংস এর হেডার রঙ (সার্চ বর্ডার, আইকন রঙ ...) সেট থাকলে তা-ই কাজ করে
   ===================================================================== */
@media (max-width:799px){

:root{--bg:#fff;--bd:#e8edea;--mut:#6c7870;--red:#d93025;--shd:0 1px 2px rgba(16,24,20,.05),0 4px 14px rgba(16,24,20,.05)}
html{-webkit-tap-highlight-color:transparent}
body{background:#fff}
@keyframes szm-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
main.content{animation:szm-in .28s ease-out both}
@media (prefers-reduced-motion:reduce){main.content{animation:none}}

/* ---------- হেডার: উপরে প্রাইমারি ব্যান্ড (লোগো + আইকন), নিচে সাদা শিট ---------- */
header.site{background:var(--pri);box-shadow:none}
header.site::before{content:"";position:absolute;left:0;right:0;bottom:0;top:calc(env(safe-area-inset-top,0px) + 46px);background:#fff;border-radius:22px 22px 0 0;pointer-events:none}
header.site .hrow{position:relative;z-index:3;grid-template-rows:auto auto;gap:0 10px;padding-top:8px;padding-bottom:12px}
header.site .logo{min-height:38px}
header.site .logo img{height:32px}
header.site .hnav{gap:6px}
header.site .hnav .hbtn{color:#fff}
.hbtn{padding:7px 9px;border-radius:12px}
.hbtn:hover{background:transparent}
.hbtn:active{background:rgba(255,255,255,.18)}
.hbtn.login{background:transparent;border:1.5px solid rgba(255,255,255,.75);border-radius:999px;padding:6px 14px;font-size:13.5px;transition:background .15s}
.hbtn.login:active{background:rgba(255,255,255,.18)}
.cartbtn b{background:#fff;color:var(--pri);box-shadow:0 1px 4px rgba(0,0,0,.18)}

/* সার্চ বার: সাদা, পিল আকৃতি, বাঁয়ে আইকন (ডানের বাটন লুকানো — কিবোর্ডের Go/Enter দিয়েই সার্চ হয়) */
header.site .hsearch{margin-top:15px;position:relative}
header.site .hsearch::before{content:"";position:absolute;left:17px;top:23px;width:20px;height:20px;transform:translateY(-50%);z-index:2;pointer-events:none;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237d8a82' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-3.6-3.6'/%3E%3C/svg%3E") center/contain no-repeat}
header.site .hsearch input{height:46px;padding:0 18px 0 46px;border:1.5px solid var(--pri);border-radius:999px;background:#fff;font-size:15px;color:var(--fg);box-shadow:0 2px 10px rgba(16,24,20,.05);outline:0;-webkit-appearance:none;appearance:none;transition:box-shadow .2s,border-color .2s}
body header.site .hsearch input{border-width:1.5px;border-radius:999px}
header.site .hsearch input::placeholder{color:#8b968f;opacity:1}
header.site .hsearch input:focus{box-shadow:0 0 0 4px var(--sec)}
header.site .hsearch button{display:none}
.hs-dd{top:calc(100% + 8px);border-radius:18px;border-color:var(--bd);box-shadow:0 14px 34px rgba(16,24,20,.16)}
.hs-i{border-radius:12px}

/* ক্যাটাগরি/মেনু চিপ: সাদা ব্যাকগ্রাউন্ডে হালকা পিল */
header.site .menubar{position:relative;z-index:1;background:#fff}
header.site .menubar .wrap{gap:8px;padding-top:0;padding-bottom:10px}
header.site .menubar a{background:#f3f6f4;border:1px solid transparent;color:#27312b;font-size:13px;font-weight:600;padding:6px 15px;box-shadow:none}
header.site .menubar a:hover,header.site .menubar a:focus-visible{background:#f3f6f4;border-color:transparent}
header.site .menubar a:active{background:var(--sec);color:var(--pri);transform:scale(.96)}

/* ---------- বডি/সেকশনের শিরোনাম ---------- */
body h2.sec{font-size:18px;font-weight:700;margin:22px 2px 10px;letter-spacing:-.1px}
body h2.sec a{font-size:13.5px;font-weight:600}
body .hm-head h2{font-size:18px;font-weight:700}
body .hm-head p{font-size:13px}
body .hm-all{font-size:13.5px}
body .hm-sec{margin:min(var(--hmg,22px),20px) 0}
body .hm>.hm-sec:first-child{margin-top:6px}

/* ---------- ব্যানার/হিরো ---------- */
body .hero,body .lp-hero{border-radius:18px}
body .hero{margin:6px 0 12px}
body .hero .dots i,body .lp-dots i{background:rgba(255,255,255,.7)}
body .hero .dots i.on{background:#fff}

/* ---------- ক্যাটাগরি ---------- */
body .cat{border:0;background:#f5f8f6;border-radius:16px;padding:8px 6px 9px;font-size:12.5px;font-weight:600;transition:transform .15s}
body .cat:active{transform:scale(.97)}
body .cat img{border-radius:12px}
body .hm-circ img{border:0;background:#f3f6f4}
body .hm-circ{font-size:12px}
body .hm-chip{border:0;background:#f3f6f4;color:#27312b}
body .hm-tile{border-radius:16px}

/* ---------- পণ্য কার্ড: কম রঙ — সাদা কার্ড, গাঢ় দাম, একটাই অ্যাকসেন্ট (প্রাইমারি) ---------- */
body .grid{gap:9px}
body .card{border:1px solid #edf1ee;border-radius:16px;box-shadow:var(--shd);transition:transform .15s,box-shadow .2s}
body .card:active{transform:scale(.985)}
body .card .im{border-bottom:0;padding:6px 6px 0;background:#fff}
body .card .im img{border-radius:12px}
body .card .bd{padding:7px 8px 9px}
body .card .nm{color:var(--fg);font-weight:600}
body .card .un{color:var(--mut)}
body .card .pr b,body .lp-card .pr b,body .hm-lcb .pr b{color:var(--fg);font-weight:800}
body .card .pr s,body .hm-lcb .pr s{color:#9aa49e}
body .add{background:var(--pri);border-radius:50%;width:28px;height:28px;font-size:18px;line-height:1;box-shadow:0 2px 6px rgba(16,24,20,.16);transition:transform .12s}
body .add:active{transform:scale(.88)}
body .add:disabled{background:#cfd6d2;box-shadow:none}
body .badge,body .lp-card .badge,body .pd-badge{background:var(--pri);color:#fff;border-radius:999px;font-weight:700;padding:2px 7px}
body .btn{border-radius:14px;transition:transform .12s,opacity .15s}
body .btn:active{transform:scale(.97)}
body .btn.alt{border-color:var(--bd);color:var(--pri)}

/* ---------- হোম ডিজাইনার সেকশন ---------- */
/* টিকার: রঙ অ্যাডমিন থেকে (টিকার সেকশনের "টিকারের ব্যাকগ্রাউন্ড রঙ" ঘরে) বদলানো যায়; খালি থাকলে প্রাইমারি */
body .hm-tick{border-radius:12px;padding:8px 0}
body .hm-tk{font-size:13px;font-weight:600}
/* ফ্ল্যাশ সেল: ভারী রঙিন বক্সের বদলে পরিষ্কার সাদা কার্ড */
body .hm-flash{background:#fff;background-image:none;color:var(--fg);border:1px solid var(--bd);border-radius:20px;box-shadow:var(--shd);padding:14px 12px 14px}
body .hm-fh h2{font-size:18px;color:var(--fg)}
body .hm-flash .hm-all{background:var(--sec);color:var(--pri);padding:5px 12px;font-weight:700}
body .hm-flash .hm-cd i{background:#1f2a24;color:#fff;border-radius:8px}
body .hm-flash .hm-cdl{color:var(--mut)}
body .hm-flash .card{box-shadow:none;border-color:var(--bd)}
body .hm-fs{color:var(--mut)}
body .hm-cd i{background:#1f2a24}
body .lp-timer{background:var(--sec);color:var(--pri)}
body .hm-lc,body .hm-deal,body .hm-split,body .hm-fi,body .hm-brands a,body .hm-brands div{border:1px solid #edf1ee;border-radius:16px;box-shadow:var(--shd)}
body .hm-fi{background:#fff}
body .hm-feat.inline .hm-fi{box-shadow:none;border:0}
body .hm-cp{border:1.5px dashed #cfd9d3;border-radius:16px}
body .hm-promo,body .hm-spb,body .hm-cdb{border-radius:18px}
body .hm-nv{display:none}

/* ---------- বটম নেভ: আরও হালকা, ব্যাজ প্রাইমারি ---------- */
body .bnav{background:rgba(255,255,255,.96);border-top:1px solid #edf1ee;border-radius:20px 20px 0 0;box-shadow:0 -4px 20px rgba(16,24,20,.08)}
body .bnav a,body .bnav button{color:#7d8a82}
body .bnav a.on:before,body .bnav button.on:before{opacity:.12}
body .bnav .cartbtn b{background:var(--pri);color:#fff;border-color:#fff}

/* ---------- ক্যাটাগরি ড্রয়ার ---------- */
.sidenav{border-radius:0 22px 22px 0}
.sn-head{background:#fff;color:var(--fg);border-bottom:1px solid var(--bd);padding:16px}
.sn-head .close{background:#f1f4f2;color:#46524b}
.tree .row{border-radius:12px}

/* ---------- ফুটার: আগের গাঢ় রঙই (সাদা লোগো পড়ার জন্য), শুধু উপরের কোণ গোল ---------- */
footer.site{border-radius:24px 24px 0 0;margin-top:26px}

}