/* Custom overrides for Hy Store - minimalist mega menu */

/* Vertical navigation container */.subheader .navigation-wrapper .navigation {
  padding: 0;
  margin: 0;
}

/* Main menu item */
.subheader .navigation-wrapper .menu-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 14px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.04);
  font-size: 14px;
  font-weight: 500;
}

/* Submenu panel (mega) */
.subheader .navigation-wrapper .submenu {
  background-color: #ffffff;
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.15);
  border-radius: 12px;
  padding: 16px 20px;
}

/* Submenu title (level 2 main items) */
.subheader .navigation-wrapper .submenu__item--main .link {
  font-weight: 600;
  font-size: 14px;
  display: inline-block;
  margin-bottom: 6px;
}

/* Submenu list as responsive grid */
.subheader .navigation-wrapper .submenu__list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  column-gap: 24px;
  row-gap: 8px;
}

/* Column container */
.subheader .navigation-wrapper .submenu__col {
  list-style: none;
}

/* Child items */
.subheader .navigation-wrapper .submenu__item .link {
  font-size: 13px;
  font-weight: 400;
  color: #444;
}

/* Hover states */
.subheader .navigation-wrapper .submenu__item .link:hover {
  text-decoration: none;
  color: #111;
}

/* Small arrow icon alignment */
.subheader .navigation-wrapper .menu-item__link svg {
  opacity: 0.4;
}

/* Hide base64 icon if not needed in minimal style */
.subheader .navigation-wrapper .menu-item__link img {
  max-width: 18px;
  max-height: 18px;
  margin-right: 8px;
  border-radius: 999px;
  object-fit: cover;
}

/* Make whole row feel airy */
.subheader .navigation-wrapper .menu-item__link span {
  flex: 1;
}

/* Slight background on hover main item */
.subheader .navigation-wrapper .menu-item:hover {
  background: rgba(0, 0, 0, 0.02);
}

/* Desktop: keep the category submenu compact instead of stretching to the
   full height of the vertical navigation. This prevents a mostly empty panel
   from covering the collection/product content. */
@media (min-width: 1025px) {
  .navigation-wrapper .navigation .submenu {
    width: min(900px, calc(100vw - 340px));
    height: auto !important;
    min-height: 0 !important;
    max-height: min(70vh, 520px);
    bottom: auto !important;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
  }

  .navigation-wrapper .navigation .submenu__list {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    align-content: start;
  }
}

/* The subheader color belongs to the dark category trigger only. Do not let
   it cascade into the white dropdown panels on collection/product pages. */
.subheader .navigation-wrapper .menu-item__link,
.subheader .navigation-wrapper .menu-item__link span,
.subheader .navigation-wrapper .submenu,
.subheader .navigation-wrapper .submenu a,
.subheader .navigation-wrapper .submenu span,
.subheader .navigation-wrapper .submenu .link {
  color: #171717 !important;
}

.subheader .navigation-wrapper .menu-item:hover > .menu-item__link,
.subheader .navigation-wrapper .menu-item:hover > .menu-item__link span,
.subheader .navigation-wrapper .submenu .link:hover {
  color: #8A6A12 !important;
}

/* Desktop header actions: create a dark, high-contrast panel so hotline,
   account and cart stay readable even when the configured header is yellow. */
@media (min-width: 992px) {
  .header .hy-header-actions-col,
  .header_menu .hy-header-actions-col {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    min-height: 60px;
    padding: 8px 12px;
    background: #0A0A0A;
    border: 1px solid rgba(176, 138, 87, 0.5);
    border-radius: 12px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
  }

  .header .hy-header-actions-col .header-right,
  .header_menu .hy-header-actions-col .header-right {
    width: 100%;
    justify-content: flex-end;
  }

  .header .hy-header-actions-col .hotline .media-body span,
  .header_menu .hy-header-actions-col .hotline .media-body span,
  .header .hy-header-actions-col a,
  .header .hy-header-actions-col span,
  .header .hy-header-actions-col small,
  .header_menu .hy-header-actions-col a,
  .header_menu .hy-header-actions-col span,
  .header_menu .hy-header-actions-col small {
    color: #F7F3EE !important;
  }

  .header .hy-header-actions-col .hotline .media-body span,
  .header_menu .hy-header-actions-col .hotline .media-body span {
    color: #D4AF37 !important;
  }

  .header .hy-header-actions-col img,
  .header_menu .hy-header-actions-col img {
    filter: invert(72%) sepia(35%) saturate(759%) hue-rotate(4deg) brightness(93%) contrast(87%) !important;
    opacity: 1 !important;
  }

  .header .hy-header-actions-col .mini-cart > a,
  .header_menu .hy-header-actions-col .mini-cart > a {
    border-color: rgba(212, 175, 55, 0.72) !important;
    background: rgba(212, 175, 55, 0.08) !important;
  }
}

/* Mobile tweaks: keep things simple */
@media (max-width: 767.98px) {
  .subheader .navigation-wrapper .submenu {
    box-shadow: none;
    border-radius: 0;
    padding: 8px 16px 16px;
  }
  .subheader .navigation-wrapper .submenu__list {
    grid-template-columns: 1fr;
  }
}

