@theme {
  --default-transition-property: color, background-color, border-color, outline-color, outline-offset, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, visibility, content-visibility, overlay, pointer-events;
  --transition-all: all var(--default-transition-duration) var(--default-transition-timing-function);
  --transition-color: color var(--default-transition-duration) var(--default-transition-timing-function);
  --transition-background: background var(--default-transition-duration) var(--default-transition-timing-function);
  --transition-opacity: opacity var(--default-transition-duration) var(--default-transition-timing-function);
  --transition-transform: transform var(--default-transition-duration) var(--default-transition-timing-function);
  --transition-border: border-color var(--default-transition-duration) var(--default-transition-timing-function);
  --transition-shadow: box-shadow var(--default-transition-duration) var(--default-transition-timing-function);
  --transition-display: display var(--default-transition-duration) var(--default-transition-timing-function);
  --transition-overlay: overlay var(--default-transition-duration) var(--default-transition-timing-function);
  --view-transition-main-duration: var(--default-transition-duration);
}

@media (prefers-reduced-motion) {
  :root,
  :host {
    --default-transition-duration: 0;
    --view-transition-main-duration: 0;
  }
}