/**
 * Header IKEHU : bandeau d'annonce, barre principale à logo centré,
 * navigation répartie, utilitaires, recherche et menu mobile.
 */

/* ---------- Bandeau d'annonce ---------- */
.ikehu-announcement {
  background-color: var(--ikehu-bar-bg);
  color: var(--ikehu-bar-text);
  text-align: center;
}

.ikehu-announcement__text {
  margin: 0;
  padding: 10px var(--ikehu-space-sm);
  font-size: var(--ikehu-bar-size);
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

/* ---------- Barre principale ---------- */
.ikehu-header {
  position: relative;
  background-color: var(--ikehu-header-bg);
  border-bottom: 1px solid var(--ikehu-header-border);
  color: var(--ikehu-header-text);
}

.ikehu-header__inner {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: var(--ikehu-space-md);
  min-height: var(--ikehu-header-height);
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 var(--ikehu-space-lg);
}

.ikehu-header__start,
.ikehu-header__end {
  display: flex;
  align-items: center;
  gap: var(--ikehu-space-lg);
  min-width: 0;
}

.ikehu-header__start {
  justify-content: flex-start;
}

.ikehu-header__end {
  justify-content: flex-end;
}

/* Navigation groupée autour du logo centré ; utilitaires aux deux bords. */
.ikehu-nav--left {
  margin-left: auto;
}

.ikehu-nav--right {
  margin-right: auto;
}

.ikehu-header__brand {
  display: flex;
  justify-content: center;
  align-items: center;
}

/* ---------- Logo (fallback texte) ---------- */
.ikehu-logo {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  line-height: 1;
  text-decoration: none;
  color: var(--ikehu-header-text);
}

.ikehu-logo__name {
  font-family: var(--ikehu-font-display);
  font-size: 1.9rem;
  font-weight: 700;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  text-indent: 0.22em;
}

.ikehu-logo__sub {
  margin-top: 4px;
  font-size: 0.62rem;
  font-weight: 500;
  letter-spacing: 0.5em;
  text-transform: uppercase;
  text-indent: 0.5em;
}

.custom-logo {
  display: block;
  height: auto;
  max-height: 56px;
  width: auto;
}

/* Logo IKEHU LAB (image de marque). */
.ikehu-logo--mark img {
  display: block;
  width: auto;
  height: 46px;
}

@media (max-width: 767px) {
  .ikehu-logo--mark img {
    height: 38px;
  }
}

/* ---------- Menus (desktop) ---------- */
.ikehu-nav--left .ikehu-menu {
  justify-content: flex-start;
}

.ikehu-nav--right .ikehu-menu {
  justify-content: flex-end;
}

.ikehu-menu {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--ikehu-space-md);
  margin: 0;
  padding: 0;
  list-style: none;
}

.ikehu-menu__item {
  margin: 0;
}

.ikehu-menu__link,
.ikehu-menu a {
  display: inline-block;
  padding: 6px 0;
  font-size: var(--ikehu-nav-size);
  font-weight: var(--ikehu-nav-weight);
  letter-spacing: var(--ikehu-nav-tracking);
  text-transform: uppercase;
  text-decoration: none;
  color: var(--ikehu-header-text);
  border-bottom: 1px solid transparent;
  transition:
    color 0.2s ease,
    border-color 0.2s ease;
}

.ikehu-menu a:hover,
.ikehu-menu a:focus-visible,
.ikehu-menu .current-menu-item > a,
.ikehu-menu .current_page_item > a {
  color: var(--ikehu-header-hover);
  border-bottom-color: currentcolor;
}

/* ---------- Utilitaires (recherche, compte, panier) ---------- */
.ikehu-utils {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: var(--ikehu-space-sm);
}

.ikehu-util {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 6px;
  background: none;
  border: 0;
  color: var(--ikehu-header-text);
  cursor: pointer;
  transition: color 0.2s ease;
}

.ikehu-util:hover,
.ikehu-util:focus-visible {
  color: var(--ikehu-header-hover);
}

