/* For now I am making it do this for Scheme 1 only. */

.color-background-1 {
  /* Upselling Desktop */
  .upselling__content .full-unstyled-link,
  .upselling__content .card-information > .price,
  .upselling__content .unit-price {
    color: #454142 !important;
  }

  .cart-items-wrapper {
    div,
    ul,
    li,
    a,
    span,
    h1,
    form,
    input,
    label,
    button,
    select,
    option,
    hr,
    script,
    style,
    link,
    p {
      color: #454142 !important;
    }
  }

  .cart-items-wrapper .flex__cont {
    p,
    h2 {
      color: rgb(255, 255, 255) !important;
    }
  }

  .checkout p {
    color: rgb(255, 255, 255) !important;
  }

  /* Cart drawer checkout button & pdp CTA - orange */
  #CartDrawer-Checkout.cart__checkout-button,
  .product .product-form__submit.button,
  .product__buy-button-mobile-container .product-form__submit.button {
    background-color: #f59100 !important;
    color: #ffffff !important;
  }

  /* Cart page checkout button - orange */
  #checkout.cart__checkout-button {
    background-color: #f59100 !important;
    color: #ffffff !important;
  }

  .metafield-rich_text_field p {
    color: #454142 !important;
  }

  .cart-items-wrapper .metafield-rich_text_field p {
    color: #fefefe !important;
  }

  cart-drawer.is-empty .cart__empty-text {
    color: #454142 !important;
  }

  .breadcrumbs__link,
  .breadcrumbs__item:not(:last-child):after {
    color: #454142 !important;
  }

  /* General backgrounds that needed to also connect */
  .content-for-layout {
    background: rgb(var(--color-background));
  }

  .rich-text__blocks .rich-text__heading,
  .rich-text__blocks .rte,
  .shopify-policy__container p,
  .shopify-policy__container h1 {
    color: #454142 !important;
  }

  .header {
    label {
      color: rgb(var(--color-button));
    }
    /*  Menu rounded pill */
    .header__lower-container__first {
      background-color: rgb(var(--color-button));
    }
    .header__lower-container__second {
      background-color: rgb(var(--color-button));
    }

    /*  Menu Icon backgrounds - map and account */
    .header__icons .single__icon {
      background: rgb(var(--color-button));
      padding: 10px;
      border-radius: 100%;
      display: inline-flex;
      align-self: center;
      width: fit-content;
      height: fit-content;
    }

    .header__icons .single__icon svg:hover path {
      fill: #f59100 !important;
      stroke: none !important;
    }

    /*  Menu rounded pill Text */
    .header__active-menu-item,
    .header__menu-item span {
      color: rgb(var(--color-foreground));
    }
    .header__lower-container__second p {
      color: rgb(var(--color-foreground));
    }
    .header__lower-container__second span {
      color: rgb(var(--color-foreground));
    }
    /* svg path {
      stroke: #454142 !important;
    } */
    /*  Search Border */
    .field:after {
      border: 0.1rem solid rgb(var(--color-button));
    }
  }
  /*  Top bar underline */

  .utility-bar--bottom-border {
    border-bottom: 0.1rem solid rgb(245 245 245);
  }

  .footer {
    h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    li,
    td,
    th,
    span,
    a,
    p,
    .footer-block__details-content .list-menu__item--link {
      color: #454142 !important;
    }
  }

  .collection .grid .card {
    border: 2px solid #fbf8f0;
  }

  .collection .grid .card__information,
  .collection .grid .price {
    a,
    span {
      color: #454142;
    }
  }

  .product-card-wrapper .card__content {
    margin-top: 20px !important;
    background-color: #ffffff;
  }

  .facets-container .collection-breadcrumbs {
    li,
    a {
      color: #454142;
    }
  }
  .facets-container span,
  .facet-filters__sort {
    color: #454142;
  }

  .facets-container .button--primary {
    color: #ffffff !important;
  }

  .facets__disclosure,
  .facet-filters__sort {
    border: 1px solid #454142 !important;
  }
  .facets__summary {
    color: rgb(0 0 0 / 75%);
  }

  /* Product page info container */

  .product__media {
    border: 2px solid #fbf8f0;
  }

  /* Tabs section */
  .tabs__wrapper,
  .tab__wrapper,
  .tab__content {
    h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    span,
    a,
    li,
    td,
    th,
    label,
    .rte,
    .accordion__title {
      color: #454142 !important;
    }
  }

  /* Ingredients section */
  .ingredients-container,
  .ingredients-section {
    h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    p,
    span,
    a,
    li,
    label,
    .rte {
      color: #454142 !important;
    }
  }

  /* PDP Accordion */
  .pdp-accordion summary,
  .pdp-accordion .accordion__title,
  .pdp_accordion__content,
  .pdp_accordion__content p,
  .pdp_accordion__content div,
  .pdp_accordion__content li,
  .pdp_accordion__content span,
  .pdp_accordion__content a,
  .pdp_accordion__content table,
  .pdp_accordion__content th,
  .pdp_accordion__content td,
  .pdp_accordion__content tr {
    color: #454142 !important;
    border-color: rgba(69, 65, 66, 0.2) !important;
  }

  table:not([class]) {
    box-shadow: 0 0 0 0.1rem rgb(0 0 0 / 20%);
  }

  .pdp-accordion summary {
    border-color: #454142 !important;
  }

  .pdp-accordion .icon-accordion-arrow path,
  .pdp-accordion .icon-accordion-arrow line,
  .pdp-accordion .icon-accordion-arrow polyline {
    stroke: #454142 !important;
  }

  .pdp-accordion .icon-accordion {
    fill: #454142 !important;
  }

  /* Related products */
  product-recommendations.related-products,
  .related-products {
    h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    p,
    span,
    a,
    li,
    label,
    .related-products__heading,
    .card__heading,
    .price,
    .rte {
      color: #454142 !important;
    }
  }

  /* Full review list (apps section) */
  .shopify-section--apps,
  section.section [data-block-type] {
    h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    p,
    span,
    a,
    li,
    label,
    .rte {
      color: #454142 !important;
    }
  }

  /* Contact form */
  .contact {
    h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    p,
    a,
    li,
    label,
    .field__label,
    .contact__footnote {
      color: #454142 !important;
    }

    .field__input,
    .text-area.field__input,
    .custom-select__wrapper custom-select {
      color: #454142 !important;
    }

    .field:after {
      border-color: #454142 !important;
    }

    .field__input::placeholder,
    .text-area.field__input::placeholder {
      color: rgb(0 0 0 / 55%) !important;
    }
  }

  .overlay span {
    color: white !important;
  }
}

