/* =============================================================
   DIGISVG — حالت نمایش اتوماتیک/واکنش‌گرا (Fluid 100%)
   عرض درصدی/اتومات برای کل سایت، بدون اسکرول افقی،
   با حفظ کانتینر مرکزی. روی همهٔ صفحات اعمال می‌شود.
   ============================================================= */

/* جعبه‌بندی یکنواخت */
*, *::before, *::after { box-sizing: border-box; }

/* جلوگیری از اسکرول افقی و سرریز عرض */
html, body {
  max-width: 100%;
  overflow-x: hidden;
}

/* رسانه‌ها همیشه داخل ظرف خود جا شوند */
img, svg, video, canvas, audio, iframe, embed, object {
  max-width: 100%;
  height: auto;
}
iframe { width: 100%; }

/* کانتینر مرکزی: وسط‌چین با حداکثر عرض، و کاملاً واکنش‌گرا زیر آن */
.container,
.site-container,
.content-container,
.elementor-section-boxed > .elementor-container {
  width: 100%;
  max-width: 1400px;   /* عرض کانتینر مرکزی — قابل تنظیم */
  margin-left: auto;
  margin-right: auto;
  padding-left: 16px;
  padding-right: 16px;
}

/* بخش‌های تمام‌عرض (لبه‌تا‌لبه) باید ۱۰۰٪ بمانند؛ فقط محتوای داخلی‌شان وسط‌چین شود */
.slider-section, .hero-slider, .special-section, .under-slider-section,
.full-bleed, .alignfull {
  width: 100%;
  max-width: 100%;
}

/* عناصر بلوکی سایت عرض کامل بگیرند (اتومات) */
.site-main,
.main-content,
.page-content,
.entry-content,
.post-content,
.woocommerce,
.woocommerce-page {
  width: 100%;
  max-width: 100%;
}

/* محتوای نوشته/برگه: رسانه و جدول واکنش‌گرا */
.entry-content img,
.post-content img,
.page-content img { height: auto; }

/* جدول‌ها: اسکرول نرم داخل خودشان به‌جای شکستن صفحه */
.entry-content table,
.post-content table,
.woocommerce table.shop_table {
  width: 100%;
  display: block;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  border-collapse: collapse;
}

/* فرم‌ها و ورودی‌ها هرگز از ظرف بیرون نزنند */
input, select, textarea, button {
  max-width: 100%;
}
input[type="text"], input[type="email"], input[type="tel"],
input[type="password"], input[type="search"], input[type="number"],
select, textarea {
  width: 100%;
}

/* پیش‌فرمت‌ها و کدها نشکنند */
pre { white-space: pre-wrap; word-wrap: break-word; max-width: 100%; overflow-x: auto; }

/* شبکهٔ محصولات ووکامرس: کاملاً درصدی و واکنش‌گرا */
.woocommerce ul.products,
.woocommerce-page ul.products,
.shop-content ul.products {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 16px !important;
  width: 100%;
  margin: 0 !important;
  padding: 0 !important;
}
.woocommerce ul.products li.product,
.shop-content ul.products li.product {
  width: 100% !important;
  float: none !important;
  margin: 0 !important;
}

/* چیدمان فروشگاه (سایدبار + محتوا) درصدی */
.shop-layout { display: flex; flex-wrap: wrap; width: 100%; }
.shop-sidebar { flex: 0 0 clamp(240px, 24%, 300px); max-width: 300px; }
.shop-content { flex: 1 1 0; min-width: 0; } /* min-width:0 مانع سرریز grid داخل flex */

/* ردیف‌ها/ستون‌های عمومی قالب واکنش‌گرا */
.row { display: flex; flex-wrap: wrap; width: 100%; }
[class*="col-"] { min-width: 0; }

/* ===================== بریک‌پوینت‌ها ===================== */

/* دسکتاپ کوچک / تبلت افقی */
@media (max-width: 1024px) {
  .woocommerce ul.products,
  .shop-content ul.products {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

/* تبلت */
@media (max-width: 900px) {
  .shop-layout { flex-direction: column; }
  .shop-sidebar { flex: 1 1 100%; max-width: 100%; width: 100%; }
  .shop-content { flex: 1 1 100%; width: 100%; }
}

/* موبایل بزرگ */
@media (max-width: 768px) {
  .woocommerce ul.products,
  .shop-content ul.products {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 12px !important;
  }
  /* هر چیدمان flex/grid دوستونه روی موبایل تک/دوستون شود */
  .row { gap: 12px; }
}

/* موبایل کوچک */
@media (max-width: 480px) {
  .woocommerce ul.products,
  .shop-content ul.products {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 8px !important;
  }
  .container { padding-left: 12px; padding-right: 12px; }
}

/* موبایل خیلی کوچک: در صورت نیاز تک‌ستونه */
@media (max-width: 360px) {
  .woocommerce ul.products,
  .shop-content ul.products {
    grid-template-columns: 1fr !important;
  }
}

/* تصاویر پس‌زمینهٔ تمام‌عرض هم واکنش‌گرا بمانند */
.full-bleed, .fullwidth, .alignfull {
  width: 100%;
  max-width: 100%;
}