/* Note: Dawn break points: 750px and 990px */
/* Base font Vercel Geist */
html,
body,
h1,
h2,
h3,
h4,
h5,
.h0,
.h1,
.h2,
.h3,
.h4,
.h5 {
  font-family:
    Geist, ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol',
    'Noto Color Emoji';
}
/* Headers common */
h1,
h2,
h3,
h4,
h5,
.h0,
.h1,
.h2,
.h3,
.h4,
.h5 {
  letter-spacing: 0.025em;
  margin-top: 1.2em;
  margin-bottom: 0.5em;
}
h1,
.h1 {
  letter-spacing: 0em;
}
h2,
.h2 {
  font-size: calc(var(--font-heading-scale) * 2.4rem);
}
h3,
.h3 {
  font-size: calc(var(--font-heading-scale) * 2rem);
}
h4,
.h4,
h5,
.h5,
h6,
.h6 {
  font-size: calc(var(--font-heading-scale) * 1.7rem);
}

p,
ul,
ol {
  margin-bottom: 1em;
}
ul ul,
ol ol,
ul ol,
ol ul {
  margin-bottom: 0;
}
ul,
ol {
  margin-left: 1em;
}
ul {
  list-style: initial;
}
ol {
  list-style: decimal;
}
li p:first-child {
  display: inline;
  margin: 0;
}
li p:last-child {
  margin-bottom: 0;
}
li p:nth-child(2) {
  margin-top: 1em;
}
li {
  margin-bottom: 0.2em;
}

/* non critical variables */
:root {
  --trv-shadow-2xs: 0 1px rgb(0 0 0 / 0.05);
}

/* header fixes */
sticky-header {
  /* icon adjustments */
  .header__icons svg.lucide {
    padding: 1rem;
  }
  #cart-icon-bubble .cart-count-bubble {
    bottom: unset;
    left: unset;
    right: 2px;
    top: 2px;
    width: unset;
    height: 1.5rem;
    aspect-ratio: 1 / 1;
  }
}

/* footer fixes */
footer.footer {
  /* Sign up / Newsletter component */
  .footer-block__heading {
    text-align: left;
    margin-top: 2rem;
  }
  form.newsletter-form {
    margin: 0;
    max-width: 100%;
    width: 100%;

    /* Input wrapper */
    .newsletter-form__field-wrapper {
      container: newsletter / inline-size;
      max-width: 100%;
      /* Reset default styles */
      border-width: 0;
      &::before,
      &::after,
      .field::before,
      .field::after {
        display: none;
      }
      .field__input:focus {
        box-shadow: none;
      }
      .field__input {
        border: 1px solid red;
        max-height: 4rem;
        height: 4rem;
      }
      .field {
        display: grid;
        grid-template-columns: auto max(8rem, 25cqw);
        gap: 1.5rem;

        .field__label {
          font-size: 1.4rem;
          top: calc(0.85rem + var(--inputs-border-width));
        }
        .field__input {
          border: 1.5px solid hsl(0deg 0% 100% / 20%);
          background-color: hsl(0deg 0% 100% / 10%);
        }
        .field__input:focus,
        .field__input:not(:placeholder-shown) {
          padding-block: 0;
          padding-inline: 1em;
        }

        .field__input:focus ~ .field__label,
        .field__input:not(:placeholder-shown) ~ .field__label {
          display: none;
        }
        .newsletter-form__button {
          background-color: hsl(240 4.8% 95.9%);
          color: hsl(var(--trv-color-foreground-hsl));
          box-shadow: none;
          /* border: 1px solid red; */
          border-radius: 6px;
          width: 100%;
          ::before {
            content: 'Tilaa';
            padding-inline: 2rem;
            font-weight: 500;
          }
          position: initial;
          svg {
            display: none;
          }
          &:hover {
            background-color: hsl(240 4.8% 95.9% / 80%);
          }
        }
      }
    }
  }
}

