/* ============================================================
   AE SPORTS - HEADER
   Transparent over the ink hero, solid on transaction pages.
   ============================================================ */

header#header [data-row]{transition:background var(--ae-t-overlay) var(--ae-ease)}

/* --- Transparent over the homepage hero --------------------- */
body.home header#header{
  position:absolute;top:0;left:0;right:0;z-index:300;
  background:transparent;
  border-bottom:0;
  box-shadow:none;
}
body.admin-bar.home header#header{top:32px}
body.home header#header [data-row]{background:transparent;min-height:92px}
body.home header#header .site-logo-container img,
body.home header#header [data-id="logo"] img{filter:brightness(0) invert(1)}
body.home header#header [data-id="menu"] .menu > li > a{color:var(--ae-on-ink)}
body.home header#header [data-id="menu"] .menu > li > a:hover{color:var(--ae-seal)}
body.home header#header svg{color:var(--ae-on-ink);fill:var(--ae-on-ink)}
body.home header#header a:hover svg{color:var(--ae-seal);fill:var(--ae-seal)}

/* --- Solid on every other page ------------------------------ */
body:not(.home) header#header{
  background:var(--ae-paper);
  border-bottom:1px solid var(--ae-line-paper);
}
body:not(.home) header#header [data-row]{background:var(--ae-paper)}
body:not(.home) header#header .site-logo-container img{filter:none}
body:not(.home) header#header [data-id="menu"] .menu > li > a{color:var(--ae-on-paper)}
body:not(.home) header#header [data-id="menu"] .menu > li > a:hover{color:var(--ae-seal-deep)}
body:not(.home) header#header svg{color:var(--ae-on-paper);fill:var(--ae-on-paper)}

/* --- Navigation typography ---------------------------------- */
header#header [data-id="menu"] .menu > li > a{
  font-family:var(--ae-ff);
  font-size:13px;
  font-weight:700;
  letter-spacing:.13em;
  text-transform:uppercase;
  transition:color var(--ae-t-micro) var(--ae-ease);
}
header#header [data-id="menu"] .menu > li{margin:0}
header#header [data-id="menu"] .menu > li > a{padding-inline:18px}

/* --- Dropdown ------------------------------------------------ */
header#header .sub-menu{
  background:var(--ae-paper-raised);
  border:1px solid var(--ae-line-paper);
  border-radius:var(--ae-r0);
  box-shadow:var(--ae-sh-overlay);
  padding:var(--ae-s2) 0;
  min-width:230px;
}
header#header .sub-menu li a{
  font-family:var(--ae-ff);
  font-size:13px;
  font-weight:600;
  letter-spacing:.06em;
  text-transform:none;
  color:var(--ae-on-paper);
  padding:13px 20px;
  min-height:var(--ae-tap);
  display:flex;
  align-items:center;
}
header#header .sub-menu li a:hover{background:var(--ae-paper-sunk);color:var(--ae-on-paper)}

/* --- Cart count ---------------------------------------------- */
header#header .ct-cart-count{
  background:var(--ae-seal);
  color:var(--ae-ink);
  font-family:var(--ae-ff);
  font-size:var(--ae-l1);
  font-weight:800;
  border-radius:var(--ae-r-chip);
}

/* --- Tap targets --------------------------------------------- */
header#header [data-id="cart"] > a,
header#header [data-id="search"] > a,
header#header [data-id="trigger"]{
  min-width:var(--ae-tap);
  min-height:var(--ae-tap);
  display:flex;
  align-items:center;
  justify-content:center;
}
header#header svg{width:22px;height:22px}

/* --- Mobile --------------------------------------------------- */
@media(max-width:999px){
  header#header [data-row]{min-height:68px}
  header#header .site-logo-container img,
  header#header [data-id="logo"] img{height:36px;max-height:36px;width:auto}
  body.home header#header [data-row]{min-height:68px}
}

/* --- Off-canvas menu ------------------------------------------ */
#offcanvas .menu > li > a{
  font-family:var(--ae-ff);
  font-size:16px;
  font-weight:700;
  letter-spacing:.02em;
  text-transform:none;
  min-height:52px;
  display:flex;
  align-items:center;
}
#offcanvas .sub-menu li a{min-height:48px;font-size:15px;font-weight:400}

/* --- Mini cart drawer ----------------------------------------- */
.ct-cart-content{
  background:var(--ae-paper-raised);
  border:1px solid var(--ae-line-paper);
  border-radius:var(--ae-r0);
  box-shadow:var(--ae-sh-overlay);
}
.ct-cart-content a.product-title{
  font-family:var(--ae-ff);
  font-size:13px;
  font-weight:700;
  color:var(--ae-on-paper);
  text-transform:none;
  letter-spacing:0;
}
.ct-cart-content .quantity,
.ct-cart-content .woocommerce-Price-amount{
  font-size:13px;color:var(--ae-on-paper-2);font-variant-numeric:tabular-nums;
}
.ct-cart-content li.mini_cart_item img{
  background:var(--ae-paper-sunk);
  border-radius:var(--ae-r0);
  object-fit:contain;
}
/* Cart count: Blocksy sets 10px; hold the 12px floor. */
body header#header [data-id="cart"] .ct-cart-count{font-size:var(--ae-l1);min-width:18px;height:18px;line-height:18px}

/* ============================================================
   FIXES - 11 Aug 2026
   ============================================================ */

/* The logo already carries the brand. Blocksy was also printing the site
   title next to it, which overlapped the logo and the ticker. */
header#header .site-title-container,
header#header .site-title,
header#header .site-description{display:none}

/* The homepage opens with the ticker band, not the hero, so an absolutely
   positioned header sat on top of it. Put the header back in flow there and
   give it the ink ground it was floating over anyway - same look, no overlap. */
body.home header#header{
  position:relative;
  background:var(--ae-ink);
  border-bottom:1px solid var(--ae-line-ink);
}
body.admin-bar.home header#header{top:0}
body.home header#header [data-row]{background:var(--ae-ink)}
/* The logo anchor is inline, so it collapsed to a 16px line box while the
   image rendered at 36px - leaving a 16px tap target. Make it wrap the image. */
header#header .site-logo-container{
  display:inline-flex;
  align-items:center;
  min-height:var(--ae-tap);
}
header#header .site-logo-container img{display:block}

/* Blocksy renders the live cart badge as .ct-dynamic-count-cart. */
body header#header .ct-dynamic-count-cart{
  font-size:var(--ae-l1);
  min-width:18px;height:18px;line-height:18px;
}