/* AppleGang header CSS – ECOA-509 / SPEC-002 */
/* Color tokens */
:root {
  --ag-green:   #66bf3a;
  --ag-navy:    #1B2B40;
  --ag-red:     #E63946;
  --ag-paper:   #FAF9F7;
  --ag-lavender:#EEE8F4;
  --ag-white:   #FFFFFF;
}

/* ── Wrapper ───────────────────────────────────────────────────────────── */
.ag-header-wrapper {
  position: sticky;
  top: 0;
  z-index: 1000;
  background: var(--ag-white);
  box-shadow: 0 1px 0 rgba(0,0,0,.07);
  transition: box-shadow 0.2s ease;
}
.ag-header--sticky .ag-header-wrapper,
.ag-header-wrapper.ag-header--sticky {
  box-shadow: 0 2px 12px rgba(0,0,0,.12);
}

/* ── Band 1: Promo strip ───────────────────────────────────────────────── */
.ag-promo-strip {
  background: var(--ag-red);
  color: var(--ag-white);
  height: 36px;
  display: flex;
  align-items: center;
  overflow: hidden;
}
.ag-promo-strip--club {
  background: var(--ag-green);
}
.ag-promo-strip__inner {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  width: 100%;
  position: relative;
  padding: 0 40px;
}
.ag-promo-strip__text {
  font-family: 'DM Sans', sans-serif;
  font-size: 13px;
  text-align: center;
}
.ag-promo-code {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px;
  font-weight: 700;
  background: rgba(255,255,255,.22);
  border: 1px solid rgba(255,255,255,.4);
  border-radius: 4px;
  padding: 1px 7px;
  letter-spacing: 0.04em;
}
.ag-promo-strip__close {
  position: absolute;
  right: 0;
  background: none;
  border: none;
  color: var(--ag-white);
  cursor: pointer;
  padding: 8px;
  display: flex;
  align-items: center;
  opacity: 0.8;
  transition: opacity 0.15s;
}
.ag-promo-strip__close:hover { opacity: 1; }

@media (max-width: 559px) {
  .ag-promo-strip { height: 26px; }
  .ag-promo-strip__text { font-size: 11px; }
}

/* ── Band 2: Main header nav-top ───────────────────────────────────────── */
.ag-header-nav-top {
  height: 78px;
  display: flex;
  align-items: center;
  background: var(--ag-white);
  transition: height 0.2s ease;
}
.ag-header--sticky .ag-header-nav-top {
  height: 60px;
}
.ag-header-nav-top__inner {
  display: flex;
  align-items: center;
  gap: 20px;
  width: 100%;
  max-width: 1320px;
  margin: 0 auto;
  padding: 0 16px;
}

/* Logo */
.ag-logo { flex-shrink: 0; }
.ag-logo__link {
  display: flex;
  flex-direction: column;
  text-decoration: none;
  line-height: 1;
}
.ag-logo__wordmark {
  font-family: 'Bricolage Grotesque', 'DM Sans', sans-serif;
  font-weight: 700;
  font-size: 26px;
  line-height: 1;
}
.ag-logo__apple { color: var(--ag-green); }
.ag-logo__gang  { color: var(--ag-navy); }
.ag-logo__tagline {
  font-family: 'JetBrains Mono', monospace;
  font-size: 8px;
  color: #888;
  letter-spacing: 0.05em;
  margin-top: 2px;
}
@media (max-width: 559px) {
  .ag-logo__tagline { display: none; }
}

