/* ============================================================
   TSU TIGER BALL 2026 — Admin Theme
   Palette: Onyx Black · Ivory White · Silver
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,600;0,700;0,900;1,400;1,600&family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;1,300;1,400&family=Jost:wght@300;400;500;600;700&display=swap');

/* ── Root Variables ───────────────────────────────────────── */
:root {
  /* 2026 Black & White palette */
  --black-deepest:  #0C0B09;
  --black-deep:     #141210;
  --black-dark:     #1C1916;
  --black:          #252220;
  --black-mid:      #2F2C28;
  --black-light:    #3D3A35;
  --stripe-dark:    #181614;
  --stripe-light:   #222018;

  /* Whites / Silver */
  --white:          #FFFFFF;
  --ivory:          #F5F3EE;
  --ivory-dim:      #E8E4DC;
  --silver-bright:  #D4D0C8;
  --silver:         #A8A49C;
  --silver-dim:     #706C64;
  --silver-deep:    #4A4740;

  /* Accent — warm white glow */
  --accent:         #E8E4DC;
  --accent-bright:  #FFFFFF;
  --accent-glow:    rgba(255,255,255,.12);

  /* Aliases for backward compat with inline refs */
  --maroon-deepest: var(--black-deepest);
  --maroon-deep:    var(--black-deep);
  --maroon-dark:    var(--black-dark);
  --maroon:         var(--black);
  --maroon-mid:     var(--black-mid);
  --maroon-bright:  var(--black-light);
  --gold-dark:      var(--silver-dim);
  --gold:           var(--silver);
  --gold-light:     var(--silver-bright);
  --gold-pale:      var(--ivory-dim);
  --cream:          var(--ivory);
  --cream-dim:      var(--ivory-dim);

  --sidebar-bg:     var(--black-deepest);
  --sidebar-width:  260px;
  --header-height:  56px;
  --radius-sm:      6px;
  --radius-md:      12px;
  --radius-lg:      20px;
  --shadow-card:    0 4px 24px rgba(0,0,0,.45);
  --shadow-lg:      0 12px 48px rgba(0,0,0,.6);
}

/* ── Base ─────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }

body {
  font-family: 'Jost', sans-serif;
  background: #1C1916;
  color: var(--ivory);
}

h1, h2, h3, h4, h5 {
  font-family: 'Playfair Display', serif;
}

/* ── Tiger Stripe Texture Mixin (applied inline via pseudo) ── */
/* bg-stripe pattern: subtle dark zebra texture from the flyer */
.tiger-stripe-bg {
  background-image: repeating-linear-gradient(
    -55deg,
    transparent 0, transparent 20px,
    rgba(255,255,255,.025) 20px, rgba(255,255,255,.025) 22px
  );
}

/* ── Top Navbar ───────────────────────────────────────────── */
.main-header.navbar {
  background: linear-gradient(135deg, var(--black-deepest) 0%, var(--black-dark) 100%) !important;
  border-bottom: 2px solid rgba(255,255,255,.12);
  box-shadow: 0 2px 24px rgba(0,0,0,.6);
  height: var(--header-height);
}

.main-header .nav-link {
  color: var(--ivory) !important;
  opacity: .75;
  transition: opacity .2s;
}
.main-header .nav-link:hover { opacity: 1; }

.navbar-brand-text {
  font-family: 'Jost', sans-serif;
  font-weight: 600;
  font-size: .82rem;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--ivory) !important;
}

/* Gold → White button */
.btn-tsu-gold {
  background: var(--white) !important;
  color: var(--black-deepest) !important;
  border: none !important;
  font-family: 'Jost', sans-serif;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  font-size: .76rem;
  transition: all .22s;
}
.btn-tsu-gold:hover {
  background: var(--ivory) !important;
  color: var(--black-deep) !important;
  box-shadow: 0 4px 16px rgba(255,255,255,.18) !important;
}

/* ── Sidebar ──────────────────────────────────────────────── */
.main-sidebar {
  background: var(--black-deepest) !important;
  border-right: 1px solid rgba(255,255,255,.07) !important;
  width: var(--sidebar-width) !important;
}

/* Tiger stripe overlay on sidebar */
.main-sidebar::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: repeating-linear-gradient(
    -55deg,
    transparent 0, transparent 28px,
    rgba(255,255,255,.018) 28px, rgba(255,255,255,.018) 30px
  );
  pointer-events: none;
  z-index: 0;
}

.main-sidebar .sidebar,
.main-sidebar .brand-link {
  position: relative;
  z-index: 1;
}

.brand-link {
  background: linear-gradient(135deg, var(--black-deepest), var(--black-dark)) !important;
  border-bottom: 1px solid rgba(255,255,255,.1) !important;
  padding: 14px 16px !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  text-decoration: none !important;
}

.brand-link i { color: var(--ivory) !important; }

.brand-text {
  font-family: 'Playfair Display', serif !important;
  font-size: .88rem !important;
  font-weight: 700 !important;
  color: var(--ivory) !important;
  line-height: 1.2 !important;
}

.brand-text small {
  display: block;
  font-family: 'Jost', sans-serif !important;
  font-size: .58rem !important;
  font-weight: 600 !important;
  letter-spacing: 2.5px !important;
  text-transform: uppercase !important;
  color: var(--silver-dim) !important;
}

/* Sidebar nav */
.nav-sidebar .nav-link {
  color: var(--silver) !important;
  font-family: 'Jost', sans-serif;
  font-size: .82rem;
  font-weight: 500;
  padding: 10px 14px !important;
  border-radius: 8px;
  margin: 2px 8px;
  transition: all .2s;
  border-left: 3px solid transparent;
}

.nav-sidebar .nav-link:hover {
  background: rgba(255,255,255,.07) !important;
  color: var(--ivory) !important;
}

.nav-sidebar .nav-link.active {
  background: rgba(255,255,255,.1) !important;
  color: var(--white) !important;
  border-left-color: var(--white) !important;
}

.nav-icon { color: var(--silver-dim) !important; }
.nav-link.active .nav-icon,
.nav-link:hover .nav-icon { color: var(--ivory) !important; }

.sidebar-label {
  font-family: 'Jost', sans-serif;
  font-size: .58rem;
  font-weight: 700;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: var(--silver-deep);
  padding: 14px 22px 4px;
}

.sidebar-divider {
  height: 1px;
  background: rgba(255,255,255,.07);
  margin: 8px 16px;
}

/* ── Main Content Area ────────────────────────────────────── */
.content-wrapper {
  background: #18160f !important;
  margin-left: var(--sidebar-width);
  min-height: 100vh;
}

.content-header {
  padding: 20px 30px 10px;
  background: transparent;
}

.content-header h1 {
  font-family: 'Playfair Display', serif;
  font-size: 1.6rem;
  font-weight: 700;
  color: var(--ivory);
}

/* ── Cards ────────────────────────────────────────────────── */
.card {
  background: var(--black-dark) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  border-radius: var(--radius-md) !important;
  box-shadow: var(--shadow-card) !important;
}

.card-header {
  background: linear-gradient(135deg, var(--black-deepest), var(--black-dark)) !important;
  border-bottom: 1px solid rgba(255,255,255,.1) !important;
  font-family: 'Playfair Display', serif;
  color: var(--ivory) !important;
  padding: 14px 20px !important;
}

.card-body { color: var(--ivory); }
.card-footer {
  background: var(--black-mid) !important;
  border-top: 1px solid rgba(255,255,255,.07) !important;
}

/* ── Small Boxes (Dashboard Stats) ───────────────────────── */
.small-box {
  border-radius: var(--radius-md) !important;
  overflow: hidden;
}

.small-box-body {
  padding: 20px !important;
  position: relative;
}

.small-box h3 {
  font-family: 'Playfair Display', serif;
  font-size: 2.8rem !important;
  font-weight: 900 !important;
  color: var(--white) !important;
  line-height: 1 !important;
  margin-bottom: 4px !important;
}

.small-box p {
  font-family: 'Jost', sans-serif;
  font-size: .62rem !important;
  font-weight: 700 !important;
  letter-spacing: 3px !important;
  text-transform: uppercase !important;
  color: rgba(255,255,255,.55) !important;
  margin: 0 !important;
}

.small-box .icon {
  opacity: .12 !important;
}

