/* ============================================================
   Liyaas – responsive.css
   Flux/Fuel theme mobile-first breakpoint overrides
   ============================================================ */

/* ─── 990px – Tablet Landscape ─────────────────────────────── */
@media (max-width: 990px) {
  :root {
    --section-gap: 48px;
    --grid-gap: 16px;
  }

  .container, .container-wide { padding: 0 20px; }

  .grid-4 { grid-template-columns: repeat(2, 1fr); }
  .grid-3 { grid-template-columns: repeat(2, 1fr); }

  /* Shop */
  .shop-wrap,
  .shop-layout,
  .shop-container { grid-template-columns: 220px 1fr; gap: 24px; }

  .products-grid,
  .product-grid { grid-template-columns: repeat(2, 1fr); }
}

/* ─── 768px – Tablet Portrait ──────────────────────────────── */
@media (max-width: 768px) {
  :root {
    --section-gap: var(--section-gap-mobile);
    --grid-gap:    var(--grid-gap-mobile);
    --nav-h:       56px;
  }

  .container, .container-wide { padding: 0 16px; }

  /* Typography */
  h1, .h1 { font-size: clamp(1.75rem, 7vw, 2.25rem); }
  h2, .h2 { font-size: clamp(1.375rem, 5vw, 1.75rem); }
  h3, .h3 { font-size: 1.2rem; }

  /* Grids */
  .grid-2, .grid-3, .grid-4 { grid-template-columns: 1fr; }
  .form-row { grid-template-columns: 1fr; }

  /* Section */
  .section    { padding: var(--section-gap-mobile) 0; }
  .section-lg { padding: calc(var(--section-gap-mobile) * 1.4) 0; }
  .section-header { margin-bottom: var(--sp-8); }

  /* Product grid */
  .products-grid,
  .product-grid { grid-template-columns: repeat(2, 1fr); gap: var(--grid-gap-mobile); }

  /* Shop two-col → single col */
  .shop-wrap,
  .shop-layout,
  .shop-container { grid-template-columns: 1fr; padding: 12px 16px 0; gap: 0; }

  /* Filter becomes slide-up drawer — handled in shop.css */

  /* Product detail */
  .product-layout { grid-template-columns: 1fr; gap: 24px; }
  .product-gallery { position: static; }
  .product-name, .product-title { font-size: 1.375rem; }
  .product-actions-row { flex-wrap: wrap; }

  /* Reviews */
  .reviews-layout { grid-template-columns: 1fr; gap: 28px; }
  .rating-summary { position: static; }

  /* Also bought */
  .also-bought-grid { grid-template-columns: repeat(2, 1fr); }
  .related-grid { grid-template-columns: repeat(2, 1fr); gap: var(--grid-gap-mobile); }

  /* Gallery thumbs */
  .gallery-thumbs { flex-wrap: nowrap; }
  .gallery-thumb  { flex-shrink: 0; }
  .model-swatches { max-height: none; }

  /* Trust strip */
  .trust-items { gap: 20px; justify-content: flex-start; }

  /* Footer */
  .footer-grid  { grid-template-columns: 1fr 1fr; gap: var(--sp-8); }
  .footer-bottom { flex-direction: column; text-align: center; gap: var(--sp-4); }

  /* Auth */
  .auth-card { max-width: 100%; margin: 0 16px; }

  /* Modal */
  .modal-backdrop { padding: 0; align-items: flex-end; }
  .modal { border-radius: 16px 16px 0 0; max-height: 92vh; max-width: 100%; }

  /* Checkout */
  .checkout-grid { grid-template-columns: 1fr; }

  /* Cart page */
  .cart-layout { grid-template-columns: 1fr; gap: 24px; }
  .cart-item-img { width: 80px; height: 80px; }

  /* Order detail */
  .order-detail-grid { grid-template-columns: 1fr; }

  /* Account */
  .account-layout  { grid-template-columns: 1fr; }
  .account-sidebar { display: none; }

  /* Sticky add-to-cart */
  .sticky-add-to-cart { display: flex; }

  /* Mobile filter toggle */
  .filter-mobile-btn,
  .filter-toggle-btn { display: flex; }

  /* Tables */
  .table th:nth-child(n+4),
  .table td:nth-child(n+4) { display: none; }

  /* Pagination */
  .pagination { gap: 4px; }
  .page-btn   { width: 34px; height: 34px; font-size: 0.813rem; }
}