/* Search */
.ag-header-search {
  flex: 1;
  max-width: 560px;
  position: relative;
}
.ag-search-form {
  display: flex;
  align-items: center;
  border: 1.5px solid var(--ag-green);
  border-radius: 8px;
  overflow: hidden;
  height: 44px;
  background: var(--ag-white);
  transition: height 0.2s ease;
}
.ag-header--sticky .ag-header-search .ag-search-form {
  height: 38px;
}
.ag-search-input {
  flex: 1;
  border: none;
  outline: none;
  padding: 0 12px;
  font-family: 'DM Sans', sans-serif;
  font-size: 14px;
  background: transparent;
  color: var(--ag-navy);
}
.ag-search-btn {
  width: 44px;
  height: 100%;
  flex-shrink: 0;
  background: var(--ag-green);
  border: none;
  cursor: pointer;
  color: var(--ag-white);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.15s;
}
.ag-search-btn:hover { background: #235540; }

/* Search suggestions dropdown */
.ag-search-suggestions {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  right: 0;
  background: var(--ag-white);
  border: 1px solid #e0e0e0;
  border-radius: 8px;
  box-shadow: 0 4px 16px rgba(0,0,0,.1);
  z-index: 1010;
  overflow: hidden;
}
.ag-suggestion {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 14px;
  cursor: pointer;
  font-family: 'DM Sans', sans-serif;
  font-size: 14px;
  color: var(--ag-navy);
}
.ag-suggestion:hover,
.ag-suggestion--active {
  background: var(--ag-paper);
}
.ag-suggestion__price {
  font-weight: 600;
  color: var(--ag-green);
  font-size: 13px;
}

@media (min-width: 1024px) and (max-width: 1279px) {
  .ag-header-search { max-width: 420px; }
}
@media (max-width: 1023px) {
  .ag-header-search { display: none; }
}

/* Actions */
.ag-header-actions {
  display: flex;
  align-items: center;
  gap: 4px;
  margin-left: auto;
}
.ag-action-link {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border-radius: 6px;
  text-decoration: none;
  color: var(--ag-navy);
  font-family: 'DM Sans', sans-serif;
  font-size: 13px;
  font-weight: 600;
  transition: background 0.15s, color 0.15s;
}
.ag-action-link:hover {
  background: var(--ag-paper);
  color: var(--ag-green);
}
.ag-action-icon {
  flex-shrink: 0;
}

/* Cart badge */
.ag-cart-icon-wrap {
  position: relative;
  display: inline-flex;
}
.ag-cart-badge {
  position: absolute;
  top: -6px;
  right: -8px;
  min-width: 18px;
  height: 18px;
  background: var(--ag-green);
  color: var(--ag-white);
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px;
  font-weight: 700;
  border-radius: 9px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 4px;
  line-height: 1;
}
.ag-cart-badge--hidden { display: none; }

/* Logged-in avatar */
.ag-avatar {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--ag-green);
  color: var(--ag-white);
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  text-transform: uppercase;
}

/* Hamburger */
.ag-hamburger {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  padding: 8px;
  background: none;
  border: none;
  cursor: pointer;
  flex-shrink: 0;
}
.ag-hamburger__line {
  display: block;
  width: 22px;
  height: 2px;
  background: var(--ag-navy);
  border-radius: 2px;
  transition: transform 0.2s, opacity 0.2s;
}

/* Mobile search row */
.ag-header__search-row {
  background: var(--ag-white);
  padding: 8px 0 10px;
}
.ag-header__search-row .ag-search-form {
  height: 40px;
}
.ag-search-row--hidden {
  display: none;
}

/* ── Band 3: Category nav ───────────────────────────────────────────────── */
.ag-catnav {
  position: relative;
  height: 48px;
  background: #ffffff;
  border-top: 1px solid #e0e0e0;
  border-bottom: 1px solid #e0e0e0;
}
.ag-catnav__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 100%;
  max-width: 1320px;
  margin: 0 auto;
  padding: 0 16px;
}
.ag-catnav__nav {
  display: flex;
  align-items: center;
  height: 100%;
  flex: 1 1 0;
  min-width: 0;
  overflow-x: clip;
  overflow-y: visible;
  flex-wrap: nowrap;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.ag-catnav__nav::-webkit-scrollbar { display: none; }

/* Catnav list (rendered by ps_mainmenu hook override) */
.ag-catnav__list {
  display: flex;
  align-items: center;
  list-style: none;
  margin: 0;
  padding: 0;
  height: 100%;
  gap: 0;
  flex-wrap: nowrap;
}
.ag-catnav__item {
  position: static;
  height: 100%;
  display: flex;
  align-items: center;
}
.ag-catnav__link {
  display: flex;
  align-items: center;
  gap: 3px;
  padding: 0 10px;
  height: 100%;
  font-family: 'DM Sans', sans-serif;
  font-size: 13px;
  font-weight: 600;
  color: #3d3d3d;
  text-decoration: none;
  white-space: nowrap;
  border-bottom: 2px solid transparent;
  transition: color 0.15s, border-color 0.15s;
}
.ag-catnav__link:hover,
.ag-catnav__item--active .ag-catnav__link {
  color: #52a82d;
  border-bottom-color: var(--ag-green);
}
.ag-catnav__item--sale .ag-catnav__link {
  color: var(--ag-red);
}
.ag-catnav__item--sale .ag-catnav__link:hover {
  color: var(--ag-red);
  border-bottom-color: var(--ag-red);
}
.ag-catnav__chevron {
  flex-shrink: 0;
  transition: transform 0.2s;
}
.ag-catnav__item--open .ag-catnav__chevron {
  transform: rotate(180deg);
}

/* Trust line */
.ag-catnav__trust {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
}
.ag-trust-expedite {
  display: flex;
  align-items: center;
  gap: 5px;
  font-family: 'DM Sans', sans-serif;
  font-size: 12px;
  font-weight: 600;
  color: #3d3d3d;
  white-space: nowrap;
}
.ag-trust-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--ag-green);
  flex-shrink: 0;
}
.ag-trust-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  background: var(--ag-green);
  color: #ffffff;
  font-family: 'DM Sans', sans-serif;
  font-size: 12px;
  font-weight: 700;
  padding: 3px 10px;
  border-radius: 20px;
  white-space: nowrap;
  text-decoration: none;
}
.ag-trust-badge::before {
  content: '★';
  font-size: 11px;
}
@media (max-width: 1099px) {
  .ag-catnav__trust { display: none; }
}
@media (max-width: 767px) {
  .ag-catnav { display: none; }
}

