:root {
  --color-primary: #003a78;

  --color-theme-primary: #004a99;
  --color-primary-btn: var(--color-theme-primary);
  --color-primary-btn-hover: #003a78;
  --color-secondary: #000000;

  --color-mega-menu-hover: #edf6ff;
  --color-hover-nav-item: #edf6ff;
  --color-search-suggestion-pill: #edf2f8; /* this is not being used at the moment */
  --color-trending-poular-search-bg: #e7edf6; /* this is not being used at the moment */
  --color-search-suggestion-pill-hover: #cbd6e6; /* this is not being used at the moment */
  --color-search-suggestion-pill-hover-color: #00205b; /* this is not being used at the moment */
  --color-refinement-bubble: #dbe8f6;
  --color-refinement-bubble-hover: #cfdef0;
  --color-breadcrumb-current: #336193;
  --color-breadcrum-mobile-arrow: #004a99;
  --grid-view-toggle-bg: #dbe8f6;
  --grid-view-toggle-bg-hover: #cfdef0;
  --color-sort-product-bg: #dbe8f6;
  --color-sort-product-bg-hover: #cfdef0;
  --color-toggle-filter-bg-off: #a2b6cb; /* couldn't find its usage */
  --banner-btn-primary-bg: #004a99;
  --banner-btn-primary-bg-hover: #003a78;
  --banner-btn-secondary-bg-hover: #0c4387;
  --color-btn-round-bg: #edf6ff;
  --color-btn-round-bg-hover: #cfdef0;
  --color-greentax-price: #004a99;
  --color-attachment-hover: #004a99;
  --color-pagination-btn-bg: #dbe8f6;
  --color-pagination-btn-active-bg-hover: #003a78;
  --slider-play-pause-btn-hover: #d9e4f3;

  --banner-color-1: #dbe8f6;
  --banner-color-2: #cfdef0;
  --banner-color-3: #9ed5f2;
  --banner-color-4: #d3e6d5;
  --banner-color-5: #d7e9e6;
  --banner-color-6: #98bdb7;

  --header-top-style1: var(--color-theme-primary);
  --header-top-style2: #9ed5f2;
  --header-top-style3: #dbe8f6;
  --header-top-style4: #d3e6d5;
  --header-top-style5: #98bdb7;
  --header-top-style6: #ffb776;
  --header-top-style7: #e91518;

  /* check it with ux team */
  --color-notify-radio-border: #003a78;
  --color-secondary-btn: #fff;
  --color-secondary-btn-hover: #004a99;
  --color-border: #e3e7ed; /* CHECK THIS */
  --color-filter-input: #336193;

  /* input */
  --color-border-input: #a2b6cb;
  --color-input-placeholder: #336193;
  --color-border-input-active: #b6c9e3;
  --color-input-bg: #f5f8fc;
  --color-input-bg-active: #eaf0f7;

  /* algolia suggestion pills */
  --color-algolia-suggestion-bg: #dbe8f6;
  --color-algolia-suggestion-bg-hover: #b2cae7;

  --color-mega-menu-separator: #a2b6cb;
  --color-mega-menu-separator-right: #a2b6cb;
  --color-cross-icon: #003a78;

  --toast-bg-success: #d3e6d5;
}

/* clc rounded buttons */
.bzl-button,
.algolia-toolbar__toggle,
.pagination__button,
.apply-filter-btn {
  border-radius: 100px;
}

.bzl-button {
  min-height: 44px;
}

.apply-filter-btn {
  height: 44px !important;
}

/* secondary button*/
.bzl-button--secondary {
  border: 1px solid var(--color-primary);
}

.bzl-button-secondary:hover {
  border-color: #004a99;
  background: #004a99;
  color: white;
}

.bzl-modal .bzl-button--secondary:hover {
  color: white !important;
}

.sort-trigger {
  border-radius: 20px;
}

.custom-sort-dropdown ul,
.custom-sort-dropdown ul li:last-child {
  border-bottom-left-radius: 20px;
  border-bottom-right-radius: 20px;
}

.home-page .product-carousel h2 {
  color: #004a99;
}

.pagination__button--active {
  background-color: #004a99;
}

div.product-tile__container--quantity button {
  margin-top: 12px;
}

.isLoggedOut div.product-tile__container--quantity button {
  margin-top: 20px;
}

.banner-grid .banner,
.asymmetric-banner .banner,
.dual-banner .banner,
.product-carousel .product-tile,
.banner-slider .embla__button {
  border: 1px solid #c7d3e0;
}

.banner-slider .embla__button:hover {
  background: #cfdef0;
}

.category-tile__title a,
.product-tile__name a:hover,
.product-tile__brand-label a:hover,
.plp-page .heading {
  color: #004a99;
}

.header-notification .theme-style-7 {
  color: var(--color-white);
}

.header-notification .theme-style-2 {
  color: var(--color-primary);
}

.round__btn:hover .heart,
.round__btn:hover .notify-icon {
  display: none;
}

.round__btn:hover .heart-filled,
.round__btn:hover .notify-icon-filled {
  display: block;
}

.bzl-checkbox__input:checked + .bzl-checkbox__label .bzl-checkbox__custom-box {
  background-color: #004a99;
  border-color: #004a99;
}

.shell:has(.home-page) {
  background-color: #f4faff;
}

.cr__chip:hover {
  color: #002d5d;
}

.radio-button .radio-button__label {
  border-radius: 1000px;
  box-sizing: border-box;
  min-height: 44px;
  padding: 8px 16px;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* TODO: this will be removed in future with sticky header change */
.algolia-toolbar {
  top: 132px;
}

/* .algolia-facets
  .ais-Panel
  .ais-CurrentRefinements-list
  .ais-CurrentRefinements-item
  .ais-CurrentRefinements-category {
  &:hover {
    color: #002d5d;
  }
} */