/* Stat card variants */
.bg-stat-1 { background: linear-gradient(135deg, #141210, #252220) !important; border: 1px solid rgba(255,255,255,.12) !important; }
.bg-stat-2 { background: linear-gradient(135deg, #0C0B09, #1C1916) !important; border: 1px solid rgba(255,255,255,.08) !important; }
.bg-stat-3 { background: linear-gradient(135deg, #1C1916, #2F2C28) !important; border: 1px solid rgba(255,255,255,.1) !important; }

.small-box-footer {
  background: rgba(0,0,0,.25) !important;
  color: rgba(255,255,255,.5) !important;
  font-family: 'Jost', sans-serif;
  font-size: .72rem !important;
  font-weight: 600 !important;
  letter-spacing: 1px !important;
  padding: 10px 18px !important;
  transition: background .2s !important;
  display: block !important;
  text-decoration: none !important;
}
.small-box-footer:hover {
  background: rgba(255,255,255,.08) !important;
  color: var(--ivory) !important;
}

/* ── Buttons ──────────────────────────────────────────────── */
.btn-primary {
  background: linear-gradient(135deg, var(--black), var(--black-light)) !important;
  border: 1px solid rgba(255,255,255,.2) !important;
  color: var(--white) !important;
  font-family: 'Jost', sans-serif;
  font-weight: 600;
  transition: all .22s;
}
.btn-primary:hover {
  background: linear-gradient(135deg, var(--black-mid), var(--black)) !important;
  border-color: rgba(255,255,255,.35) !important;
  box-shadow: 0 4px 16px rgba(0,0,0,.5) !important;
  transform: translateY(-1px);
}

.btn-secondary {
  background: rgba(255,255,255,.08) !important;
  border: 1px solid rgba(255,255,255,.15) !important;
  color: var(--silver-bright) !important;
}
.btn-secondary:hover {
  background: rgba(255,255,255,.14) !important;
  color: var(--white) !important;
}

.btn-warning {
  background: linear-gradient(135deg, #4a4030, #6b5c40) !important;
  border: none !important;
  color: var(--ivory) !important;
}
.btn-warning:hover { filter: brightness(1.15); color: var(--white) !important; }

.btn-danger {
  background: linear-gradient(135deg, #3a1010, #5c1a1a) !important;
  border: none !important;
  color: #fca5a5 !important;
}
.btn-danger:hover { filter: brightness(1.2); }

/* ── Tables ───────────────────────────────────────────────── */
.table {
  color: var(--ivory) !important;
  border-color: rgba(255,255,255,.06) !important;
}

.table thead th {
  background: linear-gradient(135deg, var(--black-deepest), var(--black-dark)) !important;
  color: var(--silver-bright) !important;
  font-family: 'Jost', sans-serif;
  font-size: .65rem !important;
  font-weight: 700 !important;
  letter-spacing: 2.5px !important;
  text-transform: uppercase !important;
  border-color: rgba(255,255,255,.08) !important;
  padding: 14px 16px !important;
}

.table tbody tr {
  border-bottom: 1px solid rgba(255,255,255,.05) !important;
  transition: background .15s;
}
.table tbody tr:hover { background: rgba(255,255,255,.05) !important; }

.table tbody td {
  vertical-align: middle !important;
  color: var(--ivory) !important;
  border-color: rgba(255,255,255,.04) !important;
  padding: 12px 16px !important;
}

.table-bordered { border: 1px solid rgba(255,255,255,.07) !important; }
.table-hover tbody tr:hover { background-color: rgba(255,255,255,.05) !important; }

/* ── Forms ────────────────────────────────────────────────── */
.form-control, .form-select {
  background: rgba(255,255,255,.06) !important;
  border: 1.5px solid rgba(255,255,255,.12) !important;
  color: var(--ivory) !important;
  border-radius: var(--radius-sm) !important;
  font-family: 'Jost', sans-serif;
  transition: all .2s;
}
.form-control:focus, .form-select:focus {
  background: rgba(255,255,255,.1) !important;
  border-color: rgba(255,255,255,.4) !important;
  box-shadow: 0 0 0 3px rgba(255,255,255,.1) !important;
  color: var(--white) !important;
}
.form-control::placeholder { color: rgba(255,255,255,.25) !important; }

.form-label {
  font-family: 'Jost', sans-serif;
  font-size: .65rem;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--silver);
}

.form-check-input:checked {
  background-color: var(--white) !important;
  border-color: var(--white) !important;
}

/* ── Alerts ───────────────────────────────────────────────── */
.alert-success {
  background: rgba(34,197,94,.1) !important;
  border: 1px solid rgba(34,197,94,.25) !important;
  color: #86efac !important;
  border-radius: var(--radius-md) !important;
}
.alert-danger {
  background: rgba(239,68,68,.1) !important;
  border: 1px solid rgba(239,68,68,.25) !important;
  color: #fca5a5 !important;
  border-radius: var(--radius-md) !important;
}

/* ── Badges ───────────────────────────────────────────────── */
.badge.bg-success { background: rgba(34,197,94,.2) !important; color: #86efac !important; border: 1px solid rgba(34,197,94,.3) !important; }
.badge.bg-secondary { background: rgba(255,255,255,.1) !important; color: var(--silver) !important; }
.badge.bg-warning { background: rgba(234,179,8,.15) !important; color: #fde047 !important; border: 1px solid rgba(234,179,8,.25) !important; }

/* ── DataTables ───────────────────────────────────────────── */
.dataTables_wrapper .dataTables_filter input,
.dataTables_wrapper .dataTables_length select {
  background: rgba(255,255,255,.06) !important;
  border: 1.5px solid rgba(255,255,255,.12) !important;
  color: var(--ivory) !important;
  border-radius: 8px !important;
}
.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_filter label,
.dataTables_wrapper .dataTables_length label { color: var(--silver) !important; }

.dataTables_paginate .paginate_button {
  background: transparent !important;
  border: 1px solid rgba(255,255,255,.1) !important;
  color: var(--silver-bright) !important;
  border-radius: 6px !important;
  margin: 0 2px !important;
}
.dataTables_paginate .paginate_button.current {
  background: rgba(255,255,255,.12) !important;
  border-color: rgba(255,255,255,.25) !important;
  color: var(--white) !important;
}
.dataTables_paginate .paginate_button:hover {
  background: rgba(255,255,255,.08) !important;
  color: var(--white) !important;
}

/* ── Modals ───────────────────────────────────────────────── */
.modal-content {
  background: var(--black-dark) !important;
  border: 1px solid rgba(255,255,255,.1) !important;
  color: var(--ivory) !important;
}
.modal-header {
  border-bottom: 1px solid rgba(255,255,255,.08) !important;
}
.modal-footer {
  border-top: 1px solid rgba(255,255,255,.08) !important;
}
.modal-title { color: var(--ivory) !important; }

/* ── Scrollbar ────────────────────────────────────────────── */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: var(--black-deep); }
::-webkit-scrollbar-thumb { background: rgba(255,255,255,.2); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,.35); }

/* ────────────────────────────────────────────────────────────
   DASHBOARD
   ─────────────────────────────────────────────────────────── */
.dash-hero {
  background: var(--black-deepest);
  background-image: repeating-linear-gradient(
    -55deg,
    transparent 0, transparent 28px,
    rgba(255,255,255,.025) 28px, rgba(255,255,255,.025) 30px
  );
  padding: 36px 30px 32px;
  position: relative;
  overflow: hidden;
  border-bottom: 2px solid rgba(255,255,255,.08);
}

.dash-hero::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.25) 30%, rgba(255,255,255,.45) 50%, rgba(255,255,255,.25) 70%, transparent);
}

.dash-hero-text h1 {
  font-family: 'Playfair Display', serif;
  font-size: clamp(1.6rem, 3vw, 2.4rem);
  font-weight: 900;
  color: var(--white);
  margin: 0;
}

.dash-hero-text h1 em {
  color: var(--silver-bright);
  font-style: italic;
}

.dash-hero-text p {
  font-family: 'Jost', sans-serif;
  color: var(--silver-dim);
  font-size: .82rem;
  margin: 6px 0 0;
}

.hero-eyebrow {
  font-family: 'Jost', sans-serif;
  font-size: .58rem;
  font-weight: 700;
  letter-spacing: 4px;
  text-transform: uppercase;
  color: var(--silver);
  margin-bottom: 8px;
}

/* Stat cards */
.stat-card-inner {
  background: var(--black-dark);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: var(--radius-lg);
  padding: 22px 24px;
  position: relative;
  overflow: hidden;
  height: 100%;
  transition: transform .2s, box-shadow .2s;
}
.stat-card-inner:hover {
  transform: translateY(-3px);
  box-shadow: 0 16px 40px rgba(0,0,0,.5) !important;
}

.stat-card-icon {
  position: absolute;
  right: 16px;
  top: 16px;
  font-size: 2.8rem;
  opacity: .07;
  color: var(--white);
}

.stat-eyebrow {
  font-family: 'Jost', sans-serif;
  font-size: .58rem;
  font-weight: 700;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: var(--silver-dim);
  margin-bottom: 8px;
}

.stat-number {
  font-family: 'Playfair Display', serif;
  font-size: 3rem;
  font-weight: 900;
  color: var(--white);
  line-height: 1;
  text-shadow: 0 0 30px rgba(255,255,255,.12);
}

.stat-label {
  font-family: 'Jost', sans-serif;
  font-size: .65rem;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--silver-dim);
  margin-top: 4px;
}

.stat-footer {
  font-family: 'Jost', sans-serif;
  font-size: .72rem;
  color: var(--silver-dim);
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid rgba(255,255,255,.06);
}
.stat-footer a {
  color: var(--silver);
  text-decoration: none;
  transition: color .2s;
}
.stat-footer a:hover { color: var(--white); }

/* Progress section */
.progress-section {
  background: var(--black-dark);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: var(--radius-lg);
  padding: 22px 24px;
}

.progress-track {
  height: 10px;
  background: rgba(255,255,255,.08);
  border-radius: 50px;
  overflow: hidden;
  margin: 12px 0;
}

.progress-fill {
  height: 100%;
  background: linear-gradient(90deg, var(--silver-deep), var(--silver-bright));
  border-radius: 50px;
  transition: width 1s ease;
}

.progress-pct {
  font-family: 'Playfair Display', serif;
  font-size: 2rem;
  font-weight: 900;
  color: var(--white);
}

/* Quick link grid */
.quick-link {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 20px;
  background: var(--black-dark);
  border: 1px solid rgba(255,255,255,.07);
  border-radius: var(--radius-md);
  text-decoration: none;
  color: var(--silver);
  text-align: center;
  transition: all .2s;
  min-height: 90px;
}
.quick-link:hover {
  background: rgba(255,255,255,.08);
  border-color: rgba(255,255,255,.2);
  color: var(--white);
  transform: translateY(-2px);
}
.quick-link i { font-size: 1.5rem; color: var(--silver-dim); }
.quick-link:hover i { color: var(--white); }
.quick-link span {
  font-family: 'Jost', sans-serif;
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
}

/* ────────────────────────────────────────────────────────────
   PAGE HERO BANNERS (shared across pages)
   ─────────────────────────────────────────────────────────── */
.seating-hero,
.form-hero,
.page-hero,
.checkin-hero {
  background: var(--black-deepest);
  background-image: repeating-linear-gradient(
    -55deg,
    transparent 0, transparent 28px,
    rgba(255,255,255,.03) 28px, rgba(255,255,255,.03) 30px
  );
  position: relative;
  overflow: hidden;
}

.seating-hero::after,
.form-hero::after,
.page-hero::after,
.checkin-hero::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.2) 30%, rgba(255,255,255,.35) 50%, rgba(255,255,255,.2) 70%, transparent);
}

