/* KouzinaMax — Woodmart-style header */

.yc-header {
  width: 100%;
  background: var(--yc-nav-background, #fff);
}

.yc-navbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  min-height: 90px;
}

/* Logo */
.yc-navbar .logo a {
  display: block;
  line-height: 0;
}

.yc-navbar .logo img {
  max-width: 127px;
  height: auto;
}

/* Hamburger (mobile only) */
.menu .menu-toggler {
  display: none;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  background: transparent;
  border: 0;
  font-size: 26px;
  color: #333;
  cursor: pointer;
}

/* Centered nav */
.menu {
  flex: 1;
  display: flex;
  justify-content: center;
}

.menu .menu-list {
  display: flex;
  flex: 1;
  align-items: center;
  justify-content: center;
  gap: 4px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.menu .menu-list .menu-item > a {
  position: relative;
  display: inline-block;
  padding: 12px 14px;
  color: var(--yc-nav-links-color, #333);
  font-size: 14px;
  font-weight: 400;
  white-space: nowrap;
}

.menu .menu-list .menu-item > a::after {
  content: "";
  position: absolute;
  bottom: 6px;
  inset-inline: 14px;
  height: 2px;
  background: #333;
  opacity: 0;
  transform: scaleX(0);
  transition: transform 0.25s ease, opacity 0.25s ease;
}

.menu .menu-list .menu-item > a:hover::after,
.menu .menu-list .menu-item.active > a::after {
  opacity: 1;
  transform: scaleX(1);
}

.menu .menu-list .menu-item > a:hover {
  color: #333;
}

.menu .menu-list .submenu-caret {
  font-size: 12px;
  vertical-align: middle;
  margin-inline-start: 4px;
}

/* Dropdown submenus (desktop hover) */
.menu .menu-list .sub-links {
  position: absolute;
  top: 100%;
  inset-inline-start: 0;
  z-index: 320;
  display: none;
  min-width: 220px;
  margin: 0;
  padding: 10px 0;
  list-style: none;
  background: #fff;
  border: 1px solid #e7e7e7;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.menu .menu-list .menu-item:hover > .sub-links {
  display: block;
}

.menu .menu-list .sub-links .sub-link a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 9px 18px;
  color: #333;
  font-size: 14px;
  white-space: nowrap;
}

.menu .menu-list .sub-links .sub-link a:hover {
  color: #0a6b47;
}

.menu .menu-list .sub-links .sub-link a ion-icon {
  font-size: 13px;
  color: #9e9e9e;
}

/* Tools (search + wishlist) */
.yc-navbar .corner {
  display: flex;
  align-items: center;
  gap: 18px;
}

.yc-navbar .corner .search,
.yc-navbar .corner .wishlist {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  background: transparent;
  border: 0;
  font-size: 21px;
  color: #333;
  cursor: pointer;
  transition: color 0.25s ease;
}

.yc-navbar .corner .search:hover,
.yc-navbar .corner .wishlist:hover {
  color: #0a6b47;
}

.yc-navbar .corner ion-icon {
  pointer-events: none;
}

.yc-navbar .corner .wd-wishlist-count {
  position: absolute;
  top: 2px;
  inset-inline-start: 2px;
  min-width: 19px;
  height: 19px;
  padding: 0 5px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #035335;
  color: #fff;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
}

/* Order on mobile: hamburger — logo — tools */
@media (max-width: 1024px) {
  .yc-navbar {
    min-height: 62px;
    gap: 10px;
  }

  .menu .menu-toggler {
    display: flex;
  }

  .yc-navbar .logo {
    flex: 1;
    display: flex;
    justify-content: center;
    order: 2;
  }

  .yc-navbar .logo img {
    max-width: 100px;
  }

  .menu {
    order: 1;
    flex: 0 0 auto;
    justify-content: flex-start;
    margin-inline-start: -8px;
  }

  .menu .menu-toggler {
    padding: 0;
  }

  .yc-navbar .corner {
    order: 3;
    gap: 2px;
  }

  .menu .menu-list {
    display: none;
  }
}