/* Lamberts brand specific styles */

:root {
  --buttons-radius: 0.2rem;
  --color-button-text: var(--color-base-background);
  --color-button-disabled: 170, 170, 170;
  --color-brand-red: 198, 41, 30;
  --color-brand-darkblue: 0, 40, 82;
  --color-sale: var(--color-brand-red);
  --input-focus-border: var(--color-black);
  --inputs-radius: 0.2rem;

  --text-size-mobile-5xl: 3rem;
  --text-size-mobile-4xl: 2.6rem;
  --text-size-mobile-3xl: 2.8rem;
  --text-size-mobile-2xl: 2.6rem;
  --text-size-mobile-xl: 2.2rem;
  --text-size-mobile-lg: 1.6rem;
  --text-size-mobile-base: 1.4rem;
  --text-size-mobile-s: 1.2rem;
  --text-size-mobile-xs: 1.1rem;
  --text-size-mobile-xxs: 1rem;
  --text-size-body: 1.4rem;

  --text-size-mini-label: 1.2rem;

  --color-brand-primary-extra-light: 204, 220, 237;
  --color-brand-primary-light: 128, 167, 209;
  --color-brand-primary-normal: 0, 79, 163;
}

@media screen and (min-width: 170px) {
  :root {
    --text-size-body: 1.6rem;
  }
}

