:root {
  --color-primary: #151613;
  --color-primary-dark: #0f110f;
  --color-primary-light: #2a2c29;
  --color-primary-reverse: #ffffff;
  --bg: #ffffff;
}

/* ================= HEADER ================= */

div#mainnav {
  background: var(--bg);
  color: #151613;
}

.main-nav-container.fixed-header .inner {
  background-color: var(--bg);
  backdrop-filter: blur(9px);
}

.main-nav-container.fixed-pinned .inner {
  box-shadow: 0 0 5px var(--color-primary);
}

.navbar-brand img {
  max-height: 4.5rem;
}

@media (min-width:640px) {
  .navbar-brand img {
    max-height: 7rem;
  }
}

.main-nav-container.fixed-pinned .navbar-brand img {
  max-height: 75px;
  padding: 5px;
}

.sicon-shopping-bag:before,
.sicon-user-circle:before {
  color: #151613;
}

/* ================= TITLES ================= */

.s-block__title h2,
.s-slider-block__title h2 {
  font-size: 1.45rem;
}

/* Remove gradient background behind titles */
[dir=rtl] .s-block__title .right-side,
[dir=rtl] .s-slider-block__title-right {
  background: none !important;
  padding-left: 0 !important;
}

/* ================= BUTTONS ================= */

.s-button-primary {
  border-color: #151613;
  background-color: #151613;
  color: #ffffff;
}

.s-button-primary:hover {
  background-color: #0f110f;
  border-color: #0f110f;
}

.s-button-primary-outline {
  background: #151613;
  color: #ffffff;
  border: 2px solid #0f110f;
}

.s-button-primary-outline:hover {
  background-color: #0f110f;
  color: #ffffff;
}

/* ================= PRODUCTS ================= */

.product-entry {
  border: 0.2px solid #15161333;
}

.s-product-card-vertical {
  border: 1px solid #e5e5e5;
}

/* ================= GRID ================= */

.grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1rem;
}

.grid-flow-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

/* ================= BANNERS ================= */

.banner-entry {
  width: 22%;
  height: 240px !important;
  border-radius: .375rem;
  background: transparent;
}

.banner-entry h3 {
  display: none;
  font-size: 24px;
  line-height: 1.5rem;
  color: var(--color-primary);
}

/* Responsive banner */
@media (max-width:480px){
  .banner-entry {
    width: 48%;
    height: 130px !important;
  }
}

@media (min-width:481px) and (max-width:767px){
  .banner-entry {
    width: 47%;
    height: 177px !important;
  }
}

/* ================= FOOTER ================= */

.footer-is-light .store-footer .store-footer__inner {
  background: var(--color-primary);
  color: #ffffff;
  border-radius: 18px;
}