/* ── Hide ps_searchbar from catnav + drawer — search is in main header only ── */
.ag-catnav__nav .search-widget,
.ag-catnav__nav .search-widgets,
.ag-catnav__nav #search_widget,
.ag-drawer__nav .search-widget,
.ag-drawer__nav .search-widgets,
.ag-drawer__nav #search_widget {
  display: none !important;
}

/* ── Mega menu ─────────────────────────────────────────────────────────── */
/* Extra tokens used only within the mega menu */
:root {
  --ag-blue:          #3D6FD6;
  --ag-mega-lavender: #E8EAF6;
  --ag-line:          #E5E7EB;
}

.ag-mega-menu {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  z-index: 999;
  background: var(--ag-white);
  border-top: 2px solid var(--ag-green);
  box-shadow: 0 8px 32px rgba(0,0,0,.12);
  animation: agMegaIn 0.18s ease;
}
@keyframes agMegaIn {
  from { opacity: 0; transform: translateY(-6px); }
  to   { opacity: 1; transform: translateY(0); }
}
.ag-mega-menu__inner {
  display: grid;
  grid-template-columns: 240px 1fr 300px;
  min-height: 280px;
  max-height: 580px;
  overflow: hidden;
  max-width: 1320px;
  margin: 0 auto;
}
.ag-mega-menu--compact .ag-mega-menu__inner {
  grid-template-columns: 1fr 300px;
}
/* ECOA-1282/ECOA-1425: Samsung top-level link — unified bold weight (600) to match all
   other top-level categories per Lukas; model-rich 2-col nav|body panel unchanged. */
.ag-catnav__item--samsung .ag-catnav__link {
  font-weight: 600;
}
/* ECOA-1312/ECOA-1425: Xiaomi top-level link — unified bold weight (600) to match all
   other top-level categories per Lukas; Xiaomi orange finder-CTA accent unchanged. */
.ag-catnav__item--xiaomi .ag-catnav__link {
  font-weight: 600;
}
.ag-mega-menu--xiaomi .ag-mega-menu__promo--finder .ag-mega-menu__promo-tag {
  color: #ff6700;
}
.ag-mega-menu--xiaomi .ag-mega-menu__promo--finder .ag-mega-menu__promo-btn {
  border-color: #ff6700;
  color: #ff6700;
}
.ag-mega-menu--no-promo .ag-mega-menu__inner {
  grid-template-columns: 240px 1fr;
}

