/* VISIONCART_V269_MOBILE_PRODUCT_LIST_GAP_FIX
   Mobile-only presentation fixes for product filters, cart and checkout.
   V269 permanently removes the hidden filter sidebar from document flow on mobile.
   No pricing, cart, checkout, payment or backend behavior is changed. */

#vc267-filter-toggle,
#vc267-filter-overlay { display:none; }

@media (max-width: 768px) {
  html,
  body,
  #root {
    width:100%;
    max-width:100%;
    overflow-x:hidden !important;
  }


  /* ---------------- Product listing / filters ---------------- */
  .vc267-plp-root { width:100% !important; max-width:100% !important; overflow:hidden !important; }
  .vc267-plp-breadcrumb {
    width:100% !important;
    max-width:100% !important;
    padding:12px 14px !important;
    overflow-x:auto !important;
    white-space:nowrap !important;
    scrollbar-width:none;
  }
  .vc267-plp-breadcrumb::-webkit-scrollbar { display:none; }
  .vc267-plp-layout {
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    padding:0 12px 42px !important;
  }
  .vc267-plp-product-area { width:100% !important; max-width:100% !important; min-width:0 !important; }
  .vc267-plp-controls {
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:10px !important;
    width:100% !important;
    margin-bottom:12px !important;
    padding:12px !important;
    border-radius:16px !important;
    box-shadow:0 8px 28px rgba(15,23,42,.045);
  }
  .vc267-plp-controls > div:first-child { width:100% !important; }
  .vc267-plp-controls > div:last-child {
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto !important;
    align-items:center !important;
    justify-content:stretch !important;
    gap:8px !important;
    width:100% !important;
  }
  .vc267-plp-controls > div:last-child > input {
    grid-column:1 / -1 !important;
    width:100% !important;
    min-width:0 !important;
    border-radius:12px !important;
    font-size:16px !important;
  }
  .vc267-plp-controls > div:last-child > select {
    width:100% !important;
    min-width:0 !important;
    border-radius:12px !important;
    font-size:16px !important;
  }
  .vc267-plp-controls > div:last-child > div { justify-self:end; }
  .vc267-product-grid {
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:10px !important;
    width:100% !important;
  }

  .vc267-plp-sidebar {
    position:fixed !important;
    left:10px !important;
    right:10px !important;
    bottom:max(10px, env(safe-area-inset-bottom)) !important;
    top:auto !important;
    z-index:30020 !important;
    width:auto !important;
    max-width:none !important;
    max-height:min(78vh, 650px) !important;
    overflow-y:auto !important;
    overscroll-behavior:contain;
    padding:18px 18px 24px !important;
    border-radius:22px !important;
    background:#fff !important;
    box-shadow:0 28px 80px rgba(15,23,42,.28) !important;
    transform:translateY(calc(100% + 36px));
    visibility:hidden;
    transition:transform .24s ease, visibility .24s ease;
  }
  .vc267-plp-sidebar.is-open {
    transform:translateY(0);
    visibility:visible;
  }

  /* V269 permanent gap fix:
     mobile-responsive.css has a high-specificity generic rule that converts
     inline sticky sidebars to position:relative. That kept the hidden filter
     panel in normal document flow and created a full sidebar-height blank gap.
     This selector intentionally has higher specificity and keeps the panel
     fixed/off-canvas without reserving page height. */
  #root .vc267-plp-root .vc267-plp-layout > aside.vc267-plp-sidebar {
    position:fixed !important;
    top:auto !important;
    left:10px !important;
    right:10px !important;
    bottom:max(10px, env(safe-area-inset-bottom)) !important;
    margin:0 !important;
  }
  #root .vc267-plp-root .vc267-plp-product-area {
    margin-top:0 !important;
  }
  .vc267-plp-sidebar > div:first-child {
    position:sticky;
    top:-18px;
    z-index:3;
    margin:-18px -18px 10px !important;
    padding:17px 18px 13px;
    background:rgba(255,255,255,.96);
    border-bottom:1px solid #eef2f7;
    backdrop-filter:blur(12px);
  }
  #vc267-filter-overlay {
    position:fixed;
    inset:0;
    z-index:30010;
    border:0;
    background:rgba(15,23,42,.48);
    backdrop-filter:blur(2px);
    cursor:pointer;
  }
  #vc267-filter-toggle {
    position:fixed;
    right:16px;
    bottom:max(18px, calc(env(safe-area-inset-bottom) + 12px));
    z-index:30030;
    min-height:46px;
    padding:0 18px;
    border:0;
    border-radius:999px;
    background:#00B5AD;
    color:#fff;
    box-shadow:0 14px 34px rgba(0,181,173,.32);
    font-size:14px;
    font-weight:900;
    cursor:pointer;
  }
  body.vc267-filter-available #vc267-filter-toggle { display:flex; align-items:center; justify-content:center; gap:7px; }
  body.vc267-filter-open #vc267-filter-overlay { display:block; }
  body.vc267-filter-open { overflow:hidden !important; }

  /* ---------------- Shopping cart ---------------- */
  .vc267-cart-root { width:100% !important; max-width:100% !important; overflow:hidden !important; }
  .vc267-cart-container {
    width:100% !important;
    max-width:100% !important;
    padding:22px 12px 38px !important;
  }
  .vc267-cart-title { font-size:clamp(26px,8vw,34px) !important; line-height:1.08 !important; }
  .vc267-cart-layout {
    display:block !important;
    width:100% !important;
    max-width:100% !important;
  }
  .vc267-cart-items { width:100% !important; gap:12px !important; }
  .vc267-cart-item {
    display:grid !important;
    grid-template-columns:88px minmax(0,1fr) !important;
    align-items:start !important;
    gap:12px !important;
    width:100% !important;
    max-width:100% !important;
    padding:14px !important;
    border-radius:18px !important;
    overflow:hidden !important;
    box-shadow:0 8px 30px rgba(15,23,42,.04);
  }
  .vc267-cart-image {
    width:88px !important;
    height:70px !important;
    max-width:88px !important;
    border-radius:12px !important;
  }
  .vc267-cart-info { width:100% !important; min-width:0 !important; }
  .vc267-cart-info-top {
    width:100% !important;
    min-width:0 !important;
    gap:8px !important;
  }
  .vc267-cart-info-top > div:first-child {
    flex:1 1 auto !important;
    width:auto !important;
    min-width:0 !important;
  }
  .vc267-cart-info-top p,
  .vc267-cart-info-top span,
  .vc267-cart-price p { overflow-wrap:anywhere; }
  .vc267-rx-box {
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    margin-top:10px !important;
    padding:10px !important;
    border-radius:12px !important;
  }
  .vc267-rx-box select,
  .vc267-rx-box input,
  .vc267-rx-box textarea { width:100% !important; max-width:100% !important; min-width:0 !important; }
  .vc267-rx-box [style*="grid-template-columns"] { grid-template-columns:1fr !important; }
  .vc267-cart-bottom {
    width:100% !important;
    gap:10px !important;
    align-items:flex-end !important;
    flex-wrap:wrap !important;
  }
  .vc267-cart-price { margin-left:auto !important; min-width:82px !important; }
  .vc267-cart-promo {
    width:100% !important;
    padding:12px 13px !important;
    line-height:1.45 !important;
    border-radius:14px !important;
    align-items:flex-start !important;
  }
  .vc267-cart-bill {
    position:relative !important;
    top:auto !important;
    width:100% !important;
    max-width:100% !important;
    margin-top:14px !important;
    padding:16px !important;
    border-radius:18px !important;
  }
  .vc267-cart-bill input { min-width:0 !important; }
  .vc267-cart-bill button { flex-shrink:0; }

  /* ---------------- Checkout ---------------- */
  .vc267-checkout-root { width:100% !important; max-width:100% !important; overflow:hidden !important; }
  .vc267-checkout-container {
    width:100% !important;
    max-width:100% !important;
    padding:20px 12px 38px !important;
    overflow:hidden !important;
  }
  .vc267-stepbar {
    display:grid !important;
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    gap:6px !important;
    width:100% !important;
    max-width:100% !important;
    margin-bottom:16px !important;
    padding:12px 9px !important;
    overflow:visible !important;
    border-radius:16px !important;
  }
  .vc267-step-item {
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:5px !important;
    min-width:0 !important;
    text-align:center !important;
  }
  .vc267-step-dot { width:27px !important; height:27px !important; }
  .vc267-step-label {
    display:block !important;
    width:100% !important;
    min-width:0 !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
    font-size:10px !important;
    line-height:1.15 !important;
  }
  .vc267-step-connector { display:none !important; }
  .vc-checkout-layout-v250,
  .vc267-checkout-layout {
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
  }
  .vc-checkout-form-v250,
  .vc267-checkout-form { width:100% !important; max-width:100% !important; min-width:0 !important; }
  .vc267-checkout-card {
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    padding:18px 14px !important;
    border-radius:18px !important;
    overflow:hidden !important;
  }
  .vc267-checkout-card h2 { font-size:clamp(24px,7vw,31px) !important; line-height:1.12 !important; }
  .vc267-form-grid { grid-template-columns:1fr !important; width:100% !important; }
  .vc267-checkout-card input,
  .vc267-checkout-card select,
  .vc267-checkout-card textarea {
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    font-size:16px !important;
  }
  .vc267-checkout-card [style*="repeat(auto-fit, minmax(260px"] { grid-template-columns:1fr !important; }
  .vc267-checkout-card [style*="display: flex"][style*="gap: 10px"] { flex-wrap:wrap !important; }
  .vc-checkout-summary-v250 {
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    margin-top:14px !important;
    padding:16px !important;
    border-radius:18px !important;
  }
}

@media (max-width: 380px) {
  .vc267-product-grid { grid-template-columns:1fr !important; }
  .vc267-cart-item { grid-template-columns:74px minmax(0,1fr) !important; padding:12px !important; gap:10px !important; }
  .vc267-cart-image { width:74px !important; max-width:74px !important; height:62px !important; }
  .vc267-plp-controls > div:last-child { grid-template-columns:1fr !important; }
  .vc267-plp-controls > div:last-child > div { justify-self:start; }
}
