/* =========================================================
   BWET SITE CONSISTENCY PASS — 2026-09-17
   Loaded last on public pages to keep controls, spacing and
   transactional layouts visually consistent without changing logic.
   ========================================================= */
:root{
  --ui-control-height:42px;
  --ui-button-height:42px;
  --ui-form-width:520px;
  --ui-content-width:1120px;
}

/* Consistent compact controls across public pages */
body:not(.admin-page) input,
body:not(.admin-page) select,
body:not(.admin-page) textarea{
  box-sizing:border-box;
  font:500 13px/1.35 'Manrope',Arial,sans-serif!important;
}
body:not(.admin-page) input:not([type="checkbox"]):not([type="radio"]),
body:not(.admin-page) select{
  min-height:var(--ui-control-height)!important;
  height:var(--ui-control-height)!important;
}
body:not(.admin-page) .btn,
body:not(.admin-page) .checkout-button,
body:not(.admin-page) .contact-action{
  min-height:var(--ui-button-height)!important;
  height:auto!important;
  padding:0 16px!important;
  font-size:12px!important;
}
body:not(.admin-page) .btn .bnet-icon,
body:not(.admin-page) .checkout-button .bnet-icon,
body:not(.admin-page) .contact-action .bnet-icon{
  width:17px!important;
  height:17px!important;
}

/* Keep public header rhythm identical even on pages with local CSS */
.site-header .header-inner{
  min-height:66px!important;
}
.site-header .brand-logo img,
.site-header .site-logo img{
  width:108px!important;
  height:34px!important;
  object-fit:contain!important;
}

/* ---------- SHOP CATALOGUE: shorter cards + vertical actions ---------- */
.shop-section{
  padding-top:34px!important;
}
.shop-tools{
  gap:14px!important;
  margin-bottom:22px!important;
}
.shop-search-wrap{
  width:min(360px,100%)!important;
}
.shop-tools input{
  min-height:42px!important;
  height:42px!important;
  padding-left:40px!important;
}
.product-grid{
  gap:24px 18px!important;
}
.product-media{
  aspect-ratio:4/3!important;
  max-height:220px!important;
}
.product-copy{
  padding-top:11px!important;
}
.product-copy h2{
  margin:6px 0 4px!important;
  font-size:17px!important;
  line-height:1.15!important;
}
.product-copy p{
  margin-bottom:11px!important;
  font-size:11.5px!important;
  line-height:1.45!important;
  -webkit-line-clamp:2!important;
}
.product-meta{
  align-items:flex-start!important;
  gap:8px!important;
}
.product-meta strong{
  font-size:13.5px!important;
}
.product-actions{
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  gap:7px!important;
  margin-top:10px!important;
}
.product-actions .btn{
  width:min(100%,170px)!important;
  min-height:40px!important;
  padding-inline:14px!important;
  justify-content:center!important;
}
.product-actions .btn img{
  width:16px!important;
  height:16px!important;
}
.buy-now{
  min-width:0!important;
  display:inline-flex!important;
}

/* ---------- SHOP CART: compact transaction controls ---------- */
.cart-section{
  padding-top:34px!important;
}
.cart-layout{
  width:min(100%,1040px)!important;
  margin-inline:auto!important;
  gap:30px!important;
}
.cart-row{
  min-height:0!important;
  padding:14px 0!important;
}
.cart-image{
  width:78px!important;
  height:78px!important;
}
.cart-quantity button{
  width:30px!important;
  height:30px!important;
  min-height:30px!important;
  padding:0!important;
}
.cart-summary{
  padding:18px!important;
}
.cart-summary .btn{
  width:min(100%,200px)!important;
  min-height:40px!important;
}

/* ---------- SHOP CHECKOUT: one narrow vertical column ---------- */
.checkout-hero{
  padding:36px 0 28px!important;
}
.checkout-section{
  padding:34px 0 72px!important;
}
.checkout-section>.container{
  width:min(100%,680px)!important;
}
.checkout-grid{
  display:flex!important;
  flex-direction:column!important;
  width:min(100%,var(--ui-form-width))!important;
  margin-inline:auto!important;
  gap:18px!important;
}
.checkout-form{
  width:100%!important;
  max-width:var(--ui-form-width)!important;
  display:flex!important;
  flex-direction:column!important;
  gap:13px!important;
  padding:20px!important;
}
.checkout-form>div,
.checkout-form .full,
.checkout-form .legal-note,
.checkout-form button{
  grid-column:auto!important;
}
.checkout-form label{
  margin-bottom:5px!important;
  font-size:11.5px!important;
}
.checkout-form input{
  width:100%!important;
  max-width:100%!important;
  min-height:42px!important;
  height:42px!important;
  padding:0 12px!important;
}
.checkout-form .legal-note{
  margin-top:2px!important;
  padding-top:11px!important;
  font-size:11.25px!important;
  line-height:1.55!important;
}
.checkout-form #payButton{
  align-self:flex-start!important;
  width:min(100%,245px)!important;
  min-height:41px!important;
  padding:0 15px!important;
}
.checkout-summary{
  position:static!important;
  width:100%!important;
  padding:17px!important;
}
.checkout-summary h2{
  margin-bottom:12px!important;
  font-size:17px!important;
}
.checkout-line{
  padding:8px 0!important;
  font-size:12px!important;
}
.checkout-total{
  padding:13px 0!important;
  font-size:17px!important;
}
.secure-note{
  margin-top:10px!important;
  padding-top:10px!important;
}