/* Col 1: subcategory navigator */
.ag-mega-menu__nav {
  background: var(--ag-paper);
  padding: 20px 0;
  border-right: 1px solid var(--ag-line);
  overflow-y: auto;
}
.ag-mega-menu__nav-heading {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: #9aa0a8;
  font-weight: 700;
  margin: 0 0 8px;
  padding: 0 22px;
}
.ag-mega-menu__nav-sub {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 9px 22px;
  font-family: 'DM Sans', sans-serif;
  font-size: 14px;
  font-weight: 500;
  color: var(--ag-navy);
  text-decoration: none;
  border-left: 3px solid transparent;
  line-height: 1.3;
  cursor: pointer;
  transition: background 0.12s, color 0.12s;
}
.ag-mega-menu__nav-sub:hover {
  background: var(--ag-white);
  color: #2e8c32;
}
.ag-mega-menu__nav-sub--active {
  background: var(--ag-white);
  color: #2e8c32;
  border-left-color: var(--ag-green);
  font-weight: 700;
}
.ag-mega-menu__nav-divider {
  margin: 14px 22px;
  border: 0;
  border-top: 1px solid var(--ag-line);
}
.ag-mega-menu__nav-all {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 9px 22px;
  font-family: 'DM Sans', sans-serif;
  font-size: 13px;
  font-weight: 700;
  color: #2e8c32;
  text-decoration: none;
}
.ag-mega-menu__nav-all:hover { text-decoration: underline; }

/* Col 2: body panels */
.ag-mega-menu__body {
  padding: 24px 28px;
  overflow-y: auto;
  max-height: 580px;
}
.ag-mega-menu__body-panel { display: none; }
.ag-mega-menu__body-panel--active { display: block; }
.ag-mega-menu__body-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 18px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--ag-line);
}
.ag-mega-menu__body-title {
  font-family: 'Bricolage Grotesque', 'DM Sans', sans-serif;
  font-weight: 700;
  font-size: 18px;
  letter-spacing: -.005em;
  color: var(--ag-navy);
  margin: 0;
}
.ag-mega-menu__group { margin-bottom: 20px; }
.ag-mega-menu__group:last-child { margin-bottom: 0; }
.ag-mega-menu__group-label {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px;
  letter-spacing: .12em;
  color: #9aa0a8;
  text-transform: uppercase;
  font-weight: 700;
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.ag-mega-menu__group-label::after {
  content: '';
  flex: 1;
  height: 1px;
  background: var(--ag-line);
}
.ag-mega-menu__models-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2px 14px;
}
.ag-mega-menu__model {
  display: flex;
  align-items: center;
  padding: 7px 8px;
  border-radius: 6px;
  font-family: 'DM Sans', sans-serif;
  font-size: 13px;
  color: var(--ag-navy);
  text-decoration: none;
  line-height: 1.3;
}
.ag-mega-menu__model:hover {
  background: #ecf7ed;
  color: #2e8c32;
}

/* Compact variant: links grid */
.ag-mega-menu__links-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.ag-mega-menu__links-col-heading {
  display: block;
  font-family: 'Bricolage Grotesque', 'DM Sans', sans-serif;
  font-weight: 700;
  font-size: 11px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: #2e8c32;
  text-decoration: none;
  margin-bottom: 10px;
  padding-bottom: 6px;
  border-bottom: 1px solid var(--ag-line);
}
.ag-mega-menu__links-col-item {
  display: block;
  padding: 5px 0;
  font-family: 'DM Sans', sans-serif;
  font-size: 13px;
  color: var(--ag-navy);
  text-decoration: none;
}
.ag-mega-menu__links-col-item:hover { color: #2e8c32; }

/* Col 3: promo panel */
.ag-mega-menu__promo {
  background: var(--ag-mega-lavender);
  padding: 22px 22px 24px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 14px;
  border-left: 1px solid var(--ag-line);
}
.ag-mega-menu__promo-tag {
  display: block;
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--ag-blue);
  font-weight: 700;
}
.ag-mega-menu__promo-title {
  font-family: 'Bricolage Grotesque', 'DM Sans', sans-serif;
  font-weight: 700;
  font-size: 22px;
  letter-spacing: -.015em;
  color: var(--ag-navy);
  line-height: 1.1;
  margin: 8px 0 4px;
}
.ag-mega-menu__promo-text {
  font-family: 'DM Sans', sans-serif;
  font-size: 13px;
  line-height: 1.5;
  color: #555;
  margin: 0;
}
.ag-mega-menu__promo-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 12px 16px;
  background: var(--ag-blue);
  color: var(--ag-white);
  border-radius: 8px;
  font-family: 'DM Sans', sans-serif;
  font-weight: 700;
  font-size: 12px;
  letter-spacing: .04em;
  text-decoration: none;
  transition: background 0.15s;
}
.ag-mega-menu__promo-btn:hover { background: #2d55b8; }
.ag-mega-menu__promo-links {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding-top: 14px;
  border-top: 1px solid rgba(31,42,68,.08);
}
.ag-mega-menu__promo-link {
  font-family: 'DM Sans', sans-serif;
  font-size: 12px;
  color: var(--ag-navy);
  text-decoration: none;
  opacity: 0.8;
}
.ag-mega-menu__promo-link:hover { color: #2e8c32; opacity: 1; }

/* ── Mobile drawer ─────────────────────────────────────────────────────── */
.ag-drawer-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.45);
  z-index: 1100;
}
.ag-drawer-overlay--visible { display: block; }