.seating-hero h1,
.form-hero h1,
.page-hero h1 {
  color: var(--white) !important;
}
.seating-hero h1 em,
.form-hero h1 em,
.page-hero h1 em {
  color: var(--silver-bright) !important;
  font-style: italic;
}

/* ────────────────────────────────────────────────────────────
   CHECK-IN PAGE
   ─────────────────────────────────────────────────────────── */
.checkin-hero {
  padding: 32px 30px;
}

.search-section {
  background: var(--black-dark);
  border-radius: 0 0 20px 20px;
  padding: 24px 28px 20px;
  border: 1px solid rgba(255,255,255,.08);
  border-top: none;
}

#searchInput {
  background: rgba(255,255,255,.06) !important;
  border: 2px solid rgba(255,255,255,.12) !important;
  color: var(--white) !important;
  border-radius: 14px !important;
  font-family: 'Playfair Display', serif !important;
  font-size: 1.15rem !important;
  padding: 14px 50px !important;
}
#searchInput:focus {
  border-color: rgba(255,255,255,.4) !important;
  box-shadow: 0 0 0 4px rgba(255,255,255,.08) !important;
  background: rgba(255,255,255,.09) !important;
}
#searchInput::placeholder { color: rgba(255,255,255,.2) !important; }

.guest-card {
  background: var(--black-dark);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 14px;
  padding: 16px 20px;
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  gap: 16px;
  transition: all .2s;
}
.guest-card:hover { border-color: rgba(255,255,255,.2); background: rgba(255,255,255,.04); }

.guest-card.checked-in {
  background: linear-gradient(135deg, rgba(22,163,74,.15), rgba(34,197,94,.08));
  border-color: rgba(34,197,94,.3);
}

.btn-checkin {
  background: var(--white);
  color: var(--black-deepest);
  border: none;
  border-radius: 50px;
  padding: 9px 22px;
  font-family: 'Jost', sans-serif;
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  cursor: pointer;
  transition: all .22s;
}
.btn-checkin:hover { background: var(--ivory); box-shadow: 0 4px 16px rgba(255,255,255,.2); }

.badge-checked-in {
  background: rgba(34,197,94,.2);
  color: #86efac;
  border: 1px solid rgba(34,197,94,.35);
  border-radius: 50px;
  padding: 6px 18px;
  font-family: 'Jost', sans-serif;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: 1px;
  display: flex;
  align-items: center;
  gap: 6px;
}

/* QR Panel */
.qr-panel {
  background: var(--black-deepest);
  background-image: repeating-linear-gradient(
    -55deg,
    transparent 0, transparent 28px,
    rgba(255,255,255,.025) 28px, rgba(255,255,255,.025) 30px
  );
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 20px;
  padding: 36px 28px;
  text-align: center;
  position: relative;
}

.qr-panel::before {
  content: '';
  position: absolute;
  inset: 6px;
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.06);
  pointer-events: none;
}

.qr-success-tag {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  background: rgba(34,197,94,.15);
  border: 1px solid rgba(34,197,94,.3);
  border-radius: 50px;
  padding: 5px 16px;
  font-family: 'Jost', sans-serif;
  font-size: .65rem;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #86efac;
  margin-bottom: 16px;
}

.qr-guest-name {
  font-family: 'Playfair Display', serif;
  font-size: clamp(1.4rem, 4vw, 2rem);
  font-weight: 700;
  color: var(--white);
}

.qr-table-number {
  font-family: 'Playfair Display', serif;
  font-size: 6rem;
  font-weight: 900;
  color: var(--white);
  text-shadow: 0 0 40px rgba(255,255,255,.25);
  line-height: 1;
}

.qr-table-name {
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
  font-size: 1.1rem;
  color: var(--silver);
  margin-top: 4px;
}

/* ────────────────────────────────────────────────────────────
   FORM CARDS (Add Table / Add Guest)
   ─────────────────────────────────────────────────────────── */
