/* Load tokens.css before this file. Applies to the customer storefront only. */
@font-face {
  font-family: "Helvetica Now";
  src: url("../fonts/helvetica-now-regular.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "Helvetica Now";
  src: url("../fonts/helvetica-now-bold.woff2") format("woff2");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}

@layer pc-base {
  :where(.pc-storefront) {
    font-family: var(--pc-font-sans);
    font-size: var(--pc-text-base);
    font-weight: var(--pc-weight-regular);
    line-height: var(--pc-leading-body);
    color: var(--pc-color-ink);
    background: var(--pc-color-page);
    color-scheme: light;
    -webkit-text-size-adjust: 100%;
  }
  :where(.pc-storefront, .pc-storefront *, .pc-storefront *::before, .pc-storefront *::after) {
    box-sizing: border-box;
  }
  :where(.pc-storefront) :where(h1, h2, h3, p) { margin: 0; }
  :where(.pc-storefront) :where(button, input, select, textarea) {
    font: inherit;
    color: inherit;
  }
  :where(.pc-storefront) :where(button, a, input, select, textarea):focus-visible {
    outline: var(--pc-focus-width) solid var(--pc-color-focus);
    outline-offset: var(--pc-focus-offset);
  }
  :where(.pc-storefront) :where(button, a, input, select, textarea) {
    transition-property: color, background-color, border-color, box-shadow;
    transition-duration: var(--pc-motion-fast);
    transition-timing-function: var(--pc-ease-standard);
  }
  :where(.pc-storefront) :where(button):disabled {
    opacity: var(--pc-disabled-opacity);
    cursor: not-allowed;
  }
  :where(.pc-storefront) :where(img) {
    display: block;
    max-width: 100%;
    height: auto;
  }
  :where(.pc-storefront) :where(svg.lucide) {
    width: var(--pc-icon-md);
    height: var(--pc-icon-md);
    stroke-width: var(--pc-icon-stroke);
    flex-shrink: 0;
  }
  :where(.pc-storefront) [hidden] { display: none !important; }
  :where(.pc-storefront) .pc-container {
    width: calc(100% - var(--pc-page-gutter) * 2);
    max-width: var(--pc-content-width);
    margin-inline: auto;
  }

  @media (pointer: coarse) {
    :where(.pc-storefront) :where(button, input:not([type="checkbox"]):not([type="radio"]), select) {
      min-height: var(--pc-control-height);
    }
    :where(.pc-storefront) :where(button) { min-width: var(--pc-control-height); }
    :where(.pc-storefront) :where(input, select, textarea) { font-size: 1rem; }
  }
  @media (prefers-reduced-motion: reduce) {
    :where(.pc-storefront, .pc-storefront *, .pc-storefront *::before, .pc-storefront *::after) {
      animation-duration: 0.01ms !important;
      animation-iteration-count: 1 !important;
      transition-duration: 0ms !important;
      scroll-behavior: auto !important;
    }
  }
}

@keyframes pc-panel-enter {
  from { opacity: 0; transform: translateY(var(--pc-motion-distance)); }
  to { opacity: 1; transform: translateY(0); }
}
