/* Custom overrides on top of Tailwind CDN */

body {
  font-family: Lato, ui-sans-serif, system-ui, sans-serif;
}

/* Smooth step transitions */
[x-cloak] { display: none !important; }

.step-enter { animation: fadeSlideIn .25s ease both; }
@keyframes fadeSlideIn {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* Design card hover effect */
.design-card {
  transition: transform .2s ease, box-shadow .2s ease;
}
.design-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 12px 32px rgba(0,0,0,.12);
}
.design-card.selected {
  outline: 3px solid #2563eb;
  outline-offset: 2px;
}

/* Progress bar */
.progress-step { transition: background .2s, color .2s; }

/* Stripe element container */
#payment-element {
  min-height: 200px;
}

/* File upload drag area */
.upload-zone {
  transition: border-color .2s, background .2s;
}
.upload-zone.drag-over {
  border-color: #2563eb;
  background: #eff6ff;
}

/* Trust badges */
.trust-bar {
  background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%);
}

/* Quantity selector */
.qty-btn { transition: all .15s; }
.qty-btn.active { background: #1a1a2e; color: #fff; border-color: #1a1a2e; }

/* Order summary sidebar */
.summary-sticky {
  position: sticky;
  top: 24px;
}