.card-wrapper .media img {
  transform: scale(1.01);
}

/*
Full variable map:

Background    rgb(var(--color-background))
Text          rgb(var(--color-foreground))
Solid button background  rgb(var(--color-button))
Button label  rgb(var(--color-button-label))
Outline button rgb(var(--color-secondary-button-label))
Shadow        rgb(var(--color-shadow))
*/

/*  All headings and text will auto switch to #454142 text #454142 */
/*  
  h1,
  h2,
  h3,
  h4,
  h5,
  h6,
  li,
  td,
  th,
  span,
  label,
  input,
  textarea,
  select,
  blockquote,
  figcaption,
  caption,
  strong,
  em,
  b,
  i,
  small,
  .rte,
  .rte,
  .field:after {
    color: #454142;
  }
       
    */

/* Search section - force #454142 text */
.color-background-1 .search *,
.color-background-1 form.search *,
.color-background-1 [class*="search"] * {
  color: #454142 !important;
}

/* Fix dependantHidden arrow - solid white on dark nav */
.color-background-1 .header .dependantHidden > svg {
  fill: none !important;
  stroke: white !important;
  color: white !important;
}

.color-background-1 .header .dependantHidden > svg path {
  fill: white !important;
}

.comparison-table__content {
  margin-top: 35px;
}

.color-background-2 .accordion__content p,
.color-background-2 .accordion__content li {
  color: white !important;
}

/* .mega-menu .card-text__wrapper span:hover {
  color: #454142 !important;
} */

.image-with-text__media {
  border: 2px solid #fbf8f0;
}

.image-with-text {
  /* box-shadow: 0 4px 12px 2px #eaeaea63; */
  border-radius: 40px;
}

.nav-link {
  border: 2px solid #fbf8f0 !important;
}

.multicolumn-card a {
  color: white !important;
}

/* Cart opposite colors */
.drawer__header {
  background: rgb(var(--color-background)) !important;
  color: #454142 !important;
}

.drawer__header .h2 {
  color: #454142 !important;
}

.drawer__header .h2 {
  color: #454142 !important;
}

.drawer__close svg > line {
  stroke: #454142 !important;
}

.drawer__close {
  color: #454142 !important;
}

.seperationLine {
  background-color: #454142 !important;
}

.shippingBar__message {
  color: #454142 !important;
}

