/* ==========================================================================
   LetsShop — Responsive Rules
   ========================================================================== */

/* ---------- Large tablets / small desktops ---------- */
@media (max-width: 1199.98px) {
  .hero { padding: 4.5rem 0 5rem; }
  .basket-card { max-width: 300px; }
}

/* ---------- Tablets ---------- */
@media (max-width: 991.98px) {
  section { padding: 3.4rem 0; }
  .hero { padding: 3.2rem 0 4rem; text-align: center; }
  .hero p.lead { margin-left: auto; margin-right: auto; }
  .hero-stats { justify-content: center; }
  .hero-visual { margin-top: 2.6rem; }
  .basket-card { margin: 0 auto; transform: rotate(0); }
  .auth-side { display: none; }
  .summary-card { position: static; margin-top: 1.6rem; }
  .profile-sidebar { margin-bottom: 1.6rem; }
  .cta-band { text-align: center; }
  .cta-band .cta-btn-wrap { margin-top: 1.4rem; justify-content: center; display: flex; }
}

/* ---------- Small tablets / large phones ---------- */
@media (max-width: 767.98px) {
  .ls-navbar .navbar-brand { font-size: 1.25rem; }
  .hero h1 { font-size: clamp(1.9rem, 7vw, 2.6rem); }
  .hero-stats { gap: 1.4rem; flex-wrap: wrap; }
  .section-head { text-align: center; margin-bottom: 1.8rem; }
  .section-head p { margin-left: auto; margin-right: auto; }
  .checkout-steps { flex-wrap: wrap; row-gap: 1rem; }
  .checkout-step { padding: 0 0.8rem; }
  .checkout-step:not(:last-child)::after { width: 20px; }
  .cart-line { flex-wrap: wrap; }
  .cart-line .cart-line-actions { width: 100%; justify-content: space-between; display: flex; margin-top: 0.6rem; }
  .filter-panel { margin-bottom: 1.4rem; }
  .back-to-top { bottom: 16px; right: 16px; width: 42px; height: 42px; }
  .floating-chip { display: none; }
}

/* ---------- Phones ---------- */
@media (max-width: 575.98px) {
  .hero { padding: 2.4rem 0 3rem; }
  .hero .eyebrow-pill { font-size: 0.72rem; }
  .hero-stats { gap: 1.1rem; }
  .hero-stats .stat-num { font-size: 1.3rem; }
  .btn { padding: 0.62rem 1.3rem; font-size: 0.92rem; }
  .feature-card, .store-card, .testimonial-card { padding: 1.4rem 1.2rem; }
  .cta-band { padding: 2.2rem 1.4rem; }
  .auth-form-wrap { padding: 1.6rem 1rem; }
  .profile-header-block { padding: 1.6rem 1rem; }
  .order-progress .op-label { display: none; }
  .search-bar-wrap { padding: 0.3rem 0.3rem 0.3rem 0.9rem; }
  .product-name { font-size: 0.88rem; }
  .product-price { font-size: 1.02rem; }
  .category-tile { padding: 1.1rem 0.6rem; }
  .category-tile .cat-icon { width: 46px; height: 46px; font-size: 1.15rem; }
  .step-num { width: 30px; height: 30px; font-size: 0.9rem; }
}

/* ---------- Bottom mobile nav (app-like) ---------- */
.mobile-tabbar {
  display: none;
}
@media (max-width: 767.98px) {
  .mobile-tabbar {
    display: flex;
    position: fixed;
    bottom: 0; left: 0; right: 0;
    background: var(--ls-white);
    box-shadow: 0 -4px 18px rgba(13,42,74,0.1);
    z-index: 1035;
    padding: 0.5rem 0.4rem calc(0.5rem + env(safe-area-inset-bottom));
  }
  .mobile-tabbar a {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
    color: var(--ls-gray-500);
    font-size: 0.66rem;
    font-weight: 700;
    position: relative;
  }
  .mobile-tabbar a i { font-size: 1.15rem; }
  .mobile-tabbar a.active { color: var(--ls-orange); }
  .mobile-tabbar a .tab-badge {
    position: absolute;
    top: -2px; right: 22%;
    background: var(--ls-coral);
    color: var(--ls-white);
    font-size: 0.58rem;
    min-width: 15px; height: 15px;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
  }
  body.has-tabbar { padding-bottom: 68px; }
}

/* ---------- Print ---------- */
@media print {
  .ls-navbar, .ls-footer, .mobile-tabbar, .back-to-top, .btn { display: none !important; }
}