.brand-lamberts {
  /* Custom Lamberts styles*/

  .button,
  .shopify-challenge__button,
  .customer button {
    font-family: var(--font-body-family);
    font-size: var(--text-size-base);
    font-weight: var(--font-weight-bolder);
    border-radius: var(--buttons-radius);
    padding: 0 var(--space-19);
    transition: all var(--duration-medium) ease-in-out;
    max-width: unset;
    min-width: unset;

    @media (min-width: 750px) {
      &.button--link {
        padding: 0;
        background: transparent;
      }

      &.button--secondary {
        --color-button-text: var(--color-base-brand-primary);
        --color-button: var(--color-base-light);
        --alpha-button-background: 1;
        --buttons-border-opacity: 0;
      }

      &.button--tertiary {
        --color-button: var(--color-base-background);
        --color-button-text: var(--color-base-brand-primary);
      }

      &.button--outline {
        --color-button: transparent;
        backdrop-filter: blur(0.1rem);
        --color-button-text: var(--color-base-brand-primary);
        --color-button-border-color: var(--color-base-brand-primary);
        --alpha-button-background: 1;
        --buttons-border-opacity: 1;
      }

      &.button--outline.outline-white {
        --color-button: transparent;
        backdrop-filter: blur(0.1rem);
        --color-button-text: var(--color-white);
        --color-button-border-color: var(--color-white);
        --alpha-button-background: 1;
        --buttons-border-opacity: 1;
      }

      &.disabled:not(.button--outline),
      &[disabled]:not(.button--outline),
      &[aria-disabled="true"]:not(.button--outline) {
        --color-button: var(--color-button-disabled);
        --color-button-text: var(--color-base-background);
        --color-button-border-color: var(--color-button-disabled);
        --alpha-button-background: 1;
        opacity: 1;
        background-color: rgba(var(--color-button), var(--alpha-button-background));
      }

      &.disabled.button--outline,
      &[disabled].button--outline,
      &[aria-disabled="true"].button--outline {
        --color-button: transparent;
        --color-button-text: var(--color-button-disabled);
        --color-button-border-color: var(--color-button-disabled);
        --alpha-button-background: 1;
        opacity: 1;
        background-color: rgba(var(--color-button), var(--alpha-button-background));
      }

      &.disabled.button--link,
      &[disabled].button--link,
      &[aria-disabled="true"].button--link {
        background: transparent;
        cursor: not-allowed;
        opacity: 0.5;
      }
    }
  }

  @media (max-width: 749px) {
    .btn-mob.button--mobile {
      --color-button-text: var(--color-white);
      --color-button: var(--color-base-brand-primary);
      --color-base-solid-button-labels: var(--color-white);
    }

    .btn-mob.button--mobile--secondary {
      --color-button-text: var(--color-white);
      --color-button: var(--color-base-brand-secondary);
      --color-base-solid-button-labels: var(--color-white);
    }

    .btn-mob.button--mobile--tertiary {
      --color-button-text: var(--color-base-brand-primary);
      --color-button: var(--color-base-brand-tertiary);
      --color-base-solid-button-labels: var(--color-base-brand-primary);
    }

    .btn-mob.button--mobile--outline {
      --color-button: transparent;
      --color-button-text: var(--color-base-brand-primary);
      --alpha-button-background: 1;
      --buttons-border-opacity: 1;
      --color-button-border-color: var(--color-base-brand-primary);
    }

    .btn-mob.button--mobile--white {
      --color-button: var(--color-white);
      --color-button-text: var(--color-base-brand-primary);
    }
  }

  .button:not([disabled]):not(.disabled):not([aria-disabled="true"]):hover,
  .shopify-challenge__button:hover,
  .customer button:hover,
  .shopify-payment-button__button--unbranded:hover {
    --color-button-text: var(--color-base-background);
    --color-button: var(--color-base-brand-secondary);

    &.button--outline {
      --color-button: var(--color-base-brand-primary);
      --color-button-text: var(--color-white);
      --buttons-border-opacity: 1;
    }

    &.button--outline.outline-white {
      --color-button: var(--color-white);
      --color-button-text: var(--color-base-brand-primary);
      --buttons-border-opacity: 1;
    }
  }

  .mini-label {
    padding: 5px 8px;
  }

  mobile-menu a:not(.disclosure__link),
  mobile-menu-link-block .mobilemenu__link,
  mobile-menu summary.menu-drawer__menu-item {
    font-weight: var(--font-weight-bolder);
  }

  /* Custom Newsletter styles */
  .newsletter-form .field.input-with-button .field__input {
    border-radius: var(--buttons-radius);
  }

  .newsletter__inner .newsletter__left .h2 {
    font-family: var(--font-body-family);
    font-weight: var(--font-weight-medium);
  }

  .newsletter__inner .newsletter__left .footer-block__details-content {
    font-family: var(--font-body-family);
    font-size: var(--text-size-xxs);
    font-weight: var(--font-weight-medium);
  }

  /* Custom Product Card styles */
  .product-card-wrapper,
  .price-per-unit {
    --product-card-title-weight: var(--font-weight-bold);
    --product-card-price-size: 1.6rem;
    --product-card-price-weight: var(--font-weight-bold);
    --product-card-from-text-size: var(--text-size-xs);
    --product-card-from-text-weight: var(--font-weight-regular);
    --product-card-unit-size: var(--text-size-xs);
    --product-card-unit-weight: var(--font-weight-regular);
  }

  .card--standard .card__inner {
    box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.1);
  }

  .card__badge.sale {
    white-space: nowrap;
  }

  .card__badge .badge {
    border-radius: 10rem;
    padding: var(--space-4) var(--space-6);
  }

  .card__badge .badge span {
    display: inline;
    padding: 0;
  }

  /* Custom Footer styles*/
  .footer__list-social .list-social__item {
    border-radius: var(--space-1);
  }

  .facets-container {
    --facets-button-size: var(--text-size-xs);
    --facets-sort-label-weight: var(--font-weight-bolder);
    --facets-filter-buttons-height: 3.8rem;
    --facets-product-count-mobile-weight: var(--font-weight-bold);
  }

  .mobile-facets__open .icon {
    display: none;
  }

  @media screen and (min-width: 750px) {
    .mobile-facets__open {
      min-width: 14rem;
    }
  }

  .pagination-wrapper {
    --pagination-item-weight: var(--font-weight-regular);
    --pagination-count-size: var(--text-size-xs);
  }

  .pagination-wrapper .result-count span {
    font-weight: var(--font-weight-bold);
  }

  .feature-cta {
    --button-font-size: var(--text-size-s);
    --button-font-weight: var(--font-weight-bolder);
    border-radius: var(--card-corner-radius);
    overflow: hidden;
  }

  @media screen and (max-width: 749px) {
    .feature-cta--banner .feature-cta__button {
      width: fit-content;
    }
  }

  /* Rich Text Section */
  .rich-text__content ul,
  .rich-text__content ol {
    padding-left: var(--space-15);
  }

  .rich-text__content ul li,
  .rich-text__content ol li {
    font-weight: var(--font-weight-bold);
  }

  .rich-text__content ul li span,
  .rich-text__content ol li span {
    font-weight: var(--font-weight-regular);
  }

  .rich-text__content ul li::before,
  .rich-text__content ol li::before {
    width: var(--space-12);
    height: var(--space-12);
    left: -3.5rem;
  }

  .rich-text__content h4,
  .rich-text__content h5,
  .rich-text__content h6 {
    font-size: var(--text-size-3xl);
  }

  .rich-text__content p {
    font-size: var(--text-size-body);
    font-weight: var(--font-weight-regular);
  }

  .image-with-text__content .ol-li:not(.benefit-item) {
    padding-left: 4rem;

    &::before {
      width: 2.81rem;
      height: 0.2rem;
      top: 50%;
      left: 0;
      transform: rotate(-108.626deg);
    }
  }

  /* filter menu variables */
  --filters-filter-name-size: var(--text-size-xl);
  --filters-filter-name-weight: var(--font-weight-bold);
  --filters-show-more-size: var(--text-size-xxs);

  /* NTA Storyline */
  .nta-storyline .title {
    font-weight: var(--font-weight-regular);
    line-height: 3.3rem;
  }

  .nta-storyline-list h3 {
    font-weight: var(--font-weight-bolder);
  }

  .nta-storyline-card__info .rte p {
    font-size: var(--text-size-base);
    line-height: 1.8rem;
    font-weight: var(--font-weight-regular);
  }

  @media screen and (max-width: 749px) {
    .nta-storyline .button-wrapper .button {
      min-width: 90%;
    }
  }

  @media screen and (min-width: 990px) {
    .nta-storyline .title {
      line-height: 4.8rem;
      font-weight: var(--font-weight-medium);
      font-size: 4rem;
    }

    .nta-storyline-list h3 {
      font-weight: var(--font-weight-bolder);
      font-size: 2.8rem;
      line-height: 3.8rem;
    }

    .nta-storyline-card__info .rte p {
      line-height: 2.5rem;
    }
  }

  /* Data Statistic Section */
  .data-section__subtitle {
    line-height: 1.8rem;
  }

  .data-section__title {
    line-height: 3.8rem;
    font-size: 2.8rem;
  }

  .data-section__statistic-label {
    font-size: var(--text-size-mobile-base);
    padding-inline: var(--space-2);
  }

  @media screen and (min-width: 750px) {
    .data-section__subtitle {
      font-size: var(--text-size-xl);
      line-height: 2.4rem;
    }

    .data-section__title {
      font-size: 4rem;
      line-height: 5.5rem;
    }

    .data-section__statistic-number {
      font-size: 5.6rem;
      line-height: 6.8rem;
      margin-bottom: 0;
    }

    .data-section__statistic-label {
      font-size: var(--text-size-base);
      padding: 0;
      line-height: 2.5rem;
    }
  }

  /* Info Data Section */
  .info-data-section__title {
    width: 100%;
    line-height: 3.3rem;
  }

  .info-data-section__content ul li,
  .info-data-section__content ol li {
    font-weight: var(--font-weight-bold);
    line-height: 2.2rem;
  }

  .info-data-section .data-statistics__number {
    font-weight: var(--font-weight-bold);
    line-height: 3.8rem;
    color: rgb(var(--color-brand-darkblue));
  }

  .info-data-section .data-statistics__label {
    font-size: var(--text-size-mobile-base);
    font-weight: var(--font-weight-regular);
    line-height: 2rem;
    color: rgb(var(--color-brand-darkblue));
  }

  @media screen and (min-width: 750px) {
    .info-data-section__title {
      line-height: 6.9rem;
    }

    .info-data-section__content p {
      margin-bottom: var(--space-16);
    }

    .info-data-section .data-statistics {
      margin-left: -4.5rem;
      gap: var(--space-18);
    }

    .info-data-section__content ul li::before,
    .info-data-section__content ol li::before {
      left: -3.5rem;
    }
  }

  .map-banner--masked-image svg {
    display: none;
  }

  progress-bar:before {
    background-color: rgb(var(--color-brand-darkblue));
  }

  mobile-menu .accordion-block .accordion-block__summary button {
    --mobilemenu-font-weight: 600;
    font-weight: var(--mobilemenu-font-weight);
  }
}