/* ═══════════════════════════════════════════════════════════════
   WaitingZone — Light theme ("Host Stand")
   Warm cream canvas · white cards · rust-orange accent
   Loaded last on every page so it wins over legacy dark styles.
   ═══════════════════════════════════════════════════════════════ */
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@500;600;700&family=Inter:wght@400;500;600;700&display=swap');

:root {
  --bg:#f7f7f8; --card:#FFFFFF; --card2:#f4f4f5;
  --border:#e4e4e7; --border2:#d4d4d8;
  --text:#18181b; --muted:#71717a; --subtle:#52525b;
  --accent:#18181b; --accent-dark:#27272a; --accent-soft:#f4f4f5; --accent-ink:#18181b;
  --green:#18181b; --green-dim:rgba(24,24,27,.10);
  --ok:#15803D; --ok-dim:rgba(21,128,61,.10);
  --warn:#B45309; --warn-dim:#FEF3C7;
  --red:#DC2626; --red-dim:rgba(220,38,38,.09);
  --purple:#3f3f46; --purple-dim:rgba(63,63,70,.09);
  --blue:#3f3f46; --blue-dim:rgba(63,63,70,.09);
  --shadow:0 8px 30px rgba(24,24,27,.08);
}
body, .qf-body { background:var(--bg); color:var(--text); font-family:'Inter',sans-serif; }
h1,h2,h3,.brand-name,.page-header h2 { font-family:'Outfit','Inter',sans-serif; letter-spacing:-.01em; }

/* decorative dark-theme glows → quiet */
.qf-orb { opacity:.07 !important; }
.qf-grid { background-image:none !important; }

