/* ==========================================================================
   إصلاحات الموبايل — WAW Store
   ========================================================================== */

/* --------------------------------------------------------------------------
   منع الزوم التلقائي في آيفون
   ---------------------------------------------------------------------------
   سفاري على iOS بيعمل زوم للصفحة تلقائيًا أول ما المستخدم يدوس على خانة
   حجم خطها أقل من 16px — الصفحة بتنطّ والعميل بيتوه، وأخطرها في الشيكاوت.
   16px هو الحد الأدنى اللي بيمنع ده.
   -------------------------------------------------------------------------- */
@media (max-width: 820px) {
  input[type="text"],
  input[type="tel"],
  input[type="email"],
  input[type="number"],
  input[type="search"],
  input[type="password"],
  input[type="url"],
  input:not([type]),
  select,
  textarea {
    font-size: 16px !important;
  }
}

/* --------------------------------------------------------------------------
   مساحات لمس أكبر
   ---------------------------------------------------------------------------
   الشرايح الصغيرة (نطاق السعر، الفلاتر) كانت 28px وده صعب على الصباع.
   -------------------------------------------------------------------------- */
@media (max-width: 820px) {
  .price-range-chip,
  .filter-chip,
  .cat-filter-item,
  .color-swatch-btn {
    min-height: 40px;
  }
  .price-range-chip,
  .filter-chip {
    padding-block: 9px;
  }

  /* دواير الألوان كانت 32px عرض — الصباع محتاج 36 على الأقل */
  .color-swatch-btn {
    min-width: 40px;
  }

  /* أزرار نطاق السعر كانت 28px ارتفاع، والحشو مكتوب inline فمحتاج !important */
  .price-chip {
    min-height: 40px !important;
    padding-block: 10px !important;
    font-size: 0.85rem !important;
  }

  /* ليبل «المتوفر بالمخزون»: مساحة اللمس كانت 23px، والمربع نفسه 16px */
  .stock-filter-label {
    min-height: 40px;
    align-items: center;
  }
  .stock-filter-label input[type="checkbox"] {
    width: 22px !important;
    height: 22px !important;
    flex: 0 0 auto;
  }
}

/* --------------------------------------------------------------------------
   شريط التنقل السفلي مايغطّيش آخر المحتوى
   -------------------------------------------------------------------------- */
@media (max-width: 820px) {
  body { padding-bottom: env(safe-area-inset-bottom); }
}

/* --------------------------------------------------------------------------
   مراجعة الاستجابة (موبايل/تابلت): مساحات لمس 40px تقريبًا + نصوص مقروءة
   -------------------------------------------------------------------------- */
@media (max-width: 900px) {
  footer a { display: inline-block; padding-block: 10px; }
  .breadcrumbs a { display: inline-block; padding-block: 10px; }
  .hero-actions .text-link,
  .back-link,
  .rate-row,
  .auth-header a,
  .auth-footer a { display: inline-flex; align-items: center; min-height: 40px; }
  .quantity-control button { min-width: 40px; min-height: 40px; }
  .waw-inline-qty button { min-width: 36px; min-height: 36px; }
  .waw-remove { min-height: 36px; padding-inline: 10px; }
  .payment-radio,
  input[type="checkbox"][name="save_new_address"] { width: 22px; height: 22px; }
  /* نقط السلايدر صغيرة بصريًا (9px) لكن منطقة الضغط أوسع */
  header nav a,
  .logged-in-notice a,
  .primary-link { display: inline-flex; align-items: center; min-height: 40px; }
  .product-title { display: inline-block; padding-block: 6px; }
  .waw-slider-dot { position: relative; }
  .waw-slider-dot::after { content: ''; position: absolute; inset: -12px; }
}

/* نصوص كانت 9–10px: أقل حجم مقروء 11px */
.product-tag { font-size: 11px !important; }
.stock-line { font-size: 11.5px !important; }
.product-variants span { font-size: 12px; }
.waw-mobile-nav a span { font-size: 11px !important; }
small { font-size: max(11.5px, 0.75em) !important; }
.has-items { font-size: 11px !important; }
/* --------------------------------------------------------------------------
   الهيدر على الموبايل: الأزرار ما تتزاحمش، وشريط العروض رسالة واحدة واضحة
   -------------------------------------------------------------------------- */
@media (max-width: 900px) {
  /* «حسابي» موجود في الشريط السفلي، فشلناه من الهيدر عشان البحث والسلة والقايمة ياخدوا مساحتهم */
  .header-actions .account-nav-btn { display: none !important; }
  .header-actions { gap: 8px !important; }
}