/* ==== SPEED MAX OVERRIDES FOR MOBILE ==== */
@media (max-width: 767.98px) {
  /* Tắt animation & transition để tăng hiệu năng trên mobile */
  * {
    -webkit-animation: none !important;
    animation: none !important;
    -webkit-transition: none !important;
    transition: none !important;
  }

  /* Giảm shadow để trình duyệt render nhanh hơn */
  *,
  *::before,
  *::after {
    box-shadow: none !important;
    text-shadow: none !important;
  }
}
/* HY STORE - Header dark gold refinement */
header.header,
header.header_menu {
  background: #0A0A0A !important;
}

/* Icon header: gold dịu, không quá chói */
.header .header-right img[alt="phone-icon"],
.header .header-right img[alt="account-icon"],
.header .header-right img[alt="cart-icon"],
.header_menu .header-right img[alt="phone-icon"],
.header_menu .header-right img[alt="account-icon"],
.header_menu .header-right img[alt="cart-icon"] {
  filter: invert(66%) sepia(44%) saturate(668%) hue-rotate(7deg) brightness(92%) contrast(90%) !important;
  opacity: 1 !important;
}

/* Dòng hỗ trợ khách hàng */
.header .hotline .media-body span,
.header_menu .hotline .media-body span {
  color: #D4AF37 !important;
  font-weight: 600 !important;
}

/* Số điện thoại dễ đọc hơn */
.header .hotline .media-body a,
.header_menu .hotline .media-body a {
  color: #FFFFFF !important;
  font-weight: 700 !important;
}

/* Tài khoản / Giỏ hàng */
.header .header-right a,
.header .header-right span,
.header .header-right small,
.header_menu .header-right a,
.header_menu .header-right span,
.header_menu .header-right small {
  color: #D4AF37 !important;
}

/* Nút giỏ hàng */
.header .mini-cart > a,
.header_menu .mini-cart > a {
  border: 1px solid rgba(212, 175, 55, 0.55) !important;
  background: transparent !important;
  border-radius: 6px !important;
}

/* Số lượng trong giỏ */
.header .mini-cart > a .count_item,
.header_menu .mini-cart > a .count_item {
  background: #D4AF37 !important;
  color: #0A0A0A !important;
}

/* Subheader giữ sạch, dễ đọc */
.subheader {
  background: var(--subheader-background) !important;
}

/* Nút danh mục sản phẩm */
.subheader .menu-bar,
.subheader .category-action,
.subheader .menu-title {
  background: var(--subheader-color) !important;
  color: var(--subheader-background) !important;
}

/* Keep the header above the intentional page-dimming layer while a desktop
   category menu is open. */
body.menu-is-hover .header_menu {
  position: relative;
  z-index: 100;
}

@media (min-width: 1024px) {
  body:not(#template-index) .subheader .navigation-wrapper .navigation .submenu {
    left: calc(100% - 1px) !important;
    border-left: 1px solid #e1e1e1;
    z-index: 901 !important;
  }
}

/* ==========================================================================
   HY STORE v1.5 — authoritative header + desktop category menu
   Loaded after every page stylesheet from layout/theme.liquid.
   ========================================================================== */

/* Keep the theme setting as the single source of truth for the header shell. */
.header_menu,
.header_menu .mid-header {
  background: var(--header-background) !important;
  color: var(--header-color) !important;
}

.header_menu .mid-header .row {
  align-items: center;
}

.header_menu .hy-header-search-col,
.header_menu .hy-header-actions-col {
  min-width: 0;
}

/* Search stays fluid inside the original EGA 4-column desktop allocation. */
.header_menu #search-header {
  padding-left: 15px;
  padding-right: 15px;
}

.header_menu #search-header .custom-input-group {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  height: 44px;
  margin: 0;
  overflow: hidden;
  border-radius: 999px;
  background: #fff;
}

.header_menu #search-header .custom-input-group .input-group-field {
  height: 44px;
  padding: 0 68px 0 20px;
  border: 0 !important;
  border-radius: 999px;
  color: #171717;
  background: #fff !important;
  line-height: 44px;
  text-overflow: ellipsis;
}

.header_menu #search-header .custom-input-group .input-group-btn,
.header_menu #search-header .custom-input-group .input-group-btn .btn {
  width: 60px;
  height: 44px !important;
}

.header_menu #search-header .custom-input-group .input-group-btn {
  top: 0;
  right: 0;
  border-radius: 0 999px 999px 0 !important;
  background: #050505;
}

.header_menu #search-header .custom-input-group .input-group-btn .btn {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
}

.header_menu #search-header .custom-input-group .input-group-btn svg,
.header_menu #search-header .custom-input-group .input-group-btn .icon {
  color: #d4af37 !important;
  fill: #d4af37 !important;
}

/* The action column uses EGA's original 5-column width. The dark inner panel
   guarantees contrast on both yellow and black header configurations. */
