/* AUZAN STORE — V10 PWA Install Banner + Bigger Catalog Controls
   Loaded last, after V9. Keeps banner/admin sync, notification drawer, cart precision,
   product modal precision, verified reviews, restock alerts, and image auto-fit intact. */

:root{
  --pwa-install-height:0px;
  --v10-green:#047857;
  --v10-green-2:#059669;
  --v10-navy:#0f172a;
  --v10-line:#dbe4ea;
  --v10-muted:#64748b;
}

/* ===== Top PWA install prompt ===== */
body.storefront-v4.pwa-install-visible{
  padding-top:var(--pwa-install-height)!important;
}
body.storefront-v4.pwa-install-visible .premium-market-header{
  top:var(--pwa-install-height)!important;
}

body.storefront-v4 .pwa-install-topbar{
  position:fixed!important;
  inset:0 0 auto 0!important;
  z-index:49!important;
  width:100%!important;
  background:linear-gradient(90deg,#f0fdf4 0%,#ffffff 42%,#ecfdf5 100%)!important;
  border-bottom:1px solid #ccebdd!important;
  box-shadow:0 8px 24px rgba(15,23,42,.08)!important;
  color:var(--v10-navy)!important;
}
body.storefront-v4 .pwa-install-topbar.hidden{display:none!important}
body.storefront-v4 .pwa-install-topbar-inner{
  width:min(1280px,calc(100% - 32px))!important;
  min-height:62px!important;
  margin:0 auto!important;
  padding:9px 0!important;
  display:grid!important;
  grid-template-columns:42px minmax(0,1fr) auto!important;
  align-items:center!important;
  gap:12px!important;
}
body.storefront-v4 .pwa-install-topbar-logo{
  width:42px!important;
  height:42px!important;
  display:block!important;
  object-fit:contain!important;
  object-position:center!important;
}
body.storefront-v4 .pwa-install-topbar-copy{
  min-width:0!important;
  display:flex!important;
  flex-direction:column!important;
  gap:2px!important;
}
body.storefront-v4 .pwa-install-topbar-copy strong{
  color:#0f2742!important;
  font-size:15px!important;
  line-height:1.2!important;
  font-weight:950!important;
  letter-spacing:-.015em!important;
}
body.storefront-v4 .pwa-install-topbar-copy small{
  color:#64748b!important;
  font-size:11.5px!important;
  line-height:1.35!important;
  font-weight:700!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
body.storefront-v4 .pwa-install-topbar-btn{
  min-width:112px!important;
  height:42px!important;
  padding:0 16px!important;
  border:0!important;
  border-radius:13px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  background:linear-gradient(135deg,#059669,#047857)!important;
  color:#fff!important;
  box-shadow:0 8px 18px rgba(4,120,87,.20)!important;
  font-size:12.5px!important;
  line-height:1!important;
  font-weight:950!important;
  cursor:pointer!important;
  transition:transform .16s ease,box-shadow .16s ease,filter .16s ease!important;
}
body.storefront-v4 .pwa-install-topbar-btn:hover{
  transform:translateY(-1px)!important;
  box-shadow:0 11px 24px rgba(4,120,87,.26)!important;
  filter:saturate(1.05)!important;
}
body.storefront-v4 .pwa-install-topbar-btn:active{transform:translateY(0) scale(.985)!important}
body.storefront-v4 .pwa-install-topbar-btn:disabled{opacity:.65!important;cursor:wait!important;transform:none!important}
body.storefront-v4 .pwa-install-topbar-btn svg{
  width:17px!important;
  height:17px!important;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:2!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}

/* Prevent legacy floating PWA prompt from ever resurfacing. */
body.storefront-v4 .pwa-install-popup{display:none!important}

/* ===== Bigger, clearer Kategori + Urutkan controls ===== */
body.storefront-v4 .catalog-explorer-shell .catalog-compact-controls{
  grid-template-columns:minmax(240px,260px) minmax(240px,260px)!important;
  gap:10px!important;
  padding:7px!important;
  border-radius:19px!important;
  background:#f8fafc!important;
  border:1px solid #dfe7ed!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.9)!important;
}
body.storefront-v4 .catalog-explorer-shell .compact-control{
  width:100%!important;
  min-width:0!important;
  height:60px!important;
  grid-template-columns:42px minmax(0,1fr) 16px!important;
  gap:10px!important;
  padding:0 12px!important;
  border:1px solid #e0e7ec!important;
  border-radius:15px!important;
  background:#fff!important;
  box-shadow:0 3px 9px rgba(15,23,42,.055)!important;
  overflow:hidden!important;
}
body.storefront-v4 .catalog-explorer-shell .compact-control:hover,
body.storefront-v4 .catalog-explorer-shell .compact-control:focus-within{
  border-color:#a7dfcd!important;
  box-shadow:0 0 0 4px rgba(16,185,129,.08),0 5px 14px rgba(15,23,42,.06)!important;
}
body.storefront-v4 .catalog-explorer-shell .compact-control-icon{
  width:40px!important;
  height:40px!important;
  border-radius:13px!important;
  font-size:15px!important;
}
body.storefront-v4 .catalog-explorer-shell .compact-control-copy{
  gap:4px!important;
  overflow:hidden!important;
}
body.storefront-v4 .catalog-explorer-shell .compact-control-copy small{
  display:block!important;
  color:#91a0b3!important;
  font-size:8.5px!important;
  line-height:1!important;
  letter-spacing:.09em!important;
  font-weight:950!important;
}
body.storefront-v4 .catalog-explorer-shell .compact-control-copy select{
  width:100%!important;
  min-width:0!important;
  padding:0!important;
  color:#10233d!important;
  font-size:14px!important;
  line-height:1.25!important;
  font-weight:950!important;
  letter-spacing:-.01em!important;
  white-space:nowrap!important;
  text-overflow:clip!important;
  overflow:hidden!important;
}
body.storefront-v4 .catalog-explorer-shell .compact-chevron{
  font-size:15px!important;
  color:#8da0b4!important;
  font-weight:900!important;
}

@media (max-width:1100px){
  body.storefront-v4 .catalog-explorer-shell .catalog-compact-controls{
    grid-template-columns:minmax(210px,1fr) minmax(210px,1fr)!important;
  }
}

@media (max-width:720px){
  body.storefront-v4 .pwa-install-topbar-inner{
    width:calc(100% - 24px)!important;
    min-height:68px!important;
    padding:9px 0!important;
    grid-template-columns:36px minmax(0,1fr) 88px!important;
    gap:9px!important;
  }
  body.storefront-v4 .pwa-install-topbar-logo{
    width:36px!important;
    height:36px!important;
  }
  body.storefront-v4 .pwa-install-topbar-copy strong{
    font-size:13.5px!important;
  }
  body.storefront-v4 .pwa-install-topbar-copy small{
    max-width:100%!important;
    font-size:10px!important;
    line-height:1.25!important;
    white-space:normal!important;
    display:-webkit-box!important;
    -webkit-line-clamp:2!important;
    -webkit-box-orient:vertical!important;
  }
  body.storefront-v4 .pwa-install-topbar-btn{
    min-width:88px!important;
    width:88px!important;
    height:40px!important;
    padding:0 11px!important;
    border-radius:12px!important;
    gap:6px!important;
    font-size:11.5px!important;
  }
  body.storefront-v4 .pwa-install-topbar-btn svg{width:15px!important;height:15px!important}

  body.storefront-v4 .catalog-explorer-shell .catalog-compact-controls{
    width:100%!important;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
    gap:8px!important;
    padding:8px!important;
    border-radius:18px!important;
  }
  body.storefront-v4 .catalog-explorer-shell .compact-control{
    height:60px!important;
    grid-template-columns:34px minmax(0,1fr) 12px!important;
    gap:7px!important;
    padding:0 8px!important;
    border-radius:14px!important;
  }
  body.storefront-v4 .catalog-explorer-shell .compact-control-icon{
    width:33px!important;
    height:33px!important;
    border-radius:11px!important;
    font-size:12px!important;
  }
  body.storefront-v4 .catalog-explorer-shell .compact-control-copy small{
    display:block!important;
    font-size:7.5px!important;
    letter-spacing:.07em!important;
  }
  body.storefront-v4 .catalog-explorer-shell .compact-control-copy select{
    font-size:12.5px!important;
    line-height:1.15!important;
    font-weight:950!important;
  }
  body.storefront-v4 .catalog-explorer-shell .compact-chevron{
    font-size:12px!important;
  }
}

@media (max-width:390px){
  body.storefront-v4 .pwa-install-topbar-inner{
    width:calc(100% - 18px)!important;
    grid-template-columns:32px minmax(0,1fr) 78px!important;
    gap:7px!important;
  }
  body.storefront-v4 .pwa-install-topbar-logo{width:32px!important;height:32px!important}
  body.storefront-v4 .pwa-install-topbar-copy strong{font-size:12.5px!important}
  body.storefront-v4 .pwa-install-topbar-copy small{font-size:9.3px!important}
  body.storefront-v4 .pwa-install-topbar-btn{min-width:78px!important;width:78px!important;padding:0 8px!important;font-size:11px!important}

  body.storefront-v4 .catalog-explorer-shell .compact-control{
    height:58px!important;
    grid-template-columns:30px minmax(0,1fr) 10px!important;
    gap:5px!important;
    padding:0 6px!important;
  }
  body.storefront-v4 .catalog-explorer-shell .compact-control-icon{width:30px!important;height:30px!important;font-size:11px!important}
  body.storefront-v4 .catalog-explorer-shell .compact-control-copy select{font-size:11.5px!important}
  body.storefront-v4 .catalog-explorer-shell .compact-control-copy small{font-size:7px!important}
}
