/* =========================================================
   فروشگاه آنلاین آدین - استایل (RTL / سفید-طلایی)
   رنگ‌ها و چیدمان مطابق MyColors.dart در نسخهٔ فلاتر
   ========================================================= */

@font-face{font-family:'IRANYekanX';src:url('/assets/fonts/IRANYekanX-Light.woff2') format('woff2'),url('/assets/fonts/IRANYekanX-Light.ttf') format('truetype');font-weight:300;font-display:swap;}
@font-face{font-family:'IRANYekanX';src:url('/assets/fonts/IRANYekanX-Medium.woff2') format('woff2'),url('/assets/fonts/IRANYekanX-Medium.ttf') format('truetype');font-weight:500;font-display:swap;}
@font-face{font-family:'IRANYekanX';src:url('/assets/fonts/IRANYekanX-Bold.woff2') format('woff2'),url('/assets/fonts/IRANYekanX-Bold.ttf') format('truetype');font-weight:700;font-display:swap;}

:root{
  --primary:#344955;
  --primary-dark:#232f34;
  --accent:#FAAB1A;          /* طلایی/کهربایی */
  --accent-rev:#03DAC6;
  --red:#e53935;
  --green:#00796B;
  --bg:#edf0f2;              /* bg_light */
  --card:#ffffff;            /* bg_white */
  --bg-gray:#e7e7e7;
  --text:#222222;
  --text-gray:#999999;
  --line:rgba(0,0,0,.08);
  --shadow:0 2px 10px rgba(52,73,85,.08);
  --shadow-hover:0 8px 24px rgba(52,73,85,.16);
  --radius:12px;
  --maxw:1120px;
}
html[data-theme="dark"]{
  --primary:#03DAC6;
  --accent:#03DAC6;
  --accent-rev:#FAAB1A;
  --bg:#1d1d1d;
  --card:#161616;
  --bg-gray:#383838;
  --text:#edf0f2;
  --text-gray:#a8adb2;
  --line:rgba(255,255,255,.10);
  --shadow:0 2px 10px rgba(0,0,0,.4);
  --shadow-hover:0 8px 24px rgba(0,0,0,.55);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;font-family:'IRANYekanX',Tahoma,sans-serif;
  background:var(--bg);color:var(--text);line-height:1.9;font-size:15px;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none;}
img{max-width:100%;display:block;}
button{font-family:inherit;cursor:pointer;}
h1,h2,h3{margin:0;font-weight:700;}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);border:0;}
.skip-link{position:absolute;right:-999px;top:0;background:var(--accent);color:#000;padding:8px 14px;z-index:100;}
.skip-link:focus{right:8px;top:8px;border-radius:6px;}
.muted{color:var(--text-gray);font-weight:500;font-size:.85em;}
.sm{font-size:.8em;}
.c-red{color:var(--red);}
.c-gold{color:var(--accent);}
.container{max-width:var(--maxw);margin:0 auto;padding:0 12px;}
.page{min-height:100vh;display:flex;flex-direction:column;}

/* ---------- دکمه‌ها ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;
  border:none;border-radius:8px;padding:10px 18px;font-weight:700;font-size:14px;
  transition:transform .15s ease,box-shadow .2s ease,background .2s ease,filter .2s ease;}
.btn:active{transform:scale(.97);}
.btn-primary{background:var(--accent);color:#3a2e00;}
.btn-primary:hover{filter:brightness(1.05);box-shadow:var(--shadow);}
.btn-ghost{background:transparent;color:var(--text);}
.btn-ghost:hover{background:var(--bg-gray);}
.btn-link{background:none;color:var(--green);padding:4px 8px;font-weight:700;}
.btn-add{background:var(--red);color:#fff;width:100%;padding:13px;font-size:15px;}
.btn-add:hover{filter:brightness(1.05);box-shadow:0 6px 18px rgba(229,57,53,.3);}
.btn-add:disabled{background:var(--bg-gray);color:var(--text-gray);cursor:not-allowed;}
.btn-call{background:transparent;color:var(--green);border:1.5px solid var(--green);width:100%;padding:12px;}
.icon-btn{background:transparent;border:none;padding:8px;border-radius:50%;color:var(--text);display:inline-flex;transition:background .2s;}
.icon-btn:hover{background:var(--bg-gray);}
.ic{width:22px;height:22px;fill:currentColor;}
.ic.tiny{width:16px;height:16px;}
.ic.star{width:15px;height:15px;fill:var(--accent);}

/* ---------- هدر ---------- */
.site-header{
  background:var(--card);box-shadow:var(--shadow);
  display:flex;align-items:center;gap:10px;
  padding:8px 14px;border-radius:0 0 var(--radius) var(--radius);
  position:sticky;top:0;z-index:40;
  max-width:var(--maxw);margin:0 auto 6px;
}
.logo{flex-shrink:0;width:56px;height:56px;border-radius:10px;overflow:hidden;display:flex;align-items:center;justify-content:center;}
.logo img{width:56px;height:56px;object-fit:contain;}
.logo-fallback{width:56px;height:56px;background:var(--accent);color:#000;font-size:26px;font-weight:700;display:flex;align-items:center;justify-content:center;border-radius:10px;}
.search{flex:1;display:flex;align-items:center;gap:6px;background:var(--bg);border:1px solid var(--bg-gray);
  border-radius:8px;padding:0 10px;height:46px;min-width:0;}
.search .ic{fill:var(--text-gray);flex-shrink:0;}
.search input{flex:1;border:none;background:transparent;color:var(--text);font-family:inherit;font-size:14px;outline:none;min-width:0;}
.header-actions{display:flex;align-items:center;gap:2px;flex-shrink:0;}
.cart-btn{position:relative;}
.cart-badge{position:absolute;top:0;left:0;background:var(--red);color:#fff;border-radius:50%;
  min-width:18px;height:18px;font-size:11px;display:flex;align-items:center;justify-content:center;font-weight:700;padding:0 2px;}
.account-btn{white-space:nowrap;}
.account-btn span{font-size:13px;}
@media(max-width:560px){.account-btn span{display:none;}.search input{font-size:13px;}}

/* ---------- نوار دسته‌بندی ---------- */
.groupbar{background:var(--card);box-shadow:var(--shadow);border-radius:var(--radius);
  display:flex;align-items:center;gap:4px;padding:8px 12px;margin-bottom:8px;overflow-x:auto;}
.groupbar::-webkit-scrollbar{height:0;}
.groupbar-title{font-weight:700;white-space:nowrap;}
.chev{fill:var(--text-gray);flex-shrink:0;}
.chips{display:flex;gap:2px;}
.chip-wrap{position:relative;}
.chip{display:inline-flex;align-items:center;gap:2px;padding:6px 12px;white-space:nowrap;border-radius:8px;
  color:var(--text);font-weight:500;transition:background .2s,color .2s;}
.chip:hover{background:var(--bg);color:var(--accent);}
.chip-all{color:var(--green);font-weight:700;}
.submenu{position:absolute;top:100%;right:0;background:var(--card);box-shadow:var(--shadow-hover);
  border-radius:10px;padding:6px;min-width:170px;display:none;flex-direction:column;z-index:50;
  animation:pop .18s ease;}
.chip-wrap:hover .submenu,.chip-wrap:focus-within .submenu{display:flex;}
.submenu a{padding:8px 12px;border-radius:6px;white-space:nowrap;transition:background .15s;}
.submenu a:hover{background:var(--bg);}
.submenu-all{color:var(--green);font-weight:700;border-top:1px solid var(--line);margin-top:4px;}
@keyframes pop{from{opacity:0;transform:translateY(-6px);}to{opacity:1;transform:none;}}

/* ---------- اسلایدر ---------- */
.slider{position:relative;border-radius:var(--radius);overflow:hidden;margin-bottom:24px;background:var(--card);box-shadow:var(--shadow);}
.slider .slides{display:flex;transition:transform .45s ease;}
.slider .slide{min-width:100%;}
.slider .slide img{width:100%;height:auto;object-fit:cover;max-height:340px;}
.slider .dots{position:absolute;bottom:10px;left:0;right:0;display:flex;justify-content:center;gap:8px;}
.dot{width:10px;height:10px;border-radius:50%;border:none;background:rgba(255,255,255,.55);transition:background .2s,transform .2s;}
.dot.active{background:var(--red);transform:scale(1.2);}

/* ---------- ردیف کالا ---------- */
.prow{margin-bottom:14px;}
.prow-title{font-size:16px;font-weight:700;margin:24px 6px 8px;position:relative;padding-right:12px;}
.prow-title::before{content:"";position:absolute;right:0;top:50%;transform:translateY(-50%);width:5px;height:20px;background:var(--accent);border-radius:3px;}
.prow-scroll{display:flex;gap:10px;overflow-x:auto;padding:6px 2px 12px;scroll-snap-type:x proximity;}
.prow-scroll::-webkit-scrollbar{height:6px;}
.prow-scroll::-webkit-scrollbar-thumb{background:var(--bg-gray);border-radius:3px;}
.shegeft{background:var(--red);border-radius:var(--radius);padding:6px;}
.shegeft .prow-scroll{align-items:stretch;}
.shegeft-head{min-width:120px;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff;font-weight:700;text-align:center;gap:8px;}
.shegeft-box{font-size:46px;}

/* ---------- کارت کالا ---------- */
.card{min-width:var(--card-w);width:var(--card-w);background:var(--card);border-radius:var(--radius);
  box-shadow:var(--shadow);overflow:hidden;display:flex;flex-direction:column;
  scroll-snap-align:start;transition:transform .2s ease,box-shadow .2s ease;}
.card:hover{transform:translateY(-4px);box-shadow:var(--shadow-hover);}
.card-img{position:relative;padding:14px;display:flex;align-items:center;justify-content:center;height:var(--card-img);}
.card-img img{width:130px;height:130px;object-fit:contain;transition:transform .25s;}
.card:hover .card-img img{transform:scale(1.05);}
.card-img img.noimg{visibility:hidden;}
.card-img img.noimg+*{}
.card-img::after{content:"";}
.off-badge{position:absolute;top:8px;right:8px;background:var(--red);color:#fff;font-weight:700;
  border-radius:50%;width:34px;height:34px;display:flex;align-items:center;justify-content:center;font-size:12px;box-shadow:0 2px 6px rgba(0,0,0,.2);}
.off-badge.lg{width:40px;height:40px;font-size:14px;position:static;}
.card-colors{position:absolute;top:8px;left:8px;display:flex;flex-direction:column;gap:3px;align-items:center;}
.card-colors i{width:11px;height:11px;border-radius:50%;border:1px solid rgba(0,0,0,.15);box-shadow:0 1px 2px rgba(0,0,0,.15);}
.card-colors b{font-size:9px;color:var(--text-gray);}
.card-name{padding:2px 10px;font-weight:700;font-size:13.5px;text-align:center;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:42px;}
.card-bottom{margin-top:auto;padding:6px 10px 12px;text-align:center;}
.card-score{display:flex;align-items:center;justify-content:flex-end;gap:2px;font-size:11px;font-weight:700;color:var(--text-gray);margin-bottom:2px;}
.card-price{display:flex;align-items:center;justify-content:center;gap:6px;flex-wrap:wrap;}
.card-price .now{font-weight:700;font-size:14px;}
.card-price .cur{font-size:11px;font-weight:500;}
.card-price .old{color:var(--text-gray);font-size:11px;text-decoration:line-through;}
.card-price.call{color:var(--green);font-weight:700;}
.see-all{min-width:130px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;color:var(--text);}
.see-all .ic{width:34px;height:34px;fill:var(--accent-rev);}
.see-all:hover{color:var(--accent);}

/* ---------- المان reveal (انیمیشن سبک ظاهر شدن) ---------- */
[data-reveal]{opacity:0;transform:translateY(14px);}
[data-reveal].in{opacity:1;transform:none;transition:opacity .5s ease,transform .5s ease;}

/* ---------- breadcrumb ---------- */
.crumb{display:flex;flex-wrap:wrap;align-items:center;gap:6px;background:var(--card);box-shadow:var(--shadow);
  border-radius:var(--radius);padding:8px 14px;margin-bottom:12px;font-size:13px;overflow-x:auto;}
.crumb a{color:var(--text);font-weight:500;white-space:nowrap;}
.crumb a:hover{color:var(--accent);}
.crumb .sep{color:var(--text-gray);}

/* ---------- لیست / گرید ---------- */
.list-toolbar{background:var(--card);box-shadow:var(--shadow);border-radius:var(--radius);padding:12px 14px;margin-bottom:12px;
  display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;}
.list-title{font-size:17px;}
.list-controls{display:flex;align-items:center;gap:14px;flex-wrap:wrap;}
.chk{display:inline-flex;align-items:center;gap:6px;font-size:13px;cursor:pointer;}
.sort-form select{border:none;background:var(--bg);border-radius:8px;padding:8px 10px;font-family:inherit;color:var(--text);border-bottom:2px solid var(--accent);}
.view-toggle .list-ic{display:none;}
.view-toggle.as-list .grid-ic{display:none;}
.view-toggle.as-list .list-ic{display:inline;}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(var(--card-w),1fr));gap:12px;justify-items:center;}
.grid .card{width:100%;min-width:0;}
.grid.as-list{grid-template-columns:1fr;}
.grid.as-list .card{flex-direction:row;width:100%;align-items:center;text-align:right;}
.grid.as-list .card-img{width:80px;height:80px;padding:8px;flex-shrink:0;}
.grid.as-list .card-img img{width:64px;height:64px;}
.grid.as-list .card-name{-webkit-line-clamp:1;min-height:auto;text-align:right;flex:1;}
.grid.as-list .card-bottom{margin:0;padding:8px 12px;}
.grid.as-list .off-badge{width:26px;height:26px;font-size:10px;}

/* ---------- صفحهٔ کالا ---------- */
.product{background:transparent;}
.product-top{background:var(--card);box-shadow:var(--shadow);border-radius:var(--radius);padding:20px;
  display:flex;gap:26px;margin-bottom:20px;}
.product-gallery{flex-shrink:0;width:330px;max-width:45%;background:var(--card);border-radius:10px;
  display:flex;align-items:center;justify-content:center;}
.product-gallery img{width:100%;max-width:330px;height:auto;object-fit:contain;border-radius:10px;transition:opacity .3s;}
.product-gallery img.noimg{min-height:260px;background:var(--bg);}
.product-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:16px;}
.product-name{font-size:21px;line-height:1.7;}
.sku-selectors{display:flex;flex-direction:column;gap:12px;}
.sku-attr{display:flex;flex-direction:column;gap:6px;}
.sku-attr-name{font-weight:700;font-size:13px;}
.sku-values{display:flex;flex-wrap:wrap;gap:8px;}
.sku-val{border:1.5px solid var(--bg-gray);background:var(--card);color:var(--text);border-radius:8px;padding:7px 14px;font-weight:500;transition:border .2s,color .2s,transform .15s;}
.sku-val:hover{border-color:var(--accent);}
.sku-val.selected{border-color:var(--accent);color:var(--accent);font-weight:700;}
.sku-val.is-color{width:34px;height:34px;padding:0;border-radius:50%;background:var(--c);position:relative;}
.sku-val.is-color.selected{box-shadow:0 0 0 2px var(--card),0 0 0 4px var(--accent);}
.sku-val.disabled{opacity:.35;text-decoration:line-through;cursor:not-allowed;}
.seller-box{background:var(--bg);border-radius:10px;padding:18px;display:flex;flex-direction:column;gap:14px;}
.seller-name{border-bottom:1px solid var(--line);padding-bottom:8px;font-size:13px;}
.price-off-line{display:flex;align-items:center;gap:8px;}
.old-price{color:var(--text-gray);text-decoration:line-through;font-size:13px;}
.final-price{font-size:17px;}
.final-price b{font-size:20px;color:var(--text);}
.sold-out{color:var(--red);font-weight:700;text-align:center;}
.pblock{background:var(--card);box-shadow:var(--shadow);border-radius:var(--radius);padding:18px;margin-bottom:16px;}
.pblock-title{font-size:15px;margin-bottom:12px;position:relative;padding-right:12px;}
.pblock-title::before{content:"";position:absolute;right:0;top:3px;width:4px;height:18px;background:var(--accent);border-radius:2px;}
.pblock-body{line-height:2.1;font-size:14px;}
.pblock-body.clampable{max-height:120px;overflow:hidden;position:relative;transition:max-height .4s ease;}
.pblock-body.clampable.open{max-height:2000px;}
.specs{width:100%;border-collapse:collapse;}
.specs th,.specs td{padding:11px 12px;text-align:right;border-bottom:1px solid var(--line);font-size:14px;}
.specs th{color:var(--text-gray);font-weight:500;width:35%;}
.specs td{font-weight:700;}