@media (min-width: 992px) {
  .header .hy-header-actions-col,
  .header_menu .hy-header-actions-col {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    min-height: 0;
    padding: 0 15px;
    overflow: visible;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }

  .header .hy-header-actions-col > .header-right,
  .header_menu .hy-header-actions-col > .header-right {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: nowrap;
    gap: 14px;
    width: 100%;
    min-width: 0;
    padding: 8px 10px;
    overflow: visible;
    border: 1px solid rgba(212, 175, 55, 0.58);
    border-radius: 10px;
    background: #0a0a0a;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.14);
  }

  .header .hy-header-actions-col .header-right > li,
  .header_menu .hy-header-actions-col .header-right > li {
    flex: 0 0 auto;
    min-width: 0;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  .header .hy-header-actions-col .media-body,
  .header_menu .hy-header-actions-col .media-body {
    min-width: 0;
    line-height: 1.25;
    white-space: nowrap;
  }

  .header .hy-header-actions-col img,
  .header_menu .hy-header-actions-col img {
    flex: 0 0 auto;
    margin-right: 8px !important;
    opacity: 1 !important;
    filter: none !important;
  }

  .header .hy-header-actions-col .hotline .media-body span,
  .header_menu .hy-header-actions-col .hotline .media-body span,
  .header .hy-header-actions-col .header-right > li > a,
  .header_menu .hy-header-actions-col .header-right > li > a {
    color: #d4af37 !important;
  }

  .header .hy-header-actions-col .hotline .media-body a,
  .header_menu .hy-header-actions-col .hotline .media-body a,
  .header .hy-header-actions-col small,
  .header .hy-header-actions-col small a,
  .header_menu .hy-header-actions-col small,
  .header_menu .hy-header-actions-col small a {
    color: #fff !important;
  }

  .header .hy-header-actions-col .mini-cart > a,
  .header_menu .hy-header-actions-col .mini-cart > a {
    min-height: 42px;
    padding: 7px 8px;
    border: 1px solid rgba(212, 175, 55, 0.65) !important;
    border-radius: 7px !important;
    background: rgba(212, 175, 55, 0.08) !important;
  }

  .header .hy-header-actions-col .mini-cart > a span,
  .header .hy-header-actions-col .mini-cart > a b,
  .header_menu .hy-header-actions-col .mini-cart > a span,
  .header_menu .hy-header-actions-col .mini-cart > a b {
    color: #d4af37 !important;
  }

  .header .hy-header-actions-col .mini-cart .count_item,
  .header_menu .hy-header-actions-col .mini-cart .count_item {
    color: #0a0a0a !important;
    background: #d4af37 !important;
  }
}

/* Scope subheader colors: trigger/policy bar may use theme colors, while every
   dropdown surface is always white with dark text. */
.subheader {
  background: var(--subheader-background) !important;
  color: var(--subheader-color) !important;
}

.subheader > .container > .toogle-nav-wrapper {
  color: var(--subheader-background) !important;
  background: var(--subheader-color) !important;
}

.subheader > .container > .toogle-nav-wrapper > .icon-bar .bar {
  background: var(--subheader-background) !important;
}

@media (min-width: 1024px) {
  .subheader .toogle-nav-wrapper .navigation-wrapper {
    width: 100%;
    margin-top: 7px;
    background: transparent;
  }

  .subheader .navigation-wrapper .navigation {
    max-height: min(70vh, 520px);
    overflow-x: visible;
    overflow-y: auto;
    -ms-overflow-style: none;
    scrollbar-width: none;
    border: 1px solid #e1e1e1;
    border-radius: 0 0 8px 8px;
    color: #171717 !important;
    background: #fff !important;
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.13);
  }

  .subheader .navigation-wrapper .navigation::-webkit-scrollbar,
  .subheader .navigation-wrapper .submenu::-webkit-scrollbar {
    width: 0;
    height: 0;
  }

  .subheader .navigation-wrapper .menu-item {
    display: block;
    padding: 0;
    border-bottom: 1px solid #f0f0f0;
    color: #171717 !important;
    background: #fff !important;
  }

  .subheader .navigation-wrapper .menu-item:last-child {
    border-bottom: 0;
  }

  .subheader .navigation-wrapper .menu-item > .menu-item__link {
    width: 100%;
    min-height: 44px;
    padding: 11px 15px;
    color: #171717 !important;
    background: #fff !important;
  }

  .subheader .navigation-wrapper .menu-item > .menu-item__link span,
  .subheader .navigation-wrapper .menu-item > .menu-item__link svg {
    color: #171717 !important;
  }

  .subheader .navigation-wrapper .menu-item:hover,
  .subheader .navigation-wrapper .menu-item:hover > .menu-item__link {
    color: #8a6a12 !important;
    background: #faf7ef !important;
  }

  .subheader .navigation-wrapper .menu-item:hover > .menu-item__link span,
  .subheader .navigation-wrapper .menu-item:hover > .menu-item__link svg {
    color: #8a6a12 !important;
  }

  .subheader .navigation-wrapper .navigation .submenu {
    top: 0 !important;
    bottom: auto !important;
    left: calc(100% - 1px) !important;
    display: none;
    width: min(820px, calc(100vw - 340px)) !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: min(70vh, 520px);
    margin: 0;
    padding: 18px 20px;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    -ms-overflow-style: none;
    scrollbar-width: none;
    border: 1px solid #e1e1e1;
    border-left: 1px solid #e1e1e1;
    border-radius: 0 10px 10px 0;
    color: #171717 !important;
    background: #fff !important;
    box-shadow: 10px 12px 28px rgba(15, 23, 42, 0.13);
  }

  .subheader .navigation-wrapper .menu-item:hover > .submenu {
    display: block;
    z-index: 900;
  }

  .subheader .navigation-wrapper .submenu__list {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    align-content: start;
    gap: 10px 22px;
    margin: 0;
    padding: 0;
  }

  .subheader .navigation-wrapper .submenu,
  .subheader .navigation-wrapper .submenu a,
  .subheader .navigation-wrapper .submenu span,
  .subheader .navigation-wrapper .submenu .link {
    color: #171717 !important;
  }

  .subheader .navigation-wrapper .submenu .link:hover {
    color: #8a6a12 !important;
  }
}

