/* ============================================================
   SkyWay — User Auth & Dashboard  (user.css)
   ============================================================ */

/* ── Variables ─────────────────────────────────────────────── */
:root {
  --u-primary:    #0f1f5c;
  --u-accent:     #2563eb;
  --u-accent-lt:  #dbeafe;
  --u-accent-dk:  #1d4ed8;
  --u-success:    #16a34a;
  --u-success-lt: #dcfce7;
  --u-warning:    #d97706;
  --u-warning-lt: #fef9c3;
  --u-danger:     #dc2626;
  --u-danger-lt:  #fee2e2;
  --u-text:       #0f172a;
  --u-text-2:     #334155;
  --u-muted:      #64748b;
  --u-border:     #e2e8f0;
  --u-bg:         #f8fafc;
  --u-surface:    #ffffff;
  --u-radius:     12px;
  --u-radius-sm:  8px;
  --u-shadow-sm:  0 1px 3px rgba(0,0,0,.06),0 1px 2px rgba(0,0,0,.04);
  --u-shadow:     0 4px 6px rgba(0,0,0,.06),0 2px 4px rgba(0,0,0,.04);
  --u-shadow-md:  0 10px 15px rgba(0,0,0,.07),0 4px 6px rgba(0,0,0,.05);
  --u-shadow-lg:  0 20px 25px rgba(0,0,0,.08),0 8px 10px rgba(0,0,0,.04);
  --u-sidebar-w:  256px;
  --u-topbar-h:   64px;
  --u-sp:         1.5rem;
}

/* ── Reset ─────────────────────────────────────────────────── */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
body {
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  font-size:14px; color:var(--u-text); line-height:1.6;
  -webkit-font-smoothing:antialiased; background:var(--u-bg);
}
a { color:var(--u-accent); text-decoration:none; }
a:hover { text-decoration:underline; }
button { font-family:inherit; cursor:pointer; }
img { max-width:100%; display:block; }