.ag-drawer {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  width: 340px;
  max-width: calc(100vw - 40px);
  background: var(--ag-white);
  z-index: 1101;
  display: flex;
  flex-direction: column;
  transform: translateX(-100%);
  transition: transform 0.28s cubic-bezier(.4,0,.2,1);
  overflow-y: auto;
}
.ag-drawer--open {
  transform: translateX(0);
}

/* Drawer top bar */
.ag-drawer__top {
  height: 56px;
  background: var(--ag-navy);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 16px;
  flex-shrink: 0;
}
.ag-drawer__logo {
  font-family: 'Bricolage Grotesque', 'DM Sans', sans-serif;
  font-size: 20px;
  font-weight: 700;
  text-decoration: none;
}
.ag-drawer__logo .ag-logo__apple { color: var(--ag-green); }
.ag-drawer__logo .ag-logo__gang  { color: var(--ag-white); }
.ag-drawer__close {
  background: none;
  border: none;
  color: var(--ag-white);
  cursor: pointer;
  padding: 8px;
  display: flex;
  align-items: center;
  opacity: 0.8;
  transition: opacity 0.15s;
}
.ag-drawer__close:hover { opacity: 1; }

/* Drawer search */
.ag-drawer__search {
  padding: 12px 16px;
  border-bottom: 1px solid #eee;
}
.ag-search-form--drawer {
  height: 40px;
}
.ag-search-form--drawer .ag-search-btn {
  width: 40px;
}

/* Drawer nav */
.ag-drawer__nav {
  flex: 1;
  overflow-y: auto;
}

/* Drawer nav — reuse catnav list items but with drawer styling */
.ag-drawer__nav .ag-catnav__list,
.ag-drawer__list {
  display: block;
  list-style: none;
  margin: 0;
  padding: 8px 0;
}
.ag-drawer__nav .ag-catnav__item,
.ag-drawer__list > li {
  display: block;
  height: auto;
}
.ag-drawer__nav .ag-catnav__link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: auto;
  padding: 12px 20px;
  color: var(--ag-navy);
  font-size: 14px;
  border-bottom: none;
  border-bottom: 1px solid #f0f0f0;
}
.ag-drawer__nav .ag-catnav__link:hover {
  background: var(--ag-paper);
  color: var(--ag-green);
  border-bottom-color: #f0f0f0;
}
.ag-drawer__nav .ag-catnav__item--sale .ag-catnav__link { color: var(--ag-red); }
/* ECOA-1020 / ECOA-884 — drawer accordion: mega-menu becomes inline panel inside drawer */
.ag-drawer__nav .ag-mega-menu {
  display: none;
  position: static;
  box-shadow: none;
  border-top: none;
  border-left: 3px solid var(--ag-green);
  background: var(--ag-paper);
  animation: none;
  margin: 0;
}
.ag-drawer__nav .ag-catnav__item--open > .ag-mega-menu {
  display: block;
}
.ag-drawer__nav .ag-mega-menu__inner {
  display: block;
  min-height: 0;
  max-height: none;
  overflow: visible;
}
/* Hide desktop-only promo panel and body panels (Variant A) */
.ag-drawer__nav .ag-mega-menu__promo { display: none; }
.ag-drawer__nav .ag-mega-menu:not(.ag-mega-menu--compact) .ag-mega-menu__body { display: none; }
.ag-drawer__nav .ag-mega-menu__nav-heading { display: none; }
.ag-drawer__nav .ag-mega-menu__nav-divider { display: none; }
/* Variant A: nav subcategory links */
.ag-drawer__nav .ag-mega-menu__nav {
  padding: 4px 0;
  border-right: none;
  overflow: visible;
  background: transparent;
}
.ag-drawer__nav .ag-mega-menu__nav-sub,
.ag-drawer__nav .ag-mega-menu__nav-all {
  padding: 10px 20px 10px 28px;
  border-left: none;
  font-size: 14px;
  color: var(--ag-navy);
  background: transparent;
  font-weight: 500;
}
/* Neutralize desktop active/hover state so all items look the same in drawer */
.ag-drawer__nav .ag-mega-menu__nav-sub--active {
  color: var(--ag-navy);
  background: transparent;
  font-weight: 500;
}
.ag-drawer__nav .ag-mega-menu__nav-sub:hover,
.ag-drawer__nav .ag-mega-menu__nav-all:hover {
  color: var(--ag-green);
  background: transparent;
}
/* Variant B compact: links grid */
.ag-drawer__nav .ag-mega-menu--compact .ag-mega-menu__body-head { display: none; }
.ag-drawer__nav .ag-mega-menu--compact .ag-mega-menu__body { display: block; }
.ag-drawer__nav .ag-mega-menu--compact .ag-mega-menu__links-grid { display: block; }
.ag-drawer__nav .ag-mega-menu--compact .ag-mega-menu__links-col { margin: 0; }
.ag-drawer__nav .ag-mega-menu--compact .ag-mega-menu__links-col-heading {
  display: block;
  padding: 10px 20px 10px 28px;
  font-size: 14px;
}
.ag-drawer__nav .ag-mega-menu--compact .ag-mega-menu__links-col-item {
  display: block;
  padding: 8px 20px 8px 36px;
  font-size: 13px;
}