@media (min-width: 992px) and (max-width: 1199.98px) {
  .header .hy-header-actions-col > .header-right,
  .header_menu .hy-header-actions-col > .header-right {
    gap: 9px;
    padding: 7px 8px;
  }

  .header .hy-header-actions-col .media-body,
  .header_menu .hy-header-actions-col .media-body {
    font-size: 12px;
  }

  .header .hy-header-actions-col img,
  .header_menu .hy-header-actions-col img {
    width: 26px;
    height: 26px;
    margin-right: 6px !important;
  }
}

@media (max-width: 991.98px) {
  .header_menu .mid-header .row {
    flex-wrap: wrap;
  }

  .header_menu #search-header {
    padding-left: 15px;
    padding-right: 15px;
  }

  .header_menu #search-header .custom-input-group,
  .header_menu #search-header .custom-input-group .input-group-field {
    height: 42px;
  }

  .header_menu #search-header .custom-input-group .input-group-field {
    padding-right: 62px;
    line-height: 42px;
  }

  .header_menu #search-header .custom-input-group .input-group-btn,
  .header_menu #search-header .custom-input-group .input-group-btn .btn {
    width: 56px;
    height: 42px !important;
  }
}

/* HY STORE - Mobile header: keep the logo visible in normal and sticky states */
@media (max-width: 991px) {
  .header_menu .header-left {
    display: flex !important;
    align-items: center;
    justify-content: center;
  }

  .header_menu .logo-wrapper {
    width: 100% !important;
    max-width: 160px;
    min-height: 38px;
    justify-content: center;
  }

  .header_menu .logo-wrapper img {
    width: auto !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: 38px !important;
    object-fit: contain !important;
  }

  .header_menu.active .header-left {
    display: flex !important;
    flex: 0 0 50%;
    max-width: 50%;
    order: 0;
  }

  .header_menu.active a.logo-wrapper {
    display: inline-flex !important;
  }

  .header_menu.active #search-header {
    display: none !important;
  }

  .header_menu.active .mid-header {
    min-height: 54px;
    padding: 4px 0 !important;
  }
}
/* HY STORE - Top banner height */
.top-banner {
  height: auto !important;
  line-height: normal !important;
  overflow: hidden !important;
}

.top-banner img {
  max-height: none !important;
  width: 100%;
  object-fit: cover;
}
/* HY STORE - Đồng bộ màu khu vực header phải */

/* Icon điện thoại, tài khoản, giỏ hàng */
.header .header-right img,
.header_menu .header-right img {
  filter: brightness(0) saturate(100%) invert(66%) sepia(37%) saturate(665%) hue-rotate(7deg) brightness(92%) contrast(92%) !important;
  opacity: 1 !important;
}

/* Chữ "Hỗ trợ khách hàng" */
.header .hotline .media-body span,
.header_menu .hotline .media-body span {
  color: #D4AF37 !important;
  font-weight: 700 !important;
}

/* Số điện thoại */
.header .hotline .media-body a,
.header_menu .hotline .media-body a {
  color: #FFFFFF !important;
  font-weight: 700 !important;
}

/* Tài khoản */
.header .account-header a,
.header .account-header span,
.header .header-right .account a,
.header .header-right .account span,
.header_menu .account-header a,
.header_menu .account-header span,
.header_menu .header-right .account a,
.header_menu .header-right .account span {
  color: #D4AF37 !important;
}

/* Chữ "Đăng nhập" */
.header .account-header small,
.header .account-header small a,
.header_menu .account-header small,
.header_menu .account-header small a {
  color: #FFFFFF !important;
}

/* Nút giỏ hàng */
.header .mini-cart > a,
.header_menu .mini-cart > a {
  color: #D4AF37 !important;
  border: 1px solid rgba(212, 175, 55, 0.65) !important;
  background: transparent !important;
  border-radius: 6px !important;
}

/* Chữ trong giỏ hàng */
.header .mini-cart > a span,
.header .mini-cart > a b,
.header_menu .mini-cart > a span,
.header_menu .mini-cart > a b {
  color: #D4AF37 !important;
}