/* Footer main layout */
html > body > div > footer.footer .footer__blocks-wrapper {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));

  .footer-block.grid__item {
    &:first-child {
      grid-column: span 2;
    }
    width: 100%;
  }
  @media (max-width: 990px) {
    .footer-block.grid__item:first-child {
      grid-column: 1 / -1;
    }
  }
}
@media (max-width: 570px) {
  html > body > div > footer.footer .footer__blocks-wrapper {
    grid-template-columns: 1fr;
    .footer-block.grid__item.footer-block--menu {
      margin-block: 0;
    }
  }
}
/* Hide newsletter block until it's moved to first block in footer in trv-dawn-hacks.js */
html > body > div > footer.footer .footer-block--newsletter {
  display: none;
}

/* Product card */
.product-card-wrapper {
  container: product-card / inline-size;
  border: 1px solid hsl(var(--trv-color-muted-hsl) / 0.5);
  border-radius: 8px;
  padding: 1.6rem;
  box-shadow: var(--trv-shadow-2xs);
  background-color: #fff;
  /* Image */
  .card__inner {
    border-radius: 4px;
    background-color: hsl(var(--trv-color-muted-light-hsl) / 0.2);
  }
  .card__heading {
    min-height: 3.1em;
    position: relative;
    a.full-unstyled-link {
      font-size: clamp(1.2rem, 8cqw, 1.6rem);
      font-weight: 500;
      overflow: hidden;
      display: -webkit-box;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 2;
    }
    a.full-unstyled-link:hover {
      -webkit-line-clamp: 4;
      position: absolute;
      top: 0;
      left: 0;
      border-radius: 4px;
      background-color: #fff;
      z-index: 1;
    }
    :hover {
      text-decoration: none;
    }
  }
  .card__content {
    .card__badge {
      position: absolute;
      top: -100%;
      right: 0;
    }
  }
  .card-information {
    .caption-with-letter-spacing {
      letter-spacing: 0.08em;
      text-transform: none;
      font-size: clamp(1.2rem, 6cqw, 1.4rem);
    }
    .price-item--regular,
    .price-item--sale {
      font-weight: 600;
    }
  }
  .quick-add.no-js-hidden {
    margin-bottom: 0;
  }
  .quick-add__submit.button {
    background-color: hsl(var(--trv-color-surface-dark-hsl));
    color: hsl(var(--trv-color-foreground-dark-hsl));
    font-size: clamp(1.2rem, 6cqw, 1.4rem);
    min-height: 2em;
    padding: 0.85em 1.6rem;
    font-weight: 500;
  }
}

/* announcement bar */
.announcement-bar__message {
  margin: 0;
}

/* underline to link in p and li elements */
main p,
main li {
  a[href]:not(.link--text, .full-unstyled-link) {
    text-decoration: underline;
    &:hover {
      color: hsl(from currentColor h s l / 0.6);
    }
  }
}

/* Cookie consent */

#shopify-pc__banner.shopify-pc__banner__dialog {
  /* --accept-bg: hsl(var(--trv-color-badge-green-hsl)); */
  /* --accept-text: hsl(161 100% 13%); */
  --accept-text: hsl(165, 100%, 14.9%);
  --accept-bg: hsl(160.9, 100%, 41.4%);
  .shopify-pc__banner__btns.shopify-pc__banner__btns-granular {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    #shopify-pc__banner__btn-accept,
    #shopify-pc__banner__btn-decline {
      border-radius: 8px;
    }
    #shopify-pc__banner__btn-manage-prefs {
      order: 0;
    }
    #shopify-pc__banner__btn-accept {
      font-weight: 600;
      color: var(--accept-text);
      background-color: var(--accept-bg);
      border-color: var(--accept-bg);
      border-width: 1.5px;
      order: 2;
    }
    #shopify-pc__banner__btn-decline {
      order: 1;
    }
  }
}
/* END Cookie consent */

.price--sold-out .price__badge-sold-out {
  margin-left: 1rem;
}

.badge {
  white-space: nowrap;
}

.card__badge {
  position: relative;
  z-index: 2;
}
/* END dawn overrides */

/* App overrides */

/* Judge.me */
:root {
  --judge-me-start-color: #fdcc0d;
}

.jdgm-star::before {
  color: var(--judge-me-start-color);
}
.jdgm-write-rev-link,
.jdgm-widget:not(.jdgm-review-widget--small, .jdgm-review-widget--medium) .jdgm-write-rev-link {
  border-radius: 0.8rem;
}
/* END judge.me */

/* END app overrides */
