/* Modernista v25.2 critical layout hotfix — loaded as a separate unique asset to bypass stale CSS caches. */

/* ---------- STOREFRONT DESKTOP ---------- */
@media (min-width: 761px) {
  .mobile-menu-toggle,
  .mobile-category-drawer,
  .drawer-backdrop { display:none !important; }

  body.menu-open { overflow:auto !important; }

  .site-header {
    display:grid !important;
    grid-template-columns:minmax(180px,1fr) auto minmax(250px,1fr) !important;
    align-items:center !important;
    gap:24px !important;
    height:82px !important;
    min-height:82px !important;
    padding:0 5vw !important;
  }
  .site-header > .brand { grid-column:1 !important; justify-self:start !important; }
  .site-header > .category-nav { grid-column:2 !important; justify-self:center !important; }
  .site-header > .actions { grid-column:3 !important; justify-self:end !important; }

  .category-nav {
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:24px !important;
    white-space:nowrap !important;
  }
  .actions {
    display:flex !important;
    align-items:center !important;
    gap:14px !important;
    white-space:nowrap !important;
  }
  .search-shell { position:relative !important; display:flex !important; align-items:center !important; }
  .header-icon-btn {
    display:inline-flex !important;
    align-items:center !important;
    gap:6px !important;
    min-height:38px !important;
    padding:7px 9px !important;
    border:0 !important;
    background:transparent !important;
  }
  .search-popover {
    display:none !important;
    position:absolute !important;
    top:calc(100% + 12px) !important;
    right:0 !important;
    width:390px !important;
    max-width:70vw !important;
    padding:10px !important;
    gap:7px !important;
    background:#fff !important;
    border:1px solid #ddd !important;
    border-radius:14px !important;
    box-shadow:0 14px 38px rgba(0,0,0,.16) !important;
    z-index:100 !important;
  }
  .search-popover.open,
  .search-shell:hover .search-popover { display:flex !important; }
  .search-popover input { min-width:0 !important; flex:1 1 auto !important; }
  .cart-link { display:inline-flex !important; flex-direction:row !important; align-items:center !important; gap:6px !important; }
  .cart-text { display:inline !important; }
}