/* ---------- امتیاز و دیدگاه ---------- */
.rating-summary{display:flex;align-items:center;gap:10px;margin-bottom:14px;}
.rating-big{font-size:28px;font-weight:700;color:var(--accent);}
.rating-stars,.comment-stars{--r:0%;display:inline-block;height:18px;width:96px;
  background:linear-gradient(90deg,var(--accent) var(--r),var(--bg-gray) var(--r));
  -webkit-mask:repeating-linear-gradient(90deg,#000 0 14px,transparent 14px 18px);
  mask:repeating-linear-gradient(90deg,#000 0 14px,transparent 14px 18px);}
.comment-stars{height:14px;width:80px;}
.rating-count{color:var(--text-gray);font-size:13px;}
.comment-form-wrap{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:12px 0;margin-bottom:12px;}
.comment-form{display:flex;flex-direction:column;gap:10px;margin-top:10px;}
.comment-form input,.comment-form textarea{border:1px solid var(--bg-gray);background:var(--bg);border-radius:8px;padding:10px;font-family:inherit;color:var(--text);}
.stars-input{display:flex;gap:4px;direction:ltr;justify-content:flex-end;}
.stars-input button{background:none;border:none;font-size:26px;color:var(--bg-gray);transition:color .15s;}
.stars-input button.on{color:var(--accent);}
.comments{display:flex;flex-direction:column;gap:12px;}
.comment{background:var(--bg);border-radius:10px;padding:12px 14px;}
.comment-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:4px;}
.comment-name{font-weight:700;font-size:13px;}
.comment-title{font-weight:700;font-size:14px;margin-bottom:2px;}
.comment-text{margin:0;font-size:13.5px;line-height:1.9;}
.form-msg{font-size:13px;font-weight:700;}
.form-msg.ok{color:var(--green);}
.form-msg.err{color:var(--red);}

/* ---------- سبد خرید ---------- */
.page-h1{font-size:20px;margin:6px 0 16px;}
.page-h2{font-size:17px;margin:24px 0 12px;}
.cart-content{display:grid;grid-template-columns:1fr 320px;gap:16px;align-items:start;}
.cart-items{display:flex;flex-direction:column;gap:10px;}
.cart-item{background:var(--card);box-shadow:var(--shadow);border-radius:var(--radius);padding:10px;
  display:flex;align-items:center;gap:12px;animation:pop .25s ease;}
.ci-img{width:64px;height:64px;flex-shrink:0;background:var(--bg);border-radius:8px;display:flex;align-items:center;justify-content:center;overflow:hidden;}
.ci-img img{width:56px;height:56px;object-fit:contain;}
.ci-info{flex:1;min-width:0;}
.ci-name{font-weight:700;font-size:14px;display:block;margin-bottom:4px;}
.ci-price{font-size:13px;}
.ci-price .old{color:var(--text-gray);text-decoration:line-through;font-size:11px;margin-right:6px;}
.ci-qty{display:flex;align-items:center;gap:8px;background:var(--bg);border-radius:8px;padding:4px 8px;}
.qbtn{width:26px;height:26px;border:none;border-radius:6px;background:var(--card);color:var(--text);font-size:18px;font-weight:700;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow);transition:transform .1s;}
.qbtn:active{transform:scale(.9);}
.ci-remove{background:none;border:none;font-size:18px;padding:6px;color:var(--red);}
.cart-summary,.checkout-summary{background:var(--card);box-shadow:var(--shadow);border-radius:var(--radius);padding:16px;position:sticky;top:80px;}
.sum-row{display:flex;justify-content:space-between;align-items:center;margin:8px 0;font-size:14px;}
.sum-row.discount b{color:var(--green);}
.sum-row.total{font-size:16px;font-weight:700;}
.sum-row.total b{color:var(--accent);}
.cart-summary hr,.checkout-summary hr{border:none;border-top:1px solid var(--line);margin:12px 0;}
.btn-checkout,.btn-pay{width:100%;margin-top:10px;padding:13px;}
.cart-note{font-size:11.5px;color:var(--text-gray);margin:12px 0 0;line-height:1.8;}

/* ---------- تسویه / فرم‌ها ---------- */
.checkout-grid{display:grid;grid-template-columns:1fr 320px;gap:16px;align-items:start;}
.checkout-form,.account-form{background:var(--card);box-shadow:var(--shadow);border-radius:var(--radius);padding:18px;display:flex;flex-direction:column;gap:14px;}
.checkout-form label,.account-form label{display:flex;flex-direction:column;gap:6px;font-size:13px;font-weight:700;}
.checkout-form input,.checkout-form textarea,.account-form input,.account-form textarea{
  border:1px solid var(--bg-gray);background:var(--bg);border-radius:8px;padding:11px;font-family:inherit;color:var(--text);font-size:14px;font-weight:500;resize:vertical;}
.checkout-form input:focus,.checkout-form textarea:focus,.account-form input:focus,.account-form textarea:focus,.comment-form input:focus,.comment-form textarea:focus{outline:2px solid var(--accent);border-color:transparent;}
.offcode-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap;}
.offcode-row input{flex:1;border:1px solid var(--bg-gray);background:var(--bg);border-radius:8px;padding:11px;font-family:inherit;color:var(--text);}
.off-msg{font-size:12px;font-weight:700;}
.checkout-summary h2{font-size:15px;margin-bottom:10px;}
.notice{background:var(--card);box-shadow:var(--shadow);border-radius:var(--radius);padding:20px;text-align:center;display:flex;flex-direction:column;gap:14px;align-items:center;}

/* ---------- ورود ---------- */
.auth-page{display:flex;justify-content:center;padding:30px 0;}
.auth-card{background:var(--card);box-shadow:var(--shadow);border-radius:16px;padding:28px;max-width:400px;width:100%;text-align:center;}
.auth-illus{font-size:64px;margin-bottom:10px;}
.auth-card h1{font-size:19px;margin-bottom:20px;}
.auth-step{display:flex;flex-direction:column;gap:12px;}
.auth-step label{text-align:right;font-size:13px;font-weight:700;display:flex;flex-direction:column;gap:6px;}
.auth-step input{border:1px solid var(--bg-gray);background:var(--bg);border-radius:8px;padding:12px;font-family:inherit;color:var(--text);text-align:center;font-size:18px;letter-spacing:2px;}
.auth-timer{font-size:13px;color:var(--text-gray);}
.auth-privacy{font-size:12px;color:var(--text-gray);margin-top:18px;line-height:1.9;}
.auth-privacy a{color:var(--red);font-weight:700;}

/* ---------- حساب / سفارش ---------- */
.account-card{background:var(--card);box-shadow:var(--shadow);border-radius:var(--radius);padding:20px;text-align:center;}
.account-avatar{font-size:56px;margin-bottom:10px;}
.account-form{box-shadow:none;padding:0;max-width:440px;margin:0 auto;}
.account-actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;}
.orders{display:flex;flex-direction:column;gap:8px;}
.order-row{background:var(--card);box-shadow:var(--shadow);border-radius:10px;padding:14px;display:flex;gap:12px;flex-wrap:wrap;align-items:center;justify-content:space-between;transition:transform .15s;}
.order-row:hover{transform:translateX(-4px);}
.order-id{font-weight:700;}
.order-amount{color:var(--accent);font-weight:700;}
.order-date{color:var(--text-gray);font-size:12px;}
.order-page{max-width:520px;margin:0 auto;text-align:center;display:flex;flex-direction:column;gap:16px;}
.order-status{padding:16px;border-radius:var(--radius);font-size:20px;font-weight:700;color:#fff;}
.order-status.ok{background:var(--green);}
.order-status.fail{background:var(--red);}
.order-box{background:var(--card);box-shadow:var(--shadow);border-radius:var(--radius);padding:18px;text-align:right;}
.order-line{display:flex;justify-content:space-between;gap:10px;padding:8px 0;border-bottom:1px solid var(--line);font-size:14px;}
.order-seller-msg{margin-top:10px;}

/* ---------- اطلاعات / تماس ---------- */
.info-page,.search-page,.cart-page,.checkout-page,.account-page{min-height:40vh;}
.info-body{background:var(--card);box-shadow:var(--shadow);border-radius:var(--radius);padding:20px;line-height:2.2;}
.contact-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;}
.contact-item{background:var(--card);box-shadow:var(--shadow);border-radius:var(--radius);padding:18px;text-align:center;display:flex;flex-direction:column;gap:8px;transition:transform .15s;}
.contact-item:hover{transform:translateY(-3px);box-shadow:var(--shadow-hover);}
.ci-emoji{font-size:30px;}
.contact-address{margin-top:14px;background:var(--card);box-shadow:var(--shadow);border-radius:var(--radius);padding:14px;}
.search.big{margin-bottom:16px;}
.search-count{margin-bottom:12px;font-weight:700;}