/* ══════════════════════════════════════════════
   FORMS
══════════════════════════════════════════════ */
.form-group { margin-bottom:1rem; }
.form-label {
  display:block; font-size:.8125rem; font-weight:600;
  color:var(--u-text-2); margin-bottom:.375rem; letter-spacing:.01em;
}
.form-input,.form-select,.form-textarea {
  width:100%; padding:.625rem .875rem; border:1.5px solid var(--u-border);
  border-radius:var(--u-radius-sm); font-size:.875rem; font-family:inherit;
  color:var(--u-text); background:var(--u-surface);
  transition:border-color .15s,box-shadow .15s; outline:none; appearance:none;
}
.form-textarea { resize:vertical; min-height:90px; }
.form-input:focus,.form-select:focus,.form-textarea:focus {
  border-color:var(--u-accent); box-shadow:0 0 0 3px rgba(37,99,235,.12);
}
.form-input::placeholder { color:#94a3b8; }
.form-hint  { font-size:.75rem; color:var(--u-muted); margin-top:.3rem; }
.form-error { font-size:.75rem; color:var(--u-danger); margin-top:.3rem; }
.form-grid-2 { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.form-actions {
  display:flex; align-items:center; gap:.75rem;
  margin-top:1.5rem; padding-top:1.25rem; border-top:1px solid var(--u-border);
}
.req { color:var(--u-danger); }
.two-cols { display:grid; grid-template-columns:1fr 1fr; gap:.75rem; }

/* Input with icon/button */
.input-group { position:relative; }
.input-group-icon {
  position:absolute; left:.75rem; top:50%; transform:translateY(-50%);
  color:#94a3b8; pointer-events:none; display:flex; align-items:center;
}
.input-group .form-input { padding-left:2.375rem; }
.input-group-btn {
  position:absolute; right:.5rem; top:50%; transform:translateY(-50%);
  background:none; border:none; cursor:pointer; color:#94a3b8;
  padding:.25rem; border-radius:4px; display:flex; align-items:center;
  transition:color .15s;
}
.input-group-btn:hover { color:var(--u-muted); }

/* ══════════════════════════════════════════════
   BUTTONS
══════════════════════════════════════════════ */
.btn {
  display:inline-flex; align-items:center; justify-content:center; gap:.4rem;
  padding:.5rem 1rem; border-radius:var(--u-radius-sm);
  font-size:.875rem; font-weight:600; font-family:inherit;
  border:1.5px solid transparent; white-space:nowrap;
  text-decoration:none; transition:all .15s; line-height:1.4; cursor:pointer;
}
.btn:hover { text-decoration:none; }
.btn--primary { background:var(--u-accent); color:#fff; border-color:var(--u-accent); }
.btn--primary:hover { background:var(--u-accent-dk); border-color:var(--u-accent-dk); color:#fff; }
.btn--outline { background:transparent; color:var(--u-accent); border-color:var(--u-accent); }
.btn--outline:hover { background:rgba(37,99,235,.06); color:var(--u-accent); }
.btn--ghost  { background:transparent; color:var(--u-muted); border-color:transparent; }
.btn--ghost:hover { background:var(--u-bg); color:var(--u-text); }
.btn--danger { background:var(--u-danger); color:#fff; border-color:var(--u-danger); }
.btn--danger:hover { background:#b91c1c; border-color:#b91c1c; color:#fff; }
.btn--block  { width:100%; }
.btn--lg { padding:.75rem 1.5rem; font-size:.9375rem; border-radius:var(--u-radius); }
.btn--sm { padding:.325rem .625rem; font-size:.8125rem; }
.btn--xs { padding:.2rem .5rem; font-size:.75rem; border-radius:5px; }
.btn:disabled { opacity:.5; cursor:not-allowed; }

/* ══════════════════════════════════════════════
   ALERTS
══════════════════════════════════════════════ */
.alert {
  padding:.75rem 1rem; border-radius:var(--u-radius-sm);
  font-size:.875rem; display:flex; align-items:flex-start;
  gap:.5rem; border:1px solid transparent;
}
.alert--success { background:#f0fdf4; color:#166534; border-color:#bbf7d0; }
.alert--error   { background:#fef2f2; color:#991b1b; border-color:#fecaca; }
.alert--info    { background:#eff6ff; color:#1d4ed8; border-color:#bfdbfe; }
.alert--warning { background:#fffbeb; color:#92400e; border-color:#fde68a; }

/* ══════════════════════════════════════════════
   BADGES
══════════════════════════════════════════════ */
.badge {
  display:inline-flex; align-items:center; padding:.2rem .55rem;
  border-radius:100px; font-size:.6875rem; font-weight:700;
  text-transform:capitalize; white-space:nowrap; letter-spacing:.02em;
}
.badge--confirmed,.badge--success { background:#dcfce7; color:#15803d; }
.badge--pending,  .badge--warning { background:#fef9c3; color:#a16207; }
.badge--completed,.badge--info    { background:#dbeafe; color:#1d4ed8; }
.badge--cancelled,.badge--danger  { background:#fee2e2; color:#b91c1c; }
.badge--paid     { background:#dcfce7; color:#15803d; }
.badge--unpaid   { background:#fee2e2; color:#b91c1c; }
.badge--refunded { background:#ffedd5; color:#c2410c; }
.badge--muted    { background:#f1f5f9; color:#475569; }

/* ══════════════════════════════════════════════
   AUTH PAGES
══════════════════════════════════════════════ */
.auth-body {
  min-height:100vh; display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg,#0b173d 0%,#1a2e6e 50%,#0d1b4e 100%);
  padding:2rem 1rem; position:relative; overflow:hidden;
}
.auth-body::before {
  content:''; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(ellipse at 15% 80%,rgba(37,99,235,.25) 0%,transparent 55%),
             radial-gradient(ellipse at 85% 20%,rgba(37,99,235,.18) 0%,transparent 55%);
}
.auth-deco {
  position:absolute; opacity:.05; pointer-events:none;
  font-size:7rem; user-select:none;
}
.auth-deco--tl { top:8%;  left:4%;  transform:rotate(-25deg); }
.auth-deco--br { bottom:6%; right:3%; transform:rotate(20deg); font-size:9rem; }

.auth-card {
  width:100%; max-width:440px; background:var(--u-surface);
  border-radius:20px; box-shadow:0 32px 64px rgba(0,0,0,.35);
  overflow:hidden; position:relative; z-index:1;
}
.auth-card--wide { max-width:480px; }
.auth-card-top {
  background:linear-gradient(135deg,#0f1f5c 0%,#1e3a8a 100%);
  padding:2rem 2rem 1.75rem; text-align:center;
}
.auth-logo {
  display:inline-flex; align-items:center; gap:.5rem; color:#fff;
  font-weight:800; font-size:1.2rem; text-decoration:none; margin-bottom:1rem;
}
.auth-logo:hover { color:#fff; text-decoration:none; }
.auth-logo-img {
  height:38px; width:auto; max-width:140px;
  object-fit:contain; filter:brightness(0) invert(1);
}
.auth-title    { color:#fff; font-size:1.375rem; font-weight:800; margin-bottom:.25rem; }
.auth-subtitle { color:rgba(255,255,255,.65); font-size:.875rem; }
.auth-card-body   { padding:1.75rem 2rem; }
.auth-card-footer {
  padding:1rem 2rem 1.5rem; text-align:center;
  font-size:.875rem; color:var(--u-muted); border-top:1px solid var(--u-border);
}
.auth-card-footer a { font-weight:600; color:var(--u-accent); }
.auth-divider { display:flex; align-items:center; gap:.75rem; margin:1rem 0; }
.auth-divider::before,.auth-divider::after { content:''; flex:1; height:1px; background:var(--u-border); }
.auth-divider span { font-size:.75rem; color:var(--u-muted); white-space:nowrap; }
.remember-row { display:flex; align-items:center; justify-content:space-between; margin-bottom:1rem; }
.check-label { display:flex; align-items:center; gap:.45rem; font-size:.875rem; cursor:pointer; color:var(--u-text); }
.check-label input { width:15px; height:15px; accent-color:var(--u-accent); cursor:pointer; }

/* ══════════════════════════════════════════════
   DASHBOARD — GLOBAL
══════════════════════════════════════════════ */
.dash-body { background:var(--u-bg); overflow-x:hidden; }

/* Mobile overlay backdrop */
.dash-overlay {
  display:none; position:fixed; inset:0;
  background:rgba(15,31,92,.5); z-index:190;
  backdrop-filter:blur(3px); -webkit-backdrop-filter:blur(3px);
}
.dash-overlay.show { display:block; }

/* ── Sidebar ────────────────────────────────── */
.dash-sidebar {
  width:var(--u-sidebar-w); background:var(--u-primary); color:#fff;
  position:fixed; top:0; left:0; bottom:0; z-index:200;
  display:flex; flex-direction:column;
  overflow-y:auto; overflow-x:hidden;
  transition:transform .28s cubic-bezier(.4,0,.2,1);
  scrollbar-width:thin; scrollbar-color:rgba(255,255,255,.1) transparent;
}
.dash-sidebar::-webkit-scrollbar { width:3px; }
.dash-sidebar::-webkit-scrollbar-thumb { background:rgba(255,255,255,.15); border-radius:2px; }

.dash-sidebar-brand {
  display:flex; align-items:center; gap:.6rem; color:#fff;
  font-weight:800; font-size:1.05rem; padding:1.25rem 1.25rem 1.1rem;
  border-bottom:1px solid rgba(255,255,255,.07);
  text-decoration:none; flex-shrink:0; letter-spacing:-.01em;
}
.dash-sidebar-brand:hover { color:#fff; text-decoration:none; }
.dash-sidebar-brand img {
  height:28px; width:auto; max-width:110px;
  object-fit:contain; filter:brightness(0) invert(1);
}

.dash-nav { padding:.5rem 0; flex:1; }
.dash-nav-label {
  font-size:.625rem; font-weight:700; letter-spacing:.12em;
  text-transform:uppercase; color:rgba(255,255,255,.28);
  padding:.875rem 1.25rem .3rem; display:block;
}
.dash-nav-link {
  display:flex; align-items:center; gap:.6rem;
  padding:.575rem 1rem; margin:.1rem .625rem;
  border-radius:var(--u-radius-sm);
  color:rgba(255,255,255,.62); font-size:.875rem; font-weight:500;
  text-decoration:none; transition:background .15s,color .15s;
  position:relative;
}
.dash-nav-link:hover { color:#fff; background:rgba(255,255,255,.09); text-decoration:none; }
.dash-nav-link.active { color:#fff; background:rgba(37,99,235,.32); }
.dash-nav-link.active::before {
  content:''; position:absolute; left:-.625rem; top:6px; bottom:6px;
  width:3px; background:var(--u-accent); border-radius:0 3px 3px 0;
}
.dash-nav-link svg { flex-shrink:0; opacity:.7; transition:opacity .15s; }
.dash-nav-link:hover svg,.dash-nav-link.active svg { opacity:1; }

.dash-sidebar-foot {
  padding:.875rem 1.25rem; border-top:1px solid rgba(255,255,255,.07); flex-shrink:0;
}
.dash-user-chip { display:flex; align-items:center; gap:.6rem; }
.dash-user-av {
  width:34px; height:34px; border-radius:50%;
  background:linear-gradient(135deg,var(--u-accent),#818cf8);
  display:flex; align-items:center; justify-content:center;
  font-weight:700; font-size:.8125rem; color:#fff; flex-shrink:0;
}
.dash-user-name {
  font-size:.8125rem; font-weight:700; color:#fff; line-height:1.25;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:155px;
}
.dash-user-email {
  font-size:.6875rem; color:rgba(255,255,255,.38);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:155px;
}

/* ── Topbar ──────────────────────────────────── */
.dash-topbar {
  position:sticky; top:0; z-index:100;
  height:var(--u-topbar-h); min-height:var(--u-topbar-h);
  background:var(--u-surface); border-bottom:1px solid var(--u-border);
  display:flex; align-items:center; padding:0 var(--u-sp); gap:.75rem;
  box-shadow:0 1px 3px rgba(0,0,0,.04);
}
.dash-hamburger {
  display:flex; align-items:center; justify-content:center;
  width:36px; height:36px; flex-shrink:0;
  background:none; border:none; cursor:pointer;
  color:var(--u-muted); border-radius:var(--u-radius-sm);
  transition:background .15s,color .15s;
}
.dash-hamburger:hover { background:var(--u-bg); color:var(--u-text); }
.dash-topbar-title {
  flex:1; font-size:.9375rem; font-weight:700; color:var(--u-text);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.dash-topbar-end {
  display:flex; align-items:center; gap:.625rem;
  margin-left:auto; position:relative; flex-shrink:0;
}

/* User dropdown in topbar */
.dash-dropdown { position:relative; }
.dash-user-btn {
  display:flex; align-items:center; gap:.375rem;
  background:none; border:none; cursor:pointer;
  padding:.3rem .4rem; border-radius:var(--u-radius-sm);
  transition:background .15s;
}
.dash-user-btn:hover { background:var(--u-bg); }
.dash-user-btn .dash-user-av { width:32px; height:32px; font-size:.8rem; }

.dash-dropdown-menu {
  position:absolute; right:0; top:calc(100% + 6px); min-width:196px;
  background:var(--u-surface); border:1px solid var(--u-border);
  border-radius:var(--u-radius); box-shadow:var(--u-shadow-lg);
  padding:.35rem 0; z-index:400; list-style:none;
  opacity:0; visibility:hidden;
  transform:translateY(-6px) scale(.97);
  transform-origin:top right;
  transition:opacity .15s,transform .15s,visibility .15s;
}
.dash-dropdown.open .dash-dropdown-menu {
  opacity:1; visibility:visible; transform:translateY(0) scale(1);
}
.dash-dropdown-sep { height:1px; background:var(--u-border); margin:.3rem 0; }
.dash-dropdown-menu li a {
  display:flex; align-items:center; gap:.5rem;
  padding:.55rem 1rem; font-size:.875rem; color:var(--u-text);
  text-decoration:none; transition:background .1s;
}
.dash-dropdown-menu li a:hover { background:var(--u-bg); text-decoration:none; }
.dash-dropdown-menu li a.text-danger { color:var(--u-danger); }
.dash-dropdown-menu li a.text-danger:hover { background:#fef2f2; }

/* ── Layout shell ────────────────────────────── */
.dash-layout {
  margin-left:var(--u-sidebar-w); min-height:100vh;
  display:flex; flex-direction:column;
}
.dash-main { flex:1; display:flex; flex-direction:column; min-width:0; }
.dash-content { padding:var(--u-sp); flex:1; }

/* Page heading row */
.dash-page-head {
  display:flex; align-items:flex-start; justify-content:space-between;
  flex-wrap:wrap; gap:.75rem; padding:1.375rem var(--u-sp) .875rem;
}
.dash-page-title { font-size:1.125rem; font-weight:800; color:var(--u-text); }
.dash-page-sub   { font-size:.8125rem; color:var(--u-muted); margin-top:.15rem; }

/* ══════════════════════════════════════════════
   DASHBOARD HOME
══════════════════════════════════════════════ */
/* Welcome banner */
.dash-welcome {
  background:linear-gradient(135deg,#0f1f5c 0%,#1e3a8a 55%,#1d4ed8 100%);
  border-radius:var(--u-radius); padding:1.75rem 2rem;
  color:#fff; margin-bottom:1.5rem;
  position:relative; overflow:hidden;
}
.dash-welcome::before {
  content:''; position:absolute; right:-3rem; top:-3rem;
  width:220px; height:220px; border-radius:50%;
  background:rgba(255,255,255,.04); pointer-events:none;
}
.dash-welcome::after {
  content:'✈'; position:absolute; right:1.75rem; top:50%;
  transform:translateY(-50%); font-size:5.5rem;
  opacity:.08; pointer-events:none; line-height:1;
}
.dash-welcome h2 { font-size:1.25rem; font-weight:800; margin-bottom:.3rem; }
.dash-welcome p  { color:rgba(255,255,255,.7); font-size:.875rem; line-height:1.6; }
.dash-welcome-actions { margin-top:1.125rem; display:flex; gap:.625rem; flex-wrap:wrap; }
.dash-wbtn {
  display:inline-flex; align-items:center; gap:.4rem;
  padding:.4rem .85rem;
  background:rgba(255,255,255,.12); color:#fff;
  border-radius:var(--u-radius-sm); font-size:.8125rem; font-weight:600;
  text-decoration:none; border:1px solid rgba(255,255,255,.18);
  transition:background .15s; white-space:nowrap;
}
.dash-wbtn:hover { background:rgba(255,255,255,.22); text-decoration:none; color:#fff; }

/* Stats */
.dash-stats {
  display:grid; grid-template-columns:repeat(4,1fr);
  gap:1rem; margin-bottom:1.5rem;
}
.dash-stat {
  background:var(--u-surface); border-radius:var(--u-radius);
  border:1px solid var(--u-border); padding:1.25rem;
  display:flex; align-items:center; gap:.875rem;
  transition:box-shadow .2s,transform .2s;
}
.dash-stat:hover { box-shadow:var(--u-shadow-md); transform:translateY(-1px); }
.dash-stat-icon {
  width:48px; height:48px; border-radius:12px; flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
}
.dash-stat-icon--blue   { background:var(--u-accent-lt);  color:var(--u-accent); }
.dash-stat-icon--green  { background:var(--u-success-lt); color:var(--u-success); }
.dash-stat-icon--orange { background:var(--u-warning-lt); color:var(--u-warning); }
.dash-stat-icon--red    { background:var(--u-danger-lt);  color:var(--u-danger); }
.dash-stat-num { font-size:1.75rem; font-weight:800; line-height:1; color:var(--u-text); }
.dash-stat-lbl { font-size:.75rem; color:var(--u-muted); margin-top:.2rem; font-weight:500; }

/* Quick actions */
.dash-qa-grid {
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:1rem; margin-bottom:1.5rem;
}
.dash-qa {
  background:var(--u-surface); border:1.5px solid var(--u-border);
  border-radius:var(--u-radius); padding:1.375rem 1.25rem;
  text-decoration:none; color:var(--u-text);
  display:flex; flex-direction:column; align-items:center;
  gap:.5rem; text-align:center;
  transition:border-color .15s,box-shadow .2s,transform .2s;
}
.dash-qa:hover {
  border-color:var(--u-accent); color:var(--u-text);
  box-shadow:0 4px 20px rgba(37,99,235,.12);
  transform:translateY(-2px); text-decoration:none;
}
.dash-qa-icon {
  width:48px; height:48px; border-radius:12px;
  background:var(--u-accent-lt); color:var(--u-accent);
  display:flex; align-items:center; justify-content:center;
  transition:background .15s,color .15s;
}
.dash-qa:hover .dash-qa-icon { background:var(--u-accent); color:#fff; }
.dash-qa-label { font-size:.875rem; font-weight:700; }
.dash-qa-desc  { font-size:.75rem; color:var(--u-muted); line-height:1.45; }

/* Card */
.dash-card {
  background:var(--u-surface); border-radius:var(--u-radius);
  border:1px solid var(--u-border); margin-bottom:1.5rem; overflow:hidden;
}
.dash-card-head {
  display:flex; align-items:center; justify-content:space-between;
  padding:.875rem 1.25rem; border-bottom:1px solid var(--u-border);
}
.dash-card-title {
  font-size:.9rem; font-weight:700; color:var(--u-text);
  display:flex; align-items:center; gap:.45rem;
}
.dash-card-sub  { font-size:.8rem; color:var(--u-muted); margin-top:.15rem; }
.dash-card-body { padding:1.25rem; }

/* Booking rows (dashboard home list) */
.bk-row {
  display:flex; align-items:center; gap:1rem;
  padding:.875rem 1.25rem; border-bottom:1px solid var(--u-border);
  transition:background .12s;
}
.bk-row:last-child { border-bottom:none; }
.bk-row:hover { background:#f8fafc; }
.bk-row-route  { flex:1; min-width:0; }
.bk-row-ref    {
  font-size:.6875rem; color:var(--u-muted); font-weight:500;
  margin-bottom:.15rem; font-family:ui-monospace,monospace;
}
.bk-row-cities {
  font-weight:700; font-size:.9375rem;
  display:flex; align-items:center; gap:.35rem;
}
.bk-row-arrow  { color:var(--u-accent); }
.bk-row-meta   { font-size:.75rem; color:var(--u-muted); margin-top:.15rem; }
.bk-row-right  { display:flex; align-items:center; gap:.75rem; flex-shrink:0; }
.bk-row-price  { font-weight:700; font-size:.9rem; text-align:right; white-space:nowrap; }
.bk-row-plbl   { font-size:.6875rem; color:var(--u-muted); }

/* Empty state */
.empty-box { text-align:center; padding:3.5rem 1.5rem; }
.empty-box-icon {
  width:64px; height:64px; border-radius:50%; background:var(--u-bg);
  display:flex; align-items:center; justify-content:center;
  margin:0 auto 1rem; color:#94a3b8;
}
.empty-box-title { font-size:1rem; font-weight:700; margin-bottom:.35rem; }
.empty-box-desc  { font-size:.875rem; color:var(--u-muted); margin-bottom:1.25rem; }

/* ══════════════════════════════════════════════
   BOOKINGS PAGE
══════════════════════════════════════════════ */
.filter-bar {
  display:flex; align-items:center; gap:.5rem;
  flex-wrap:wrap; padding:.875rem var(--u-sp);
}
.filter-chip {
  display:inline-flex; align-items:center; gap:.3rem;
  padding:.3rem .875rem; border-radius:100px; font-size:.8125rem; font-weight:600;
  cursor:pointer; text-decoration:none;
  border:1.5px solid var(--u-border); color:var(--u-muted); background:var(--u-surface);
  transition:border-color .15s,color .15s,background .15s;
}
.filter-chip:hover { border-color:var(--u-accent); color:var(--u-accent); text-decoration:none; }
.filter-chip.active { background:var(--u-accent); border-color:var(--u-accent); color:#fff; }
.filter-chip-count {
  font-size:.6875rem; opacity:.8; background:rgba(0,0,0,.09);
  border-radius:100px; padding:0 .35rem; min-width:17px; text-align:center;
}
.filter-chip.active .filter-chip-count { background:rgba(255,255,255,.25); opacity:1; }

/* Desktop table */
.bk-table-wrap { overflow-x:auto; -webkit-overflow-scrolling:touch; }
.bk-table { width:100%; border-collapse:collapse; min-width:660px; }
.bk-table th {
  font-size:.6875rem; font-weight:700; color:var(--u-muted);
  text-transform:uppercase; letter-spacing:.07em;
  padding:.75rem 1rem; border-bottom:1px solid var(--u-border);
  background:var(--u-bg); text-align:left; white-space:nowrap;
}
.bk-table td {
  padding:.875rem 1rem; border-bottom:1px solid var(--u-border);
  font-size:.875rem; vertical-align:middle;
}
.bk-table tr:last-child td { border-bottom:none; }
.bk-table tbody tr:hover td { background:#f8fafc; }
.bk-ref         { font-family:ui-monospace,monospace; font-size:.8rem; color:var(--u-muted); }
.bk-route       { display:flex; align-items:center; gap:.35rem; }
.bk-route-city  { font-weight:700; font-size:.9375rem; }
.bk-route-arrow { color:var(--u-accent); flex-shrink:0; }
.bk-airline-name { font-size:.75rem; color:var(--u-muted); margin-top:.1rem; }
.bk-flight-num  { font-family:ui-monospace,monospace; font-size:.8rem; font-weight:600; }
.bk-date        { font-size:.875rem; font-weight:600; line-height:1.3; }
.bk-time        { font-size:.75rem; color:var(--u-muted); }
.bk-class       { font-size:.8125rem; }
.bk-price       { font-weight:700; font-size:.9375rem; white-space:nowrap; }
.bk-actions     { display:flex; gap:.375rem; flex-wrap:wrap; }

/* Mobile booking cards (hidden on desktop) */
.bk-cards { display:none; }
.bk-card {
  padding:1rem 1.125rem; border-bottom:1px solid var(--u-border);
  transition:background .12s;
}
.bk-card:last-child { border-bottom:none; }
.bk-card:hover { background:#f8fafc; }
.bk-card-top {
  display:flex; align-items:flex-start;
  justify-content:space-between; gap:.5rem; margin-bottom:.5rem;
}
.bk-card-route { font-weight:800; font-size:1rem; display:flex; align-items:center; gap:.4rem; }
.bk-card-ref   {
  font-family:ui-monospace,monospace; font-size:.7rem; color:var(--u-muted);
  margin-top:.2rem;
}
.bk-card-meta {
  font-size:.75rem; color:var(--u-muted); display:flex;
  flex-wrap:wrap; gap:.5rem; margin-bottom:.75rem; align-items:center;
}
.bk-card-meta span { display:inline-flex; align-items:center; gap:.2rem; }
.bk-card-foot {
  display:flex; align-items:center; justify-content:space-between;
  flex-wrap:wrap; gap:.5rem;
}
.bk-card-price { font-weight:800; font-size:.9375rem; }

/* Empty state for bookings */
.bk-empty { text-align:center; padding:4rem 1.5rem; color:var(--u-muted); }
.bk-empty svg { display:block; margin:0 auto 1rem; opacity:.3; }
.bk-empty p   { margin-bottom:1.25rem; font-size:.9375rem; font-weight:500; }

/* Pagination */
.bk-pagination {
  display:flex; align-items:center; gap:.35rem;
  padding:.875rem 1.25rem; border-top:1px solid var(--u-border); flex-wrap:wrap;
}
.pg-btn {
  display:inline-flex; align-items:center; justify-content:center;
  min-width:34px; height:34px; padding:0 .5rem;
  border-radius:var(--u-radius-sm); border:1.5px solid var(--u-border);
  font-size:.8125rem; font-weight:600; color:var(--u-muted);
  background:var(--u-surface); cursor:pointer; transition:all .15s; text-decoration:none;
}
.pg-btn:hover { border-color:var(--u-accent); color:var(--u-accent); text-decoration:none; }
.pg-btn.active { background:var(--u-accent); border-color:var(--u-accent); color:#fff; }

/* ══════════════════════════════════════════════
   PROFILE PAGE
══════════════════════════════════════════════ */
.profile-layout {
  display:grid; grid-template-columns:220px 1fr;
  gap:1.5rem; align-items:start;
}
.profile-side { position:sticky; top:calc(var(--u-topbar-h) + 1rem); }
.profile-id-card {
  background:var(--u-surface); border:1px solid var(--u-border);
  border-radius:var(--u-radius); padding:1.75rem; text-align:center;
}
.profile-av-lg {
  width:80px; height:80px; border-radius:50%; flex-shrink:0;
  background:linear-gradient(135deg,var(--u-accent),#818cf8);
  display:flex; align-items:center; justify-content:center;
  font-size:1.875rem; font-weight:800; color:#fff; margin:0 auto .875rem;
}
.profile-id-name  { font-weight:800; font-size:.9375rem; margin-bottom:.2rem; }
.profile-id-email { font-size:.75rem; color:var(--u-muted); word-break:break-all; }
.profile-id-since { font-size:.6875rem; color:var(--u-muted); margin-top:.4rem; }
.profile-divider  { border:none; border-top:1px solid var(--u-border); margin:1rem 0; }
.profile-nav { display:flex; flex-direction:column; gap:.1rem; text-align:left; }
.profile-nav-link {
  display:flex; align-items:center; gap:.45rem;
  padding:.55rem .75rem; border-radius:var(--u-radius-sm);
  font-size:.875rem; font-weight:600; color:var(--u-muted);
  text-decoration:none; transition:all .15s;
}
.profile-nav-link:hover { background:var(--u-bg); color:var(--u-text); text-decoration:none; }
.profile-nav-link.active { background:var(--u-accent-lt); color:var(--u-accent); }

.profile-content .dash-card {
  overflow:visible; border-radius:var(--u-radius);
  border:1px solid var(--u-border); background:var(--u-surface);
}
.profile-content .dash-card-head {
  padding:1.25rem 1.5rem 1rem; border-bottom:1px solid var(--u-border);
}
.profile-content .dash-card-body { padding:1.5rem; }

/* Password strength */
.pw-strength { display:flex; align-items:center; gap:.5rem; margin-top:.45rem; }
.pw-strength-bar {
  flex:1; height:4px; border-radius:4px; background:var(--u-border);
  overflow:hidden; position:relative;
}
.pw-strength-bar::after {
  content:''; position:absolute; inset:0;
  width:var(--pw-pct,0%); background:var(--pw-color,transparent);
  border-radius:4px; transition:width .25s,background .25s;
}
.pw-strength-label { font-size:.6875rem; font-weight:600; white-space:nowrap; }

/* ══════════════════════════════════════════════
   BOOK A FLIGHT PAGE
══════════════════════════════════════════════ */

/* Search hero */
.fl-search-hero {
  background:linear-gradient(135deg,#0f1f5c 0%,#1e3a8a 55%,#1d4ed8 100%);
  padding:2rem var(--u-sp) 2.5rem;
  position:relative; overflow:hidden;
}
.fl-search-hero::after {
  content:'✈'; position:absolute; right:2rem; top:50%;
  transform:translateY(-50%); font-size:9rem;
  opacity:.05; pointer-events:none; line-height:1;
}
.fl-search-hero-inner { position:relative; z-index:1; }
.fl-search-heading {
  color:#fff; font-size:1.375rem; font-weight:800;
  margin-bottom:.25rem; letter-spacing:-.02em;
}
.fl-search-sub { color:rgba(255,255,255,.6); font-size:.875rem; margin-bottom:1.5rem; }

.fl-search-form { background:rgba(255,255,255,.08); border-radius:var(--u-radius); padding:1.125rem 1.25rem; }
.fl-search-row {
  display:flex; gap:.75rem; align-items:flex-end; flex-wrap:wrap;
}
.fl-search-field { display:flex; flex-direction:column; gap:.3rem; flex:1; min-width:130px; }
.fl-search-field--sm { flex:0 0 140px; }
.fl-search-field--xs { flex:0 0 130px; }
.fl-search-label {
  font-size:.6875rem; font-weight:700; text-transform:uppercase;
  letter-spacing:.08em; color:rgba(255,255,255,.55);
  display:flex; align-items:center; gap:.3rem;
}
.fl-search-input {
  background:rgba(255,255,255,.12); border:1.5px solid rgba(255,255,255,.18);
  border-radius:var(--u-radius-sm); padding:.6rem .875rem;
  font-size:.875rem; font-family:inherit; color:#fff; outline:none;
  transition:border-color .15s,background .15s;
  appearance:none; -webkit-appearance:none;
}
.fl-search-input::placeholder { color:rgba(255,255,255,.35); }
.fl-search-input:focus { border-color:rgba(255,255,255,.55); background:rgba(255,255,255,.18); }
.fl-search-input option { background:#1e3a8a; color:#fff; }

.fl-swap-btn {
  background:rgba(255,255,255,.12); border:1.5px solid rgba(255,255,255,.18);
  border-radius:50%; width:36px; height:36px; flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
  cursor:pointer; color:#fff; transition:background .15s; margin-bottom:1px;
}
.fl-swap-btn:hover { background:rgba(255,255,255,.25); }

.fl-search-btn {
  display:inline-flex; align-items:center; gap:.45rem;
  background:#2563eb; color:#fff; border:none; cursor:pointer;
  padding:.65rem 1.375rem; border-radius:var(--u-radius-sm);
  font-size:.9rem; font-weight:700; font-family:inherit;
  transition:background .15s; flex-shrink:0; white-space:nowrap;
  align-self:flex-end;
}
.fl-search-btn:hover { background:#1d4ed8; }

/* Results header */
.fl-results-header {
  display:flex; align-items:flex-start; justify-content:space-between;
  margin-bottom:1.125rem; flex-wrap:wrap; gap:.5rem;
}
.fl-results-title { font-size:1rem; font-weight:800; }
.fl-results-sub   { font-size:.8125rem; color:var(--u-muted); margin-top:.2rem; }

/* Flight list */
.fl-list { display:flex; flex-direction:column; gap:.875rem; }

.fl-card {
  background:var(--u-surface); border:1.5px solid var(--u-border);
  border-radius:var(--u-radius); padding:1.25rem 1.375rem;
  display:grid;
  grid-template-columns:180px 1fr 160px;
  gap:1.25rem; align-items:center;
  transition:border-color .15s,box-shadow .15s;
}
.fl-card:hover { border-color:var(--u-accent); box-shadow:0 4px 20px rgba(37,99,235,.08); }

/* Airline info column */
.fl-card-airline { display:flex; align-items:center; gap:.625rem; }
.fl-airline-logo  { height:36px; width:auto; max-width:90px; object-fit:contain; }
.fl-airline-avatar {
  width:42px; height:42px; border-radius:10px; flex-shrink:0;
  background:var(--u-accent-lt); color:var(--u-accent);
  display:flex; align-items:center; justify-content:center;
  font-weight:800; font-size:.875rem;
}
.fl-airline-name { font-size:.875rem; font-weight:700; line-height:1.3; }
.fl-flight-num   { font-size:.75rem; color:var(--u-muted); font-family:ui-monospace,monospace; }

/* Route column */
.fl-card-route {
  display:flex; align-items:center; justify-content:center; gap:1rem;
}
.fl-time-block { text-align:center; min-width:54px; }
.fl-time-block--right { text-align:center; }
.fl-time  { font-size:1.375rem; font-weight:800; line-height:1; letter-spacing:-.02em; }
.fl-code  { font-size:.8125rem; font-weight:700; color:var(--u-muted); margin-top:.15rem; }
.fl-city  { font-size:.6875rem; color:var(--u-muted); margin-top:.1rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:80px; }

.fl-route-mid { display:flex; flex-direction:column; align-items:center; gap:.2rem; flex:1; }
.fl-duration  { font-size:.6875rem; font-weight:700; color:var(--u-muted); white-space:nowrap; }
.fl-route-line { color:var(--u-accent); line-height:1; }
.fl-nonstop   { font-size:.6rem; font-weight:600; color:var(--u-muted); text-transform:uppercase; letter-spacing:.06em; }

/* Right column */
.fl-card-right {
  display:flex; flex-direction:column; align-items:flex-end;
  gap:.45rem; text-align:right;
}
.fl-card-badges  { display:flex; align-items:center; gap:.375rem; flex-wrap:wrap; justify-content:flex-end; }
.fl-seats-left   { font-size:.6875rem; color:var(--u-muted); white-space:nowrap; }
.fl-price        { font-size:1.5rem; font-weight:800; color:var(--u-text); line-height:1; }
.fl-price-note   { font-size:.6875rem; color:var(--u-muted); }
.fl-book-btn     { margin-top:.25rem; }

/* No results */
.fl-no-results {
  text-align:center; padding:3.5rem 1.5rem; color:var(--u-muted);
  background:var(--u-surface); border:1px solid var(--u-border);
  border-radius:var(--u-radius);
}
.fl-no-results-icon {
  width:80px; height:80px; border-radius:50%;
  background:var(--u-bg); display:flex; align-items:center;
  justify-content:center; margin:0 auto 1.25rem; opacity:.6;
}
.fl-no-results h3 { font-size:1rem; font-weight:800; color:var(--u-text); margin-bottom:.45rem; }
.fl-no-results p  { font-size:.875rem; }

/* Hint cards (initial state) */
.fl-hint-grid {
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:1rem; margin-top:.5rem;
}
.fl-hint-card {
  background:var(--u-surface); border:1px solid var(--u-border);
  border-radius:var(--u-radius); padding:1.5rem;
}
.fl-hint-icon {
  width:52px; height:52px; border-radius:12px;
  display:flex; align-items:center; justify-content:center;
  margin-bottom:.875rem;
}
.fl-hint-icon--blue   { background:var(--u-accent-lt);  color:var(--u-accent); }
.fl-hint-icon--green  { background:var(--u-success-lt); color:var(--u-success); }
.fl-hint-icon--purple { background:#ede9fe; color:#6d28d9; }
.fl-hint-card h3 { font-size:.9rem; font-weight:700; margin-bottom:.35rem; }
.fl-hint-card p  { font-size:.8125rem; color:var(--u-muted); line-height:1.55; }

/* Booking confirmed */
.bk-confirm-wrap {
  max-width:500px; margin:3rem auto; text-align:center;
  background:var(--u-surface); border:1px solid var(--u-border);
  border-radius:var(--u-radius); padding:3rem 2.5rem;
}
.bk-confirm-icon {
  width:80px; height:80px; border-radius:50%;
  background:var(--u-success-lt); color:var(--u-success);
  display:flex; align-items:center; justify-content:center;
  margin:0 auto 1.25rem;
}
.bk-confirm-title { font-size:1.375rem; font-weight:800; margin-bottom:.35rem; }
.bk-confirm-sub   { color:var(--u-muted); font-size:.9rem; margin-bottom:1.25rem; }
.bk-confirm-ref {
  font-family:ui-monospace,monospace; font-size:1.375rem; font-weight:800;
  color:var(--u-accent); background:var(--u-accent-lt);
  border-radius:var(--u-radius-sm); padding:.625rem 1.25rem;
  display:inline-block; letter-spacing:.08em; margin-bottom:1rem;
}
.bk-confirm-note  { font-size:.8125rem; color:var(--u-muted); margin-bottom:1.75rem; line-height:1.6; }
.bk-confirm-actions { display:flex; gap:.625rem; flex-wrap:wrap; justify-content:center; }

/* Modal */
.modal-backdrop {
  display:none; position:fixed; inset:0; z-index:500;
  background:rgba(15,31,92,.55); backdrop-filter:blur(4px);
  -webkit-backdrop-filter:blur(4px);
  align-items:center; justify-content:center; padding:1rem;
}
.modal-backdrop.open { display:flex; }
body.modal-open { overflow:hidden; }

.modal {
  background:var(--u-surface); border-radius:var(--u-radius);
  box-shadow:0 32px 64px rgba(0,0,0,.35);
  width:100%; max-width:540px;
  max-height:calc(100vh - 2rem); overflow-y:auto;
  animation:modalIn .2s ease;
}
@keyframes modalIn {
  from { opacity:0; transform:translateY(12px) scale(.98); }
  to   { opacity:1; transform:none; }
}

.modal-head {
  display:flex; align-items:center; justify-content:space-between;
  padding:1.25rem 1.5rem; border-bottom:1px solid var(--u-border);
}
.modal-title { font-size:1rem; font-weight:800; }
.modal-close {
  background:none; border:none; cursor:pointer; font-size:1.375rem;
  line-height:1; color:var(--u-muted); padding:.2rem .375rem;
  border-radius:var(--u-radius-sm); transition:background .15s,color .15s;
}
.modal-close:hover { background:var(--u-bg); color:var(--u-text); }

.modal-body { padding:1.5rem; }

/* Modal flight summary box */
.modal-flight-summary {
  background:var(--u-bg); border-radius:var(--u-radius-sm);
  border:1px solid var(--u-border); padding:1rem 1.25rem;
  margin-bottom:1.375rem;
}
.mfs-route {
  display:flex; align-items:center; gap:.5rem; margin-bottom:.3rem;
}
.mfs-code    { font-size:1.125rem; font-weight:800; color:var(--u-text); }
.mfs-meta    { font-size:.8125rem; color:var(--u-muted); }
.mfs-price-per { font-size:.75rem; color:var(--u-muted); margin-top:.2rem; }

.modal-price-row {
  display:flex; align-items:center; justify-content:space-between;
  background:var(--u-accent-lt); border-radius:var(--u-radius-sm);
  padding:.875rem 1.125rem; margin:1.125rem 0;
}
.modal-price-label { font-size:.875rem; font-weight:700; color:var(--u-accent); }
.modal-price-total { font-size:1.375rem; font-weight:800; color:var(--u-accent); }

.modal-foot {
  display:flex; align-items:center; justify-content:flex-end;
  gap:.625rem; padding-top:1rem; border-top:1px solid var(--u-border);
  margin-top:.5rem;
}

/* ══════════════════════════════════════════════
   RESPONSIVE
══════════════════════════════════════════════ */
@media (max-width:1280px) {
  .dash-stats { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:1024px) {
  .profile-layout { grid-template-columns:196px 1fr; }
  .profile-side { position:static; }
}
@media (max-width:900px) {
  .form-grid-2 { grid-template-columns:1fr; }
  .profile-layout { grid-template-columns:1fr; }
  .profile-side { position:static; }
}
@media (max-width:900px) {
  .fl-card {
    grid-template-columns:1fr 1fr;
    grid-template-rows:auto auto;
  }
  .fl-card-airline { grid-column:1; grid-row:1; }
  .fl-card-right   { grid-column:2; grid-row:1; }
  .fl-card-route   { grid-column:1/-1; grid-row:2; justify-content:flex-start; }
  .fl-hint-grid { grid-template-columns:1fr 1fr; }
}
@media (max-width:768px) {
  :root { --u-sp:1rem; }
  .dash-sidebar { transform:translateX(calc(-1 * var(--u-sidebar-w))); }
  .dash-sidebar.open { transform:translateX(0); box-shadow:8px 0 32px rgba(0,0,0,.25); }
  .dash-layout { margin-left:0; }
  .dash-topbar { padding:0 1rem; }
  .dash-topbar-title { font-size:.875rem; }
  .dash-stats   { grid-template-columns:repeat(2,1fr); gap:.75rem; }
  .dash-qa-grid { grid-template-columns:repeat(3,1fr); gap:.75rem; }
  .bk-table-wrap { display:none; }
  .bk-cards      { display:block; }
  .bk-row-right  { flex-wrap:wrap; gap:.4rem; }
  .fl-search-row { flex-direction:column; gap:.625rem; }
  .fl-search-field,
  .fl-search-field--sm,
  .fl-search-field--xs { flex:1 1 100%; min-width:0; }
  .fl-swap-btn { display:none; }
  .fl-search-btn { width:100%; justify-content:center; }
  .fl-card {
    grid-template-columns:1fr;
    grid-template-rows:auto;
  }
  .fl-card-right { align-items:flex-start; text-align:left; }
  .fl-card-badges { justify-content:flex-start; }
  .fl-hint-grid { grid-template-columns:1fr; }
  .bk-confirm-wrap { padding:2rem 1.5rem; }
  .modal { border-radius:var(--u-radius) var(--u-radius) 0 0; }
  .modal-backdrop { align-items:flex-end; padding:0; }
}
@media (max-width:540px) {
  /* Auth pages */
  .auth-card-body   { padding:1.375rem 1.5rem; }
  .auth-card-top    { padding:1.5rem 1.5rem 1.375rem; }
  .auth-card-footer { padding:.875rem 1.5rem 1.25rem; }
  /* Dashboard */
  .dash-stats    { grid-template-columns:1fr 1fr; gap:.625rem; }
  .dash-qa-grid  { grid-template-columns:1fr 1fr; }
  .dash-welcome  { padding:1.25rem; }
  .dash-welcome h2 { font-size:1.1rem; }
  .dash-welcome::after { display:none; }
  .two-cols { grid-template-columns:1fr; }
}
@media (max-width:400px) {
  .dash-qa-grid { grid-template-columns:1fr 1fr; }
  .dash-stats   { grid-template-columns:1fr 1fr; }
}