/* ═══════════════════════════════════════════════════════════════
   B&B THEATRES — JEWEL TONE ART DECO DESIGN SYSTEM v3.0
   Single source of truth. ALL colors via CSS variables.
   Light mode = default render. Dark mode = variable swap.
   ═══════════════════════════════════════════════════════════════ */
@import url('https://fonts.googleapis.com/css2?family=Cinzel+Decorative:wght@400;700;900&family=Playfair+Display:ital,wght@0,400;0,500;0,600;0,700;0,800;0,900;1,400;1,500;1,600;1,700;1,800;1,900&family=Proza+Libre:ital,wght@0,400;0,500;0,600;0,700;1,400&family=Karla:wght@400;500;600;700&display=swap');

:root {
  /* ── Backgrounds ── */
  --bb-bg: #F5F2EB;
  --bb-card: #FFFFFF;
  --bb-surface: #FFFFFF;
  --bb-input: #F5F2EB;
  --bb-hover: #EDE9E0;

  /* ── Borders ── */
  --bb-border: #D9D3C7;
  --bb-border-strong: #C4BCAE;

  /* ── Text hierarchy (strengthened for readability) ── */
  --bb-text: #111111;
  --bb-text-body: #2A2420;
  --bb-text-secondary: #5C5248;
  --bb-text-dim: #8A7E72;

  /* ── Accent constants ── */
  --bb-teal: #2EC4B6;
  --bb-gold: #D4A841;
  --bb-magenta: #CC4574;
  --bb-purple: #8B5CF6;
  --bb-cyan: #00BBDF;
  --bb-pink: #FF7EB8;

  /* ── Semantic light backgrounds (stronger for visibility) ── */
  --bb-teal-light: #C5F0EA;
  --bb-gold-light: #FFEFC0;
  --bb-magenta-light: #FBDAE6;
  --bb-purple-light: #E2DAFD;
  --bb-cyan-light: #C8F4FA;
  --bb-gold-border: #D4A841;

  /* ── Shadows ── */
  --bb-shadow: 0 1px 3px rgba(30,22,16,.06),0 4px 12px rgba(30,22,16,.04);
  --bb-shadow-lg: 0 8px 40px rgba(30,22,16,.12);

  /* ── Fonts (Playfair Display = readable elegance) ── */
  --bb-font-display: 'Playfair Display', serif;
  --bb-font-accent: 'Playfair Display', serif;
  --bb-font-body: 'Proza Libre', sans-serif;
  --bb-font-ui: 'Karla', sans-serif;
  --bb-font-logo: 'Cinzel Decorative', serif;

  /* ── Radii ── */
  --bb-radius-sm: 6px;
  --bb-radius: 10px;
  --bb-radius-lg: 14px;

  /* ── Header (always dark) ── */
  --bb-header-bg: linear-gradient(135deg, #0B1026, #1A1240, #0B1026);
  --bb-header-text: #F0EBE4;

  /* ── Stat card assignments (light) ── */
  --bb-stat-teal-bg: linear-gradient(135deg,#C5F0EA,#A5E8DD);
  --bb-stat-teal-num: #084D3C;
  --bb-stat-teal-lbl: #0A6652;
  --bb-stat-teal-bdr: #2EC4B6;

  --bb-stat-gold-bg: linear-gradient(135deg,#FFEFC0,#FFE29A);
  --bb-stat-gold-num: #5A4200;
  --bb-stat-gold-lbl: #7A5A00;
  --bb-stat-gold-bdr: #D4A841;

  --bb-stat-mag-bg: linear-gradient(135deg,#FBDAE6,#F8C4D6);
  --bb-stat-mag-num: #6B1845;
  --bb-stat-mag-lbl: #8A2358;
  --bb-stat-mag-bdr: #CC4574;

  --bb-stat-purple-bg: linear-gradient(135deg,#E2DAFD,#D4C8FD);
  --bb-stat-purple-num: #2E1570;
  --bb-stat-purple-lbl: #432196;
  --bb-stat-purple-bdr: #8B5CF6;

  --bb-stat-cyan-bg: linear-gradient(135deg,#C8F4FA,#A5ECFA);
  --bb-stat-cyan-num: #003D4D;
  --bb-stat-cyan-lbl: #005870;
  --bb-stat-cyan-bdr: #00BBDF;

  /* ── Semantic sections ── */
  --bb-success-bg: #C5F0EA; --bb-success-border: #2EC4B6; --bb-success-text: #084D3C;
  --bb-warning-bg: #FFEFC0; --bb-warning-border: #D4A841; --bb-warning-text: #5A4200;
  --bb-danger-bg: #FBDAE6; --bb-danger-border: #CC4574; --bb-danger-text: #6B1845;

  --bb-notes-bg: #EDE9E0; --bb-notes-border: #C4BCAE;
  --bb-corpq-bg: #FFEFC0; --bb-corpq-border: #D4A841;
  --bb-staffnote-bg: #C8F4FA; --bb-staffnote-border: #00BBDF;
  --bb-hostsec-bg: #C5F0EA; --bb-hostsec-border: #2EC4B6;
  --bb-setup-bg: #C5F0EA; --bb-setup-border: #2EC4B6; --bb-setup-text: #084D3C;
  --bb-today-bg: #FFEFC0; --bb-today-border: #D4A841;
  --bb-closeout-bg: #FFEFC0; --bb-closeout-border: #D4A841; --bb-closeout-text: #5A4200;
  --bb-pending-bg: #FFEFC0; --bb-pending-border: #D4A841; --bb-pending-text: #5A4200;
  --bb-cell-dim: #EDE9E0;
}

[data-theme="dark"] {
  --bb-bg: #0B1026;
  --bb-card: #151D38;
  --bb-surface: #111938;
  --bb-input: #0B1026;
  --bb-hover: #1A2245;

  --bb-border: #1E2A52;
  --bb-border-strong: #2A3562;

  --bb-text: #F0EBE4;
  --bb-text-body: #C0C8E0;
  --bb-text-secondary: #8A9BC0;
  --bb-text-dim: #5B6A90;

  --bb-shadow: 0 2px 12px rgba(0,0,0,.4);
  --bb-shadow-lg: 0 8px 40px rgba(0,0,0,.5);

  --bb-teal-light: #0A2E2A;
  --bb-gold-light: #2A2008;
  --bb-magenta-light: #3D1028;
  --bb-purple-light: #1C1040;
  --bb-cyan-light: #043842;
  --bb-gold-border: #8A7432;

  --bb-stat-teal-bg: linear-gradient(135deg,#0D5E56,#0A4A44);
  --bb-stat-teal-num: #5EEEDE;
  --bb-stat-teal-lbl: #7FF4E8;
  --bb-stat-teal-bdr: #1A8A7E;

  --bb-stat-gold-bg: linear-gradient(135deg,#5A4210,#3D2D08);
  --bb-stat-gold-num: #F0D06A;
  --bb-stat-gold-lbl: #E8C84A;
  --bb-stat-gold-bdr: #8A7432;

  --bb-stat-mag-bg: linear-gradient(135deg,#6B1845,#4A1030);
  --bb-stat-mag-num: #FF7EB8;
  --bb-stat-mag-lbl: #FFB0D6;
  --bb-stat-mag-bdr: #993556;

  --bb-stat-purple-bg: linear-gradient(135deg,#2A1860,#1C1040);
  --bb-stat-purple-num: #B89AFF;
  --bb-stat-purple-lbl: #D4C0FF;
  --bb-stat-purple-bdr: #6D3FD4;

  --bb-stat-cyan-bg: linear-gradient(135deg,#043842,#062830);
  --bb-stat-cyan-num: #5CE8FF;
  --bb-stat-cyan-lbl: #9AF0FF;
  --bb-stat-cyan-bdr: #00829E;

  --bb-success-bg: #0A2E2A; --bb-success-border: #1A8A7E; --bb-success-text: #5EEEDE;
  --bb-warning-bg: #2A2008; --bb-warning-border: #8A7432; --bb-warning-text: #F0D06A;
  --bb-danger-bg: #3D1028; --bb-danger-border: #993556; --bb-danger-text: #FF7EB8;

  --bb-notes-bg: #0E1530; --bb-notes-border: #1E2A52;
  --bb-corpq-bg: #2A2008; --bb-corpq-border: #8A7432;
  --bb-staffnote-bg: #043842; --bb-staffnote-border: #00829E;
  --bb-hostsec-bg: #0A2E2A; --bb-hostsec-border: #1A8A7E;
  --bb-setup-bg: #0A2E2A; --bb-setup-border: #1A8A7E; --bb-setup-text: #5EEEDE;
  --bb-today-bg: #2A2008; --bb-today-border: #8A7432;
  --bb-closeout-bg: #2A2008; --bb-closeout-border: #8A7432; --bb-closeout-text: #F0D06A;
  --bb-pending-bg: #2A2008; --bb-pending-border: #8A7432; --bb-pending-text: #F0D06A;
  --bb-cell-dim: #0E1530;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{overflow-x:hidden;scroll-behavior:smooth;}
body{font-family:var(--bb-font-ui);background:var(--bb-bg);color:var(--bb-text-body);font-size:13px;line-height:1.5;overflow-x:hidden;max-width:100vw;-webkit-font-smoothing:antialiased;}
::selection{background:var(--bb-teal);color:#fff;}
::-webkit-scrollbar{width:6px;height:6px;}
::-webkit-scrollbar-track{background:transparent;}
::-webkit-scrollbar-thumb{background:var(--bb-border-strong);border-radius:3px;}

@media print{
  body{background:#fff!important;color:#000!important;}
  .no-print{display:none!important;}
}
@media(max-width:768px){.desk-only{display:none!important;}}
/* ── Mobile Responsive Utilities ──────────────────────────────────────────── */
/* Global mobile defaults applied across all pages that reference brand.css.  */
/* Pages not yet linking brand.css: home.html, suggest.html,                  */
/* admin/ticket-analysis.html — add brand.css link during conversion pass.    */
body { padding-bottom: 56px !important; }

@media (max-width: 768px) {
  body  { font-size: 14px; }
  table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  input, select, textarea, button {
    font-size: 16px !important;  /* prevents iOS auto-zoom on focus */
    min-height: 44px;            /* minimum tap target size */
  }
  .stat-bar, .sbar, .stats-row, .stat-grid { gap: 8px !important; }
}

@media (max-width: 480px) {
  h1 { font-size: 20px !important; }
  h2 { font-size: 16px !important; }
  .wrap, .container, .main {
    padding-left:  12px !important;
    padding-right: 12px !important;
  }
}