/* EvyStore store header: top bar, main bar (logo, search, account, wishlist, cart), category bar. */
main { padding-top: var(--hh, 168px); }
.evy-flash { top: calc(var(--hh, 168px) + 12px); }
.evy-pdp-info, .evy-summary.sticky { top: calc(var(--hh, 168px) + 16px); }

.evy-header { background: var(--evy-surface) !important; color: var(--evy-ink); border-bottom: 1px solid var(--evy-line); }
.evy-header.is-scrolled { box-shadow: 0 8px 30px rgba(0, 0, 0, .08); }
.evy-header a { text-decoration: none; }

/* Top bar */
.evy-topbar { background: #111114; color: #e9e9ee; font-size: 12px; letter-spacing: .04em; }
.evy-topbar-inner { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 34px; padding: 0 24px; }
.evy-topbar-msg { font-weight: 600; text-transform: uppercase; letter-spacing: .12em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.evy-topbar-links { display: flex; align-items: center; gap: 20px; }
.evy-topbar-links a { color: #c9cad1; }
.evy-topbar-links a:hover { color: #fff; }
.evy-topbar .evy-theme-btn { border: 1px solid rgba(255, 255, 255, .25); background: transparent; color: #fff; border-radius: 999px; width: 30px; height: 24px; line-height: 1; font-size: 13px; padding: 0; }
.evy-topbar .evy-theme-btn:hover { background: rgba(255, 255, 255, .12); }

/* Main bar */
.evy-mainbar-inner { display: flex; align-items: center; gap: 28px; padding: 14px 24px; }
.evy-header .evy-logo { font-size: 30px; flex: none; }
.evy-burger { display: none; }

.evy-hsearch { position: relative; flex: 1; max-width: 760px; display: flex; align-items: center; gap: 10px; margin: 0 auto; border: 2px solid var(--evy-ink); border-radius: 999px; padding: 4px 4px 4px 18px; background: var(--evy-surface); transition: box-shadow .2s; }
.evy-hsearch:focus-within { box-shadow: 0 0 0 5px rgba(114, 174, 200, .25); }
.evy-hsearch > svg { width: 18px; height: 18px; flex: none; opacity: .55; }
.evy-hsearch input { flex: 1; min-width: 0; border: 0; outline: none; background: transparent; color: var(--evy-ink); font-size: 15px; padding: 8px 0; }
.evy-hsearch input::-webkit-search-cancel-button { -webkit-appearance: none; }
.evy-kbd { font-family: inherit; font-size: 11px; color: var(--evy-muted); border: 1px solid var(--evy-line); border-radius: 6px; padding: 1px 7px; background: var(--evy-soft); }
.evy-hsearch-btn { border: 0; border-radius: 999px; background: var(--evy-ink); color: var(--evy-surface); font-weight: 700; font-size: 14px; padding: 10px 22px; letter-spacing: .02em; transition: transform .15s; }
.evy-hsearch-btn:hover { transform: scale(1.03); }
.evy-hsearch-drop { position: absolute; left: 0; right: 0; top: calc(100% + 10px); z-index: 1050; background: var(--evy-surface); border: 1px solid var(--evy-line); border-radius: 20px; box-shadow: var(--evy-shadow-lg); padding: 8px; max-height: 70vh; overflow-y: auto; animation: evy-in .2s var(--evy-ease); }
.evy-hsearch-drop[hidden] { display: none; }

.evy-actions { display: flex; align-items: center; gap: 4px; flex: none; }
.evy-action { display: flex; align-items: center; gap: 10px; padding: 6px 10px; border-radius: 16px; border: 0; background: transparent; color: var(--evy-ink); transition: background .2s; text-align: left; }
.evy-action:hover { background: var(--evy-soft); color: var(--evy-ink); }
.evy-action-ic { position: relative; width: 42px; height: 42px; flex: none; border-radius: 50%; background: var(--evy-soft); display: flex; align-items: center; justify-content: center; }
.evy-action-ic svg { width: 20px; height: 20px; fill: var(--evy-ink); }
.evy-heart-ic { font-size: 21px; line-height: 1; }
.evy-action .evy-count { top: -3px; right: -4px; }
.evy-count:empty { display: none; }
.evy-action-txt { display: flex; flex-direction: column; line-height: 1.15; }
.evy-action-txt small { font-size: 11px; color: var(--evy-muted); max-width: 120px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.evy-action-txt b { font-size: 14px; font-weight: 700; white-space: nowrap; }
.evy-action-cart .evy-action-ic { background: var(--evy-ink); }
.evy-action-cart .evy-action-ic svg { fill: var(--evy-surface); }

/* Category bar */
.evy-catbar { border-top: 1px solid var(--evy-line); }
.evy-catbar-inner { display: flex; align-items: center; gap: 22px; padding: 0 24px; min-height: 48px; }
.evy-allcats { display: inline-flex; align-items: center; gap: 8px; border: 0; border-radius: 10px; background: var(--evy-ink); color: var(--evy-surface); font-weight: 700; font-size: 14px; padding: 8px 14px; flex: none; }
.evy-allcats svg { width: 18px; height: 18px; fill: var(--evy-surface); }
.evy-catlinks { display: flex; gap: 22px; align-items: center; overflow-x: auto; scrollbar-width: none; }
.evy-catlinks::-webkit-scrollbar { display: none; }
.evy-catlinks a { position: relative; font-weight: 600; font-size: 14px; color: var(--evy-ink); white-space: nowrap; padding: 13px 0; }
.evy-catlinks a::after { content: ""; position: absolute; left: 0; right: 0; bottom: 6px; height: 2px; background: currentColor; transform: scaleX(0); transform-origin: left; transition: transform .25s var(--evy-ease); }
.evy-catlinks a:hover::after { transform: scaleX(1); }
.evy-catlinks a.evy-deal, .evy-mnav a.evy-deal { color: var(--evy-hot); }
.evy-catbar-right { margin-left: auto; display: flex; align-items: center; gap: 18px; flex: none; }
.evy-perk { font-size: 12px; color: var(--evy-muted); white-space: nowrap; }
.evy-pill-sm { font-size: 12px; font-weight: 700; color: var(--evy-ink); border: 1.5px solid var(--evy-ink); border-radius: 999px; padding: 4px 12px; }

/* Mega menu now hangs under the category bar */
.evy-mega { z-index: 1045; }

/* Mobile menu */
.evy-mobile-menu { width: 320px !important; background: var(--evy-surface); color: var(--evy-ink); }
.evy-mobile-menu .offcanvas-header { border-bottom: 1px solid var(--evy-line); }
.evy-mnav { display: flex; flex-direction: column; }
.evy-mnav .evy-kicker { margin: 18px 0 6px; }
.evy-mnav a, .evy-mnav-btn { display: block; padding: 11px 0; font-size: 17px; font-weight: 600; color: var(--evy-ink); border: 0; background: none; text-align: left; border-bottom: 1px solid var(--evy-line); width: 100%; }
.evy-mnav-btn .evy-moon { display: none; }
html[data-theme="dark"] .evy-mnav-btn .evy-sun { display: none; }
html[data-theme="dark"] .evy-mnav-btn .evy-moon { display: inline; }

/* Medium screens: drop the perks, then the labels */
@media (max-width: 1299px) {
  .evy-catbar-right .evy-perk { display: none; }
  .evy-mainbar-inner { gap: 18px; }
}
@media (max-width: 1099px) {
  .evy-action-txt { display: none; }
  .evy-kbd { display: none; }
}

/* Phones and tablets: logo row, then a full-width search row; categories live in the menu */
@media (max-width: 991px) {
  .evy-topbar-links a { display: none; }
  .evy-topbar-inner { padding: 0 14px; min-height: 30px; }
  .evy-mainbar-inner { flex-wrap: wrap; gap: 8px 6px; padding: 10px 12px; }
  .evy-burger { display: inline-flex; order: 1; }
  .evy-header .evy-logo { order: 2; font-size: 24px; margin-right: auto; }
  .evy-actions { order: 3; }
  .evy-hsearch { order: 4; flex-basis: 100%; max-width: none; padding: 2px 2px 2px 14px; border-width: 1.5px; }
  .evy-hsearch input { font-size: 16px; padding: 7px 0; }
  .evy-hsearch-btn { padding: 8px 16px; }
  .evy-catbar { display: none; }
  .evy-action { padding: 4px; }
  .evy-action-ic { width: 40px; height: 40px; }
}
@media (max-width: 420px) {
  .evy-action-wish { display: none; }
  .evy-hsearch-btn { display: none; }
}

/* Dark mode */
html[data-theme="dark"] .evy-topbar { background: #000; }
html[data-theme="dark"] .evy-header { border-color: var(--evy-line); }
html[data-theme="dark"] .evy-header.is-scrolled { box-shadow: 0 8px 30px rgba(0, 0, 0, .5); }
html[data-theme="dark"] .evy-hsearch { border-color: #3a3d46; }
html[data-theme="dark"] .evy-hsearch:focus-within { border-color: var(--evy-ink); }
html[data-theme="dark"] .evy-hsearch > svg { fill: var(--evy-ink); }
html[data-theme="dark"] .evy-hsearch-btn, html[data-theme="dark"] .evy-allcats { background: #f2f2f4; color: #0e0f12; }
html[data-theme="dark"] .evy-allcats svg { fill: #0e0f12; }
html[data-theme="dark"] .evy-action-cart .evy-action-ic { background: #f2f2f4; }
html[data-theme="dark"] .evy-action-cart .evy-action-ic svg { fill: #0e0f12; }
html[data-theme="dark"] .evy-mobile-menu { background: var(--evy-surface); }

/* Currency selector */
.evy-cur select { background: transparent; color: #e9e9ee; border: 1px solid rgba(255, 255, 255, .25); border-radius: 999px; font-size: 12px; padding: 2px 8px; max-width: 150px; }
.evy-cur select option { color: #111114; }
.evy-mnav-cur { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 11px 0; font-size: 17px; font-weight: 600; border-bottom: 1px solid var(--evy-line); }
.evy-mnav-cur select { border: 1.5px solid var(--evy-line); border-radius: 10px; padding: 6px 8px; background: var(--evy-soft); color: var(--evy-ink); font-size: 14px; max-width: 170px; }
.evy-fx-note { font-size: 12px; color: var(--evy-muted); margin: 12px 0 0; line-height: 1.5; }
@media (max-width: 991px) { .evy-topbar .evy-cur { display: none; } }