/* Số lượng trong giỏ hàng */
.header .mini-cart .count_item,
.header_menu .mini-cart .count_item,
.header .mini-cart .count,
.header_menu .mini-cart .count {
  background: #D4AF37 !important;
  color: #0A0A0A !important;
  border-radius: 4px !important;
  font-weight: 700 !important;
}
/* HY STORE - Fix uploaded gold header icons */
.header .header-right img,
.header_menu .header-right img,
.header .hotline img,
.header_menu .hotline img,
.header .account-header img,
.header_menu .account-header img,
.header .mini-cart img,
.header_menu .mini-cart img {
  filter: none !important;
  opacity: 1 !important;
}
/* FIX lỗi nền đen ở tiêu đề biến thể sản phẩm */
.swatch .header {
  background: transparent !important;
  color: #111111 !important;
  flex: 0 0 100% !important;
  width: 100% !important;
  margin: 0 0 10px !important;
  padding: 0 !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
}

/* Tối ưu ô chọn biến thể */
.swatch {
  gap: 10px !important;
  margin-bottom: 18px !important;
}

.swatch-element label {
  background: #ffffff !important;
  color: #111111 !important;
  border: 1px solid #D4AF37 !important;
  min-height: 38px !important;
  padding: 8px 18px !important;
  border-radius: 999px !important;
}

.swatch .swatch-element input:checked + label {
  background: #D4AF37 !important;
  color: #111111 !important;
  border-color: #D4AF37 !important;
  font-weight: 600 !important;
}
/* HY PageSpeed Fix - reduce CLS */
.section_slider picture,
.section_slider img,
.top-banner img,
.policies img {
  display: block;
}

.section_slider .items {
  min-height: 1px;
}

.flashsale__countdown-wrapper {
  min-height: 32px;
}

.flashsale__news {
  min-height: 28px;
}

.item_product_main .product-thumbnail {
  aspect-ratio: 1 / 1;
}

.item_product_main .product-info {
  min-height: 96px;
}

.product-name {
  min-height: 40px;
}

/* HY STORE - Manual Product Review Block */
.hy-review-source {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  overflow: hidden !important;
}

.hy-product-review-block {
  margin: 28px 0 0;
  padding: 20px;
  border: 1px solid rgba(212, 175, 55, 0.35);
  border-radius: 12px;
  background: #fff;
}

.hy-product-review-block h2 {
  margin: 0 0 14px;
  font-size: 22px;
  font-weight: 700;
  color: #111;
}

.hy-product-review-card {
  padding: 16px;
  border-radius: 10px;
  background: #fafafa;
}

.hy-product-review-stars {
  margin-bottom: 10px;
  font-size: 22px;
  letter-spacing: 2px;
  color: #d4af37;
  line-height: 1;
}

.hy-product-review-body {
  margin-bottom: 12px;
  font-size: 15px;
  line-height: 1.6;
  color: #333;
}

.hy-product-review-meta {
  font-size: 13px;
  color: #666;
}

/* HY STORE - Product Review Multiple Cards */
.hy-product-review-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
}

.hy-product-review-summary {
  font-size: 14px;
  color: #666;
  white-space: nowrap;
}

.hy-product-review-summary strong {
  color: #111;
}

.hy-product-review-card + .hy-product-review-card {
  margin-top: 12px;
}

/* HY STORE - Header search layout fix */
.sr-only,
.visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.header_menu .mid-header .row {
  flex-wrap: nowrap;
}

.header_menu .hy-header-search-col {
  min-width: 0;
}

.header_menu #search-header {
  padding-left: 18px;
  padding-right: 18px;
}

.header_menu #search-header .custom-input-group {
  width: 100%;
  max-width: 680px;
  min-width: 0;
  height: 44px;
  margin: 0 auto;
  overflow: hidden;
  border-radius: 999px;
  background: #ffffff;
}

.header_menu #search-header .custom-input-group .input-group-field {
  height: 44px;
  padding: 0 72px 0 22px;
  border: 0 !important;
  border-radius: 999px;
  font-size: 15px;
  line-height: 44px;
  color: #1A1A1A;
  background: #ffffff !important;
  text-overflow: ellipsis;
}

.header_menu #search-header .custom-input-group .input-group-btn {
  width: 64px;
  height: 44px;
  right: 0;
  top: 0;
  background: #050505;
  border-radius: 0 999px 999px 0 !important;
}

.header_menu #search-header .custom-input-group .input-group-btn .btn {
  width: 64px;
  height: 44px !important;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.header_menu #search-header .custom-input-group .input-group-btn svg,
.header_menu #search-header .custom-input-group .input-group-btn .icon {
  color: #D4AF37 !important;
  fill: #D4AF37 !important;
}

.header_menu #search-header .search-dropdow {
  max-width: 680px;
  margin: 6px auto 0;
  overflow: hidden;
}

.header_menu .hy-header-actions-col {
  min-width: 0;
}

.header_menu .hy-header-actions-col > .header-right {
  justify-content: flex-end;
  gap: 12px;
}

