/*
Theme Name: PINKSPORT
Description: قالب اختصاصی فروشگاه لباس ورزشی PINKSPORT (ساخته‌شده برای ووکامرس)
Author: PINKSPORT
Version: 4.6
Requires at least: 6.0
Requires PHP: 7.4
Tested up to: 6.6
WC requires at least: 8.0
WC tested up to: 9.0
Text Domain: life-sport
Domain Path: /languages
License: Proprietary - All Rights Reserved
*/

:root{
  --red: #e0242f;
  --red-dark: #b3121d;
  --red-soft: #fdeaea;
  --dark: #16151a;
  --dark-soft: #232228;
  --gray-bg: #f4f4f4;
  --red-bg: #fff6f6;
  --text: #1c1c1c;
  --muted: #626262;
  --radius: 14px;
}
@font-face{
  font-family:'Iranyekan';
  src:url('assets/fonts/Qs_Iranyekan-thin.woff2') format('woff2'),
       url('assets/fonts/Qs_Iranyekan-thin.ttf') format('truetype');
  font-weight:100;
  font-style:normal;
  font-display:optional;
}
@font-face{
  font-family:'Iranyekan';
  src:url('assets/fonts/Qs_Iranyekan-light.woff2') format('woff2'),
       url('assets/fonts/Qs_Iranyekan-light.ttf') format('truetype');
  font-weight:300;
  font-style:normal;
  font-display:optional;
}
@font-face{
  font-family:'Iranyekan';
  src:url('assets/fonts/Qs_Iranyekan.woff2') format('woff2'),
       url('assets/fonts/Qs_Iranyekan.ttf') format('truetype');
  font-weight:400;
  font-style:normal;
  font-display:optional;
}
@font-face{
  font-family:'Iranyekan';
  src:url('assets/fonts/Qs_Iranyekan-medium.woff2') format('woff2'),
       url('assets/fonts/Qs_Iranyekan-medium.ttf') format('truetype');
  font-weight:500;
  font-style:normal;
  font-display:optional;
}
@font-face{
  font-family:'Iranyekan';
  src:url('assets/fonts/Qs_Iranyekan-bold.woff2') format('woff2'),
       url('assets/fonts/Qs_Iranyekan-bold.ttf') format('truetype');
  font-weight:700;
  font-style:normal;
  font-display:optional;
}
@font-face{
  font-family:'Iranyekan';
  src:url('assets/fonts/Qs_Iranyekan-extrabold.woff2') format('woff2'),
       url('assets/fonts/Qs_Iranyekan-extrabold.ttf') format('truetype');
  font-weight:800;
  font-style:normal;
  font-display:optional;
}
@font-face{
  font-family:'Iranyekan';
  src:url('assets/fonts/Qs_Iranyekan-black.woff2') format('woff2'),
       url('assets/fonts/Qs_Iranyekan-black.ttf') format('truetype');
  font-weight:900;
  font-style:normal;
  font-display:optional;
}
@font-face{
  font-family:'Iranyekan';
  src:url('assets/fonts/Qs_Iranyekan-extrablack.woff2') format('woff2'),
       url('assets/fonts/Qs_Iranyekan-extrablack.ttf') format('truetype');
  font-weight:950;
  font-style:normal;
  font-display:optional;
}
*{box-sizing:border-box;margin:0;padding:0;}
html{ overflow-x:hidden;max-width:100%; }
body{
  font-family:'Iranyekan', sans-serif;
  color:var(--text);
  background:#fff;
  direction:rtl;
  overflow-x:hidden;
  max-width:100vw;
  /* نسخه 4.6 — رفع علت اصلیِ باقی‌مونده‌ی CLS:
     فونت Iranyekan فاصله‌ی خط ذاتی‌اش (از متادیتای خودِ فایل فونت) حدود
     1.73 برابر سایز فونته، در حالی که فونت جایگزین سیستم (fallback،
     قبل از رسیدن Iranyekan) معمولاً حدود 1.15 برابره. چون تا قبل از این
     خط، هیچ‌جا line-height ثابتی برای body تعریف نشده بود، مرورگر خودش
     بر اساس «فونتی که همون لحظه نشون می‌ده» ارتفاع خط رو حساب می‌کرد؛
     یعنی دقیقاً لحظه‌ی سوییچ بین دو فونت، تقریباً تمام خط‌های متن فارسی
     صفحه (منو/دسته‌ها/اسم محصولات/عنوان‌ها) هم‌زمان کوتاه یا بلند می‌شدن —
     همون جابجایی بزرگِ main#site-main که PageSpeed گزارش می‌کرد.
     با یک عدد ثابت و بدون واحد (unitless) مثل 1.7 (نزدیک به همون حسِ
     بصری فعلیِ Iranyekan)، فاصله‌ی خط دیگه به فونت وابسته نیست؛ همیشه
     همون 1.7 برابر سایز فونت می‌مونه، چه فونت اصلی نشون داده بشه چه
     جایگزین — پس دیگه هیچ جهشی نداره. کامپوننت‌هایی که خودشون قبلاً یه
     line-height اختصاصی داشتن (مثلاً .product_title، .logo و...) دست‌نخورده
     می‌مونن چون قانون اختصاصی‌شون خاص‌تره و همچنان همون رو ارث می‌برن. */
  line-height:1.7;
}
a{text-decoration:none;color:inherit;}
ul{list-style:none;}
img{max-width:100%;display:block;}
button{font-family:inherit;cursor:pointer;border:none;}

/* ===== Top Announcement Bar ===== */
.announce{
  background:var(--dark);
  color:#fff;
  text-align:center;
  font-size:12.5px;
  font-weight:500;
  padding:8px 24px;
  position:relative;
  min-height:1.4em;
}
.announce-item{
  display:none;
  animation:announce-fade .5s ease;
}
.announce-item.active{ display:block; }
@keyframes announce-fade{
  from{ opacity:0;transform:translateY(4px); }
  to{ opacity:1;transform:translateY(0); }
}
/* اگه فقط ۲ یا ۳ آیتم باشه، هر سه هم‌زمان و در یک ردیف (راست/وسط/چپ)
   نمایش داده می‌شن؛ دقیقاً مثل نوار بالای نمونه، بدون چرخش خودکار. */
.announce.announce-static{
  display:flex;align-items:center;justify-content:space-between;
  max-width:1280px;margin:0 auto;gap:14px;
}
.announce.announce-static .announce-item{
  display:flex!important;align-items:center;gap:6px;
  flex:1;white-space:nowrap;
}
.announce.announce-static .announce-item:first-child{ justify-content:flex-start; }
.announce.announce-static .announce-item:nth-child(2){ justify-content:center;text-align:center; }
.announce.announce-static .announce-item:last-child{ justify-content:flex-end; }
/* روی موبایل هر سه آیتم (ارسال/ضمانت/پشتیبانی) هم‌زمان و کنار هم دیده
   می‌شن، دقیقاً مثل نسخه‌ی دسکتاپ — فقط با فونت و فاصله‌ی کوچیک‌تر
   متناسب با عرض صفحه؛ هیچ‌کدوم مخفی نمی‌شن. */
@media (max-width:760px){
  .announce{ padding:7px 10px;font-size:9.5px; }
  .announce.announce-static{ gap:4px; }
  .announce.announce-static .announce-item{ white-space:normal;line-height:1.3;gap:3px; }
}
@media (max-width:400px){
  .announce{ font-size:8.5px; }
}

/* ===== Header ===== */
.site-header{
  background:#fff;
  color:var(--dark);
  padding:16px 24px;
  position:relative;
  border-bottom:1px solid #f0f0f0;
}
.header-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  max-width:1280px;
  margin:0 auto;
}
.icons-left{display:flex;gap:18px;align-items:center;order:4;}
.icon-badge{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:22px;
  height:22px;
  color:var(--dark);
  line-height:1;
}
.icon-badge .count{
  position:absolute;top:-8px;left:-10px;
  background:var(--red);color:#fff;
  font-size:10px;font-weight:700;
  width:16px;height:16px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
}
.main-nav{ order:2; }
.main-nav ul{display:flex;gap:26px;font-size:14px;font-weight:500;color:var(--dark);}
.main-nav ul li.current-menu-item a{color:var(--red);font-weight:700;position:relative;}
.main-nav ul li.current-menu-item a::after{
  content:"";position:absolute;right:0;left:0;bottom:-6px;height:2px;background:var(--red);
}
.mobile-nav-toggle{
  display:none;background:none;border:none;color:var(--dark);font-size:22px;
  cursor:pointer;padding:4px 8px;line-height:1;order:0;
}
.logo{order:1;font-weight:800;font-size:21px;letter-spacing:.5px;text-align:right;line-height:1.2;display:flex;flex-wrap:wrap;align-items:baseline;column-gap:6px;color:var(--dark);white-space:nowrap;}
.logo .logo-accent{color:var(--red);}
.logo small{flex-basis:100%;display:block;font-size:9px;letter-spacing:2.5px;font-weight:500;color:var(--red);margin-top:3px;white-space:normal;}

/* ===== Header Search (inline, same row as nav/logo) ===== */
.header-search{
  order:3;flex:1 1 auto;max-width:340px;
  display:flex;gap:8px;align-items:center;
  direction:ltr;
}
/* روی دسکتاپ این فقط یک بسته‌بندی نامرئیه (تاثیری روی چیدمان نداره)؛
   دکمه همبرگر و باکس جستجو مستقیماً فرزند .header-row حساب می‌شن.
   روی موبایل به یک ردیف فلکس واقعی تبدیل می‌شه تا همبرگر و جستجو کنار هم بیفتن. */
.mobile-search-row{ display:contents; }
.search-box{
  flex:1;display:flex;align-items:center;
  background:var(--gray-bg);border-radius:30px;padding:9px 16px;
}
.search-box input{
  flex:1;border:none;outline:none;font-family:inherit;font-size:13px;background:transparent;min-width:0;
}
.header-search .search-box{ gap:8px; }
.header-search .search-box input{ direction:rtl;text-align:right; }

/* دکمه‌ی دسته‌بندی: باکس جدا و صورتی، کنار باکس جستجو (دقیقاً مثل نمونه) */
.search-cat{ position:relative;flex:0 0 auto;display:none; }
.search-cat-btn{
  width:40px;height:40px;border-radius:12px;
  display:flex;align-items:center;justify-content:center;
  background:var(--red);color:#fff;
  border:none;cursor:pointer;
}
.search-icon-in{
  display:flex;align-items:center;justify-content:center;
  width:18px;height:18px;color:var(--muted);flex:0 0 auto;
  background:none;border:none;padding:0;cursor:pointer;
}
.search-clear-icon{
  display:none;align-items:center;justify-content:center;
  width:18px;height:18px;color:var(--muted);cursor:pointer;flex:0 0 auto;
}
@media (max-width:900px){
  .mobile-search-row{
    display:flex;align-items:center;gap:10px;
    order:5;flex:1 1 100%;margin-top:12px;
  }
  .header-search{ order:1;max-width:none;flex:1 1 auto;margin-top:0; }
  .mobile-nav-toggle{ order:0;flex:0 0 auto; }
  .header-row{ flex-wrap:wrap;row-gap:10px; }
  .logo small{ display:none; }
  .logo{ font-size:17px; }
  .icons-left{ gap:14px; }
  .icon-badge{ width:20px;height:20px; }
  .icon-badge svg{ width:18px;height:18px; }
}
@media (max-width:600px){
  .search-cat-btn{ width:42px;height:42px;border-radius:12px; }
}
.cat-dropdown-panel{
  display:none;position:absolute;top:calc(100% + 10px);left:0;right:auto;
  background:#fff;border-radius:12px;box-shadow:0 10px 30px rgba(0,0,0,.15);
  min-width:210px;max-height:320px;overflow-y:auto;
  padding:10px;z-index:50;
  flex-direction:column;
  direction:rtl;text-align:right;
}
.cat-dropdown-panel.open{ display:flex; }
.cat-dropdown-panel a{
  padding:10px 14px;border-radius:8px;font-size:13px;font-weight:600;color:var(--text);
}
.cat-dropdown-panel a.cat-all{
  color:var(--red-dark);border-bottom:1px solid var(--gray-bg);
  border-radius:0;margin-bottom:4px;padding-bottom:12px;
}
.cat-dropdown-panel a:hover{ background:var(--gray-bg); }
.cat-dropdown-empty{ padding:10px 14px;font-size:12px;color:var(--muted); }

/* ===== Hero ===== */
.hero{
  position:relative;
  color:#fff;
  display:flex;
  align-items:center;
  max-width:1280px;margin:0 auto;
  width:calc(100% + 48px);margin-left:-24px;margin-right:-24px;
  border-radius:0;
  overflow:hidden;
  min-height:460px;
}
.hero-slide{
  position:absolute;inset:0;width:100%;height:100%;
  background-size:cover;background-position:top center;
  z-index:0;opacity:0;transition:opacity 1s ease;
}
.hero-slide img{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;object-position:top center;
}
.hero-slide.active{ opacity:1; }
.hero-overlay{
  position:absolute;inset:0;width:100%;height:100%;z-index:1;
  background:linear-gradient(to top, rgba(10,10,12,.25) 0%, rgba(10,10,12,0) 35%);
}
/* کل عکس بنر قابل کلیک شده و مستقیم به فروشگاه می‌ره؛ چون هیچ متن/دکمه‌ای
   روی بنر نیست، این لایه پشت نقطه‌های اسلایدر (hero-dots) قرار می‌گیره
   تا اونا همچنان قابل کلیک بمونن */
.hero-click-link{
  position:absolute;inset:0;width:100%;height:100%;z-index:2;
}
.btn-primary{
  background:var(--red);color:var(--dark);
  padding:14px 30px;border-radius:30px;font-weight:700;
  display:inline-flex;align-items:center;gap:10px;font-size:14px;
}
.hero-dots{
  position:absolute;bottom:20px;left:50%;transform:translateX(-50%);
  display:flex;gap:6px;z-index:3;
}
.hero-dots span{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.4);cursor:pointer;transition:width .2s;}
.hero-dots span.on{background:var(--red);width:20px;border-radius:6px;}

/* ===== Categories ===== */
.section{max-width:1280px;margin:40px auto;padding:0 24px;overflow-x:hidden;}