.drawer__inner {
  background: rgb(var(--color-background)) !important;
  color: #454142 !important;
}

.drawer__header p,
.drawer__header span,
.drawer__header a,
.drawer__header h1,
.drawer__header h2,
.drawer__header h3,
.drawer__header h4,
.drawer__header label {
  color: #454142 !important;
}

.store-locator,
.stockist-result-name {
  color: #454142 !important;
}

#stockist-widget .stockist-icon svg path {
  fill: #454142 !important;
  stroke: #454142 !important;
}

#CybotCookiebotDialog *,
#CybotCookiebotDialogBodyUnderlay * {
  background: #ffffff !important;
  box-sizing: border-box;
  color: #454142 !important;
}

.banner__content {
  background: transparent !important;
  z-index: 1 !important;
  border-radius: 40px;
  box-shadow: 0 0 5px rgb(0 0 0 / 2%);
}

.icons-banner .banner__content {
  background: rgb(var(--color-background)) !important;
  z-index: -1 !important;
  border-radius: 40px;
  box-shadow: 0 0 5px rgb(0 0 0 / 2%);
}

@media (min-width: 749px) {
  .slideshow-new {
    margin-bottom: 35px;
  }
  .usps-section {
    margin-bottom: 40px;
  }
}

@media (max-width: 749px) {
  .icons-banner .banner__content {
    background: rgb(var(--color-background)) !important;
    border: 2px solid rgb(var(--color-shadow));
    z-index: -1 !important;
    border-radius: 40px;
    box-shadow: 0 0 5px rgb(0 0 0 / 2%);
    padding: 16px 45px !important;
  }
}

.tab__content p {
  color: white !important;
}

/* Cart item wrapper - force #454142 text and white background */
.cart-item__wrapper {
  background-color: rgb(var(--color-background)) !important;
  color: #454142 !important;
}

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

.cart-item__wrapper *,
.cart-item__wrapper h1,
.cart-item__wrapper h2,
.cart-item__wrapper h3,
.cart-item__wrapper h4,
.cart-item__wrapper h5,
.cart-item__wrapper h6,
.cart-item__wrapper p,
.cart-item__wrapper span,
.cart-item__wrapper a,
.cart-item__wrapper div,
.cart-item__wrapper li,
.cart-item__wrapper label,
.cart-item__wrapper input,
.cart-item__wrapper button {
  color: #454142 !important;
}

.cart-item__wrapper .frozen__tag > p {
  color: #454142 !important;
}

.cart-item__wrapper svg path {
  fill: #454142 !important;
  stroke: #454142 !important;
}

.cart-item__wrapper .quantity__button svg path {
  fill: #454142 !important;
}

.cart-drawer .quantity-popover-container,
.cart__contents .quantity-popover-container {
  padding: 0;
  border: 1px solid #454142;
  border-radius: 40px;
  margin-right: 10px;
}

/* Tabs section */
.tabs__wrapper,
.tab__wrapper,
.tab__content {
  h1,
  h2,
  h3,
  h4,
  h5,
  h6,
  p,
  span,
  a,
  li,
  td,
  th,
  label,
  .rte,
  .accordion__title {
    color: #454142 !important;
  }
}

.tab__content {
  color: #454142 !important;
}

.drawer__inner {
  .tab__content p {
    color: white !important;
  }
}

.tab__content p:first-child {
  margin-top: 10px !important;
}

.frozen_svg svg path {
  fill: white;
}

.this-is-the-background {
  height: 200px;
  width: 100%;
}

/*
  .kachel-wrapper {
    z-index: 2 !important;
    background:
    */

.shopping-popup-modal__content-info {
  color: #454142 !important;
}

.shopping-popup-modal__content-info .title {
  color: #454142 !important;
  text-align: left;
}

.tab__content p {
  color: #454142 !important;
}

.header__icon svg path {
  stroke: #454142 !important;
}

/* Keep header__icons (store locator, account) SVGs white - no double stroke */
.header__icons .single__icon svg path {
  stroke: white !important;
  stroke-width: 0;
}

/* Account icon needs stroke-width 1.5 */
.header__icons .single__icon.nametagshown svg path {
  stroke-width: 1.5 !important;
}

/* On hover: fill orange, no stroke */
.header__icons .single__icon svg:hover path {
  fill: #f59100 !important;
  stroke: none !important;
}

/* .single__icon:hover {
  color: #f59100 !important;
} */

/* Cart icon: black on mobile, white on desktop */
#cart-icon-bubble-desktop svg path {
  stroke: #454142 !important;
}