/* Drawer shortcuts */
.ag-drawer__shortcuts {
  display: flex;
  border-top: 1px solid #eee;
  border-bottom: 1px solid #eee;
}
.ag-drawer__shortcut {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 14px;
  font-family: 'DM Sans', sans-serif;
  font-size: 13px;
  font-weight: 600;
  color: var(--ag-navy);
  text-decoration: none;
}
.ag-drawer__shortcut:first-child { border-right: 1px solid #eee; }
.ag-drawer__shortcut:hover { background: var(--ag-paper); color: var(--ag-green); }

/* Drawer footer */
.ag-drawer__footer {
  background: var(--ag-paper);
  padding: 16px 20px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  border-top: 1px solid #ece9e4;
}
.ag-drawer__footer-link {
  display: flex;
  align-items: center;
  gap: 8px;
  font-family: 'DM Sans', sans-serif;
  font-size: 13px;
  color: #555;
  text-decoration: none;
}
.ag-drawer__footer-link:hover { color: var(--ag-green); }

/* ── Responsive helpers ────────────────────────────────────────────────── */
.d-none { display: none !important; }
@media (min-width: 992px) {
  .d-lg-none  { display: none !important; }
  .d-lg-inline{ display: inline !important; }
  .d-lg-flex  { display: flex !important; }
}
@media (min-width: 768px) {
  .d-md-flex   { display: flex !important; }
  .d-md-inline { display: inline !important; }
}
@media (max-width: 767px) {
  .d-md-flex   { display: none !important; }
  .ag-header-nav-top { height: auto; min-height: 56px; }
}

/* ── ECOA-511 Fix 1: Mobile drawer — show default ps_mainmenu categories ── */
/* The {hook h='displayTop'} renders default ps_mainmenu with hidden-sm-down
   which hides the list at ≤767px. Override inside the drawer and ensure
   items stack vertically (classic theme makes them inline/flex by default). */
.ag-drawer__nav .hidden-sm-down {
  display: block !important;
}
.ag-drawer__nav #_desktop_top_menu {
  width: 100%;
  background: transparent;
}
/* ul — block list */
.ag-drawer__nav .top-menu[data-depth="0"] {
  display: block !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 8px 0 !important;
  width: 100% !important;
}
/* li — each item takes full width, no float */
.ag-drawer__nav .top-menu[data-depth="0"] > li {
  display: block !important;
  float: none !important;
  width: 100% !important;
}
/* Sub-menu containers: hidden by default; .ag-sub--open added by JS */
.ag-drawer__nav .sub-menu.collapse,
.ag-drawer__nav .collapse:not(.ag-sub--open) {
  display: none;
}
/* Show when toggled — covers both .sub-menu.collapse (depth 1) and plain
   .collapse (depth 2+) since Bootstrap strips .sub-menu from deeper levels */