/* ===== Promo Banners ===== */
.promo-row{
  display:grid;grid-template-columns:repeat(3,1fr);gap:16px;
  max-width:1280px;margin:28px auto 40px;padding:0 24px;
}
.promo{
  border-radius:0;min-height:300px;
  position:relative;overflow:hidden;
  color:#fff;
  display:flex;align-items:flex-end;
}
.promo-photo{
  position:absolute;inset:0;width:100%;height:100%;
  background-size:cover;background-position:center;
  z-index:0;
}
.promo-photo img{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;object-position:center;
}
.promo-click-link{
  position:absolute;inset:0;width:100%;height:100%;z-index:2;
}
.promo-btn{
  align-self:flex-start;padding:9px 18px;border-radius:10px;
  font-size:12px;font-weight:700;
  background:var(--dark);color:#fff;
  display:inline-flex;align-items:center;gap:6px;
}
@media (max-width:900px){
  .promo-row{ grid-template-columns:repeat(3,1fr);padding:0 16px;gap:10px;margin:22px auto 32px; }
  .promo{ min-height:0;aspect-ratio:var(--auto-ratio, 4/5);border-radius:0; }
}

/* ===== Products ===== */
.section-head{
  display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;
}
.section-head h2{font-size:20px;font-weight:800;}
.see-all{font-size:13px;font-weight:600;color:var(--red-dark);display:flex;align-items:center;gap:6px;}
.product-grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:18px;
}
@media (max-width:900px){
  .product-grid{ grid-template-columns:repeat(2,1fr); }
}
.product-card{
  border:1px solid #eee;border-radius:0;overflow:hidden;
  display:flex;flex-direction:column;
}

/* اسلایدر افقی «جدیدترین محصولات» — همه‌ی محصولات کنار هم، با اسکرول نرم و شیک
   نکته‌ی مهم: display/overflow اینجا با !important و بدون وابستگی به هیچ
   media query تنظیم شده، تا در هیچ سایز صفحه‌ای (گوشی/تبلت/دسکتاپ) به‌اشتباه
   به حالت گرید ۵ ستونه‌ی .product-grid برنگرده و فاصله‌ی خالی/قاطی‌شدن پیش نیاد. */
.latest-products-slider{
  display:flex!important;flex-wrap:nowrap!important;grid-template-columns:none!important;
  overflow-x:auto!important;overflow-y:hidden!important;
  gap:18px;padding:6px 2px 18px;scroll-snap-type:x proximity;
  scrollbar-width:thin;scrollbar-color:var(--red) transparent;
  max-width:100%;box-sizing:border-box;
  overscroll-behavior-x:contain;touch-action:pan-x pan-y;
  /* touch-action قبلاً فقط pan-x بود؛ یعنی مرورگر روی این باکس فقط اسکرول
     افقی رو خودش هندل می‌کرد و اسکرول عمودی صفحه (بالا/پایین رفتن با انگشت)
     وقتی لمس از روی همین باکس شروع می‌شد، اصلاً کار نمی‌کرد و کاربر حس
     می‌کرد صفحه هنگ کرده. با pan-y هم اضافه شده، هر دو جهت (افقی برای
     اسلایدر، عمودی برای اسکرول کل صفحه) به‌درستی کار می‌کنن. */
  /* بدون این‌ها، لمس و کشیدن روی گوشی به‌جای اسکرول افقی، به‌عنوان
     «انتخاب متن/عکس» تشخیص داده می‌شد؛ همون چیزی که باعث می‌شد با نگه‌داشتن
     انگشت متن کپی بشه و کشیدن روی کارت‌ها از محدوده‌ی اسلایدر بیرون بزنه. */
  -webkit-user-select:none;user-select:none;-webkit-touch-callout:none;
}
.latest-products-slider .product-card,
.latest-products-slider .product-card *{
  -webkit-user-select:none;user-select:none;-webkit-touch-callout:none;
}
.latest-products-slider::-webkit-scrollbar{ height:6px; }
.latest-products-slider::-webkit-scrollbar-track{ background:transparent; }
.latest-products-slider::-webkit-scrollbar-thumb{ background:var(--red);border-radius:10px; }
.latest-products-slider .product-card{
  flex:0 0 auto!important;width:clamp(140px,38vw,230px);scroll-snap-align:start;
  transition:box-shadow .2s ease,transform .2s ease;
}
.latest-products-slider .product-card:hover{
  box-shadow:0 10px 24px rgba(0,0,0,.08);transform:translateY(-2px);
}

/* روی کامپیوتر (دسکتاپ) به‌جای اسلایدر افقی، همون گرید عمودی سه‌ستونه‌ی
   استاندارد .product-grid نمایش داده می‌شه (چون توی این سایز صفحه اسکرول
   افقی لازم نیست) و دکمه‌ی «مشاهده بیشتر» زیرش میاد. روی گوشی/تبلت همون
   اسلایدر افقی قبلی بدون تغییر باقی می‌مونه. */
