/* ===================================================
   MOBILE FIXES — applied site-wide
   =================================================== */

/* Prevent horizontal scroll on any breakpoint */
html, body { overflow-x: hidden; }
* { box-sizing: border-box; }

/* iOS safe-area + smooth scroll */
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }

/* ===================================================
   PHONE (≤640px)
   =================================================== */
@media (max-width: 640px) {

    /* Section padding — was 4rem 2rem (cramped) */
    .lh-section { padding: 2.5rem 1rem !important; }

    /* Hero — was 3rem 2rem with min-height 500px */
    .lh-hero { min-height: auto !important; }
    .lh-hero-content { padding: 2rem 1.25rem !important; }
    .lh-hero-image { min-height: 240px !important; }

    /* Section title smaller on phone */
    .lh-section-title { font-size: 1.625rem !important; line-height: 1.2 !important; }

    /* Hero / Cat content text wrap fix */
    .lh-cat-info { padding: 1rem !important; }

    /* Stats — wrap instead of overflow */
    .lh-stats { flex-wrap: wrap !important; gap: 1rem 1.5rem !important; }
    .lh-stat-number { font-size: 1.5rem !important; }

    /* Newsletter form — vertical stack on phone */
    .lh-newsletter-form { flex-direction: column !important; gap: .5rem !important; max-width: 100% !important; padding: 0 1rem !important; }
    .lh-newsletter-input { width: 100% !important; }
    .lh-newsletter-btn { width: 100% !important; padding: .875rem 1.5rem !important; }

    /* Press logos — allow wrap */
    .lh-featured-bar { flex-wrap: wrap !important; gap: 1rem !important; padding: 0 1rem !important; row-gap: .75rem !important; }

    /* Footer — tighter padding */
    .lh-footer-grid { padding: 2.5rem 1.25rem !important; gap: 1.75rem !important; }
    .lh-footer-bottom { padding: 1rem 1.25rem !important; }

    /* Etsy reviews padding */
    .lh-etsy-reviews { padding: 2.5rem 1rem !important; }
    .lh-review-item { padding: 1.25rem !important; }
    .lh-section-desc { font-size: 13px !important; padding: 0 .5rem; }

    /* Touch target minimum 44px */
    .lh-btn, .lh-btn-outline, .primary-button, .secondary-button { min-height: 44px !important; display: inline-flex; align-items: center; justify-content: center; }
    a, button { -webkit-tap-highlight-color: rgba(179,155,125,.2); }

    /* Product page tweaks */
    .lhp-trust-strip { gap: .5rem !important; padding: .75rem !important; }
    .lhp-trust-item { font-size: 12px !important; }

    /* Checkout form — single col, larger inputs */
    .lhc-row { grid-template-columns: 1fr !important; gap: .75rem !important; }
    .lhc-input { font-size: 16px !important; /* prevents iOS zoom on focus */ padding: .75rem .9rem !important; min-height: 44px !important; }
    .lhc-card { padding: 1rem !important; margin-bottom: .75rem !important; }
    .lhc-card-title { font-size: .95rem !important; }

    /* Add bottom padding so sticky mobile bar doesn't cover content */
    body.has-mobile-bar { padding-bottom: 80px !important; }

    /* Modal / drawer — max height fix iOS */
    [class*="fixed"][class*="inset-0"] { max-height: 100dvh !important; }

    /* Configurable selector dropdowns */
    .lhp-select-btn { min-height: 44px !important; padding: 0 .9rem !important; }
    .lhp-size-pill, .lhp-color-swatch, .lhp-color-swatch-img { min-height: 36px !important; min-width: 36px !important; }

    /* Cart item row */
    .checkout .item-quantity, .qty-changer button { min-width: 32px !important; min-height: 32px !important; }

    /* Reviews grid: stack */
    .lh-testimonials-grid { grid-template-columns: 1fr !important; }
    .lh-reviews-grid { grid-template-columns: 1fr !important; }
    .lh-review-text { font-size: 13.5px !important; }

    /* Wellness section image */
    .lh-wellness-img img { height: 280px !important; }

    /* Announcement bar — single line, smaller */
    .lh-announcement-bar { font-size: 10.5px !important; padding: .5rem .5rem !important; letter-spacing: .08em !important; }
    .lh-announcement-inner { gap: .5rem !important; flex-wrap: nowrap !important; }
    .lh-announcement-sep { display: none !important; }

    /* Promo bar */
    .lh-promo p { font-size: 10px !important; letter-spacing: .1em !important; }
}

/* ===================================================
   TABLET (641–1023px)
   =================================================== */
@media (min-width: 641px) and (max-width: 1023px) {
    .lh-section { padding: 3rem 1.5rem !important; }
    .lh-newsletter-form { gap: .5rem !important; }
    .lh-products-grid { grid-template-columns: repeat(3, 1fr) !important; }
}

/* ===================================================
   ALL MOBILE/TABLET — accessibility
   =================================================== */
@media (max-width: 1023px) {
    /* Mobile drawer must not block scroll on body */
    body.drawer-open { overflow: hidden !important; position: fixed; width: 100%; }
    /* Larger hit areas for header icons */
    .icon-cart, .icon-users, .icon-search, .icon-menu { font-size: 1.5rem !important; padding: 6px; }
}
