@layer base {
  body {
    background-color: theme('colors.parchment.100');
  }
}

/* Modal scroll lock */
body.overflow-hidden {
  overflow: hidden;
  padding-right: var(--scrollbar-width, 0px); /* Prevent layout shift */
}

.product-card {
  transition: transform 0.2s, box-shadow 0.2s;
  border: 1px solid theme('colors.parchment.300');
}

.product-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.05);
}

.cart-preview {
  backdrop-filter: blur(8px);
  border: 1px solid theme('colors.parchment.300');
}

.btn-primary {
  @apply bg-ink-800 text-white px-4 py-2 rounded hover:bg-ink-700 transition-colors;
}

/* Decorative elements */
.feather-divider {
  height: 2px;
  background-image: url('/images/feather-divider.svg');
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  margin: 2rem auto;
  opacity: 0.6;
}

/* Loading indicator */
#loading.htmx-request {
  opacity: 1;
  pointer-events: auto;
}