/* =========================================================
   TOP ANNOUNCEMENT BAR
========================================================= */
.pa-topbar{
  background:var(--pa-accent);
  color:#fff;
}
.pa-topbar p{
  margin:0;
  padding:8px 0;
  font-size:13px;
  text-align:center;
  letter-spacing:.01em;
}

/* =========================================================
   HEADER
========================================================= */
.pa-header{
  background:var(--pa-paper);
  border-bottom:1px solid var(--pa-border);
  position:sticky;
  top:0;
  z-index:60;
}
.pa-header__inner{
  display:flex;
  align-items:center;
  gap:20px;
  padding:14px var(--pa-gutter);
  min-height:76px;
}
.pa-header__logo{
  display:flex;
  align-items:center;
  margin-right:auto;
}
.pa-header__logo img{
  max-height:52px;
  width:auto;
}
.pa-logo-text{
  font-family:var(--pa-font-display);
  font-weight:800;
  font-size:26px;
  color:var(--pa-accent);
  letter-spacing:-.02em;
}
.pa-logo-text::first-letter{color:var(--pa-primary);}

.pa-header__nav{margin:0 auto;}
.pa-header__nav .nav-menu{
  display:flex;
  align-items:center;
  gap:6px;
}
.pa-header__nav .nav-menu > li{position:relative;}
.pa-header__nav .nav-menu > li > a{
  display:flex;
  align-items:center;
  gap:4px;
  padding:10px 14px;
  font-weight:600;
  font-size:15px;
  border-radius:8px;
  color:var(--pa-ink);
  transition:background .15s ease,color .15s ease;
}
.pa-header__nav .nav-menu > li > a:hover,
.pa-header__nav .nav-menu > li.current-menu-item > a{
  background:var(--pa-primary-light);
  color:var(--pa-primary);
}
.dropdown-caret{font-size:10px;margin-left:2px;}

.pa-header__nav .sub-menu{
  position:absolute;
  top:100%;
  left:0;
  min-width:220px;
  background:var(--pa-paper);
  border:1px solid var(--pa-border);
  border-radius:var(--pa-radius);
  box-shadow:var(--pa-shadow-lg);
  padding:8px;
  opacity:0;
  visibility:hidden;
  transform:translateY(6px);
  transition:opacity .15s ease, transform .15s ease, visibility .15s ease;
  z-index:70;
}
.pa-header__nav li.has-dropdown:hover > .sub-menu,
.pa-header__nav li.has-dropdown:focus-within > .sub-menu{
  opacity:1;
  visibility:visible;
  transform:translateY(0);
}
.pa-header__nav .sub-menu li a{
  display:block;
  padding:9px 12px;
  border-radius:6px;
  font-size:14px;
  font-weight:500;
  color:var(--pa-ink);
}
.pa-header__nav .sub-menu li a:hover{background:var(--pa-bg);color:var(--pa-primary);}

.pa-header__actions{
  display:flex;
  align-items:center;
  gap:6px;
}
.pa-icon-btn{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:42px;
  height:42px;
  border-radius:50%;
  color:var(--pa-ink);
  background:transparent;
  border:none;
  cursor:pointer;
  transition:background .15s ease;
}
.pa-icon-btn:hover{background:var(--pa-bg-alt);}
.pa-cart-count{
  position:absolute;
  top:2px;
  right:2px;
  min-width:18px;
  height:18px;
  padding:0 4px;
  background:var(--pa-primary);
  color:#fff;
  font-size:11px;
  font-weight:700;
  line-height:18px;
  text-align:center;
  border-radius:999px;
}

/* Search panel (slides under header) */
.pa-search-panel{
  border-top:1px solid var(--pa-border);
  background:var(--pa-paper);
  padding:14px 0;
}
.pa-search-panel[hidden]{display:none;}
.pa-search-form{
  display:flex;
  align-items:center;
  gap:8px;
  max-width:640px;
  margin:0 auto;
  border:2px solid var(--pa-border);
  border-radius:999px;
  padding:4px 6px 4px 18px;
  transition:border-color .15s ease;
}
.pa-search-form:focus-within{border-color:var(--pa-primary);}
.pa-search-field{
  flex:1;
  border:none;
  outline:none;
  padding:8px 0;
  font-size:15px;
  background:transparent;
}
.pa-search-submit{
  display:flex;
  align-items:center;
  justify-content:center;
  width:38px;
  height:38px;
  border-radius:50%;
  border:none;
  background:var(--pa-primary);
  color:#fff;
  cursor:pointer;
}