/* ---------- STOREFRONT MOBILE ---------- */
@media (max-width: 760px) {
  body { overflow-x:hidden !important; }
  .site-header {
    display:grid !important;
    grid-template-columns:34px minmax(0,1fr) auto !important;
    align-items:center !important;
    gap:8px !important;
    min-height:64px !important;
    height:auto !important;
    padding:9px 12px !important;
  }
  .mobile-menu-toggle {
    display:grid !important;
    place-items:center !important;
    width:32px !important;
    min-width:32px !important;
    height:32px !important;
    padding:0 !important;
    margin:0 !important;
    border:1px solid #e5e5e5 !important;
    border-radius:9px !important;
    background:#fff !important;
    color:#111 !important;
    font-size:0 !important;
    line-height:1 !important;
    cursor:pointer !important;
  }
  .mobile-menu-toggle::before { content:'☰'; font-size:16px !important; line-height:1 !important; }
  .site-header > .brand {
    width:132px !important;
    height:42px !important;
    justify-self:start !important;
    margin:0 !important;
  }
  .site-header > .category-nav { display:none !important; }
  .site-header > .actions {
    display:flex !important;
    justify-self:end !important;
    align-items:center !important;
    gap:5px !important;
    min-width:0 !important;
  }
  .desktop-label,.track-link,.cart-text { display:none !important; }
  .header-icon-btn,.cart-link {
    display:grid !important;
    place-items:center !important;
    width:34px !important;
    min-width:34px !important;
    height:34px !important;
    padding:0 !important;
    margin:0 !important;
    border-radius:9px !important;
    border:0 !important;
    background:transparent !important;
    position:relative !important;
  }
  .header-icon-btn svg,.cart-icon { width:20px !important; height:20px !important; }
  .cart-count {
    position:absolute !important;
    right:-5px !important;
    top:-5px !important;
    min-width:17px !important;
    height:17px !important;
    padding:0 4px !important;
    margin:0 !important;
    font-size:9px !important;
  }
  .search-popover { display:none !important; }
  .search-popover.open {
    display:flex !important;
    position:fixed !important;
    left:12px !important;
    right:12px !important;
    top:74px !important;
    width:auto !important;
    padding:10px !important;
    gap:7px !important;
    background:#fff !important;
    border:1px solid #ddd !important;
    border-radius:14px !important;
    box-shadow:0 14px 38px rgba(0,0,0,.16) !important;
    z-index:150 !important;
  }

  .mobile-category-drawer {
    display:block !important;
    position:fixed !important;
    left:0 !important;
    top:0 !important;
    bottom:0 !important;
    width:min(300px,84vw) !important;
    padding:18px !important;
    background:#fff !important;
    z-index:151 !important;
    transform:translateX(-105%) !important;
    transition:transform .24s ease !important;
    overflow-y:auto !important;
    box-shadow:12px 0 35px rgba(0,0,0,.16) !important;
  }
  .drawer-backdrop {
    display:block !important;
    position:fixed !important;
    inset:0 !important;
    background:rgba(0,0,0,.35) !important;
    z-index:150 !important;
    opacity:0 !important;
    visibility:hidden !important;
    pointer-events:none !important;
    transition:opacity .24s ease !important;
  }
  .menu-open .mobile-category-drawer { transform:translateX(0) !important; }
  .menu-open .drawer-backdrop { opacity:1 !important; visibility:visible !important; pointer-events:auto !important; }
  .drawer-head { display:flex !important; align-items:center !important; justify-content:space-between !important; padding-bottom:10px !important; border-bottom:1px solid #eee !important; }
  .drawer-head button { width:32px !important; height:32px !important; padding:0 !important; border:0 !important; border-radius:8px !important; background:#f4f4f4 !important; font-size:20px !important; }
  .drawer-category>a { display:block !important; padding:12px 0 !important; border-bottom:1px solid #eee !important; font-weight:800 !important; }
  .drawer-child { padding-left:14px !important; font-weight:500 !important; color:#555 !important; }

  .hero-slider { overflow:hidden !important; }
  .hero-track { display:flex !important; width:100% !important; }
  .hero-slide { flex:0 0 100% !important; min-width:100% !important; width:100% !important; overflow:hidden !important; }
  .hero-copy { max-width:100% !important; min-width:0 !important; }
  .hero-copy h1 { max-width:100% !important; word-break:normal !important; overflow-wrap:normal !important; }

  .category-carousel .category-track { display:flex !important; overflow-x:auto !important; gap:10px !important; scroll-snap-type:x proximity !important; }
  .category-carousel .category-tile { flex:0 0 44vw !important; min-width:145px !important; scroll-snap-align:start !important; }

  .mobile-six-list { display:grid !important; grid-template-columns:1fr !important; gap:20px !important; overflow:visible !important; }
  .mobile-six-list .product-slide { width:100% !important; min-width:0 !important; }
  .mobile-six-list .product-slide:nth-child(n+7) { display:none !important; }
  .mobile-see-all { display:flex !important; justify-content:center !important; margin-top:20px !important; }

  .card-purchase-actions { display:grid !important; grid-template-columns:1fr 1fr !important; gap:8px !important; align-items:stretch !important; }
  .card-purchase-actions > * { min-width:0 !important; width:100% !important; }
  .card-purchase-actions form { display:flex !important; margin:0 !important; }
  .card-purchase-actions .card-btn { width:100% !important; min-height:42px !important; margin:0 !important; white-space:nowrap !important; }
}

/* ---------- ADMIN DESKTOP ---------- */
@media (min-width: 761px) {
  .admin-sidebar { position:fixed !important; left:0 !important; top:0 !important; bottom:0 !important; width:250px !important; }
  .admin-main { margin-left:250px !important; padding:30px !important; min-width:0 !important; }
}
.stats.dashboard-status-cards {
  display:grid !important;
  grid-template-columns:repeat(5,minmax(0,1fr)) !important;
  gap:14px !important;
  margin-bottom:22px !important;
}
.stats.dashboard-status-cards > a {
  display:flex !important;
  flex-direction:column !important;
  min-width:0 !important;
  padding:18px !important;
  background:#fff !important;
  border:1px solid #e5e5e5 !important;
  border-radius:16px !important;
  box-shadow:none !important;
}
.stats.dashboard-status-cards > a span { font-size:12px !important; color:#666 !important; }
.stats.dashboard-status-cards > a strong { margin-top:4px !important; font-size:26px !important; line-height:1.1 !important; }
.quick-status-form { display:grid !important; grid-template-columns:minmax(135px,1fr) auto !important; gap:8px !important; align-items:center !important; min-width:280px !important; }
.quick-status-form select { width:100% !important; min-width:0 !important; }
.admin-card .table-wrap { max-width:100% !important; overflow-x:auto !important; }

@media (max-width:1200px) and (min-width:761px) {
  .stats.dashboard-status-cards { grid-template-columns:repeat(3,minmax(0,1fr)) !important; }
}

/* ---------- ADMIN MOBILE ---------- */
@media (max-width:760px) {
  .admin-sidebar { position:relative !important; width:100% !important; min-height:auto !important; padding:14px !important; }
  .admin-sidebar .admin-brand { height:54px !important; margin-bottom:10px !important; }
  .admin-sidebar .admin-brand img { width:150px !important; height:44px !important; }
  .admin-sidebar nav { display:flex !important; flex-direction:row !important; overflow-x:auto !important; gap:6px !important; white-space:nowrap !important; scrollbar-width:none !important; }
  .admin-sidebar nav a { flex:0 0 auto !important; padding:8px 10px !important; font-size:12px !important; }
  .admin-main { margin-left:0 !important; padding:14px !important; min-width:0 !important; }
  .admin-top { display:flex !important; flex-wrap:wrap !important; gap:10px !important; }
  .stats.dashboard-status-cards { grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:10px !important; }
  .stats.dashboard-status-cards > a { padding:14px !important; }
  .stats.dashboard-status-cards > a strong { font-size:22px !important; }
  .quick-status-form { grid-template-columns:1fr !important; min-width:220px !important; }
  .table-wrap { overflow-x:auto !important; -webkit-overflow-scrolling:touch !important; }
}
@media (max-width:480px) {
  .stats.dashboard-status-cards { grid-template-columns:1fr !important; }
}