@media screen and (min-width: 750px) {
  #cart-icon-bubble-desktop svg path {
    stroke: white !important;
  }
}

/* Hamburger menu icon - force #454142 */
.header__icon--menu svg,
.header__icon--menu svg path,
.header__icon--menu svg line,
.header__icon--menu svg rect {
  stroke: #454142 !important;
  fill: #454142 !important;
}

/* Mobile menu drawer - all text and elements #454142 */
.menu-drawer,
.menu-drawer__inner-container,
.menu-drawer__navigation-container,
.menu-drawer__submenu {
  background-color: rgb(var(--color-background)) !important;
  color: #454142 !important;
}

.menu-drawer *:not(.main_link_text),
.menu-drawer__menu-item,
.menu-drawer__close-button,
.menu-drawer__utility-links a,
.menu-drawer__utility-links span,
.menu-drawer__utility-links .link,
.menu-drawer summary,
.menu-drawer a,
.menu-drawer li,
.menu-drawer button {
  color: #454142 !important;
}

/* main_link_text on submenu cards: white only for Über uns, dark for all others */
.menu-drawer__submenu .main_link_text {
  color: #454142 !important;
}

#link-uber-uns .main_link_text {
  color: #ffffff !important;
}

/* Caret/chevron icons inside the menu drawer */
.menu-drawer .icon-caret path,
.menu-drawer summary svg path {
  fill: #454142 !important;
  stroke: #454142 !important;
}

/* Match cart count bubble in menu drawer to main header */
.menu-drawer .cart-count-bubble {
  background-color: #454142 !important;
  color: #ffffff !important;
}

.menu-drawer .cart-count-bubble span {
  color: #ffffff !important;
}

/* Slideshow inactive dots - brand black */
.slideshow-new
  .slider-counter__link--dots:not(.slider-counter__link--active)
  .dot {
  background-color: #454142 !important;
  border-color: #454142 !important;
}

/* ─── Mobile facets filter panel ─────────────────────────────────────── */

/* Force background to match page background (cream/white) */
.mobile-facets__inner,
.mobile-facets__footer {
  background-color: rgb(var(--color-background)) !important;
  background: var(--gradient-background) !important;
}

/* Force all text to dark */
.mobile-facets,
.mobile-facets__heading,
.mobile-facets__count,
.mobile-facets__sort label,
.mobile-facets__summary span,
.facet-checkbox__text-label {
  color: #454142 !important;
}

/* Sort dropdown value text */
.mobile-facets__sort .select__select {
  color: #454142 !important;
}

/* Close X and caret SVGs inherit correct color */
.mobile-facets__cross svg line,
.mobile-facets__summary svg path {
  stroke: #454142 !important;
}

/* Orange checkbox border (matches desktop .facet-checkbox) */
.mobile-facets__label > svg:first-of-type {
  border: 1px solid #ffa400 !important;
  border-radius: 3px;
  background-color: rgb(var(--color-background));
}

/* Orange fill when checked */
.mobile-facets__label > input[type="checkbox"]:checked ~ svg:first-of-type {
  background-color: #ffa400 !important;
  border-color: #ffa400 !important;
}

/* Checkmark SVG must be transparent so the orange box shows through it,
   and the white path stroke is visible on the orange background. */
.mobile-facets__label .icon-checkmark {
  background-color: transparent !important;
}

.mobile-facets__label .icon-checkmark path {
  stroke: #ffffff !important;
}

/* Active filter tag buttons (BANANE x, BLAUBEEREN x, etc.) keep their primary style */
.active-facets-mobile .active-facets__button-inner.button--primary {
  background-color: #454142 !important;
  color: #ffffff !important;
}

.active-facets-mobile .active-facets__button-inner.button--tertiary {
  color: #454142 !important;
}

.card__content .badge {
  color: #ffffff !important;
}

.collection__title .collection__description {
  color: #454142 !important;
}

.slider-button--prev .icon,
.slider-button--next .icon {
  color: #454142 !important;
}

/* Featured collection slider counter – number style */
.slider-counter span {
  color: #454142;
  font-weight: 500;
  font-size: 12px;
  margin: 5px;
}

.product-form__input label {
  color: #454142 !important;
}

.facet-filters select + svg {
  fill: #454142 !important;
  stroke: #454142 !important;
}

.product-form__input .quantity-label-pdp {
  color: #ffffff !important;
}

.quantity-button__price-wrapper span {
  color: #454142 !important;
}