/* Compact vertical progress rail: Cart -> Details -> Payment */
.checkout-steps{
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  gap:0!important;
  margin:0 0 4px!important;
  padding:0 0 2px!important;
}
.checkout-steps span{
  position:relative!important;
  display:flex!important;
  align-items:center!important;
  min-height:28px!important;
  padding-left:24px!important;
  font-size:10px!important;
  letter-spacing:.07em!important;
}
.checkout-steps span::after{
  content:""!important;
  position:absolute!important;
  left:4px!important;
  top:50%!important;
  width:7px!important;
  height:7px!important;
  border:1.5px solid rgba(23,23,23,.30)!important;
  border-radius:50%!important;
  background:#fff!important;
  transform:translateY(-50%)!important;
}
.checkout-steps span+span::before{
  content:""!important;
  position:absolute!important;
  left:7px!important;
  top:-10px!important;
  width:1px!important;
  height:20px!important;
  background:rgba(23,23,23,.18)!important;
}
.checkout-steps span.active::after{
  border-color:var(--bwet-gold-deep,#946a12)!important;
  background:var(--bwet-gold,#c99a2f)!important;
}

/* ---------- EVENT TICKET CHECKOUT: match the same vertical system ---------- */
.checkout-page{
  width:min(100%,680px)!important;
  margin-inline:auto!important;
  padding-inline:20px!important;
}
.checkout-page .checkout-layout{
  display:flex!important;
  flex-direction:column!important;
  width:min(100%,var(--ui-form-width))!important;
  margin-inline:auto!important;
  gap:18px!important;
}
.checkout-page form{
  width:100%!important;
}
.checkout-page .field{
  margin-bottom:12px!important;
  gap:6px!important;
}
.checkout-page .field input,
.checkout-page .field select{
  min-height:42px!important;
  height:42px!important;
  padding:0 12px!important;
}
.checkout-page .checkout-form-section{
  padding:18px 0!important;
}
.checkout-page .checkout-form-section h2{
  margin-bottom:14px!important;
  font-size:18px!important;
}
.checkout-page .checkout-button{
  width:min(100%,220px)!important;
  min-height:41px!important;
}
.checkout-page .checkout-summary{
  position:static!important;
  width:100%!important;
}
.checkout-page .checkout-progress{
  width:min(100%,var(--ui-form-width))!important;
  margin-inline:auto!important;
}

/* Consistent social + legal spacing */
.bwet-social-inner,
.legal-footer .legal-footer-inner{
  width:min(100%,1180px)!important;
}

/* Foundation nav order/spacing is corrected in markup; keep all page actions compact */
.foundation-page .btn,
.contact-options .contact-action,
.support-band .btn{
  min-height:42px!important;
}

@media(max-width:900px){
  .product-media{max-height:none!important}
  .cart-layout{grid-template-columns:1fr!important}
  .cart-summary{position:static!important}
}

@media(max-width:620px){
  .site-header .header-inner{min-height:62px!important}
  .site-header .brand-logo img,
  .site-header .site-logo img{width:100px!important;height:31px!important}
  .shop-section{padding-top:24px!important}
  .shop-tools{align-items:stretch!important}
  .shop-tool-actions{justify-content:space-between!important}
  .product-grid{grid-template-columns:1fr!important;gap:24px!important}
  .product-media{aspect-ratio:16/10!important;max-height:260px!important}
  .product-copy{padding-top:10px!important}
  .product-actions .btn{width:min(100%,160px)!important}
  .buy-now{display:inline-flex!important}
  .cart-row{grid-template-columns:64px minmax(0,1fr)!important}
  .cart-image{width:64px!important;height:64px!important}
  .checkout-section>.container{padding-inline:16px!important}
  .checkout-grid,.checkout-form,.checkout-summary{width:100%!important}
  .checkout-form{padding:17px!important}
  .checkout-form #payButton{width:min(100%,225px)!important}
  .checkout-page{padding-inline:16px!important}
}


/* ---------- STANDARD PUBLIC NAVBAR ---------- */
/* Final shared shell rules: override page-local header CSS so every public page
   uses the same dimensions, spacing, active state and mobile drawer behavior. */
.site-header{
  position:sticky!important;
  top:0!important;
  z-index:1000!important;
  background:rgba(8,8,8,.97)!important;
  border-bottom:1px solid rgba(255,255,255,.08)!important;
  backdrop-filter:blur(16px)!important;
}
.site-header .header-inner{
  min-height:66px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:28px!important;
}
.site-header .brand-logo{
  display:inline-flex!important;
  align-items:center!important;
  flex:0 0 auto!important;
}
.site-header .brand-logo img{
  width:108px!important;
  height:34px!important;
  object-fit:contain!important;
  object-position:left center!important;
}
.site-header .desktop-nav{
  display:flex!important;
  align-items:center!important;
  gap:26px!important;
}
.site-header .desktop-nav a{
  position:relative!important;
  display:inline-flex!important;
  align-items:center!important;
  gap:.5rem!important;
  padding:22px 0 20px!important;
  color:rgba(255,255,255,.68)!important;
  font-size:12.5px!important;
  font-weight:720!important;
  line-height:1!important;
  white-space:nowrap!important;
  text-decoration:none!important;
}
.site-header .desktop-nav .bnet-icon{
  width:15px!important;
  height:15px!important;
  flex:0 0 auto!important;
  opacity:.82!important;
}
.site-header .desktop-nav a::after{
  content:""!important;
  position:absolute!important;
  left:0!important;
  right:0!important;
  bottom:12px!important;
  height:2px!important;
  background:#c99a2f!important;
  transform:scaleX(0)!important;
  transform-origin:left!important;
  transition:transform .18s ease!important;
}
.site-header .desktop-nav a:hover,
.site-header .desktop-nav a.active{color:#fff!important}
.site-header .desktop-nav a:hover::after,
.site-header .desktop-nav a.active::after{transform:scaleX(1)!important}
.site-header .desktop-nav a:hover .bnet-icon,
.site-header .desktop-nav a.active .bnet-icon{
  opacity:1!important;
  color:#c99a2f!important;
}
.site-header .menu-toggle{
  display:none!important;
  width:40px!important;
  height:40px!important;
  min-height:40px!important;
  padding:0!important;
  align-items:center!important;
  justify-content:center!important;
  border:1px solid rgba(255,255,255,.18)!important;
  border-radius:50%!important;
  background:transparent!important;
  color:#fff!important;
  cursor:pointer!important;
}
.site-header .menu-toggle svg{
  width:20px!important;
  height:20px!important;
  stroke:currentColor!important;
  fill:none!important;
  stroke-width:1.8!important;
}
.site-header .mobile-nav{display:none!important}

@media(max-width:900px){
  .site-header .desktop-nav{display:none!important}
  .site-header .menu-toggle{display:inline-flex!important}
  .site-header .mobile-nav{
    position:fixed!important;
    top:66px!important;
    left:0!important;
    right:0!important;
    z-index:999!important;
    display:grid!important;
    grid-template-columns:1fr!important;
    max-height:0!important;
    overflow:hidden!important;
    background:#0b0b0b!important;
    border-bottom:1px solid rgba(255,255,255,.10)!important;
    transition:max-height .28s ease!important;
  }
  .site-header .mobile-nav.open{max-height:470px!important}
  .site-header .mobile-nav a{
    display:flex!important;
    align-items:center!important;
    gap:.65rem!important;
    padding:15px 22px!important;
    border-top:1px solid rgba(255,255,255,.07)!important;
    color:rgba(255,255,255,.74)!important;
    font-size:14px!important;
    font-weight:740!important;
    line-height:1.2!important;
    text-decoration:none!important;
  }
  .site-header .mobile-nav .bnet-icon{
    width:18px!important;
    height:18px!important;
    flex:0 0 auto!important;
    color:#c99a2f!important;
  }
  .site-header .mobile-nav a.active{color:#f0dfaf!important}
}
@media(max-width:620px){
  .site-header .header-inner{min-height:64px!important}
  .site-header .brand-logo img{width:104px!important;height:32px!important}
  .site-header .mobile-nav{top:64px!important}
}


/* ---------- FINAL HEADER ALIGNMENT: CONTACT + SHOP ---------- */
/* Keep the global navbar visually identical regardless of page-level typography/theme. */
.site-header,
.site-header .desktop-nav a,
.site-header .mobile-nav a,
.site-header .menu-toggle{
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
}
.site-header .desktop-nav .bnet-icon{
  display:block!important;
}
/* Contact no longer uses a large page hero/header. Start directly with contact methods. */
.contact-options{
  padding-top:52px!important;
}
@media(max-width:620px){
  .contact-options{padding-top:38px!important;}
}

/* ================================================================
   PUBLIC PAGE FOOTER ANCHOR
   Keep the footer at the viewport bottom on short pages while
   allowing it to follow content normally on long pages.
   ================================================================ */
body{
  min-height:100vh;
  min-height:100svh;
  display:flex;
  flex-direction:column;
}
body > main{
  flex:1 0 auto;
}
body > footer{
  flex:0 0 auto;
  margin-top:auto;
}