/* ─── 480px – Mobile ─────────────────────────────────────────  */
@media (max-width: 480px) {
  :root {
    --section-gap:        var(--section-gap-mobile);
    --section-gap-mobile: 36px;
  }

  .container, .container-wide { padding: 0 14px; }

  /* Typography */
  h1, .h1 { font-size: 1.625rem; }
  h2, .h2 { font-size: 1.25rem; }

  /* Buttons */
  .btn-xl { height: 52px; font-size: 0.813rem; }
  .btn-lg { height: 48px; padding: 0 22px; }
  .btn-block-mobile { width: 100%; }

  /* Hero */
  .hero__title { font-size: clamp(1.75rem, 8vw, 2.5rem); }
  .hero__cta   { flex-direction: column; align-items: center; }
  .hero__cta .btn { width: 100%; max-width: 300px; }

  /* Product grids – 2 col with tight gap */
  .featured-grid,
  .products-grid,
  .product-grid,
  .related-grid { grid-template-columns: repeat(2, 1fr); gap: var(--grid-gap-mobile); }

  /* Product card compact */
  .card-info,
  .product-card__body { padding: 8px 2px 2px; }
  .card-title,
  .product-card__name { font-size: 0.813rem; }
  .btn-add-card,
  .product-card__quick-add { font-size: 0.663rem; height: 34px; }

  /* Model selector */
  .model-pill { padding: 6px 12px; font-size: 0.763rem; }

  /* Cart sidebar */
  .cart-item__img { width: 60px; height: 60px; }

  /* Trust badges */
  .trust-item { flex-direction: column; text-align: center; gap: 6px; }
  .trust-items { gap: 16px; }

  /* Shop page */
  .shop-wrap,
  .shop-layout,
  .shop-container { padding: 10px 14px 0; }

  /* Newsletter */
  .newsletter-form { padding: 0; flex-direction: column; }
  .newsletter-btn  { width: 100%; }

  /* Toast */
  #toast-container { bottom: 14px; right: 14px; left: 14px; max-width: 100%; }

  /* Combo */
  .also-bought-actions { flex-direction: column; gap: 10px; text-align: center; }

  /* Gallery */
  .gallery-thumb { width: 58px; height: 58px; }
  .gallery-ta    { height: 58px; width: 22px; }

  /* Pincode */
  .pincode-form { flex-wrap: wrap; }
  .pincode-btn  { flex: 1; }

  /* Footer */
  .footer-grid { grid-template-columns: 1fr; }

  /* Cart page mobile */
  .cart-item-row { flex-wrap: wrap; }
  .cart-item-img { width: 70px; height: 70px; }
  .cart-item-qty-col { width: 100%; justify-content: flex-start; gap: 12px; margin-top: 4px; }

  /* Checkout steps */
  .checkout-steps .step-label { display: none; }

  /* Success page */
  .success-actions { flex-direction: column; }
  .success-actions .btn { width: 100%; }

  /* Table on mobile */
  .table th:nth-child(n+3),
  .table td:nth-child(n+3) { display: none; }

  /* Admin */
  .admin-content { padding: 12px; }
  .admin-page-header { flex-direction: column; align-items: flex-start; }
}

/* ── Print ──────────────────────────────────────────────────── */
@media print {
  .site-header,
  .cart-sidebar,
  .mobile-drawer,
  .search-overlay,
  #toast-container,
  .sticky-add-to-cart,
  #scrollProgress,
  #backToTop,
  footer { display: none !important; }

  body { font-size: 12pt; color: #000; }
  a::after { content: ' (' attr(href) ')'; font-size: 9pt; color: #666; }
  .product-layout { grid-template-columns: 1fr; }
}