/* Tailwind 4 Preflight setter cursor: default på knapper. */
button:not(:disabled) {
  cursor: pointer;
}

/* Skarpe hjørner er designregelen. Regelen fanger også nettleserens egne
   avrundinger på skjemafelt og knapper, som ikke nullstilles av Preflight.
   Sirkler er unntaket: rounded-full har høyere spesifisitet og vinner, og
   brukes bevisst på avatarer, lagerprikken og kvitteringsmerket. */
*,
*::before,
*::after {
  border-radius: 0;
}

/* MUTHA-style add-to-cart button state animation */
[data-atc-button] .atc-text {
  transition: opacity 0.26s ease-in-out, translate 0.26s ease-in-out, filter 0.26s ease-in-out, clip-path 0.26s ease-in-out;
}
[data-atc-button][data-added="true"] .atc-text {
  opacity: 0;
  translate: 0 -1em;
  filter: blur(2px);
  clip-path: circle(0% at 50% 50%);
}
[data-atc-button] .atc-added {
  opacity: 0;
  translate: 0 4px;
  filter: blur(2px);
  transition: opacity 0.2s cubic-bezier(0.32, 0.72, 0, 1) 0.07s, translate 0.2s cubic-bezier(0.32, 0.72, 0, 1) 0.07s, filter 0.2s cubic-bezier(0.32, 0.72, 0, 1) 0.07s;
}
[data-atc-button][data-added="true"] .atc-added {
  opacity: 1;
  translate: 0 0;
  filter: blur(0);
}
[data-atc-button] .atc-check {
  transform-origin: center;
  transform-box: fill-box;
  transform: scale(0.5);
  transition: transform 0.1s ease-out 0.7s;
}
[data-atc-button][data-added="true"] .atc-check {
  transform: scale(1);
}
[data-atc-button] .atc-ring {
  transform-origin: center;
  transform-box: fill-box;
  transform: scale(0);
  transition: transform 0.2s cubic-bezier(0.32, 0.72, 0, 1) 0.65s, opacity 0.2s cubic-bezier(0.32, 0.72, 0, 1) 0.65s;
}
[data-atc-button][data-added="true"] .atc-ring {
  transform: scale(1.4);
  opacity: 0;
}
[data-atc-button] .atc-line {
  stroke-dasharray: 4;
  stroke-dashoffset: 4;
  transition: stroke-dashoffset 0.32s cubic-bezier(0.33, 1, 0.68, 1) 0.65s;
}
[data-atc-button][data-added="true"] .atc-line {
  stroke-dashoffset: 0;
}
@media (prefers-reduced-motion: reduce) {
  [data-atc-button] .atc-text,
  [data-atc-button] .atc-added,
  [data-atc-button] .atc-check,
  [data-atc-button] .atc-ring,
  [data-atc-button] .atc-line {
    transition-duration: 0.01s;
    transition-delay: 0s;
  }
}

/* Gallery slides carry a transparent border at every width, so the frame stays
   in the box model and the images never shift when the hairline appears. The
   hairline itself is a mobile-only affordance: it marks the slide currently in
   view in the horizontal scroller. From sm up the grid shows every slide at
   once, so no active state exists and no frame is drawn. */
@media (max-width: 639px) {
  #gallery-track > li[data-active] {
    border-color: var(--color-rule, #171717);
  }
}
