/* =====================================================
   admin.css – locobiz Admin Panel Styles
   ===================================================== */
:root {
  --saffron: #ff6b35;         /* Neon orange accent */
  --saffron-l: #ff8c5a;
  --gold: #f7c948;            /* Bright gold */
  --teal: #00d4a4;            /* Emerald green */
  --navy: #040812;            /* Ultra space dark background */
  --navy-2: #090f1d;          /* Sleek container background */
  --navy-3: #121c33;          /* Rich popout background */
  --navy3: #121c33;           /* Alias: used once in admin.html with a lowercase 3 */
  --glass: rgba(9, 15, 29, 0.7);
  --border: rgba(255, 255, 255, 0.05); /* Ultra subtle border */
  --border-2: rgba(255, 255, 255, 0.05);
  --border-h: rgba(255, 255, 255, 0.12);
  --text: #f8fafc;            /* Off-white primary text */
  --text-2: #cbd5e1;          /* Soft slate secondary text */
  --text-3: #64748b;          /* Modern slate descriptions */
  --green: #10b981;           /* Premium green */
  --amber: #f59e0b;           /* Premium amber */

  /* Previously referenced but never defined anywhere, so `background: var(--bg-card)`
     was an invalid declaration and resolved to transparent. Seventeen inputs in
     the edit-listing modal set their background this way and rendered with no
     fill at all, which is why the whole modal looked broken. Aliases onto the
     palette above rather than new colours. */
  --bg-card: var(--navy-3);
  --surface-1: var(--navy-3);
  --shadow-glass: 0 8px 32px rgba(0, 0, 0, 0.45);

  /* legal.html sets `background: var(--gradient-text)` on its <h1>. Undefined, the
     declaration was dropped, but `-webkit-text-fill-color: transparent` still
     applied - leaving an invisible heading on a page that is in the sitemap. */
  --gradient-text: linear-gradient(135deg, #ff6b35 0%, #f7c948 100%);
  --red: #f43f5e;             /* Premium rose red */
  --sidebar-w: 260px;
  --mob-header: 60px;
  --ff: 'Outfit', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --ff-alt: 'Space Grotesk', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --t: 0.2s cubic-bezier(0.16, 1, 0.3, 1);
  --r: 16px;
  --sh: 0 20px 40px rgba(0, 0, 0, 0.4);
}
[diff_block_start]
*,*::before,*::after {
  box-sizing:border-box;
  margin:0;
  padding:0;
}
html { font-size:16px; -webkit-text-size-adjust:100%; }
body { font-family:var(--ff); background:var(--navy); color:var(--text); -webkit-font-smoothing:antialiased; overflow-x:hidden; }
a { color:inherit; text-decoration:none; }
button { font-family:var(--ff); cursor:pointer; border:none; background:none; outline:none; }
input,select,textarea { font-family:var(--ff); }
:focus-visible { outline:2px solid var(--saffron); outline-offset:2px; border-radius:4px; }

/* ── Gradient accent ── */
.acc {
  background:linear-gradient(135deg,var(--saffron),var(--gold));
  -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
}

/* ══════════════ LOGIN SCREEN ══════════════ */
.admin-login {
  position:fixed; inset:0; z-index:2000;
  display:flex; align-items:center; justify-content:center; padding:16px;
  background:var(--navy);
}
.login-glow {
  position:absolute; top:50%;left:50%;transform:translate(-50%,-50%);
  width:700px;height:500px;
  background:radial-gradient(ellipse,rgba(255,107,53,.14),transparent 70%);
  pointer-events:none;
}
.login-card {
  position:relative; z-index:1;
  background:rgba(11,18,37,.9); border:1px solid var(--border);
  border-radius:20px; padding:40px 36px;
  max-width:400px; width:100%;
  box-shadow:0 24px 80px rgba(0,0,0,.6);
  backdrop-filter:blur(20px);
}
.login-logo { display:flex;align-items:center;gap:10px;margin-bottom:28px; }
.login-logo span { font-size:1.4rem;font-weight:800; }
.login-card h1 { font-size:1.7rem;font-weight:800;margin-bottom:6px; }
.login-sub { font-size:.88rem;color:var(--text-3);margin-bottom:28px; }
.login-form { display:flex;flex-direction:column;gap:16px; }
.lg-field { display:flex;flex-direction:column;gap:6px; }
.lg-field label { font-size:.82rem;font-weight:600;color:var(--text-2); }
.lg-field input {
  width: 100%;
  background:rgba(255,255,255,.04);border:1px solid var(--border-2);
  border-radius:10px;color:var(--text);padding:13px 14px;font-size:.95rem;
  transition:border-color var(--t),box-shadow var(--t);
  box-sizing: border-box;
}
.lg-field input:focus { outline:none;border-color:rgba(255,107,53,.4);box-shadow:0 0 0 3px rgba(255,107,53,.08); }
.lg-field input::placeholder { color:var(--text-3); }
.pw-wrap { position:relative; width: 100%; }
.pw-wrap input { width:100%; padding-right:48px; box-sizing: border-box; }
.pw-toggle {
  position:absolute;right:14px;top:50%;transform:translateY(-50%);
  background:none;border:none;cursor:pointer;font-size:1rem;opacity:.5;transition:opacity var(--t);
  color: var(--text-2);
}
.pw-toggle:hover { opacity:1; }
.login-err { font-size:.8rem;color:var(--red);min-height:18px;display:block; }
.btn-login {
  background:linear-gradient(135deg,var(--saffron),var(--gold));
  color:#fff;font-weight:700;font-size:1rem;padding:14px;border-radius:10px;
  box-shadow:0 4px 18px rgba(255,107,53,.35);
  transition:transform var(--t),box-shadow var(--t);margin-top:4px;
}
.btn-login:hover { transform:translateY(-2px);box-shadow:0 8px 28px rgba(255,107,53,.5); }
.back-link { display:block;text-align:center;margin-top:20px;font-size:.85rem;color:var(--text-3);transition:color var(--t); }
.back-link:hover { color:var(--saffron); }

/* ══════════════ APP SHELL ══════════════ */
.admin-app { display:flex;min-height:100vh;position:relative; }
.admin-app[aria-hidden="true"] { display:none; }

/* ── Sidebar ── */
.sidebar {
  width:var(--sidebar-w); flex-shrink:0;
  background:linear-gradient(180deg, #090f1d 0%, #040812 100%);
  border-right:1px solid var(--border-2);
  display:flex;flex-direction:column;
  position:sticky; top:0; height:100vh; overflow-y:auto;
  z-index:100;
  padding: 10px 0;
}
.sidebar-top { padding:24px 24px 12px; }
.sb-logo { display:flex;align-items:center;gap:12px; }
.sb-name { font-size:1.35rem;font-weight:800;letter-spacing:-0.5px; }
.sb-nav { display:flex;flex-direction:column;gap:4px;padding:16px 12px;flex:1; }
.sb-item {
  display:flex;align-items:center;gap:12px;
  padding:12px 16px;border-radius:12px;
  color:var(--text-2);font-size:.92rem;font-weight:600;
  transition:all var(--t);cursor:pointer;text-align:left;
  position:relative;
}
.sb-item:hover { color:var(--text);background:rgba(255,255,255,.03); }
.sb-item.active { 
  color:#fff;
  background:rgba(255,107,53,0.12);
  box-shadow:inset 4px 0 0 var(--saffron);
}
.sb-icon { flex-shrink:0;font-size:1.15rem; }
.sb-badge {
  margin-left:auto;background:var(--saffron);color:#fff;
  font-size:.7rem;font-weight:800;padding:2px 8px;border-radius:100px;
  min-width:20px;text-align:center;
  box-shadow: 0 4px 10px rgba(255,107,53,0.3);
}
.sb-badge[data-val="0"] { display:none; }
.sidebar-footer { padding:20px 24px; border-top:1px solid var(--border-2); }
.admin-user-info { display:flex;align-items:center;gap:12px;margin-bottom:16px; }
.admin-avatar {
  width:40px;height:40px;border-radius:50%;flex-shrink:0;
  background:linear-gradient(135deg,var(--saffron),var(--gold));
  display:flex;align-items:center;justify-content:center;font-weight:800;font-size:1rem;color:#fff;
  box-shadow: 0 4px 12px rgba(255,107,53,0.25);
}
.admin-name { font-size:.9rem;font-weight:700;color:var(--text); }
.admin-role { font-size:.75rem;color:var(--text-3); }
.btn-logout {
  width:100%;padding:12px;border-radius:12px;
  background:rgba(244,63,94,.08);border:1px solid rgba(244,63,94,.18);
  color:var(--red);font-weight:600;font-size:.88rem;
  display:flex;align-items:center;justify-content:center;gap:8px;
  transition:all var(--t);
}
.btn-logout:hover { 
  background:rgba(244,63,94,.15);
  box-shadow: 0 4px 12px rgba(244,63,94,0.15);
}

/* Mobile admin header */
.admin-mob-header {
  display:none;
  position:fixed;top:0;left:0;right:0;z-index:200;
  height:var(--mob-header);
  background:rgba(11,18,37,.98);border-bottom:1px solid var(--border-2);
  padding:0 16px;
  align-items:center;gap:12px;
}
.sb-toggle { display:flex;flex-direction:column;gap:5px;padding:6px; }
.ham-bar { display:block;width:20px;height:2px;background:var(--text);border-radius:2px;transition:all var(--t); }
.mob-admin-title { font-weight:800;font-size:1rem;flex:1;text-align:center; }
.btn-logout-sm {
  background:rgba(255,77,109,.08);border:1px solid rgba(255,77,109,.18);
  color:var(--red);font-weight:600;font-size:.78rem;padding:7px 12px;border-radius:8px;
  transition:all var(--t);
}
.btn-logout-sm:hover { background:rgba(255,77,109,.16); }

/* ── Main Content ── */
.admin-main { flex:1;min-width:0;padding:28px 28px;overflow-y:auto;max-height:100vh; }

/* Views */
.view { display:none;animation:fadeIn .3s ease; }
.view.active { display:block; }
@keyframes fadeIn { from{opacity:0;transform:translateY(8px)} to{opacity:1;transform:none} }

.view-header {
  display:flex;align-items:flex-start;justify-content:space-between;
  gap:16px;flex-wrap:wrap;margin-bottom:28px;
}
.view-header h2 { font-size:1.55rem;font-weight:800;letter-spacing:-.5px; }
.view-sub { color:var(--text-3);font-size:.88rem;margin-top:4px; }
.hdr-actions { display:flex;gap:10px;align-items:center;flex-wrap:wrap; }

/* Buttons */
.btn-primary {
  display:inline-flex;align-items:center;justify-content:center;gap:7px;
  background:linear-gradient(135deg,var(--saffron),var(--gold));
  color:#fff;font-weight:700;font-size:.875rem;
  padding:10px 20px;border-radius:10px;
  box-shadow:0 4px 16px rgba(255,107,53,.3);
  transition:transform var(--t),box-shadow var(--t);white-space:nowrap;
}
.btn-primary:hover { transform:translateY(-1px);box-shadow:0 6px 24px rgba(255,107,53,.45); }
.btn-sm {
  background:rgba(255,107,53,.08);border:1px solid rgba(255,107,53,.18);
  color:var(--saffron);font-size:.8rem;font-weight:700;padding:6px 14px;border-radius:8px;
  transition:all var(--t);cursor:pointer;
}
.btn-sm:hover { background:rgba(255,107,53,.16); }
.btn-ghost {
  background:transparent;border:1px solid var(--border-2);
  color:var(--text-2);font-weight:600;font-size:.875rem;padding:10px 20px;border-radius:10px;
  transition:all var(--t);
}
.btn-ghost:hover { color:var(--text);border-color:rgba(255,255,255,.2);background:rgba(255,255,255,.04); }
.btn-approve {
  background:rgba(0,212,164,.1);border:1px solid rgba(0,212,164,.2);
  color:var(--teal);font-size:.78rem;font-weight:700;padding:7px 14px;border-radius:8px;
  transition:all var(--t);cursor:pointer;white-space:nowrap;
}
.btn-approve:hover { background:rgba(0,212,164,.2);box-shadow:0 4px 12px rgba(0,212,164,.18); }
.btn-reject {
  background:rgba(255,77,109,.08);border:1px solid rgba(255,77,109,.18);
  color:var(--red);font-size:.78rem;font-weight:700;padding:7px 14px;border-radius:8px;
  transition:all var(--t);cursor:pointer;white-space:nowrap;
}
.btn-reject:hover { background:rgba(255,77,109,.16); }
.btn-view {
  background:rgba(255,255,255,.04);border:1px solid var(--border-2);
  color:var(--text-2);font-size:.78rem;font-weight:600;padding:7px 12px;border-radius:8px;
  transition:all var(--t);cursor:pointer;
}
.btn-view:hover { color:var(--text);background:rgba(255,255,255,.08); }
.btn-danger {
  background:rgba(255,77,109,.08);border:1px solid rgba(255,77,109,.2);
  color:var(--red);font-weight:700;font-size:.875rem;padding:10px 20px;border-radius:10px;
  transition:all var(--t);
}
.btn-danger:hover { background:rgba(255,77,109,.18); }
.btn-danger.red { background:rgba(255,77,109,.15); }

/* Cards */
.card {
  background:var(--navy-2);
  border: 1px solid var(--border-2);
  border-radius:var(--r);
  padding: 24px;
  box-shadow: var(--sh);
}
.card-head { display:flex;align-items:center;justify-content:space-between;margin-bottom:20px; }
.card-head h3 { font-size:1.1rem;font-weight:700;letter-spacing:-0.3px; }

/* ── KPI Grid ── */
.kpi-grid { display:grid;grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));gap:20px;margin-bottom:32px; }
.kpi-card {
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.02) 0%, rgba(255, 255, 255, 0.01) 100%), var(--navy-2);
  border: 1px solid var(--border-2);
  border-radius: var(--r);
  padding: 24px;
  position:relative;
  overflow:hidden;
  transition: all var(--t);
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
}
.kpi-card:hover { 
  transform: translateY(-4px); 
  border-color: rgba(255, 255, 255, 0.12);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
}
.kpi-card::before {
  content:'';position:absolute;top:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,var(--saffron),var(--gold));
}
.kpi-card.green::before { background:linear-gradient(90deg,var(--green),#34d399); }
.kpi-card.amber::before { background:linear-gradient(90deg,var(--amber),#fbbf24); }
.kpi-card.red::before   { background:linear-gradient(90deg,var(--red),#fb7185); }
.kpi-icon { font-size:1.8rem;margin-bottom:12px; }
.kpi-val  { font-size:2.2rem;font-weight:800;font-family:var(--ff-alt);
  background:linear-gradient(135deg,var(--saffron),var(--gold));
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text; }
.kpi-card.green .kpi-val { background:linear-gradient(135deg,var(--green),#34d399);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text; }
.kpi-card.amber .kpi-val { background:linear-gradient(135deg,var(--amber),#fbbf24);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text; }
.kpi-card.red   .kpi-val { background:linear-gradient(135deg,var(--red),#fb7185);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text; }
.kpi-lbl { font-size:.8rem;color:var(--text-3);font-weight:700;text-transform:uppercase;letter-spacing:0.8px;margin-top:6px; }
.kpi-trend { font-size:.78rem;color:var(--text-3);margin-top:8px;font-weight:500; }
.kpi-trend.up { color:var(--green); }

/* ── Dashboard Row ── */
.dash-row { display:grid;grid-template-columns:1fr 320px;gap:16px; }
.dash-recent, .dash-cats { overflow:hidden; }

/* ── Data Table ── */
#recent-table-wrap { overflow-x:auto; }
.data-table { width:100%;border-collapse:collapse;font-size:.85rem; }
.data-table th {
  padding:10px 12px;text-align:left;font-weight:700;font-size:.75rem;
  text-transform:uppercase;letter-spacing:.6px;color:var(--text-3);
  border-bottom:1px solid var(--border-2);white-space:nowrap;
}
.data-table td { padding:12px 12px;border-bottom:1px solid rgba(255,255,255,.03);vertical-align:middle; }
.data-table tr:last-child td { border-bottom:none; }
.data-table tr:hover td { background:rgba(255,107,53,.03); }
.biz-cell { display:flex;align-items:center;gap:9px; }
.biz-icon { width:32px;height:32px;border-radius:8px;flex-shrink:0;
  background:rgba(255,107,53,.1);border:1px solid rgba(255,107,53,.14);
  display:flex;align-items:center;justify-content:center;font-size:1rem; }
.biz-info strong { display:block;font-size:.85rem;font-weight:700;color:var(--text); }
.biz-info span   { font-size:.73rem;color:var(--text-3); }
.status-badge { display:inline-flex;align-items:center;gap:5px;
  padding:3px 10px;border-radius:100px;font-size:.73rem;font-weight:700; }
.status-badge.pending  { background:rgba(247,201,72,.1);color:var(--amber); }
.status-badge.approved { background:rgba(0,212,164,.1);color:var(--teal); }
.status-badge.rejected { background:rgba(255,77,109,.1);color:var(--red); }
.tbl-actions { display:flex;gap:6px;flex-wrap:nowrap; }
.date-cell { white-space:nowrap;color:var(--text-3);font-size:.8rem; }

/* ── Category Bars ── */
.cat-bars { display:flex;flex-direction:column;gap:10px; }
.cat-bar-row { display:flex;flex-direction:column;gap:4px; }
.cat-bar-label { display:flex;justify-content:space-between;font-size:.78rem;color:var(--text-2);font-weight:600; }
.cat-bar-track { height:6px;background:rgba(255,255,255,.06);border-radius:3px;overflow:hidden; }
.cat-bar-fill  { height:100%;border-radius:3px;background:linear-gradient(90deg,var(--saffron),var(--gold));transition:width 1s ease; }

/* ── Listings Grid (pending/approved/rejected) ── */
.tbl-search {
  background:rgba(255,255,255,.04);border:1px solid var(--border-2);
  border-radius:10px;color:var(--text);padding:9px 14px;font-size:.88rem;
  width:240px;transition:border-color var(--t);
}
.tbl-search:focus { outline:none;border-color:rgba(255,107,53,.38); }
.tbl-search::placeholder { color:var(--text-3); }
.listings-wrap { display:flex;flex-direction:column;gap:12px; }
.listing-row {
  background:rgba(11,18,37,.75);border:1px solid var(--border-2);
  border-radius:14px;padding:18px 20px;
  display:grid;grid-template-columns:auto 1fr auto;gap:16px;align-items:center;
  transition:border-color var(--t);
}
.listing-row:hover { border-color:var(--border); }
.lr-icon { width:44px;height:44px;border-radius:10px;flex-shrink:0;
  background:rgba(255,107,53,.08);border:1px solid rgba(255,107,53,.12);
  display:flex;align-items:center;justify-content:center;font-size:1.4rem; }
.lr-info {}
.lr-name { font-size:.95rem;font-weight:700;color:var(--text);margin-bottom:4px;display:flex;align-items:center;gap:8px;flex-wrap:wrap; }
.lr-meta { font-size:.78rem;color:var(--text-3); }
.lr-meta span { margin-right:12px; }
.lr-actions { display:flex;gap:8px;align-items:center;flex-wrap:wrap;justify-content:flex-end; }
.empty-state { text-align:center;padding:60px 20px;color:var(--text-3); }
.empty-state .es-icon { font-size:3rem;margin-bottom:14px; }
.empty-state p { font-size:.95rem; }

/* ── Categories Table ── */
.cats-table { width:100%;border-collapse:collapse; }
.cats-table th { padding:10px 14px;text-align:left;font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.6px;color:var(--text-3);border-bottom:1px solid var(--border-2); }
.cats-table td { padding:13px 14px;border-bottom:1px solid rgba(255,255,255,.03);font-size:.88rem; }
.cats-table tr:last-child td { border-bottom:none; }
.cat-row-icon { font-size:1.3rem; }
.cat-toggle { display:flex;align-items:center;gap:8px;font-size:.82rem;color:var(--text-2); }

/* ── Reports ── */
.reports-grid { display:grid;grid-template-columns:1fr 1fr;gap:16px; }
.report-card { padding:24px; }
.report-card h3 { font-size:.95rem;font-weight:700;margin-bottom:18px; }
.chart-placeholder { display:flex;flex-direction:column;gap:8px; }
.chart-bars { display:flex;align-items:flex-end;gap:8px;height:120px; }
.chart-bar {
  flex:1;border-radius:6px 6px 0 0;
  background:linear-gradient(180deg,var(--saffron),rgba(255,107,53,.2));
  transition:height 1s ease;min-height:4px;
}
.chart-labels { display:flex;gap:8px; }
.chart-lbl { flex:1;text-align:center;font-size:.7rem;color:var(--text-3); }
.city-report { display:flex;flex-direction:column;gap:10px; }
.city-report-row { display:flex;align-items:center;gap:10px; }
.cr-city { font-size:.85rem;font-weight:600;width:90px;flex-shrink:0;color:var(--text-2); }
.cr-bar-wrap { flex:1;height:8px;background:rgba(255,255,255,.06);border-radius:4px;overflow:hidden; }
.cr-bar-fill { height:100%;border-radius:4px;background:linear-gradient(90deg,var(--teal),#00b8d9);transition:width 1s ease; }
.cr-count { font-size:.78rem;color:var(--text-3);width:55px;text-align:right;flex-shrink:0; }
.cat-report { display:flex;flex-direction:column;gap:8px; }
.cat-report-row { display:flex;align-items:center;justify-content:space-between;font-size:.85rem; }
.cat-report-name { color:var(--text-2); }
.cat-report-cnt { font-weight:700;color:var(--text); }
.approval-donut {
  width:120px;height:120px;border-radius:50%;margin:0 auto 14px;
  display:flex;align-items:center;justify-content:center;font-size:1.4rem;font-weight:800;
  background:conic-gradient(var(--teal) 0%, rgba(255,255,255,.06) 0%);
  box-shadow:inset 0 0 0 18px var(--navy-2);transition:background 1s ease;
}
.donut-label { font-family:var(--ff-alt);background:linear-gradient(135deg,var(--teal),#00b8d9);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text; }
.report-note { text-align:center;font-size:.85rem;color:var(--text-3); }

/* ── Settings ── */
.settings-grid { display:grid;grid-template-columns:1fr 1fr;gap:16px; }
.settings-card { padding:24px; }
.settings-card h3 { font-size:1rem;font-weight:700;margin-bottom:18px; }
.settings-form { display:flex;flex-direction:column;gap:14px; }
.form-group { display:flex;flex-direction:column;gap:6px; }
.form-group label { font-size:.82rem;font-weight:600;color:var(--text-2); }
.req { color:var(--saffron); }
.form-group input {
  background:rgba(255,255,255,.04);border:1px solid var(--border-2);
  border-radius:10px;color:var(--text);padding:11px 13px;
  transition:border-color var(--t),box-shadow var(--t);
}
.form-group input:focus { outline:none;border-color:rgba(255,107,53,.4);box-shadow:0 0 0 3px rgba(255,107,53,.08); }
.field-error { font-size:.75rem;color:var(--red); }
.toggle-list { display:flex;flex-direction:column;gap:16px; }
.toggle-item { display:flex;align-items:center;justify-content:space-between;gap:16px; }
.toggle-item > div { flex:1;min-width:0; }
.toggle-item strong { font-size:.9rem;font-weight:700;display:block;margin-bottom:3px; }
.toggle-item p { font-size:.78rem;color:var(--text-3); }
.toggle-switch { flex-shrink:0;cursor:pointer; }
.toggle-switch input { display:none; }
.toggle-knob {
  display:block;width:42px;height:24px;border-radius:100px;
  background:rgba(255,255,255,.08);border:1px solid var(--border-2);
  position:relative;transition:background var(--t);
}
.toggle-knob::after {
  content:'';position:absolute;top:3px;left:3px;
  width:16px;height:16px;border-radius:50%;
  background:#fff;transition:transform var(--t);
  box-shadow:0 2px 4px rgba(0,0,0,.3);
}
.toggle-switch input:checked ~ .toggle-knob { background:var(--teal);border-color:var(--teal); }
.toggle-switch input:checked ~ .toggle-knob::after { transform:translateX(18px); }
.settings-note { font-size:.85rem;color:var(--text-3);margin-bottom:16px;line-height:1.6; }
.danger-btns { display:flex;gap:12px;flex-wrap:wrap; }

/* ── Detail Modal ── */
.modal-overlay {
  position:fixed;inset:0;z-index:1500;
  background:rgba(0,0,0,.72);backdrop-filter:blur(10px);
  display:flex;align-items:center;justify-content:center;padding:16px;
  opacity:0;pointer-events:none;transition:opacity var(--t);overflow-y:auto;
}
.modal-overlay[aria-hidden="false"] { opacity:1;pointer-events:all; }
.detail-modal {
  background:var(--navy-2);border:1px solid var(--border);
  border-radius:18px;padding:32px 28px;max-width:540px;width:100%;
  position:relative;box-shadow:0 24px 80px rgba(0,0,0,.6);
  transform:translateY(14px) scale(.98);transition:transform var(--t);
  max-height:calc(100dvh - 40px);overflow-y:auto;
}
.modal-overlay[aria-hidden="false"] .detail-modal { transform:none; }
.modal-close {
  position:absolute;top:14px;right:14px;width:30px;height:30px;
  border-radius:8px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);
  display:flex;align-items:center;justify-content:center;color:var(--text-2);transition:all var(--t);
}
.modal-close:hover { background:rgba(255,107,53,.1);color:var(--saffron); }
.detail-actions { display:flex;gap:10px;margin-top:22px;flex-wrap:wrap; }
#detail-content .dl-grid { display:grid;grid-template-columns:1fr 1fr;gap:10px 20px;margin:20px 0; }
#detail-content .dl-item {}
#detail-content .dl-label { font-size:.73rem;color:var(--text-3);font-weight:600;text-transform:uppercase;letter-spacing:.5px;margin-bottom:3px; }
#detail-content .dl-val   { font-size:.88rem;color:var(--text);font-weight:600; }
#detail-content h3 { font-size:1.2rem;font-weight:800;margin-bottom:4px; }
#detail-content .detail-cat { font-size:.8rem;color:var(--text-3);margin-bottom:14px; }
#detail-content .detail-desc { font-size:.9rem;color:var(--text-2);line-height:1.65;margin-bottom:16px; }

/* Confirm */
.confirm-modal {
  background:var(--navy-2);border:1px solid var(--border);
  border-radius:16px;padding:32px;max-width:380px;width:100%;text-align:center;
  box-shadow:0 24px 80px rgba(0,0,0,.6);
  transform:scale(.95);transition:transform var(--t);
}
.modal-overlay[aria-hidden="false"] .confirm-modal { transform:none; }
.confirm-icon { font-size:2.8rem;margin-bottom:12px; }
.confirm-modal h3 { font-size:1.2rem;font-weight:800;margin-bottom:8px; }
.confirm-modal p { color:var(--text-2);font-size:.9rem;margin-bottom:24px;line-height:1.6; }
.confirm-btns { display:flex;gap:12px;justify-content:center; }

/* ══════════════ RESPONSIVE ADMIN ══════════════ */
@media (max-width:1100px) {
  .kpi-grid { grid-template-columns:repeat(2,1fr); }
  .dash-row  { grid-template-columns:1fr; }
  .reports-grid { grid-template-columns:1fr; }
  .settings-grid { grid-template-columns:1fr; }
}
@media (max-width:800px) {
  .sidebar { display:none; }
  .admin-mob-header { display:flex; }
  .admin-main { padding:calc(var(--mob-header) + 16px) 14px 16px; max-height:none;overflow-y:unset; }
  .kpi-grid { grid-template-columns:repeat(2,1fr);gap:10px; }
  .view-header { flex-direction:column; }
  .tbl-search { width:100%; }
  .listing-row { grid-template-columns:auto 1fr;gap:12px; }
  .lr-actions { grid-column:1/-1;justify-content:flex-start; }
  .sidebar.open {
    display:flex;position:fixed;top:var(--mob-header);bottom:0;left:0;z-index:300;
    width:260px;height:auto;box-shadow:4px 0 40px rgba(0,0,0,.5);
  }
}
@media (max-width:480px) {
  .kpi-grid { grid-template-columns:1fr 1fr; }
  .admin-main { padding:calc(var(--mob-header) + 14px) 12px 14px; }
  .detail-modal,.confirm-modal { padding:24px 18px; }
  #detail-content .dl-grid { grid-template-columns:1fr; }
}

/* ══════════════ LEADS ══════════════ */
.status-badge.amber    { background:rgba(247,201,72,.1);  color:var(--amber); }
.status-badge.green    { background:rgba(0,212,164,.1);   color:var(--teal);  }

/* Lead status dropdown in table */
.lead-status-sel {
  background:rgba(255,255,255,.05);
  border:1px solid var(--border-2);
  border-radius:8px;
  color:var(--text-2);
  font-family:var(--ff);
  font-size:.78rem;
  font-weight:600;
  padding:6px 10px;
  cursor:pointer;
  transition:border-color var(--t);
  -webkit-appearance:none; appearance:none;
}
.lead-status-sel:focus { outline:none; border-color:rgba(255,107,53,.38); }
.lead-status-sel option { background:var(--navy-2); color:var(--text); }

/* Filter select in hdr-actions */
.tbl-select {
  background:rgba(255,255,255,.04);
  border:1px solid var(--border-2);
  border-radius:10px;
  color:var(--text);
  font-family:var(--ff);
  font-size:.85rem;
  padding:9px 13px;
  cursor:pointer;
  transition:border-color var(--t);
  -webkit-appearance:none; appearance:none;
}
.tbl-select:focus { outline:none; border-color:rgba(255,107,53,.38); }

select option {
  background: var(--navy-2) !important;
  color: var(--text) !important;
}

/* WhatsApp Outreach button */
.btn-whatsapp {
  background: rgba(37, 211, 102, 0.1) !important;
  border: 1px solid rgba(37, 211, 102, 0.25) !important;
  color: #25d366 !important;
  font-size: .78rem;
  font-weight: 700;
  padding: 7px 14px;
  border-radius: 8px;
  transition: all var(--t);
  cursor: pointer;
  white-space: nowrap;
}
.btn-whatsapp:hover {
  background: rgba(37, 211, 102, 0.2) !important;
  box-shadow: 0 4px 12px rgba(37, 211, 102, 0.2);
}

/* ══════════════ MOBILE ADMIN BOTTOM NAV ══════════════ */
@media (max-width: 800px) {
  .admin-mob-bottom-nav {
    display: flex;
    justify-content: space-around;
    align-items: center;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(13, 21, 38, 0.98);
    border-top: 1px solid var(--border-2);
    height: 64px;
    padding-bottom: calc(env(safe-area-inset-bottom) / 2);
    z-index: 10000;
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
  }
  .admin-mob-bottom-nav .sb-item {
    background: none;
    border: none;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex: 1;
    height: 100%;
    color: var(--text-3);
    padding: 6px 0;
    transition: all var(--t);
    font-family: inherit;
    cursor: pointer;
  }
  .admin-mob-bottom-nav .sb-item .nav-icon {
    font-size: 1.25rem;
    line-height: 1;
  }
  .admin-mob-bottom-nav .sb-item .nav-label {
    font-size: 0.68rem;
    font-weight: 700;
    margin-top: 4px;
    letter-spacing: 0.2px;
  }
  .admin-mob-bottom-nav .sb-item.active {
    color: var(--saffron) !important;
  }
  
  /* Prevent content clipping behind bottom navigation bar */
  .admin-main {
    padding-bottom: 90px !important;
  }
}
@media (min-width: 801px) {
  .admin-mob-bottom-nav {
    display: none !important;
  }
}

.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 16px; }
@media(max-width: 768px) {
  .form-row { grid-template-columns: 1fr; }
}