/* VisionCart professional mobile storefront patch */
@media (max-width: 768px) {
  html, body { width:100%; max-width:100%; overflow-x:hidden; background:#f7f8fa; }
  #root { width:100%; overflow-x:hidden; }
  img, svg, video, canvas { max-width:100%; }
  button, a, input, select, textarea { -webkit-tap-highlight-color: transparent; }

  .vc-hard-header { box-shadow: 0 4px 18px rgba(15,23,42,.08); }
  .vc-hard-top {
    justify-content:flex-start !important;
    flex-wrap:nowrap !important;
    overflow-x:auto !important;
    gap:10px !important;
    padding:6px 12px !important;
    font-size:10.5px !important;
    scrollbar-width:none;
    white-space:nowrap;
  }
  .vc-hard-top::-webkit-scrollbar { display:none; }
  .vc-hard-main {
    display:grid !important;
    grid-template-columns:auto 1fr !important;
    gap:8px 10px !important;
    padding:8px 12px 10px !important;
    min-height:0 !important;
  }
  .vc-hard-logo { width:108px !important; min-width:108px !important; }
  .vc-hard-logo img { max-width:108px !important; max-height:36px !important; }
  .vc-hard-logo svg { width:108px !important; height:auto !important; }
  .vc-hard-actions { min-width:0 !important; gap:10px !important; justify-content:flex-end !important; }
  .vc-hard-action { min-width:30px !important; }
  .vc-hard-action-icon { width:21px !important; height:21px !important; }
  .vc-hard-action-label { display:none !important; }
  .vc-hard-search {
    grid-column:1 / -1 !important;
    width:100% !important;
    border-radius:16px !important;
    padding:8px 12px !important;
  }
  .vc-hard-search input { font-size:13px !important; min-width:0 !important; }
  .vc-hard-search-icons { gap:2px !important; }
  .vc-hard-search-icon { width:28px !important; height:28px !important; }
  .vc-hard-nav { border-top:1px solid #edf2f7 !important; }
  .vc-hard-nav-inner {
    padding:0 10px !important;
    gap:4px !important;
    overflow-x:auto !important;
    scrollbar-width:none;
    scroll-snap-type:x proximity;
  }
  .vc-hard-nav-inner::-webkit-scrollbar { display:none; }
  .vc-hard-nav-item { flex:0 0 auto !important; scroll-snap-align:start; }
  .vc-hard-nav-btn {
    font-size:12px !important;
    padding:10px 10px !important;
    border-radius:999px !important;
  }
  .vc-hard-mega { display:none !important; }

  /* Extra safety for inline React styles on mobile */
  #root [style*="grid-template-columns: 1fr 1fr"],
  #root [style*="grid-template-columns: 1fr 360px"],
  #root [style*="grid-template-columns: 1fr 320px"] { grid-template-columns:1fr !important; }
  #root [style*="grid-template-columns: repeat(3, 1fr)"] { grid-template-columns:1fr !important; }
  #root [style*="grid-template-columns: repeat(4, 1fr)"] { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
  #root [style*="max-width: 1200px"][style*="padding: 0px 24px"] { padding-left:14px !important; padding-right:14px !important; }
  #root input, #root select, #root textarea { font-size:16px !important; }
  #root [style*="position: sticky"][style*="top: 150px"],
  #root [style*="position: sticky"][style*="top: 140px"] { position:relative !important; top:auto !important; }
}

@media (max-width: 420px) {
  .vc-hard-top { display:none !important; }
  .vc-hard-main { padding-top:9px !important; }
  .vc-hard-logo { width:98px !important; min-width:98px !important; }
  .vc-hard-logo img, .vc-hard-logo svg { max-width:98px !important; }
}


/* VISIONCART_MOBILE_HEADER_BANNER_V1: separate mobile header, burger drawer, mobile banner polish */
.vc-mobile-menu-toggle{display:none;border:0;background:#f7f8fa;color:#0a2540;border-radius:14px;width:42px;height:42px;align-items:center;justify-content:center;flex-direction:column;gap:5px;cursor:pointer;}
.vc-mobile-menu-toggle span{width:19px;height:2px;border-radius:99px;background:currentColor;display:block;}
.vc-mobile-menu-overlay{display:none;position:fixed;inset:0;background:rgba(15,23,42,.42);z-index:10050;backdrop-filter:blur(2px);}
.vc-mobile-drawer{position:fixed;top:0;bottom:0;left:0;width:min(86vw,360px);background:#fff;z-index:10060;transform:translateX(-110%);transition:transform .24s ease;box-shadow:20px 0 60px rgba(15,23,42,.18);display:flex;flex-direction:column;font-family:'DM Sans',sans-serif;}
.vc-mobile-drawer-head{display:flex;align-items:center;justify-content:space-between;padding:18px 18px;border-bottom:1px solid #eef2f7;color:#0a2540;}
.vc-mobile-drawer-head strong{font-size:19px;font-weight:900;}
.vc-mobile-drawer-head button{border:0;background:#f1f5f9;width:34px;height:34px;border-radius:50%;font-size:24px;line-height:1;color:#0f172a;cursor:pointer;}
.vc-mobile-menu-content{overflow:auto;padding:14px 16px 28px;}
.vc-mobile-menu-section{background:#f8fafc;border:1px solid #edf2f7;border-radius:18px;padding:12px;margin-bottom:14px;}
.vc-mobile-menu-section h4{margin:0 0 10px;color:#64748b;font-size:11px;text-transform:uppercase;letter-spacing:.08em;font-weight:900;}
.vc-mobile-quick-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;background:#fff;}
.vc-mobile-quick-actions a{display:flex;align-items:center;justify-content:center;min-height:42px;border-radius:13px;background:#effdfb;color:#008a80;font-weight:900;font-size:13px;text-decoration:none;}
.vc-mobile-menu-link{display:flex;align-items:center;justify-content:space-between;color:#0a2540;text-decoration:none;font-weight:900;font-size:15px;padding:13px 10px;border-radius:14px;background:#fff;margin-bottom:8px;border:1px solid #edf2f7;}
.vc-mobile-menu-link b{color:#00B5AD;font-size:20px;}
.vc-mobile-subnav{display:flex;flex-wrap:wrap;gap:7px;padding:0 4px 10px;margin-top:-2px;}
.vc-mobile-subnav a{font-size:12px;color:#64748b;background:#fff;border:1px solid #e2e8f0;border-radius:999px;padding:7px 10px;text-decoration:none;font-weight:700;}
.vc-mobile-offer-link{display:block;color:#0f172a;background:#fff;border:1px solid #edf2f7;border-radius:13px;padding:11px 12px;text-decoration:none;font-size:13px;font-weight:800;margin-bottom:8px;}
body.vc-mobile-menu-open{overflow:hidden;}
body.vc-mobile-menu-open .vc-mobile-menu-overlay{display:block;}
body.vc-mobile-menu-open .vc-mobile-drawer{transform:translateX(0);}

@media (max-width:768px){
  .vc-hard-header{box-shadow:0 6px 22px rgba(15,23,42,.08)!important;}
  .vc-hard-top,.vc-hard-nav{display:none!important;}
  .vc-hard-main{display:grid!important;grid-template-columns:44px auto 1fr!important;gap:8px!important;align-items:center!important;padding:9px 12px 10px!important;background:#fff!important;}
  .vc-mobile-menu-toggle{display:flex!important;grid-column:1;grid-row:1;}
  .vc-hard-logo{grid-column:2!important;grid-row:1!important;width:112px!important;min-width:112px!important;}
  .vc-hard-logo img{max-width:112px!important;max-height:36px!important;}
  .vc-hard-logo svg{width:112px!important;height:auto!important;}
  .vc-hard-actions{grid-column:3!important;grid-row:1!important;min-width:0!important;gap:8px!important;justify-content:flex-end!important;}
  .vc-hard-actions .vc-hard-action:nth-child(2){display:none!important;}
  .vc-hard-action{min-width:32px!important;padding:4px!important;}
  .vc-hard-action-icon{width:24px!important;height:24px!important;}
  .vc-hard-search{grid-column:1 / -1!important;grid-row:2!important;width:100%!important;border-radius:16px!important;padding:9px 12px!important;background:#f8fafc!important;border:1px solid #e2e8f0!important;margin-top:2px!important;}
  .vc-hard-search input{font-size:16px!important;}
  .vc-hard-search-icons{display:none!important;}
  #root{padding-bottom:0;}
  footer{padding-bottom:76px;}
  footer [style*="grid-template-columns"]{grid-template-columns:1fr!important;}
}

@media (max-width:420px){
  .vc-hard-logo{width:102px!important;min-width:102px!important;}
  .vc-hard-logo img,.vc-hard-logo svg{max-width:102px!important;}
  .vc-hard-main{grid-template-columns:42px auto 1fr!important;padding-left:10px!important;padding-right:10px!important;}
  .vc-hard-actions{gap:5px!important;}
}


/* V2 burger/menu + mobile image banners */
.vc-mobile-drawer, .vc-mobile-menu-overlay { display:none; }
body.vc-mobile-menu-open .vc-mobile-menu-overlay { display:block; }
body.vc-mobile-menu-open .vc-mobile-drawer { display:flex; transform:translateX(0); }
@media (max-width:768px){
  .vc-mobile-drawer{display:flex;}
  .vc-mobile-menu-toggle{display:flex!important;}
  .vc-mobile-quick-actions a span{font-size:16px;margin-right:6px;}
  .vc-mobile-menu-content{padding-bottom:42px;}
  .vc-mobile-menu-section{box-shadow:0 8px 28px rgba(15,23,42,.04);}
  #root section img{height:auto;}
}


/* V238 desktop/mobile homepage banner separation and mobile rendering */
.vc-home-hero,.vc-home-wide-banner{background-position:center!important;background-size:cover!important;background-repeat:no-repeat!important;}
@media (max-width:768px){
  .vc-home-hero{min-height:min(125vw,560px)!important;padding:30px 18px 54px!important;align-items:flex-end!important;justify-content:flex-start!important;}
  .vc-home-hero-content{max-width:100%!important;width:100%!important;position:relative!important;z-index:2!important;text-shadow:0 2px 12px rgba(0,0,0,.45)!important;}
  .vc-home-hero-title{font-size:clamp(30px,10vw,44px)!important;line-height:1.06!important;margin-bottom:12px!important;}
  .vc-home-hero-subtitle{font-size:14px!important;line-height:1.5!important;max-width:92%!important;margin-bottom:20px!important;}
  .vc-home-hero-eyebrow{font-size:10px!important;}
  .vc-home-hero.vc-has-uploaded-image .vc-home-hero-art{display:none!important;}
  .vc-home-hero-dots{bottom:18px!important;}
  .vc-home-wide-banner{min-height:280px!important;padding:34px 20px 52px!important;align-items:flex-end!important;gap:12px!important;}
  .vc-home-wide-banner.vc-has-uploaded-image>div:nth-child(2){display:none!important;}
  .vc-home-wide-banner>div:first-child{position:relative!important;z-index:2!important;max-width:92%!important;text-shadow:0 2px 10px rgba(0,0,0,.42)!important;}
}