/* ---------- خالی / خطا ---------- */
.empty{text-align:center;padding:40px 20px;display:flex;flex-direction:column;align-items:center;gap:12px;}
.empty.small{padding:20px;}
.empty-ic{font-size:52px;}
.empty .btn{margin-top:8px;}
.status-page{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--bg);}
.status-box{text-align:center;background:#fff;border-radius:16px;padding:40px;box-shadow:0 4px 20px rgba(0,0,0,.08);max-width:420px;}
.status-emoji{font-size:60px;margin-bottom:10px;}

/* ---------- فوتر ---------- */
.site-footer{margin-top:40px;}
.site-footer .container{background:var(--card);box-shadow:var(--shadow);border-radius:var(--radius);padding:24px;}
.footer-brand{display:flex;align-items:center;gap:10px;}
.footer-name{font-size:19px;font-weight:700;}
.footer-info{font-size:13.5px;line-height:2;margin:16px 0 0;}
.footer-div{border:none;border-top:1px solid var(--line);margin:18px 0;}
.footer-cols{display:flex;justify-content:space-between;flex-wrap:wrap;gap:20px;}
.footer-links{display:flex;flex-direction:column;gap:4px;}
.footer-links a{font-weight:700;padding:4px 0;}
.footer-links a:hover{color:var(--accent);}
.footer-badges{display:flex;gap:10px;align-items:center;flex-wrap:wrap;}
.badge{width:64px;height:64px;background:var(--bg);border-radius:8px;display:flex;align-items:center;justify-content:center;text-align:center;font-size:11px;font-weight:700;line-height:1.5;padding:6px;color:var(--text);}
.badge.enemad{color:#c00;}
.trust{display:flex;justify-content:center;gap:26px;flex-wrap:wrap;}
.trust-item{display:flex;flex-direction:column;align-items:center;gap:6px;font-size:12px;text-align:center;}
.t-ic{width:44px;height:44px;border-radius:50%;background:var(--bg);display:flex;align-items:center;justify-content:center;font-size:22px;color:var(--green);}
.copyright{text-align:center;font-size:12px;color:var(--text-gray);padding:14px 8px 4px;}
.version{text-align:center;font-size:11px;color:var(--text-gray);padding:4px 8px 16px;}
.version a{color:var(--text-gray);}
.version a:hover{color:var(--accent);}

/* ---------- ریسپانسیو ---------- */
@media(max-width:820px){
  .cart-content,.checkout-grid{grid-template-columns:1fr;}
  .cart-summary,.checkout-summary{position:static;}
}
@media(max-width:700px){
  .product-top{flex-direction:column;align-items:center;}
  .product-gallery{width:100%;max-width:300px;}
  .product-info{width:100%;}
  .product-name{text-align:center;font-size:18px;}
}
@media(prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important;scroll-behavior:auto!important;}
  [data-reveal]{opacity:1;transform:none;}
}

/* ---------- Toast ---------- */
.toast{position:fixed;bottom:20px;right:50%;transform:translateX(50%) translateY(120%);
  background:var(--red);color:#fff;padding:12px 18px;border-radius:10px;font-weight:700;font-size:14px;
  box-shadow:0 6px 24px rgba(0,0,0,.25);z-index:200;display:flex;align-items:center;gap:8px;max-width:90vw;
  transition:transform .3s ease;}
.toast.show{transform:translateX(50%) translateY(0);}
.toast.ok{background:var(--green);}

/* =========================================================
   اصلاحات و بهبودها (نسخهٔ ۲)
   ========================================================= */

/* [۸] رفع باگ: hidden باید همیشه مخفی کند حتی روی المان‌های grid/flex */
[hidden]{display:none!important;}

/* [۷] دکمهٔ تم: فقط یک آیکن هم‌زمان دیده شود */
.theme-toggle .moon{display:none;}
html[data-theme="dark"] .theme-toggle .sun{display:none;}
html[data-theme="dark"] .theme-toggle .moon{display:inline-block;}

/* [۱] هدر هم‌عرض محتوا و کمی بلندتر */
.site-header{width:100%;max-width:var(--maxw);margin-inline:auto;box-sizing:border-box;padding:10px 16px;gap:12px;}
.logo,.logo img,.logo-fallback{width:var(--logo);height:var(--logo);}

/* آواتار کوچک مدرن در هدر [۱۹] */
.account-btn{display:inline-flex;align-items:center;gap:8px;background:transparent;border:none;padding:6px 10px;border-radius:10px;color:var(--text);transition:background .2s;cursor:pointer;}
.account-btn:hover{background:var(--bg-gray);}
.account-avatar-sm{width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,var(--accent),#ffcf6b);display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:0 2px 6px rgba(250,171,26,.35);}
.account-avatar-sm svg{width:20px;height:20px;fill:#3a2e00;}
.account-btn span{font-size:13px;font-weight:700;max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
@media(max-width:560px){.account-btn span{display:none;}.account-btn{padding:4px;}}

/* [۴] عرض یکسان همهٔ صفحات */
main.container{width:100%;max-width:var(--maxw);margin-inline:auto;box-sizing:border-box;}
.product,.cart-page,.checkout-page,.account-page,.info-page,.search-page,.order-page,.list-page,.auth-page{width:100%;}
.product-top{width:100%;box-sizing:border-box;}
.product-gallery{width:340px;max-width:42%;}
@media(max-width:700px){.product-gallery{max-width:100%;width:min(320px,80%);}}

/* [۱۲] انیمیشن نرم ورود به صفحه */
@keyframes pageIn{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:none;}}
main.container{animation:pageIn .32s ease;}
body.is-leaving main.container{opacity:0;transition:opacity .18s ease;}
@media(prefers-reduced-motion:reduce){main.container{animation:none;}body.is-leaving main.container{transition:none;}}

/* [۲][۱۰] دکمه‌های اسکرول افقی برای دسکتاپ */
.prow-outer{position:relative;}
.scroll-btn{position:absolute;top:50%;transform:translateY(-50%);z-index:5;width:40px;height:40px;border-radius:50%;
  border:none;background:var(--card);box-shadow:var(--shadow-hover);color:var(--text);
  display:none;align-items:center;justify-content:center;cursor:pointer;transition:background .2s,transform .15s;}
.scroll-btn:hover{background:var(--accent);color:#3a2e00;}
.scroll-btn:active{transform:translateY(-50%) scale(.92);}
.scroll-btn .ic{width:22px;height:22px;fill:currentColor;}
.scroll-prev{right:-6px;}   /* RTL: prev سمت راست */
.scroll-next{left:-6px;}
.prow-outer:hover .scroll-btn:not([hidden]){display:flex;}
@media(pointer:fine){.groupbar-wrap .scroll-btn:not([hidden]){display:flex;}}
@media(max-width:820px){.scroll-btn{display:none!important;}}

/* [۲] اسکرول افقی نرم و بدون گیر */
.prow-scroll,.groupbar{scroll-behavior:smooth;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;scroll-snap-type:none;}
.prow-scroll .card{scroll-snap-align:none;}
.prow-scroll{padding-bottom:14px;}

/* [۱۰] نوار دسته‌بندی جدید */
.groupbar-wrap{position:relative;display:flex;align-items:center;gap:8px;background:var(--card);box-shadow:var(--shadow);border-radius:var(--radius);padding:8px 12px;margin-bottom:12px;max-width:var(--maxw);margin-inline:auto;box-sizing:border-box;}
.groupbar-toggle{flex-shrink:0;display:inline-flex;align-items:center;gap:6px;background:var(--bg);border:none;border-radius:8px;padding:8px 12px;font-family:inherit;font-weight:700;color:var(--text);cursor:pointer;transition:background .2s;}
.groupbar-toggle:hover{background:var(--bg-gray);}
.groupbar-toggle .ic{width:20px;height:20px;fill:var(--accent);}
.groupbar{flex:1;min-width:0;display:flex;align-items:center;gap:4px;overflow-x:auto;box-shadow:none;background:transparent;border-radius:0;padding:0;margin:0;scrollbar-width:none;}
.groupbar::-webkit-scrollbar{height:0;}
.groupbar-wrap .scroll-btn{position:static;transform:none;width:34px;height:34px;box-shadow:var(--shadow);}
.groupbar-wrap .scroll-btn:active{transform:scale(.92);}

/* [۱۰] پاپ‌آپ دستهٔ کامل */
.cat-popup{position:fixed;inset:0;z-index:120;display:flex;align-items:flex-start;justify-content:center;}
.cat-popup-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.5);animation:fadeIn .2s ease;}
.cat-popup-panel{position:relative;background:var(--card);width:min(560px,94vw);max-height:82vh;margin-top:8vh;border-radius:16px;overflow:hidden;box-shadow:0 20px 60px rgba(0,0,0,.35);display:flex;flex-direction:column;animation:popupIn .28s cubic-bezier(.2,.9,.3,1.2);}
@keyframes fadeIn{from{opacity:0;}to{opacity:1;}}
@keyframes popupIn{from{opacity:0;transform:translateY(24px) scale(.96);}to{opacity:1;transform:none;}}
.cat-popup-head{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;border-bottom:1px solid var(--line);}
.cat-popup-head h2{font-size:17px;}
.cat-popup-body{overflow-y:auto;padding:12px 18px 20px;}
.cat-main{display:block;font-weight:700;font-size:15px;padding:12px 8px 6px;color:var(--text);border-radius:8px;}
.cat-main:hover{color:var(--accent);}
.cat-subs{display:flex;flex-wrap:wrap;gap:6px;padding:0 8px 10px;border-bottom:1px dashed var(--line);margin-bottom:4px;}
.cat-sub{font-weight:500;font-size:13px;color:var(--text-gray);background:var(--bg);padding:6px 12px;border-radius:20px;transition:background .15s,color .15s;}
.cat-sub:hover{background:var(--accent);color:#3a2e00;}

/* [۵] استپر تعداد در صفحهٔ کالا */
.qty-stepper{display:flex;align-items:center;justify-content:space-between;gap:10px;background:var(--bg);border-radius:10px;padding:8px 12px;}
.qty-stepper .qbtn{width:38px;height:38px;border:none;border-radius:8px;background:var(--card);color:var(--text);font-size:22px;font-weight:700;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow);cursor:pointer;transition:transform .1s,background .2s;}
.qty-stepper .qbtn:hover{background:var(--accent);color:#3a2e00;}
.qty-stepper .qbtn:active{transform:scale(.9);}
.qty-count{font-weight:700;font-size:18px;min-width:40px;text-align:center;}
.qbtn-minus.is-trash{background:#fde8e8;color:var(--red);}
.qbtn-minus .qbtn-trash-ic{display:none;fill:var(--red);}
.qbtn-minus.is-trash .qbtn-minus-ic{display:none;}
.qbtn-minus.is-trash .qbtn-trash-ic{display:block;width:18px;height:18px;}

/* [۶] متن دیدگاه: غیرقابل تغییر اندازه، فقط ارتفاع بیشتر */
.comment-form textarea{resize:none;min-height:112px;}   /* ~۴۰٪ بلندتر */

/* [۱۷] حساب کاربری: آدرس محدود، موبایل به‌صورت نشان */
.account-form textarea{resize:none;min-height:90px;max-height:160px;}
.account-mobile-badge{display:inline-flex;align-items:center;gap:8px;background:var(--bg);border:1.5px solid var(--accent);border-radius:30px;padding:8px 16px;font-weight:700;font-size:15px;letter-spacing:1px;margin:0 auto 16px;direction:ltr;}
.account-mobile-badge .ic{fill:var(--accent);}

/* [۱۸] دکمهٔ خروج قرمز با آیکن */
.btn-danger{background:#fde8e8;color:var(--red);display:inline-flex;align-items:center;gap:6px;}
.btn-danger:hover{background:var(--red);color:#fff;}
.btn-danger .ic{fill:currentColor;}
.btn-block{width:100%;}

/* [۱۵][۱۶] ورود: نمایش موبایل و تایمر */
.auth-illus{width:76px;height:76px;margin:0 auto 12px;border-radius:50%;background:linear-gradient(135deg,var(--accent),#ffcf6b);display:flex;align-items:center;justify-content:center;box-shadow:0 6px 18px rgba(250,171,26,.35);}
.auth-illus svg{width:40px;height:40px;fill:#3a2e00;}
.auth-mobile-shown{display:flex;align-items:center;justify-content:center;gap:10px;background:var(--bg);border-radius:10px;padding:8px 14px;margin-bottom:6px;}
.auth-mobile-num{font-weight:700;letter-spacing:1px;direction:ltr;}
.auth-timer{display:flex;align-items:center;justify-content:center;gap:8px;font-size:13px;color:var(--text-gray);margin-top:6px;}
.auth-timer-label{color:var(--text-gray);}
.auth-timer-val{direction:ltr;font-weight:700;color:var(--text);background:var(--bg);border-radius:6px;padding:2px 8px;min-width:56px;text-align:center;}

/* [۲۰] تماس با ما: چیدمان واکنش‌گرا */
.contact-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px;}
@media(max-width:520px){.contact-grid{grid-template-columns:repeat(2,1fr);}}
.contact-item{min-width:0;}
.contact-item span:last-child{font-size:13px;overflow:hidden;text-overflow:ellipsis;}

/* [۹] در سبد، ردیف سود همیشه دیده شود */
.cart-summary .sum-row.always{display:flex;}

/* [۲۱] صفحات درباره ما / قوانین: عناصر تصویری */
.info-hero{position:relative;background:linear-gradient(135deg,var(--primary),#4a636f);color:#fff;border-radius:16px;padding:34px 26px;margin-bottom:18px;overflow:hidden;box-shadow:var(--shadow);}
.info-hero::after{content:"";position:absolute;left:-40px;top:-40px;width:180px;height:180px;background:rgba(250,171,26,.25);border-radius:50%;}
.info-hero::before{content:"";position:absolute;right:-30px;bottom:-50px;width:150px;height:150px;background:rgba(255,255,255,.08);border-radius:50%;}
.info-hero .info-hero-ic{width:64px;height:64px;border-radius:18px;background:rgba(255,255,255,.15);display:flex;align-items:center;justify-content:center;margin-bottom:14px;position:relative;z-index:1;}
.info-hero .info-hero-ic svg{width:36px;height:36px;fill:#fff;}
.info-hero h1{font-size:24px;position:relative;z-index:1;margin-bottom:6px;}
.info-hero p{position:relative;z-index:1;font-size:14px;opacity:.92;}
.info-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px;margin-bottom:18px;}
.info-card{background:var(--card);border-radius:14px;box-shadow:var(--shadow);padding:18px;display:flex;flex-direction:column;gap:8px;transition:transform .15s;}
.info-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-hover);}
.info-card .ic-badge{width:44px;height:44px;border-radius:12px;background:var(--bg);display:flex;align-items:center;justify-content:center;font-size:22px;}
.info-card b{font-size:14px;}
.info-card span{font-size:12.5px;color:var(--text-gray);line-height:1.9;}
.info-body{background:var(--card);box-shadow:var(--shadow);border-radius:16px;padding:24px;line-height:2.2;position:relative;}
.info-body::before{content:"";position:absolute;right:0;top:24px;bottom:24px;width:4px;background:var(--accent);border-radius:4px;}

/* آواتار صفحهٔ حساب (SVG) */
.account-avatar{width:76px;height:76px;margin:0 auto 12px;border-radius:50%;background:linear-gradient(135deg,var(--accent),#ffcf6b);display:flex;align-items:center;justify-content:center;box-shadow:0 6px 18px rgba(250,171,26,.35);}
.account-avatar svg{width:40px;height:40px;fill:#3a2e00;}
.account-card{display:flex;flex-direction:column;align-items:center;}
.account-actions .btn{min-width:150px;justify-content:center;}

/* اسکلت بارگذاری سفارش‌ها (صفحهٔ حساب async) */
.orders-skeleton{display:flex;flex-direction:column;gap:10px;}
.orders-skeleton .sk-row{height:52px;border-radius:12px;background:linear-gradient(90deg,var(--bg) 25%,var(--bg-gray) 37%,var(--bg) 63%);background-size:400% 100%;animation:skload 1.3s ease infinite;}
@keyframes skload{0%{background-position:100% 0;}100%{background-position:-100% 0;}}
@media(prefers-reduced-motion:reduce){.orders-skeleton .sk-row{animation:none;}}

/* =========================================================
   نسخهٔ ۳ — لودینگ، درگ‌اسلایدر، پلیس‌هولدر، جستجوی زنده، لایت‌باکس و ...
   ========================================================= */

/* [۹] اسکیپ‌لینک: کاملاً پنهان تا وقتی فوکوس شود (رفع مشکل فایرفاکس موبایل) */
.skip-link{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;}
.skip-link:focus{position:fixed;top:8px;right:8px;left:auto;width:auto;height:auto;clip:auto;margin:0;padding:10px 16px;background:var(--primary);color:#fff;border-radius:10px;z-index:200;}

/* [۲] لودینگ اولیه با پروگرس‌بار مدرن */
.app-loader{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center;background:var(--bg);transition:opacity .4s ease,visibility .4s;}
.app-loader.hide{opacity:0;visibility:hidden;pointer-events:none;}
.app-loader-inner{display:flex;flex-direction:column;align-items:center;gap:18px;}
.app-loader-logo{width:88px;height:88px;object-fit:contain;border-radius:20px;animation:loaderPulse 1.4s ease-in-out infinite;}
@keyframes loaderPulse{0%,100%{transform:scale(1);opacity:.85;}50%{transform:scale(1.08);opacity:1;}}
.app-loader-bar{width:180px;height:6px;border-radius:6px;background:var(--bg-gray);overflow:hidden;position:relative;}
.app-loader-bar span{position:absolute;inset:0;width:40%;border-radius:6px;background:linear-gradient(90deg,var(--accent),#ffcf6b);animation:loaderBar 1.1s cubic-bezier(.4,0,.2,1) infinite;}
@keyframes loaderBar{0%{transform:translateX(150%);}100%{transform:translateX(-260%);}}
.app-loader-text{font-size:13px;color:var(--text-gray);}
/* failsafe: اگر JS اجرا نشد، لودینگ حداکثر بعد از ۸ ثانیه خودش محو شود */
.app-loader{animation:loaderFailsafe 0s linear 8s forwards;}
@keyframes loaderFailsafe{to{opacity:0;visibility:hidden;pointer-events:none;}}
@media(prefers-reduced-motion:reduce){.app-loader-logo,.app-loader-bar span{animation:none;}}

/* [۴] پلیس‌هولدر خاکستری برای کالای بدون عکس */
.card-img,.product-gallery{background:var(--bg-gray) url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23c2c8cf"><path d="M21 19V5a2 2 0 00-2-2H5a2 2 0 00-2 2v14a2 2 0 002 2h14a2 2 0 002-2zM8.5 13.5l2.5 3.01L14.5 12l4.5 6H5l3.5-4.5z"/></svg>') center/40% no-repeat;}
.card-img img,.product-gallery img{position:relative;z-index:1;}
img.noimg{opacity:0;}   /* عکس خراب شفاف شود تا پلیس‌هولدر دیده شود */
.cart-item-img,[data-ci-img]{background:var(--bg-gray);}

/* [۵] فیلد جستجوی واکنش‌گرا (دکمه‌ها پنهان نشوند) */
.search-wrap{position:relative;flex:1;min-width:0;}
.site-header .search{width:100%;min-width:0;}
.site-header .search input{min-width:0;}
.header-actions{flex-shrink:0;}
@media(max-width:560px){
  .site-header{gap:8px;padding:8px 10px;}
  .logo,.logo img,.logo-fallback{width:42px;height:42px;}
}

/* [۱۱] dropdown پیشنهاد کالا */
.search-suggest{position:absolute;top:calc(100% + 6px);right:0;left:0;background:var(--card);border-radius:12px;box-shadow:0 12px 32px rgba(0,0,0,.18);overflow:hidden;z-index:60;max-height:60vh;overflow-y:auto;border:1px solid var(--line);}
.suggest-item{display:flex;align-items:center;gap:10px;padding:9px 12px;color:var(--text);border-bottom:1px solid var(--line);transition:background .15s;}
.suggest-item:last-child{border-bottom:none;}
.suggest-item:hover,.suggest-item.active{background:var(--bg);}
.suggest-item img{width:42px;height:42px;border-radius:8px;object-fit:cover;background:var(--bg-gray) url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23c2c8cf"><path d="M21 19V5a2 2 0 00-2-2H5a2 2 0 00-2 2v14a2 2 0 002 2h14a2 2 0 002-2zM8.5 13.5l2.5 3.01L14.5 12l4.5 6H5l3.5-4.5z"/></svg>') center/60% no-repeat;flex-shrink:0;}
.suggest-item span{font-size:13px;line-height:1.6;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;}
.suggest-empty{padding:14px;text-align:center;color:var(--text-gray);font-size:13px;}

/* [۱۰] استپر باریک‌تر، سطل خطی، برچسب حداکثر */
.qty-stepper{max-width:210px;margin-inline:auto;gap:6px;padding:6px 8px;position:relative;}
.qty-stepper .qbtn{width:34px;height:34px;font-size:20px;}
.qty-count{font-size:16px;min-width:34px;}
.qbtn-minus.is-trash{background:transparent;color:var(--red);border:1.5px solid var(--red);}  /* خطی، نه توپر */
.qbtn-minus.is-trash .qbtn-trash-ic{fill:none;stroke:var(--red);stroke-width:2;}
.qty-max-label{display:none;position:absolute;top:100%;left:50%;transform:translateX(-50%);font-size:10px;color:var(--red);font-weight:700;white-space:nowrap;margin-top:3px;}
.qty-stepper.at-max .qty-max-label{display:block;}
.qty-stepper.at-max .qbtn-plus{opacity:.4;pointer-events:none;}

/* [۸] لایت‌باکس تمام‌صفحه با زوم */
[data-zoomable]{cursor:zoom-in;}
.product-gallery{position:relative;}
.zoom-hint{position:absolute;bottom:10px;left:10px;width:34px;height:34px;border-radius:50%;background:rgba(0,0,0,.5);display:flex;align-items:center;justify-content:center;z-index:2;pointer-events:none;}
.zoom-hint svg{width:20px;height:20px;fill:#fff;}
.lightbox{position:fixed;inset:0;z-index:9998;background:rgba(0,0,0,.92);display:flex;align-items:center;justify-content:center;touch-action:none;animation:fadeIn .2s ease;}
.lightbox img{max-width:96vw;max-height:92vh;transform-origin:center center;transition:transform .12s ease-out;will-change:transform;user-select:none;-webkit-user-drag:none;}
.lightbox-close{position:fixed;top:14px;right:14px;width:44px;height:44px;border-radius:50%;border:none;background:rgba(255,255,255,.15);color:#fff;font-size:24px;cursor:pointer;z-index:9999;display:flex;align-items:center;justify-content:center;}

/* =========================================================
   نسخهٔ ۴
   ========================================================= */

/* [۷] footer همیشه ته صفحه */
.page{display:flex;flex-direction:column;min-height:100vh;}
main.container{flex:1 0 auto;}
.site-footer{flex-shrink:0;}

/* [۶] placeholder فقط وقتی عکس نیست (عکس‌دار = پس‌زمینهٔ سفید) */
.card-img,.product-gallery{background:var(--card);}
.card-img.img-missing,.product-gallery.img-missing,.ci-img.img-missing{
  background:var(--bg-gray) url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23b4bcc4"><path d="M21 19V5a2 2 0 00-2-2H5a2 2 0 00-2 2v14a2 2 0 002 2h14a2 2 0 002-2zM8.5 13.5l2.5 3.01L14.5 12l4.5 6H5l3.5-4.5z"/></svg>') center/40% no-repeat;
}
img.noimg{opacity:0;}

/* [۱] کارت‌های هم‌اندازه: نام حداکثر ۲ خط با ارتفاع ثابت */
.card{display:flex;flex-direction:column;}
.card-name{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.7em;line-height:1.35;}

/* [۱] دکمهٔ افزودن به سبد روی کارت */
.card-add{display:inline-flex;align-items:center;justify-content:center;gap:5px;width:calc(100% - 4px);margin:8px 2px 2px;padding:7px 8px;border:none;border-radius:9px;
  background:var(--accent);color:#3a2e00;font-family:inherit;font-weight:700;font-size:12.5px;cursor:pointer;transition:filter .15s,transform .1s;}
.card-add:hover{filter:brightness(.95);}
.card-add:active{transform:scale(.96);}
.card-add .ic{width:17px;height:17px;fill:currentColor;}
.card-add.added{background:var(--green);color:#fff;}
.card-add-select{background:var(--bg);color:var(--primary);}

/* [۱] نمای لیستی: ردیف‌های تمام‌عرض و هم‌اندازه */
.grid.as-list{grid-template-columns:1fr;gap:10px;justify-items:stretch;}
.grid.as-list .grid-item{width:100%;}
.grid.as-list .card{flex-direction:row;width:100%;align-items:center;text-align:right;gap:12px;padding:8px;}
.grid.as-list .card-img{width:92px;height:92px;min-width:92px;padding:6px;border-radius:10px;}
.grid.as-list .card-img img{width:78px;height:78px;}
.grid.as-list .card-name{flex:1;-webkit-line-clamp:2;min-height:auto;text-align:right;margin:0;}
.grid.as-list .card-bottom{margin:0;padding:0;display:flex;flex-direction:column;align-items:flex-start;gap:6px;min-width:140px;flex-shrink:0;}
.grid.as-list .card-add{width:auto;min-width:120px;margin:0;}
.grid.as-list .card-score{margin:0;}
@media(max-width:560px){
  .grid.as-list .card-bottom{min-width:110px;}
  .grid.as-list .card-add{min-width:96px;font-size:11.5px;}
}

/* [۲] دکمهٔ بازگشت به بالا */
.scroll-top{position:fixed;bottom:20px;left:20px;z-index:70;width:46px;height:46px;border-radius:50%;border:none;
  background:var(--primary);color:#fff;box-shadow:0 6px 20px rgba(0,0,0,.25);cursor:pointer;display:flex;align-items:center;justify-content:center;
  opacity:0;transform:translateY(12px);transition:opacity .25s,transform .25s;}
.scroll-top.show{opacity:1;transform:none;}
.scroll-top .ic{width:26px;height:26px;fill:#fff;}
.scroll-top:hover{background:var(--primary-dark);}

/* [۵] جستجوی واکنش‌گرا (آیکن در موبایل، فیلد باز‌شونده) */
.search-toggle,.search-close{display:none;}
@media(min-width:561px){
  .site-header .search-wrap{display:block;}
}
@media(max-width:560px){
  .site-header .search-wrap{display:none;}
  .search-toggle{display:flex;}
  .site-header.search-open{position:relative;}
  .site-header.search-open .search-wrap{display:flex;align-items:center;gap:6px;position:absolute;inset:0;background:var(--card);z-index:40;padding:8px 10px;box-sizing:border-box;animation:searchExpand .25s ease;}
  .site-header.search-open .search{flex:1;}
  .site-header.search-open .logo{display:none;}
  .site-header.search-open .header-actions>*:not(.search-close-holder){display:none;}
  .site-header.search-open .search-close{display:flex;}
}
@keyframes searchExpand{from{opacity:0;transform:translateY(-8px);}to{opacity:1;transform:none;}}

/* [۹] انیمیشن نرم تغییر تم — فقط روی پس‌زمینهٔ کلی تا صفحات پرآیتم لگ نزنند */
:root{--theme-anim:background-color .5s ease,color .5s ease;}
body{transition:var(--theme-anim);}
@media(prefers-reduced-motion:reduce){body{transition:none;}}
/* View Transition دایره‌ای برای تعویض تم (مرورگرهای پشتیبان) */
::view-transition-old(root),::view-transition-new(root){animation:none;mix-blend-mode:normal;}
html::view-transition-group(root){animation-duration:.62s;}

/* [۱۳] فاصله بین دکمه‌های تماس و آدرس */
.contact-grid{margin-bottom:18px;}
.info-page .contact-grid+.info-body{margin-top:6px;}

/* [۸] حالت خالی سبد وسط‌چین */
.cart-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:14px;padding:48px 16px;min-height:40vh;}
.cart-empty .empty-ic{width:88px;height:88px;border-radius:50%;background:var(--bg);display:flex;align-items:center;justify-content:center;}
.cart-empty .empty-ic svg{width:46px;height:46px;fill:var(--text-gray);}
.cart-empty p{font-size:15px;color:var(--text-gray);margin:0;}
.cart-empty .btn{min-width:180px;}

/* [۸] آیکن سطل سبد */
.ci-remove{background:transparent;border:none;cursor:pointer;padding:6px;color:var(--red);display:flex;align-items:center;justify-content:center;}
.ci-remove svg{width:22px;height:22px;fill:currentColor;}
.ci-remove:hover{opacity:.8;}

/* =========================================================
   نسخهٔ ۵ — رفع و بهبود موارد گزارش‌شده
   ========================================================= */

/* هدر: ارتفاع ثابت تا با باز شدن جستجو جمع نشود */
.site-header{min-height:64px;align-items:center;box-sizing:border-box;}

/* [۲] در موبایل آیکن‌ها به سمت چپ appbar */
@media(max-width:560px){
  .header-actions{margin-inline-start:auto;}
}

/* [۳] رفع باز شدن جستجو در موبایل (وسط‌چین عمودی، تمام‌ارتفاع هدر) */
@media(max-width:560px){
  .site-header.search-open .search-wrap{display:flex;align-items:center;gap:8px;position:absolute;inset:0;background:var(--card);z-index:40;padding:0 10px;box-sizing:border-box;animation:searchExpand .25s ease;}
  .site-header.search-open .search{flex:1;margin:0;}
  .site-header.search-open .search-close{width:38px;height:38px;flex-shrink:0;}
}

/* [۱] دکمهٔ آیکنی افزودن به سبد + استپر کوچک روی کارت */
.card-cart{margin-top:8px;display:flex;justify-content:center;}
.card-cart-btn{width:40px;height:40px;border:none;border-radius:12px;background:var(--accent);color:#3a2e00;
  display:flex;align-items:center;justify-content:center;cursor:pointer;transition:filter .15s,transform .1s;}
.card-cart-btn:hover{filter:brightness(.95);}
.card-cart-btn:active{transform:scale(.9);}
.card-cart-btn .ic{width:22px;height:22px;fill:currentColor;}
.card-select{background:var(--bg);color:var(--primary);}
.card-stepper{display:inline-flex;align-items:center;gap:4px;background:var(--bg);border-radius:12px;padding:3px;}
.card-stepper .cs-btn{width:32px;height:32px;border:none;border-radius:9px;background:var(--card);color:var(--text);
  font-size:18px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow);transition:transform .1s,background .15s;}
.card-stepper .cs-btn:hover{background:var(--accent);color:#3a2e00;}
.card-stepper .cs-btn:active{transform:scale(.88);}
.card-stepper .cs-count{min-width:30px;text-align:center;font-weight:700;font-size:15px;overflow:hidden;}
.grid.as-list .card-cart{margin-top:0;}

/* [۶] انیمیشن نرم تغییر عدد (بالا/پایین) — روی همهٔ استپرها */
@keyframes cntUp{from{transform:translateY(-75%);opacity:0;}to{transform:translateY(0);opacity:1;}}
@keyframes cntDown{from{transform:translateY(75%);opacity:0;}to{transform:translateY(0);opacity:1;}}
.cs-count,.qty-count,[data-ci-count],[data-qty-count]{display:inline-block;}
.cnt-up{animation:cntUp .22s ease;}
.cnt-down{animation:cntDown .22s ease;}
@media(prefers-reduced-motion:reduce){.cnt-up,.cnt-down{animation:none;}}

/* [۵] دیالوگ تأیید مدرن */
.adin-dialog{position:fixed;inset:0;z-index:10000;display:flex;align-items:center;justify-content:center;}
.adin-dialog-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.5);opacity:0;transition:opacity .25s;}
.adin-dialog.show .adin-dialog-backdrop{opacity:1;}
.adin-dialog-box{position:relative;background:var(--card);width:min(360px,90vw);border-radius:18px;padding:26px 22px 20px;text-align:center;
  box-shadow:0 20px 60px rgba(0,0,0,.35);transform:translateY(20px) scale(.94);opacity:0;transition:transform .28s cubic-bezier(.2,.9,.3,1.2),opacity .2s;}
.adin-dialog.show .adin-dialog-box{transform:none;opacity:1;}
.adin-dialog-ic{width:60px;height:60px;margin:0 auto 12px;border-radius:50%;background:#fde8e8;display:flex;align-items:center;justify-content:center;}
.adin-dialog-ic svg{width:30px;height:30px;fill:var(--red);}
.adin-dialog-box h3{font-size:17px;margin-bottom:8px;}
.adin-dialog-box p{font-size:14px;color:var(--text-gray);line-height:1.9;margin-bottom:20px;}
.adin-dialog-actions{display:flex;gap:10px;}
.adin-dialog-actions .btn{flex:1;justify-content:center;}

/* [۷] آیکن‌های تضمین: مدرن و رنگی */
.trust-item{display:flex;align-items:center;gap:8px;}
.t-ic{width:40px;height:40px;border-radius:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.t-ic svg{width:24px;height:24px;}
.trust-item:nth-child(1) .t-ic{background:rgba(0,121,107,.12);}
.trust-item:nth-child(1) .t-ic svg{fill:#00796B;}
.trust-item:nth-child(2) .t-ic{background:rgba(250,171,26,.15);}
.trust-item:nth-child(2) .t-ic svg{fill:#e69500;}
.trust-item:nth-child(3) .t-ic{background:rgba(52,73,85,.12);}
.trust-item:nth-child(3) .t-ic svg{fill:var(--primary);}
html[data-theme="dark"] .trust-item:nth-child(3) .t-ic svg{fill:#8fb3c4;}

/* [۸] لوگوی جایگزین: کوچک، رِند و مدرن */
.logo-fallback{border-radius:14px;background:linear-gradient(135deg,var(--accent),#ffcf6b);box-shadow:0 2px 8px rgba(250,171,26,.35);}
.logo-fallback svg{width:58%;height:58%;fill:#3a2e00;}
.footer-logo-fallback{width:56px;height:56px;border-radius:14px;background:linear-gradient(135deg,var(--accent),#ffcf6b);display:none;align-items:center;justify-content:center;}
.footer-logo-fallback svg{width:58%;height:58%;fill:#3a2e00;}

/* [۹] آیکن‌های تماس با ما */
.contact-item .ci-ic{width:46px;height:46px;border-radius:14px;display:flex;align-items:center;justify-content:center;margin-bottom:6px;}
.contact-item .ci-ic svg{width:26px;height:26px;fill:#fff;}
.ci-phone{background:#00796B;} .ci-mobile{background:#0277BD;} .ci-insta{background:linear-gradient(45deg,#f09433,#e6683c,#dc2743,#cc2366,#bc1888);}
.ci-tel{background:#229ED9;} .ci-wa{background:#25D366;} .ci-loc{background:#E53935;}

/* =========================================================
   نسخهٔ ۶
   ========================================================= */

/* [۱] اندازهٔ فونت استاندارد */
body{font-size:14px;}

/* [۶][۷] ستاره‌های امتیاز (SVG، پرشدگی متناسب) */
.stars{position:relative;display:inline-flex;line-height:0;vertical-align:middle;}
.stars svg{width:16px;height:16px;}
.stars-bg svg{fill:#d4d4d4;}
.stars-fill{position:absolute;top:0;right:0;overflow:hidden;white-space:nowrap;display:inline-flex;}
.stars-fill svg{fill:#FAAB1A;}
html[data-theme="dark"] .stars-bg svg{fill:#4a4a4a;}

/* [۶] امتیاز و تعداد دیدگاه کنار نام کالا */
.product-rating{display:inline-flex;align-items:center;gap:7px;margin:4px 0 10px;color:var(--text);cursor:pointer;text-decoration:none;}
.product-rating:hover .pr-count{color:var(--accent);}
.product-rating .pr-score{font-weight:700;font-size:14px;}
.product-rating .pr-count{color:var(--text-gray);font-size:13px;}
.rating-summary .stars svg{width:20px;height:20px;}
.comment-head .stars svg{width:14px;height:14px;}

/* [۹] دکمهٔ آیکنی افزودن: خطی (نه پس‌زمینهٔ زرد توپر) */
.card-cart-btn{background:transparent;border:1.6px solid var(--accent);color:var(--accent);}
.card-cart-btn:hover{background:var(--accent);color:#3a2e00;filter:none;}
.card-select{border-color:var(--primary);color:var(--primary);background:transparent;}
.card-select:hover{background:var(--primary);color:#fff;}

/* [۱۰] برچسب ناموجود قرمز (کارت‌ها هم‌اندازه بمانند) */
.card-unavailable{margin-top:8px;text-align:center;color:var(--red);font-weight:700;font-size:12.5px;
  border:1.5px solid var(--red);border-radius:10px;padding:8px;background:rgba(229,57,53,.06);}
.grid.as-list .card-unavailable{margin-top:0;min-width:96px;}

/* [۱۳] تصویر کارت: گوشه‌گرد و placeholder خاکستری رِند */
.card-img{border-radius:12px;overflow:hidden;}
.grid .card-img{border-radius:12px 12px 0 0;}
.grid.as-list .card-img{border-radius:12px;}

/* [۴] صفحهٔ فهرست همهٔ کالاها */
.viewall-page{padding:8px 0;}
.viewall-links{line-height:2.4;word-break:break-all;}
.viewall-links a{font-size:13px;}
html[data-theme="dark"] .viewall-links a{color:#9fb4c4 !important;}

/* =========================================================
   نسخهٔ ۷
   ========================================================= */

/* [۲] فونت کوچک‌تر */
body{font-size:13px;}

/* [new4] حذف هایلایت آبی هنگام لمس/لانگ‌کلیک روی موبایل */
*{-webkit-tap-highlight-color:transparent;}
.card,.card *,.chip,.cs-btn,.qbtn,.card-cart-btn,.scroll-btn,.icon-btn{-webkit-tap-highlight-color:transparent;}
.card{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;}

/* [۳] شیمر تصویر — فقط روی کارت‌های در حال لود و با transform (کامپوزیت‌شده، بدون بار main-thread) */
.card-img{background:var(--bg-gray);overflow:hidden;}
.card-img.img-ok{background:var(--card);}
.card-img::before{content:"";position:absolute;top:0;bottom:0;left:-60%;width:60%;z-index:0;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.5),transparent);opacity:0;will-change:transform;}
.card-img.img-loading::before{opacity:1;animation:shimmerX 1.2s linear infinite;}
@keyframes shimmerX{from{transform:translateX(0);}to{transform:translateX(266%);}}
@media(prefers-reduced-motion:reduce){.card-img.img-loading::before{animation:none;}}

/* [۴] placeholder کالای بدون عکس: روشن‌تر، حاشیه‌دار مثل قاب عکس، آیکن کوچک‌تر */
.card-img.img-missing{background:#f2f4f6 !important;}
html[data-theme="dark"] .card-img.img-missing{background:#242424 !important;}
.card-img.img-missing::after{content:"";position:absolute;inset:10px;border-radius:12px;
  background:#e9edf1 url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23c7ced6"><path d="M21 19V5a2 2 0 00-2-2H5a2 2 0 00-2 2v14a2 2 0 002 2h14a2 2 0 002-2zM8.5 13.5l2.5 3.01L14.5 12l4.5 6H5l3.5-4.5z"/></svg>') center/36% no-repeat;z-index:1;}
html[data-theme="dark"] .card-img.img-missing::after{background-color:#2e2e2e;}

/* [new3] دکمهٔ افزودن به سبد: عریض، متن + انیمیشن hover (متن پایین، آیکن از بالا) */
.card-cart{margin-top:8px;display:block;}
.card-cart-btn{position:relative;overflow:hidden;width:100%;height:36px;border-radius:11px;border:1.6px solid var(--accent);
  background:transparent;color:var(--accent);font-family:inherit;font-weight:700;font-size:12.5px;cursor:pointer;transition:background .2s,color .2s;}
.card-cart-btn .cc-face{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:6px;
  transition:transform .3s cubic-bezier(.34,1.2,.4,1),opacity .2s;}
.card-cart-btn .cc-ic{transform:translateY(-110%);}
.card-cart-btn .cc-ic svg{width:20px;height:20px;}
.card-cart-btn:hover,.card-cart-btn:focus-visible{background:var(--accent);color:#3a2e00;}
.card-cart-btn:hover .cc-text{transform:translateY(115%);opacity:0;}
.card-cart-btn:hover .cc-ic{transform:translateY(0);}
.card-select{border-color:var(--primary);color:var(--primary);}
.card-select:hover{background:var(--primary);color:#fff;}
.card-stepper{margin:8px auto 0;justify-content:center;}
.grid.as-list .card-cart{display:flex;justify-content:flex-start;}
.grid.as-list .card-cart-btn{width:auto;min-width:150px;padding:0 14px;}

/* [۶] گرید هم‌عرض (رفع باگ کشیده‌شدن ستون با نام بلند) */
.grid .grid-item{min-width:0;width:100%;}
.card-name{overflow-wrap:anywhere;}

/* [۷] برچسب ناموجود کوچک‌تر و کم‌رنگ‌تر */
.card-unavailable{margin-top:8px;text-align:center;color:rgba(229,57,53,.85);font-weight:600;font-size:11px;
  border:1px solid rgba(229,57,53,.5);border-radius:9px;padding:6px;background:rgba(229,57,53,.05);}

/* [۸] دکمهٔ برو به بالا: نارنجی در روشن (رنگ تیره در تیره حفظ می‌شود) */
.scroll-top{background:var(--accent);color:#3a2e00;}
.scroll-top .ic{fill:#3a2e00;}
.scroll-top:hover{filter:brightness(.95);background:var(--accent);}

/* [۹] مینی‌هدر چسبان کالا هنگام اسکرول */
.product-ministicky{position:fixed;top:0;left:0;right:0;z-index:35;display:flex;align-items:center;gap:10px;
  background:var(--card);box-shadow:0 2px 12px rgba(0,0,0,.12);padding:8px 14px;box-sizing:border-box;
  transform:translateY(-100%);transition:transform .3s cubic-bezier(.4,0,.2,1);}
.product-ministicky.show{transform:translateY(0);}
.product-ministicky img{width:40px;height:40px;border-radius:8px;object-fit:cover;background:var(--bg-gray);flex-shrink:0;}
.product-ministicky .ms-name{font-size:13px;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}

/* [new1] دکمهٔ اشتراک‌گذاری */
.product-share{display:inline-flex;align-items:center;gap:6px;background:var(--bg);border:none;border-radius:20px;
  padding:7px 14px;color:var(--primary);font-family:inherit;font-weight:700;font-size:12.5px;cursor:pointer;margin:2px 0 10px;transition:background .2s;}
.product-share:hover{background:var(--bg-gray);}
.product-share .ic{width:17px;height:17px;fill:currentColor;}
html[data-theme="dark"] .product-share{color:var(--text);}

/* [۱۰] انیمیشن بستن جستجو */
@media(max-width:560px){
  .site-header.search-closing .search-wrap{animation:searchCollapse .22s ease forwards;}
}
@keyframes searchCollapse{from{opacity:1;transform:translateY(0);}to{opacity:0;transform:translateY(-8px);}}

/* [۱۱] دکمهٔ ورود/ثبت‌نام همیشه دیده شود (حتی در عرض کم) */
@media(max-width:560px){
  .account-btn [data-account-label]{display:inline;max-width:78px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px;}
  .account-btn{padding:4px 6px;}
  .site-header{gap:6px;}
  .account-avatar-sm{width:30px;height:30px;}
  .account-avatar-sm svg{width:17px;height:17px;}
}

/* =========================================================
   نسخهٔ ۸
   ========================================================= */

/* [۱۰] فونت کل سایت ~۱۰٪ کوچک‌تر */
body{font-size:12px;}
.card-name{font-size:12px;}
.card-price .now{font-size:13px;}
.product-name{font-size:18px;}
.prow-title{font-size:15px;}
.page-h1,.page-h2{font-size:17px;}
.btn{font-size:13px;}
.chip{font-size:12px;}

/* [۲] دکمه‌های اسکرول افقی در همهٔ سایزها دیده شوند (فقط با JS در ابتدا/انتها مخفی) */
.scroll-btn[hidden]{display:none!important;}
.scroll-btn:not([hidden]){display:flex!important;}

/* [۳] یکدست‌سازی ۳ حالت زیر کارت (افزودن / ناموجود / استپر): هم‌عرض و هم‌ارتفاع */
.card-cart{margin-top:8px;height:36px;}
.card-cart-btn{height:36px;box-sizing:border-box;}
.card-unavailable{margin-top:8px;height:36px;box-sizing:border-box;display:flex;align-items:center;justify-content:center;width:100%;}
.card-stepper{margin:0;width:100%;height:36px;box-sizing:border-box;display:flex;align-items:center;justify-content:space-between;padding:0 4px;}
.card-stepper .cs-count{flex:1;text-align:center;}
.card-stepper .cs-btn{width:34px;height:30px;}
.grid.as-list .card-cart{width:auto;height:36px;}
.grid.as-list .card-unavailable{width:auto;min-width:120px;}

/* [۴] دکمهٔ اشتراک‌گذاری فقط-آیکن در گوشهٔ گالری */
.gallery-share{position:absolute;top:10px;right:10px;z-index:3;width:38px;height:38px;border-radius:50%;border:none;
  background:rgba(255,255,255,.92);box-shadow:0 2px 8px rgba(0,0,0,.15);display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--primary);transition:background .2s,transform .1s;}
.gallery-share:hover{background:#fff;}
.gallery-share:active{transform:scale(.9);}
.gallery-share svg{width:19px;height:19px;fill:currentColor;}
html[data-theme="dark"] .gallery-share{background:rgba(40,40,40,.92);color:var(--text);}

/* [۸] placeholder کالای بدون عکس: سفید و بدون بوردر/کادر خاکستری */
.card-img.img-missing{background:var(--card) !important;}
.card-img.img-missing::after{inset:0;border-radius:0;
  background:transparent url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23cfd6dd"><path d="M21 19V5a2 2 0 00-2-2H5a2 2 0 00-2 2v14a2 2 0 002 2h14a2 2 0 002-2zM8.5 13.5l2.5 3.01L14.5 12l4.5 6H5l3.5-4.5z"/></svg>') center/34% no-repeat;}
html[data-theme="dark"] .card-img.img-missing::after{background-color:transparent;}

/* [۹] مینی‌هدر بالای همه‌چیز باشد */
.product-ministicky{z-index:60;}

/* [۵] در عرض کم، چیپ‌های افقی دسته‌بندی نمایش داده نشوند (فقط دکمهٔ پاپ‌آپ بماند) */
@media(max-width:640px){
  .groupbar-wrap .groupbar{display:none;}
  .groupbar-wrap .scroll-btn{display:none!important;}
  .groupbar-wrap{justify-content:flex-start;}
  .groupbar-toggle{width:100%;justify-content:space-between;}
}

/* =========================================================
   نسخهٔ ۹ — لودینگ قرمز، لودینگ ناوبری، مینی‌هدر زیر اپ‌بار
   ========================================================= */

/* [۴] پروگرس‌بار قرمز مدرن */
.app-loader-bar{width:200px;height:5px;border-radius:6px;background:rgba(229,57,53,.15);}
.app-loader-bar span{background:linear-gradient(90deg,#ff5252,#e53935,#c62828);border-radius:6px;box-shadow:0 0 10px rgba(229,57,53,.5);}
.app-loader-logo{border-radius:18px;}

/* [۲] لودینگ کم‌رنگ هنگام ناوبری بین صفحات */
.app-loader.nav{background:rgba(255,255,255,.55);backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);}
html[data-theme="dark"] .app-loader.nav{background:rgba(20,20,20,.55);}
.app-loader.nav .app-loader-text{opacity:.85;}

/* اپ‌بار بالای مینی‌هدر بماند */
.site-header{position:sticky;top:0;z-index:50;}

/* [۵] مینی‌هدر کالا: زیر اپ‌بار اصلی، با آیکن جایگزین در نبود عکس */
.product-ministicky{z-index:40;box-shadow:0 4px 14px rgba(0,0,0,.1);}
.ms-fallback{width:40px;height:40px;border-radius:8px;background:linear-gradient(135deg,var(--accent),#ffcf6b);display:none;align-items:center;justify-content:center;flex-shrink:0;}
.ms-fallback svg{width:22px;height:22px;fill:#3a2e00;}

/* =========================================================
   نسخهٔ ۹ — فونت ~۱۰٪ کوچک‌تر
   ========================================================= */
body{font-size:11px;}
.card-name{font-size:11px;}
.card-price .now{font-size:12px;}
.product-name{font-size:16px;}
.prow-title{font-size:14px;}
.page-h1,.page-h2{font-size:15px;}
.btn{font-size:12px;}
.chip{font-size:11px;}
.product-ministicky .ms-name{font-size:12px;}

/* =========================================================
   نسخهٔ ۱۰ — رفع بج تخفیف و مینی‌هدر
   ========================================================= */

/* [۲] بج تخفیف (دایرهٔ قرمز) و رنگ‌ها روی تصویر باشند، نه زیر آن */
.off-badge{z-index:3;}
.card-colors{z-index:3;}
.card-img::before,.card-img::after{z-index:0;}
.card-img img{z-index:1;}

/* [۱] مینی‌هدر کالا: هم‌عرض appbar، تصویر گرد، و کاملاً پنهان وقتی نمایش داده نمی‌شود */
.product-ministicky{max-width:var(--maxw);margin-inline:auto;box-sizing:border-box;border-radius:0 0 14px 14px;
  opacity:0;visibility:hidden;pointer-events:none;
  transition:transform .3s cubic-bezier(.4,0,.2,1),opacity .25s ease,visibility .25s;}
.product-ministicky.show{opacity:1;visibility:visible;pointer-events:auto;}
.product-ministicky img,.product-ministicky .ms-fallback{width:38px;height:38px;border-radius:10px;overflow:hidden;flex-shrink:0;box-sizing:border-box;}
.product-ministicky img{object-fit:cover;}
.product-ministicky .ms-fallback{align-items:center;justify-content:center;background:var(--bg-gray);}
.product-ministicky .ms-fallback svg{width:22px;height:22px;fill:var(--text-gray);}

/* =========================================================
   نسخهٔ ۱۱
   ========================================================= */

/* [۲] مینی‌هدر کالا باریک‌تر (مثل باکس معرفی، نه تمام‌عرض) */
.product-ministicky{max-width:600px;border-radius:0 0 16px 16px;}

/* [۳] گرد کردن تصاویر کارت‌ها (تأثیر عملکردی ندارد) */
.card-img img{border-radius:10px;}
.grid.as-list .card-img img{border-radius:8px;}

/* [۴] مهر اینماد (کد خام) */
.enamad-seal{display:inline-flex;align-items:center;}
.enamad-seal img{max-height:80px;width:auto;border-radius:8px;}

/* =========================================================
   نسخهٔ ۱۲ — فونت بزرگ‌تر + تم ۲ (بدون appbar، نوار پایین)
   ========================================================= */

/* فونت ~۲۰٪ بزرگ‌تر */
body{font-size:13px;}
.card-name{font-size:13px;}
.card-price .now{font-size:14px;}
.product-name{font-size:19px;}
.prow-title{font-size:17px;}
.page-h1,.page-h2{font-size:18px;}
.btn{font-size:14px;}
.chip{font-size:13px;}
.product-ministicky .ms-name{font-size:14px;}

/* ---------- تم ۲ ---------- */
body.t2{padding-bottom:70px;}
body.t2 .skip-link{display:none;}

.t2-topbar{position:sticky;top:0;z-index:50;background:var(--card);box-shadow:0 2px 12px rgba(0,0,0,.06);padding:10px 12px;box-sizing:border-box;}
.t2-topbar-inner{max-width:var(--maxw);margin-inline:auto;display:flex;align-items:center;gap:10px;}
.t2-topbar .search-wrap{flex:1;position:relative;min-width:0;}
.t2-topbar .search{display:flex;align-items:center;gap:8px;background:var(--bg);border-radius:14px;padding:11px 14px;}
.t2-topbar .search .ic{width:20px;height:20px;fill:var(--text-gray);flex-shrink:0;}
.t2-topbar .search input{border:none;background:transparent;outline:none;width:100%;font-family:inherit;font-size:14px;color:var(--text);min-width:0;}
.t2-theme{width:46px;height:46px;border-radius:14px;background:var(--bg);flex-shrink:0;}
.t2-topbar .search-suggest{top:calc(100% + 8px);}

.t2-bottomnav{position:fixed;left:0;right:0;bottom:0;z-index:55;display:flex;background:var(--card);
  box-shadow:0 -3px 18px rgba(0,0,0,.10);padding:6px 4px;padding-bottom:calc(6px + env(safe-area-inset-bottom));}
.t2-nav-item{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;background:none;border:none;cursor:pointer;
  color:var(--text-gray);font-family:inherit;font-size:11px;font-weight:600;padding:6px 2px;text-decoration:none;transition:color .2s;}
.t2-nav-item svg{width:24px;height:24px;fill:currentColor;transition:transform .2s;}
.t2-nav-item.active{color:var(--accent);}
.t2-nav-item.active svg{transform:translateY(-2px);}
.t2-nav-item:active svg{transform:scale(.85);}
.t2-cart-wrap{position:relative;display:inline-flex;}
.t2-cart-badge{position:absolute;top:-6px;left:-8px;background:var(--red);color:#fff;font-size:10px;font-weight:700;
  min-width:16px;height:16px;border-radius:8px;display:flex;align-items:center;justify-content:center;padding:0 3px;}

.t2-section{margin:16px 0;animation:pageIn .3s ease;}
.t2-section-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;padding:0 2px;}
.t2-section-head h2{font-size:16px;font-weight:700;}
.t2-seeall{font-size:12.5px;color:var(--accent);font-weight:700;text-decoration:none;}
.t2-seeall:hover{text-decoration:underline;}

/* در تم ۲ کارت‌ها کمی مدرن‌تر */
body.t2 .card{border-radius:16px;}
body.t2 .card-img{border-radius:14px 14px 0 0;}

/* =========================================================
   نسخهٔ ۱۳
   ========================================================= */

/* [۸] لوگوی تطبیقی (مربع یا مستطیل) — هدر، تم۲ و فوتر */
.logo-adaptive{display:flex;align-items:center;justify-content:center;flex-shrink:0;overflow:hidden;}
.logo-adaptive img{display:block;object-fit:contain;max-width:100%;max-height:100%;}
/* مربع: قاب مربعی */
.logo-adaptive.logo-square{width:var(--logo);height:var(--logo);border-radius:12px;}
.logo-adaptive.logo-square img{width:100%;height:100%;}
/* مستطیل عریض: ارتفاع ثابت، عرض متناسب با نسبت تصویر (حداکثر ۱۶۰px) */
.logo-adaptive.logo-wide{height:var(--logo);width:auto;max-width:min(160px, calc(var(--logo) * var(--logo-ar, 3)));border-radius:8px;}
.logo-adaptive.logo-wide img{height:100%;width:auto;}
.t2-logo{--logo:46px;}      /* هم‌قد فیلد جستجوی تم ۲ */
.footer-logo{--logo:56px;}
.footer-logo.logo-wide{max-width:190px;}

/* [۱۳] تصاویر اعتماد و بج‌ها */
.t-ic{background:transparent!important;width:44px;height:44px;}
.t-ic img{width:40px;height:40px;object-fit:contain;}
.shegeft-img{width:72px;height:72px;object-fit:contain;margin-bottom:6px;}
.sec-ic{width:26px;height:26px;object-fit:contain;vertical-align:-5px;margin-left:4px;}
.badge-img{display:flex;flex-direction:column;align-items:center;gap:4px;}
.badge-img img{width:44px;height:44px;object-fit:contain;}
.badge-zarin{padding:0;background:transparent;border:none;}
.badge-zarin img{width:52px;height:80px;object-fit:contain;border-radius:8px;}

/* [۱۱] لودینگ تصویر کارت: هم‌اندازه با خود تصویر (با احترام به padding) و ۲۰٪ روشن‌تر */
.card-img{position:relative;}
.card-img::before{content:"";position:absolute;inset:14px;border-radius:10px;z-index:0;
  background:linear-gradient(90deg,var(--sk-1) 25%,var(--sk-2) 37%,var(--sk-1) 63%);
  background-size:400% 100%;opacity:0;transition:opacity .25s;}
.card-img.img-loading::before{opacity:1;animation:skShimmer 1.3s ease infinite;}
.card-img.img-ok::before,.card-img.img-missing::before{opacity:0;animation:none;}
@keyframes skShimmer{0%{background-position:100% 0;}100%{background-position:-100% 0;}}
:root{--sk-1:#f2f4f6;--sk-2:#fafbfc;}                 /* روشن‌تر از قبل */
html[data-theme="dark"]{--sk-1:#2a2a2a;--sk-2:#343434;}
@media(prefers-reduced-motion:reduce){.card-img.img-loading::before{animation:none;}}

/* [۶] کارت گروه‌های اصلی زیر اسلایدر */
.cat-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:14px 0;}
.cat-card{display:flex;flex-direction:column;align-items:center;gap:8px;background:var(--card);border-radius:16px;
  padding:14px 8px;box-shadow:var(--shadow);text-decoration:none;color:var(--text);transition:transform .18s,box-shadow .18s;}
.cat-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-hover);}
.cat-card-img{width:64px;height:64px;border-radius:50%;background:var(--bg);display:flex;align-items:center;justify-content:center;overflow:hidden;}
.cat-card-img img{width:100%;height:100%;object-fit:cover;}
.cat-card-name{font-size:12px;font-weight:700;text-align:center;line-height:1.5;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
@media(max-width:560px){.cat-cards{grid-template-columns:repeat(2,1fr);}}

/* [۷] مینی‌هدر کالا هم‌عرض کارت دیدگاه‌ها */
.product-ministicky{max-width:var(--maxw);padding:10px 16px;}
.product-ministicky img,.product-ministicky .ms-fallback{width:44px;height:44px;}
.product-ministicky .ms-name{font-size:14px;}

/* ---------- تم ۲: اصلاحات ---------- */
/* [۳] دکمهٔ تم وسط‌چین */
body.t2 .t2-theme{display:flex;align-items:center;justify-content:center;padding:0;}
body.t2 .t2-theme .ic{width:22px;height:22px;}

/* [۴] رنگ اصلی تم ۲ از JSON سرور می‌آید (theme_2_color_1) — پیش‌فرضش در Store قرمز است.
   نکته: قبلاً اینجا --accent روی body ثابت #e5252f بود و رنگ سرور را خنثی می‌کرد. */
body.t2 .card-cart-btn{border-color:var(--accent);color:var(--accent);}
body.t2 .card-cart-btn:hover{background:var(--accent);color:#fff;}
body.t2 .card-stepper .cs-btn:hover{background:var(--accent);color:#fff;}
body.t2 .btn-primary{background:var(--accent);color:#fff;}
body.t2 .scroll-top{background:var(--accent);color:#fff;}
body.t2 .scroll-top .ic{fill:#fff;}
body.t2 .t2-nav-item.active{color:var(--accent);}
body.t2 .t2-seeall{color:var(--accent);}
body.t2 .account-avatar-sm,body.t2 .auth-illus,body.t2 .account-avatar{background:linear-gradient(135deg,var(--accent),#ff6a6a);}
body.t2 .account-avatar-sm svg,body.t2 .auth-illus svg,body.t2 .account-avatar svg{fill:#fff;}

/* [۱] دکمهٔ «برو به بالا» در تم ۲ داخل محتوا، پایین-چپ، بالای نوار پایین */
body.t2 .scroll-top{bottom:82px;left:16px;width:42px;height:42px;}

/* [۵] لوگوی تم ۲ کنار فیلد جستجو (سمت راست در RTL) */
.t2-topbar-inner{display:flex;align-items:center;gap:10px;}
.t2-logo{order:-1;}

/* =========================================================
   نسخهٔ ۱۴
   ========================================================= */

/* [۱] تم ۲: فاصله بین appbar و محتوا (اسلایدر/کارت‌ها) در همهٔ صفحات */
body.t2 main.container{padding-top:14px;}
body.t2 .slider{margin-top:0;}
body.t2 .t2-topbar{margin-bottom:0;}
body.t2 main.container > *:first-child{margin-top:0;}

/* [۲] تم ۲: بخش شگفت‌انگیز با پس‌زمینهٔ قرمز و آیکن (مثل تم ۱) */
.t2-shegeft{background:var(--red);border-radius:18px;padding:14px 12px;}
.t2-shegeft-head{display:flex;align-items:center;gap:12px;color:#fff;font-weight:700;margin-bottom:12px;padding:0 4px;}
.t2-shegeft-head .shegeft-img{width:56px;height:56px;margin:0;flex-shrink:0;}
.t2-shegeft-head span{font-size:16px;line-height:1.6;}
.t2-shegeft .grid{gap:10px;}
.t2-shegeft .card{background:var(--card);}

/* [۳] هدر منوی جستجو (بازدیدهای اخیر) + دکمهٔ بستن */
.suggest-head{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;border-bottom:1px solid var(--line);}
.suggest-head span{font-size:12.5px;font-weight:700;color:var(--text-gray);}
.suggest-close{background:transparent;border:none;cursor:pointer;padding:4px;display:flex;align-items:center;justify-content:center;
  border-radius:8px;color:var(--text-gray);transition:background .15s,color .15s;}
.suggest-close:hover{background:var(--bg);color:var(--text);}
.suggest-close svg{width:18px;height:18px;fill:currentColor;}

/* =========================================================
   نسخهٔ ۱۵ — لودینگ دقیقاً هم‌اندازهٔ خود تصویر + منوی بازدیدهای اخیر
   ========================================================= */

/* لودینگ روی خود <img> اعمال می‌شود، نه روی کانتینر → دقیقاً کل عکس را می‌پوشاند */
.card-img::before{display:none!important;}   /* شیمر قبلی روی کانتینر غیرفعال */

.card-img img{background-color:var(--sk-1);border-radius:10px;}
.card-img.img-loading img{
  background-image:linear-gradient(90deg,var(--sk-1) 25%,var(--sk-2) 37%,var(--sk-1) 63%);
  background-size:400% 100%;
  animation:skShimmer 1.3s ease infinite;
}
.card-img.img-ok img{background-image:none;background-color:transparent;animation:none;}
.card-img.img-missing img{background-image:none;animation:none;}
@media(prefers-reduced-motion:reduce){.card-img.img-loading img{animation:none;}}

/* [بازدیدهای اخیر] ردیف با دکمهٔ حذف */
.suggest-row{display:flex;align-items:center;border-bottom:1px solid var(--line);}
.suggest-row:last-child{border-bottom:none;}
.suggest-row .suggest-item{flex:1;border-bottom:none;min-width:0;}
.suggest-remove{background:transparent;border:none;cursor:pointer;padding:8px 10px;flex-shrink:0;
  color:var(--text-gray);border-radius:8px;display:flex;align-items:center;justify-content:center;transition:background .15s,color .15s;}
.suggest-remove:hover{background:var(--bg);color:var(--red);}
.suggest-remove svg{width:16px;height:16px;fill:currentColor;}

/* =========================================================
   نسخهٔ ۱۶
   ========================================================= */

/* [۳] رنگ اصلی از JSON (theme_N_color_1) روی همهٔ دکمه‌ها و عناصر «نارنجی» — پیش‌فرض قرمز */
.btn-primary,.btn-pay,.btn-checkout{background:var(--accent);color:#fff;}
.btn-primary:hover,.btn-pay:hover,.btn-checkout:hover{filter:brightness(.93);background:var(--accent);}
.card-cart-btn{border-color:var(--accent);color:var(--accent);}
.card-cart-btn:hover{background:var(--accent);color:#fff;}
.card-stepper .cs-btn:hover,.qty-stepper .qbtn:hover{background:var(--accent);color:#fff;}
.scroll-btn:hover{background:var(--accent);color:#fff;}
.scroll-top{background:var(--accent);color:#fff;}
.scroll-top .ic{fill:#fff;}
.slider .dot.active{background:var(--accent);}
.account-avatar-sm,.auth-illus,.account-avatar{background:linear-gradient(135deg,var(--accent),color-mix(in srgb,var(--accent) 60%,#fff));}
.account-avatar-sm svg,.auth-illus svg,.account-avatar svg{fill:#fff;}
.cat-sub:hover{background:var(--accent);color:#fff;}
.groupbar-toggle .ic{fill:var(--accent);}
.stars-fill svg{fill:var(--accent);}
.t2-seeall,.t2-nav-item.active{color:var(--accent);}
.card-select{border-color:var(--accent);color:var(--accent);}
.card-select:hover{background:var(--accent);color:#fff;}
.product-share,.gallery-share{color:var(--accent);}

/* [۴] انیمیشن آیکن دکمهٔ تم */
.theme-toggle .ic{transition:transform .5s cubic-bezier(.4,0,.2,1),opacity .3s;}
.theme-toggle .sun{transform:rotate(0) scale(1);}
html[data-theme="dark"] .theme-toggle .moon{animation:themeIcIn .5s cubic-bezier(.4,0,.2,1);}
.theme-toggle .sun{animation:themeIcIn .5s cubic-bezier(.4,0,.2,1);}
@keyframes themeIcIn{from{transform:rotate(-120deg) scale(.3);opacity:0;}to{transform:rotate(0) scale(1);opacity:1;}}
.theme-toggle:active .ic{transform:scale(.8) rotate(30deg);}
@media(prefers-reduced-motion:reduce){.theme-toggle .ic{animation:none!important;transition:none;}}

/* [۷] انتخاب روش ارسال */
.ship-picker{margin-top:6px;}
.ship-picker h3{font-size:14px;margin-bottom:8px;}
.ship-options{display:flex;flex-direction:column;gap:8px;}
.ship-option{display:flex;align-items:center;gap:10px;background:var(--bg);border:1.5px solid transparent;border-radius:12px;
  padding:12px 14px;cursor:pointer;transition:border-color .18s,background .18s;}
.ship-option:hover{background:var(--bg-gray);}
.ship-option.selected{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 8%,transparent);}
.ship-option input{accent-color:var(--accent);width:18px;height:18px;flex-shrink:0;}
.ship-option .so-label{flex:1;font-size:13px;font-weight:600;}
.ship-option .so-cost{font-size:13px;color:var(--text-gray);}
.ship-option.selected .so-cost{color:var(--accent);}

/* [۱] دکمهٔ پرداخت زیر خلاصهٔ سفارش */
.checkout-summary .btn-pay{width:100%;margin-top:14px;justify-content:center;}
.checkout-summary .form-msg{display:block;margin-top:8px;text-align:center;}

/* [۲] پاپ‌آپ موفقیت ثبت سفارش */
.order-success{position:fixed;inset:0;z-index:10001;display:flex;align-items:center;justify-content:center;}
.order-success-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.55);opacity:0;transition:opacity .3s;}
.order-success.show .order-success-backdrop{opacity:1;}
.order-success-box{position:relative;background:var(--card);width:min(400px,92vw);border-radius:22px;padding:32px 24px 24px;text-align:center;
  box-shadow:0 24px 70px rgba(0,0,0,.4);transform:translateY(24px) scale(.92);opacity:0;
  transition:transform .35s cubic-bezier(.2,.9,.3,1.3),opacity .25s;}
.order-success.show .order-success-box{transform:none;opacity:1;}
.os-check{width:88px;height:88px;margin:0 auto 16px;}
.os-check svg{width:100%;height:100%;}
.os-circle{stroke:var(--green);stroke-width:3;stroke-dasharray:151;stroke-dashoffset:151;}
.os-tick{stroke:var(--green);stroke-width:4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:40;stroke-dashoffset:40;}
.order-success.show .os-circle{animation:osCircle .6s ease forwards;}
.order-success.show .os-tick{animation:osTick .35s .5s ease forwards;}
@keyframes osCircle{to{stroke-dashoffset:0;}}
@keyframes osTick{to{stroke-dashoffset:0;}}
.order-success-box h3{font-size:18px;margin-bottom:10px;color:var(--green);}
.order-success-box p{font-size:13.5px;color:var(--text-gray);line-height:2;margin-bottom:22px;}
.os-actions{display:flex;flex-direction:column;gap:8px;}
.os-actions .btn{justify-content:center;}
@media(prefers-reduced-motion:reduce){.order-success.show .os-circle,.order-success.show .os-tick{animation:none;stroke-dashoffset:0;}}

/* [۸] سبد خرید بعدی */
.cart-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px;flex-wrap:wrap;}
.btn-nextlist{display:inline-flex;align-items:center;gap:6px;position:relative;}
.btn-nextlist .ic{width:18px;height:18px;fill:var(--accent);}
.nextlist-count{background:var(--accent);color:#fff;font-size:10px;font-weight:700;min-width:16px;height:16px;
  border-radius:8px;display:inline-flex;align-items:center;justify-content:center;padding:0 4px;}
.ci-later{background:transparent;border:none;cursor:pointer;padding:6px;color:var(--text-gray);
  display:flex;align-items:center;justify-content:center;border-radius:8px;transition:color .15s,background .15s;}
.ci-later:hover{color:var(--accent);background:var(--bg);}
.ci-later svg{width:20px;height:20px;}

.nextlist{margin-top:18px;background:var(--card);border-radius:16px;box-shadow:var(--shadow);padding:16px;animation:pageIn .3s ease;}
.nextlist-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;}
.nextlist-head h2{display:flex;align-items:center;gap:8px;font-size:15px;}
.nextlist-head .ic{width:20px;height:20px;fill:var(--accent);}
.btn-sm{padding:6px 12px;font-size:12px;}
.nextlist-items{display:flex;flex-direction:column;gap:8px;}
.nl-item{display:flex;align-items:center;gap:10px;background:var(--bg);border-radius:12px;padding:8px 10px;}
.nl-img{width:56px;height:56px;border-radius:10px;overflow:hidden;background:var(--card);flex-shrink:0;display:flex;align-items:center;justify-content:center;}
.nl-img img{width:100%;height:100%;object-fit:contain;}
.nl-name{flex:1;min-width:0;font-size:12.5px;color:var(--text);line-height:1.7;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-decoration:none;}
.nl-price{font-size:12.5px;font-weight:700;white-space:nowrap;flex-shrink:0;}
.nl-back,.nl-remove{background:transparent;border:none;cursor:pointer;padding:6px;flex-shrink:0;border-radius:8px;
  display:flex;align-items:center;justify-content:center;transition:background .15s,color .15s;}
.nl-back{color:var(--accent);} .nl-back:hover{background:var(--card);}
.nl-remove{color:var(--text-gray);} .nl-remove:hover{background:var(--card);color:var(--red);}
.nl-back svg,.nl-remove svg{width:18px;height:18px;}
.nl-remove svg{fill:currentColor;}
.nextlist-empty{text-align:center;color:var(--text-gray);font-size:13px;padding:18px;}

/* دیالوگ انتقال (آیکن آبی/accent به‌جای قرمز) */
.adin-dialog.dlg-move .adin-dialog-ic{background:color-mix(in srgb,var(--accent) 12%,transparent);}
.adin-dialog.dlg-move .adin-dialog-ic svg{fill:var(--accent);}


/* =========================================================
   نسخهٔ ۱۷ — اصلاحات درخواست‌شده
   ========================================================= */

/* ---------------------------------------------------------
   [۷][۱۵] رنگ متن روی رنگ اصلی قالب
   --accent   : رنگ اصلی (theme_1_color_1 / theme_2_color_1) — از سرور تزریق می‌شود
   --accent-fg: رنگ متن روی آن (روشن → تیره، تیره → سفید) — در PHP محاسبه می‌شود
   مقدار پیش‌فرض اینجاست تا اگر سرور رنگ نداد، چیزی خراب نشود.
   --------------------------------------------------------- */
:root{--accent-fg:#ffffff;--primary-fg:#ffffff;}

.btn-primary,.btn-pay,.btn-checkout{background:var(--accent);color:var(--accent-fg);}
.btn-primary:hover,.btn-pay:hover,.btn-checkout:hover{background:var(--accent);color:var(--accent-fg);filter:brightness(.93);}
.btn-primary:disabled,.btn-pay:disabled{filter:none;opacity:.6;}
.card-cart-btn{border-color:var(--accent);color:var(--accent);}
.card-cart-btn:hover,.card-cart-btn:focus-visible{background:var(--accent);color:var(--accent-fg);}
.card-select{border-color:var(--accent);color:var(--accent);}
.card-select:hover{background:var(--accent);color:var(--accent-fg);}
.card-stepper .cs-btn:hover,.qty-stepper .qbtn:hover{background:var(--accent);color:var(--accent-fg);}
.scroll-btn:hover{background:var(--accent);color:var(--accent-fg);}
.scroll-top{background:var(--accent);color:var(--accent-fg);}
.scroll-top .ic{fill:var(--accent-fg);}
.scroll-top:hover{background:var(--accent);filter:brightness(.93);}
.cat-sub:hover{background:var(--accent);color:var(--accent-fg);}
.nextlist-count{background:var(--accent);color:var(--accent-fg);}
.account-avatar-sm svg,.auth-illus svg,.account-avatar svg{fill:var(--accent-fg);}
.skip-link:focus{color:var(--primary-fg);}

/* همان قاعده‌ها برای قالب ۲ (قبلاً #fff ثابت بود) */
body.t2 .btn-primary,body.t2 .btn-pay,body.t2 .btn-checkout{background:var(--accent);color:var(--accent-fg);}
body.t2 .card-cart-btn:hover{background:var(--accent);color:var(--accent-fg);}
body.t2 .card-stepper .cs-btn:hover{background:var(--accent);color:var(--accent-fg);}
body.t2 .scroll-top{background:var(--accent);color:var(--accent-fg);}
body.t2 .scroll-top .ic{fill:var(--accent-fg);}
body.t2 .account-avatar-sm svg,body.t2 .auth-illus svg,body.t2 .account-avatar svg{fill:var(--accent-fg);}

/* [۱۵] دکمهٔ «افزودن به سبد خرید» صفحهٔ کالا هم با رنگ قالب (قبلاً همیشه قرمز ثابت بود) */
.btn-add{background:var(--accent);color:var(--accent-fg);}
.btn-add:hover{background:var(--accent);color:var(--accent-fg);filter:brightness(.94);
  box-shadow:0 6px 18px color-mix(in srgb,var(--accent) 32%,transparent);}
.btn-add:disabled{background:var(--bg-gray);color:var(--text-gray);filter:none;box-shadow:none;}

/* ---------------------------------------------------------
   [۳] SKU رنگی: اگر نام رنگ وجود دارد، مینیمال کنار سواچ نوشته شود
   --------------------------------------------------------- */
.sku-val.is-color{width:auto;height:auto;padding:6px 12px;border-radius:22px;background:var(--card);
  display:inline-flex;align-items:center;gap:7px;line-height:1;box-shadow:none;}
.sku-val.is-color .sku-dot{width:14px;height:14px;border-radius:50%;background:var(--c);
  border:1px solid rgba(0,0,0,.18);flex-shrink:0;}
html[data-theme="dark"] .sku-val.is-color .sku-dot{border-color:rgba(255,255,255,.28);}
.sku-val.is-color .sku-cname{font-size:12.5px;white-space:nowrap;}
.sku-val.is-color.selected{border-color:var(--accent);color:var(--accent);box-shadow:none;}
/* رنگ بدون نام → همان سواچ گرد قبلی */
.sku-val.is-color.swatch-only{width:34px;height:34px;padding:0;border-radius:50%;background:var(--c);}
.sku-val.is-color.swatch-only .sku-dot{display:none;}
.sku-val.is-color.swatch-only.selected{box-shadow:0 0 0 2px var(--card),0 0 0 4px var(--accent);}

/* ---------------------------------------------------------
   [۶] هنگام لود تصویر، مستطیل خاکستری (#e7e7e7) دور تصویر حذف شد.
   فقط شیمرِ روی خود تصویر می‌ماند و رنگش روشن‌تر (سفیدتر) از قبل است
   تا هم دیده شود، هم کادر خاکستری ایجاد نکند.
   --------------------------------------------------------- */
.card-img,.card-img.img-loading{background:var(--card);}
:root{--sk-1:#edf0f3;--sk-2:#fbfcfd;}
html[data-theme="dark"]{--sk-1:#242424;--sk-2:#303030;}

/* ---------------------------------------------------------
   [۴][۵][۱۲] نبودِ تصویر: بدون آیکن عکس شکسته و بدون متن alt
   --------------------------------------------------------- */
img.noimg{opacity:0;}
/* [۵] وقتی تصویری نیست، آیکن ذره‌بین (بزرگ‌نمایی) نمایش داده نشود */
.product-gallery.img-missing .zoom-hint{display:none;}
.product-gallery.img-missing{cursor:default;}
.product-gallery.img-missing img{cursor:default;}

/* ---------------------------------------------------------
   [۱۱] شناسهٔ کالا زیر باکس «امتیاز و دیدگاه کاربران»
   --------------------------------------------------------- */
.product-uid{display:flex;align-items:center;gap:7px;margin:-6px 2px 18px;padding:0 4px;
  color:var(--text-gray);font-size:12px;font-weight:500;}
.product-uid .uid-ic{width:17px;height:17px;flex-shrink:0;stroke:currentColor;fill:none;opacity:.9;}
.product-uid b{font-weight:700;color:var(--text-gray);letter-spacing:.4px;direction:ltr;unicode-bidi:embed;}

/* ---------------------------------------------------------
   [۱۴] لوگو پیش از اجرای JS هم اندازهٔ درست داشته باشد
   (قبلاً تا وقتی JS کلاس logo-square/logo-wide را اضافه نکرده بود،
    لوگو بدون هیچ قید اندازه‌ای و در ابعاد واقعی — یعنی خیلی بزرگ — رندر می‌شد)
   --------------------------------------------------------- */
.logo-adaptive:not(.logo-square):not(.logo-wide){
  height:var(--logo);width:auto;max-width:min(190px,calc(var(--logo) * 3.6));
}
.logo-adaptive:not(.logo-square):not(.logo-wide) img{
  height:auto;width:auto;max-height:var(--logo);max-width:100%;object-fit:contain;
}

/* ---------------------------------------------------------
   [۲۱] نقطه‌های اسلایدر: کاملاً دایره (نه بیضی)
   --------------------------------------------------------- */
.slider .dots{align-items:center;}
.slider .dots .dot{
  flex:0 0 10px;width:10px;height:10px;min-width:10px;min-height:10px;max-width:10px;max-height:10px;
  padding:0;margin:0;border:none;border-radius:50%;aspect-ratio:1/1;line-height:0;
  -webkit-appearance:none;appearance:none;box-sizing:border-box;
}
.slider .dots .dot.active{background:var(--accent);transform:scale(1.25);}

/* =========================================================
   نسخهٔ ۱۸
   [۱] نشان «چند طرح» روی کارت کالای پیشرفتهٔ بدون رنگ
   [۲] وسط‌چین‌کردن شناسهٔ کالا
   [۴] آیکن ثابتِ «بدون تصویر» در پیشنهاد جستجو و بازدیدهای اخیر
   ========================================================= */

/* ---- [۱] کالای پیشرفته‌ای که ویژگی رنگ ندارد: «×۳» یعنی ۳ طرح دارد ---- */
.card-variants{position:absolute;top:8px;left:8px;z-index:3;
  display:inline-flex;align-items:center;gap:3px;padding:3px 6px;
  border-radius:20px;background:rgba(255,255,255,.92);backdrop-filter:saturate(1.2);
  box-shadow:0 1px 3px rgba(0,0,0,.14);color:var(--text-gray);}
html[data-theme="dark"] .card-variants{background:rgba(38,38,38,.92);}
.card-variants svg{width:13px;height:13px;fill:none;stroke:currentColor;
  stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;}
.card-variants b{font-size:10px;font-weight:700;line-height:1;letter-spacing:.2px;
  direction:ltr;unicode-bidi:embed;}

/* ---- [۲] شناسهٔ کالا وسط‌چین ---- */
.product-uid{justify-content:center;text-align:center;}

/* ---- [۴] قاب تصویر در پیشنهاد جستجو / بازدیدهای اخیر ----
   قبلاً آیکنِ «عکس شکسته» یک لحظه دیده می‌شد و بعد محو می‌شد.
   حالا آیکن روی خودِ قاب است و اگر کالا عکس نداشته باشد باقی می‌ماند. */
.suggest-item .si-img{display:block;flex-shrink:0;width:42px;height:42px;
  border-radius:8px;overflow:hidden;
  background:var(--bg-gray) url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23c2c8cf"><path d="M21 19V5a2 2 0 00-2-2H5a2 2 0 00-2 2v14a2 2 0 002 2h14a2 2 0 002-2zM8.5 13.5l2.5 3.01L14.5 12l4.5 6H5l3.5-4.5z"/></svg>') center/60% no-repeat;}
.suggest-item .si-img img{display:block;width:100%;height:100%;
  border-radius:8px;object-fit:cover;background:none;}
.suggest-item .si-img img.noimg{opacity:0;}   /* تصویر خالی محو، آیکن قاب پیدا */
.suggest-item .si-name{font-size:13px;line-height:1.6;overflow:hidden;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;}

/* =========================================================
   نسخهٔ ۱۹
   [۱] فاصلهٔ بالای شناسهٔ کالا
   [۳] تغییر متن دکمهٔ افزودن با انیمیشن
   [۵] کارت گروه‌های پرفروش: تصویر راست/تمام‌قد، متن چپ روی پس‌زمینه
   [۷] دکمه و فرم دیدگاه
   [۹] حالت «نتیجه‌ای یافت نشد»
   ========================================================= */

/* ---- [۱] شناسهٔ کالا از بالا فاصله بگیرد ---- */
.product-uid{margin:16px 2px 18px;}

/* ---- [۳] متن دکمهٔ «افزودن به سبد خرید» نرم عوض شود، نه پرشی ---- */
[data-add-label]{display:inline-block;transition:opacity .13s ease,transform .13s ease;}
[data-add-label].lbl-out{opacity:0;transform:translateY(-5px);}
[data-add-label].lbl-in{animation:lblIn .22s ease;}
@keyframes lblIn{from{opacity:0;transform:translateY(6px);}to{opacity:1;transform:none;}}

/* ---- [۵] کارت گروه‌های پرفروش ----
   RTL: با row-reverse، فرزند اولِ HTML (متن) سمت چپ و تصویر سمت راست می‌نشیند. */
.cat-card{flex-direction:row-reverse;align-items:stretch;justify-content:flex-start;
  gap:0;padding:0;overflow:hidden;min-height:104px;position:relative;}
.cat-card-text{position:relative;flex:1 1 50%;min-width:0;display:flex;flex-direction:column;
  justify-content:center;align-items:flex-start;gap:7px;padding:12px 13px;overflow:hidden;}
/* پس‌زمینهٔ محوِ هم‌رنگ تم (خودکار با رنگ فروشگاه هماهنگ می‌شود) */
.cat-card-text::before{content:"";position:absolute;inset:0;background:var(--accent);opacity:.07;}
.cat-card-text::after{content:"";position:absolute;inset-inline-start:0;top:14px;bottom:14px;
  width:3px;border-radius:3px;background:var(--accent);opacity:.8;}
.cat-card-name{position:relative;font-size:13px;font-weight:800;line-height:1.55;text-align:start;
  color:var(--text);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.cat-card-cta{position:relative;display:inline-flex;align-items:center;gap:3px;
  font-size:10.5px;font-weight:700;color:var(--accent);}
.cat-card-cta svg{width:12px;height:12px;}
/* تصویر: نصف عرض، تمام ارتفاع کارت */
.cat-card-img{flex:0 0 50%;width:50%;align-self:stretch;height:auto;
  border-radius:0;background:var(--bg);display:block;overflow:hidden;}
.cat-card-img img{display:block;width:100%;height:100%;object-fit:cover;}
@media(max-width:560px){.cat-card{min-height:92px;}.cat-card-name{font-size:12px;}}

/* ---- [۷] دکمهٔ ثبت دیدگاه: پس‌زمینهٔ محو + آیکن ---- */
.btn-comment{position:relative;overflow:hidden;display:inline-flex;align-items:center;gap:7px;
  padding:9px 15px;border-radius:11px;font-size:13px;font-weight:700;
  color:var(--text);background:transparent;border:none;cursor:pointer;transition:transform .15s ease;}
.btn-comment::before{content:"";position:absolute;inset:0;background:var(--accent);
  opacity:.09;transition:opacity .2s ease;}
.btn-comment:hover::before{opacity:.17;}
.btn-comment:active{transform:scale(.97);}
.btn-comment .ic,.btn-comment span{position:relative;}
.btn-comment .ic{width:17px;height:17px;color:var(--accent);transition:transform .28s ease;}
.btn-comment.is-open .ic{transform:rotate(-10deg) scale(1.08);}

/* ---- [۷] باز/بسته‌شدن فرم دیدگاه با انیمیشن ---- */
.comment-form.cf-anim{overflow:hidden;
  transition:height .28s cubic-bezier(.4,0,.2,1),opacity .26s ease,transform .26s ease;}
.comment-form.cf-anim:not(.cf-open){opacity:0;transform:translateY(-6px);}
.comment-form.cf-anim.cf-open{opacity:1;transform:none;}

/* ---- [۹] «نتیجه‌ای یافت نشد» ---- */
.empty-search .empty-ic{font-size:0;color:var(--text-gray);opacity:.7;}
.empty-search .empty-ic svg{width:96px;height:96px;}
.empty-search p{margin:0;}
.empty-search p b{color:var(--text);font-weight:700;}
.empty-search .empty-hint{font-size:12.5px;color:var(--text-gray);line-height:1.7;max-width:320px;}

@media(prefers-reduced-motion:reduce){
  [data-add-label],.comment-form.cf-anim,.btn-comment,.btn-comment .ic{transition:none;animation:none;}
}

/* =========================================================
   نسخهٔ ۲۰ — [۳] بازطراحی کارت گروه‌های پرفروش
   • پس‌زمینهٔ خودِ کارت کاملاً سفید
   • گرادیانِ هم‌رنگ تم فقط روی نیمهٔ متن، روی همان سفید
   • نام گروه ۳۰٪ بزرگ‌تر
   • اگر کالای شاخص عکس نداشت → آیکن کالا
   ========================================================= */
.cat-card{background:#ffffff;}
html[data-theme="dark"] .cat-card{background:var(--card);}

/* گرادیان روی سفید (به‌جای رنگ تخت) */
.cat-card-text::before{
  background:linear-gradient(135deg,var(--accent) 0%,var(--accent) 45%,transparent 100%);
  opacity:.13;
}
html[data-theme="dark"] .cat-card-text::before{opacity:.2;}
.cat-card-text::after{opacity:.9;}

/* نام گروه: ۱۳px → ۱۷px (حدود ۳۰٪ بزرگ‌تر) */
.cat-card-name{font-size:17px;line-height:1.5;}
@media(max-width:560px){.cat-card-name{font-size:15.6px;}}
.cat-card-cta{font-size:11px;}

/* نیمهٔ تصویر روی همان سفید */
.cat-card-img{position:relative;background:#ffffff;}
html[data-theme="dark"] .cat-card-img{background:var(--card);}
.cat-card-img img{position:relative;z-index:1;}

/* آیکن جایگزین وقتی کالا عکس ندارد (زیر تصویر می‌نشیند و با بارگذاری عکس پوشانده می‌شود) */
.cat-card-img .cc-ph{position:absolute;inset:0;margin:auto;width:38%;height:38%;
  color:var(--text-gray);opacity:0;z-index:0;transition:opacity .2s;}
.cat-card-img.img-missing .cc-ph{opacity:.4;}   /* فقط وقتی عکس نیست */
.cat-card-img img.noimg{opacity:0;}             /* عکس خالی محو → آیکن پیدا می‌ماند */

/* =========================================================
   نسخهٔ ۲۱
   [۴] تعداد کالا کنار نام گروه‌ها + پس‌زمینهٔ روشن برای گروه اصلی
   [۵] بیرون‌زدن آیکن ذره‌بین از تصویر
   [۶] محدودکردن عرض اینماد
   [۷] استپر تعداد: باریک، راست‌چین، زیر قیمت
   ========================================================= */

/* ---- [۴] تعداد کالا: داخل پرانتز و کوچک‌تر از فونت اصلی ---- */
.cat-n{font-size:.78em;font-weight:500;color:var(--text-gray);
  margin-inline-start:4px;direction:ltr;unicode-bidi:embed;}

/* گروه اصلی در پاپ‌آپ: پس‌زمینهٔ روشنِ هم‌رنگ تم تا معلوم باشد دکمه است */
/* [۴] گروه اصلی در پاپ‌آپ:
   نه پس‌زمینهٔ تمام‌عرض، نه بلوکِ کشیده — فقط به‌اندازهٔ متنِ خودش،
   با رنگِ تمِ فروشگاه، و هاورِ محسوس. */
.cat-popup-body .cat-main{display:inline-flex;align-items:center;width:auto;
  border-radius:9px;padding:7px 12px;margin:2px 0 4px;font-weight:800;font-size:15px;
  color:var(--accent);background:transparent;border:1px solid transparent;
  transition:background .18s,border-color .18s,color .18s;}
.cat-popup-body .cat-main .cm-name{position:relative;}
.cat-popup-body .cat-main:hover{background:color-mix(in srgb,var(--accent) 12%,transparent);
  border-color:color-mix(in srgb,var(--accent) 45%,transparent);}
/* پشتیبان برای مرورگرهای بدون color-mix */
@supports not (background:color-mix(in srgb,red,blue)){
  .cat-popup-body .cat-main:hover{background:var(--bg);border-color:var(--accent);}
}
.cat-popup-body .cat-main .cat-n{color:inherit;opacity:.8;font-weight:700;}

/* ---- [۵] آیکن ذره‌بین از تصویر بیرون می‌زد ----
   .product-top یک فلکس است و .product-gallery به‌صورت پیش‌فرض کشیده (stretch) می‌شد،
   پس قدِ جعبه برابرِ قدِ ستونِ مشخصات می‌شد — نه قدِ تصویر. در نتیجه ذره‌بین که به
   bottom جعبه چسبیده بود، زیرِ تصویر می‌افتاد. با align-self قد جعبه = قد تصویر می‌شود. */
.product-gallery{align-self:center;}

/* ---- [۶] اینماد نباید فوتر را بشکند ---- */
.enamad-seal{display:inline-flex;align-items:center;max-width:120px;overflow:hidden;
  vertical-align:middle;}
.enamad-seal img{max-height:80px;max-width:100%;width:auto;height:auto;border-radius:8px;}
.enamad-seal a{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.badge.enemad{display:inline-flex;align-items:center;gap:6px;max-width:130px;}
.badge.enemad .ic{width:18px;height:18px;flex-shrink:0;}
.badge.enemad span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}

/* ---- [۷] استپر تعداد: عرض محدود، چسبیده به راست (زیر قیمت) ---- */
.cart-action .qty-stepper{
  width:max-content;max-width:100%;
  margin-inline:0 auto;          /* RTL: چسبیده به سمت راست */
  justify-content:flex-start;gap:4px;padding:5px 7px;}
.cart-action .qty-stepper .qbtn{width:32px;height:32px;font-size:19px;}
.cart-action .qty-count{min-width:30px;font-size:15px;text-align:center;}
.cart-action .qty-max-label{left:auto;right:0;transform:none;}
.qty-stepper .qbtn{touch-action:manipulation;user-select:none;-webkit-user-select:none;}

/* =========================================================
   نسخهٔ ۲۲
   [۱][۲] تعداد کالا: هنگام هاور با نام گروه هم‌رنگ شود
   [۵] مقدار ناموجودِ SKU + انیمیشن انتخاب ویژگی
   ========================================================= */

/* ---- [۱][۲] تعداد کنار نام: در حالت هاور مثل نام رنگ عوض کند ---- */
.chip:hover .cat-n{color:var(--accent);}
.submenu a:hover .cat-n{color:inherit;}
.cat-sub:hover .cat-n{color:inherit;}
.cat-n{transition:color .15s;}

/* ---- [۵] مقدار ناموجود (ترکیب انتخاب‌شده آن را ندارد) ---- */
.sku-val.unavailable{
  opacity:.4;
  text-decoration:line-through;
  cursor:not-allowed;
  pointer-events:none;               /* کلیک نگیرد */
  filter:grayscale(.4);
}
.sku-val.is-color.unavailable{text-decoration:none;position:relative;}
.sku-val.is-color.unavailable::after{content:"";position:absolute;inset:0;
  background:linear-gradient(135deg,transparent 44%,var(--text-gray) 44%,var(--text-gray) 56%,transparent 56%);
  border-radius:inherit;pointer-events:none;}

/* ---- [۵] انیمیشن انتخاب/تغییرِ دکمه‌های ویژگی ---- */
.sku-val{transition:border-color .2s,color .2s,background .2s,transform .16s,opacity .2s,filter .2s;}
.sku-val.selected{animation:skuPop .26s cubic-bezier(.34,1.56,.64,1);}
@keyframes skuPop{0%{transform:scale(.9);}60%{transform:scale(1.06);}100%{transform:scale(1);}}
@media(prefers-reduced-motion:reduce){.sku-val.selected{animation:none;}}

/* =========================================================
   نسخهٔ ۲۳
   [۲] جلوگیری از اسکرول صفحه هنگام درگ روی نوار دسته‌بندی
   [۳] منوی مرتب‌سازی هماهنگ با تم فروشگاه
   [۴] رنگ دیالوگ خروج از حساب
   ========================================================= */

/* ---- لیست‌های افقی: درگ افقی داخل لیست، درگ عمودی به صفحهٔ اصلی منتقل شود ---- */
.groupbar,.prow-scroll,.chip-wrap,.crumb{
  overscroll-behavior-x:contain;   /* زنجیرهٔ اسکرول افقی مهار شود */
  overscroll-behavior-y:auto;      /* درگ عمودی آزادانه به صفحه سرریز شود */
  touch-action:pan-x pan-y;        /* هر دو محور به مرورگر واگذار؛ چون لیست اسکرول عمودی ندارد، درگ عمودی به صفحه می‌رود */
}
.submenu{overscroll-behavior:contain;}  /* اسکرول داخل زیرمنو به صفحه سرریز نشود */

/* ---- [۳] منوی مرتب‌سازی سفارشی، با رنگ تم ---- */
.sort-menu{position:relative;}
.sort-btn{display:inline-flex;align-items:center;gap:6px;cursor:pointer;
  border:1px solid var(--line);background:var(--card);color:var(--text);
  border-radius:10px;padding:8px 11px;font-family:inherit;font-size:13px;font-weight:700;
  transition:border-color .18s,background .18s,box-shadow .18s;}
.sort-btn:hover{border-color:var(--accent);}
.sort-menu.open .sort-btn{border-color:var(--accent);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 22%,transparent);}
@supports not (box-shadow:0 0 0 3px color-mix(in srgb,red,blue)){
  .sort-menu.open .sort-btn{box-shadow:0 0 0 3px rgba(0,0,0,.08);}
}
.sort-btn .ic{width:16px;height:16px;color:var(--accent);}
.sort-btn .caret{width:16px;height:16px;fill:currentColor;color:var(--text-gray);
  transition:transform .2s;}
.sort-menu.open .sort-btn .caret{transform:rotate(180deg);}

.sort-pop{position:absolute;top:calc(100% + 6px);inset-inline-end:0;z-index:60;min-width:170px;
  background:var(--card);border:1px solid var(--line);border-radius:12px;padding:6px;
  box-shadow:var(--shadow-hover);
  opacity:0;transform:translateY(-6px) scale(.98);transform-origin:top;
  transition:opacity .18s ease,transform .18s ease;pointer-events:none;}
.sort-menu.open .sort-pop{opacity:1;transform:none;pointer-events:auto;}
.sort-opt{display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:9px 11px;border-radius:8px;font-size:13px;font-weight:500;color:var(--text);
  transition:background .15s,color .15s;cursor:pointer;}
.sort-opt:hover{background:color-mix(in srgb,var(--accent) 12%,transparent);}
@supports not (background:color-mix(in srgb,red,blue)){.sort-opt:hover{background:var(--bg);}}
.sort-opt .tick{width:16px;height:16px;opacity:0;color:var(--accent);transition:opacity .15s;}
.sort-opt.selected{color:var(--accent);font-weight:700;
  background:color-mix(in srgb,var(--accent) 9%,transparent);}
@supports not (background:color-mix(in srgb,red,blue)){.sort-opt.selected{background:var(--bg);}}
.sort-opt.selected .tick{opacity:1;}

/* ---- [۴] دیالوگ خروج از حساب: آیکن با رنگ تم ---- */
.adin-dialog.dlg-logout .adin-dialog-ic{background:color-mix(in srgb,var(--accent) 15%,transparent);
  color:var(--accent);}
@supports not (background:color-mix(in srgb,red,blue)){
  .adin-dialog.dlg-logout .adin-dialog-ic{background:var(--bg);color:var(--accent);}
}
.adin-dialog.dlg-logout .adin-dialog-ic svg{fill:none;}
.adin-dialog.dlg-logout .btn-danger{background:var(--accent);color:var(--accent-fg);}