.header_menu .hy-header-actions-col .header-right > li {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

@media (min-width: 992px) and (max-width: 1199.98px) {
  .header_menu #search-header {
    padding-left: 12px;
    padding-right: 12px;
  }

  .header_menu #search-header .custom-input-group {
    max-width: 600px;
  }

  .header_menu .hotline .media-body,
  .header_menu .hy-header-actions-col .media-body {
    font-size: 13px;
  }
}

@media (max-width: 991.98px) {
  .header_menu .mid-header .row {
    flex-wrap: wrap;
  }

  .header_menu #search-header {
    padding-left: 15px;
    padding-right: 15px;
  }

  .header_menu #search-header .custom-input-group {
    max-width: 100%;
    height: 42px;
  }

  .header_menu #search-header .custom-input-group .input-group-field {
    height: 42px;
    line-height: 42px;
    padding-left: 18px;
    padding-right: 62px;
    font-size: 14px;
  }

  .header_menu #search-header .custom-input-group .input-group-btn,
  .header_menu #search-header .custom-input-group .input-group-btn .btn {
    width: 56px;
    height: 42px !important;
  }
}

@media (max-width: 767px) {
  .hy-product-review-header {
    align-items: flex-start;
    flex-direction: column;
  }
}

/* HY STORE - Header settings reliability fix */
.header_menu .mid-header {
  background: var(--header-background) !important;
  padding-top: 10px !important;
  padding-bottom: 10px !important;
  min-height: 84px;
}

.header_menu .header-left {
  display: flex;
  align-items: center;
  position: relative;
  z-index: 3;
}

.header_menu .logo-wrapper {
  display: inline-flex !important;
  align-items: center;
  justify-content: flex-start;
  width: 300px;
  max-width: 100%;
  min-height: 64px;
  position: relative;
  z-index: 3;
}

.header_menu .logo-wrapper img {
  width: 300px !important;
  max-width: 100% !important;
  height: auto !important;
  max-height: 64px !important;
  object-fit: contain !important;
  opacity: 1 !important;
  filter: none !important;
  visibility: visible !important;
}

.top-banner {
  min-height: 1px !important;
  height: auto !important;
  line-height: normal !important;
  overflow: hidden !important;
}

.top-banner a {
  width: 100%;
}

.top-banner img {
  width: 100% !important;
  max-width: 100% !important;
  max-height: none !important;
  height: 100% !important;
  object-fit: cover !important;
}

@media (max-width: 767px) {
  .top-banner a.d-md-none {
    display: block !important;
  }

  .top-banner a.d-md-block {
    display: none !important;
  }

  .header_menu .mid-header {
    min-height: auto;
  }

  .header_menu .logo-wrapper {
    width: 180px;
    min-height: 38px;
  }

  .header_menu .logo-wrapper img {
    width: 180px !important;
    max-height: 38px !important;
  }

}

@media (min-width: 768px) {
  .top-banner a.d-md-none {
    display: none !important;
  }

  .top-banner a.d-md-block {
    display: block !important;
  }
}

.subheader {
  background: var(--subheader-background) !important;
  color: var(--subheader-color) !important;
}

.subheader .toogle-nav-wrapper {
  background: var(--subheader-color) !important;
  color: var(--subheader-background) !important;
}

.subheader .toogle-nav-wrapper .icon-bar .bar {
  background: var(--subheader-background) !important;
}

.subheader .menu-bar,
.subheader .category-action,
.subheader .menu-title {
  background: var(--subheader-color) !important;
  color: var(--subheader-background) !important;
}

/* HY STORE v1.6 — keep the mobile logo centered between menu and cart. */
@media (max-width: 767.98px) {
  .header_menu .header-left,
  .header_menu.active .header-left {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center;
  }

  .header_menu .logo-wrapper,
  .header_menu.active .logo-wrapper {
    justify-content: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .header_menu .logo-wrapper img,
  .header_menu.active .logo-wrapper img {
    display: block !important;
    margin: 0 auto !important;
  }
}

/* HY STORE v1.8 — one hover-intent system for homepage, inner pages and
   sticky desktop navigation. Compact panels follow the selected row and both
   menu levels remain visible while the pointer crosses between them. */
@media (min-width: 1025px) {
  body#template-index .home-navigation-wrapper {
    position: relative;
  }

  .hystore-menu-intent-wrapper
    > nav
    > .navigation
    > .menu-item
    > .submenu {
    top: var(--hy-menu-submenu-top, 0px) !important;
    bottom: auto !important;
    left: calc(100% - 15px) !important;
    min-height: 64px !important;
  }

  .hystore-menu-intent-wrapper
    > nav
    > .navigation
    > .menu-item.hy-menu-open
    > .submenu,
  .hystore-menu-intent-wrapper
    > nav
    > .navigation
    > .menu-item:focus-within
    > .submenu {
    display: block !important;
    z-index: 902 !important;
  }

  .hystore-menu-intent-wrapper
    > nav
    > .navigation
    > .menu-item.hy-menu-open {
    background: var(--light);
  }

  .hystore-menu-intent-wrapper
    > nav
    > .navigation
    > .menu-item.hy-menu-open
    > .menu-item__link {
    color: var(--primary-color);
  }

  .toogle-nav-wrapper.hy-nav-intent-open > .navigation-wrapper {
    opacity: 1 !important;
    visibility: visible !important;
    z-index: 90 !important;
  }

  body.hy-menu-intent-active::before {
    content: "";
    position: fixed;
    top: 0;
    left: 0;
    z-index: 20;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.3);
  }

  body.hy-menu-intent-active .subheader {
    position: relative;
    z-index: 99;
  }

  body.hy-menu-intent-active .header_menu {
    position: relative;
    z-index: 100;
  }
}

