/**
 * QuickBolt WC - Mobile Navigation & Responsive Adjustments (320px to 1440px+)
 */

/* Mobile Bottom App Navigation Bar */
.qb-mobile-bottom-nav {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  height: 58px;
  background: #FFFFFF;
  border-top: 1px solid var(--qb-border-subtle);
  display: flex;
  align-items: center;
  justify-content: space-around;
  z-index: 90;
  padding-bottom: env(safe-area-inset-bottom, 0);
}

.qb-mobile-nav-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  color: var(--qb-text-muted);
  font-size: 0.6875rem;
  font-weight: 600;
  gap: 2px;
  min-width: 56px;
  min-height: 44px;
}

.qb-mobile-nav-item.is-active {
  color: var(--qb-primary);
  font-weight: 800;
}

@media (min-width: 768px) {
  .qb-mobile-bottom-nav {
    display: none;
  }
  .qb-floating-cart-bar {
    display: none;
  }
}

/* Tablet & Mobile Account / TeraWallet Layout (< 900px) */
@media (max-width: 899px) {
  .qb-account-shell {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 14px;
  }

  .qb-account-nav-card {
    padding: 8px;
    overflow: hidden;
  }

  .woocommerce-MyAccount-navigation ul {
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 2px;
  }

  .woocommerce-MyAccount-navigation ul li {
    flex: 0 0 auto;
  }

  .woocommerce-MyAccount-navigation ul li a {
    padding: 8px 12px;
    font-size: 0.8125rem;
  }
}

