/* Halaman auth mandiri (login staf, login/daftar/lupa password pelanggan,
   detail transaksi) — kartu terpusat di atas latar gradasi. Dipakai bersama
   supaya tiap halaman tidak menulis ulang style body/card yang sama. */

.auth-shell {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
}
/* Varian untuk form yang lebih panjang (daftar, detail transaksi) — rata
   atas & bisa discroll, bukan dipusatkan vertikal. */
.auth-shell-block {
  min-height: 100vh;
  padding: 24px 16px;
}
.auth-shell--staff,
.auth-shell-block--staff {
  background: linear-gradient(135deg, #1e2a38, #2f3f52);
}
.auth-shell--customer,
.auth-shell-block--customer {
  background: linear-gradient(135deg, #14532d, #166534);
}
/* Dipakai saat halaman ini di-load di dalam iframe modal (lihat
   Order::index()/paket.html) -- gradasi gelap penuh-viewport pas untuk
   halaman auth mandiri, tapi jadi kotak gelap yang tidak enak dilihat kalau
   di-render di kotak modal yang kecil. */
.auth-shell-block--embed {
  background: #fff;
  min-height: auto;
  padding: 16px;
}

.auth-card {
  width: 100%;
  max-width: 380px;
  margin: 0 auto;
  border: none;
  border-radius: 14px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.25);
}
.auth-card-md {
  max-width: 420px;
}
.auth-card-lg {
  max-width: 480px;
}

.auth-back-home {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: rgba(255, 255, 255, 0.85);
  text-decoration: none;
  font-size: 0.875rem;
}
.auth-back-home:hover {
  color: #fff;
  text-decoration: underline;
}

.voucher-code,
code.voucher {
  font-size: 1rem;
  letter-spacing: 1px;
}

/* ---- Pilihan paket radio (halaman Beli Voucher tamu) ---- */
.paket-option {
  border: 1px solid #dee2e6;
  border-radius: 8px;
  padding: 10px 14px;
  margin-bottom: 8px;
  cursor: pointer;
}
.paket-option:hover {
  background: #f8f9fa;
}
.paket-option input:checked ~ .paket-label {
  font-weight: 600;
}