/* buttons */
.btn-green,.btn-primary { background:var(--accent); color:#fff; box-shadow:none; }
.btn-green:hover,.btn-primary:hover { background:var(--accent-dark); box-shadow:none; }
.btn-ghost { background:#fff; color:var(--text); border:1px solid var(--border); }
.btn-ghost:hover { background:var(--card2); }
.btn-danger { background:#fff; color:var(--red); border:1px solid #F5C6C6; }
.btn-danger:hover { background:var(--red-dim); }
.form-control { background:#fff; color:var(--text); border:1px solid var(--border2); }
.form-control:hover { border-color:#c4c4cc; }
.form-control:focus { border-color:var(--accent); box-shadow:0 0 0 3px rgba(24,24,27,.12); }
.modal-overlay { background:rgba(24,24,27,.38); }
.modal { background:#fff; border:1px solid var(--border); box-shadow:var(--shadow); }
.modal-form .modal-footer { background:var(--bg); }

/* status semantics: success = green, brand = orange */
.badge { border:1px solid transparent; }
.badge-waiting { background:#FEF3C7; color:#92400E; border-color:#FDE68A; }
.badge-called { background:#FDEADD; color:#7C2D12; border-color:#F9C9A8; }
.badge-seated,.badge-available { background:rgba(21,128,61,.10); color:#15803D; border-color:rgba(21,128,61,.25); }
.badge-occupied,.badge-cancelled,.badge-no-show { background:rgba(220,38,38,.09); color:#DC2626; border-color:rgba(220,38,38,.22); }
.badge-cleaning { background:rgba(109,40,217,.09); color:#6D28D9; border-color:rgba(109,40,217,.22); }
.badge-skipped,.badge-merged { background:#F5F1EA; color:#57534E; border-color:#DDD6CB; }

/* ═══ HOST STAND LAYOUT (dashboard.html) ═══ */
.hs-app { min-height:100vh; background:var(--bg); }
.hs-header { position:sticky; top:0; z-index:30; background:rgba(247,247,248,.92); backdrop-filter:blur(8px); border-bottom:1px solid var(--border); }
.hs-header-in { max-width:1240px; margin:0 auto; padding:14px 24px; display:flex; align-items:center; justify-content:space-between; gap:16px; }
.hs-brand { display:flex; align-items:center; gap:10px; font-family:'Outfit',sans-serif; font-weight:600; font-size:1.2rem; }
.hs-brand .logo { width:36px; height:36px; border-radius:50%; background:var(--accent); color:#fff; display:flex; align-items:center; justify-content:center; font-size:1.05rem; }
.hs-brand em { font-style:normal; color:var(--accent); }
.hs-right { display:flex; align-items:center; gap:14px; font-size:.86rem; color:var(--subtle); }
.hs-right a, .hs-right .hs-link { color:var(--subtle); cursor:pointer; display:inline-flex; align-items:center; gap:5px; }
.hs-right a:hover { color:var(--accent); }
.hs-signout { border:1px solid var(--border); background:#fff; border-radius:8px; padding:6px 12px; font-size:.8rem; font-weight:500; color:var(--text) !important; }
.hs-main { max-width:1240px; margin:0 auto; padding:30px 24px 60px; }
.hs-eyebrow { font-size:.78rem; font-weight:600; letter-spacing:.2em; color:var(--accent); }
.hs-title { font-size:2.3rem; font-weight:600; margin:4px 0 22px; line-height:1.1; }

.hs-stats { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; margin-bottom:28px; }
.hs-stat { background:#fff; border:1px solid var(--border); border-radius:18px; padding:20px 22px; min-height:152px; display:flex; flex-direction:column; }
.hs-stat .lbl { display:flex; justify-content:space-between; align-items:center; font-size:.88rem; color:var(--subtle); }
.hs-stat .lbl i { font-size:1.05rem; opacity:.75; }
.hs-stat .val { font-family:'Outfit',sans-serif; font-size:2.4rem; font-weight:600; line-height:1; margin:14px 0 10px; }
.hs-stat .sub { font-size:.78rem; color:var(--muted); margin-top:auto; }
.hs-stat.s-queue { background:#f4f4f5; border-color:#e4e4e7; }
.hs-stat.s-queue .val { color:var(--accent); }
.hs-stat.s-seated { background:var(--accent-soft); border-color:#d4d4d8; }
.hs-stat.s-seated .lbl,.hs-stat.s-seated .val { color:var(--accent-ink); }
.hs-stat.s-seated .sub { color:#52525b; }
.hs-bar { height:6px; background:#ededf0; border-radius:99px; overflow:hidden; margin:2px 0 8px; }
.hs-bar > span { display:block; height:100%; background:var(--accent); border-radius:99px; transition:width .5s ease; }

.hs-tabs { display:flex; gap:6px; margin-bottom:18px; border-bottom:1px solid transparent; }
.hs-tabs .nav-link { display:inline-flex; align-items:center; gap:7px; padding:9px 12px; border-radius:0; background:none !important; color:var(--muted); font-size:.92rem; font-weight:500; border-bottom:2px solid transparent; cursor:pointer; }
.hs-tabs .nav-link:hover { color:var(--text); }
.hs-tabs .nav-link.active { color:var(--text); border-bottom-color:var(--text); }
.hs-tabs .count { background:var(--accent); color:#fff; border-radius:99px; font-size:.68rem; font-weight:700; padding:1px 7px; }

.page-section { padding:0 !important; }
.hs-card { background:#fff; border:1px solid var(--border); border-radius:18px; overflow:hidden; }
.hs-toolbar { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:14px 18px; border-bottom:1px solid var(--border); flex-wrap:wrap; }
.pills { display:flex; gap:8px; flex-wrap:wrap; }
.pill { border:1px solid var(--border); background:#fff; color:var(--subtle); border-radius:99px; padding:5px 14px; font-size:.82rem; cursor:pointer; font-family:inherit; }
.pill:hover { border-color:var(--border2); }
.pill.on { background:var(--text); color:#fff; border-color:var(--text); }

.q-row { display:flex; align-items:center; gap:16px; padding:14px 18px; border-bottom:1px solid var(--border); }
.q-row:last-child { border-bottom:none; }
.q-pos { width:18px; font-weight:600; color:var(--subtle); text-align:center; }
.q-token { font-family:ui-monospace,'SF Mono',Menlo,monospace; font-weight:700; font-size:.82rem; background:#FDF1D8; color:#7C3A0B; padding:5px 9px; border-radius:7px; }
.q-main { flex:1; min-width:0; }
.q-line { display:flex; align-items:center; gap:8px; flex-wrap:wrap; font-size:.92rem; }
.q-line b { font-weight:600; }
.chip { background:#f4f4f5; color:var(--subtle); font-size:.7rem; font-weight:600; padding:2px 8px; border-radius:99px; }
.q-src { font-size:.76rem; color:var(--muted); }
.q-sub { font-size:.8rem; color:var(--muted); margin-top:3px; }
.q-sub .late { color:var(--red); font-weight:600; }
.q-actions { display:flex; align-items:center; gap:8px; }
.q-actions .btn { padding:7px 13px; font-size:.8rem; border-radius:9px; display:inline-flex; align-items:center; gap:5px; }
.q-actions .btn-quiet { background:#f4f4f5; border:1px solid var(--border); color:var(--text); }
.q-actions .icon-btn { width:30px; height:30px; border-radius:8px; background:none; color:var(--subtle); display:inline-flex; align-items:center; justify-content:center; }
.q-actions .icon-btn:hover { background:var(--card2); color:var(--text); }
.q-empty { padding:46px 20px; text-align:center; color:var(--muted); font-size:.9rem; }

/* tables */
.t-summary { display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
.t-sum { display:inline-flex; gap:6px; align-items:center; font-size:.78rem; color:var(--subtle); }
.tables-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(168px,1fr)); gap:14px; }
.table-card { background:#fff; border:1.5px solid var(--border); border-radius:16px; padding:14px; box-shadow:none; transition:box-shadow .2s; }
.table-card:hover { transform:none; box-shadow:var(--shadow); }
.table-card.available { background:#F2FBF5; border-color:#A7DDB9; }
.table-card.occupied { background:#FEF3F2; border-color:#F5B8B8; }
.table-card.cleaning { background:#F5F2FE; border-color:#CFC2F2; }
.table-card.merged { background:var(--card2); }
.table-card-num { font-family:'Outfit',sans-serif; font-size:1.5rem; font-weight:600; }
.table-card-info { color:var(--subtle); font-size:.8rem; }

/* tables / data views */
.data-table-wrap,.chart-card,.settings-section { background:#fff; border:1px solid var(--border); border-radius:18px; }
.data-table th { background:var(--bg); color:var(--muted); }
.data-table tr:hover td { background:#FBF9F6; }
.stat-card { background:#fff; border:1px solid var(--border); border-radius:18px; }
.stat-card:hover { transform:none; box-shadow:var(--shadow); }

/* analytics */
.an-grid { display:grid; grid-template-columns:1.9fr 1fr; gap:18px; }
.an-card { background:#fff; border:1px solid var(--border); border-radius:18px; padding:22px; }
.an-card h3 { font-size:1.05rem; font-weight:600; }
.an-card .hint { font-size:.84rem; color:var(--muted); margin:2px 0 14px; }
.legend { display:flex; justify-content:center; gap:18px; font-size:.8rem; color:var(--subtle); margin-top:8px; }
.legend i { display:inline-block; width:10px; height:10px; border-radius:50%; margin-right:6px; }
.hbar { display:grid; grid-template-columns:36px 1fr 28px; align-items:center; gap:10px; margin:12px 0; font-size:.82rem; color:var(--subtle); }
.hbar > div { background:#f4f4f5; border-radius:6px; height:30px; overflow:hidden; }
.hbar > div > span { display:block; height:100%; background:#B8500F; border-radius:6px; }

.bottom-nav { display:none !important; }
.toast { background:#fff; color:var(--text); border:1px solid var(--border); box-shadow:var(--shadow); }

@media (max-width:900px) {
  .hs-stats { grid-template-columns:repeat(2,1fr); }
  .an-grid { grid-template-columns:1fr; }
  .hs-right .hide-sm { display:none; }
  .q-row { flex-wrap:wrap; }
  .q-actions { width:100%; justify-content:flex-end; }
}
@media (max-width:520px) { .hs-title{font-size:1.8rem;} .hs-main{padding:22px 14px 50px;} .hs-header-in{padding:12px 14px;} }

/* neutralise legacy accent stripe on table cards */
.table-card, .table-card.available, .table-card.occupied, .table-card.cleaning { border-left-width:1.5px; }
.table-card .info-row svg { color:var(--muted); }