/* Hamburger (mobile only) */
.pa-hamburger{
  display:none;
  flex-direction:column;
  justify-content:center;
  gap:5px;
  width:42px;
  height:42px;
  border:none;
  background:transparent;
  cursor:pointer;
  border-radius:8px;
}
.pa-hamburger span{
  display:block;
  width:22px;
  height:2px;
  background:var(--pa-ink);
  border-radius:2px;
  transition:transform .2s ease, opacity .2s ease;
}
.pa-hamburger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.pa-hamburger[aria-expanded="true"] span:nth-child(2){opacity:0;}
.pa-hamburger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

/* Mobile slide-out menu */
.pa-mobile-menu{
  position:fixed;
  top:0;
  left:0;
  bottom:0;
  width:min(340px,86vw);
  background:var(--pa-paper);
  z-index:90;
  padding:24px 20px;
  overflow-y:auto;
  transform:translateX(-100%);
  transition:transform .25s ease;
  box-shadow:var(--pa-shadow-lg);
}
.pa-mobile-menu.is-open{transform:translateX(0);}
.pa-mobile-menu[hidden]{display:block;}
.pa-mobile-nav-menu li{border-bottom:1px solid var(--pa-border);}
.pa-mobile-nav-menu li a{
  display:flex;
  justify-content:space-between;
  padding:14px 4px;
  font-weight:600;
  font-size:16px;
  color:var(--pa-ink);
}
.pa-mobile-nav-menu .sub-menu{padding-left:12px;}
.pa-mobile-menu__contact{margin-top:22px;display:flex;flex-direction:column;gap:12px;}
.pa-mobile-menu__contact a{font-weight:700;color:var(--pa-primary);}

.pa-mobile-overlay{
  position:fixed;inset:0;background:rgba(15,23,42,.5);z-index:80;
  opacity:0;transition:opacity .2s ease;
}
.pa-mobile-overlay.is-open{opacity:1;}
.pa-mobile-overlay[hidden]{display:none;}

/* Responsive breakpoints */
@media(max-width:1024px){
  .pa-header__nav{display:none;}
  .pa-hamburger{display:flex;}
}

/* =========================================================
   PREMIUM MOBILE HEADER
   Compact top row (logo + account/cart) with a persistent,
   always-visible app-style search bar underneath — closer to
   a real shopping app than a bare search icon.
========================================================= */
.pa-mobile-searchbar{display:none;}
@media(max-width:1023px){
  .pa-header__inner{padding:10px var(--pa-gutter) 8px;min-height:58px;gap:12px;}
  .pa-hamburger{width:38px;height:38px;}
  .pa-header__logo img{max-height:38px;}
  .pa-logo-text{font-size:19px;}
  .pa-icon-btn{width:38px;height:38px;}

  /* The icon-only search toggle is replaced on mobile by the
     persistent search bar below; keep it in the DOM (for a11y /
     desktop parity in code) but hide it visually here. */
  .pa-search-toggle{display:none;}

  .pa-mobile-searchbar{
    display:block;
    padding:0 0 10px;
    background:var(--pa-paper);
  }
  .pa-mobile-searchbar__btn{
    display:flex;
    align-items:center;
    gap:10px;
    width:100%;
    text-align:left;
    border:1.5px solid var(--pa-border);
    background:var(--pa-bg);
    color:var(--pa-ink-soft);
    border-radius:999px;
    padding:11px 16px;
    font-size:13.5px;
    cursor:pointer;
    -webkit-tap-highlight-color:transparent;
  }
  .pa-mobile-searchbar__btn svg{flex-shrink:0;color:var(--pa-ink-soft);}
  .pa-mobile-searchbar__btn span{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  .pa-mobile-searchbar__btn:active{background:var(--pa-bg-alt);}
}
@media(max-width:480px){
  .pa-header__inner{gap:10px;padding:10px var(--pa-gutter) 8px;}
  .pa-logo-text{font-size:18px;}
  .pa-icon-btn{width:36px;height:36px;}
  .pa-mobile-searchbar__btn{padding:10px 14px;font-size:13px;}
}