.ikehu-icon {
  display: block;
}

.ikehu-util__count {
  position: absolute;
  top: -2px;
  right: -4px;
  min-width: 16px;
  height: 16px;
  padding: 0 4px;
  font-size: 0.6rem;
  line-height: 16px;
  text-align: center;
  color: var(--ikehu-cream);
  background-color: var(--ikehu-earth);
  border-radius: 999px;
}

/* ---------- Panneau de recherche ---------- */
.ikehu-search {
  border-top: 1px solid var(--ikehu-header-border);
  background-color: var(--ikehu-header-bg);
}

.ikehu-search[hidden] {
  display: none;
}

.ikehu-search__inner {
  max-width: 1400px;
  margin: 0 auto;
  padding: var(--ikehu-space-md) var(--ikehu-space-lg);
}

.ikehu-search input[type='search'] {
  width: 100%;
  padding: 12px 14px;
  font-size: 1rem;
  color: var(--ikehu-text);
  background-color: #fff;
  border: 1px solid var(--ikehu-header-border);
}

/* ---------- Burger (mobile) ---------- */
.ikehu-burger {
  display: none;
  padding: 8px;
  background: none;
  border: 0;
  color: var(--ikehu-header-text);
  cursor: pointer;
}

.ikehu-burger__box {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  width: 24px;
  height: 18px;
}

.ikehu-burger__bar {
  display: block;
  width: 100%;
  height: 2px;
  background-color: currentcolor;
  transition:
    transform 0.25s ease,
    opacity 0.25s ease;
}

.ikehu-burger[aria-expanded='true'] .ikehu-burger__bar:nth-child(1) {
  transform: translateY(7px) rotate(45deg);
}

.ikehu-burger[aria-expanded='true'] .ikehu-burger__bar:nth-child(2) {
  opacity: 0;
}

.ikehu-burger[aria-expanded='true'] .ikehu-burger__bar:nth-child(3) {
  transform: translateY(-7px) rotate(-45deg);
}

/* ---------- Menu mobile ---------- */
.ikehu-mobile-nav {
  border-top: 1px solid var(--ikehu-header-border);
  background-color: var(--ikehu-header-bg);
  padding: var(--ikehu-space-sm) var(--ikehu-space-lg) var(--ikehu-space-lg);
}

.ikehu-mobile-nav[hidden] {
  display: none;
}

.ikehu-mobile-menu {
  margin: 0;
  padding: 0;
  list-style: none;
}

.ikehu-mobile-menu a {
  display: block;
  padding: 14px 0;
  font-size: 0.95rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  text-decoration: none;
  color: var(--ikehu-header-text);
  border-bottom: 1px solid var(--ikehu-header-border);
}

.ikehu-mobile-menu a:hover,
.ikehu-mobile-menu a:focus-visible {
  color: var(--ikehu-header-hover);
}

/* ---------- Menu mobile : empilement propre (y compris menu de secours) ---------- */
.ikehu-mobile-nav .ikehu-menu {
  flex-flow: column nowrap;
  align-items: stretch;
  gap: 0;
}

.ikehu-mobile-nav .ikehu-menu a,
.ikehu-mobile-nav .ikehu-menu__link {
  display: block;
  padding: 14px 0;
  font-size: 0.95rem;
  letter-spacing: 0.1em;
  border-bottom: 1px solid var(--ikehu-header-border);
}

/* ---------- Responsive ---------- */
@media (max-width: 1200px) {
  .ikehu-header__inner {
    padding: 0 var(--ikehu-space-md);
  }

  .ikehu-nav--left,
  .ikehu-nav--right {
    display: none;
  }

  .ikehu-burger {
    display: inline-flex;
  }

  .ikehu-util--search,
  .ikehu-util--account {
    display: none;
  }
}

@media (min-width: 1201px) {
  .ikehu-mobile-nav {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ikehu-burger__bar,
  .ikehu-menu a,
  .ikehu-util {
    transition: none;
  }
}