/* assets/css/admin.css */
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{font-family:'Segoe UI',system-ui,sans-serif;background:#0a0f0d;color:#e8ede9;font-size:14px;line-height:1.5}
a{color:inherit;text-decoration:none}

/* ── Layout ────────────────────────────────────────────────── */
.app{display:flex;height:100vh;overflow:hidden}
.sidebar{width:220px;flex-shrink:0;background:#111a14;border-right:1px solid #2a3d2e;display:flex;flex-direction:column}
.sidebar-logo{padding:20px 16px 16px;border-bottom:1px solid #2a3d2e}
.logo-badge{background:linear-gradient(135deg,#c9a84c,#e8c96a);color:#1a0f00;font-weight:700;font-size:11px;padding:3px 8px;border-radius:4px;letter-spacing:1px;text-transform:uppercase;display:inline-block;margin-bottom:8px}
.logo-title{font-size:14px;font-weight:600;color:#e8ede9;line-height:1.3}
.logo-sub{font-size:11px;color:#6a8a6d;margin-top:2px}
.sidebar-nav{flex:1;padding:8px 0;overflow-y:auto}
.nav-item{display:flex;align-items:center;gap:10px;padding:9px 16px;cursor:pointer;color:#9ab09d;font-size:13px;transition:all .15s;border-left:3px solid transparent}
.nav-item:hover{background:#182019;color:#e8ede9}
.nav-item.active{background:#1f2b22;color:#c9a84c;border-left-color:#c9a84c}
.nav-item svg{flex-shrink:0;opacity:.8}
.nav-badge{margin-left:auto;background:#c9a84c;color:#1a0f00;font-size:10px;font-weight:700;padding:1px 6px;border-radius:10px}
.sidebar-footer{padding:12px 16px;border-top:1px solid #2a3d2e;font-size:11px;color:#6a8a6d}

.main{flex:1;display:flex;flex-direction:column;overflow:hidden}
.topbar{background:#111a14;border-bottom:1px solid #2a3d2e;padding:0 24px;height:56px;display:flex;align-items:center;gap:10px;flex-shrink:0}
.topbar-title{font-size:16px;font-weight:600;color:#e8ede9}
.topbar-sub{font-size:12px;color:#6a8a6d}
.topbar-actions{margin-left:auto;display:flex;align-items:center;gap:8px}
.status-indicator{display:flex;align-items:center;gap:6px;font-size:12px;color:#9ab09d}
.status-dot{width:7px;height:7px;border-radius:50%}
.dot-green{background:#27ae60;animation:pulse 2s infinite}
.dot-red{background:#e74c3c}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.4}}

.content{flex:1;overflow-y:auto;padding:24px}

/* ── Cards & grids ─────────────────────────────────────────── */
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.grid-3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:16px}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.card{background:#111a14;border:1px solid #2a3d2e;border-radius:12px;padding:20px}
.card-sm{padding:14px 16px}
.card-title{font-size:14px;font-weight:600;color:#e8ede9;margin-bottom:4px}
.card-sub{font-size:12px;color:#6a8a6d}
.stat-card{background:#111a14;border:1px solid #2a3d2e;border-radius:12px;padding:16px}
.stat-label{font-size:11px;color:#6a8a6d;text-transform:uppercase;letter-spacing:.8px;margin-bottom:6px}
.stat-value{font-size:28px;font-weight:700;color:#e8ede9;line-height:1}
.stat-accent{color:#c9a84c}
.stat-meta{font-size:11px;color:#6a8a6d;margin-top:4px}

/* ── Buttons ───────────────────────────────────────────────── */
.btn{display:inline-flex;align-items:center;gap:6px;padding:8px 16px;border-radius:8px;font-size:13px;font-weight:500;cursor:pointer;border:none;transition:all .15s;line-height:1;text-decoration:none}
.btn-gold{background:#c9a84c;color:#1a0f00}.btn-gold:hover{background:#e8c96a}
.btn-outline{background:transparent;color:#9ab09d;border:1px solid #3a5040}.btn-outline:hover{background:#182019;color:#e8ede9}
.btn-danger{background:#c0392b;color:#fff}.btn-danger:hover{background:#e74c3c}
.btn-success{background:#27ae60;color:#fff}.btn-success:hover{background:#2ecc71}
.btn-sm{padding:5px 10px;font-size:12px}
.btn-xs{padding:3px 8px;font-size:11px}

/* ── Forms ─────────────────────────────────────────────────── */
.form-group{margin-bottom:16px}
.form-label{display:block;font-size:12px;font-weight:500;color:#9ab09d;margin-bottom:6px}
.form-input,.form-select,.form-textarea{width:100%;background:#182019;border:1px solid #3a5040;border-radius:8px;padding:9px 12px;color:#e8ede9;font-size:13px;font-family:inherit;outline:none;transition:border .15s}
.form-input:focus,.form-select:focus,.form-textarea:focus{border-color:#c9a84c}
.form-select option{background:#182019}
.form-textarea{resize:vertical;min-height:80px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.form-check{display:flex;align-items:center;gap:8px;cursor:pointer;padding:4px 0;font-size:13px;color:#9ab09d}
.form-check input{width:15px;height:15px;accent-color:#c9a84c}
.form-hint{font-size:11px;color:#6a8a6d;margin-top:4px}

/* ── Tables ────────────────────────────────────────────────── */
.table-wrap{overflow-x:auto;border-radius:12px;border:1px solid #2a3d2e}
table{width:100%;border-collapse:collapse;font-size:13px}
th{background:#182019;padding:10px 14px;text-align:left;font-size:11px;font-weight:600;color:#6a8a6d;text-transform:uppercase;letter-spacing:.8px;white-space:nowrap}
td{padding:10px 14px;border-top:1px solid #2a3d2e;color:#9ab09d;vertical-align:middle}
tr:hover td{background:#182019}

/* ── Badges ────────────────────────────────────────────────── */
.badge{display:inline-flex;align-items:center;gap:4px;padding:3px 8px;border-radius:20px;font-size:11px;font-weight:600}
.badge-gold{background:#2d2200;color:#c9a84c}
.badge-green{background:#0d2a15;color:#4caf50}
.badge-red{background:#2a0d0d;color:#ef5350}
.badge-blue{background:#0d1a2a;color:#64b5f6}
.badge-gray{background:#1f2b22;color:#6a8a6d}
.badge-warn{background:#2a1f0d;color:#d4a017}

/* ── Allergen chips ─────────────────────────────────────────── */
.allergen-chip{display:inline-flex;align-items:center;padding:2px 7px;border-radius:20px;font-size:10px;font-weight:600;border:1px solid;margin:2px}
.allergen-GLUTEN,.allergen-NUTS,.allergen-SESAME{background:#2a1a0d;color:#ff9800;border-color:#5a3a0d}
.allergen-DAIRY{background:#0d1a2a;color:#64b5f6;border-color:#0d3a5a}
.allergen-EGGS{background:#2a2a0d;color:#cddc39;border-color:#4a4a0d}
.allergen-FISH,.allergen-SHELLFISH,.allergen-MOLLUSCS{background:#0d2a2a;color:#4dd0e1;border-color:#0d4a4a}
.allergen-SOY{background:#1a0d2a;color:#ce93d8;border-color:#3a0d5a}
.allergen-CELERY{background:#0d2a15;color:#a5d6a7;border-color:#0d4a1f}
.allergen-MUSTARD{background:#2a2a0d;color:#fff176;border-color:#4a4a0d}
.allergen-LUPIN{background:#2a0d1a;color:#f48fb1;border-color:#5a0d3a}
.allergen-SULPHITES{background:#1a1a2a;color:#9fa8da;border-color:#3a3a5a}
.allergen-VEGAN{background:#0d2a0d;color:#a5d6a7;border-color:#0d4a0d}
.allergen-VEGETARIAN{background:#0d1f0d;color:#c8e6c9;border-color:#0d3a0d}
.allergen-HALAL{background:#2a0d0d;color:#ffab91;border-color:#4a0d0d}
.allergen-KOSHER{background:#0d0d2a;color:#b39ddb;border-color:#0d0d4a}

/* ── Section helpers ─────────────────────────────────────────── */
.section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
.section-title{font-size:15px;font-weight:600;color:#e8ede9}
.divider{border:none;border-top:1px solid #2a3d2e;margin:16px 0}
.avatar{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,#4a8c5c,#c9a84c);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:13px;color:#0a0f0d;flex-shrink:0}
.avatar-sm{width:28px;height:28px;font-size:11px}
.user-info{display:flex;align-items:center;gap:10px}
.user-name{font-size:13px;font-weight:600;color:#e8ede9}
.user-email{font-size:11px;color:#6a8a6d}
.user-children{font-size:10px;color:#c9a84c}
.search-bar{display:flex;align-items:center;gap:8px;background:#182019;border:1px solid #3a5040;border-radius:8px;padding:7px 12px;width:240px}
.search-bar input{background:none;border:none;outline:none;color:#e8ede9;font-size:13px;flex:1}

/* ── Meal tags ──────────────────────────────────────────────── */
.meal-tag{display:inline-flex;align-items:center;padding:2px 7px;border-radius:4px;font-size:10px;font-weight:700;margin:1px}
.meal-B{background:#1a1a0d;color:#ffd54f}
.meal-L{background:#0d1a1a;color:#80cbc4}
.meal-D{background:#1a0d1a;color:#ce93d8}

/* ── Allergen report ─────────────────────────────────────────── */
.report-table{width:100%;border-collapse:collapse;font-size:11px}
.report-table th{background:#1a2e1e;padding:6px 10px;text-align:center;font-weight:600;color:#9ab09d;border:1px solid #3a5040}
.report-table td{padding:6px 10px;border:1px solid #2a3d2e;text-align:center;color:#9ab09d}
.report-table .name-col{text-align:left;font-weight:500;color:#e8ede9;min-width:140px;white-space:nowrap}
.report-table .present{background:#0a2a12;color:#4caf50;font-weight:700}
.report-table .absent{background:#111a14;color:#2a3d2e}
.report-table .header-row th{background:#1f3520}
.allergen-header{writing-mode:vertical-rl;text-orientation:mixed;transform:rotate(180deg);padding:8px 4px!important;white-space:nowrap}
.child-row td{background:#0d150f}
.child-row .name-col{padding-left:24px;color:#6a8a6d;font-style:italic}

/* ── Presence grid ──────────────────────────────────────────── */
.presence-yes{width:22px;height:22px;border-radius:50%;background:#1a3a2a;border:2px solid #27ae60;display:inline-flex;align-items:center;justify-content:center;font-size:11px;color:#27ae60;font-weight:700}
.presence-no{width:22px;height:22px;border-radius:50%;background:#182019;display:inline-flex;align-items:center;justify-content:center;font-size:10px;color:#3a5040}
.presence-cell{text-align:center}

/* ── Invoice card ────────────────────────────────────────────── */
.invoice-card{background:#182019;border-radius:8px;padding:14px;border:1px solid #2a3d2e;margin-bottom:12px}
.invoice-row{display:flex;justify-content:space-between;padding:5px 0;font-size:13px;border-bottom:1px solid #2a3d2e;color:#9ab09d}
.invoice-row:last-child{border-bottom:none}
.invoice-label{color:#6a8a6d}

/* ── Flash / toast ──────────────────────────────────────────── */
.flash-msg{background:#1f2b22;border-left:4px solid #27ae60;border-radius:8px;padding:12px 16px;margin-bottom:12px;font-size:13px;color:#9ab09d}
.toast{position:fixed;bottom:24px;right:24px;background:#111a14;border:1px solid #3a5040;border-radius:12px;padding:12px 18px;font-size:13px;color:#e8ede9;z-index:9999;display:flex;align-items:center;gap:10px;transform:translateY(80px);opacity:0;transition:all .3s;pointer-events:none}
.toast.show{transform:translateY(0);opacity:1}
.toast-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}

/* ── Modal ──────────────────────────────────────────────────── */
.modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.7);display:flex;align-items:flex-start;justify-content:center;z-index:100;padding:40px 20px;overflow-y:auto}
.modal{background:#111a14;border:1px solid #3a5040;border-radius:16px;width:100%;max-width:600px;margin:auto}
.modal-header{padding:20px 24px;border-bottom:1px solid #2a3d2e;display:flex;align-items:center;justify-content:space-between}
.modal-title{font-size:16px;font-weight:600;color:#e8ede9}
.modal-body{padding:20px 24px}
.modal-footer{padding:16px 24px;border-top:1px solid #2a3d2e;display:flex;justify-content:flex-end;gap:8px}
.modal-close{background:none;border:none;color:#6a8a6d;cursor:pointer;font-size:24px;padding:0;line-height:1}
.modal-close:hover{color:#e8ede9}

/* ── Tabs ───────────────────────────────────────────────────── */
.tabs{display:flex;gap:0;border-bottom:1px solid #2a3d2e;margin-bottom:20px}
.tab{padding:10px 16px;font-size:13px;color:#6a8a6d;cursor:pointer;border-bottom:2px solid transparent;transition:all .15s}
.tab.active{color:#c9a84c;border-bottom-color:#c9a84c}
.tab:hover:not(.active){color:#9ab09d}

/* ── Allergen grid picker ─────────────────────────────────────── */
.allergen-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.allergen-btn{padding:8px 10px;border-radius:8px;border:1px solid #3a5040;background:#182019;color:#9ab09d;font-size:12px;cursor:pointer;text-align:left;transition:all .15s;display:flex;align-items:center;gap:6px;font-family:inherit}
.allergen-btn:hover{border-color:#c9a84c;color:#c9a84c}
.allergen-btn.selected{background:#2a1e00;border-color:#c9a84c;color:#e8c96a}
.allergen-check{width:14px;height:14px;border-radius:3px;border:1px solid #3a5040;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;font-size:10px}
.allergen-btn.selected .allergen-check{border-color:#c9a84c;background:#c9a84c;color:#1a0f00}

/* ── Payment options ─────────────────────────────────────────── */
.payment-opts{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.payment-opt{border:1px solid #3a5040;border-radius:12px;padding:14px;cursor:pointer;transition:all .15s}
.payment-opt:hover{border-color:#c9a84c}
.payment-opt.selected{border-color:#c9a84c;background:#1a1200}
.payment-opt-icon{font-size:24px;margin-bottom:8px}
.payment-opt-title{font-size:13px;font-weight:600;color:#e8ede9}
.payment-opt-sub{font-size:11px;color:#6a8a6d;margin-top:2px}

/* ── Settings ───────────────────────────────────────────────── */
.settings-section{margin-bottom:24px}
.settings-label{font-size:11px;font-weight:600;color:#6a8a6d;text-transform:uppercase;letter-spacing:.8px;margin-bottom:12px}
.meal-row{display:flex;align-items:center;gap:10px;padding:8px 12px;background:#182019;border-radius:8px;border:1px solid #2a3d2e;margin-bottom:6px}
.meal-row-name{flex:1;font-size:13px;color:#9ab09d}
.toggle{position:relative;display:inline-block;width:36px;height:20px;flex-shrink:0}
.toggle input{opacity:0;width:0;height:0}
.toggle-track{position:absolute;inset:0;background:#2a3d2e;border-radius:10px;cursor:pointer;transition:.3s}
.toggle input:checked+.toggle-track{background:#c9a84c}
.toggle-track:before{content:'';position:absolute;width:14px;height:14px;left:3px;bottom:3px;background:#fff;border-radius:50%;transition:.3s}
.toggle input:checked+.toggle-track:before{transform:translateX(16px)}

/* ── Email template preview ──────────────────────────────────── */
.email-preview{background:#fff;color:#222;border-radius:8px;padding:20px;font-size:13px;line-height:1.7;margin-top:12px}
.email-preview h2{color:#1a3a2a;margin-bottom:8px}
.email-preview-btn{background:#c9a84c;color:#1a0f00;padding:10px 22px;border-radius:6px;display:inline-block;margin-top:12px;font-weight:700}

/* ── QR display ──────────────────────────────────────────────── */
.qr-box{display:flex;flex-direction:column;align-items:center;gap:14px;padding:24px;background:#182019;border-radius:12px;border:1px solid #3a5040}
.qr-code-text{font-family:monospace;font-size:18px;letter-spacing:3px;color:#c9a84c;font-weight:700}

/* ── Guest-side pages ────────────────────────────────────────── */
.guest-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px;background:#0a0f0d}
.guest-card{background:#111a14;border:1px solid #2a3d2e;border-radius:16px;padding:36px;width:100%;max-width:560px}
.guest-header{text-align:center;margin-bottom:28px}
.guest-header .logo-badge{display:inline-block;margin-bottom:12px}
.guest-header h1{font-size:22px;color:#e8ede9;margin-bottom:6px}
.guest-header p{font-size:13px;color:#6a8a6d}
.progress-steps{display:flex;align-items:center;justify-content:center;gap:0;margin-bottom:28px}
.progress-step{width:28px;height:28px;border-radius:50%;background:#1f2b22;border:2px solid #3a5040;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;color:#6a8a6d;flex-shrink:0}
.progress-step.done{background:#2d5a3d;border-color:#4a8c5c;color:#fff}
.progress-step.current{background:#c9a84c;border-color:#e8c96a;color:#1a0f00}
.progress-line{flex:1;height:2px;background:#2a3d2e;max-width:60px}
.progress-line.done{background:#4a8c5c}
.child-section{background:#182019;border-radius:8px;padding:16px;border:1px solid #2a3d2e;margin-bottom:16px}
.child-section-name{font-size:12px;font-weight:600;color:#c9a84c;margin-bottom:12px}

/* ── Scan page ───────────────────────────────────────────────── */
.scan-result{text-align:center;padding:32px 20px}
.scan-result.valid{border-left:4px solid #27ae60}
.scan-result.invalid{border-left:4px solid #e74c3c}
.scan-icon{font-size:48px;margin-bottom:16px}
.scan-name{font-size:24px;font-weight:700;color:#e8ede9;margin-bottom:8px}
.scan-meal{font-size:16px;color:#9ab09d;margin-bottom:16px}
.scan-allergen-list{display:flex;flex-wrap:wrap;justify-content:center;gap:4px;margin:16px 0}

/* ── Responsive ──────────────────────────────────────────────── */
@media(max-width:900px){
  .sidebar{width:56px}.logo-title,.logo-sub,.logo-badge,.sidebar-footer,.nav-item span,.nav-badge{display:none}
  .nav-item{justify-content:center;padding:12px}
  .grid-4,.grid-3{grid-template-columns:1fr 1fr}.grid-2{grid-template-columns:1fr}
  .allergen-grid{grid-template-columns:1fr 1fr}
  .form-row{grid-template-columns:1fr}
  .payment-opts{grid-template-columns:1fr}
}
@media(max-width:600px){.grid-4,.grid-3,.grid-2{grid-template-columns:1fr}}

/* ── Print styles for allergen report ───────────────────────── */
@media print{
  .sidebar,.topbar,.topbar-actions,.btn,.section-header .btn{display:none!important}
  .main{overflow:visible}.content{padding:0}
  .table-wrap{border:none;border-radius:0}
  .report-table th{background:#eee!important;color:#000!important}
  .report-table td{color:#000!important}
  .report-table .present{background:#c8e6c9!important;color:#1b5e20!important}
  body{background:#fff;color:#000}
}

/* ── Empty state ─────────────────────────────────────────────── */
.empty-state{text-align:center;padding:60px 20px;color:#6a8a6d}
.empty-icon{font-size:40px;margin-bottom:12px;opacity:.4}
.empty-title{font-size:14px;font-weight:500;color:#9ab09d;margin-bottom:6px}

/* ── Progress bar ────────────────────────────────────────────── */
.progress-bar{height:4px;background:#1f2b22;border-radius:2px;overflow:hidden;margin-top:6px}
.progress-fill{height:100%;background:#c9a84c;border-radius:2px}

/* ── Approval row ────────────────────────────────────────────── */
.approval-row{display:flex;align-items:flex-start;gap:12px;padding:12px;background:#182019;border-radius:8px;margin-bottom:8px;border:1px solid #2a3d2e}