@media (min-width:901px){
  .latest-products-slider{
    display:grid!important;flex-wrap:wrap!important;
    grid-template-columns:repeat(4,1fr)!important;
    overflow-x:visible!important;overflow-y:visible!important;
    scroll-snap-type:none!important;
  }
  .latest-products-slider .product-card{
    flex:initial!important;width:auto!important;
  }
}
.latest-view-more{
  display:none;align-items:center;justify-content:center;gap:8px;
  max-width:420px;margin:24px auto 0;padding:13px 20px;
  border:1px solid var(--dark);border-radius:var(--radius);
  font-size:13px;font-weight:700;color:var(--dark);
  transition:background .2s ease,color .2s ease;
}
.latest-view-more:hover{ background:var(--dark);color:#fff; }
@media (min-width:901px){
  .latest-view-more{ display:flex; }
}
.product-img-wrap{position:relative;overflow:hidden;}
.product-img-wrap::after,
.woocommerce-product-gallery__image::after,
.ls-gallery-slide::after{
  content:"PINKSPORT";
  position:absolute;
  top:50%;left:50%;
  transform:translate(-50%,-50%);
  font-family:'Montserrat','Segoe UI',sans-serif!important;
  font-size:19px;
  font-weight:900!important;
  letter-spacing:.5px;
  background:linear-gradient(90deg,
    rgba(246,168,198,.55) 0%,
    rgba(246,168,198,.55) 36%,
    rgba(255,255,255,.55) 36%,
    rgba(255,255,255,.55) 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  -webkit-text-fill-color:transparent;
  pointer-events:none;
  user-select:none;
  z-index:1;
  white-space:nowrap;
}
.woocommerce-product-gallery__image{position:relative;}
.badge{
  position:absolute;top:12px;right:12px;
  background:var(--red);color:#fff;
  font-size:11px;font-weight:700;padding:4px 10px;border-radius:20px;
  z-index:2;
}
/* اگه چند بج همزمان نمایش داده بشن (مثلاً تخفیف + شارژ مجدد)، زیر هم می‌شینن */
.product-img-wrap .badge + .badge{ top:44px; }
.badge-outofstock{ background:var(--red-dark); }
.badge-restock{ background:#6c4bd8; border-radius:8px; }
.wish{
  position:absolute;top:12px;left:12px;
  width:28px;height:28px;min-width:28px;min-height:28px;max-width:28px;max-height:28px;
  border-radius:50%;background:#fff;
  display:flex;align-items:center;justify-content:center;font-size:13px;line-height:1;
  border:none;cursor:pointer;padding:0;margin:0;box-sizing:border-box;
  -webkit-appearance:none;appearance:none;z-index:2;
}
.wish.active, .wishlist-btn.active{ color:var(--red-dark); }
.ic-heart{
  width:13px;height:13px;display:block;
  fill:var(--red);stroke:var(--red);stroke-width:1px;stroke-linejoin:round;stroke-linecap:round;
}
.wish.active .ic-heart, .wishlist-btn.active .ic-heart, #wishlist-icon.active .ic-heart{
  fill:var(--red);stroke:var(--red);
}
#wishlist-icon .ic-heart{ width:19px;height:19px; }
.product-img-wrap img{width:100%;height:220px;object-fit:cover;}
.product-info{padding:14px 16px;}
.product-info .name{font-size:13px;font-weight:600;margin-bottom:8px;}
.product-info .stars{
  display:flex;gap:2px;margin-bottom:8px;color:#e2c14d;font-size:12px;line-height:1;
}
.product-info .stars .off{ color:#ddd; }
.price-row{display:flex;align-items:center;justify-content:space-between;gap:8px;}
.price{font-size:14px;font-weight:800;color:var(--red-dark);}
.price del{color:var(--muted);font-weight:400;font-size:12px;margin-left:6px;}
.add-cart{
  width:32px;height:32px;min-width:32px;flex:0 0 auto;
  background:var(--red);color:#fff;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:14px;line-height:1;
}

/* ===== Perks strip ===== */
.perks-strip{
  display:grid;grid-template-columns:repeat(4,1fr);
  max-width:1280px;margin:20px auto;padding:26px 24px;border-top:1px solid #eee;border-bottom:1px solid #eee;
}
.perks-strip .item{display:flex;align-items:center;justify-content:center;gap:12px;text-align:right;}
.perks-strip .item .ic{
  font-size:20px;width:46px;height:46px;flex:0 0 auto;border-radius:50%;
  background:var(--gray-bg);display:flex;align-items:center;justify-content:center;
}
.perks-strip .item .txt{display:flex;flex-direction:column;gap:3px;}
.perks-strip .item .txt b{font-size:13px;font-weight:700;color:var(--dark);}
.perks-strip .item .txt span{font-size:11px;color:var(--muted);}
@media (max-width:900px){
  .perks-strip{ grid-template-columns:repeat(2,1fr);gap:16px; }
}

/* ===== Instagram ===== */
.insta-head{
  display:flex;justify-content:space-between;align-items:center;
  max-width:1280px;margin:0 auto;padding:0 24px 16px;
}
.insta-head .handle{font-weight:800;font-size:15px;}
.insta-head .cta{font-size:13px;color:var(--red-dark);font-weight:600;}
.insta-grid{
  display:grid;grid-template-columns:repeat(6,1fr);gap:8px;
  max-width:1280px;margin:0 auto 40px;padding:0 24px;
}
.insta-grid a{border-radius:0;overflow:hidden;}
.insta-grid img{width:100%;height:150px;object-fit:cover;}

/* ===== Footer features ===== */
.footer-features{
  background:var(--red-soft);
  display:grid;grid-template-columns:repeat(4,1fr);
  padding:36px 24px;gap:20px;
}
.footer-features .f-item{text-align:center;}
.footer-features .f-item .ic{font-size:26px;margin-bottom:10px;}
.footer-features .f-item h3{font-size:14px;font-weight:800;margin-bottom:6px;}
.footer-features .f-item p{font-size:11px;color:var(--muted);}

.site-footer-bottom{
  text-align:center;padding:18px;font-size:12px;color:var(--muted);
}

/* ===== بنر پیگیری سفارش ===== */
.order-track-banner{
  background:linear-gradient(90deg, var(--red-dark), var(--red));
  border-radius:0;
  width:calc(100% + 48px);margin:0 -24px;
  padding:40px;display:flex;align-items:center;justify-content:center;gap:24px;
  flex-wrap:wrap;text-align:center;
}
.order-track-banner.has-image{
  background-color:var(--red-dark);
}
.order-track-banner h3{ color:#fff;font-size:22px;font-weight:800; }
.order-track-banner .promo-btn{ background:#fff;color:var(--dark);border:none; }

.ot-modal-overlay{
  display:none;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:200;
  align-items:center;justify-content:center;
}
.ot-modal-overlay.open{ display:flex; }
.ot-modal{
  background:#fff;border-radius:var(--radius);padding:30px;width:90%;max-width:400px;
  position:relative;
}
.ot-modal h3{ font-size:18px;font-weight:800;margin-bottom:20px; }
.ot-modal label{ font-size:13px;font-weight:600;display:block;margin-bottom:6px;margin-top:14px; }
.ot-modal input{
  width:100%;padding:12px 14px;border:1px solid #ddd;border-radius:10px;font-family:inherit;font-size:13px;
}
.ot-modal-close{
  position:absolute;top:16px;left:16px;background:none;border:none;font-size:22px;cursor:pointer;color:var(--muted);
}
#ot-result{ margin-top:16px;font-size:13px; }
.ot-success{ background:var(--red-soft);border-radius:10px;padding:14px; }
.ot-success p{ margin-bottom:6px; }
.ot-error{ color:#c0392b; }
.ot-loading{ color:var(--muted); }
#ot-submit{ margin-top:18px; }

/* ===== پاپ‌آپ خوش‌آمدگویی (عضویت در کانال) — نمایش لحظه‌ی ورود به سایت ===== */
body.welcome-popup-locked{ overflow:hidden; }
.welcome-popup-overlay{
  display:none;position:fixed;inset:0;background:rgba(0,0,0,.65);z-index:500;
  align-items:center;justify-content:center;padding:20px;
}
.welcome-popup-overlay.open{ display:flex; }
.welcome-popup{
  position:relative;width:100%;max-width:380px;border-radius:20px;padding:36px 28px 30px;
  text-align:center;color:#fff;box-shadow:0 20px 50px rgba(0,0,0,.35);
  animation:welcomePopupIn .25s ease;
}
@keyframes welcomePopupIn{
  from{ opacity:0;transform:scale(.92); }
  to{ opacity:1;transform:scale(1); }
}
.welcome-popup-close{
  position:absolute;top:14px;left:14px;background:rgba(255,255,255,.15);border:none;
  color:#fff;width:32px;height:32px;border-radius:50%;font-size:18px;line-height:1;
  display:flex;align-items:center;justify-content:center;
}
.welcome-popup-icon{ margin:0 auto 18px; }
.welcome-popup-icon img{ max-width:70px;max-height:70px;margin:0 auto;border-radius:50%; }
.welcome-popup-icon-link{ display:inline-block;cursor:pointer;transition:transform .15s ease; }
.welcome-popup-icon-link:hover{ transform:scale(1.05); }
.welcome-popup-icon-default{
  display:inline-flex;align-items:center;justify-content:center;width:64px;height:64px;
  border-radius:50%;background:rgba(255,255,255,.15);font-size:28px;color:#fff;
}
.welcome-popup-title{ font-size:19px;font-weight:800;line-height:1.7;margin-bottom:10px; }
.welcome-popup-handle{ font-size:16px;font-weight:700;opacity:.9;margin-bottom:22px;direction:ltr; }
.welcome-popup-btn{
  display:inline-block;background:#fff;color:#1c1c1c;font-weight:800;font-size:14px;
  padding:13px 30px;border-radius:999px;
}
.welcome-popup-btn:hover{ opacity:.9; }

/* حالت «بنر عکسی» پاپ‌آپ ورود به سایت — وقتی از سفارشی‌سازی یک عکس بنر آپلود بشه،
   به‌جای باکس رنگی بالا، همین حالت (فقط عکس + دکمه بستن گرد روی گوشه) نمایش داده
   می‌شه. کلاس‌ها (popup-box / popup-close / popup-banner) دقیقاً همون‌هایی هستن
   که خودت دادی؛ رویداد باز/بسته‌شدن هم از همون منطق welcome-popup-overlay بالا
   استفاده می‌کنه، پس نیازی به اسکریپت جدا نیست. */
.welcome-popup-overlay .popup-box{
  position:relative;width:100%;max-width:420px;
  animation:welcomePopupIn .25s ease;
}
.popup-banner{
  display:block;width:100%;height:auto;border-radius:18px;
  box-shadow:0 20px 50px rgba(0,0,0,.35);
}
.popup-close{
  position:absolute;top:-14px;right:-14px;width:34px;height:34px;border:none;
  border-radius:50%;background:#fff;color:#16151a;font-size:18px;line-height:1;
  display:flex;align-items:center;justify-content:center;cursor:pointer;
  box-shadow:0 4px 14px rgba(0,0,0,.28);
}
@media (max-width:480px){
  .welcome-popup-overlay .popup-box{ max-width:92%; }
  .popup-close{ top:-10px;right:-10px;width:30px;height:30px;font-size:16px; }
}

/* ===== عنوان بخش‌ها با خط دو طرف («دسته بندی ها» و مشابه) — دقیقاً مطابق
   استایل سایت قبلی: یک خط باریک از راست تا چپ که پشت متن رد می‌شه، و خودِ
   متن با یک فاصله‌ی خالی (پس‌زمینه‌ی سفید) روی همون خط، وسط صفحه می‌شینه. ===== */
.ls-bordered-title{
  position:relative;text-align:center;margin:0 0 16px;
}
.ls-bordered-title::before{
  content:"";position:absolute;top:50%;right:0;left:0;height:1px;
  background:#e6e2e2;z-index:0;
}
.ls-bordered-title h3{
  position:relative;z-index:1;display:inline-block;margin:0;
  padding:0 18px;background:#fff;font-size:19px;font-weight:800;color:var(--dark);
}

/* ===== دسته‌بندی محصولات: تیتر بخش + شبکه‌ی ۳×۲ از عکس‌ها با نام دسته روی خود عکس ===== */
.cat-section-head{ max-width:1280px;margin:0 auto 22px;padding:0 24px;text-align:center; }
.cat-kicker{
  display:flex;align-items:center;justify-content:center;gap:10px;
  font-size:13px;font-weight:700;letter-spacing:.5px;color:var(--dark);margin-bottom:10px;
}
.cat-kicker b{ color:var(--red); }
.cat-kicker .line{ width:26px;height:2px;background:var(--red);display:inline-block; }
.cat-heading{ margin:0 0 6px;font-size:28px;font-weight:800;color:var(--dark); }
.cat-heading .red{ color:var(--red); }
.cat-subtitle{ font-size:12px;letter-spacing:2px;color:var(--muted);text-transform:uppercase; }
.cat-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:10px;
  max-width:1280px;margin:0 auto;padding:0 24px;
}
.cat-card{
  /* نسبت ابعاد رو جاوااسکریپت (پایین همین فایل) دقیقاً از روی عکس واقعی
     هر دسته محاسبه و ست می‌کنه (--auto-ratio)، درست مثل بنر هیرو و بنرهای
     پروموی زیر صفحه؛ عدد 650/380 فقط یه پیش‌فرض موقته تا قبل از لود شدن
     جاوااسکریپت. */
  position:relative;display:block;aspect-ratio:var(--auto-ratio, 650/380);overflow:hidden;
  border-radius:var(--radius);background:var(--gray-bg);
}
.cat-card img{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;object-position:center;
  transition:transform .3s ease;
}
.cat-card:hover img{ transform:scale(1.05); }
@media (max-width:900px){
  .cat-grid{ gap:8px;padding:0 16px; }
  .cat-heading{ font-size:23px; }
}
@media (max-width:600px){
  .cat-section-head{ padding:0 16px;margin-bottom:16px; }
  .cat-grid{ gap:6px;padding:0 16px; }
  .cat-heading{ font-size:19px; }
  .cat-kicker{ font-size:11px; }
  .cat-kicker .line{ width:18px; }
  .cat-subtitle{ font-size:10px;letter-spacing:1px; }
}

/* ===== صفحه «دسته‌بندی‌ها» (شورت‌کد پیش‌فرض ووکامرس) ===== */
ul.products li.product-category,
ul.products li.product-category a,
ul.products li.product-category img,
.woocommerce-loop-category__title{
  border-radius:0!important;
}
ul.products li.product-category mark.count,
.woocommerce-loop-category__title .count{
  display:none!important;
}

/* ===== فوتر چندستونه ===== */
.site-footer-columns{
  background:var(--dark);color:#eee;
  padding:44px 24px 24px;
}
.footer-columns-inner{
  max-width:1280px;margin:0 auto;
  display:grid;grid-template-columns:1fr 1.4fr 1fr;gap:40px;align-items:start;
}
.footer-newsletter h4{ font-size:14px;font-weight:800;color:#fff;margin-bottom:14px; }
.footer-newsletter p{ font-size:12px;color:#999;margin-bottom:16px;line-height:1.8; }
.newsletter-form{
  display:flex;align-items:center;background:rgba(255,255,255,.08);
  border-radius:30px;padding:5px 6px 5px 16px;gap:8px;
}
.newsletter-form input{
  flex:1;background:transparent;border:none;outline:none;color:#fff;font-family:inherit;font-size:12px;min-width:0;
}
.newsletter-form input::placeholder{ color:#888; }
.newsletter-form button{
  width:34px;height:34px;border-radius:50%;background:var(--red);color:#fff;
  display:flex;align-items:center;justify-content:center;flex:0 0 auto;
}
.site-footer-bottom{
  display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;
}
.footer-social-bottom{ display:flex;gap:10px; }
.footer-social-bottom a{
  width:32px;height:32px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  overflow:hidden;flex-shrink:0;background-size:cover;
}
.footer-social-bottom a svg{ width:16px;height:16px; }
.footer-social-bottom a img{ width:100%;height:100%;object-fit:cover; }
@media (max-width:900px){
  .footer-columns-inner{ grid-template-columns:1fr; }
  .footer-newsletter{ text-align:center; }
  .newsletter-form{ max-width:340px;margin:0 auto; }
  .site-footer-bottom{ flex-direction:column;text-align:center; }
}
.footer-col h4{ font-size:14px;font-weight:800;color:#fff;margin-bottom:16px; }
.footer-col ul{ display:flex;flex-direction:column;gap:10px; }
.footer-col ul a{ font-size:13px;color:#ccc; }
.footer-col ul a:hover{ color:var(--red); }
.footer-links{ display:grid;grid-template-columns:1fr 1fr;gap:30px; }
.footer-brand{ text-align:right; }
.footer-brand .logo{ text-align:right;margin-bottom:10px;font-size:30px;color:#fff; }
.footer-brand .logo span{ font-size:14px; }
.footer-brand p{ font-size:13px;color:#999;margin-bottom:16px; }
.footer-social{ display:flex;gap:12px;justify-content:flex-start; }
.footer-social a{
  width:36px;height:36px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  overflow:hidden;flex-shrink:0;background-size:cover;
}
.footer-social a svg{ width:18px;height:18px; }
.footer-social a img{ width:100%;height:100%;object-fit:cover; }
.site-footer-columns .site-footer-bottom{
  border-top:1px solid rgba(255,255,255,.1);margin-top:30px;padding-top:20px;color:#888;
}

/* ===== کشوی سبد خرید ===== */
.cart-drawer-overlay{
  display:none;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:300;
}
.cart-drawer-overlay.open{ display:block; }
.cart-drawer{
  position:fixed;top:0;right:-380px;width:360px;max-width:88vw;height:100%;
  background:#fff;z-index:301;transition:right .3s ease;
  display:flex;flex-direction:column;padding:24px;overflow-y:auto;
  box-shadow:-10px 0 30px rgba(0,0,0,.15);
}
.cart-drawer.open{ right:0; }
.cart-drawer-head{ display:flex;justify-content:space-between;align-items:center;margin-bottom:20px; }
.cart-drawer-head h3{ font-size:16px;font-weight:800; }
.cart-drawer-close{ background:none;border:none;font-size:22px;cursor:pointer;color:var(--muted); }
.cart-drawer-item{ display:flex;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid #eee; }
.cart-drawer-item img{ width:56px;height:56px;object-fit:cover;border-radius:8px; }
.cart-drawer-item-info{ flex:1; }
.cart-drawer-item-info .name{ font-size:13px;font-weight:600; }
.cart-drawer-item-info .meta{ font-size:11px;color:var(--muted);margin:2px 0; }
.cart-drawer-item-info .price{ font-size:12px;font-weight:700;color:var(--red-dark); }
.cart-drawer-remove,
.wishlist-drawer-remove{ background:none;border:none;font-size:18px;color:var(--muted);cursor:pointer; }
.cart-drawer-total{ display:flex;justify-content:space-between;padding:16px 0;font-size:14px;border-top:1px solid #eee;margin-top:8px; }
.cart-drawer-continue{ display:block;text-align:center;font-size:12px;color:var(--muted);margin-top:12px; }
.cart-drawer-empty{ text-align:center;color:var(--muted);font-size:13px;padding:40px 0; }

/* ===== دکمه‌های سایز/رنگ محصول (بجای دراپ‌داون) — این بار دقیقاً با همون
   اعداد واقعی خودِ استایل رفرنس (کلاس‌های .form-option-label و
   .form-option-color): ارتفاع ۳۵px، border-radius:20px، حاشیه‌ی #e3e9ef،
   فونت ۱۲.۸px — نه یه گرد‌شدگی حدسی ===== */
/* اسلایدی/قابل‌اسکرول افقی: به‌جای اینکه دکمه‌های زیاد به خط بعد بشکنن و
   کل صفحه رو به پایین هول بدن، همه توی یک ردیف افقی قابل‌کشیدن/سوایپ
   می‌مونن — دقیقاً همون رفتار نوار عکس‌های کوچک گالری بالای صفحه */
.variation-swatches{
  display:flex;flex-wrap:nowrap;gap:8px;margin:4px 0 2px;
  width:100%;max-width:100%;min-width:0;box-sizing:border-box;
  overflow-x:auto;-webkit-overflow-scrolling:touch;scroll-behavior:smooth;
  scrollbar-width:none;cursor:grab;padding-bottom:2px;
}
.variation-swatches::-webkit-scrollbar{ display:none; }
.swatch-btn{
  background:#fff;border:1px solid #e3e9ef;border-radius:8px;
  height:34px;min-width:44px;padding:0 12px;flex:0 0 auto;
  display:inline-flex;align-items:center;justify-content:center;
  font-size:12.8px;font-weight:600;color:#4b566b;cursor:pointer;font-family:inherit;
  transition:color .2s ease-in-out,border-color .2s ease-in-out,background .2s ease-in-out;
}
.swatch-btn:hover{ border-color:#4b566b; }
.swatch-btn.active{ background:#151515;color:#fff;border-color:#151515; }

/* قرص رنگ: مربعِ رنگ با گوشه‌ی گرد؛ روی گزینه‌ی انتخاب‌شده یک قاب تیره دور مربع
   و یک تیک سفید وسطش ظاهر می‌شه — دقیقاً مطابق نمونه‌ای که فرستادی */
.variation-swatches.is-color{ gap:10px; }
.swatch-btn.swatch-color-square{
  width:34px;height:34px;padding:0;border-radius:8px;
  box-shadow:0 0 0 1px #e3e9ef;position:relative;flex:0 0 auto;
}
.swatch-btn.swatch-color-square .swatch-check{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  color:#fff;opacity:0;transition:opacity .15s ease;
  filter:drop-shadow(0 0 2px rgba(0,0,0,.55));
}
.swatch-btn.swatch-color-square.active{
  box-shadow:0 0 0 2px #121212;
}
.swatch-btn.swatch-color-square.active .swatch-check{ opacity:1; }

/* اسمِ رنگِ انتخاب‌شده، درست کنار عنوان «رنگ» (مثلا «رنگ : قهوه ای») */
.woo-selected-variation-item-name{
  font-size:13px;font-weight:500;color:var(--muted);margin-right:4px;
}

/* ===================================================================
   سواچ‌های رنگ/سایز افزونه‌ی Variation Swatches for WooCommerce
   (wvs-style-squared) — رنگ به شکل مربع، سایز به شکل دکمه‌ی هم‌قواره،
   با فاصله‌ی کم و جمع‌وجور بین آیتم‌ها و بین ردیف رنگ/سایز.
   =================================================================== */
div.product .variable-items-wrapper{
  display:flex;flex-wrap:nowrap;gap:8px;margin:4px 0 0;padding:0 0 2px;list-style:none;
  width:100%;max-width:100%;min-width:0;box-sizing:border-box;
  overflow-x:auto;-webkit-overflow-scrolling:touch;scroll-behavior:smooth;
  scrollbar-width:none;cursor:grab;
}
div.product .variable-items-wrapper::-webkit-scrollbar{ display:none; }
div.product .variable-item{ cursor:pointer;flex:0 0 auto; }
div.product .variable-item-contents{
  position:relative;display:flex;align-items:center;justify-content:center;
  transition:box-shadow .15s ease,border-color .15s ease,background .15s ease,color .15s ease;
}

/* رنگ: مربع کوچیک، با قاب تیره دور مربعِ انتخاب‌شده و تیک سفید وسطش */
div.product .color-variable-item .variable-item-contents{
  width:34px;height:34px;border-radius:8px;box-shadow:0 0 0 1px #e3e9ef;overflow:hidden;
}
div.product .color-variable-item .variable-item-span-color{ display:block;width:100%;height:100%; }
div.product .color-variable-item[aria-checked="true"] .variable-item-contents,
div.product .color-variable-item.selected .variable-item-contents{
  box-shadow:0 0 0 2px #121212;overflow:visible;
}
div.product .color-variable-item[aria-checked="true"] .variable-item-contents::after,
div.product .color-variable-item.selected .variable-item-contents::after{
  content:'✓';position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  color:#fff;font-size:15px;font-weight:700;text-shadow:0 0 2px rgba(0,0,0,.6);
}

/* سایز (یا هر ویژگی متنی دیگه): دکمه‌ی مستطیلی هم‌قواره با مربع رنگ، همون
   ارتفاع ۳۴px — دقیقاً هم‌ردیف و هم‌شکل با ردیف رنگ، فقط با متن به‌جای رنگ */
div.product .button-variable-item .variable-item-contents{
  min-width:44px;height:34px;padding:0 12px;border-radius:8px;
  border:1px solid #e3e9ef;font-size:12.8px;font-weight:600;color:#4b566b;
}
div.product .button-variable-item:hover .variable-item-contents{ border-color:#4b566b; }
div.product .button-variable-item[aria-checked="true"] .variable-item-contents,
div.product .button-variable-item.selected .variable-item-contents{
  background:#151515;color:#fff;border-color:#151515;
}

/* موجود نیست: کم‌رنگ + ضربدر مورب روی مربع/دکمه */
div.product .variable-item.disabled{ opacity:.4;cursor:not-allowed; }
div.product .variable-item.disabled .variable-item-contents::before{
  content:'';position:absolute;inset:0;border-radius:inherit;
  background:linear-gradient(to top right, transparent calc(50% - 1px), #999 calc(50% - 1px), #999 calc(50% + 1px), transparent calc(50% + 1px));
}

/* فاصله‌ی جمع‌وجورتر بین ردیف «رنگ» و ردیف «سایز» و کل بخش رنگ/سایز محصول —
   مقدار واقعی پایین‌تر، کنار قانون display:flex همین سطر، تنظیم شده تا رول
   دوباره‌نویسی‌شده‌ی بعدی خنثاش نکنه */
div.product table.variations td.value{ margin-bottom:0; }

/* رنگ/سایزی که با ترکیب انتخاب‌شده‌ی فعلی موجود نیست: کم‌رنگ و ضربدر‌خورده،
   دقیقاً مثل رفتار سایت niillshop.ir */
.swatch-btn.swatch-disabled{
  opacity:.4;cursor:not-allowed;position:relative;
}
.swatch-btn.swatch-disabled::after{
  content:'';position:absolute;inset:0;border-radius:inherit;
  background:linear-gradient(to top right, transparent calc(50% - 1px), currentColor calc(50% - 1px), currentColor calc(50% + 1px), transparent calc(50% + 1px));
}
.variation-swatches.is-color .swatch-btn.swatch-disabled.swatch-color-square{ opacity:.45; }

/* دکمه‌ی راهنمای اندازه — یک باکس صورتی با متن تیره‌ی «راهنمای اندازه» وسط آن */
.size-guide-row{
  display:flex;align-items:center;justify-content:flex-start;
  margin:10px 0 8px;
}
.size-guide-btn{
  display:inline-flex;align-items:center;justify-content:center;
  background:var(--red-soft);border:none;border-radius:6px;color:var(--dark);
  font-size:14px;font-weight:700;cursor:pointer;font-family:inherit;
  margin:0;padding:9px 20px;text-decoration:none;
}

/* دکمه‌ی افزودن به علاقه‌مندی — همون .btn.btn-default رفرنس: خاکستری روشن،
   گوشه‌ی تقریباً بدون گردی، ارتفاع ۵۲px */
.wishlist-btn{
  display:flex;align-items:center;justify-content:center;gap:8px;
  width:100%;max-width:420px;height:52px;
  background:#ebedf1;border:none;border-radius:1.6px;
  padding:0 20px;font-size:14px;font-weight:700;cursor:pointer;font-family:inherit;
  margin:8px 0 0;color:#151515;
}
.wishlist-btn .ic-heart{ fill:none;stroke:#151515;stroke-width:1.6px; }
.wishlist-btn.active{ background:var(--red-soft); }
.wishlist-btn.active .ic-heart{ fill:var(--red);stroke:var(--red); }

/* ===== صفحات ثابت (سبد خرید / پرداخت / حساب کاربری / تماس با ما...) ===== */
.wc-page-wrap{ min-height:300px; }
.page-title{ font-size:24px;font-weight:800;margin-bottom:24px; }

/* جدول سبد خرید */
.woocommerce-cart table.shop_table,
.woocommerce-checkout table.shop_table{
  width:100%;border-collapse:collapse;margin-bottom:24px;
}
.woocommerce table.shop_table th{
  background:var(--gray-bg);padding:12px;font-size:13px;font-weight:700;text-align:right;
}
.woocommerce table.shop_table td{
  padding:14px 12px;border-bottom:1px solid #eee;font-size:13px;vertical-align:middle;
}
.woocommerce table.shop_table td.product-thumbnail img{
  width:70px;height:70px;object-fit:cover;border-radius:10px;
}
.woocommerce table.shop_table td.product-name a{ font-weight:600;color:var(--text); }
.woocommerce .quantity .qty{
  width:60px;padding:8px;border:1px solid #ddd;border-radius:8px;text-align:center;font-family:inherit;
}

/* دکمه‌ها (ادامه خرید / بروزرسانی سبد / پرداخت و...) */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce-Button{
  background:var(--red-dark)!important;color:#fff!important;
  border:none!important;border-radius:30px!important;
  padding:12px 26px!important;font-size:13px!important;font-weight:700!important;
  font-family:inherit!important;cursor:pointer;
}
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover{
  background:var(--dark)!important;color:#fff!important;
}
.woocommerce a.remove{
  color:var(--red-dark)!important;font-size:18px;
}

/* پیام‌ها (خطا، موفقیت، اطلاعیه) */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
.woocommerce-noreviews{
  background:var(--red-soft);border:none;border-radius:12px;
  padding:16px 20px;list-style:none;margin-bottom:20px;font-size:13px;
  display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;
}
.woocommerce-error{ background:var(--red-soft); }

/* فرم‌های ورود / ثبت‌نام / پرداخت */
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce-checkout select{
  width:100%;padding:12px 14px;border:1px solid #ddd;border-radius:10px;
  font-family:inherit;font-size:13px;
}
.woocommerce form .form-row label{ font-size:13px;font-weight:600;margin-bottom:6px;display:block; }

/* حساب کاربری من (My Account) */
.woocommerce-MyAccount-navigation ul{
  display:flex;flex-wrap:wrap;gap:8px;margin-bottom:24px;list-style:none;padding:0;
}
.woocommerce-MyAccount-navigation li a{
  display:block;padding:10px 18px;background:var(--gray-bg);border-radius:30px;
  font-size:13px;font-weight:600;
}
.woocommerce-MyAccount-navigation li.is-active a{
  background:var(--dark);color:#fff;
}
.woocommerce-MyAccount-content{ max-width:700px; }

@media (max-width: 900px){
  .product-grid{grid-template-columns:repeat(2,1fr);}
  .insta-grid{grid-template-columns:repeat(3,1fr);gap:8px;}
  .insta-grid img{height:120px;}
  .footer-features{grid-template-columns:repeat(2,1fr);}
  .footer-columns-inner{grid-template-columns:1fr;text-align:center;}
  .footer-brand{ text-align:center; }
  .footer-brand .logo{ text-align:center; }
  .footer-social{ justify-content:center; }
  .footer-links{ grid-template-columns:1fr 1fr; }
  .footer-col ul{align-items:center;}
  /* توجه: چون تمام فرزندهای .hero (اسلاید/اورلی/پرک‌ها/نقطه‌ها) به‌صورت
     position:absolute هستن، اگه فقط min-height:auto بذاریم و ارتفاعی
     مشخص نکنیم، خود باکس .hero عملاً صفر ارتفاع می‌شه (چون هیچ فرزند
     in-flow ای نداره) و کل بنر روی سایزهای تبلت (بین ۶۰۱ تا ۹۰۰ پیکسل)
     نامرئی می‌شه. نسبت ۲:۱ (همون نسبتی که وردپرس عکس هیرو رو باهاش برش
     می‌زنه) رو گذاشتیم؛ این باکس بدون نیاز به لود شدن عکس، از همون اول
     ارتفاع درست و ثابتی داره و کل عرض عکس هم بدون افتادگی از چپ/راست نشون داده می‌شه. */
  .hero{flex-direction:column;justify-content:center;aspect-ratio:var(--auto-ratio, 2/1);height:auto;min-height:0;}
  .hero-slide{width:100%;}

  .mobile-nav-toggle{ display:block; }
  .main-nav{
    position:absolute;top:100%;right:0;left:0;
    background:#fff;box-shadow:0 12px 24px rgba(0,0,0,.12);
    max-height:0;overflow:hidden;transition:max-height .25s ease;
    z-index:80;
  }
  .main-nav.open{ max-height:420px;overflow-y:auto; }
  .main-nav ul{ flex-direction:column;gap:0;padding:8px 20px; }
  .main-nav ul li{ border-bottom:1px solid #eee; }
  .main-nav ul li a{ display:block;padding:14px 4px;color:var(--text); }
  .main-nav ul li.current-menu-item a{ color:var(--red-dark); }
}

@media (max-width:600px){
  .section{ padding:0 16px;margin:26px auto; }
  .insta-grid{ grid-template-columns:repeat(3,1fr);gap:6px; }
  .insta-grid img{ height:100px; }
  .promo-row{ grid-template-columns:repeat(3,1fr);padding:0 16px;gap:8px;margin:18px auto 26px; }
  .order-track-banner{ width:calc(100% + 32px);margin:0 -16px;padding:28px 20px; }

  /* بنر — روی موبایل هر سه باکس کنار هم، فقط تصویر تمیز بدون متن/دکمه.
     نسبت ابعاد رو جاوااسکریپت (پایین صفحه front-page.php) دقیقاً از روی
     خود عکس آپلودی محاسبه و ست می‌کنه (--auto-ratio)، برای همینه که هرچی
     آپلود بشه (مربعی، کشیده و...) کامل و بدون افتادگی نشون داده می‌شه؛
     عدد 4/5 فقط یه پیش‌فرض موقته تا قبل از لود شدن جاوااسکریپت. */
  .promo{ min-height:0;aspect-ratio:var(--auto-ratio, 4/5);border-radius:0; }
  .promo-btn{ font-size:8px;padding:5px 8px;border-radius:7px;gap:3px; }

  /* هدر و اسلایدر اصلی — گوشه‌ها تیز (بدون گردی). نسبت ابعاد رو هم جاوااسکریپت
     دقیقاً از روی خود عکس هیرو محاسبه می‌کنه (--auto-ratio)؛ چون وردپرس همیشه
     عکس هیرو رو با سایز اختصاصی 'life-sport-hero' برش می‌زنه، این عدد همیشه
     دقیقاً با ابعاد واقعی عکس یکی می‌شه و دیگه از چپ/راست برش نمی‌خوره.
     عدد 2/1 فقط یه پیش‌فرض موقته تا قبل از لود شدن جاوااسکریپت. */
  .hero{
    margin:0 auto;border-radius:0;
    width:calc(100% + 32px);margin-left:-16px;margin-right:-16px;
    aspect-ratio:var(--auto-ratio, 2/1);height:auto;
    max-height:none!important;min-height:0!important;
  }
  .hero-slide{ background-position:center center; }
  .hero-overlay{
    background:linear-gradient(to top, rgba(10,10,12,.35) 0%, rgba(10,10,12,0) 45%);
  }
  /* ردیف امکانات اعتماد (پرداخت امن/اصالت کالا/ارسال/پشتیبانی)
     — روی موبایل هم هر ۴ مورد کنار هم و در یک ردیف ثابت، بدون اسکرول/اسلاید */
  .perks-strip{
    display:grid!important;grid-template-columns:repeat(4,1fr)!important;
    gap:4px;padding:14px 2px;
  }
  .perks-strip .item{
    flex-direction:column;align-items:center;justify-content:flex-start;
    text-align:center;gap:6px;
  }
  .perks-strip .item .ic{ font-size:15px;width:32px;height:32px; }
  .perks-strip .item .txt{ align-items:center; }
  .perks-strip .item .txt b{ font-size:9.5px;line-height:1.25;white-space:normal; }
  .perks-strip .item .txt span{ font-size:8px;line-height:1.2;white-space:normal; }
  .footer-features{ grid-template-columns:repeat(2,1fr);padding:28px 16px;gap:16px; }

  /* محصولات — سایز کارت‌ها روی موبایل کوچیک‌تر می‌شه؛ رفتار اسلایدی/گریدی
     خودِ .latest-products-slider (بالای فایل، به‌صورت مستقل از سایز صفحه)
     یا .product-grid ساده (برای گرید عمودی وبلاگ/جست‌وجو) مشخص می‌کنه،
     اینجا فقط ظاهر کارت روی موبایل تنظیم می‌شه. */
  .latest-products-slider .product-card{ width:clamp(120px,34vw,190px); }
  .product-img-wrap img{ height:160px!important; }
  .product-info{ padding:10px 12px; }
  .product-info .name{ font-size:12px;margin-bottom:6px; }
  .price{ font-size:13px; }
  .add-cart{ padding:8px 2px;font-size:9.5px;margin-top:8px;white-space:nowrap;gap:3px;letter-spacing:-0.2px; }

  /* دو ستون «دسترسی سریع» و «خدمات مشتریان» روی موبایل هم کنار هم (بغل هم)
     می‌مونن، دقیقاً مثل نمونه — فقط با فاصله و فونت کوچیک‌تر */
  .footer-links{ grid-template-columns:1fr 1fr;gap:14px;text-align:center; }
  .footer-col h4{ font-size:12.5px; }
  .footer-col ul{ align-items:center;gap:8px; }
  .footer-col ul a{ font-size:11.5px; }
}

/* ===================================================================
   صفحه تکی محصول — چون تا الان هیچ استایل اختصاصی نداشت، همه‌چیز
   (گالری، قیمت، رنگ/سایز، دکمه افزودن به سبد، تب‌ها، محصولات مرتبط)
   با ریست کلی سایت به‌هم می‌ریخت. این بخش کل صفحه محصول را می‌سازد.
   =================================================================== */
div.product{
  display:flex;flex-wrap:wrap;gap:40px;
  max-width:1280px;margin:10px auto 24px;padding:0 24px;
}
div.product .woocommerce-product-gallery{
  flex:1 1 420px;max-width:480px;position:relative;
}
div.product .woocommerce-product-gallery img{
  width:100%;border-radius:0;object-fit:cover;
}
div.product .woocommerce-product-gallery .flex-control-thumbs{
  display:flex;flex-wrap:nowrap;justify-content:flex-start;gap:0;margin-top:12px;
  list-style:none;padding:0 2px 8px;
  overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;
  scroll-snap-type:x proximity;
  /* اسکرول‌بار نازک و قابل‌دیدن، تا معلوم باشه عکس بیشتری هم کنارش هست
     و با اسکرول/کشیدن می‌شه دید (قبلاً کامل مخفی بود و همین گمراه‌کننده بود) */
  scrollbar-width:thin;scrollbar-color:var(--red-dark) transparent;
}
div.product .woocommerce-product-gallery .flex-control-thumbs::-webkit-scrollbar{ height:5px; }
div.product .woocommerce-product-gallery .flex-control-thumbs::-webkit-scrollbar-track{ background:transparent; }
div.product .woocommerce-product-gallery .flex-control-thumbs::-webkit-scrollbar-thumb{
  background:var(--red-dark);border-radius:10px;
}
/* دقیقاً ۹۰x۹۰px هر تصویر کوچک، مثل نمونه (نه درصدی از عرض) — flex:0 0 auto تا
   تو حالت اسلایدی جمع نشن و کنار هم قابل کشیدن/سوایپ بمونن */
div.product .woocommerce-product-gallery .flex-control-thumbs li{
  width:90px;height:90px;flex:0 0 auto;list-style:none;margin:2px;scroll-snap-align:start;
}
div.product .woocommerce-product-gallery .flex-control-thumbs img{
  width:100%;height:100%;object-fit:cover;
  border-radius:4px;cursor:pointer;opacity:.3;
  border:1px solid #eceef5;padding:4px;box-sizing:border-box;
  transition:opacity .2s ease-out;
}
div.product .woocommerce-product-gallery .flex-control-thumbs img.flex-active,
div.product .woocommerce-product-gallery .flex-control-thumbs img:hover{
  opacity:1;
}
div.product span.onsale{
  position:absolute;top:14px;right:14px;z-index:2;
  background:var(--red-dark);color:#fff;font-size:12px;font-weight:700;
  padding:5px 12px;border-radius:20px;
}

div.product .summary.entry-summary{ flex:1 1 380px;min-width:280px; }

/* برچسب دسته‌بندی، بالای عنوان محصول (مثل نمونه) */
div.product .prd-cat-badge{ margin-bottom:8px; }
div.product .prd-cat-badge a{
  display:inline-block;background:var(--red-soft);color:var(--red-dark);
  font-size:12px;font-weight:700;padding:5px 14px;border-radius:20px;text-decoration:none;
}

div.product .product_title{ font-size:24px;font-weight:800;margin-bottom:8px;line-height:1.4; }

div.product .woocommerce-product-rating{ display:none; }
div.product .star-rating{ color:var(--red-dark);font-size:15px;overflow:hidden; }
div.product .woocommerce-review-link{ color:var(--muted); }

div.product p.price,
div.product p.price .woocommerce-Price-amount{
  font-size:20px;font-weight:600;color:var(--red-dark);
}
div.product p.price{ margin-bottom:12px;display:block; }
div.product p.price del{ font-size:15px;font-weight:400;color:var(--muted);margin-left:8px; }
div.product p.price ins{ text-decoration:none; }

div.product .woocommerce-product-details__short-description{
  margin-bottom:14px;font-size:14px;color:var(--muted);line-height:1.9;
}
div.product .woocommerce-product-details__short-description p{ margin-bottom:6px; }

div.product form.cart{ display:flex;flex-direction:column;gap:10px;margin-bottom:8px;max-width:420px; }
div.product table.variations{ width:100%;table-layout:fixed;border-collapse:collapse;margin-bottom:0; }
div.product table.variations tbody,
div.product table.variations tr{ display:flex;flex-direction:column;gap:2px;margin-bottom:4px;min-width:0; }
div.product table.variations th.label{
  font-weight:700;font-size:14px;text-align:right;padding-bottom:2px;
}
div.product table.variations td.value{ display:block;width:100%;min-width:0;box-sizing:border-box; }
div.product table.variations select{
  width:100%;max-width:260px;border:1px solid #ddd;border-radius:10px;
  padding:10px 14px;font-family:inherit;font-size:13px;background:#fff;
}
div.product .reset_variations{
  display:inline-block;margin-top:4px;font-size:12px;color:var(--red-dark);
}
div.product .woocommerce-variation-price{ font-weight:700;margin:4px 0 6px; }
div.product .woocommerce-variation-availability{ font-size:12px;color:var(--muted); }

/* باکس انتخاب تعداد — کادر تمام‌عرض جمع‌وجور با دکمه‌های بالا/پایین کوچک سمت چپ
   (دکمه‌ها با جاوااسکریپت در functions.php به input اضافه می‌شن)
   پس‌زمینه صورتی کم‌رنگ با واترمارک «PINKSPORT» وسط باکس */
div.product .quantity{
  position:relative;overflow:hidden;
  display:flex;align-items:center;gap:10px;
  width:100%;max-width:420px;height:52px;
  border:1px solid var(--red-soft);border-radius:0;
  padding:0 16px;margin:0;background:var(--red-bg);
}
/* واترمارک وسط باکس، دقیقاً مثل واترمارک روی عکس محصولات: «Life» صورتی و
   «PINKSPORT» تیره، پشت عدد تعداد (بدون تداخل با کلیک/انتخاب روی input) */
div.product .quantity .ls-qty-watermark{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  display:flex;direction:ltr;pointer-events:none;white-space:nowrap;
  font-size:15px;font-weight:800;letter-spacing:.2px;opacity:.45;z-index:0;
}
div.product .quantity .ls-qty-watermark .ls-w-pink{ color:var(--red-dark); }
div.product .quantity .ls-qty-watermark .ls-w-white{ color:var(--dark); }
/* دکمه‌های بالا/پایین تعداد، سمت چپ باکس */
div.product .ls-qty-stepper{
  position:relative;z-index:1;display:flex;flex-direction:column;gap:2px;flex:0 0 auto;
}
div.product .ls-qty-stepper button{
  width:22px;height:20px;border:none;border-radius:4px;background:#fff;
  display:flex;align-items:center;justify-content:center;
  font-size:9px;line-height:1;color:var(--dark);cursor:pointer;
  box-shadow:0 1px 2px rgba(0,0,0,.08);
}
div.product .ls-qty-stepper button:hover{ background:var(--red-dark);color:#fff; }
div.product .quantity .qty{
  position:relative;z-index:1;
  flex:1;min-width:0;border:none;background:none;
  text-align:right;font-family:inherit;font-size:16px;font-weight:700;color:var(--text);padding:0;
  -moz-appearance:textfield;
}
div.product .quantity .qty::-webkit-outer-spin-button,
div.product .quantity .qty::-webkit-inner-spin-button{ -webkit-appearance:none;margin:0; }

/* باکس طوسی کمرنگ دور «عنوان محصول + قیمت + سایز/رنگ» — بین گالری و باکس
   تعداد با کمترین فاصله‌ی ممکن (فاصله‌ی بالا با تنظیم gap عمودی خودِ
   div.product کم شده، فاصله‌ی پایین هم با همون gap:10px که form.cart از قبل
   داره تامین می‌شه، پس این باکس خودش margin اضافه نمی‌گیره). همون واترمارک
   ریز «PINKSPORT»ِ باکس تعداد، اینجا هم گوشه‌ی پایین باکس تکرار شده */
div.product .ls-title-box{
  position:relative;overflow:hidden;
  background:#f4f5f7;border:1px solid #eceef2;border-radius:0;
  padding:16px 16px 14px;margin:0!important;
}
div.product .ls-title-box > *{ position:relative;z-index:1;margin-top:0!important; }
div.product .ls-title-box .prd-cat-badge{ margin-bottom:8px; }
div.product .ls-title-box .product_title{ margin-bottom:8px; }
div.product .ls-title-box p.price{ margin-bottom:12px; }
div.product .ls-title-box table.variations{ margin-bottom:0; }
div.product .ls-title-box .ls-title-watermark{
  position:absolute;bottom:10px;left:16px;z-index:0;
  display:flex;direction:ltr;pointer-events:none;white-space:nowrap;
  font-size:14px;font-weight:800;letter-spacing:.2px;opacity:.35;
}
div.product .ls-title-box .ls-title-watermark .ls-w-pink{ color:var(--red-dark); }
div.product .ls-title-box .ls-title-watermark .ls-w-white{ color:var(--dark); }

/* دکمه‌ی افزودن به سبد خرید — همون .btn.custom-height.bg-dark رفرنس:
   مشکی #151515، ارتفاع ۵۲px، گوشه تقریباً بدون گردی */
div.product .single_add_to_cart_button,
div.product button.single_add_to_cart_button{
  background:#151515!important;color:#fff!important;
  border-radius:1.6px!important;
  height:52px!important;padding:0 20px!important;
  font-size:16px!important;font-weight:600!important;
  margin-top:0;display:flex!important;align-items:center;justify-content:center;gap:8px;
  width:100%;max-width:420px;text-align:center;
}
div.product .single_add_to_cart_button:hover{ background:#000!important;color:#fff!important; }
div.product .woocommerce-variation-add-to-cart{ display:flex;flex-direction:column;gap:8px;width:100%;max-width:420px; }

/* جمع‌وجورتر کردن فاصله‌ها: هر فاصله‌ی اضافه‌ی خودکاری که ووکامرس بین بخش‌های
   خلاصه‌ی محصول (رنگ/سایز، جزئیات نسخه‌ی انتخابی، فرم افزودن به سبد خرید،
   دکمه‌ی علاقه‌مندی) می‌ذاره حذف می‌شه؛ فاصله‌ی واقعی هرجا لازم بود همون‌جا
   جدا مشخص شده (مثل gap روی form.cart و margin-top روی wishlist-btn) */
div.product .summary.entry-summary > *{ margin-top:0!important; }
div.product .woocommerce-variation{ margin:0!important;padding:0!important;min-height:0!important; }
div.product .woocommerce-variation-price,
div.product .woocommerce-variation-availability,
div.product .woocommerce-variation-description{ margin:0!important; }
div.product .woocommerce-variation-price:empty,
div.product .woocommerce-variation-availability:empty,
div.product .woocommerce-variation-description:empty{ display:none!important; }
div.product .reset_variations{ display:inline-block;margin:4px 0 0!important; }
div.product form.cart{ margin-bottom:0!important; }
div.product .size-guide-btn{ margin:8px 0 0!important; }

/* فاصله‌ی یکسان و جمع‌وجور بین سه باکس: تعداد، افزودن به سبد خرید، افزودن به علاقه‌مندی */
div.product form.cart{ gap:8px!important; }

/* ردیف عمودی: تعداد، بعد افزودن به سبد خرید، بعد افزودن به علاقه‌مندی — هر سه
   تمام‌عرض و زیر هم، دقیقاً مثل نمونه‌ی رفرنس
   (باکس‌ها با جاوااسکریپت در footer.php داخل .ls-action-row جمع می‌شن) */
div.product .ls-action-row{
  display:flex;flex-direction:column;align-items:stretch;gap:10px;
  max-width:420px;width:100%;margin-top:0!important;
}
div.product .ls-action-row .woocommerce-variation-add-to-cart{
  display:flex;flex-direction:column;align-items:stretch;gap:10px;width:100%;
}
div.product .ls-action-row .woocommerce-variation-add-to-cart[style*="display: none"]{ display:none!important; }
div.product .ls-action-row .quantity{ width:100%;max-width:none; }
div.product .ls-action-row .single_add_to_cart_button{
  width:100%!important;max-width:none!important;
}
div.product .ls-action-row .wishlist-btn{
  width:100%!important;max-width:none!important;
  padding:0 18px;margin:0!important;white-space:nowrap;
}
div.product .ls-action-row .wishlist-btn-label{ display:inline; }

/* تب‌های افقی «توضیحات تکمیلی» / «مشخصات محصول» — دقیقاً مثل نمونه‌ی رفرنس
   (nav-tabs.simple_tab_links): وسط‌چین، بدون پس‌زمینه، فقط تب فعال با یک
   خط تیره‌ی مشکی زیرش مشخص می‌شه؛ فقط یکی هم‌زمان باز می‌مونه */
div.product .ls-simple-tabs{
  flex-basis:100%;margin-top:18px;
}
.ls-simple-tabs .ls-tab-headers{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:center;
  list-style:none;padding:0;margin:0 0 24px;gap:10px;
  border-bottom:none;
}
.ls-simple-tabs .ls-tab-item{ margin:0; }
.ls-simple-tabs .ls-tab-link{
  margin:0 5px;padding:.5rem .8rem;border:none;border-radius:0;
  background:transparent;font-family:inherit;
  font-size:16px;font-weight:800;text-transform:uppercase;
  color:var(--text);opacity:.8;cursor:pointer;
}
.ls-simple-tabs .ls-tab-link:hover{ opacity:1; }
.ls-simple-tabs .ls-tab-link.active{
  color:#000;background:transparent;
  border-bottom:2px dashed #000;opacity:1;
}
.ls-simple-tabs .ls-tab-panel{
  display:none;font-size:14px;line-height:2;color:var(--text);
}
.ls-simple-tabs .ls-tab-panel.active{ display:block; }

/* محصولات مرتبط — دیگه از قالب اختصاصی جدا استفاده نمی‌کنه؛ الان دقیقاً
   همون مارک‌آپ و کلاس‌های اسلایدر «جدیدترین محصولات» صفحه اصلی رو داره
   (.section > .section-head + .product-grid.latest-products-slider)
   پس همون استایل‌های عمومی این بخش، بدون نیاز به قانون جدا، روش اعمال می‌شه. */

/* صفحه‌ی فروشگاه («مشاهده همه») — بقیه‌ی محصولاتی که تو اسلایدر جا نشدن، به‌صورت گرید عمودی */
.woocommerce ul.products{
  display:grid;grid-template-columns:repeat(3,1fr);gap:18px;list-style:none;padding:0;margin:24px 0;
}
.woocommerce ul.products li.product{
  border:1px solid #eee;border-radius:0;overflow:hidden;padding-bottom:14px;position:relative;
}
.woocommerce ul.products li.product img{ width:100%!important;max-width:100%!important;height:280px!important;object-fit:cover!important;display:block; }
.woocommerce ul.products li.product .woocommerce-loop-product__title{
  display:block;font-size:13px;font-weight:600;padding:12px 14px 6px;color:var(--text);
}
.woocommerce ul.products li.product .price{ display:block;padding:0 14px;font-size:14px;font-weight:800;color:var(--red-dark); }
.woocommerce ul.products li.product .button{
  display:block;margin:10px 14px 0;padding:10px;text-align:center;
  background:var(--dark);color:#fff!important;border-radius:30px;font-size:12px;font-weight:700;
  text-decoration:none;
}
@media (max-width:900px){
  .woocommerce ul.products{ grid-template-columns:repeat(2,1fr); }
  .woocommerce ul.products li.product img{ height:220px!important; }
}
@media (max-width:600px){
  .woocommerce ul.products{ grid-template-columns:repeat(2,1fr);gap:12px; }
  .woocommerce ul.products li.product img{ height:160px!important; }
  .woocommerce ul.products li.product .woocommerce-loop-product__title{ font-size:12px;padding:10px 10px 4px; }
  .woocommerce ul.products li.product .price{ font-size:13px;padding:0 10px; }
  .woocommerce ul.products li.product .button{ margin:8px 10px 0;font-size:11px;padding:8px; }
}

@media (max-width:900px){
  div.product{ flex-direction:column;gap:10px;padding:0 16px; }
  div.product .woocommerce-product-gallery{ max-width:100%; }
  div.product .summary.entry-summary{ min-width:0; }
}

/* رفع مشکل «عکس محصول خیلی بزرگ روی کامپیوتر»: گالری اختصاصی محصول
   (.ls-gallery در product-image.php) هیچ محدودیت عرضی نداشت، برخلاف
   کلاس قدیمی .woocommerce-product-gallery که دیگه اصلاً تو مارک‌آپ
   استفاده نمی‌شه. نتیجه این بود که روی صفحه‌های عریض (کامپیوتر) این
   گالری تقریباً کل عرض صفحه‌ی محصول رو می‌گرفت و عکس همراهش خیلی گنده
   دیده می‌شد. این قانون فقط از عرض ۹۰۱ پیکسل به بالا (یعنی فقط کامپیوتر)
   فعاله و هیچ تاثیری روی نمای گوشی/تبلت نداره. */
@media (min-width:901px){
  div.product .ls-gallery{
    flex:1 1 420px;
    max-width:480px;
  }
}

/* ===== محصولات مرتبط — دقیقاً مثل بخش «محصولات مشابه» رفرنس: بدون دکمه‌ی
   افزودن به سبد خرید روی کارت، اسم و قیمت وسط‌چین، و آیکون علاقه‌مندی که
   به‌شکل نوار روی عکس فقط با هاور/لمس نمایش داده می‌شه (نه همیشه گوشه‌ی عکس) =====
   این استایل‌ها فقط همین بخشو عوض می‌کنه، نه اسلایدر «جدیدترین محصولات» تو
   صفحه اصلی یا گرید فروشگاه که همون شکل قبلی (با دکمه) رو حفظ می‌کنن. */
.related-products-section .product-card .wish{
  position:static;width:auto;height:auto;min-width:0;min-height:0;max-width:none;max-height:none;
  border-radius:2px;background:#fff;padding:11px 14px;
}
.related-products-section .product-img-wrap{ position:relative; }
.related-hover-overlay{
  position:absolute;bottom:0;left:0;width:100%;
  display:flex;align-items:center;justify-content:center;
  padding:10px;background:rgba(255,255,255,.92);
  visibility:hidden;opacity:0;transform:translateY(12px);
  transition:all .3s ease;
}
.related-products-section .product-card:hover .related-hover-overlay{
  visibility:visible;opacity:1;transform:translateY(0);
}
.related-products-section .product-info{ padding:14px 16px;text-align:center; }
.related-products-section .product-info .name{ margin-bottom:6px; }
.related-products-section .price{ display:block; }

/* گرید عمودی «محصولات مرتبط» — روی دسکتاپ ۴ ستونه، روی موبایل/تبلت ۲ ستونه
   (به‌جای اسلایدر افقی «جدیدترین محصولات») + دکمه‌ی «مشاهده بیشتر» زیرش که
   مستقیم به دسته‌بندی مربوطه می‌ره. */
.related-grid{ grid-template-columns:repeat(4,1fr); }
@media (max-width:900px){
  .related-grid{ grid-template-columns:repeat(2,1fr); }
}
.related-view-more{
  display:flex;align-items:center;justify-content:center;gap:8px;
  max-width:420px;margin:24px auto 0;padding:13px 20px;
  border:1px solid var(--dark);border-radius:var(--radius);
  font-size:13px;font-weight:700;color:var(--dark);
  transition:background .2s ease,color .2s ease;
}
.related-view-more:hover{ background:var(--dark);color:#fff; }
@media (max-width:600px){
  .related-view-more{ max-width:100%;padding:12px 16px;font-size:12.5px; }
}

/* ===================================================================
   صفحه سبد خرید — طراحی کارتی اختصاصی (woocommerce/cart/cart.php)
   =================================================================== */
.ls-cart-wrap{ max-width:720px;margin:0 auto;padding:0 4px 60px; }
.ls-cart-title{ font-size:26px;font-weight:800;text-align:center;margin:10px 0 28px; }

.ls-cart-items{ display:flex;flex-direction:column; }
.ls-cart-item{
  position:relative;padding:22px 0;border-bottom:1px solid #eee;
}
.ls-cart-item:first-child{ padding-top:6px; }

.ls-cart-item-close{
  position:absolute;top:20px;left:0;
  width:34px;height:34px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:var(--gray-bg);color:var(--text);
  font-size:18px;line-height:1;
}
.ls-cart-item-close:hover{ background:#eee; }

.ls-cart-item-row{ display:flex;justify-content:space-between;gap:16px;padding-left:44px; }
.ls-cart-item-info{ flex:1;min-width:0; }
.ls-cart-item-name{ font-size:16px;font-weight:700;margin-bottom:8px; }
.ls-cart-item-name a{ color:var(--text); }

.ls-cart-item-meta{ font-size:13px;color:var(--text);display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-bottom:6px; }
.ls-cart-item-sep{ color:var(--muted); }
.ls-cart-item-qty .quantity{ display:inline-flex;align-items:center; }
.ls-cart-item-qty input.qty{
  width:52px;padding:4px 6px;border:1px solid #ddd;border-radius:8px;
  text-align:center;font-family:inherit;font-size:13px;margin-right:4px;
}

.ls-cart-item-variation{ font-size:13px;color:var(--text); }
.ls-cart-item-variation dl.variation{ display:flex;flex-wrap:wrap;gap:4px 14px;margin:0; }
.ls-cart-item-variation dl.variation dt{ display:inline;font-weight:600; }
.ls-cart-item-variation dl.variation dt::after{ content:":"; }
.ls-cart-item-variation dl.variation dd{ display:inline;margin:0; }
.ls-cart-item-variation dl.variation p{ margin:0; }

.ls-cart-item-thumb{ flex-shrink:0; }
.ls-cart-item-thumb img{
  width:72px;height:72px;object-fit:cover;border-radius:12px;background:var(--gray-bg);
}

.ls-cart-item-subtotal{
  margin-top:12px;padding-left:44px;font-size:16px;font-weight:800;color:var(--text);
}

.ls-cart-update-row{ display:flex;align-items:center;gap:12px;margin:20px 0 8px; }
.ls-cart-update-btn{
  background:var(--gray-bg);color:var(--text);border-radius:30px;
  padding:10px 22px;font-size:13px;font-weight:700;
}
.ls-cart-update-btn:hover{ background:#eee; }

/* باکس کد تخفیف */
.ls-cart-coupon{
  background:var(--red-soft);border:1px solid var(--red);border-radius:var(--radius);
  padding:16px 18px;margin:20px 0 0;
}
.ls-cart-coupon-label{ display:block;font-size:13px;font-weight:700;color:var(--dark);margin-bottom:10px; }
.ls-cart-coupon-row{ display:flex;gap:10px; }
.ls-cart-coupon-input{
  flex:1;min-width:0;border:1px solid var(--red);border-radius:30px;
  padding:10px 16px;font-family:inherit;font-size:13px;background:#fff;color:var(--text);
}
.ls-cart-coupon-input::placeholder{ color:var(--muted); }
.ls-cart-coupon-input:focus{ outline:none;border-color:var(--red-dark); }
.ls-cart-coupon-btn{
  flex-shrink:0;background:var(--red-dark);color:#fff;border-radius:30px;
  padding:10px 22px;font-size:13px;font-weight:700;white-space:nowrap;
}
.ls-cart-coupon-btn:hover{ background:var(--red); }
.ls-cart-coupon .woocommerce-error,
.ls-cart-coupon .woocommerce-message{
  margin-top:10px;font-size:12px;border-radius:10px;
}

/* ردیف کد تخفیف اعمال‌شده در خلاصه مبلغ */
.ls-cart-summary-coupon .label{ color:var(--red-dark);font-weight:700; }
.ls-cart-summary-coupon .value{ color:var(--red-dark); }
.ls-cart-summary-coupon .woocommerce-remove-coupon{
  color:var(--red-dark);margin-right:6px;font-weight:800;text-decoration:none;
}
.ls-cart-summary-coupon .woocommerce-remove-coupon:hover{ color:var(--red-dark); }

/* خلاصه مبلغ */
.ls-cart-summary{
  background:var(--gray-bg);border-radius:14px;padding:18px 18px;margin:20px 0;
  font-size:13px;
}
.ls-cart-summary-row{
  display:flex;justify-content:space-between;align-items:center;
  padding:11px 0;border-bottom:1px solid #e5e5e5;font-size:13px;
}
.ls-cart-summary-row:last-of-type{ border-bottom:none; }
.ls-cart-summary-row .label{ color:var(--text); }
.ls-cart-summary-row .value{ font-weight:700; }
.ls-cart-summary-row .value .woocommerce-Price-amount{ font-size:13px; }
.ls-cart-summary-total{ border-top:1px solid #e5e5e5;border-bottom:none;padding-top:14px; }
.ls-cart-summary-total .label{ font-weight:700; }
.ls-cart-summary-total .value,
.ls-cart-summary-total .value .woocommerce-Price-amount{
  color:var(--red-dark);font-weight:800;font-size:16px;
}
.ls-cart-summary-shipping{
  display:flex;justify-content:space-between;align-items:center;
  padding:14px 0;border-bottom:1px solid #e5e5e5;font-size:14px;
}
.ls-cart-summary-shipping ul.woocommerce-shipping-methods{
  list-style:none;padding:0;margin:0;font-weight:700;
}
.ls-cart-summary-shipping ul.woocommerce-shipping-methods li{
  display:flex;justify-content:space-between;gap:10px;
}
.ls-cart-summary-shipping ul.woocommerce-shipping-methods input[type="radio"]{ display:none; }
.ls-cart-summary-shipping .woocommerce-shipping-destination{ display:none; }
.ls-cart-note{ margin-top:16px;font-size:12px;color:var(--muted);text-align:center; }

/* دکمه نهایی تایید سبد خرید */
.ls-cart-checkout-bar{ margin:10px 0 30px; }
.ls-cart-checkout-bar .wc-proceed-to-checkout{ display:block; }
.ls-cart-checkout-bar a.checkout-button,
.ls-cart-checkout-bar .checkout-button{
  display:block;width:100%;text-align:center;
  background:var(--dark)!important;color:#fff!important;
  border-radius:30px!important;padding:18px 20px!important;
  font-size:16px!important;font-weight:800!important;
}
.ls-cart-checkout-bar a.checkout-button:hover{ background:var(--dark-soft)!important; }

/* سبد خرید خالی */
.ls-cart-wrap .woocommerce-info{ justify-content:center;text-align:center; }

@media (max-width: 600px){
  .ls-cart-item-thumb img{ width:60px;height:60px; }
  .ls-cart-item-row{ padding-left:36px; }
  .ls-cart-item-subtotal{ padding-left:36px;font-size:18px; }
  .ls-cart-summary{ padding:20px 16px; }
  .ls-cart-coupon-row{ flex-direction:column; }
  .ls-cart-coupon-btn{ width:100%; }
}

/* ===================================================================
   صفحه تسویه‌حساب — طراحی اختصاصی (woocommerce/checkout/review-order.php)
   =================================================================== */
.ls-checkout-title{ font-size:28px;font-weight:800;text-align:right;margin:16px 0 40px;color:#1c1c1c; }

/* پس‌زمینه صورتی کمرنگ */
body.woocommerce-checkout{ background:var(--red-bg); }

/* چیدمان دو ستونه: فرم مشخصات خریدار (راست/بزرگ) + خلاصه سفارش (چپ/باریک) */
.ls-checkout-grid{
  display:grid;grid-template-columns:1.75fr 1fr;gap:40px;align-items:start;
}
.ls-checkout-main,.ls-checkout-sidebar{ min-width:0; }
@media (max-width: 991px){
  .ls-checkout-grid{ grid-template-columns:1fr;gap:10px; }
  .ls-checkout-sidebar{ order:2; }
  .ls-checkout-main{ order:1; }
}

/* مخفی کردن عناصر پیش‌فرض ووکامرس که در طراحی جدید استفاده نمی‌شوند */
#order_review_heading{ display:none; }
.woocommerce-shipping-fields{ display:none; }
/* این سه‌مورد (ورود قبلی، کد تخفیف، متن انگلیسی حریم خصوصی) در سایت قبلی اصلاً وجود نداشتند */
.woocommerce-form-login-toggle{ display:none; }
.woocommerce-form-coupon-toggle{ display:none; }
.woocommerce-privacy-policy-text{ display:none; }

/* فیلدهای فرم خریدار — باکس‌های بزرگ با گوشه‌ی تیز (بدون گردی)، دقیقاً مطابق سایت قبلی */
.woocommerce-billing-fields h3{
  font-size:19px;font-weight:700;margin:0 0 22px;color:#1c1c1c;
}
.woocommerce form .form-row{ margin-bottom:20px;width:100%!important;float:none!important;clear:both!important; }
.woocommerce form .form-row label{ font-size:14px;font-weight:600;margin-bottom:10px;color:#1c1c1c; }
.woocommerce form .form-row label .required{ color:var(--red); }
.woocommerce form .form-row input.input-text,
.woocommerce-checkout select{
  border:1px solid #e2e2e2;border-radius:0;padding:0 16px;font-size:14px;
  background:#fff;box-shadow:none;height:64px;box-sizing:border-box;
}
.woocommerce form .form-row textarea{
  border:1px solid #e2e2e2;border-radius:0;padding:20px 16px;font-size:14px;
  background:#fff;box-shadow:none;min-height:140px;box-sizing:border-box;
}
#order_comments{ min-height:140px; }

/* خلاصه سفارش (کارت‌های محصول) */
.ls-rev-wrap{ margin-top:0; }
.ls-rev-heading{ font-size:20px;font-weight:700;margin:0 0 24px;color:#1c1c1c; }

.ls-rev-item{
  display:flex;justify-content:space-between;gap:16px;
  padding:16px 0;border-bottom:1px solid #eee;
}
.ls-rev-item-info{ flex:1;min-width:0; }
.ls-rev-item-name{ font-size:15px;font-weight:700;margin-bottom:6px;line-height:1.3; }
.ls-rev-item-meta{ font-size:13px;color:#444;margin-bottom:6px; }
.ls-rev-item-meta .variation{ display:inline;margin:0; }
.ls-rev-item-meta dl.variation dt{ display:inline;font-weight:600; }
.ls-rev-item-meta dl.variation dt::after{ content:":"; }
.ls-rev-item-meta dl.variation dd{ display:inline;margin:0 4px 0 0; }
.ls-rev-item-price{ font-size:15px;font-weight:700; }
.ls-rev-item-thumb{ flex-shrink:0;width:25%;max-width:90px; }
.ls-rev-item-thumb img{
  width:100%;height:auto;object-fit:cover;border-radius:0;
}

.ls-rev-summary{
  background:var(--gray-bg);border-radius:0;padding:22px 20px;margin:22px 0;
}
.ls-rev-row{
  display:flex;justify-content:space-between;align-items:center;
  padding:14px 0;border-bottom:1px solid #e5e5e5;font-size:14px;
}
.ls-rev-row:last-child{ border-bottom:none; }
.ls-rev-row .label{ color:#1c1c1c; }
.ls-rev-row .value{ font-weight:700; }
.ls-rev-total{ font-size:17px; }
.ls-rev-total .label{ font-weight:800;color:var(--red-dark); }
.ls-rev-total .value{ color:var(--red-dark);font-weight:800;font-size:17px; }
.ls-rev-shipping .value ul{ list-style:none;padding:0;margin:0; }
.ls-rev-shipping .value ul,
.ls-rev-shipping .value li,
.ls-rev-shipping .value label{ display:inline; }

/* روش پرداخت و دکمه نهایی ثبت سفارش */
.woocommerce-checkout-payment{
  background:transparent;border-radius:0;padding:0;margin-top:18px;
}
.woocommerce-checkout-payment ul.payment_methods{
  list-style:none;padding:0;margin:0 0 14px;
}
.woocommerce-checkout-payment ul.payment_methods li{
  padding:10px 0;font-size:13px;
}
.woocommerce-checkout-payment .payment_box{
  background:var(--gray-bg);border-radius:0;padding:14px;margin-top:8px;font-size:12px;color:var(--muted);
}
/* اگه بیش از یک روش پرداخت (تکراری) نمایش داده بشه، فقط اولی نشون داده می‌شه */
.ls-payment-methods li.wc_payment_method ~ li.wc_payment_method{ display:none; }
/* هر دکمه/لینکی که خودِ درگاه پرداخت داخل توضیحاتش اضافه می‌کنه حذف می‌شه؛ فقط دکمه‌ی اصلی «تایید سفارش و پرداخت» می‌مونه */
.payment_box .button,
.payment_box a.button,
.payment_box button:not(#place_order){ display:none!important; }
.woocommerce-checkout-payment .place-order{ margin-top:6px; }
#place_order{
  display:block!important;width:100%;text-align:center;
  background:#16151a!important;color:#fff!important;border:none!important;
  border-radius:0!important;padding:18px 20px!important;
  font-size:16px!important;font-weight:700!important;
}
#place_order:hover{ background:#000!important; }

@media (max-width: 600px){
  .ls-rev-item-thumb img{ width:60px;height:60px; }
}

/* ===================================================================
   فرم تماس با ما — [life_sport_contact_form]
   =================================================================== */
.ls-contact-form-wrap{ max-width:900px;margin:20px 0; }
.ls-contact-notice{
  padding:14px 18px;border-radius:12px;margin-bottom:20px;font-size:14px;font-weight:600;
}
.ls-contact-notice.is-success{ background:#e8f8ee;color:#1a7a3e; }
.ls-contact-notice.is-error{ background:#fdeaea;color:#c62828; }
.ls-contact-form{ display:flex;flex-direction:column;gap:20px; }
.ls-contact-row{ display:grid;grid-template-columns:repeat(3,1fr);gap:18px; }
.ls-contact-field{ display:flex;flex-direction:column;gap:8px; }
.ls-contact-field label{ font-size:13px;font-weight:700;color:var(--text); }
.ls-contact-field input,
.ls-contact-field textarea{
  border:1px solid #ddd;border-radius:10px;padding:12px 14px;
  font-family:inherit;font-size:14px;background:#fff;resize:vertical;
}
.ls-contact-field input:focus,
.ls-contact-field textarea:focus{ outline:none;border-color:var(--red-dark); }
.ls-contact-submit{
  align-self:flex-start;background:var(--dark);color:#fff;border:none;
  border-radius:30px;padding:14px 36px;font-size:14px;font-weight:800;cursor:pointer;
}
.ls-contact-submit:hover{ background:var(--dark-soft); }
@media (max-width:700px){
  .ls-contact-row{ grid-template-columns:1fr; }
  .ls-contact-submit{ width:100%;text-align:center; }
}

/* ================= پیام‌های من (تب حساب کاربری) ================= */
.ls-my-messages{ display:flex;flex-direction:column;gap:16px; }
.ls-my-message-card{
  background:#fff;border:1px solid #eee;border-radius:var(--radius);
  padding:16px 18px;box-shadow:0 1px 4px rgba(0,0,0,.04);
}
.ls-my-message-date{ font-size:12px;color:var(--muted);margin-bottom:6px; }
.ls-my-message-subject{ font-weight:700;color:var(--text);margin-bottom:6px; }
.ls-my-message-text{ color:var(--text);line-height:1.9;margin-bottom:10px; }
.ls-my-message-reply{
  background:var(--red-soft);border:1px solid var(--red);border-radius:10px;
  padding:10px 12px;color:var(--dark);line-height:1.9;
}
.ls-my-message-pending{ color:var(--muted);font-size:13px; }









/* =======================================
   LifeSport WooCommerce Shop Final
======================================= */

.woocommerce ul.products{
    display:grid !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:30px !important;
    padding:0 !important;
    margin:40px 0 !important;
}

.woocommerce ul.products::before,
.woocommerce ul.products::after{
    display:none !important;
}

.woocommerce ul.products li.product{
    float:none !important;
    width:100% !important;
    margin:0 !important;

    background:#fff;
    border-radius:22px;
    overflow:hidden;
    box-shadow:0 10px 30px rgba(0,0,0,.08);
    transition:.3s;
    border:1px solid #eee;

    display:flex;
    flex-direction:column;
}

.woocommerce ul.products li.product:hover{
    transform:translateY(-8px);
    box-shadow:0 18px 40px rgba(0,0,0,.15);
}

.woocommerce ul.products li.product img{
    width:100% !important;
    height:350px !important;
    object-fit:cover;
    display:block;
}

.woocommerce ul.products li.product h2,
.woocommerce ul.products li.product .woocommerce-loop-product__title{
    font-size:18px;
    padding:18px 18px 10px;
    font-weight:700;
    color:#222;
    min-height:70px;
}

.woocommerce ul.products li.product .price{
    font-size:20px;
    color:var(--red);
    font-weight:800;
    padding:0 18px;
}

.woocommerce ul.products li.product .button{
    margin:20px 18px 18px;
    margin-top:auto;
    width:calc(100% - 36px);
    border-radius:50px;
    background:var(--red) !important;
    color:#fff !important;
    padding:13px 8px;
    font-size:13px;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    text-align:center;
    transition:.3s;
}

.woocommerce ul.products li.product .button:hover{
    background:#d63384 !important;
}

/* موبایل */

@media(max-width:768px){

.woocommerce ul.products{

grid-template-columns:repeat(2,1fr) !important;

gap:15px !important;

}

.woocommerce ul.products li.product img{

height:220px !important;

}

.woocommerce ul.products li.product h2,
.woocommerce ul.products li.product .woocommerce-loop-product__title{

font-size:14px;

padding:12px;

min-height:55px;

}

.woocommerce ul.products li.product .price{

font-size:16px;

padding:0 12px;

}

.woocommerce ul.products li.product .button{

margin:12px;
margin-top:auto;

width:calc(100% - 24px);

padding:10px 6px;

font-size:11px;

white-space:nowrap;

overflow:hidden;

text-overflow:ellipsis;

}

}

/* پس‌زمینه‌ی ملایم و شیک برای صفحه‌ی فروشگاه و دسته‌بندی‌های محصول */
body.woocommerce-shop,
body.tax-product_cat{
    background:var(--red-bg);
}

/* ===== Related Products Grid (کارت‌های محصول مرتبط) ===== */
.related-products-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:18px;
  margin:24px 0;
}
.related-products-grid .product_grid{
  border:1px solid #eee;
  border-radius:var(--radius);
  overflow:hidden;
  background:#fff;
  transition:box-shadow .25s ease, transform .25s ease;
}
.related-products-grid .product_grid:hover{
  box-shadow:0 8px 24px rgba(0,0,0,.08);
  transform:translateY(-3px);
}
.related-products-grid .shop_thumb{
  aspect-ratio:4/5;
  background:var(--red-bg);
}
.related-products-grid .shop_thumb .card-img-top{
  width:100%;height:100%;
}
.related-products-grid .shop_thumb img{
  width:100%;height:100%;object-fit:cover;
  transition:transform .35s ease;
}
.related-products-grid .shop_thumb:hover img{
  transform:scale(1.05);
}
.related-products-grid .product-hover-overlay{
  position:absolute;inset:0;
  background:rgba(22,21,26,.15);
  opacity:0;transition:opacity .25s ease;
}
.related-products-grid .shop_thumb:hover .product-hover-overlay{
  opacity:1;
}
.related-products-grid .group_btn{
  display:flex;gap:8px;
}
.related-products-grid .prd_btn_square{
  width:38px;height:38px;border-radius:50%;
  background:#fff;color:var(--dark);
  display:flex;align-items:center;justify-content:center;
  font-size:15px;
  transform:translateY(8px);opacity:0;
  transition:all .25s ease;
}
.related-products-grid .shop_thumb:hover .prd_btn_square{
  transform:translateY(0);opacity:1;
}
.related-products-grid .prd_btn_square:hover{
  background:var(--red);color:var(--dark);
}
.related-products-grid .card-footer{
  border:none;background:#fff;
}
.related-products-grid .card-footer h5{
  font-size:13px;font-weight:700;line-height:1.5;
  margin-bottom:6px;
  overflow:hidden;text-overflow:ellipsis;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
}
.related-products-grid .card-footer h5 a{
  color:var(--text);
}
.related-products-grid .card-footer h5 a:hover{
  color:var(--red-dark);
}
.related-products-grid .elis_rty{
  display:flex;align-items:baseline;justify-content:center;gap:4px;
}
.related-products-grid .elis_rty .theme-cl{
  color:var(--red-dark);
  font-size:14px;
  font-weight:800;
}
.related-products-grid .elis_rty small{
  color:var(--muted);
  font-size:11px;
}

/* موبایل: ۲ ستونه و شیک */
@media(max-width:600px){
  .related-products-grid{
    grid-template-columns:repeat(2,1fr);
    gap:12px;
  }
  .related-products-grid .prd_btn_square{
    width:32px;height:32px;font-size:13px;
  }
  .related-products-grid .card-footer{
    padding:10px !important;
  }
  .related-products-grid .card-footer h5{
    font-size:12px;
  }
}

/* ===================================================================
   دکمه‌ی «پیش‌نمایش سریع» (Quick View) — گوشه‌ی کارت محصول، کنار قلب
   علاقه‌مندی؛ همون آیکون ذره‌بین
   =================================================================== */
.qv-btn{
  position:absolute;top:12px;left:48px;
  width:28px;height:28px;min-width:28px;min-height:28px;
  border-radius:50%;background:#fff;border:none;cursor:pointer;
  display:flex;align-items:center;justify-content:center;padding:0;margin:0;
  box-sizing:border-box;z-index:2;
}
.woocommerce ul.products li.product .qv-btn{ top:10px;left:10px; }

/* مودال Quick View */
.qv-modal-overlay{
  position:fixed;inset:0;background:rgba(0,0,0,.55);
  display:flex;align-items:center;justify-content:center;
  z-index:9999;opacity:0;pointer-events:none;transition:opacity .2s ease;
  padding:16px;
}
.qv-modal-overlay.open{ opacity:1;pointer-events:auto; }
.qv-modal{
  background:#fff;border-radius:14px;max-width:720px;width:100%;
  max-height:90vh;overflow:auto;position:relative;padding:28px 20px 20px;
}
.qv-modal-close{
  position:absolute;top:10px;left:10px;width:32px;height:32px;
  border-radius:50%;border:none;background:#f4f5f7;font-size:20px;
  line-height:1;cursor:pointer;color:#333;
}
.qv-loading{ text-align:center;padding:40px 0;color:var(--muted); }
.qv-body{ display:flex;flex-wrap:wrap;gap:20px; }
.qv-image{ flex:1 1 240px;max-width:280px; }
.qv-image img{ width:100%;border-radius:10px;object-fit:cover; }
.qv-info{ flex:1 1 240px;min-width:200px; }
.qv-title{ font-size:18px;font-weight:800;margin-bottom:8px;line-height:1.5; }
.qv-price{ font-size:18px;font-weight:700;color:var(--red);margin-bottom:10px; }
.qv-desc{ font-size:13px;color:var(--muted);line-height:1.9;margin-bottom:14px; }
.qv-add-cart{
  display:flex;align-items:center;justify-content:center;
  width:100%;height:48px;background:#151515;color:#fff!important;
  border-radius:6px;font-size:14px;font-weight:700;text-decoration:none;
  margin-bottom:8px;
}
.qv-add-cart:hover{ background:#000;color:#fff!important; }
.qv-add-cart.added::after{ content:" ✓"; }
.qv-full-link{ display:block;text-align:center;font-size:13px;color:var(--muted);text-decoration:none; }
@media (max-width:600px){
  .qv-body{ flex-direction:column; }
  .qv-image{ max-width:100%; }
}

/* ===================================================================
   پیام‌های شناور (Toast/Snackbar) — پایین صفحه، وسط‌چین روی موبایل
   =================================================================== */
.ls-toast-container{
  position:fixed;bottom:20px;left:50%;transform:translateX(-50%);
  z-index:10000;display:flex;flex-direction:column;gap:8px;
  align-items:center;pointer-events:none;width:100%;padding:0 16px;
  box-sizing:border-box;
}
.ls-toast{
  background:#27b737;color:#fff;font-size:13px;font-weight:600;
  padding:12px 20px;border-radius:8px;box-shadow:0 6px 20px rgba(0,0,0,.18);
  opacity:0;transform:translateY(10px);transition:opacity .25s ease,transform .25s ease;
  max-width:360px;text-align:center;
}
.ls-toast.show{ opacity:1;transform:translateY(0); }
.ls-toast-error{ background:#e74c3c; }
.ls-toast-info{ background:#333; }

/* ===================================================================
   صفحه‌ی فروشگاه / آرشیو محصولات (woocommerce/archive-product.php)
   بنر عنوان + ردیف بردکرامب/فیلتر/مرتب‌سازی + پنل فیلتر + گرید محصولات
   =================================================================== */
.shop-banner{
  background:var(--gray-bg);
  padding:60px 24px;
  text-align:center;
}
.shop-banner.has-image{
  background-size:cover;background-position:center;background-repeat:no-repeat;
}
.shop-banner-inner{ max-width:1280px;margin:0 auto; }
.shop-banner h1{
  font-size:26px;font-weight:800;color:var(--dark);
}
.shop-banner.has-image h1{ color:#fff; }
.shop-banner-desc{
  margin-top:10px;font-size:13px;color:var(--muted);line-height:1.9;
  max-width:640px;margin-left:auto;margin-right:auto;
}
.shop-banner.has-image .shop-banner-desc{ color:rgba(255,255,255,.78); }

/* پیل صورتی «خانه» دقیقاً زیر عنوان فروشگاه، وسط‌چین */
.shop-home-pill-wrap{
  display:flex;justify-content:center;margin-top:14px;
}
.shop-home-pill{
  display:inline-block;
  background:var(--red);
  color:var(--dark);
  font-size:13px;font-weight:700;
  padding:8px 26px;
  border-radius:30px;
  text-decoration:none;
  transition:background .2s ease,transform .2s ease;
}
.shop-home-pill:hover{
  background:var(--red-dark);
  color:#fff;
  transform:translateY(-1px);
}

.shop-toolbar-wrap{
  border-bottom:1px solid #eee;
  overflow:hidden;
}
.shop-toolbar{
  max-width:1280px;margin:0 auto;padding:16px 24px;
  display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:14px;
}
.shop-toolbar.shop-toolbar--no-crumb{
  justify-content:flex-end;
}
.shop-toolbar.shop-toolbar--no-crumb .shop-toolbar-right{
  width:100%;
}

/* حالت جدید: ردیف فیلتر/مرتب‌سازی داخل خودِ باکس بنر فروشگاه.
   دیگه به پدینگ افقی و بردر جدا نیاز نداره چون از باکس بنر ارث می‌بره،
   فقط یه فاصله‌ی بالا از عنوان/خانه می‌گیره. */
.shop-toolbar--in-banner{
  max-width:none;padding:22px 0 0;margin:0;overflow:visible;
}

.shop-toolbar-right{
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
}
.filter-toggle-btn{
  display:flex;align-items:center;gap:8px;
  padding:9px 16px;border-radius:30px;border:1px solid var(--dark);
  background:#fff;font-size:12.5px;font-weight:600;color:var(--dark);cursor:pointer;
  transition:background .2s ease,color .2s ease;
}
.filter-toggle-btn:hover,
.filter-toggle-btn.active{ background:var(--dark);color:#fff; }

/* باکس مرتب‌سازی: از پدینگ اطراف toolbar بیرون می‌زنه تا لبه‌به‌لبه بشه،
   دقیقاً هم‌عرض باکس بنر «فروشگاه»، با گوشه‌های تیز مثل عکس محصولات */
.shop-sort{
  width:calc(100% + 48px);margin:0 -24px;
}
.shop-sort .woocommerce-ordering{
  float:none!important;margin:0!important;width:100%!important;display:block!important;
}
.shop-sort select{
  appearance:none;-webkit-appearance:none;
  width:100%;box-sizing:border-box;
  padding:14px 34px 14px 24px;border-radius:0;border:1px solid var(--dark);
  background:linear-gradient(90deg,var(--dark),var(--red-dark)) url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="10" height="6" viewBox="0 0 10 6"><path d="M1 1l4 4 4-4" stroke="%23ffffff" stroke-width="1.4" fill="none" fill-rule="evenodd"/></svg>') no-repeat left 24px center;
  font-size:12.5px;font-weight:600;color:#fff;cursor:pointer;
  font-family:inherit;text-align:center;
}
.shop-sort select:focus{ outline:none;border-color:var(--red-dark); }
.shop-sort select option{ background:#fff;color:var(--text); }

.shop-filter-panel{
  max-width:1280px;margin:0 auto;padding:0 24px;
  max-height:0;overflow:hidden;opacity:0;
  transition:max-height .3s ease,opacity .25s ease,padding .3s ease;
}
.shop-filter-panel.open{
  max-height:600px;opacity:1;padding:0 24px 22px;
}
.shop-filter-group{ margin-bottom:16px; }
.shop-filter-group h6{
  font-size:12.5px;font-weight:700;color:var(--muted);margin-bottom:10px;
}
.shop-filter-options{ display:flex;flex-wrap:wrap;gap:8px; }
.filter-pill{
  padding:6px 14px;border-radius:20px;border:1px solid #e2e2e2;
  font-size:12px;font-weight:600;color:var(--text);background:#fff;
  transition:background .2s ease,color .2s ease,border-color .2s ease;
}
.filter-pill:hover{
  background:var(--red-soft);border-color:var(--red);color:var(--red-dark);
}

.shop-products-section{ margin-top:16px; }

/* یه فاصله‌ی کوچیک بین باکس فروشگاه (بنر) و گرید محصولات، فقط روی
   کامپیوتر؛ روی گوشی/تبلت دست نخورده باقی می‌مونه. */
@media (min-width:901px){
  .shop-products-section{ margin-top:28px; }
}

/* پنل کشویی فیلتر (وقتی بازه) زیر باکس بنر */
.shop-filter-panel-wrap{ overflow:hidden; }
.shop-grid{ grid-template-columns:repeat(4,1fr); }
.shop-grid .product-card{ border-radius:0;border:none; }
.shop-empty{
  text-align:center;padding:60px 20px;color:var(--muted);font-size:14px;
}

/* ===================================================================
   کارت محصول فروشگاه — عیناً مطابق نمونه: عکس بزرگ‌تر، گوشه بالا نشان
   تخفیف، و روی هاور دو دکمه مربعی سفید (مشاهده سریع/علاقه‌مندی) وسط
   پایین عکس ظاهر می‌شن. این استایل فقط مخصوص گرید فروشگاهه، جای دیگه
   سایت (اسلایدر صفحه اصلی و...) دست نخورده باقی می‌مونه.
   =================================================================== */
.shop-grid .product-img-wrap{ position:relative;overflow:hidden; }
.shop-grid .product-img-wrap img{
  width:100%;height:340px;object-fit:cover;
  transition:transform .45s ease;
}
.shop-grid .product-card:hover .product-img-wrap img{ transform:scale(1.05); }
.shop-grid .shop-hover-overlay{
  position:absolute;left:0;bottom:0;width:100%;z-index:5;
  display:flex;align-items:center;justify-content:center;gap:8px;
  padding:16px 10px;
  opacity:0;visibility:hidden;transform:translateY(16px);
  transition:opacity .3s ease,transform .3s ease,visibility .3s;
}
.shop-grid .product-card:hover .shop-hover-overlay{
  opacity:1;visibility:visible;transform:translateY(0);
}
.shop-grid .shop-sq-btn{
  width:44px;height:42px;border:none;border-radius:4px;background:#fff;
  display:flex;align-items:center;justify-content:center;cursor:pointer;
  color:#151515;box-shadow:0 6px 16px rgba(0,0,0,.2);
  transition:background .3s ease,color .3s ease;padding:0;
}
.shop-grid .shop-sq-btn:hover{ background:var(--dark);color:#fff; }
.shop-grid .shop-sq-btn svg{ display:block; }
.shop-grid .shop-sq-btn.wishlist-toggle svg{ fill:none;stroke:#151515;transition:fill .2s,stroke .2s; }
.shop-grid .shop-sq-btn.wishlist-toggle:hover svg{ stroke:#fff; }
.shop-grid .shop-sq-btn.wishlist-toggle.active svg{ fill:var(--red);stroke:var(--red); }
.shop-grid .shop-sq-btn.wishlist-toggle.active:hover svg{ fill:#fff;stroke:#fff; }
.shop-grid .product-info{ text-align:center;padding:16px 14px; }
.shop-grid .product-info .name{ margin-bottom:8px; }
.shop-grid .price{ font-size:15px; }
@media(max-width:600px){
  .shop-grid .product-img-wrap img{ height:220px; }
  .shop-grid .shop-sq-btn{ width:38px;height:36px; }
}

.shop-pagination{
  display:flex;justify-content:center;margin-top:36px;
}
.shop-pagination .page-numbers{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:38px;height:38px;margin:0 3px;padding:0 8px;
  border-radius:8px;border:1px solid #eee;font-size:13px;font-weight:600;
  color:var(--text);
}
.shop-pagination .page-numbers.current,
.shop-pagination .page-numbers:hover{
  background:var(--dark);color:#fff;border-color:var(--dark);
}
.shop-pagination .page-numbers.dots{ border:none;background:none; }

@media(max-width:900px){
  .shop-grid{ grid-template-columns:repeat(3,1fr); }
}
@media(max-width:600px){
  .shop-banner{ padding:30px 16px; }
  .shop-banner h1{ font-size:20px; }
  .shop-toolbar{ padding:14px 16px; }
  .shop-toolbar--in-banner{ padding:18px 0 0; }
  .shop-sort{ width:calc(100% + 32px);margin:0 -16px; }
  .shop-sort select{ padding:14px 24px 14px 16px;background-position:left 16px center; }
  .shop-filter-panel{ padding-left:16px;padding-right:16px; }
  .shop-filter-panel.open{ padding:0 16px 18px; }
  .shop-grid{ grid-template-columns:repeat(2,1fr); }
}

/* ===================================================================
   دکمه برو بالا (Back to Top) — گوشه پایین‌راست، بعد از اسکرول ظاهر می‌شه
   =================================================================== */
.back-to-top{
  position:fixed;bottom:24px;right:20px;z-index:9999;
  width:44px;height:44px;border-radius:50%;border:none;
  background:var(--dark);color:#fff;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 6px 18px rgba(0,0,0,.22);cursor:pointer;
  opacity:0;visibility:hidden;transform:translateY(12px);
  transition:opacity .25s ease,transform .25s ease,visibility .25s,background .2s ease;
}
.back-to-top.show{ opacity:1;visibility:visible;transform:translateY(0); }
.back-to-top:hover{ background:var(--red-dark); }
.back-to-top svg{ width:20px;height:20px; }
@media (max-width:600px){
  .back-to-top{ bottom:18px;right:14px;width:40px;height:40px; }
}

/* ===================================================================
   نوار ابزار پایین صفحه (خانه / فروشگاه / پیگیری سفارشات / روبیکا) —
   پس‌زمینه مشکی با متن و آیکون قرمز؛ فقط روی موبایل نمایش داده می‌شه.
   =================================================================== */
.ls-toolbar{
  display:none;
}
@media (max-width:900px){
  .ls-toolbar{
    display:flex;align-items:stretch;
    position:fixed;bottom:0;right:0;left:0;z-index:190;
    background:var(--dark);border-top:1px solid #000;
    box-shadow:0 -2px 14px rgba(0,0,0,.35);
    padding-bottom:env(safe-area-inset-bottom,0);
  }
  .ls-toolbar-item{
    flex:1 1 0;display:flex;flex-direction:column;align-items:center;justify-content:center;
    gap:3px;padding:9px 4px 8px;color:rgba(224,36,47,.75);text-decoration:none;
  }
  .ls-toolbar-icon{ display:flex;align-items:center;justify-content:center;width:22px;height:22px; }
  .ls-toolbar-icon img{ width:22px;height:22px;object-fit:contain;border-radius:50%; }
  .ls-toolbar-label{ font-size:10.5px;font-weight:600;line-height:1; }
  .ls-toolbar-item.is-active{ color:var(--red);font-weight:800; }

  /* دکمه برو بالا باید بالاتر از نوار پایین بشینه تا روش نیفته */
  .back-to-top{ bottom:76px; }
  /* فضای خالی ته صفحه به اندازه ارتفاع نوار، تا محتوای فوتر زیرش قایم نشه */
  body{ padding-bottom:64px; }
}

/* =======================================================================
   باکس قرمز «جدیدترین محصولات» — اسکرول افقی، دقیقاً هم‌اندازه با نمونه‌ی
   مرجع کاربر: تصویر محصول ۱۱۴×۱۱۴، عرض کارت ۱۳۰px، گرادیان قرمز پس‌زمینه،
   بج درصد تخفیف، و کارت «مشاهده همه» ته اسکرول.
   ======================================================================= */
.pns-box{
  background:linear-gradient(225deg, rgb(210,44,78) 0%, rgb(238,56,78) 100%);
  padding:20px 0 16px;
  margin:24px 0;
  border-radius:var(--radius);
  direction:rtl;
  overflow:hidden;
}
.pns-box *{ box-sizing:border-box; }
.pns-header{
  display:flex;align-items:center;justify-content:space-between;
  padding:0 16px 12px;
}
.pns-title{ color:#fff;font-weight:800;font-size:20px;line-height:24px;margin:0; }
.pns-viewall{
  display:flex;align-items:center;gap:2px;
  color:#fff;font-size:13px;font-weight:600;text-decoration:none;white-space:nowrap;
}
.pns-viewall:hover{ opacity:.85; }
.pns-chevron{ width:18px;height:18px; }
.pns-scroll{
  display:flex;overflow-x:auto;overflow-y:hidden;gap:6px;padding:0 16px;
  scrollbar-width:none;-ms-overflow-style:none;
}
.pns-scroll::-webkit-scrollbar{ display:none; }
.pns-card{
  min-width:130px;max-width:130px;flex:0 0 auto;
  display:flex;flex-direction:column;justify-content:space-between;
  background:#fff;padding:8px;border-radius:10px;text-decoration:none;
}
.pns-imgwrap{ width:114px;height:114px;border-radius:8px;overflow:hidden;background:#f7f7f7; }
.pns-imgwrap img{ width:100%;height:100%;object-fit:contain;display:block; }
.pns-info{ display:flex;flex-direction:column;gap:8px;margin-top:8px; }
.pns-name{
  color:#6b6b6b;font-size:12.5px;line-height:1.5;height:38px;overflow:hidden;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;margin:0;
}
.pns-pricebox{ display:flex;flex-direction:column;gap:2px; }
.pns-pricerow{ display:flex;align-items:center;gap:4px;flex-wrap:wrap; }
.pns-discount{
  background:#ee3849;color:#fff;font-size:11px;font-weight:700;
  border-radius:10px;padding:1px 5px;line-height:16px;white-space:nowrap;
}
.pns-oldprice{ color:#c9a3a8;font-size:11px; }
.pns-oldprice .woocommerce-Price-amount{ text-decoration:line-through; }
.pns-finalprice{ color:#262626;font-size:15px;font-weight:700; }
.pns-finalprice .woocommerce-Price-currencySymbol{ font-size:11px;font-weight:400;margin-right:2px; }
.pns-endcard{
  min-width:110px;flex:0 0 auto;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  background:#fff;border-radius:10px;text-decoration:none;gap:8px;padding:8px;
}
.pns-endcard-circle{
  width:40px;height:40px;border-radius:50%;border:2px solid #262626;
  display:flex;align-items:center;justify-content:center;
}
.pns-endcard .pns-arrow{ width:20px;height:20px;color:#262626; }
.pns-endcard span{ color:#333;font-size:12px;font-weight:600; }
.pns-empty{ color:#fff;padding:0 16px;font-size:14px; }
@media (min-width:1024px){
  .pns-card{ min-width:150px;max-width:150px; }
}
