/* assets/app.css */

/* Smooth transitions */
* { box-sizing: border-box; }

/* Card hover lift */
.card-hover {
  transition: box-shadow 0.15s ease, transform 0.15s ease;
}
.card-hover:hover {
  box-shadow: 0 4px 20px rgba(0,0,0,0.08);
  transform: translateY(-1px);
}

/* Colour swatch preview */
.colour-swatch {
  width: 32px;
  height: 32px;
  border-radius: 6px;
  border: 1px solid rgba(0,0,0,0.1);
  flex-shrink: 0;
}

/* Alpine cloak — hide until Alpine initialises */
[x-cloak] { display: none !important; }

/* Form inputs consistent style */
.field {
  display: block;
  width: 100%;
  padding: 0.5rem 0.75rem;
  border: 1px solid #d1d5db;
  border-radius: 0.5rem;
  font-size: 0.875rem;
  background: white;
  transition: border-color 0.15s;
}
.field:focus {
  outline: none;
  border-color: #2d9660;
  box-shadow: 0 0 0 3px rgba(45,150,96,0.15);
}

/* Badge */
.badge {
  display: inline-flex;
  align-items: center;
  padding: 0.2rem 0.6rem;
  border-radius: 999px;
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}