/* The four Haravan color settings control four distinct surfaces. The policy
   list must stay transparent; its former hardcoded white background caused
   the configured subheader color to appear only in the outer gutters. */
header.header.header_menu,
header.header.header_sticky,
.header_menu .mid-header,
.header_sticky .mid-header {
  color: var(--header-color) !important;
  background-color: var(--header-background) !important;
}

@media (min-width: 1024px) {
  .subheader,
  .subheader > .container,
  .subheader .shop-policises {
    color: var(--subheader-color) !important;
    background-color: var(--subheader-background) !important;
  }

  .subheader .shop-policises .link {
    color: var(--subheader-color) !important;
  }

  .subheader .shop-policises .link:hover {
    color: var(--secondary-color) !important;
  }

  .subheader > .container > .toogle-nav-wrapper {
    color: var(--subheader-background) !important;
    background-color: var(--subheader-color) !important;
  }

  .subheader
    > .container
    > .toogle-nav-wrapper
    > .icon-bar {
    color: inherit !important;
    background: transparent !important;
  }

  .subheader
    > .container
    > .toogle-nav-wrapper
    > .icon-bar
    .bar {
    background: var(--subheader-background) !important;
  }
}

/* HY STORE v1.9 - responsive stability for header, menus, product sidebar and cart. */
@media (min-width: 1024px) {
  /* The intent controller owns the desktop backdrop. The legacy sibling
     overlay could remain visible after the pointer had already left a menu. */
  .header_menu .sticky-overlay,
  .header_sticky .sticky-overlay {
    display: none !important;
  }

  /* Keep the product description from inheriting the full height of a long
     sidebar list. The list remains available but does not stretch the row. */
  .product-sidebar-title {
    max-height: 660px;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
  }
}

@media (max-width: 991.98px) {
  .header_menu .mid-header {
    min-height: 0 !important;
    padding: 8px 0 10px !important;
  }

  .header_menu .mid-header .row {
    display: grid !important;
    grid-template-columns: 48px minmax(0, 1fr) 48px;
    grid-template-areas:
      "menu logo actions"
      "search search search";
    align-items: center !important;
    gap: 8px 10px;
    margin: 0;
  }

  .header_menu .mid-header .header-right.d-lg-none {
    grid-area: menu;
    display: block !important;
    width: auto;
    max-width: none;
    padding: 0;
  }

  .header_menu .mid-header .header-left {
    grid-area: logo;
    display: flex !important;
    width: auto;
    max-width: none;
    min-height: 42px;
    padding: 0;
    justify-content: center;
  }

  .header_menu .mid-header .hy-header-actions-col {
    grid-area: actions;
    display: flex;
    width: auto;
    max-width: none;
    min-width: 0;
    padding: 0;
    justify-content: flex-end;
  }

  .header_menu .mid-header #search-header {
    grid-area: search;
    display: block !important;
    width: 100%;
    max-width: none;
    min-width: 0;
    padding: 0 !important;
  }

  .header_menu .logo-wrapper {
    width: min(180px, 100%) !important;
    min-height: 42px !important;
    justify-content: center;
  }

  .header_menu .logo-wrapper img {
    width: auto !important;
    max-width: 100% !important;
    max-height: 42px !important;
  }

  .header_menu #search-header .custom-input-group {
    display: flex !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0;
    height: 42px !important;
    margin: 0 !important;
  }

  .header_menu #search-header .custom-input-group .input-group-field {
    position: static !important;
    flex: 1 1 auto;
    width: 1% !important;
    min-width: 0;
    height: 42px !important;
    padding: 0 14px !important;
    line-height: 42px !important;
  }

  .header_menu #search-header .custom-input-group .input-group-btn {
    position: static !important;
    flex: 0 0 52px;
    width: 52px !important;
    height: 42px !important;
  }

  .header_menu #search-header .custom-input-group .input-group-btn .btn {
    width: 52px !important;
    height: 42px !important;
  }

  .header_menu #search-header .search-dropdow {
    display: none;
  }

  #mobile-menu {
    width: min(86vw, 340px);
    max-width: 340px;
    z-index: 10050 !important;
  }

  #mobile-menu .menu-close-btn {
    position: absolute;
    left: auto !important;
    right: 0;
  }

  #mobile-menu.active + .menu-overlay {
    z-index: 10040 !important;
  }

  body.hy-mobile-menu-open {
    overflow: hidden !important;
    touch-action: pan-y;
  }

  body.hy-mobile-menu-open .backtop,
  body.hy-mobile-menu-open .ega-cr-addon {
    visibility: hidden !important;
    pointer-events: none !important;
  }

  /* The compact horizontal rail prevents the product-page sidebar from
     becoming a long vertical column on phones and tablets. */
  .product-sidebar-title {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 12px;
    overflow-x: auto !important;
    overflow-y: hidden;
    padding: 0 12px 10px;
    scroll-snap-type: x proximity;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }

  .product-sidebar-title::-webkit-scrollbar {
    display: none;
  }

  .product-sidebar-title .item_product_main.product--media {
    flex: 0 0 min(78vw, 360px) !important;
    width: min(78vw, 360px);
    margin: 0 !important;
    scroll-snap-align: start;
  }
}