/* Mobile Viewports (<= 767px) */
@media (max-width: 767px) {
  body {
    padding-bottom: 124px;
  }

  /* 1. Header & Top Bar Mobile Ergonomics */
  .qb-header-top-inner span:nth-child(2) {
    display: none;
  }

  .qb-header-main {
    flex-wrap: wrap;
    gap: 8px;
    padding: 8px 0;
  }

  .qb-brand {
    flex: 1 1 auto;
    min-width: 0;
  }

  .qb-brand-mark {
    width: 34px;
    height: 34px;
    font-size: 1.05rem;
  }

  .qb-brand-title {
    font-size: 1rem;
  }

  .qb-brand-subtitle {
    display: none;
  }

  .qb-location-trigger {
    flex: 0 1 54%;
    max-width: 54%;
    padding: 5px 8px;
    min-height: 38px;
    gap: 6px;
  }

  .qb-location-address {
    max-width: 135px;
    font-size: 0.6875rem;
  }

  .qb-header-actions {
    order: 2;
    width: 100%;
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: 6px;
  }

  .qb-cart-trigger {
    margin-left: auto;
    padding: 6px 12px;
    min-height: 38px;
  }

  .qb-wallet-chip,
  .qb-account-btn {
    min-height: 38px;
    padding: 6px 10px;
  }

  .qb-search-wrapper {
    order: 3;
    flex: 1 1 100%;
    max-width: 100%;
  }

  .qb-account-label,
  .qb-cart-trigger-desktop-only {
    display: none;
  }

  /* 2. Page Wrapper & My Account / TeraWallet Mobile Fixes */
  .qb-page-outer {
    padding: 10px 0 !important;
  }

  .qb-page-article {
    padding: 12px !important;
    border-radius: 10px !important;
  }

  .qb-account-hero {
    padding: 16px 14px;
    gap: 14px;
    margin-bottom: 14px;
  }

  .qb-account-avatar {
    width: 46px;
    height: 46px;
    font-size: 1.125rem;
  }

  .qb-account-stats-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
    gap: 8px;
  }

  .qb-account-stat-pill {
    padding: 8px 10px;
    width: 100%;
  }

  .qb-account-content-card,
  .woocommerce-MyAccount-content {
    padding: 14px !important;
    overflow-x: hidden !important;
  }

  /* TeraWallet (woo-wallet) Mobile Containment */
  .woocommerce-MyAccount-content .woo-wallet-my-wallet-container {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 12px !important;
  }

  .woocommerce-MyAccount-content .woo-wallet-sidebar,
  .woocommerce-MyAccount-content .woo-wallet-content {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    float: none !important;
    margin: 0 !important;
    padding: 12px !important;
    box-sizing: border-box !important;
  }

  .woocommerce-MyAccount-content .woo-wallet-sidebar ul {
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
  }

  .woocommerce-MyAccount-content .woo-wallet-sidebar ul li.card {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 0 8px 0 !important;
    box-sizing: border-box !important;
  }

  .woocommerce-MyAccount-content .dataTables_wrapper {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
  }

  .woocommerce-MyAccount-content table.shop_table:not(.shop_table_responsive) {
    display: block;
    width: 100% !important;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  /* 3. Split-View Catalog / Brand Archive Mobile Responsiveness */
  .qb-archive-layout {
    grid-template-columns: 68px minmax(0, 1fr);
    gap: 8px;
  }

  .qb-archive-sidebar {
    padding: 4px;
    padding-bottom: 84px;
    max-height: calc(100vh - 76px);
  }

  .qb-side-cat-item {
    font-size: 0.625rem;
    line-height: 1.18;
    padding: 6px 2px;
    word-break: break-word;
    overflow-wrap: anywhere;
  }

  .qb-archive-header-bar {
    padding: 10px 12px !important;
    gap: 8px !important;
  }

  .qb-archive-sort-wrap,
  .qb-archive-main .woocommerce-ordering,
  .qb-archive-main .woocommerce-ordering select.orderby {
    width: 100% !important;
    max-width: 100% !important;
  }

  .qb-product-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
    clear: both !important;
  }

  .qb-product-card {
    padding: 8px;
  }

  .qb-card-thumb-wrap {
    max-height: 118px;
    margin-bottom: 6px;
  }

  .qb-card-badges {
    top: 6px;
    left: 6px;
    max-width: calc(100% - 34px);
    gap: 3px;
  }

  .qb-badge {
    font-size: 0.5625rem;
    padding: 2px 5px;
  }

  .qb-quick-view-btn {
    top: 6px;
    right: 6px;
    width: 26px;
    height: 26px;
    font-size: 0.6875rem;
  }

  .qb-card-title {
    font-size: 0.78125rem;
    line-height: 1.28;
    min-height: 2rem;
    margin-bottom: 4px;
  }

  .qb-card-unit-row {
    margin-bottom: 6px;
  }

  .qb-card-unit-label {
    font-size: 0.6875rem;
  }

  .qb-stock-dot-row {
    font-size: 0.625rem;
    margin-bottom: 4px;
  }

  .qb-card-footer {
    flex-wrap: wrap;
    gap: 4px;
  }

  .qb-price-current {
    font-size: 0.84375rem;
  }

  .qb-price-mrp {
    font-size: 0.65rem;
  }

  .qb-stepper-wrap {
    min-width: 58px;
    height: 30px;
  }

  .qb-add-btn {
    height: 30px;
    padding: 0 8px;
    font-size: 0.71875rem;
  }

  .qb-qty-stepper {
    width: 66px;
    height: 30px;
  }

  .qb-qty-btn {
    width: 22px;
    height: 30px;
    font-size: 0.875rem;
  }

  .qb-qty-value {
    font-size: 0.75rem;
    min-width: 18px;
  }

  /* 4. Cart & Checkout Mobile Ergonomics */
  .woocommerce-cart-form .actions {
    display: flex;
    flex-direction: column;
    gap: 10px;
  }

  .woocommerce-cart-form .actions .coupon {
    display: flex !important;
    width: 100%;
    gap: 6px;
  }

  .woocommerce-cart-form .actions .coupon input.input-text {
    flex: 1 1 auto;
    min-width: 0;
  }

  .woocommerce-cart-form .actions button[name="update_cart"] {
    float: none !important;
    width: 100%;
  }

  .qb-pdp-gallery-card,
  .qb-pdp-summary-card {
    padding: 14px;
  }
}

/* Compact 320px-375px Android Viewports */
@media (max-width: 375px) {
  .qb-archive-layout {
    grid-template-columns: 62px minmax(0, 1fr);
    gap: 6px;
  }

  .qb-product-card {
    padding: 7px;
  }

  .qb-price-current {
    font-size: 0.78125rem;
  }

  .qb-stepper-wrap {
    min-width: 54px;
    height: 28px;
  }

  .qb-add-btn {
    height: 28px;
    padding: 0 6px;
    font-size: 0.6875rem;
  }

  .qb-qty-stepper {
    width: 62px;
    height: 28px;
  }

  .qb-qty-btn {
    width: 20px;
    height: 28px;
  }
}