.ag-drawer__nav .collapse.ag-sub--open {
  display: block !important;
}
/* Reset Bootstrap popover/popover-body styles so sub-menu is static */
.ag-drawer__nav .popover,
.ag-drawer__nav .sub-menu {
  position: static !important;
  max-width: none !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  z-index: auto !important;
  opacity: 1 !important;
  visibility: visible !important;
  font-size: inherit !important;
  word-wrap: normal !important;
}
/* Sub-menu list (depth 1 & 2) */
.ag-drawer__nav .top-menu[data-depth="1"],
.ag-drawer__nav .top-menu[data-depth="2"] {
  display: block !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 0 0 12px !important;
  width: 100% !important;
}
.ag-drawer__nav .top-menu[data-depth="1"] > li,
.ag-drawer__nav .top-menu[data-depth="2"] > li {
  display: block !important;
  float: none !important;
  width: 100% !important;
}
/* Depth-1 / depth-2 links */
.ag-drawer__nav .dropdown-submenu {
  display: block !important;
  padding: 10px 18px 10px 18px !important;
  color: #555 !important;
  font-family: 'DM Sans', sans-serif;
  font-size: 13px;
  font-weight: 400;
  border-bottom: 1px solid #f5f5f5;
  text-decoration: none;
}
.ag-drawer__nav .dropdown-submenu:hover { background: var(--ag-paper); color: var(--ag-green) !important; }
/* Top-level category links */
.ag-drawer__nav .category > .dropdown-item {
  display: block !important;
  position: relative;
  padding: 14px 44px 14px 18px !important;
  color: var(--ag-navy);
  font-family: 'DM Sans', sans-serif;
  font-size: 14px;
  font-weight: 600;
  border-bottom: 1px solid #f0f0f0;
  text-decoration: none;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.4;
  width: 100%;
  box-sizing: border-box;
}
.ag-drawer__nav .category > .dropdown-item:hover,
.ag-drawer__nav .category > .dropdown-item:focus {
  background: var(--ag-paper);
  color: var(--ag-green);
}
/* Sale items in red */
.ag-drawer__nav .category.sfn-sale > .dropdown-item,
.ag-drawer__nav .category[class*="sale"] > .dropdown-item {
  color: var(--ag-red);
}

/* Toggle chevron — absolutely positioned on the right of the <a> */
.ag-drawer__nav .float-xs-right {
  position: absolute !important;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  display: inline-flex !important;
  align-items: center;
  pointer-events: auto;
  margin: 0 !important;
  float: none !important;
}
.ag-drawer__nav .collapse-icons {
  display: inline-flex !important;
  cursor: pointer;
  padding: 6px;
  background: none;
  border: none;
  color: var(--ag-navy);
  -webkit-tap-highlight-color: transparent;
}
.ag-drawer__nav .collapse-icons .material-icons {
  font-size: 20px;
  line-height: 1;
}
/* Default: show ▾ (add), hide ▴ (remove) */
.ag-drawer__nav .collapse-icons .remove { display: none !important; }
.ag-drawer__nav .collapse-icons .add    { display: block !important; }
/* When expanded: swap icons */
.ag-drawer__nav .collapse-icons[aria-expanded="true"] .remove { display: block !important; }
.ag-drawer__nav .collapse-icons[aria-expanded="true"] .add    { display: none !important; }

/* ── ECOA-687: Promo panel product image ────────────────────────────────── */
.ag-mega-menu__promo-img-wrap {
  display: block;
  border-radius: 8px;
  overflow: hidden;
  flex-shrink: 0;
}
.ag-mega-menu__promo-img {
  width: 100%;
  height: 160px;
  object-fit: cover;
  object-position: center top;
  display: block;
  transition: transform 0.2s ease;
}
.ag-mega-menu__promo-img-wrap:hover .ag-mega-menu__promo-img {
  transform: scale(1.03);
}

/* ── ECOA-511 Fix 3: Hide header mobile search row on ≤767px ─────────────── */
@media (max-width: 767px) {
  .ag-header__search-row {
    display: none !important;
  }
}