@media (max-width: 767.98px) {
  body {
    padding-bottom: calc(64px + env(safe-area-inset-bottom));
  }

  .backtop {
    right: auto !important;
    left: 12px !important;
    bottom: calc(76px + env(safe-area-inset-bottom)) !important;
    width: 40px;
    height: 40px;
  }

  #template-cart {
    padding-bottom: calc(76px + env(safe-area-inset-bottom));
  }

  #template-cart .ega-cr-addon {
    display: none !important;
  }

  #template-cart .cart-sticky-cta {
    bottom: 0 !important;
    z-index: 1000 !important;
    padding: 8px 12px calc(8px + env(safe-area-inset-bottom)) !important;
  }

  #template-cart .cart-cta {
    gap: 8px;
    margin: 0 !important;
    padding: 0 !important;
    align-items: center;
  }

  #template-cart .cart-cta .btn-proceed-checkout-mobile {
    min-height: 42px;
    height: auto;
    padding: 8px 16px;
    white-space: normal;
  }

  #template-cart .cart-related-list:not(.slick-initialized) {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: stretch;
    gap: 16px 10px;
    margin: 0 !important;
  }

  #template-cart
    .cart-related-list:not(.slick-initialized)
    > .cart-related-item {
    display: flex;
    width: auto !important;
    max-width: none !important;
    min-width: 0;
    margin: 0 !important;
    padding: 0 !important;
  }

  #template-cart .cart-related-section .item_product_main,
  #template-cart .cart-related-section .item_product_main > form {
    width: 100%;
    min-width: 0;
  }

  #template-cart .cart-related-section .item_product_main > form {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    height: 100%;
  }

  #template-cart .cart-related-section .product-thumbnail {
    width: 100%;
  }

  #template-cart .cart-related-section .product-info {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-width: 0;
    padding: 8px 2px 4px;
  }

  #template-cart .cart-related-section .product-name {
    min-height: 38px;
    margin-bottom: 6px;
    overflow-wrap: anywhere;
  }

  #template-cart .cart-related-section .product-item-cta {
    min-height: 38px;
    margin-top: auto;
    padding-right: 34px;
  }

  #template-cart .cart-related-section .price-box {
    min-width: 0;
  }

  #template-cart .cart-related-section .price,
  #template-cart .cart-related-section .compare-price {
    white-space: normal;
  }
}

/* HY STORE v1.9.2 - keep the category trigger visible in the desktop
   sticky header. The general logo reliability rule uses !important, so the
   sticky state needs an explicit, later override. */
@media (min-width: 992px) {
  .header_menu:not(.active)
    .header-left
    > .toogle-nav-wrapper {
    display: none !important;
  }

  .header_menu.active
    .header-left
    > .logo-wrapper {
    display: none !important;
  }

  .header_menu.active
    .header-left
    > .toogle-nav-wrapper {
    display: block !important;
    width: 100%;
    margin: 0 !important;
    padding: 0 14px;
    color: var(--subheader-background) !important;
    background: var(--subheader-color) !important;
    border-radius: 4px;
  }

  .header_menu.active
    .hy-sticky-category-trigger {
    display: flex !important;
    width: 100%;
    min-width: 0;
    white-space: nowrap;
  }

  .header_menu.active
    .hy-sticky-category-label {
    display: inline !important;
    overflow: hidden;
    color: var(--subheader-background) !important;
    text-overflow: ellipsis;
  }

  .header_menu.active
    .hy-sticky-category-trigger
    .bar {
    background: var(--subheader-background) !important;
  }

  .header_menu.active
    .header-left
    > .toogle-nav-wrapper
    > .navigation-wrapper {
    margin-top: 0 !important;
  }
}


/* HY STORE: keep mobile header controls active until desktop nav starts at 1024px. */
@media (min-width: 992px) and (max-width: 1023.98px) {
  .hy-eva-header .header-right.d-lg-none {
    display: block !important;
    flex: 0 0 25%;
    max-width: 25%;
  }

  .hy-eva-header .toggle-nav.d-lg-none {
    display: flex !important;
  }

  .hy-eva-header .header-left {
    flex: 0 0 50%;
    max-width: 50%;
  }

  .hy-eva-header .hy-header-actions-col {
    flex: 0 0 25%;
    max-width: 25%;
  }

  .hy-eva-header .hy-header-search-col {
    flex: 0 0 100%;
    max-width: 100%;
  }
}