/* Booking multi-step + Admin dashboard extras */

.steps-ui{display:flex;gap:.5rem;justify-content:center;margin:0 auto 2rem;flex-wrap:wrap;max-width:720px}
.steps-ui__item{
  display:flex;align-items:center;gap:.5rem;
  padding:.45rem .9rem;border-radius:var(--radius-pill);
  background:var(--c-surface);border:1px solid var(--c-border);
  font-size:.78rem;font-weight:600;color:var(--c-text3);
}
.steps-ui__item.active{color:#fff;background:var(--grad-accent);border-color:transparent}
.steps-ui__item.done{color:var(--c-accent2);border-color:rgba(0,212,170,.25)}
.steps-ui__n{
  width:22px;height:22px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;
  background:rgba(255,255,255,.08);font-size:.72rem;
}
.steps-ui__item.active .steps-ui__n{background:rgba(255,255,255,.2)}

.step-panel{display:none}
.step-panel.active{display:block;animation:fadeUp .3s ease-out}

.qr-box{text-align:center;padding:1rem 0}
.qr-box img{width:min(280px,80vw);height:auto;margin:1rem auto;border-radius:12px;background:#fff;padding:.75rem}
.qr-box__amount{font-size:2rem;font-weight:900}
.qr-box__amount span{background:var(--grad-gold);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}

.dropzone{
  border:1.5px dashed var(--c-border);border-radius:var(--radius);
  padding:1.5rem;text-align:center;cursor:pointer;transition:all .25s;
  background:rgba(0,0,0,.15);
}
.dropzone:hover,.dropzone.drag{border-color:var(--c-accent);background:rgba(108,99,255,.06)}
.dropzone input{display:none}
.dropzone__preview{max-width:220px;margin:1rem auto 0;border-radius:10px;display:none}
.dropzone__preview.show{display:block}

.confirm-code{
  font-size:clamp(1.4rem,3vw,2rem);font-weight:900;letter-spacing:.04em;
  background:var(--grad-accent);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
  margin:.5rem 0 1rem;
}
.alert{
  padding:.85rem 1rem;border-radius:var(--radius-sm);font-size:.85rem;margin-bottom:1rem;
  border:1px solid var(--c-border);background:var(--c-surface);color:var(--c-text2);
}
.alert--err{border-color:rgba(255,80,80,.35);color:#ffb4b4;background:rgba(255,80,80,.08)}
.alert--ok{border-color:rgba(0,212,170,.3);color:var(--c-accent2);background:rgba(0,212,170,.08)}

/* Admin */
.admin-wrap{padding:6.5rem 0 3rem}
.admin-login{
  max-width:420px;margin:2rem auto;padding:2rem;
  background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius);
}
.admin-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin-bottom:1.5rem}
.stat{
  padding:1.1rem;border-radius:var(--radius-sm);background:var(--c-surface);border:1px solid var(--c-border);
}
.stat__v{font-size:1.5rem;font-weight:900;background:var(--grad-accent);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.stat__l{font-size:.75rem;color:var(--c-text3);margin-top:.2rem}
.admin-toolbar{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:1rem;align-items:center;justify-content:space-between}
.admin-filters{display:flex;gap:.35rem;flex-wrap:wrap}
.chip{
  padding:.4rem .85rem;border-radius:var(--radius-pill);font-size:.78rem;font-weight:600;
  background:var(--c-surface);border:1px solid var(--c-border);color:var(--c-text2);
}
.chip.active{background:var(--grad-accent);color:#fff;border-color:transparent}
.atable{width:100%;border-collapse:collapse;font-size:.85rem}
.atable th,.atable td{padding:.75rem .6rem;border-bottom:1px solid var(--c-border);text-align:left}
.atable th{color:var(--c-accent);font-size:.75rem;letter-spacing:.4px}
.atable tr{cursor:pointer}
.atable tr:hover td{background:rgba(108,99,255,.04)}
.badge{
  display:inline-block;padding:.2rem .55rem;border-radius:var(--radius-pill);font-size:.7rem;font-weight:700;
}
.badge--pending{background:rgba(255,184,0,.12);color:var(--c-gold)}
.badge--confirmed{background:rgba(0,212,170,.12);color:var(--c-accent2)}
.badge--cancelled{background:rgba(255,80,80,.12);color:#ff8e8e}
.modal-bg{
  position:fixed;inset:0;background:rgba(0,0,0,.65);z-index:2000;
  display:none;align-items:center;justify-content:center;padding:1rem;
}
.modal-bg.open{display:flex}
.modal{
  width:min(560px,100%);max-height:90vh;overflow:auto;
  background:var(--c-bg2);border:1px solid var(--c-border);border-radius:var(--radius);padding:1.25rem;
}
.modal img{max-width:100%;border-radius:10px;margin-top:.75rem}
.modal__actions{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:1rem}
.hidden{display:none !important}

.pay-opts{display:grid;gap:.7rem;margin:1rem 0}
.pay-opt{
  display:flex;gap:.85rem;align-items:flex-start;
  padding:1rem;border-radius:var(--radius-sm);
  border:1px solid var(--c-border);background:rgba(0,0,0,.15);cursor:pointer;
}
.pay-opt:has(input:checked){border-color:var(--c-accent);background:rgba(108,99,255,.08)}
.pay-opt input{margin-top:.2rem;accent-color:#6c63ff}
.pay-opt strong{display:block;margin-bottom:.2rem}
.pay-opt span{display:block;font-size:.8rem;color:var(--c-text2);line-height:1.55}
input[type="time"]{
  color-scheme: dark;
}
input[type="time"]::-webkit-calendar-picker-indicator{filter:invert(.8);opacity:.8}
.time24{display:flex;align-items:center;gap:.45rem}
.time24 select{flex:1;min-width:0}
.time24 span{font-weight:800;color:var(--c-text2)}
#invoiceFields{display:grid;grid-template-columns:1fr 1fr;gap:.85rem;margin-top:.4rem}
#invoiceFields.hidden{display:none !important}
@media(max-width:700px){#invoiceFields{grid-template-columns:1fr}}

.receipt{
  margin:1rem 0;padding:1rem;border:1px dashed var(--c-border);border-radius:var(--radius-sm);
  background:rgba(0,0,0,.12);
}
.receipt h3{margin:0 0 .6rem;font-size:1rem}

@media print{
  nav,.mesh-bg,.steps-ui,.book__summary,.book__actions,.skip-link{display:none !important}
  body{background:#fff;color:#111}
  .book__panel,.receipt{background:#fff;color:#111;border-color:#ccc}
}

@media(max-width:768px){
  .admin-stats{grid-template-columns:1fr 1fr}
  .atable{font-size:.75rem}
}