.form-page-wrap { background: #18160f; min-height: 100vh; }

.form-card {
  background: var(--black-dark) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
}

.form-section-block {
  border-bottom-color: rgba(255,255,255,.06) !important;
}

.section-icon {
  background: linear-gradient(135deg, var(--black-deepest), var(--black)) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
}

.section-title-text { color: var(--ivory) !important; }
.section-subtitle { color: var(--silver-dim) !important; }

.fancy-label { color: var(--silver) !important; }

.fancy-input {
  background: rgba(255,255,255,.06) !important;
  border: 2px solid rgba(255,255,255,.1) !important;
  color: var(--white) !important;
}
.fancy-input:focus {
  border-color: rgba(255,255,255,.4) !important;
  background: rgba(255,255,255,.09) !important;
  box-shadow: 0 0 0 4px rgba(255,255,255,.08) !important;
}
.fancy-input::placeholder { color: rgba(255,255,255,.2) !important; }
.fancy-input-icon { color: var(--silver-dim) !important; }

/* Sponsor card grid */
.sponsor-card {
  border: 2px solid rgba(255,255,255,.08) !important;
  background: rgba(255,255,255,.04) !important;
}
.sponsor-card:hover { border-color: rgba(255,255,255,.25) !important; background: rgba(255,255,255,.08) !important; }
.sponsor-card.selected {
  border-color: var(--white) !important;
  background: rgba(255,255,255,.1) !important;
  box-shadow: 0 4px 16px rgba(255,255,255,.1) !important;
}
.sponsor-card-label { color: var(--ivory) !important; }

/* Table card grid (in guest form) */
.table-card-opt {
  border: 2px solid rgba(255,255,255,.08) !important;
  background: rgba(255,255,255,.04) !important;
}
.table-card-opt:hover { border-color: rgba(255,255,255,.22) !important; background: rgba(255,255,255,.08) !important; }
.table-card-opt.selected {
  border-color: var(--white) !important;
  background: rgba(255,255,255,.1) !important;
  box-shadow: 0 3px 14px rgba(255,255,255,.1) !important;
}
.table-card-num { color: var(--white) !important; }
.table-card-name { color: var(--silver) !important; }
.table-card-opt.selected .table-card-num { color: var(--white) !important; }
.table-card-opt.selected .table-card-name { color: var(--silver-bright) !important; }

/* Unassigned option */
.unassigned-opt {
  border-color: rgba(255,255,255,.08) !important;
  background: rgba(255,255,255,.04) !important;
}
.unassigned-opt:hover { border-color: rgba(255,255,255,.2) !important; background: rgba(255,255,255,.07) !important; }
.unassigned-opt.selected {
  border-color: var(--white) !important;
  background: rgba(255,255,255,.09) !important;
}
.unassigned-text-main { color: var(--ivory) !important; }
.unassigned-text-sub { color: var(--silver-dim) !important; }

/* Toggle rows */
.toggle-row { background: rgba(255,255,255,.04) !important; border-color: rgba(255,255,255,.08) !important; }
.toggle-row:hover { background: rgba(255,255,255,.08) !important; border-color: rgba(255,255,255,.2) !important; }
.toggle-row.active-row { background: rgba(255,255,255,.08) !important; border-color: var(--white) !important; }
.toggle-label-main { color: var(--ivory) !important; }
.toggle-label-sub { color: var(--silver-dim) !important; }

/* Table preview block */
.table-no-preview {
  background: linear-gradient(135deg, var(--black-deepest), var(--black-dark)) !important;
  border: 2px solid rgba(255,255,255,.15) !important;
}
.table-no-preview-num { color: var(--white) !important; text-shadow: 0 0 30px rgba(255,255,255,.2); }
.table-no-preview-label { color: rgba(255,255,255,.3) !important; }

/* Stepper */
.stepper { border-color: rgba(255,255,255,.12) !important; background: rgba(255,255,255,.05) !important; }
.stepper-btn { color: var(--silver-bright) !important; }
.stepper-btn:hover { background: rgba(255,255,255,.1) !important; }
.stepper-val { color: var(--white) !important; }

/* Submit bar */
.form-submit-bar { background: rgba(255,255,255,.03) !important; border-top-color: rgba(255,255,255,.07) !important; }
.btn-save-big {
  background: linear-gradient(135deg, #252220, #3D3A35) !important;
  border: 1px solid rgba(255,255,255,.2) !important;
  box-shadow: 0 6px 20px rgba(0,0,0,.4) !important;
}
.btn-save-big:hover {
  background: linear-gradient(135deg, #3D3A35, #252220) !important;
  border-color: rgba(255,255,255,.35) !important;
  box-shadow: 0 10px 30px rgba(0,0,0,.5) !important;
}
.btn-cancel-link { color: var(--silver-dim) !important; }
.btn-cancel-link:hover { color: var(--ivory) !important; }

/* Name avatar */
.name-preview {
  background: linear-gradient(135deg, var(--black-deepest), var(--black)) !important;
  border-color: rgba(255,255,255,.25) !important;
  color: var(--white) !important;
}

/* Saved banner */
.alert-saved {
  background: linear-gradient(135deg, rgba(34,197,94,.12), rgba(34,197,94,.06)) !important;
  border-color: rgba(34,197,94,.3) !important;
}
.saved-text { color: #86efac !important; }
.saved-text strong { color: #bbf7d0 !important; }
.saved-sub { color: rgba(134,239,172,.6) !important; }
.btn-done-link { background: rgba(34,197,94,.3) !important; color: #bbf7d0 !important; }
.btn-done-link:hover { background: rgba(34,197,94,.45) !important; color: #fff !important; }

/* ────────────────────────────────────────────────────────────
   SEATING CHART
   ─────────────────────────────────────────────────────────── */
.guest-drawer {
  background: linear-gradient(180deg, var(--black-deepest) 0%, var(--black-dark) 100%) !important;
  border-right-color: rgba(255,255,255,.08) !important;
}

.drawer-search {
  background: rgba(255,255,255,.06) !important;
  border-color: rgba(255,255,255,.1) !important;
  color: var(--ivory) !important;
}
.drawer-search::placeholder { color: rgba(255,255,255,.2) !important; }

.draggable {
  background: rgba(255,255,255,.05) !important;
  border-color: rgba(255,255,255,.1) !important;
  color: var(--ivory) !important;
}
.draggable:hover {
  background: rgba(255,255,255,.1) !important;
  border-color: rgba(255,255,255,.25) !important;
}

.drag-avatar {
  background: linear-gradient(135deg, var(--black), var(--black-light)) !important;
  border-color: rgba(255,255,255,.2) !important;
  color: var(--ivory) !important;
}

.ballroom-controls {
  background: var(--black-dark) !important;
  border-bottom-color: rgba(255,255,255,.1) !important;
  box-shadow: 0 2px 12px rgba(0,0,0,.4) !important;
}

.ctrl-label { color: var(--silver) !important; }

.table-select-styled {
  background-color: rgba(255,255,255,.06) !important;
  border-color: rgba(255,255,255,.12) !important;
  color: var(--ivory) !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23A8A49C' d='M6 8L0 0h12z'/%3E%3C/svg%3E") !important;
}
.table-select-styled:focus { border-color: rgba(255,255,255,.35) !important; box-shadow: 0 0 0 3px rgba(255,255,255,.1) !important; }

/* Ballroom floor */
.ballroom-floor {
  background: #0C0B09 !important;
  background-image:
    linear-gradient(rgba(255,255,255,.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.03) 1px, transparent 1px) !important;
  background-size: 44px 44px !important;
}

/* Table surface — onyx with silver ring */
.table-surface {
  background: radial-gradient(circle at 38% 32%, #2A2520 0%, #1A1714 40%, #0C0B09 100%) !important;
  border-color: rgba(255,255,255,.35) !important;
  box-shadow:
    0 0 0 10px rgba(255,255,255,.04),
    0 0 0 11px rgba(255,255,255,.02),
    0 30px 100px rgba(0,0,0,.9),
    inset 0 3px 40px rgba(255,255,255,.06),
    inset 0 -8px 30px rgba(0,0,0,.5) !important;
}

.table-label-sm { color: rgba(255,255,255,.3) !important; }
.table-num-big { color: var(--white) !important; text-shadow: 0 0 30px rgba(255,255,255,.3), 0 2px 10px rgba(0,0,0,.6) !important; }
.table-name-italic { color: rgba(255,255,255,.4) !important; }
.table-capacity { color: rgba(255,255,255,.2) !important; }
.table-flower { filter: grayscale(1) brightness(0.6) !important; }

/* Seat chips */
.seat-chip.empty {
  background: rgba(255,255,255,.04) !important;
  border-color: rgba(255,255,255,.15) !important;
}
.seat-chip.empty:hover {
  background: rgba(255,255,255,.08) !important;
  border-color: rgba(255,255,255,.3) !important;
}
.seat-chip.drag-over {
  background: rgba(255,255,255,.15) !important;
  border-color: var(--white) !important;
  box-shadow: 0 0 24px rgba(255,255,255,.2) !important;
}
.seat-chip.occupied {
  background: linear-gradient(145deg, rgba(30,28,24,.95), rgba(12,11,9,.98)) !important;
  border-color: rgba(255,255,255,.3) !important;
  box-shadow: 0 6px 20px rgba(0,0,0,.5), 0 0 0 1px rgba(255,255,255,.08) !important;
}
.seat-chip.occupied:hover {
  border-color: rgba(255,255,255,.55) !important;
}
.seat-num-label { color: rgba(255,255,255,.3) !important; }
.seat-name-text { color: var(--ivory) !important; }
.seat-icon { color: rgba(255,255,255,.15) !important; }

/* ────────────────────────────────────────────────────────────
   RSVP LIST / GUEST LIST PAGE HERO
   ─────────────────────────────────────────────────────────── */
.page-hero {
  padding: 26px 30px;
}
.page-hero h1 { font-size: clamp(1.2rem, 3vw, 1.7rem); }
.hero-sub { color: var(--silver-dim) !important; }

/* ────────────────────────────────────────────────────────────
   CAPTAIN PORTAL (standalone dark page)
   ─────────────────────────────────────────────────────────── */
/* Already has inline dark styles — aliases handled by variables above */

/* ════════════════════════════════════════════════════════════
   RESPONSIVE LAYER — Mobile & Tablet
   ════════════════════════════════════════════════════════════ */

img, table { max-width: 100%; }
.container-fluid { padding-left: 16px; padding-right: 16px; }

@media (max-width: 991px) {
  .content-wrapper, .main-footer { margin-left: 0 !important; }
  .seating-page { flex-direction: column !important; height: auto !important; overflow: visible !important; }
  .guest-drawer { width: 100% !important; height: auto !important; border-right: none !important; border-bottom: 1px solid rgba(255,255,255,.08) !important; max-height: 260px; }
  .guest-list-scroll { max-height: 160px !important; }
  .ballroom-floor { min-height: 500px !important; overflow: auto !important; }
  .ballroom-controls { flex-wrap: wrap !important; gap: 10px !important; padding: 12px 14px !important; }
  .table-select-styled { min-width: 100% !important; width: 100% !important; }
}

@media (max-width: 767px) {
  .main-header.navbar { padding: 0 10px !important; }
  .content-header { padding: 16px 16px !important; }
  .content-header h1 { font-size: 1.3rem !important; }
  .form-hero, .checkin-hero, .seating-hero, .page-hero { padding: 22px 16px !important; }
  .form-hero h1, .dash-hero-text h1 { font-size: 1.5rem !important; }
  .stat-card-inner { padding: 18px 16px !important; }
  .stat-number { font-size: 2rem !important; }
  .quick-link { padding: 12px 14px !important; }
  .progress-section { padding: 16px !important; }
  .progress-pct { font-size: 1.5rem !important; }
  .checkin-hero { padding: 22px 16px !important; }
  .search-section { padding: 18px 16px 16px !important; border-radius: 0 0 14px 14px !important; }
  #searchInput { font-size: 1rem !important; padding: 13px 46px !important; }
  .guest-card { flex-direction: column !important; align-items: flex-start !important; gap: 10px !important; }
  .guest-card > div:last-child { width: 100% !important; }
  .btn-checkin, .badge-checked-in { width: 100% !important; justify-content: center !important; text-align: center !important; }
  .qr-panel { padding: 28px 16px !important; }
  .qr-table-number { font-size: 4.5rem !important; }
  .form-card { border-radius: 14px !important; margin: 0 4px !important; }
  .form-section-block { padding: 18px 16px !important; }
  .form-submit-bar { padding: 16px !important; flex-direction: column-reverse !important; align-items: stretch !important; }
  .btn-save-big { text-align: center !important; width: 100% !important; }
  .btn-cancel-link { text-align: center !important; display: block !important; padding: 8px 0 !important; }
  .name-preview { width: 44px !important; height: 44px !important; font-size: 1rem !important; }
  .sponsor-grid { grid-template-columns: repeat(2,1fr) !important; }
  .table-select-grid { grid-template-columns: repeat(3,1fr) !important; max-height: 180px !important; }
  .stepper { width: 100% !important; }
  .stepper-val { flex: 1 !important; }
  .table tbody td, .table thead th { padding: 9px 10px !important; font-size: .78rem !important; }
  .table thead th { font-size: .65rem !important; letter-spacing: 1px !important; }
  .btn-sm { padding: 4px 7px !important; font-size: .72rem !important; }
  .modal-dialog { margin: 10px !important; }
}

@media (max-width: 991px) {
  .main-sidebar { transform: translateX(-100%); transition: transform .3s ease; z-index: 1050 !important; }
  body.sidebar-open .main-sidebar { transform: translateX(0); }
  body.sidebar-open::after { content:'';position:fixed;inset:0;background:rgba(0,0,0,.7);z-index:1040; }
  .dataTables_wrapper { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  #rsvpTable, #guestTable { min-width: 700px; }
  .nav-sidebar .nav-link { padding: 12px 14px !important; min-height: 44px; }
  .btn { min-height: 38px; }
  .draggable { min-height: 44px; }
  .toggle-row { min-height: 52px; }
}

/* Mobile bottom nav */
.mobile-bottom-nav { background: linear-gradient(135deg, var(--black-deepest), var(--black-dark)) !important; border-top-color: rgba(255,255,255,.1) !important; }
.mbn-item { color: rgba(255,255,255,.3) !important; }
.mbn-item.active { color: var(--white) !important; }
.mbn-item:hover { color: var(--silver-bright) !important; }
.mbn-add { background: linear-gradient(135deg, #252220, #3D3A35) !important; border-color: rgba(255,255,255,.2) !important; box-shadow: 0 6px 20px rgba(0,0,0,.6), 0 0 0 3px var(--black-deepest) !important; }

@media (max-width: 991px) {
  .content-wrapper, body > .wrapper { padding-bottom: 70px; }
}

/* DataTables dark */
.dataTables_wrapper .dataTables_filter input,
.dataTables_wrapper .dataTables_length select {
  background: rgba(255,255,255,.06) !important;
  border: 1.5px solid rgba(255,255,255,.12) !important;
  color: var(--ivory) !important;
  border-radius: 8px !important;
}
.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_filter label,
.dataTables_wrapper .dataTables_length label { color: var(--silver) !important; font-family: 'Jost',sans-serif; font-size: .78rem; }

/* ════════════════════════════════════════════════════════════
   CONTRAST FIX OVERRIDES — force readable text everywhere
   ════════════════════════════════════════════════════════════ */

/* Bootstrap .table-light override */
.table-light, .table-light > th, .table-light > td { background-color: #141210 !important; color: var(--silver-bright) !important; }
thead.table-light th { background-color: #141210 !important; color: var(--silver-bright) !important; }

/* All form backgrounds → dark */
.form-control, .form-select, input[type="text"], input[type="email"],
input[type="number"], input[type="password"], textarea, select {
  background-color: rgba(255,255,255,.06) !important;
  border-color: rgba(255,255,255,.14) !important;
  color: var(--ivory) !important;
}
.form-control:focus, .form-select:focus, input:focus, textarea:focus, select:focus {
  background-color: rgba(255,255,255,.1) !important;
  border-color: rgba(255,255,255,.38) !important;
  color: #fff !important;
  box-shadow: 0 0 0 3px rgba(255,255,255,.1) !important;
}
input::placeholder, textarea::placeholder { color: rgba(255,255,255,.22) !important; }

/* Force white text on all dark backgrounds */
.content-wrapper, .form-page-wrap, .modal-body, .modal-footer,
.card-body, .card, section.content { color: var(--ivory) !important; }

/* Bootstrap card → dark */
.card { background-color: #1C1916 !important; border-color: rgba(255,255,255,.08) !important; }
.card-body { color: var(--ivory) !important; background: transparent !important; }
.card-header { background: #141210 !important; color: var(--ivory) !important; border-color: rgba(255,255,255,.08) !important; }
.card-footer { background: #141210 !important; color: var(--silver) !important; border-color: rgba(255,255,255,.07) !important; }

/* Bootstrap bg-light, bg-white → dark */
.bg-light { background-color: #252220 !important; color: var(--ivory) !important; }
.bg-white { background-color: #1C1916 !important; color: var(--ivory) !important; }

/* Bootstrap text utilities */
.text-muted { color: var(--silver-dim) !important; }
.text-dark { color: var(--ivory) !important; }
.text-body { color: var(--ivory) !important; }

/* Admin-LTE content area */
.content { background: transparent !important; }
.content-header { background: transparent !important; }

/* Dropdown select options — browsers render natively but set dark bg */
select option { background-color: #1C1916 !important; color: var(--ivory) !important; }
select optgroup { background-color: #141210 !important; color: var(--silver) !important; }

/* Modal overrides */
.modal-content { background-color: #1C1916 !important; color: var(--ivory) !important; }
.modal-body { background: transparent !important; color: var(--ivory) !important; }
.modal-header { background: #141210 !important; border-color: rgba(255,255,255,.1) !important; }
.modal-title { color: var(--ivory) !important; }
.modal-footer { background: #141210 !important; border-color: rgba(255,255,255,.07) !important; }

/* Table complete override */
.table { color: var(--ivory) !important; --bs-table-bg: transparent; --bs-table-color: var(--ivory); }
.table > :not(caption) > * > * { color: var(--ivory) !important; background-color: transparent !important; }
.table thead > tr > th, .table thead > tr > td { background-color: #141210 !important; color: var(--silver-bright) !important; }
.table-hover > tbody > tr:hover > * { background-color: rgba(255,255,255,.05) !important; color: var(--ivory) !important; }
.table-bordered > :not(caption) > * { border-color: rgba(255,255,255,.08) !important; }
.table > :not(caption) > * { border-color: rgba(255,255,255,.06) !important; }

/* DataTables wrapper */
.dataTables_wrapper { color: var(--ivory) !important; background: transparent !important; }
.dataTables_wrapper .row { --bs-gutter-x: 1.5rem; }

/* Badge fixes */
.badge.bg-warning, .badge.bg-warning.text-dark {
  background: rgba(234,179,8,.2) !important;
  color: #fde047 !important;
  border: 1px solid rgba(234,179,8,.3) !important;
}
.badge.bg-secondary { background: rgba(255,255,255,.12) !important; color: var(--silver-bright) !important; }
.badge.bg-success { background: rgba(34,197,94,.2) !important; color: #86efac !important; border: 1px solid rgba(34,197,94,.3) !important; }
.badge.bg-info { background: rgba(59,130,246,.2) !important; color: #93c5fd !important; }
.badge.bg-danger { background: rgba(239,68,68,.15) !important; color: #fca5a5 !important; }

/* Alert overrides */
.alert { border-radius: 10px !important; }
.alert-success { background: rgba(34,197,94,.1) !important; border-color: rgba(34,197,94,.25) !important; color: #86efac !important; }
.alert-danger { background: rgba(239,68,68,.1) !important; border-color: rgba(239,68,68,.25) !important; color: #fca5a5 !important; }
.alert-warning { background: rgba(234,179,8,.1) !important; border-color: rgba(234,179,8,.2) !important; color: #fde047 !important; }
.alert-info { background: rgba(59,130,246,.1) !important; border-color: rgba(59,130,246,.2) !important; color: #93c5fd !important; }

/* Close buttons on dark modals */
.btn-close-white { filter: invert(1) grayscale(100%) brightness(200%); }
.btn-close { filter: invert(1) brightness(1.5); }

/* Pagination */
.page-link { background-color: rgba(255,255,255,.06) !important; border-color: rgba(255,255,255,.12) !important; color: var(--silver-bright) !important; }
.page-link:hover { background-color: rgba(255,255,255,.12) !important; color: var(--white) !important; }
.page-item.active .page-link { background-color: rgba(255,255,255,.2) !important; border-color: rgba(255,255,255,.3) !important; color: var(--white) !important; }
.page-item.disabled .page-link { background-color: rgba(255,255,255,.03) !important; color: var(--silver-deep) !important; }

/* Progress bars */
.progress { background-color: rgba(255,255,255,.1) !important; }
.progress-bar { background-color: var(--silver-bright) !important; color: var(--black-deepest) !important; }

/* AdminLTE small-box */
.small-box { background-color: #1C1916 !important; }
.small-box h3, .small-box p { color: var(--white) !important; }

/* Input groups */
.input-group-text { background-color: rgba(255,255,255,.08) !important; border-color: rgba(255,255,255,.14) !important; color: var(--silver-bright) !important; }

/* Form check / switch */
.form-check-label { color: var(--ivory) !important; }
.form-switch .form-check-input { background-color: rgba(255,255,255,.15); border-color: rgba(255,255,255,.2); }
.form-switch .form-check-input:checked { background-color: var(--white) !important; border-color: var(--white) !important; }

/* Fieldset / legend */
fieldset { border-color: rgba(255,255,255,.1) !important; }
legend { color: var(--ivory) !important; }

/* HR */
hr { border-color: rgba(255,255,255,.1) !important; opacity: 1 !important; }

/* Small / strong text */
small, .small { color: var(--silver) !important; }
strong { color: var(--ivory); }

/* AdminLTE info-box */
.info-box { background: #1C1916 !important; color: var(--ivory) !important; }
.info-box-content { color: var(--ivory) !important; }
.info-box-text, .info-box-number { color: var(--ivory) !important; }

/* Content wrapper heading strip */
.content-header h1 { color: var(--ivory) !important; }
.content-header .breadcrumb-item, .breadcrumb-item a { color: var(--silver) !important; }
.breadcrumb-item.active { color: var(--silver-bright) !important; }


/* ════════════════════════════════════════════════════════════
   LIGHT MODE — [data-theme="light"]
   Warm ivory + charcoal — premium stationery feel
   ════════════════════════════════════════════════════════════ */

[data-theme="light"] {
  --black-deepest:  #F5F3EE;
  --black-deep:     #EBE7DF;
  --black-dark:     #FFFFFF;
  --black:          #F0EDE6;
  --black-mid:      #E8E4DC;
  --black-light:    #D8D4CC;

  --white:          #1C1916;
  --ivory:          #252220;
  --ivory-dim:      #3D3A35;
  --silver-bright:  #4A4740;
  --silver:         #706C64;
  --silver-dim:     #9A9690;
  --silver-deep:    #C0BDB6;

  --shadow-card:    0 4px 24px rgba(0,0,0,.1);
  --shadow-lg:      0 12px 48px rgba(0,0,0,.16);
}

/* ── Page & body ── */
[data-theme="light"] body {
  background: #EBE7DF;
  color: #252220;
}

[data-theme="light"] .content-wrapper {
  background: #EBE7DF !important;
}

/* ── Navbar ── */
[data-theme="light"] .main-header.navbar {
  background: linear-gradient(135deg, #1C1916 0%, #2F2C28 100%) !important;
  border-bottom: 2px solid rgba(255,255,255,.15);
}
/* keep navbar text white even in light mode — dark bar */
[data-theme="light"] .main-header .nav-link { color: rgba(255,255,255,.75) !important; }
[data-theme="light"] .navbar-brand-text { color: rgba(255,255,255,.9) !important; }

/* ── Sidebar — stays dark in both modes (intentional, like VS Code) ── */
[data-theme="light"] .main-sidebar { background: #1C1916 !important; }
[data-theme="light"] .brand-link { background: linear-gradient(135deg, #141210, #252220) !important; }
[data-theme="light"] .nav-sidebar .nav-link { color: rgba(255,255,255,.55) !important; }
[data-theme="light"] .nav-sidebar .nav-link:hover { background: rgba(255,255,255,.08) !important; color: rgba(255,255,255,.9) !important; }
[data-theme="light"] .nav-sidebar .nav-link.active { background: rgba(255,255,255,.12) !important; color: #fff !important; border-left-color: #fff !important; }
[data-theme="light"] .sidebar-label { color: rgba(255,255,255,.25); }
[data-theme="light"] .sidebar-divider { background: rgba(255,255,255,.08); }
[data-theme="light"] .brand-text { color: rgba(255,255,255,.9) !important; }
[data-theme="light"] .brand-text small { color: rgba(255,255,255,.35) !important; }

/* ── Cards ── */
[data-theme="light"] .card {
  background: #FFFFFF !important;
  border: 1px solid rgba(0,0,0,.08) !important;
  box-shadow: 0 2px 16px rgba(0,0,0,.08) !important;
}
[data-theme="light"] .card-header {
  background: linear-gradient(135deg, #F5F3EE, #EBE7DF) !important;
  color: #1C1916 !important;
  border-bottom: 1px solid rgba(0,0,0,.08) !important;
}
[data-theme="light"] .card-body { color: #252220 !important; }
[data-theme="light"] .card-footer { background: #F5F3EE !important; color: #706C64 !important; border-top: 1px solid rgba(0,0,0,.06) !important; }

/* ── Page hero banners ── */
[data-theme="light"] .seating-hero,
[data-theme="light"] .form-hero,
[data-theme="light"] .page-hero,
[data-theme="light"] .checkin-hero,
[data-theme="light"] .dash-hero {
  background: linear-gradient(135deg, #1C1916 0%, #2F2C28 60%, #3D3A35 100%);
  background-image: linear-gradient(135deg, #1C1916 0%, #2F2C28 60%, #3D3A35 100%),
    repeating-linear-gradient(-55deg, transparent 0, transparent 28px, rgba(255,255,255,.03) 28px, rgba(255,255,255,.03) 30px);
}
[data-theme="light"] .seating-hero h1,
[data-theme="light"] .form-hero h1,
[data-theme="light"] .page-hero h1,
[data-theme="light"] .dash-hero-text h1 { color: #FFFFFF !important; }
[data-theme="light"] .seating-hero h1 em,
[data-theme="light"] .form-hero h1 em,
[data-theme="light"] .page-hero h1 em,
[data-theme="light"] .dash-hero-text h1 em { color: #D4D0C8 !important; }
[data-theme="light"] .hero-eyebrow { color: rgba(255,255,255,.5) !important; }
[data-theme="light"] .hero-sub { color: rgba(255,255,255,.4) !important; }
[data-theme="light"] .form-hero p,
[data-theme="light"] .dash-hero-text p { color: rgba(255,255,255,.45) !important; }

/* ── Tables ── */
[data-theme="light"] .table { color: #252220 !important; --bs-table-color: #252220; }
[data-theme="light"] .table > :not(caption) > * > * { color: #252220 !important; background-color: transparent !important; }
[data-theme="light"] .table thead > tr > th {
  background: linear-gradient(135deg, #252220, #3D3A35) !important;
  color: rgba(255,255,255,.8) !important;
  border-color: rgba(0,0,0,.1) !important;
}
[data-theme="light"] .table tbody tr { border-color: rgba(0,0,0,.06) !important; }
[data-theme="light"] .table tbody td { color: #252220 !important; border-color: rgba(0,0,0,.05) !important; }
[data-theme="light"] .table-hover > tbody > tr:hover > * { background-color: rgba(0,0,0,.03) !important; }
[data-theme="light"] .table-bordered > :not(caption) > * { border-color: rgba(0,0,0,.08) !important; }

/* ── Forms ── */
[data-theme="light"] .form-control,
[data-theme="light"] .form-select,
[data-theme="light"] input[type="text"],
[data-theme="light"] input[type="email"],
[data-theme="light"] input[type="number"],
[data-theme="light"] textarea,
[data-theme="light"] select {
  background-color: #FFFFFF !important;
  border-color: rgba(0,0,0,.15) !important;
  color: #1C1916 !important;
}
[data-theme="light"] .form-control:focus,
[data-theme="light"] .form-select:focus,
[data-theme="light"] input:focus,
[data-theme="light"] textarea:focus,
[data-theme="light"] select:focus {
  background-color: #FFFFFF !important;
  border-color: rgba(0,0,0,.4) !important;
  color: #1C1916 !important;
  box-shadow: 0 0 0 3px rgba(0,0,0,.08) !important;
}
[data-theme="light"] input::placeholder,
[data-theme="light"] textarea::placeholder { color: rgba(0,0,0,.28) !important; }
[data-theme="light"] select option { background-color: #FFFFFF !important; color: #1C1916 !important; }
[data-theme="light"] select optgroup { background-color: #F5F3EE !important; color: #706C64 !important; }
[data-theme="light"] .form-label { color: #706C64 !important; }
[data-theme="light"] .form-check-label { color: #252220 !important; }

/* ── Fancy form inputs ── */
[data-theme="light"] .form-page-wrap { background: #EBE7DF !important; }
[data-theme="light"] .form-card { background: #FFFFFF !important; border-color: rgba(0,0,0,.08) !important; color: #252220 !important; }
[data-theme="light"] .form-section-block { border-bottom-color: rgba(0,0,0,.06) !important; }
[data-theme="light"] .section-icon { background: linear-gradient(135deg, #1C1916, #3D3A35) !important; border-color: rgba(0,0,0,.15) !important; }
[data-theme="light"] .section-title-text { color: #1C1916 !important; }
[data-theme="light"] .section-subtitle { color: #9A9690 !important; }
[data-theme="light"] .fancy-label { color: #706C64 !important; }
[data-theme="light"] .fancy-input-icon { color: #9A9690 !important; }
[data-theme="light"] .fancy-input {
  background: #F5F3EE !important;
  border-color: rgba(0,0,0,.12) !important;
  color: #1C1916 !important;
}
[data-theme="light"] .fancy-input:focus {
  background: #FFFFFF !important;
  border-color: rgba(0,0,0,.4) !important;
  box-shadow: 0 0 0 4px rgba(0,0,0,.07) !important;
}
[data-theme="light"] .name-preview { background: linear-gradient(135deg,#1C1916,#3D3A35) !important; border-color: rgba(0,0,0,.2) !important; color:#fff !important; }
[data-theme="light"] .form-submit-bar { background: #F5F3EE !important; border-top-color: rgba(0,0,0,.07) !important; }
[data-theme="light"] .btn-save-big { background: linear-gradient(135deg,#1C1916,#3D3A35) !important; border-color: rgba(0,0,0,.2) !important; color: #fff !important; }
[data-theme="light"] .btn-save-big:hover { box-shadow: 0 10px 30px rgba(0,0,0,.25) !important; }
[data-theme="light"] .btn-cancel-link { color: #9A9690 !important; }
[data-theme="light"] .btn-cancel-link:hover { color: #1C1916 !important; }

/* ── Table / sponsor card grids ── */
[data-theme="light"] .table-card-opt,
[data-theme="light"] .sponsor-card,
[data-theme="light"] .unassigned-opt {
  background: #F5F3EE !important;
  border-color: rgba(0,0,0,.1) !important;
}
[data-theme="light"] .table-card-opt:hover,
[data-theme="light"] .sponsor-card:hover,
[data-theme="light"] .unassigned-opt:hover {
  background: #FFFFFF !important;
  border-color: rgba(0,0,0,.25) !important;
}
[data-theme="light"] .table-card-opt.selected,
[data-theme="light"] .sponsor-card.selected,
[data-theme="light"] .unassigned-opt.selected {
  background: #1C1916 !important;
  border-color: #1C1916 !important;
  box-shadow: 0 4px 16px rgba(0,0,0,.2) !important;
}
[data-theme="light"] .table-card-num { color: #1C1916 !important; }
[data-theme="light"] .table-card-opt.selected .table-card-num { color: #FFFFFF !important; }
[data-theme="light"] .table-card-name { color: #9A9690 !important; }
[data-theme="light"] .table-card-opt.selected .table-card-name { color: rgba(255,255,255,.65) !important; }
[data-theme="light"] .sponsor-card-label { color: #1C1916 !important; }
[data-theme="light"] .sponsor-card.selected .sponsor-card-label { color: #FFFFFF !important; }
[data-theme="light"] .unassigned-text-main { color: #1C1916 !important; }
[data-theme="light"] .unassigned-text-sub { color: #9A9690 !important; }
[data-theme="light"] .unassigned-opt.selected .unassigned-text-main,
[data-theme="light"] .unassigned-opt.selected .unassigned-text-sub { color: rgba(255,255,255,.75) !important; }

/* ── Toggle rows ── */
[data-theme="light"] .toggle-row { background: #F5F3EE !important; border-color: rgba(0,0,0,.1) !important; }
[data-theme="light"] .toggle-row:hover { background: #FFFFFF !important; border-color: rgba(0,0,0,.22) !important; }
[data-theme="light"] .toggle-row.active-row { background: #F0EDE6 !important; border-color: #1C1916 !important; }
[data-theme="light"] .toggle-label-main { color: #1C1916 !important; }
[data-theme="light"] .toggle-label-sub { color: #9A9690 !important; }

/* ── Stepper ── */
[data-theme="light"] .stepper { border-color: rgba(0,0,0,.12) !important; background: #F5F3EE !important; }
[data-theme="light"] .stepper-btn { color: #1C1916 !important; }
[data-theme="light"] .stepper-btn:hover { background: rgba(0,0,0,.06) !important; }
[data-theme="light"] .stepper-val { color: #1C1916 !important; }

/* ── Table number preview ── */
[data-theme="light"] .table-no-preview { background: linear-gradient(135deg,#1C1916,#3D3A35) !important; border-color: rgba(0,0,0,.15) !important; }

/* ── Dashboard stats ── */
[data-theme="light"] .stat-card-inner { background: #FFFFFF !important; border-color: rgba(0,0,0,.08) !important; }
[data-theme="light"] .stat-number { color: #1C1916 !important; text-shadow: none !important; }
[data-theme="light"] .stat-eyebrow { color: #9A9690 !important; }
[data-theme="light"] .stat-label { color: #9A9690 !important; }
[data-theme="light"] .stat-footer { border-top-color: rgba(0,0,0,.07) !important; color: #9A9690 !important; }
[data-theme="light"] .stat-footer a { color: #706C64 !important; }
[data-theme="light"] .stat-footer a:hover { color: #1C1916 !important; }
[data-theme="light"] .stat-card-icon { color: #1C1916 !important; opacity: .05 !important; }
[data-theme="light"] .progress-section { background: #FFFFFF !important; border-color: rgba(0,0,0,.08) !important; color: #252220 !important; }
[data-theme="light"] .progress-track { background: rgba(0,0,0,.08) !important; }
[data-theme="light"] .progress-fill { background: linear-gradient(90deg,#3D3A35,#1C1916) !important; }
[data-theme="light"] .progress-pct { color: #1C1916 !important; }
[data-theme="light"] .quick-link { background: #FFFFFF !important; border-color: rgba(0,0,0,.08) !important; color: #706C64 !important; }
[data-theme="light"] .quick-link:hover { background: #F5F3EE !important; border-color: rgba(0,0,0,.2) !important; color: #1C1916 !important; }
[data-theme="light"] .quick-link i { color: #9A9690 !important; }
[data-theme="light"] .quick-link:hover i { color: #1C1916 !important; }

/* ── Check-in page ── */
[data-theme="light"] .search-section { background: #FFFFFF !important; border-color: rgba(0,0,0,.08) !important; color: #252220 !important; }
[data-theme="light"] #searchInput { background: #F5F3EE !important; border-color: rgba(0,0,0,.15) !important; color: #1C1916 !important; }
[data-theme="light"] #searchInput:focus { border-color: rgba(0,0,0,.4) !important; background: #FFFFFF !important; box-shadow: 0 0 0 4px rgba(0,0,0,.07) !important; }
[data-theme="light"] #searchInput::placeholder { color: rgba(0,0,0,.28) !important; }
[data-theme="light"] .guest-card { background: #FFFFFF !important; border-color: rgba(0,0,0,.08) !important; }
[data-theme="light"] .guest-card:hover { background: #F5F3EE !important; border-color: rgba(0,0,0,.18) !important; }
[data-theme="light"] .guest-card .guest-name-text,
[data-theme="light"] .guest-card-name { color: #1C1916 !important; }
[data-theme="light"] .btn-checkin { background: #1C1916 !important; color: #FFFFFF !important; }
[data-theme="light"] .btn-checkin:hover { background: #3D3A35 !important; box-shadow: 0 4px 16px rgba(0,0,0,.2) !important; }
[data-theme="light"] .qr-panel {
  background: #1C1916 !important;
  border-color: rgba(255,255,255,.12) !important;
}
[data-theme="light"] .qr-code-wrap { background: #FFFFFF !important; }

/* ── Seating chart ── */
[data-theme="light"] .guest-drawer { background: linear-gradient(180deg,#1C1916,#252220) !important; }
[data-theme="light"] .ballroom-controls { background: #FFFFFF !important; border-bottom-color: rgba(0,0,0,.12) !important; box-shadow: 0 2px 12px rgba(0,0,0,.08) !important; }
[data-theme="light"] .ctrl-label { color: #706C64 !important; }
[data-theme="light"] .table-select-styled { background-color: #F5F3EE !important; border-color: rgba(0,0,0,.15) !important; color: #1C1916 !important; }
[data-theme="light"] .ballroom-floor { background: #0C0B09 !important; }  /* floor stays dark — it's a ballroom */

/* ── Modals ── */
[data-theme="light"] .modal-content { background: #FFFFFF !important; color: #252220 !important; border-color: rgba(0,0,0,.1) !important; }
[data-theme="light"] .modal-header { background: linear-gradient(135deg,#1C1916,#3D3A35) !important; border-color: rgba(0,0,0,.1) !important; }
[data-theme="light"] .modal-body { color: #252220 !important; }
[data-theme="light"] .modal-body p { color: #252220 !important; }
[data-theme="light"] .modal-footer { background: #F5F3EE !important; border-color: rgba(0,0,0,.07) !important; }

/* ── Text / misc ── */
[data-theme="light"] .text-muted { color: #9A9690 !important; }
[data-theme="light"] .bg-light { background-color: #F5F3EE !important; color: #1C1916 !important; }
[data-theme="light"] .bg-white { background-color: #FFFFFF !important; color: #1C1916 !important; }
[data-theme="light"] hr { border-color: rgba(0,0,0,.1) !important; }
[data-theme="light"] small, [data-theme="light"] .small { color: #9A9690 !important; }
[data-theme="light"] .content-header h1 { color: #1C1916 !important; }
[data-theme="light"] .input-group-text { background-color: #EBE7DF !important; border-color: rgba(0,0,0,.12) !important; color: #706C64 !important; }
[data-theme="light"] ::-webkit-scrollbar-track { background: #EBE7DF; }
[data-theme="light"] ::-webkit-scrollbar-thumb { background: rgba(0,0,0,.2); }

/* ── Buttons (light) ── */
[data-theme="light"] .btn-primary { background: linear-gradient(135deg,#1C1916,#3D3A35) !important; border-color: rgba(0,0,0,.2) !important; color: #fff !important; }
[data-theme="light"] .btn-secondary { background: rgba(0,0,0,.07) !important; border-color: rgba(0,0,0,.15) !important; color: #252220 !important; }
[data-theme="light"] .btn-tsu-gold { background: #1C1916 !important; color: #fff !important; }
[data-theme="light"] .btn-tsu-gold:hover { background: #3D3A35 !important; color: #fff !important; }

/* ── DataTables (light) ── */
[data-theme="light"] .dataTables_wrapper { color: #252220 !important; }
[data-theme="light"] .dataTables_wrapper .dataTables_filter input,
[data-theme="light"] .dataTables_wrapper .dataTables_length select { background: #FFFFFF !important; border-color: rgba(0,0,0,.15) !important; color: #1C1916 !important; }
[data-theme="light"] .dataTables_wrapper .dataTables_info,
[data-theme="light"] .dataTables_wrapper .dataTables_filter label,
[data-theme="light"] .dataTables_wrapper .dataTables_length label { color: #706C64 !important; }
[data-theme="light"] .dataTables_paginate .paginate_button { background: #F5F3EE !important; border-color: rgba(0,0,0,.12) !important; color: #252220 !important; }
[data-theme="light"] .dataTables_paginate .paginate_button.current { background: #1C1916 !important; border-color: #1C1916 !important; color: #fff !important; }
[data-theme="light"] .dataTables_paginate .paginate_button:hover { background: #EBE7DF !important; color: #1C1916 !important; }

/* ── Page hero text label overrides (light mode hero is dark bg, so stays light text) ── */
[data-theme="light"] .hero-eyebrow,
[data-theme="light"] .form-hero-eyebrow { color: rgba(255,255,255,.5) !important; }

/* ── Mobile bottom nav ── */
[data-theme="light"] .mobile-bottom-nav { background: linear-gradient(135deg,#1C1916,#252220) !important; border-top-color: rgba(255,255,255,.08) !important; }

/* ── Theme toggle button ── */
.theme-toggle-btn {
  background: rgba(255,255,255,.1);
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 50px;
  padding: 5px 12px;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 7px;
  font-family: 'Jost', sans-serif;
  font-size: .72rem;
  font-weight: 600;
  color: rgba(255,255,255,.7);
  transition: all .22s;
  white-space: nowrap;
}
.theme-toggle-btn:hover {
  background: rgba(255,255,255,.18);
  color: #fff;
  border-color: rgba(255,255,255,.35);
}
.theme-toggle-btn .icon-dark,
.theme-toggle-btn .icon-light { transition: opacity .2s; }

/* In dark mode: show moon, hide sun */
.theme-toggle-btn .icon-dark  { display: inline; }
.theme-toggle-btn .icon-light { display: none; }

/* In light mode: show sun, hide moon */
[data-theme="light"] .theme-toggle-btn .icon-dark  { display: none; }
[data-theme="light"] .theme-toggle-btn .icon-light { display: inline; }

[data-theme="light"] .theme-toggle-btn {
  background: rgba(0,0,0,.08);
  border-color: rgba(255,255,255,.3);
  color: rgba(255,255,255,.85);
}
[data-theme="light"] .theme-toggle-btn:hover {
  background: rgba(0,0,0,.18);
  color: #fff;
}
