#top {
  background-color: var(--primary-color-dark);
}
header, .sub-header {
  background-color: var(--primary-color);
}
.mobile-nav-header {
  background-color: var(--secondary-color);
  color: var(--text-on-secondary-color);
  padding-top: 15px;
  padding-bottom: 15px;
  text-align: center;
}
.mobile-nav-close {
  color: var(--text-on-secondary-color) !important;
}
.header-cart, .float-cart {
  background-color: var(--secondary-color);
  color: var(--text-on-secondary-color);
}
.header-cart:hover, .header-cart:focus, .float-cart:hover , .float-cart:focus {
  background-color: var(--secondary-color-light);
  opacity: 1;
}
.header-cart>div:first-child {
  background-color: transparent;
}
.mobile-nav ul.categories-menu li:not(:last-child), #menu .nav .dropdown-menu li:not(:last-child) > a {
  border-bottom: 1px solid #ffffff60;
}
.mobile-nav ul.categories-menu li.has-sub > i {
  color: #fff;
  opacity: 0.5;
}
.mobile-nav ul.categories-menu a {
  color: #fff;
}
ul.categories-menu > li ul {
  background: #ffffff10;
}
.mobile-nav .categories-menu {
  background-color: var(--primary-color);
  color: white;
}

#menu .nav > li > a {
  color: var(--text-on-primary-color);
  background-color: #ffffff20;
  padding: 10px 12px;
  border-radius: 7px;
}
#menu .nav > li > a:hover {
  background-color: #00000010;
}

.actions-container .header-item a {
  background-color: var(--primary-color-dark);
  color: var(--text-on-primary-color);
  border: 1px solid var(--primary-color-dark);
}
.mobile-nav-header .mobile-nav-item {
  border-radius: 5px;
}
#top-links .header-item > a {
  background-color: var(--primary-color);
}
#top-links .header-item > a:hover {
  background-color: var(--primary-color-light);
}
.home-products .card-title span, .product-form .card-title span {
  background-color: var(--primary-color-dark) !important;
  color: var(--text-on-primary-color) !important;
}
.card, #checkout-steps .sections-wrapper, .cart-totals-wrapper.sticky-top {
  border: 1px solid var(--primary-color) !important;
}
.custom-control-input:checked~.custom-control-label::before {
  border-color: var(--primary-color);
  background-color: var(--primary-color);
}
.custom-control-input:not(:disabled):active~.custom-control-label::before {
  border-color: var(--primary-color-dark);
  background-color: var(--primary-color-dark);
}

.list-group-item.active, .list-group-item.active:hover, .list-group-item.active:focus {
  color: #fff;
  background-color: var(--primary-color);
  border-color: var(--primary-color);
}

header:not(.sticky) .top-header {
  border-bottom: 0;
}
.sub-header .navbar-nav {
  border-top: 1px solid var(--primary-color-dark);
  justify-content: center;
  gap: 5px;
}
#menu .nav {
  padding-top: 5px;
  padding-bottom: 5px;
}
#menu .nav .dropdown-menu a {
  color: var(--text-on-primary-color);
}
#menu .nav .dropdown-menu {
  background-color: var(--primary-color);
  border: 1px solid #ffffff60;
  box-shadow: 1px 2px 6px 0px black
}
#menu .nav .dropdown-menu li > a:hover {
  color: var(--text-on-primary-color);
  background-color: #00000020;
}
.breadcrumb li:not(:last-of-type) a {
  color: var(--primary-color-dark);
}
.breadcrumb li:last-of-type a {
  color: var(--primary-color);
}
.table-attributes td.key {
  color: var(--primary-color);
}
.table-attributes td.value {
  color: black;
}
.product-list h2, h4.product-title {
  color: var(--primary-color-dark);
}
.product-card a {
  color: var(--primary-color);
}

.footer-main {
  background-color: var(--primary-color-dark);
}
.footer-main a {
  color: var(--primary-color-light);
}
.footer-main .social-item a {
  border-color: var(--text-on-primary-color);
  color: var(--text-on-primary-color);
}
.footer-main .social-item a:hover {
  background-color: var(--text-on-primary-color);
  border-color: var(--text-on-primary-color);
  color: var(--primary-color-dark);
}