/* ===== لایه تم v4 — ظاهر حرفه‌ای‌تر، روی app.css ===== */
:root{--r:22px;--sh:0 1px 2px rgba(15,23,42,.04),0 10px 30px -14px rgba(15,23,42,.18);--ring:0 0 0 4px color-mix(in srgb,var(--primary) 16%,transparent)}
::selection{background:color-mix(in srgb,var(--primary) 28%,transparent)}
body{background:radial-gradient(1200px 500px at 85% -5%,color-mix(in srgb,var(--primary) 9%,transparent),transparent 60%),radial-gradient(900px 400px at 0% 20%,color-mix(in srgb,var(--accent) 7%,transparent),transparent 60%),var(--bg);background-attachment:fixed}
:focus-visible{outline:2px solid var(--primary);outline-offset:2px;border-radius:8px}
/* نوار اعلان */
.announce{background:linear-gradient(90deg,var(--primary),var(--accent));color:#fff;font-size:13px;font-weight:600;position:relative;z-index:55}
.announce .wrap{display:flex;justify-content:center;align-items:center;padding:7px 44px;text-align:center;position:relative}.announce a,.announce span{color:#fff}.announce a:hover{text-decoration:underline}
.announce button{position:absolute;left:14px;top:50%;transform:translateY(-50%);background:rgba(255,255,255,.2);color:#fff;border:0;border-radius:50%;width:24px;height:24px;cursor:pointer;line-height:1;font-size:16px}
/* هدر */
.site-header{box-shadow:0 1px 0 var(--line),0 12px 30px -24px rgba(15,23,42,.4)}
.head-main{padding-top:12px;padding-bottom:12px}
.search input{box-shadow:inset 0 0 0 1px var(--line);background:var(--bg)}.search input:focus{box-shadow:var(--ring);background:var(--card)}
.cat-nav a{transition:.2s}.cat-nav a:hover{background:color-mix(in srgb,var(--primary) 10%,transparent);color:var(--primary)}
.act{border-radius:14px}.cnt{box-shadow:0 4px 10px -2px rgba(244,63,94,.6)}
/* دکمه‌ها */
.btn{box-shadow:0 12px 24px -12px var(--primary);letter-spacing:.1px}.btn:hover{transform:translateY(-2px);box-shadow:0 18px 30px -14px var(--primary)}
/* عنوان بخش‌ها */
.sec-head{margin:34px 0 16px}.sec-head h2{position:relative;padding-right:16px;font-size:21px;margin:0}.sec-head h2:before{content:"";position:absolute;right:0;top:50%;transform:translateY(-50%);width:6px;height:70%;border-radius:6px;background:var(--grad)}
.sec-head a{font-weight:700;color:var(--primary);background:color-mix(in srgb,var(--primary) 9%,transparent);padding:5px 14px;border-radius:99px;font-size:13px}.sec-head a:hover{background:var(--primary);color:#fff}
/* کارت محصول */
.card{border-radius:var(--r);border:1px solid var(--line);transition:transform .28s cubic-bezier(.2,.8,.2,1),box-shadow .28s,border-color .28s;overflow:hidden;position:relative}
.card:hover{transform:translateY(-6px);box-shadow:0 26px 44px -22px rgba(15,23,42,.38);border-color:color-mix(in srgb,var(--primary) 35%,var(--line))}
.card-img{display:block;overflow:hidden}.card-img img{transition:transform .5s cubic-bezier(.2,.8,.2,1)}.card:hover .card-img img{transform:scale(1.07)}
.card.is-out .card-img img{filter:grayscale(.85);opacity:.7}
.badge-off{background:linear-gradient(135deg,#f43f5e,#fb7185);box-shadow:0 8px 16px -6px rgba(244,63,94,.7);font-weight:800}
.card-tools{opacity:0;transform:translateX(8px);transition:.25s}.card:hover .card-tools,.card:focus-within .card-tools{opacity:1;transform:none}@media(hover:none){.card-tools{opacity:1;transform:none}}
.card-title{font-weight:700}
/* دسته‌بندی‌ها، اعتماد */
.cat-grid a{transition:.25s;border:1px solid var(--line)}.cat-grid a:hover{transform:translateY(-5px);border-color:var(--primary);box-shadow:var(--sh)}
.trust{border:1px solid var(--line);box-shadow:var(--sh)}.trust>div{transition:.25s}.trust>div:hover{transform:translateY(-3px)}
.promo-grid a{overflow:hidden;border-radius:var(--r)}.promo-grid img{transition:transform .6s}.promo-grid a:hover img{transform:scale(1.05)}
.hero{border-radius:28px}
/* صفحه محصول */
.g-main{border-radius:var(--r);overflow:hidden;cursor:zoom-in;border:1px solid var(--line)}.g-main img{transition:transform .5s}.g-main:hover img{transform:scale(1.04)}
.g-thumbs img{border-radius:14px;border:2px solid transparent;cursor:pointer;transition:.2s}.g-thumbs img:hover{border-color:var(--primary)}
.buy-box{border-radius:var(--r);box-shadow:var(--sh);border:1px solid var(--line)}
.share-row{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0}.share-row button,.share-row a{background:var(--card);border:1px solid var(--line);border-radius:99px;padding:5px 14px;font:inherit;font-size:13px;cursor:pointer;color:var(--text)}.share-row button:hover,.share-row a:hover{border-color:var(--primary);color:var(--primary)}
/* نوار خرید چسبان */
.stickybuy{position:fixed;right:0;left:0;bottom:0;z-index:60;background:color-mix(in srgb,var(--card) 92%,transparent);backdrop-filter:blur(16px);border-top:1px solid var(--line);box-shadow:0 -12px 30px -16px rgba(15,23,42,.35);transform:translateY(110%);transition:transform .3s}
.stickybuy.show{transform:none}.stickybuy .wrap{display:flex;gap:14px;align-items:center;padding-top:10px;padding-bottom:10px}.stickybuy img{width:46px;height:46px;object-fit:contain;border-radius:10px;background:#fff}.stickybuy .nm{flex:1;min-width:0;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.stickybuy .pr{color:var(--primary);font-weight:800;white-space:nowrap}.stickybuy .btn{padding:9px 22px}
@media(max-width:760px){.stickybuy{bottom:62px}.stickybuy img{display:none}}
/* لایت‌باکس */
.lb{position:fixed;inset:0;background:rgba(2,6,23,.92);z-index:300;display:none;align-items:center;justify-content:center;padding:20px}.lb.open{display:flex;animation:fadeIn .2s}.lb img{max-width:min(1100px,94vw);max-height:88vh;object-fit:contain;border-radius:14px;background:#fff}.lb button{position:absolute;background:rgba(255,255,255,.14);color:#fff;border:0;border-radius:50%;width:46px;height:46px;font-size:24px;cursor:pointer}.lb .x{top:18px;left:18px}.lb .pv{right:18px;top:50%}.lb .nx{left:18px;top:50%}@keyframes fadeIn{from{opacity:0}}
/* اخیراً دیده‌شده */
.recent{margin:30px 0}.recent .rc-row{display:flex;gap:12px;overflow-x:auto;padding-bottom:8px;scroll-snap-type:x mandatory;scrollbar-width:thin}.recent a{flex:0 0 170px;scroll-snap-align:start;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:10px;transition:.25s}.recent a:hover{transform:translateY(-4px);box-shadow:var(--sh);border-color:var(--primary)}.recent img{width:100%;aspect-ratio:1;object-fit:contain;background:#fff;border-radius:12px}.recent b{display:block;font-size:13px;line-height:1.6;margin:6px 0 2px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.recent span{color:var(--primary);font-weight:800;font-size:13px}
/* ارسال رایگان در سبد */
.freeship{background:color-mix(in srgb,var(--green) 9%,var(--card));border:1px dashed color-mix(in srgb,var(--green) 45%,transparent);border-radius:16px;padding:10px 14px;margin-bottom:12px;font-size:13.5px}.freeship p{margin:0 0 6px}.fs-bar{height:8px;background:var(--line);border-radius:99px;overflow:hidden}.fs-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--green),#34d399);border-radius:99px;transition:width .6s}
/* دکمه‌های شناور تماس */
.fab{position:fixed;left:16px;bottom:84px;z-index:58;display:flex;flex-direction:column;align-items:flex-start;gap:10px}.fab-btn{width:54px;height:54px;border-radius:50%;border:0;background:var(--grad);color:#fff;display:grid;place-items:center;cursor:pointer;box-shadow:0 14px 28px -10px var(--primary);transition:.25s}.fab-btn:hover{transform:scale(1.08)}
.fab-list{display:flex;flex-direction:column;gap:8px;opacity:0;pointer-events:none;transform:translateY(10px);transition:.25s}.fab.open .fab-list{opacity:1;pointer-events:auto;transform:none}.fab-list a{color:#fff;padding:8px 18px;border-radius:99px;font-weight:700;font-size:13px;box-shadow:0 10px 20px -10px rgba(0,0,0,.5)}.fab-list .wa{background:#22c55e}.fab-list .tg{background:#229ed9}.fab-list .ph{background:var(--ink)}
@media(min-width:900px){.fab{bottom:24px}}
/* پایین صفحه */
.site-footer{background:linear-gradient(180deg,var(--ink),#060d1f);color:#b6c3dc;border-top:0;margin-top:50px}.site-footer h4{color:#fff}.site-footer a{color:#b6c3dc}.site-footer a:hover{color:#fff}.site-footer .muted{color:#8ea0c0}.site-footer .copy{border-top:1px solid rgba(255,255,255,.08);color:#8ea0c0}
.toTop{box-shadow:0 12px 24px -10px var(--primary)}
/* اسکلت بارگذاری و ورود نرم */
.reveal{animation:revealUp .6s both}@keyframes revealUp{from{opacity:0;transform:translateY(18px)}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}