/* ============================================================
   INDUSTRY STANDARD — Jefferson County Menu Analysis
   Dashboard Stylesheet
   ============================================================ */

/* === GOOGLE FONTS === */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&family=Space+Grotesk:wght@400;500;600;700&display=swap');

/* === RESET === */
*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html { scroll-behavior: smooth; font-size: 16px; }

/* === DESIGN TOKENS (DARK MODE DEFAULT) === */
:root {
  --bg-body:        #0a0a0a;
  --bg-surface:     #171717;
  --bg-card:        #171717;
  --bg-card-hover:  #1f1f1f;
  --bg-input:       #171717;
  --border:         #262626;
  --border-strong:  #404040;
  --border-accent:  rgba(185,28,28,0.28);

  --text-100: #f5f5f5;
  --text-200: #d4d4d4;
  --text-300: #a3a3a3;
  --text-400: #737373;

  --accent:         #b91c1c;
  --accent-hover:   #dc2626;
  --accent-dim:     rgba(185,28,28,0.15);
  --accent-glow:    0 0 24px rgba(185,28,28,0.28);

  --green:          #10b981;
  --green-dim:      rgba(16,185,129,0.12);
  --green-border:   rgba(16,185,129,0.3);

  --red:            #ef4444;
  --red-dim:        rgba(239,68,68,0.12);
  --red-border:     rgba(239,68,68,0.3);

  --amber:          #f59e0b;
  --amber-dim:      rgba(245,158,11,0.12);
  --amber-border:   rgba(245,158,11,0.3);

  --cyan:           #06b6d4;
  --cyan-dim:       rgba(6,182,212,0.12);

  --purple:         #a78bfa;
  --purple-dim:     rgba(167,139,250,0.12);

  --sidebar-w:      268px;
  --header-h:       64px;
  --tab-bar-h:      50px;
  --radius-s:       6px;
  --radius-m:       10px;
  --radius-l:       16px;
  --radius-xl:      22px;

  --shadow-s:       0 1px 4px rgba(0,0,0,0.35);
  --shadow-m:       0 4px 20px rgba(0,0,0,0.5);
  --shadow-l:       0 12px 48px rgba(0,0,0,0.65);

  --ease:           cubic-bezier(0.4,0,0.2,1);
  --t-fast:         0.15s;
  --t-med:          0.25s;
  --t-slow:         0.4s;

  /* ── Legacy variable aliases — component CSS uses these names ── */
  --card-bg:        var(--bg-card);
  --bg-alt:         var(--bg-card-hover);
  --bg-1:           var(--bg-surface);
  --bg-2:           var(--bg-card);
  --bg-3:           var(--bg-card-hover);
  --text:           var(--text-100);
  --text-muted:     var(--text-300);
  --text-secondary: var(--text-300);
  --text-500:       var(--text-200);
  --success:        var(--green);
  --radius:         var(--radius-m);
}

/* === LIGHT MODE — clean slate/white palette === */
[data-theme="light"] {
  /* NOTE: 2026-05-11 — site adopted a single dark crimson palette site-wide.
     The light theme variant now mirrors :root so toggling has no visual effect
     until/unless we add a separate light palette back. */
  --bg-body:        #0a0a0a;
  --bg-surface:     #171717;
  --bg-card:        #171717;
  --bg-card-hover:  #1f1f1f;
  --bg-input:       #171717;
  --border:         #262626;
  --border-strong:  #404040;
  --border-accent:  rgba(185,28,28,0.28);

  --text-100: #f5f5f5;
  --text-200: #d4d4d4;
  --text-300: #a3a3a3;
  --text-400: #737373;

  --accent:         #b91c1c;
  --accent-hover:   #dc2626;
  --accent-dim:     rgba(185,28,28,0.15);
  --accent-glow:    0 0 24px rgba(185,28,28,0.28);

  --green:          #10b981;
  --green-dim:      rgba(16,185,129,0.12);
  --green-border:   rgba(16,185,129,0.3);

  --red:            #ef4444;
  --red-dim:        rgba(239,68,68,0.12);
  --red-border:     rgba(239,68,68,0.3);

  --amber:          #f59e0b;
  --amber-dim:      rgba(245,158,11,0.12);
  --amber-border:   rgba(245,158,11,0.3);

  --cyan:           #06b6d4;
  --cyan-dim:       rgba(6,182,212,0.12);

  --purple:         #a78bfa;
  --purple-dim:     rgba(167,139,250,0.12);

  --shadow-s:       0 1px 4px rgba(0,0,0,0.35);
  --shadow-m:       0 4px 20px rgba(0,0,0,0.5);
  --shadow-l:       0 12px 48px rgba(0,0,0,0.65);
}

/* === SIDEBAR — dark surface, crimson active state (2026-05-11 palette) === */
.sidebar {
  background: #171717 !important;
  border-right-color: #262626 !important;
}
.sidebar .sidebar-header { border-bottom-color: #262626 !important; }
.sidebar .sidebar-logo-name { color: #f5f5f5 !important; }
.sidebar .sidebar-logo-sub  { color: #64748b !important; }
.sidebar .sidebar-logo-mark { box-shadow: 0 0 12px rgba(185,28,28,0.40) !important; }
.sidebar .nav-section-label { color: #a3a3a3 !important; }
.sidebar .nav-item           { color: #a3a3a3 !important; }
.sidebar .nav-item:hover     { background: rgba(255,255,255,0.05) !important; color: #f5f5f5 !important; }
.sidebar .nav-item.active    { background: rgba(185,28,28,0.20) !important; color: #fca5a5 !important; }
.sidebar .nav-item.active::before { background: #b91c1c !important; }
.sidebar .nav-badge          { background: rgba(255,255,255,0.09) !important; color: #94a3b8 !important; }
.sidebar .nav-badge.green    { background: rgba(22,163,74,0.18) !important; color: #4ade80 !important; }
.sidebar .nav-badge.red      { background: rgba(220,38,38,0.18) !important; color: #f87171 !important; }
.sidebar .nav-badge.amber    { background: rgba(217,119,6,0.18) !important; color: #fbbf24 !important; }
.sidebar .nav-badge.blue     { background: rgba(37,99,235,0.18) !important; color: #93c5fd !important; }
.sidebar .sidebar-footer     { border-top-color: rgba(255,255,255,0.07) !important; }
.sidebar .sidebar-meta       { color: #475569 !important; }
.sidebar .sidebar-meta strong{ color: #94a3b8 !important; }

/* === BODY === */
body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  background: var(--bg-body);
  color: var(--text-100);
  line-height: 1.6;
  min-height: 100vh;
  transition: background var(--t-med) var(--ease), color var(--t-med) var(--ease);
}

/* === CUSTOM SCROLLBAR === */
::-webkit-scrollbar { width: 5px; height: 5px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--text-400); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: var(--text-300); }

/* ============================================================
   LAYOUT
   ============================================================ */
.app {
  display: flex;
  min-height: 100vh;
}

/* ============================================================
   SIDEBAR
   ============================================================ */
.sidebar {
  position: fixed;
  top: 0; left: 0;
  width: var(--sidebar-w);
  height: 100vh;
  background: var(--bg-surface);
  border-right: 1px solid var(--border);
  display: flex;
  flex-direction: column;
  z-index: 900;
  transition: transform var(--t-slow) var(--ease), opacity var(--t-slow) var(--ease);
  overflow: hidden;
}

.sidebar.closed {
  transform: translateX(calc(-1 * var(--sidebar-w)));
}

/* Sidebar Header */
.sidebar-header {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 20px;
  height: var(--header-h);
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}

.sidebar-logo {
  display: flex;
  align-items: center;
  gap: 10px;
  flex: 1;
  min-width: 0;
}

.sidebar-logo-mark {
  width: 34px;
  height: 34px;
  background: linear-gradient(135deg, #b91c1c 0%, #dc2626 100%);
  border-radius: var(--radius-s);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-size: 16px;
  color: #fff;
  box-shadow: 0 0 16px rgba(185,28,28,0.40);
}

.sidebar-logo-text {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.sidebar-logo-name {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--text-100);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.sidebar-logo-sub {
  font-size: 10px;
  color: var(--text-400);
  letter-spacing: 0.03em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Nav */
.sidebar-nav {
  flex: 1;
  overflow-y: auto;
  padding: 12px 10px;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.nav-section-label {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--text-400);
  padding: 12px 10px 4px;
}

.nav-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 12px;
  border-radius: var(--radius-m);
  cursor: pointer;
  text-decoration: none;
  color: var(--text-300);
  font-size: 13.5px;
  font-weight: 500;
  transition: all var(--t-fast) var(--ease);
  position: relative;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.nav-item:hover {
  background: var(--accent-dim);
  color: var(--text-100);
}

.nav-item.active {
  background: var(--accent-dim);
  color: var(--accent);
  font-weight: 600;
}

.nav-item.active::before {
  content: '';
  position: absolute;
  left: 0; top: 20%; bottom: 20%;
  width: 3px;
  background: var(--accent);
  border-radius: 0 2px 2px 0;
}

.nav-item i {
  width: 16px;
  text-align: center;
  flex-shrink: 0;
  font-size: 13px;
  opacity: 0.85;
}

.nav-item.active i { opacity: 1; }

.nav-badge {
  margin-left: auto;
  background: var(--accent-dim);
  color: var(--accent);
  font-size: 10px;
  font-weight: 700;
  padding: 1px 6px;
  border-radius: 20px;
  flex-shrink: 0;
}

.nav-badge.green  { background: var(--green-dim);  color: var(--green); }
.nav-badge.red    { background: var(--red-dim);    color: var(--red); }
.nav-badge.amber  { background: var(--amber-dim);  color: var(--amber); }

/* Sidebar Footer */
.sidebar-footer {
  padding: 14px 16px;
  border-top: 1px solid var(--border);
  flex-shrink: 0;
}

.sidebar-meta {
  font-size: 11px;
  color: var(--text-400);
  line-height: 1.5;
}

.sidebar-meta strong {
  color: var(--text-300);
  font-weight: 600;
}

/* Overlay (mobile) */
.sidebar-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.65);
  z-index: 899;
  backdrop-filter: blur(2px);
}

.sidebar-overlay.visible { display: block; }

/* ============================================================
   MAIN AREA
   ============================================================ */
.main {
  flex: 1;
  margin-left: var(--sidebar-w);
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  transition: margin-left var(--t-slow) var(--ease);
}

.main.expanded { margin-left: 0; }

/* ============================================================
   HEADER
   ============================================================ */
.topbar {
  position: sticky;
  top: 0;
  height: var(--header-h);
  background: var(--bg-surface);
  border-bottom: 1px solid var(--border);
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 0 24px;
  z-index: 800;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

.hamburger {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-s);
  cursor: pointer;
  color: var(--text-200);
  font-size: 14px;
  transition: all var(--t-fast) var(--ease);
  flex-shrink: 0;
}

.hamburger:hover {
  background: var(--accent-dim);
  border-color: var(--border-accent);
  color: var(--accent);
}

.topbar-breadcrumb {
  display: flex;
  align-items: center;
  gap: 6px;
  flex: 1;
  min-width: 0;
}

.topbar-crumb {
  font-size: 12.5px;
  color: var(--text-400);
  white-space: nowrap;
}

.topbar-crumb.active {
  color: var(--text-100);
  font-weight: 600;
}

.topbar-sep { color: var(--text-400); font-size: 11px; }

.topbar-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}

/* Theme toggle */
.theme-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-s);
  cursor: pointer;
  color: var(--text-200);
  font-size: 14px;
  transition: all var(--t-fast) var(--ease);
}

.theme-btn:hover {
  background: var(--amber-dim);
  border-color: var(--amber-border);
  color: var(--amber);
}

/* Export Dropdown */
.export-wrap {
  position: relative;
}

.export-btn {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 8px 14px;
  background: var(--accent);
  color: #fff;
  border: none;
  border-radius: var(--radius-s);
  cursor: pointer;
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 600;
  transition: all var(--t-fast) var(--ease);
  white-space: nowrap;
}

.export-btn:hover { background: var(--accent-hover); box-shadow: var(--accent-glow); }

.export-dropdown {
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  background: var(--bg-card);
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-m);
  box-shadow: var(--shadow-l);
  min-width: 180px;
  overflow: hidden;
  opacity: 0;
  transform: translateY(-8px) scale(0.97);
  pointer-events: none;
  transition: all var(--t-fast) var(--ease);
  z-index: 100;
}

.export-dropdown.open {
  opacity: 1;
  transform: translateY(0) scale(1);
  pointer-events: all;
}

.export-option {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 11px 16px;
  cursor: pointer;
  font-size: 13px;
  font-weight: 500;
  color: var(--text-200);
  transition: all var(--t-fast) var(--ease);
  border: none;
  background: none;
  width: 100%;
  text-align: left;
  font-family: 'Inter', sans-serif;
}

.export-option:hover {
  background: var(--accent-dim);
  color: var(--text-100);
}

.export-option i {
  width: 16px;
  text-align: center;
  font-size: 13px;
  opacity: 0.8;
}

.export-option.excel { color: var(--green); }
.export-option.excel:hover { background: var(--green-dim); }
.export-option.csv   { color: var(--cyan); }
.export-option.csv:hover   { background: var(--cyan-dim); }
.export-option.pdf   { color: var(--red); }
.export-option.pdf:hover   { background: var(--red-dim); }

/* ============================================================
   CONTENT
   ============================================================ */
/* ── Tab Bar ──────────────────────────────────────────────── */
.tab-bar {
  position: sticky;
  top: var(--header-h);
  z-index: 790;
  background: var(--bg-surface);
  border-bottom: 1px solid var(--border);
  display: flex;
  align-items: stretch;
  gap: 0;
  padding: 0 24px;
  height: var(--tab-bar-h);
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: none;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
.tab-bar::-webkit-scrollbar { display: none; }
.tab-btn {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 0 22px;
  font-size: 13.5px;
  font-weight: 600;
  color: var(--text-300);
  background: transparent;
  border: none;
  border-bottom: 3px solid transparent;
  cursor: pointer;
  transition: color .15s, border-color .15s;
  margin-bottom: -1px;
  white-space: nowrap;
  letter-spacing: 0.01em;
}
.tab-btn i { font-size: 12px; }
.tab-btn:hover { color: var(--text-100); }
.tab-btn.active { color: var(--accent); border-bottom-color: var(--accent); }
.tab-btn.active i { color: var(--accent); }

[data-theme="light"] .tab-bar { background: #fff; border-bottom-color: rgba(0,0,0,0.09); }
[data-theme="light"] .topbar  { background: #fff; border-bottom-color: rgba(0,0,0,0.09); }
[data-theme="light"] .tab-btn.active { color: var(--accent); }

.content {
  padding: 32px;
  flex: 1;
  max-width: 1280px;
  width: 100%;
  min-width: 0;
}

/* Section */
.section {
  margin-bottom: 56px;
  scroll-margin-top: calc(var(--header-h) + var(--tab-bar-h) + 16px);
}

.section-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 24px;
  flex-wrap: wrap;
}

/* Site-wide section collapse */
.sec-collapse-btn {
  background: none; border: 1px solid var(--border); border-radius: 6px;
  padding: 5px 10px; cursor: pointer; color: var(--text-muted);
  font-size: 12px; flex-shrink: 0; align-self: center;
  transition: background .15s, color .15s;
}
.sec-collapse-btn:hover { background: var(--bg); color: var(--text); }
.sec-collapse-btn i { transition: transform .2s; display: block; }
.section.sec-collapsed > *:not(.section-header) { display: none !important; }

.section-title-group {
  display: flex;
  align-items: center;
  gap: 12px;
}

.section-icon {
  width: 40px;
  height: 40px;
  border-radius: var(--radius-m);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 17px;
  flex-shrink: 0;
}

.section-icon.blue   { background: var(--accent-dim);  color: var(--accent); }
.section-icon.green  { background: var(--green-dim);   color: var(--green); }
.section-icon.red    { background: var(--red-dim);     color: var(--red); }
.section-icon.amber  { background: var(--amber-dim);   color: var(--amber); }
.section-icon.cyan   { background: var(--cyan-dim);    color: var(--cyan); }
.section-icon.purple { background: var(--purple-dim);  color: var(--purple); }

.section-title {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 22px;
  font-weight: 700;
  color: var(--text-100);
  line-height: 1.2;
}

.section-subtitle {
  font-size: 13px;
  color: var(--text-300);
  margin-top: 3px;
}

/* Section export */
.sec-export-btn {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 7px 12px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-s);
  cursor: pointer;
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  font-weight: 600;
  color: var(--text-300);
  transition: all var(--t-fast) var(--ease);
  white-space: nowrap;
  position: relative;
}

.sec-export-btn:hover {
  background: var(--accent-dim);
  border-color: var(--border-accent);
  color: var(--accent);
}

.sec-export-menu {
  position: absolute;
  top: calc(100% + 5px);
  right: 0;
  background: var(--bg-card);
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-m);
  box-shadow: var(--shadow-l);
  min-width: 160px;
  overflow: hidden;
  opacity: 0;
  transform: translateY(-6px) scale(0.97);
  pointer-events: none;
  transition: all var(--t-fast) var(--ease);
  z-index: 50;
}

.sec-export-menu.open {
  opacity: 1;
  transform: translateY(0) scale(1);
  pointer-events: all;
}

.sec-export-opt {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 10px 14px;
  cursor: pointer;
  font-size: 12.5px;
  font-weight: 500;
  color: var(--text-200);
  transition: background var(--t-fast) var(--ease);
  border: none;
  background: none;
  width: 100%;
  text-align: left;
  font-family: 'Inter', sans-serif;
}

.sec-export-opt:hover { background: var(--accent-dim); color: var(--text-100); }

/* ============================================================
   STATS CARDS
   ============================================================ */
.stats-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin-bottom: 32px;
}

.stat-card {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-l);
  padding: 22px 20px;
  display: flex;
  align-items: flex-start;
  gap: 16px;
  transition: all var(--t-fast) var(--ease);
}

.stat-card:hover {
  border-color: var(--border-strong);
  transform: translateY(-1px);
  box-shadow: var(--shadow-m);
}

.stat-icon {
  width: 46px;
  height: 46px;
  border-radius: var(--radius-m);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  flex-shrink: 0;
}

.stat-icon.success { background: var(--green-dim); color: var(--green); }
.stat-icon.danger  { background: var(--red-dim);   color: var(--red); }
.stat-icon.accent  { background: var(--accent-dim); color: var(--accent); }
.stat-icon.warning { background: var(--amber-dim); color: var(--amber); }

.stat-content { flex: 1; min-width: 0; }

.stat-value {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 28px;
  font-weight: 800;
  color: var(--text-100);
  line-height: 1;
  margin-bottom: 4px;
}

.stat-label {
  font-size: 12px;
  font-weight: 700;
  color: var(--text-300);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 4px;
}

.stat-note {
  font-size: 11.5px;
  color: var(--text-400);
}

/* ============================================================
   CARDS
   ============================================================ */
.card {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-l);
  overflow: hidden;
}

.card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px;
  border-bottom: 1px solid var(--border);
  background: var(--bg-surface);
  gap: 12px;
  flex-wrap: wrap;
}

.card-title {
  font-size: 14px;
  font-weight: 700;
  color: var(--text-100);
  display: flex;
  align-items: center;
  gap: 8px;
}

.card-badge {
  font-size: 11px;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: 20px;
}

.card-badge.green  { background: var(--green-dim);  color: var(--green); }
.card-badge.red    { background: var(--red-dim);    color: var(--red); }
.card-badge.amber  { background: var(--amber-dim);  color: var(--amber); }
.card-badge.blue   { background: var(--accent-dim); color: var(--accent); }

/* ============================================================
   TABLES
   ============================================================ */
.table-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13.5px;
}

thead th {
  background: var(--bg-surface);
  color: var(--text-300);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  padding: 11px 16px;
  text-align: left;
  white-space: nowrap;
  border-bottom: 1px solid var(--border);
  position: sticky;
  top: 0;
  z-index: 1;
}

thead th.right { text-align: right; }

tbody tr {
  border-bottom: 1px solid var(--border);
  transition: background var(--t-fast) var(--ease);
}

tbody tr:last-child { border-bottom: none; }

tbody tr:hover { background: var(--bg-card-hover); }

tbody td {
  padding: 12px 16px;
  color: var(--text-200);
  vertical-align: middle;
}

tbody td.right { text-align: right; }

/* Row color variants */
tbody tr.row-high    { background: rgba(244,63,94,0.04); }
tbody tr.row-high:hover { background: rgba(244,63,94,0.08); }
tbody tr.row-med     { background: rgba(245,158,11,0.03); }
tbody tr.row-total   {
  background: var(--green-dim);
  font-weight: 700;
  border-top: 2px solid var(--green-border);
}
tbody tr.row-total td { color: var(--green); }

/* Table cells */
.item-name {
  font-weight: 600;
  color: var(--text-100);
  white-space: nowrap;
}

.price-pfg   { color: var(--red);   font-weight: 600; font-variant-numeric: tabular-nums; }
.price-shaver{ color: var(--green); font-weight: 600; font-variant-numeric: tabular-nums; }
.savings-val {
  color: var(--amber);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
/* weight-normalized savings cells */
td .savings-val + .small { display: block; font-size: 10px; color: var(--text-muted); font-weight: 400; margin-top: 1px; }

.pill {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 11px;
  font-weight: 700;
  padding: 3px 9px;
  border-radius: 20px;
  white-space: nowrap;
}

.pill.high   { background: var(--red-dim);    color: var(--red);    border: 1px solid var(--red-border); }
.pill.med    { background: var(--amber-dim);  color: var(--amber);  border: 1px solid var(--amber-border); }
.pill.low    { background: var(--accent-dim); color: var(--accent); border: 1px solid var(--border-accent); }
.pill.cat    { background: var(--purple-dim); color: var(--purple); }
.pill.vendor { background: var(--cyan-dim);   color: var(--cyan); }
.pill.green  { background: var(--green-dim);  color: var(--green);  border: 1px solid var(--green-border); }

/* ============================================================
   SAVINGS CHART
   ============================================================ */
.chart-card {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-l);
  padding: 24px;
}

.chart-wrap {
  position: relative;
  height: 320px;
  margin-top: 16px;
}

/* ============================================================
   ASSESSMENT CARDS
   ============================================================ */
.assessment-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}

.assessment-col {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-l);
  overflow: hidden;
}

.assessment-col-header {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 20px;
  font-weight: 700;
  font-size: 14px;
  border-bottom: 1px solid var(--border);
}

.assessment-col-header.green {
  background: var(--green-dim);
  color: var(--green);
  border-color: var(--green-border);
}

.assessment-col-header.red {
  background: var(--red-dim);
  color: var(--red);
  border-color: var(--red-border);
}

.assessment-item {
  padding: 16px 20px;
  border-bottom: 1px solid var(--border);
  display: flex;
  gap: 14px;
  align-items: flex-start;
}

.assessment-item:last-child { border-bottom: none; }

.assessment-bullet {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  flex-shrink: 0;
  margin-top: 1px;
}

.assessment-bullet.green { background: var(--green-dim); color: var(--green); }
.assessment-bullet.red   { background: var(--red-dim);   color: var(--red); }
.assessment-bullet.amber { background: var(--amber-dim); color: var(--amber); }

.severity-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  margin-top: 7px;
  flex-shrink: 0;
}
.severity-dot.high { background: var(--red); }
.severity-dot.med  { background: var(--amber); }
.severity-dot.low  { background: var(--accent); }

.assessment-text strong {
  display: block;
  font-weight: 700;
  color: var(--text-100);
  font-size: 13.5px;
  margin-bottom: 3px;
}

.assessment-text p {
  font-size: 12.5px;
  color: var(--text-300);
  line-height: 1.5;
}

/* ============================================================
   MENU IDEAS CARDS
   ============================================================ */
.meal-type-label {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 16px;
  font-weight: 700;
  color: var(--text-100);
  margin-bottom: 14px;
  margin-top: 24px;
  display: flex;
  align-items: center;
  gap: 8px;
}

.meal-type-label:first-child { margin-top: 0; }

.meal-type-label i {
  font-size: 15px;
}

.ideas-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 14px;
}

.idea-card {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-l);
  padding: 18px 20px;
  transition: all var(--t-fast) var(--ease);
}

.idea-card:hover {
  border-color: var(--border-accent);
  transform: translateY(-1px);
  box-shadow: var(--shadow-m);
}

.idea-name {
  font-weight: 700;
  color: var(--text-100);
  font-size: 14px;
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  gap: 8px;
}

.idea-ingredients {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 5px;
  margin-bottom: 10px;
}

.idea-ingredients li {
  font-size: 12px;
  color: var(--text-300);
  display: flex;
  align-items: center;
  gap: 6px;
}

.idea-ingredients li::before {
  content: '·';
  color: var(--text-400);
}

.idea-note {
  font-size: 12px;
  color: var(--text-400);
  background: var(--bg-surface);
  border-radius: var(--radius-s);
  padding: 8px 10px;
  font-style: italic;
  border-left: 2px solid var(--accent-dim);
  line-height: 1.5;
}

.idea-detail {
  font-size: 12.5px;
  color: var(--text-200);
  margin-bottom: 8px;
}

.idea-cost {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  font-weight: 700;
  color: var(--green);
  background: var(--green-dim);
  padding: 3px 9px;
  border-radius: 20px;
  margin-bottom: 8px;
}

/* ============================================================
   PRIORITY ACTIONS
   ============================================================ */
.priority-tier {
  margin-bottom: 28px;
}

.priority-tier-header {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
  font-family: 'Space Grotesk', sans-serif;
  font-size: 15px;
  font-weight: 700;
}

.priority-tier-header i { font-size: 14px; }
.priority-tier-header.immediate { color: var(--red); }
.priority-tier-header.next      { color: var(--amber); }
.priority-tier-header.quarterly { color: var(--accent); }

.priority-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.priority-item {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-m);
  padding: 14px 18px;
  transition: all var(--t-fast) var(--ease);
}

.priority-item:hover {
  border-color: var(--border-strong);
  box-shadow: var(--shadow-s);
}

.priority-num {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 800;
  flex-shrink: 0;
}

.priority-num.immediate { background: var(--red-dim);    color: var(--red); }
.priority-num.next      { background: var(--amber-dim);  color: var(--amber); }
.priority-num.quarterly { background: var(--accent-dim); color: var(--accent); }

.priority-body { flex: 1; min-width: 0; }

.priority-action {
  font-weight: 700;
  color: var(--text-100);
  font-size: 13.5px;
  margin-bottom: 3px;
}

.priority-detail {
  font-size: 12.5px;
  color: var(--text-300);
}

.priority-impact {
  flex-shrink: 0;
  font-size: 12px;
  font-weight: 700;
  padding: 4px 10px;
  border-radius: 20px;
  white-space: nowrap;
  background: var(--green-dim);
  color: var(--green);
  align-self: center;
}

/* ============================================================
   CATALOG SEARCH + FILTER
   ============================================================ */
.catalog-controls {
  display: flex;
  gap: 10px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}

.search-input-wrap {
  display: flex;
  align-items: center;
  gap: 8px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-m);
  padding: 8px 14px;
  flex: 1;
  min-width: 200px;
  transition: border-color var(--t-fast) var(--ease);
}

.search-input-wrap:focus-within {
  border-color: var(--border-accent);
}

.search-input-wrap i { color: var(--text-400); font-size: 13px; }

.search-input {
  background: none;
  border: none;
  outline: none;
  color: var(--text-100);
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  flex: 1;
}

.search-input::placeholder { color: var(--text-400); }

.filter-btn {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-m);
  cursor: pointer;
  font-family: 'Inter', sans-serif;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--text-300);
  transition: all var(--t-fast) var(--ease);
  white-space: nowrap;
}

.filter-btn:hover, .filter-btn.active {
  background: var(--accent-dim);
  border-color: var(--border-accent);
  color: var(--accent);
}

.catalog-category {
  margin-bottom: 24px;
}

.catalog-category-header {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 16px;
  background: var(--bg-surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-m) var(--radius-m) 0 0;
  font-size: 12.5px;
  font-weight: 700;
  color: var(--text-200);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  cursor: pointer;
  transition: all var(--t-fast) var(--ease);
}

.catalog-category-header:hover { background: var(--accent-dim); }

.catalog-category-header i.chevron {
  margin-left: auto;
  transition: transform var(--t-fast) var(--ease);
  color: var(--text-400);
}

.catalog-category-header.collapsed i.chevron {
  transform: rotate(-90deg);
}

.catalog-category-body {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-top: none;
  border-radius: 0 0 var(--radius-m) var(--radius-m);
  overflow: hidden;
  transition: max-height var(--t-med) var(--ease);
}

.catalog-category-body.collapsed {
  display: none;
}

/* ============================================================
   OVERVIEW SECTION
   ============================================================ */
.overview-hero {
  background: linear-gradient(135deg, var(--bg-card) 0%, var(--bg-surface) 100%);
  border: 1px solid var(--border);
  border-radius: var(--radius-xl);
  padding: 32px 36px;
  margin-bottom: 28px;
  position: relative;
  overflow: hidden;
}

.overview-hero::before {
  content: '';
  position: absolute;
  top: -40px; right: -40px;
  width: 220px; height: 220px;
  background: radial-gradient(circle, rgba(59,130,246,0.08) 0%, transparent 70%);
  pointer-events: none;
}

.overview-hero::after {
  content: '';
  position: absolute;
  bottom: -60px; left: 30%;
  width: 300px; height: 200px;
  background: radial-gradient(circle, rgba(16,185,129,0.05) 0%, transparent 70%);
  pointer-events: none;
}

.overview-hero-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}

.overview-title {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 32px;
  font-weight: 800;
  color: var(--text-100);
  line-height: 1.15;
}

.overview-title span {
  background: linear-gradient(90deg, var(--accent) 0%, var(--cyan) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.overview-subtitle {
  font-size: 15px;
  color: var(--text-300);
  margin-top: 6px;
}

.overview-meta {
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-items: flex-end;
}

.overview-meta-item {
  font-size: 12px;
  color: var(--text-400);
  display: flex;
  align-items: center;
  gap: 6px;
}

.overview-meta-item i { font-size: 11px; }

.sources-list {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.source-tag {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  background: var(--bg-body);
  border: 1px solid var(--border);
  border-radius: 20px;
  font-size: 12px;
  color: var(--text-300);
}

.source-tag i { font-size: 11px; color: var(--accent); }

/* Two-column layout for chart + keep-pfg */
.two-col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin-bottom: 32px;
}

/* ============================================================
   DIVIDER
   ============================================================ */
.divider {
  height: 1px;
  background: var(--border);
  margin: 0 0 32px;
}

/* ============================================================
   EMPTY STATE
   ============================================================ */
.empty-state {
  padding: 40px 20px;
  text-align: center;
  color: var(--text-400);
  font-size: 14px;
}

.empty-state i { font-size: 32px; margin-bottom: 12px; display: block; }

/* ============================================================
   TOAST NOTIFICATION
   ============================================================ */
#toast {
  position: fixed;
  bottom: 24px;
  right: 24px;
  background: var(--bg-card);
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-m);
  padding: 12px 18px;
  display: flex;
  align-items: center;
  gap: 10px;
  box-shadow: var(--shadow-l);
  font-size: 13px;
  font-weight: 600;
  color: var(--text-100);
  z-index: 9999;
  opacity: 0;
  transform: translateY(12px);
  transition: all var(--t-med) var(--ease);
  pointer-events: none;
}

#toast.show {
  opacity: 1;
  transform: translateY(0);
}

#toast i { font-size: 15px; }
#toast.success i { color: var(--green); }
#toast.error   i { color: var(--red); }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 1100px) {
  .stats-grid { grid-template-columns: repeat(2, 1fr); }
  .two-col    { grid-template-columns: 1fr; }
}

@media (max-width: 900px) {
  .assessment-grid { grid-template-columns: 1fr; }
  .content { padding: 20px; }
}

@media (max-width: 768px) {
  :root { --sidebar-w: 280px; }

  .sidebar {
    transform: translateX(calc(-1 * var(--sidebar-w)));
    box-shadow: none;
  }

  .sidebar.open {
    transform: translateX(0);
    box-shadow: var(--shadow-l);
  }

  .main {
    margin-left: 0 !important;
  }

  .stats-grid { grid-template-columns: 1fr 1fr; }

  .overview-title { font-size: 24px; }
  .overview-hero { padding: 22px 20px; }
  .overview-meta { align-items: flex-start; }

  .topbar { padding: 0 16px; }
  .topbar-crumb:not(.active) { display: none; }
  .topbar-sep { display: none; }
  .tab-bar { padding: 0 8px; }
  .tab-btn { padding: 0 13px; font-size: 12.5px; gap: 5px; }

  .section-title { font-size: 18px; }
  .export-btn span { display: none; }

  .ideas-grid { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
  .stats-grid { grid-template-columns: 1fr; }
  .content { padding: 14px; }
  .priority-impact { display: none; }
}

/* ============================================================
   PRINT STYLES
   ============================================================ */
@media print {
  .sidebar, .topbar, .hamburger, .topbar-actions { display: none !important; }
  .main { margin-left: 0 !important; }
  .content { padding: 0; }
  .card, .stat-card, .idea-card, .priority-item {
    break-inside: avoid;
    box-shadow: none;
    border: 1px solid #ccc;
  }
  body { background: white; color: black; }
}

/* ============================================================
   WEEKLY REPORT
   ============================================================ */

/* KPI row */
.report-kpi-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin-bottom: 24px;
}
.report-kpi-card {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-m);
  padding: 18px 20px;
}
.report-kpi-icon {
  width: 40px;
  height: 40px;
  border-radius: var(--radius-s);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  flex-shrink: 0;
}
.report-kpi-icon.accent  { background: var(--accent-dim);  color: var(--accent); }
.report-kpi-icon.amber   { background: var(--amber-dim);   color: var(--amber);  }
.report-kpi-icon.green   { background: var(--green-dim);   color: var(--green);  }
.report-kpi-icon.red     { background: var(--red-dim);     color: var(--red);    }
.report-kpi-body { display: flex; flex-direction: column; gap: 3px; }
.report-kpi-value {
  font-size: 22px;
  font-weight: 700;
  color: var(--text-100);
  font-family: 'Space Grotesk', sans-serif;
  line-height: 1.1;
}
.report-kpi-value.green  { color: var(--green); }
.report-kpi-value.amber  { color: var(--amber); }
.report-kpi-value.red    { color: var(--red);   }
.report-kpi-label { font-size: 12px; font-weight: 600; color: var(--text-200); }
.report-kpi-sub   { font-size: 11px; color: var(--text-400); }

/* Location comparison */
.loc-compare-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-bottom: 16px;
}
.loc-card {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-m);
  padding: 20px 22px;
}
.loc-card.loc-bham { border-left: 3px solid var(--accent); }
.loc-card.loc-bess { border-left: 3px solid var(--purple); }
.loc-card-header {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 16px;
}
.loc-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  flex-shrink: 0;
}
.loc-dot.bham { background: var(--accent); }
.loc-dot.bess { background: var(--purple); }
.loc-card-title {
  font-size: 15px;
  font-weight: 700;
  color: var(--text-100);
  font-family: 'Space Grotesk', sans-serif;
  flex: 1;
}
.loc-card-share {
  font-size: 11px;
  color: var(--text-400);
}
.loc-stat-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 5px 0;
  border-bottom: 1px solid var(--border);
}
.loc-stat-row:last-child { border-bottom: none; }
.loc-stat-label { font-size: 12px; color: var(--text-300); }
.loc-stat-value { font-size: 13px; font-weight: 500; color: var(--text-100); }
.loc-net-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 0 0;
  margin-top: 8px;
  border-top: 1px solid var(--border-strong);
}
.loc-net-value {
  font-size: 16px;
  font-weight: 700;
  font-family: 'Space Grotesk', sans-serif;
}
.loc-net-value.green { color: var(--green); }
.loc-net-value.amber { color: var(--amber); }
.loc-net-value small { font-size: 11px; font-weight: 400; color: var(--text-400); }

/* % pills */
.pct-pill {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 20px;
  font-size: 11px;
  font-weight: 700;
}
.pct-pill.green  { background: var(--green-dim);  color: var(--green);  border: 1px solid var(--green-border); }
.pct-pill.amber  { background: var(--amber-dim);  color: var(--amber);  border: 1px solid var(--amber-border); }
.pct-pill.red    { background: var(--red-dim);    color: var(--red);    border: 1px solid var(--red-border);   }

/* P&L table */
.pl-table { width: 100%; }
.pl-section-row td {
  background: var(--bg-body) !important;
  color: var(--text-400);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .07em;
  padding: 10px 12px 6px;
}
.pl-subtotal-row td {
  background: rgba(255,255,255,0.03);
  border-top: 1px solid var(--border-strong);
  border-bottom: 1px solid var(--border-strong);
  padding: 10px 12px;
  font-size: 13px;
}
.pl-total-row td {
  background: var(--bg-body);
  padding: 12px 12px;
  font-size: 13px;
  border-top: 2px solid var(--border-strong);
}

/* Section icon: purple */
.section-icon.purple { background: var(--purple-dim); color: var(--purple); }

/* Weekly net banner */
.weekly-net-banner {
  background: linear-gradient(135deg, rgba(16,185,129,0.12) 0%, rgba(16,185,129,0.05) 100%);
  border: 1px solid var(--green-border);
  border-radius: var(--radius-m);
  padding: 28px 32px;
  text-align: center;
}
.wn-label  { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--text-400); margin-bottom: 6px; }
.wn-amount { font-size: 48px; font-weight: 800; color: var(--green); font-family: 'Space Grotesk', sans-serif; line-height: 1; }
.wn-pct    { font-size: 16px; color: var(--green); margin-top: 4px; font-weight: 600; }
.wn-sub    { font-size: 13px; color: var(--text-400); margin-top: 10px; }

/* mt-16 helper */
.mt-16 { margin-top: 16px; }

/* Responsive overrides */
@media (max-width: 900px) {
  .report-kpi-grid  { grid-template-columns: repeat(2, 1fr); }
  .loc-compare-grid { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
  .report-kpi-grid  { grid-template-columns: 1fr 1fr; }
  .wn-amount        { font-size: 36px; }
}

/* ============================================================
   MEAL COST CALCULATOR
   ============================================================ */
.calc-controls {
  display: flex;
  flex-wrap: wrap;
  gap: 20px 32px;
  align-items: flex-start;
}
.calc-control-group { flex: 0 0 auto; }
.calc-label {
  display: block;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .07em;
  color: var(--text-300);
  margin-bottom: 8px;
}
.calc-slider-row {
  display: flex;
  align-items: center;
  gap: 10px;
}
.calc-slider {
  -webkit-appearance: none;
  width: 180px;
  height: 4px;
  border-radius: 2px;
  background: var(--border-strong);
  outline: none;
  cursor: pointer;
}
.calc-slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: var(--accent);
  cursor: pointer;
  border: 2px solid var(--bg-body);
  box-shadow: 0 0 8px rgba(59,130,246,0.45);
}
.calc-slider::-moz-range-thumb {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: var(--accent);
  cursor: pointer;
  border: 2px solid var(--bg-body);
}
.calc-number-input {
  width: 86px;
  background: var(--bg-input);
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-s);
  color: var(--text-100);
  font-size: 14px;
  font-weight: 600;
  padding: 6px 10px;
  text-align: center;
  transition: border-color .15s;
}
.calc-number-input:focus { outline: none; border-color: var(--accent); }
.calc-target-row {
  display: flex;
  align-items: center;
  gap: 8px;
}
.calc-prefix, .calc-suffix {
  color: var(--text-300);
  font-size: 13px;
}
.calc-hint {
  font-size: 11px;
  color: var(--text-400);
  margin-top: 6px;
}
.calc-kpi-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  flex: 1;
  min-width: 280px;
}
.calc-summary-bar {
  flex: 1;
  min-width: 280px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.calc-kpi {
  flex: 1;
  min-width: 90px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 12px 14px;
  background: var(--bg-body);
  border: 1px solid var(--border);
  border-radius: var(--radius-m);
}
.calc-kpi-val {
  font-size: 18px;
  font-weight: 700;
  color: var(--text-100);
  font-family: 'Space Grotesk', sans-serif;
  line-height: 1.1;
}
.calc-kpi-val.kpi-good  { color: var(--green); }
.calc-kpi-val.kpi-over  { color: var(--red); }
.calc-kpi-val.kpi-under { color: var(--amber); }
.calc-kpi-lbl {
  font-size: 10px;
  color: var(--text-400);
  text-transform: uppercase;
  letter-spacing: .06em;
}
.calc-reset-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 14px;
  font-size: 12px;
  font-weight: 600;
  border: 1px solid var(--border-strong);
  background: transparent;
  color: var(--text-200);
  border-radius: var(--radius-s);
  cursor: pointer;
  transition: all .15s;
}
.calc-reset-btn:hover {
  background: var(--bg-card-hover);
  border-color: var(--accent);
  color: var(--accent);
}
/* Planner grid */
.planner-wrap { overflow-x: auto; }
.planner-grid {
  display: grid;
  grid-template-columns: 110px repeat(7, 1fr);
  gap: 4px;
  min-width: 680px;
  padding: 4px 0 8px;
}
.planner-header-cell {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--text-300);
  padding: 8px 6px;
  text-align: center;
}
.planner-row-label {
  display: flex;
  align-items: center;
  font-size: 12px;
  font-weight: 600;
  padding: 4px 6px;
  border-radius: var(--radius-s);
  color: var(--text-200);
  white-space: nowrap;
}
.breakfast-label { color: var(--amber); }
.lunch-label     { color: var(--accent); }
.dinner-label    { color: var(--purple); }
.total-label {
  color: var(--green);
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
}
.planner-cell { display: flex; align-items: center; }
.planner-select {
  width: 100%;
  background: var(--bg-input);
  border: 1px solid var(--border);
  border-radius: var(--radius-s);
  color: var(--text-200);
  font-size: 11px;
  padding: 6px 7px;
  cursor: pointer;
  outline: none;
  transition: border-color .15s;
}
.planner-select:hover,
.planner-select:focus     { border-color: var(--accent); color: var(--text-100); }
.breakfast-select:hover,
.breakfast-select:focus   { border-color: var(--amber); }
.dinner-select:hover,
.dinner-select:focus      { border-color: var(--purple); }
.planner-total-cell {
  justify-content: center;
  font-size: 12px;
  font-weight: 700;
  color: var(--green);
  text-align: center;
  padding: 7px 4px;
  background: var(--green-dim);
  border: 1px solid var(--green-border);
  border-radius: var(--radius-s);
}
.row-over  td { background: rgba(244,63,94,0.05); }
.row-under td { background: rgba(245,158,11,0.05); }
.calc-tfoot-row td {
  background: var(--bg-body);
  font-size: 13px;
  padding: 10px 12px;
  border-top: 1px solid var(--border-strong);
}

/* Light mode overrides */
[data-theme="light"] .calc-slider     { background: #cbd5e1; }
[data-theme="light"] .planner-select  { background: #f8fafc; color: #2c4060; border-color: #d1dae6; }
[data-theme="light"] .calc-number-input { background: #f8fafc; color: #0a1526; border-color: #d1dae6; }
[data-theme="light"] .calc-kpi        { background: #f4f7fb; border-color: #d1dae6; }
[data-theme="light"] .planner-total-cell { color: #059669; }
[data-theme="light"] .calc-tfoot-row td { background: #f4f7fb; }

/* ============================================================
   UTILITY
   ============================================================ */
.flex   { display: flex; }
.gap-8  { gap: 8px; }
.gap-12 { gap: 12px; }
.items-center { align-items: center; }
.wrap   { flex-wrap: wrap; }
.mt-4   { margin-top: 4px; }
.mt-8   { margin-top: 8px; }
.mt-16  { margin-top: 16px; }
.mb-16  { margin-bottom: 16px; }
.mb-20  { margin-bottom: 20px; }
.bold   { font-weight: 700; }
.text-green { color: var(--green); }
.text-red   { color: var(--red); }
.text-amber { color: var(--amber); }
.text-muted { color: var(--text-400); }
.small  { font-size: 12px; }

/* ============================================================
   BID TRACKER
   ============================================================ */

/* nav badge colors */
.nav-badge.blue   { background: rgba(59,130,246,0.18); color: #60a5fa; }
.nav-badge.amber  { background: rgba(245,158,11,0.18);  color: var(--amber); }

/* status pills */
.bid-status-pill {
  display: inline-flex; align-items: center;
  font-size: 10px; font-weight: 800; letter-spacing: 0.08em;
  padding: 3px 9px; border-radius: 20px; text-transform: uppercase;
}
.bid-status-pill.verify  { background: rgba(245,158,11,0.18);  color: var(--amber); border: 1px solid rgba(245,158,11,0.35); }
.bid-status-pill.upcoming{ background: rgba(59,130,246,0.18);  color: #60a5fa;      border: 1px solid rgba(59,130,246,0.35); }
.bid-status-pill.radar   { background: rgba(139,92,246,0.15);  color: #a78bfa;      border: 1px solid rgba(139,92,246,0.3); }

/* base bid card */
.bid-card {
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 20px 24px;
  position: relative;
  overflow: hidden;
}
.bid-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
}
.bid-verify::before  { background: var(--amber); }
.bid-upcoming::before{ background: #3b82f6; }

/* card top row */
.bid-card-top {
  display: flex; align-items: flex-start;
  justify-content: space-between; gap: 12px;
  margin-bottom: 12px; flex-wrap: wrap;
}
.bid-meta { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.bid-location { font-size: 12px; color: var(--text-400); }
.bid-location i { margin-right: 4px; }
.bid-id { font-size: 11px; color: var(--text-400); font-family: monospace; background: var(--bg-2); padding: 2px 8px; border-radius: 4px; }

/* agency / facility / scope */
.bid-agency   { font-size: 18px; font-weight: 700; color: var(--text-100); margin-bottom: 2px; }
.bid-facility { font-size: 13px; color: var(--text-300); margin-bottom: 8px; }
.bid-scope    { font-size: 13px; color: var(--text-200); margin-bottom: 12px; padding-bottom: 12px; border-bottom: 1px solid var(--border); }

/* note */
.bid-note {
  font-size: 12px; color: var(--text-300); background: var(--bg-2);
  border-radius: 6px; padding: 8px 12px; margin-bottom: 12px;
  line-height: 1.5;
}
.bid-note i { margin-right: 6px; color: var(--amber); }

/* contacts */
.bid-contact-row { display: flex; flex-wrap: wrap; gap: 6px 20px; }
.bid-contact { font-size: 12px; color: var(--text-300); }
.bid-contact i { margin-right: 5px; color: var(--accent); }
.bid-contact a { color: var(--accent); text-decoration: none; }
.bid-contact a:hover { text-decoration: underline; }

/* timeline widget */
.bid-timeline {
  display: flex; align-items: center; gap: 8px;
  background: var(--bg-2); border-radius: 8px;
  padding: 8px 14px;
}
.bid-timeline-item { display: flex; flex-direction: column; align-items: center; }
.bid-timeline-label { font-size: 10px; color: var(--text-400); text-transform: uppercase; letter-spacing: 0.06em; }
.bid-timeline-date  { font-size: 13px; font-weight: 600; color: var(--text-200); }
.bid-timeline-item.highlight .bid-timeline-date { color: #60a5fa; }
.bid-timeline-arrow { color: var(--text-400); font-size: 11px; }

.bid-pill {
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 11px; font-weight: 600;
  background: var(--bg-2); color: var(--text-300);
  padding: 2px 10px; border-radius: 20px;
}
.bid-pill.mono { font-family: monospace; font-size: 10px; }
.bid-portals-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 10px;
}
.bid-portal-card {
  display: flex; flex-direction: column; align-items: center; gap: 6px;
  padding: 16px 10px;
  background: var(--card-bg); border: 1px solid var(--border);
  border-radius: var(--radius); text-decoration: none;
  transition: border-color .15s;
}
.bid-portal-card:hover { border-color: var(--accent); }

/* radar grid */
.bid-radar-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.bid-radar-card { border-top: 3px solid rgba(139,92,246,0.5); }
.bid-radar-top  { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.bid-expected-year { font-size: 13px; font-weight: 700; color: #a78bfa; background: rgba(139,92,246,0.1); padding: 2px 10px; border-radius: 20px; }
.bid-note-sm { font-size: 12px; color: var(--text-400); line-height: 1.5; margin: 8px 0; }
.bid-contact-sm { font-size: 12px; color: var(--text-400); }
.bid-contact-sm i { margin-right: 5px; color: var(--accent); }
.bid-contact-sm a { color: var(--accent); text-decoration: none; }
.bid-contact-sm a:hover { text-decoration: underline; }

/* portals grid */
.bid-portals-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; }
.portal-card {
  display: flex; flex-direction: column; align-items: center; text-align: center;
  gap: 8px; padding: 18px 12px;
  background: var(--card-bg); border: 1px solid var(--border);
  border-radius: var(--radius); text-decoration: none;
  transition: border-color 0.15s, transform 0.15s;
}
.portal-card:hover { border-color: var(--accent); transform: translateY(-2px); }
.portal-card i { font-size: 22px; color: var(--accent); }
.portal-name { font-size: 13px; font-weight: 600; color: var(--text-200); }
.portal-sub  { font-size: 11px; color: var(--text-400); }


@media (max-width: 900px) {
  .bid-radar-grid  { grid-template-columns: 1fr 1fr; }
  .bid-portals-grid{ grid-template-columns: repeat(3, 1fr); }
  .bid-timeline    { flex-direction: column; gap: 4px; }
  .bid-timeline-arrow { transform: rotate(90deg); }
}
@media (max-width: 600px) {
  .bid-radar-grid  { grid-template-columns: 1fr; }
  .bid-portals-grid{ grid-template-columns: repeat(2, 1fr); }
  .bid-card-top    { flex-direction: column; }
}

/* ============================================================
   MENU ROTATION TAB
   ============================================================ */

/* Week selector */
.menu-week-bar {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 28px;
}
.menu-week-btn {
  padding: 8px 22px;
  border-radius: 30px;
  border: 1px solid var(--border);
  background: var(--bg-2);
  color: var(--text-300);
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.15s;
}
.menu-week-btn:hover { border-color: var(--accent); color: var(--text-100); }
.menu-week-btn.active {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}

/* Scroll wrapper — the ONLY overflow container for the grid */
#menuGrid {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  margin-bottom: 14px;
}

/* Day grid — min-width forces scroll on narrow screens */
.menu-grid-scroll {
  min-width: 0;
  display: block;
}

.menu-grid {
  display: grid;
  grid-template-columns: 100px repeat(7, minmax(130px, 1fr));
  min-width: 820px;
  width: max-content;
  gap: 0;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  overflow: hidden;
  font-size: 12px;
}
.menu-grid-header {
  background: var(--bg-2);
  padding: 10px 8px;
  font-weight: 700;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--text-400);
  text-align: center;
  border-bottom: 2px solid var(--border);
}
.menu-grid-header:first-child { text-align: left; padding-left: 14px; }
.menu-row-label {
  display: flex;
  align-items: center;
  padding: 0 14px;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .07em;
  border-right: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
}
.menu-row-label.breakfast { color: var(--amber); background: rgba(245,158,11,.04); }
.menu-row-label.lunch     { color: var(--accent); background: rgba(59,130,246,.04); }
.menu-row-label.dinner    { color: var(--success); background: rgba(16,185,129,.04); }
.menu-cell {
  padding: 10px 9px;
  border-right: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  vertical-align: top;
}
.menu-cell:last-child { border-right: none; }
.menu-cell-main {
  font-weight: 600;
  color: var(--text-100);
  line-height: 1.35;
  margin-bottom: 4px;
}
.menu-cell-sides {
  color: var(--text-400);
  font-size: 11px;
  line-height: 1.4;
}
.menu-cell-cost {
  display: inline-block;
  margin-top: 5px;
  font-size: 10px;
  font-weight: 700;
  color: var(--text-400);
  background: var(--bg-2);
  border-radius: 4px;
  padding: 1px 6px;
}
.menu-cell.b-cell { background: rgba(245,158,11,.03); }
.menu-cell.l-cell { background: rgba(59,130,246,.03); }
.menu-cell.d-cell { background: rgba(16,185,129,.03); }

/* last row — no bottom border */
.menu-grid > :nth-last-child(-n+8) { border-bottom: none; }

/* Meal Ideas library */
.ideas-category-label {
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .1em;
  color: var(--text-400);
  margin: 28px 0 12px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--border);
}
.ideas-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 12px;
}
.idea-card {
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 14px 16px;
  transition: border-color 0.15s;
}
.idea-card:hover { border-color: var(--accent); }
.idea-card-top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 8px;
  margin-bottom: 6px;
}
.idea-card-name {
  font-weight: 700;
  font-size: 14px;
  color: var(--text-100);
}
.idea-card-cost {
  font-size: 12px;
  font-weight: 800;
  color: var(--success);
  white-space: nowrap;
  background: rgba(16,185,129,.1);
  border-radius: 12px;
  padding: 2px 9px;
}
.idea-card-note {
  font-size: 12px;
  color: var(--text-300);
  line-height: 1.5;
}

/* Print styles */
@media print {
  .sidebar, .topbar, .tab-bar, .menu-week-bar { display: none !important; }
  .menu-grid { font-size: 10px; }
  .menu-cell { padding: 6px 5px; }
  #main { margin-left: 0 !important; }
}

@media (max-width: 900px) {
  .menu-grid { font-size: 11px; }
  .menu-row-label { font-size: 9px; padding: 0 6px; }
  .menu-cell { padding: 7px 5px; }
}
@media (max-width: 640px) {
  .menu-grid { font-size: 10px; }
  .ideas-grid { grid-template-columns: 1fr; }
}

.menu-cell-cal {
  display: inline-block;
  font-size: 10px;
  font-weight: 700;
  color: var(--accent);
  background: rgba(59,130,246,.08);
  border-radius: 4px;
  padding: 1px 6px;
}

.menu-cell-protein {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 10px;
  font-weight: 700;
  color: var(--success);
  background: rgba(16,185,129,.1);
  border-radius: 4px;
  padding: 1px 6px;
  margin: 3px 0 3px;
}
.menu-cell-protein i { font-size: 9px; }

.menu-week-summary {
  display: flex;
  align-items: center;
  gap: 24px;
  flex-wrap: wrap;
  margin-top: 14px;
  padding: 12px 16px;
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  font-size: 13px;
  color: var(--text-300);
}
.menu-week-summary strong { color: var(--text-100); }

/* ── Meal Swap Chips ─────────────────────────────────────── */
.menu-cell-alts {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 3px;
  margin-top: 6px;
  padding-top: 6px;
  border-top: 1px solid var(--border);
}
.menu-cell-alt-label {
  font-size: 8px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .5px;
  color: var(--text-500);
  margin-right: 2px;
  flex-shrink: 0;
}
.menu-cell-alt-chip {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-size: 9px;
  font-weight: 600;
  color: var(--text-300);
  background: var(--bg-3);
  border: 1px solid var(--border);
  border-radius: 3px;
  padding: 2px 5px;
  cursor: default;
  white-space: nowrap;
}
.menu-cell-alt-chip:hover {
  color: var(--text-100);
  border-color: var(--accent);
  background: rgba(59,130,246,.08);
}
.menu-cell-alt-chip.chip-bd {
  border-color: rgba(245,158,11,.4);
  color: var(--amber);
  background: rgba(245,158,11,.06);
}
.menu-cell-alt-chip.chip-bd:hover {
  background: rgba(245,158,11,.14);
  border-color: var(--amber);
}
.chip-cost {
  font-size: 8px;
  font-weight: 700;
  color: var(--text-500);
  padding-left: 1px;
}
.menu-cell-alt-chip:hover .chip-cost,
.menu-cell-alt-chip.chip-bd .chip-cost {
  color: inherit;
  opacity: .85;
}

/* ── Protein Vendor Cards ────────────────────────────────── */
.vendor-card {
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 16px 18px;
  margin-bottom: 16px;
}
.vendor-card:last-child { margin-bottom: 0; }
.vendor-card-header {
  margin-bottom: 14px;
}
.vendor-card-title {
  font-size: 15px;
  font-weight: 700;
  color: var(--text-100);
  margin-bottom: 4px;
}
.vendor-card-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  font-size: 12px;
  color: var(--text-400);
}
.vendor-card-used { }
.vendor-card-serving {
  color: var(--text-500);
  font-style: italic;
}
.vendor-tiles {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}
.vendor-tile {
  background: var(--bg-1);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 12px 14px;
  display: flex;
  flex-direction: column;
  gap: 5px;
  position: relative;
}
.vendor-tile.tile-best {
  border-color: var(--success);
  background: rgba(16,185,129,.04);
}
.vendor-tile.tile-quote {
  opacity: .75;
}
.vendor-tile-label {
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .8px;
  color: var(--text-300);
}
.vendor-badge {
  display: inline-block;
  font-size: 10px;
  font-weight: 700;
  padding: 2px 7px;
  border-radius: 4px;
  width: fit-content;
}
.vendor-badge.best    { background: rgba(16,185,129,.15); color: var(--success); }
.vendor-badge.current { background: rgba(59,130,246,.12); color: var(--accent); }
.vendor-badge.quote   { background: var(--bg-3); color: var(--text-400); }
.vendor-badge.avail   { background: rgba(245,158,11,.1); color: var(--amber); }
.vendor-tile-price {
  font-size: 22px;
  font-weight: 900;
  color: var(--text-100);
  line-height: 1.1;
}
.vendor-tile-price.tbd {
  font-size: 28px;
  color: var(--text-500);
}
.vendor-tile-unit {
  font-size: 11px;
  font-weight: 500;
  color: var(--text-400);
  margin-left: 2px;
}
.vendor-tile-pack {
  font-size: 11px;
  color: var(--text-400);
}
.vendor-tile-note {
  font-size: 11px;
  color: var(--text-500);
  font-style: italic;
  margin-top: 2px;
}
@media (max-width: 640px) {
  .vendor-tiles { grid-template-columns: 1fr; }
}

.vendor-tile-meal {
  font-size: 11px;
  color: var(--text-500);
  margin-top: -3px;
}

/* ── Big Daddy Invoice ───────────────────────────────────── */
.bd-inv-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  background: rgba(245,158,11,.06);
  border: 1px solid rgba(245,158,11,.25);
  border-radius: var(--radius);
  padding: 16px 20px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}
.bd-inv-name {
  font-size: 17px;
  font-weight: 800;
  color: var(--text-100);
  margin-bottom: 8px;
}
.bd-inv-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.bd-pill {
  font-size: 11px;
  color: var(--text-300);
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: 3px 8px;
}
.bd-pill strong {
  color: var(--text-400);
  margin-right: 4px;
  font-weight: 700;
}
.bd-inv-total-box {
  text-align: right;
  flex-shrink: 0;
}
.bd-inv-total-lbl { font-size: 11px; color: var(--text-400); text-transform: uppercase; letter-spacing: .6px; }
.bd-inv-total-val { font-size: 28px; font-weight: 900; color: var(--amber); line-height: 1.1; }
.bd-inv-total-sub { font-size: 11px; color: var(--text-500); }

/* Invoice table */
.bd-table-scroll { overflow-x: auto; margin-bottom: 24px; }
.bd-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
}
.bd-table thead tr {
  background: var(--bg-3);
  border-bottom: 2px solid var(--border);
}
.bd-table th {
  padding: 8px 10px;
  font-weight: 700;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .5px;
  color: var(--text-400);
  white-space: nowrap;
}
.bd-table td {
  padding: 10px 10px;
  border-bottom: 1px solid var(--border);
  color: var(--text-200);
  vertical-align: middle;
}
.bd-table tbody tr:hover { background: var(--bg-2); }
.bd-table .r { text-align: right; font-variant-numeric: tabular-nums; }
.bd-code   { font-family: monospace; font-size: 11px; color: var(--text-400); white-space: nowrap; }
.bd-desc   { font-weight: 600; color: var(--text-100); min-width: 180px; }
.bd-pack   { white-space: nowrap; color: var(--text-400); font-size: 11px; }
.bd-use    { font-size: 11px; color: var(--text-400); min-width: 160px; }
.bd-linetotal { font-weight: 800; color: var(--text-100); }
.bd-grand  { background: var(--bg-3); border-top: 2px solid var(--border); }
.bd-grand td { padding: 12px 10px; }

/* Detail cards grid */
.bd-detail-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  margin-bottom: 20px;
}
.bd-detail-card {
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  overflow: hidden;
}
.bd-detail-header {
  background: var(--bg-3);
  padding: 12px 16px;
  border-bottom: 1px solid var(--border);
}
.bd-detail-code {
  font-size: 10px;
  font-family: monospace;
  color: var(--amber);
  font-weight: 700;
  margin-bottom: 2px;
}
.bd-detail-desc {
  font-size: 14px;
  font-weight: 700;
  color: var(--text-100);
  margin-bottom: 3px;
}
.bd-detail-meta { font-size: 11px; color: var(--text-400); }
.bd-detail-body {
  display: flex;
  gap: 0;
}
.bd-portion-wrap {
  flex: 1;
  border-right: 1px solid var(--border);
}
.bd-portion-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
}
.bd-portion-table th {
  padding: 6px 10px;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .4px;
  color: var(--text-500);
  background: var(--bg-1);
  border-bottom: 1px solid var(--border);
}
.bd-portion-table td {
  padding: 7px 10px;
  border-bottom: 1px solid var(--border);
  font-size: 12px;
  color: var(--text-300);
}
.bd-portion-table tbody tr:last-child td { border-bottom: none; }
.bd-price-em {
  font-weight: 800;
  font-size: 13px;
  color: var(--success);
}
.bd-detail-right {
  width: 220px;
  flex-shrink: 0;
  padding: 12px 14px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.bd-kpi-row {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.bd-kpi {
  flex: 1;
  min-width: 55px;
  text-align: center;
  background: var(--bg-1);
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 6px 4px;
}
.bd-kpi-val { font-size: 13px; font-weight: 800; color: var(--text-100); }
.bd-kpi-lbl { font-size: 9px; color: var(--text-500); margin-top: 1px; text-transform: uppercase; }
.bd-use-note {
  font-size: 11px;
  color: var(--text-400);
  font-style: italic;
  line-height: 1.4;
}
.bd-savings-row { border-top: 1px solid var(--border); padding-top: 8px; }
.bd-savings-label { font-size: 10px; color: var(--text-500); margin-bottom: 5px; }
.bd-savings-nums { display: flex; flex-wrap: wrap; gap: 4px; }
.bd-save-chip {
  font-size: 10px;
  font-weight: 700;
  padding: 2px 7px;
  border-radius: 4px;
  background: rgba(16,185,129,.12);
  color: var(--success);
  white-space: nowrap;
}
.bd-save-annual {
  background: rgba(245,158,11,.12);
  color: var(--amber);
}

/* Savings summary banner */
.bd-savings-banner {
  display: flex;
  align-items: center;
  gap: 16px;
  background: rgba(16,185,129,.07);
  border: 1px solid rgba(16,185,129,.3);
  border-radius: var(--radius);
  padding: 16px 20px;
  margin-top: 4px;
}
.bd-savings-banner-icon {
  font-size: 28px;
  color: var(--success);
  flex-shrink: 0;
}
.bd-savings-banner-title {
  font-size: 15px;
  font-weight: 800;
  color: var(--text-100);
}
.bd-savings-banner-detail {
  font-size: 12px;
  color: var(--text-400);
  margin-top: 2px;
}
.bd-savings-banner-val {
  font-size: 28px;
  font-weight: 900;
  color: var(--success);
  margin-left: auto;
  flex-shrink: 0;
  white-space: nowrap;
}

@media (max-width: 900px) {
  .bd-detail-grid { grid-template-columns: 1fr; }
  .bd-detail-right { width: 100%; border-top: 1px solid var(--border); }
  .bd-detail-body { flex-direction: column; }
  .bd-portion-wrap { border-right: none; }
}

/* ============================================================
   PROTEIN VENDOR COMPARISON TABLE  (.pvt-*)
   ============================================================ */

.pvt-wrap {
  margin-bottom: 28px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  overflow: hidden;
}
.pvt-header {
  padding: 14px 18px 10px;
  background: var(--bg-card);
  border-bottom: 1px solid var(--border);
}
.pvt-title {
  font-size: 14px;
  font-weight: 700;
  color: var(--text-100);
}
.pvt-subtitle {
  font-size: 12px;
  color: var(--text-400);
  margin-top: 2px;
}
.pvt-scroll {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.pvt-table {
  width: 100%;
  min-width: 820px;
  border-collapse: collapse;
  font-size: 12px;
  background: var(--bg-surface);
}
.pvt-th {
  background: var(--bg-card);
  color: var(--text-300);
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .05em;
  padding: 8px 12px;
  border-bottom: 1px solid var(--border-strong);
  border-right: 1px solid var(--border);
  white-space: nowrap;
  text-align: center;
}
.pvt-th-name { text-align: left; min-width: 150px; }
.pvt-th-use  { text-align: left; }
.pvt-th-pfg    { color: #60a5fa; }
.pvt-th-shaver { color: #34d399; }
.pvt-th-bd     { color: var(--amber); }
.pvt-th-best   { color: var(--text-200); }

.pvt-row { border-bottom: 1px solid var(--border); }
.pvt-row:last-child { border-bottom: none; }
.pvt-row:hover { background: var(--bg-card-hover); }

.pvt-td {
  padding: 9px 12px;
  color: var(--text-200);
  border-right: 1px solid var(--border);
  text-align: center;
  font-weight: 600;
  white-space: nowrap;
}
.pvt-td-name { text-align: left; font-weight: 700; color: var(--text-100); }
.pvt-td-srv  { color: var(--text-400); font-size: 11px; font-weight: 400; }
.pvt-td-use  { text-align: left; font-size: 11px; font-weight: 400; color: var(--text-400); white-space: normal; min-width: 160px; }
.pvt-td-best { white-space: nowrap; }

.pvt-tbd { color: var(--text-400); font-weight: 400; }
.pvt-quote { font-size: 9px; color: var(--text-400); margin-top: 2px; }

.pvt-best-cell {
  background: rgba(16,185,129,0.08);
  color: var(--green) !important;
  position: relative;
}
.pvt-best-star {
  font-size: 9px;
  vertical-align: super;
  margin-left: 2px;
  color: var(--green);
}

.pvt-best-chip {
  display: inline-block;
  padding: 2px 9px;
  border-radius: 20px;
  font-size: 11px;
  font-weight: 700;
}
.pvt-best-pfg    { background: rgba(96,165,250,.15); color: #60a5fa; border: 1px solid rgba(96,165,250,.3); }
.pvt-best-shaver { background: rgba(52,211,153,.15); color: #34d399; border: 1px solid rgba(52,211,153,.3); }
.pvt-best-bigDaddy { background: rgba(245,158,11,.15); color: var(--amber); border: 1px solid rgba(245,158,11,.3); }
.pvt-best-none   { background: var(--bg-card); color: var(--text-400); border: 1px solid var(--border); }

.pvt-save-tag {
  display: block;
  font-size: 10px;
  font-weight: 600;
  color: var(--green);
  margin-top: 3px;
}

/* ============================================================
   BIG DADDY INMATE COUNT BAR
   ============================================================ */

.bd-inmate-bar {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 18px;
  background: rgba(245,158,11,0.06);
  border: 1px solid rgba(245,158,11,0.2);
  border-radius: var(--radius);
  margin-bottom: 18px;
  font-size: 13px;
  color: var(--text-300);
  flex-wrap: wrap;
}
.bd-inmate-input {
  width: 80px;
  padding: 5px 10px;
  border-radius: 6px;
  border: 1px solid rgba(245,158,11,0.4);
  background: var(--bg-input);
  color: var(--text-100);
  font-size: 14px;
  font-weight: 700;
  text-align: center;
  outline: none;
}
.bd-inmate-input:focus { border-color: var(--amber); box-shadow: 0 0 0 2px rgba(245,158,11,0.15); }
.bd-inmate-hint {
  font-size: 11px;
  color: var(--text-400);
}

/* ============================================================
   PROTEIN TABLE — CLICKABLE PRICE CELLS  (additions to .pvt-*)
   ============================================================ */

/* Clickable price cells */
.pvt-price-cell {
  cursor: pointer;
  position: relative;
  transition: background .12s, transform .08s;
}
.pvt-price-cell:hover {
  background: rgba(255,255,255,0.06) !important;
  transform: scale(1.04);
  z-index: 1;
  box-shadow: 0 2px 12px rgba(0,0,0,0.25);
}
.pvt-best-cell.pvt-price-cell:hover {
  background: rgba(16,185,129,0.18) !important;
}
.pvt-tbd {
  cursor: pointer;
  transition: background .12s;
}
.pvt-tbd:hover { background: rgba(255,255,255,0.04) !important; }

.pvt-price-val  { font-size: 13px; font-weight: 800; }
.pvt-click-hint {
  display: none;
  font-size: 9px;
  color: var(--text-400);
  margin-top: 2px;
  font-weight: 400;
  letter-spacing: .03em;
}
.pvt-price-cell:hover .pvt-click-hint,
.pvt-tbd:hover .pvt-click-hint { display: block; }

/* Quotes in non-price cells */
.pvt-nd { font-size: 13px; font-weight: 600; color: var(--text-400); }
.pvt-quote-btn {
  display: none;
  font-size: 9px;
  color: var(--accent);
  margin-top: 2px;
  font-weight: 600;
}
.pvt-tbd:hover .pvt-quote-btn { display: block; }

/* Verification dots */
.pvt-verified-dot, .pvt-unverified-dot {
  display: inline-block;
  width: 7px; height: 7px;
  border-radius: 50%;
  margin-left: 4px;
  vertical-align: middle;
}
.pvt-verified-dot   { background: var(--green); }
.pvt-unverified-dot { background: var(--amber); }

/* Column header hint */
.pvt-th-hint {
  display: block;
  font-size: 8px;
  font-weight: 400;
  color: var(--text-400);
  letter-spacing: 0;
  text-transform: none;
  margin-top: 1px;
}

/* Legend bar */
.pvt-legend {
  display: flex;
  align-items: center;
  gap: 18px;
  flex-wrap: wrap;
  padding: 10px 18px;
  border-top: 1px solid var(--border);
  background: var(--bg-card);
  font-size: 11px;
  color: var(--text-400);
}
.pvt-leg-item { display: flex; align-items: center; gap: 5px; }
.pvt-leg-click { margin-left: auto; color: var(--accent); font-weight: 600; }

/* ============================================================
   PRICE REFERENCE MODAL  (.prf-*)
   ============================================================ */

#price-ref-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.6);
  z-index: 900;
  backdrop-filter: blur(2px);
}
#price-ref-overlay.open { display: block; }

#price-ref-modal {
  display: none;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -48%) scale(0.96);
  width: min(560px, 94vw);
  max-height: 88vh;
  overflow-y: auto;
  background: var(--bg-card);
  border: 1px solid var(--border-strong);
  border-radius: 14px;
  box-shadow: 0 24px 60px rgba(0,0,0,0.55);
  z-index: 901;
  transition: transform .18s ease, opacity .18s ease;
  opacity: 0;
}
#price-ref-modal.open {
  display: block;
  transform: translate(-50%, -50%) scale(1);
  opacity: 1;
}

.prf-close {
  position: absolute;
  top: 12px; right: 14px;
  background: none;
  border: none;
  color: var(--text-400);
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
  padding: 2px 6px;
  border-radius: 4px;
  transition: color .1s, background .1s;
}
.prf-close:hover { color: var(--text-100); background: var(--bg-card-hover); }

/* Header */
.prf-header {
  padding: 20px 20px 16px 20px;
  border-bottom: 1px solid var(--border);
  padding-left: 20px;
  margin-left: 0;
  border-radius: 14px 14px 0 0;
  background: var(--bg-surface);
}
.prf-header-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
  flex-wrap: wrap;
}
.prf-protein-name {
  font-size: 18px;
  font-weight: 800;
  color: var(--text-100);
  line-height: 1.2;
}
.prf-vendor-name {
  font-size: 13px;
  font-weight: 600;
  margin-top: 3px;
  letter-spacing: .02em;
}

/* Verification badges */
.prf-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  font-weight: 700;
  padding: 4px 12px;
  border-radius: 20px;
  white-space: nowrap;
  flex-shrink: 0;
}
.prf-verified   { background: rgba(16,185,129,.12); color: var(--green); border: 1px solid rgba(16,185,129,.3); }
.prf-unverified { background: rgba(245,158,11,.12); color: var(--amber); border: 1px solid rgba(245,158,11,.3); }

/* KPI tiles in header */
.prf-kpi-row {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}
.prf-kpi {
  text-align: center;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 8px 14px;
  min-width: 80px;
}
.prf-kpi-serving {
  border-color: var(--border-accent);
  background: var(--accent-dim);
}
.prf-kpi-val {
  font-size: 15px;
  font-weight: 800;
  color: var(--text-100);
  line-height: 1.2;
}
.prf-kpi-lbl {
  font-size: 9px;
  color: var(--text-400);
  text-transform: uppercase;
  letter-spacing: .06em;
  margin-top: 2px;
}
.prf-kpi-lbl small { font-size: 9px; display: block; }

/* Body sections */
.prf-body { padding: 18px 20px 20px; }

.prf-source-label {
  font-size: 9px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--text-400);
  margin-bottom: 5px;
}
.prf-source-block,
.prf-item-block,
.prf-calc-block {
  margin-bottom: 16px;
  padding: 12px 14px;
  background: var(--bg-surface);
  border: 1px solid var(--border);
  border-radius: 8px;
}
.prf-source-doc {
  font-size: 14px;
  font-weight: 700;
  color: var(--text-100);
  margin-bottom: 4px;
}
.prf-source-date {
  font-size: 12px;
  color: var(--text-300);
}
.prf-item-desc {
  font-size: 13px;
  color: var(--text-200);
  line-height: 1.5;
}
.prf-calc-detail {
  font-size: 13px;
  font-family: 'Space Grotesk', monospace;
  color: var(--text-200);
  font-weight: 600;
  line-height: 1.5;
}
.prf-line-total {
  font-size: 12px;
  color: var(--text-300);
  margin-top: 6px;
}
.prf-caveat {
  font-size: 12px;
  color: var(--amber);
  background: rgba(245,158,11,.08);
  border: 1px solid rgba(245,158,11,.2);
  border-radius: 7px;
  padding: 10px 14px;
  margin-bottom: 14px;
  line-height: 1.5;
}
.prf-bd-link {
  font-size: 12px;
  color: var(--text-300);
  background: rgba(245,158,11,.06);
  border: 1px solid rgba(245,158,11,.15);
  border-radius: 7px;
  padding: 10px 14px;
  margin-bottom: 14px;
  line-height: 1.5;
}
.prf-no-ref {
  font-size: 13px;
  color: var(--text-400);
  padding: 16px;
  background: var(--bg-surface);
  border: 1px solid var(--border);
  border-radius: 8px;
  line-height: 1.5;
}

/* ============================================================
   PRINT LAYOUT — 4-Week Menu Rotation
   ============================================================ */

/* Hide print containers on screen */
#print-menu-wrap,
#mgr-section-print-wrap { display: none; }

/* ── Manager section print ──────────────────────────────── */
@media print {
  /* When body has .mgr-section-printing: hide app, show section clone */
  body.mgr-section-printing .app,
  body.mgr-section-printing #app-shell { display: none !important; }

  /* #mgr-section-print-wrap is a direct body child — specificity 0,1,1,1
     beats body > *:not(#main) at 0,1,0,1 so it wins even under that rule */
  body.mgr-section-printing #mgr-section-print-wrap {
    display: block !important;
    font-family: 'Inter', Arial, sans-serif;
    color: #000 !important;
    background: #fff;
    padding: 0;
    margin: 0;
  }

  /* Force all text black and readable */
  body.mgr-section-printing #mgr-section-print-wrap *,
  body.mgr-section-printing #mgr-section-print-wrap td,
  body.mgr-section-printing #mgr-section-print-wrap th,
  body.mgr-section-printing #mgr-section-print-wrap span,
  body.mgr-section-printing #mgr-section-print-wrap div,
  body.mgr-section-printing #mgr-section-print-wrap p {
    color: #000 !important;
    font-weight: 600 !important;
  }

  /* Table headers: dark background with white text */
  body.mgr-section-printing #mgr-section-print-wrap th {
    background: #1a1a1a !important;
    color: #fff !important;
    font-weight: 700 !important;
  }

  /* Table rows: clear borders */
  body.mgr-section-printing #mgr-section-print-wrap td,
  body.mgr-section-printing #mgr-section-print-wrap th {
    border: 1px solid #555 !important;
  }

  /* Strip backgrounds that wash out text */
  body.mgr-section-printing #mgr-section-print-wrap [style*="background"],
  body.mgr-section-printing #mgr-section-print-wrap [class*="badge"],
  body.mgr-section-printing #mgr-section-print-wrap [class*="tag"],
  body.mgr-section-printing #mgr-section-print-wrap [class*="chip"] {
    background: transparent !important;
    border: 1px solid #000 !important;
    color: #000 !important;
  }

  /* Force accordion body open in cloned content */
  body.mgr-section-printing .mgr-acc-body    { display: block !important; }
  body.mgr-section-printing .mgr-acc-header  { display: none  !important; }

  /* One week per page — break before Week 2 title */
  body.mgr-section-printing .mgr-menu-scroll + .mgr-section-title {
    page-break-before: always;
    margin-top: 0 !important;
  }
  /* Keep each week's title + table together */
  body.mgr-section-printing .mgr-section-title,
  body.mgr-section-printing .mgr-menu-scroll { page-break-inside: avoid; }

  /* ── Menu table layout ── */
  body.mgr-section-printing .mgr-menu-table { font-size: 11pt !important; min-width: 0 !important; width: 100% !important; }
  body.mgr-section-printing .mgr-menu-table th,
  body.mgr-section-printing .mgr-menu-table td { padding: 8px 10px !important; vertical-align: top; }
  body.mgr-section-printing .mgr-meal-main  { font-size: 11pt !important; font-weight: 700 !important; }
  body.mgr-section-printing .mgr-meal-sub   { font-size: 9pt  !important; }
  body.mgr-section-printing .mgr-meal-sides { font-size: 9pt  !important; }
  body.mgr-section-printing .mgr-meal-meta  { font-size: 9pt  !important; }

  /* ── Order guide layout: fill pages, no forced category breaks ── */
  body.mgr-section-printing .mgr-order-table {
    font-size: 8.5pt !important;
    min-width: 0 !important;
    width: 100% !important;
    border-collapse: collapse;
  }
  body.mgr-section-printing .mgr-order-table th,
  body.mgr-section-printing .mgr-order-table td { padding: 4px 6px !important; vertical-align: top; }
  body.mgr-section-printing .mgr-order-table thead { display: table-header-group; } /* repeat on each page */
  body.mgr-section-printing .mgr-order-table tr   { page-break-inside: avoid; }

  /* Allow categories to flow across pages — only keep header attached to its first row */
  body.mgr-section-printing .mgr-cat-block  { page-break-inside: auto !important; margin-bottom: 8px !important; }
  body.mgr-section-printing .mgr-cat-header { page-break-after: avoid; margin-bottom: 2px !important; }

  /* Order note at top: compact */
  body.mgr-section-printing .mgr-order-note { font-size: 8pt !important; padding: 6px 8px !important; margin-bottom: 8px !important; }

  /* ── Shared overflow + log ── */
  body.mgr-section-printing .mgr-menu-scroll,
  body.mgr-section-printing .mgr-table-wrap,
  body.mgr-section-printing .mgr-log-scroll  { overflow: visible !important; }
  body.mgr-section-printing .mgr-log-table   { font-size: 8.5pt !important; min-width: 0 !important; width: 100% !important; }
  body.mgr-section-printing .mgr-log-table thead th { background: #212934 !important; color: white !important; }
  body.mgr-section-printing .mgr-header { padding-bottom: 10px; margin-bottom: 12px; }
  body.mgr-section-printing * { -webkit-print-color-adjust: exact !important; print-color-adjust: exact !important; }

  /* No-pricing version: hide cost/cal meta row */
  body.mgr-section-printing #mgr-section-print-wrap.mgr-print-no-pricing .mgr-meal-meta { display: none !important; }
}

@media print {
  /* Force color output in print */
  * { -webkit-print-color-adjust: exact !important; print-color-adjust: exact !important; }

  /* Page setup */
  @page { size: landscape; margin: 0.4in; }

  /* Hide the entire screen UI */
  .app, .sidebar, .topbar, #app { display: none !important; }

  /* Show print content */
  #print-menu-wrap {
    display: block !important;
    font-family: 'Inter', Arial, sans-serif;
    color: #111;
    background: #fff;
  }

  /* One page per week */
  .pm-page {
    width: 100%;
    background: #fff;
    padding: 0;
    margin: 0;
  }
  .pm-break { page-break-after: always; }

  /* ---- Header ---- */
  .pm-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    border-bottom: 2.5px solid #212934;
    padding-bottom: 6px;
    margin-bottom: 8px;
  }
  .pm-facility {
    font-size: 13pt;
    font-weight: 800;
    color: #212934;
    letter-spacing: 0.02em;
  }
  .pm-doc-title {
    font-size: 9pt;
    color: #444;
    margin-top: 2px;
  }
  .pm-doc-title strong { color: #212934; }
  .pm-prepared {
    font-size: 7.5pt;
    color: #888;
    margin-top: 2px;
  }
  .pm-week-badge {
    background: #212934;
    color: #fff;
    font-size: 9pt;
    font-weight: 700;
    padding: 4px 12px;
    border-radius: 4px;
    white-space: nowrap;
    margin-top: 2px;
  }

  /* ---- Table ---- */
  .pm-table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
    font-size: 7.5pt;
  }

  /* Header row */
  .pm-th {
    background: #212934;
    color: #fff;
    font-size: 7.5pt;
    font-weight: 700;
    text-align: center;
    padding: 5px 3px;
    border: 1px solid #212934;
    letter-spacing: 0.02em;
  }
  .pm-th-meal {
    width: 68px;
    text-align: left;
    padding-left: 6px;
  }

  /* Row label column */
  .pm-row-label {
    font-size: 7.5pt;
    font-weight: 700;
    text-align: center;
    vertical-align: middle;
    padding: 4px 2px;
    border: 1px solid #ccc;
    letter-spacing: 0.04em;
    text-transform: uppercase;
  }
  .pm-row-label.pm-breakfast { background: #fffbeb; color: #92400e; border-right: 3px solid #f59e0b; }
  .pm-row-label.pm-lunch    { background: #eff6ff; color: #1e40af; border-right: 3px solid #3b82f6; }
  .pm-row-label.pm-dinner   { background: #f0fdf4; color: #166534; border-right: 3px solid #10b981; }
  .pm-totals-lbl {
    background: #f3f4f6;
    color: #374151;
    font-weight: 800;
    border-right: 3px solid #6b7280;
  }

  /* Meal cells */
  .pm-cell {
    vertical-align: top;
    padding: 4px 4px 3px;
    border: 1px solid #ddd;
    line-height: 1.3;
  }
  .pm-cell.pm-breakfast { background: #fffbeb; }
  .pm-cell.pm-lunch     { background: #eff6ff; }
  .pm-cell.pm-dinner    { background: #f0fdf4; }

  .pm-main    { font-size: 7.5pt; font-weight: 700; color: #111; }
  .pm-protein { font-size: 6.5pt; color: #555; margin-top: 1px; }
  .pm-sides   { font-size: 6pt;   color: #777; margin-top: 1px; font-style: italic; }
  .pm-nums    { font-size: 6pt;   color: #333; margin-top: 2px; font-weight: 600; border-top: 1px solid rgba(0,0,0,0.08); padding-top: 2px; }

  /* Totals row */
  .pm-totals-row { background: #f3f4f6; }
  .pm-total-cell {
    text-align: center;
    vertical-align: middle;
    padding: 4px 2px;
    border: 1px solid #ccc;
  }
  .pm-total-cal   { display: block; font-size: 7pt; font-weight: 700; }
  .pm-total-cost  { display: block; font-size: 6.5pt; color: #444; margin-top: 1px; }
  .pm-ok  { color: #166534; }
  .pm-low { color: #b91c1c; }

  /* ---- Summary footer ---- */
  .pm-summary {
    display: flex;
    align-items: center;
    gap: 18px;
    margin-top: 6px;
    padding-top: 5px;
    border-top: 1.5px solid #212934;
    font-size: 7pt;
    color: #444;
  }
  .pm-sum-item { color: #333; }
  .pm-sum-item strong { color: #212934; }
  .pm-sum-right {
    margin-left: auto;
    font-size: 6.5pt;
    color: #aaa;
    font-style: italic;
  }
}

/* ============================================================
   MENU ORDER LIST
   ============================================================ */
.mol-basis-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 6px;
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 10px 16px;
  font-size: 12px;
  font-weight: 500;
  color: var(--text-200);
  margin-bottom: 16px;
}
.mol-sep { color: var(--text-400); }
.mol-grand-total { color: var(--text-100); margin-left: auto; }

.mol-vendor-summary {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin-bottom: 20px;
}
.mol-vs-card {
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 14px 16px;
  text-align: center;
}
.mol-vs-card.mol-vs-shaver   { border-top: 3px solid var(--green); }
.mol-vs-card.mol-vs-bigDaddy { border-top: 3px solid var(--amber); }
.mol-vs-card.mol-vs-pfg      { border-top: 3px solid var(--accent); }
.mol-vs-name   { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--text-300); margin-bottom: 6px; }
.mol-vs-amount { font-size: 1.35em; font-weight: 800; margin-bottom: 4px; }
.mol-vs-meta   { font-size: 11px; color: var(--text-400); }

.mol-vendor-block { overflow: hidden; }
.mol-vb-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 16px;
  background: var(--card-bg);
  border-bottom: 1px solid var(--border);
}
.mol-vb-title {
  font-size: 14px;
  font-weight: 700;
  color: var(--text-100);
  display: flex;
  align-items: center;
  gap: 4px;
  flex-wrap: wrap;
}
.mol-vb-doc {
  font-size: 11px;
  font-weight: 400;
  color: var(--text-400);
  margin-left: 8px;
}
.mol-vb-total {
  font-size: 1.1em;
  font-weight: 800;
  white-space: nowrap;
  margin-left: 12px;
}

.mol-cat-section { border-bottom: 1px solid var(--border); }
.mol-cat-section:last-of-type { border-bottom: none; }
.mol-cat-label {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 16px;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .07em;
  color: var(--text-300);
  background: rgba(255,255,255,.02);
  border-bottom: 1px solid var(--border);
}
.mol-cat-subtotal {
  margin-left: auto;
  font-size: 12px;
  font-weight: 600;
  color: var(--text-200);
  text-transform: none;
  letter-spacing: 0;
}

.mol-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.mol-table th { padding: 7px 12px; text-align: left; font-size: 11px; font-weight: 600; color: var(--text-400); text-transform: uppercase; letter-spacing: .05em; border-bottom: 1px solid var(--border); background: var(--card-bg); }
.mol-table td { padding: 8px 12px; border-bottom: 1px solid rgba(255,255,255,.04); vertical-align: middle; }
.mol-table tbody tr:last-child td { border-bottom: none; }
.mol-table tbody tr:hover td { background: rgba(255,255,255,.03); }
.mol-table tfoot td { padding: 7px 12px; background: rgba(255,255,255,.03); font-size: 12px; }
.mol-table th.right, .mol-table td.right { text-align: right; }
.mol-basis-col { max-width: 220px; color: var(--text-400) !important; }

.mol-row-est td { opacity: .85; }
.mol-est-badge {
  display: inline-block;
  font-size: 9px;
  font-weight: 700;
  padding: 1px 5px;
  border-radius: 4px;
  background: rgba(245,158,11,.15);
  color: var(--amber);
  border: 1px solid rgba(245,158,11,.3);
  vertical-align: middle;
  margin-left: 4px;
  cursor: help;
  text-transform: uppercase;
  letter-spacing: .04em;
}

.mol-vb-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 16px;
  background: rgba(255,255,255,.02);
  font-size: 12px;
  font-weight: 600;
  color: var(--text-300);
  border-top: 1px solid var(--border);
}
.mol-vb-footer-total { font-size: 14px; font-weight: 800; }

@media (max-width: 768px) {
  .mol-vendor-summary { grid-template-columns: 1fr; }
  .mol-basis-bar { font-size: 11px; }
  .mol-grand-total { margin-left: 0; }
  .mol-basis-col { display: none; }
}

/* ======================================================
   CAFÉ ANALYSIS STYLES
   ====================================================== */

/* Stats grid */
.cafe-stats-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 16px;
  margin-bottom: 20px;
}
.cafe-stat-card {
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 18px 20px;
  display: flex;
  align-items: flex-start;
  gap: 14px;
}
.cafe-stat-icon {
  width: 42px; height: 42px;
  border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  font-size: 18px;
  flex-shrink: 0;
}
.cafe-stat-body { flex: 1; min-width: 0; }
.cafe-stat-value { font-size: 24px; font-weight: 800; line-height: 1; margin-bottom: 4px; }
.cafe-stat-label { font-size: 12px; font-weight: 600; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 2px; }
.cafe-stat-note  { font-size: 11px; color: var(--text-muted); }

/* Alert banner */
.cafe-alert-banner {
  background: #fef2f220;
  border: 1px solid #fca5a580;
  border-left: 4px solid #dc2626;
  border-radius: 10px;
  padding: 14px 18px;
  display: flex;
  gap: 12px;
  align-items: flex-start;
  font-size: 13px;
  color: var(--text);
  line-height: 1.5;
}
.cafe-alert-banner > i { color: #dc2626; font-size: 18px; margin-top: 1px; flex-shrink: 0; }
.cafe-alert-banner strong { color: #dc2626; }

/* Financials table */
.cafe-table-wrap { overflow-x: auto; border-radius: 10px; border: 1px solid var(--border); }
.cafe-fin-table {
  width: 100%; border-collapse: collapse; font-size: 13px;
}
.cafe-fin-table th {
  background: var(--bg-alt);
  padding: 10px 14px;
  text-align: left;
  font-weight: 600;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--text-muted);
  border-bottom: 1px solid var(--border);
  white-space: nowrap;
}
.cafe-fin-table td {
  padding: 9px 14px;
  border-bottom: 1px solid var(--border-light, var(--border));
  vertical-align: middle;
}
.cafe-fin-table tbody tr:hover { background: var(--hover-bg, rgba(0,0,0,0.02)); }
.cafe-fin-table tfoot td { background: var(--bg-alt); font-size: 13px; }
.cafe-week-cell { white-space: nowrap; font-weight: 500; }

.cafe-pct-badge {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 3px 9px; border-radius: 20px; font-size: 12px; font-weight: 700;
  border: 1px solid transparent;
  white-space: nowrap;
}
.cafe-pct-lbl { font-size: 10px; font-weight: 500; opacity: 0.8; }
.cafe-fin-avg td { padding: 11px 14px; }

.cafe-legend {
  display: flex; flex-wrap: wrap; gap: 14px;
  margin-top: 12px; padding: 8px 4px;
  font-size: 12px;
}
.cafe-leg-item { display: flex; align-items: center; gap: 5px; }

/* Opportunities */
.cafe-opp-summary {
  background: linear-gradient(135deg, #14532d10, #15803d15);
  border: 1px solid #16a34a40;
  border-radius: 12px;
  padding: 18px 22px;
  margin-bottom: 20px;
}
.cafe-opp-summary-inner { display: flex; align-items: baseline; flex-wrap: wrap; gap: 10px; }
.cafe-opp-summary-label { font-size: 13px; color: var(--text-muted); }
.cafe-opp-summary-range { font-size: 26px; font-weight: 800; color: #166534; }
.cafe-opp-summary-note  { font-size: 12px; color: var(--text-muted); }

.cafe-opp-list { display: flex; flex-direction: column; gap: 14px; }
.cafe-opp-card {
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 18px 20px;
  display: flex;
  gap: 16px;
  align-items: flex-start;
}
.cafe-opp-rank {
  width: 52px; height: 52px;
  border-radius: 12px;
  border: 1px solid;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 1px; flex-shrink: 0;
}
.cafe-opp-rank i { font-size: 16px; }
.cafe-opp-rank-num { font-size: 10px; font-weight: 700; }
.cafe-opp-body { flex: 1; min-width: 0; }
.cafe-opp-header { display: flex; align-items: flex-start; gap: 10px; flex-wrap: wrap; margin-bottom: 8px; }
.cafe-opp-title { font-size: 15px; font-weight: 700; color: var(--text); flex: 1; min-width: 0; }
.cafe-opp-priority {
  padding: 3px 9px; border-radius: 20px; font-size: 11px; font-weight: 600;
  white-space: nowrap; flex-shrink: 0;
}
.cafe-opp-detail { font-size: 13px; color: var(--text-muted); line-height: 1.55; margin: 0 0 12px; }
.cafe-opp-impact {
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px;
  background: var(--bg-alt); border-radius: 8px; padding: 10px 14px;
}
.cafe-opp-impact-item { display: flex; flex-direction: column; }
.cafe-opp-impact-label { font-size: 10px; text-transform: uppercase; letter-spacing: 0.05em; color: var(--text-muted); }
.cafe-opp-impact-value { font-size: 14px; font-weight: 700; color: var(--text); }
.cafe-opp-impact-sep { width: 1px; height: 30px; background: var(--border); }
.cafe-opp-action {
  flex: 1; min-width: 200px;
  font-size: 12px; color: #991b1b;
  display: flex; align-items: flex-start; gap: 6px; line-height: 1.45;
}
.cafe-opp-action i { flex-shrink: 0; margin-top: 2px; }

/* Ingredients */
.cafe-ing-summary-bar {
  display: flex; flex-wrap: wrap; gap: 12px;
  margin-bottom: 20px; padding: 14px 16px;
  background: var(--bg-alt); border-radius: 10px; border: 1px solid var(--border);
}
.cafe-ing-bar-item {
  display: flex; align-items: center; gap: 7px;
  font-size: 13px; font-weight: 600;
}
.cafe-ing-bar-item.green  { color: #16a34a; }
.cafe-ing-bar-item.red    { color: #dc2626; }
.cafe-ing-bar-item.blue   { color: #2563eb; }
.cafe-ing-bar-item.orange { color: #d97706; }

.cafe-ing-category { margin-bottom: 24px; }
.cafe-ing-cat-title {
  font-size: 12px; font-weight: 700; text-transform: uppercase;
  letter-spacing: 0.07em; color: var(--text-muted);
  padding: 8px 0 6px; margin-bottom: 4px;
  border-bottom: 1px solid var(--border);
}
.cafe-ing-table { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.cafe-ing-table th {
  background: var(--bg-alt); padding: 8px 12px;
  text-align: left; font-weight: 600; font-size: 11px;
  text-transform: uppercase; letter-spacing: 0.04em;
  color: var(--text-muted); border-bottom: 1px solid var(--border);
}
.cafe-ing-table td { padding: 8px 12px; border-bottom: 1px solid var(--border-light, var(--border)); vertical-align: top; }
.cafe-ing-row.needs { background: #fef2f208; }
.cafe-ing-row.needs:hover { background: #fef2f215; }
.cafe-ing-note { font-size: 11px; color: #ea580c; margin-top: 3px; display: flex; gap: 4px; align-items: flex-start; }
.cafe-ing-note i { flex-shrink: 0; margin-top: 1px; }
.cafe-ing-freq { color: var(--text-muted); font-size: 12px; }
.cafe-ing-cost { font-weight: 600; white-space: nowrap; }
.cafe-shaver-save { display: block; font-size: 10px; font-weight: 500; color: #16a34a; margin-top: 2px; }
.cafe-status-badge {
  display: inline-block; padding: 2px 8px; border-radius: 20px;
  font-size: 10px; font-weight: 600; white-space: nowrap;
}
.cafe-status-badge.known       { background: #dcfce7; color: #15803d; }
.cafe-status-badge.needs       { background: #fee2e2; color: #dc2626; }
.cafe-status-badge.forestwood  { background: #fef3c7; color: #d97706; }
.cafe-ing-footnote {
  margin-top: 8px; padding: 10px 14px;
  background: var(--bg-alt); border-radius: 8px;
  font-size: 11.5px; color: var(--text-muted);
  display: flex; gap: 7px; align-items: flex-start;
}

/* Rotation */
.cafe-rot-week { margin-bottom: 28px; }
.cafe-rot-week-title {
  font-size: 13px; font-weight: 700; text-transform: uppercase;
  letter-spacing: 0.07em; color: var(--text-muted);
  margin-bottom: 8px; padding-bottom: 6px; border-bottom: 1px solid var(--border);
}
.cafe-rot-scroll { overflow-x: auto; border: 1px solid var(--border); border-radius: 10px; }
.cafe-rot-table { width: 100%; border-collapse: collapse; font-size: 12.5px; min-width: 640px; }
.cafe-rot-table th {
  background: var(--bg-alt); padding: 8px 12px;
  text-align: left; font-weight: 600; font-size: 11px;
  text-transform: uppercase; letter-spacing: 0.04em;
  color: var(--text-muted); border-bottom: 1px solid var(--border);
}
.cafe-rot-table td { padding: 8px 12px; border-bottom: 1px solid var(--border-light, var(--border)); vertical-align: top; }
.cafe-rot-day { font-weight: 700; color: var(--text); white-space: nowrap; width: 50px; }
.cafe-rot-meal { color: var(--text-muted); line-height: 1.5; font-size: 12px; }
.cafe-rot-flagged {
  display: inline-block;
  background: #fef9c3;
  color: #854d0e;
  border: 1px solid #fde68a;
  border-radius: 4px;
  padding: 0 4px;
  font-size: 11px;
  line-height: 1.6;
}
.dark .cafe-rot-flagged { background: #7c2d1220; color: #fb923c; border-color: #7c2d1240; }
.cafe-rot-legend {
  font-size: 12px; color: var(--text-muted); margin-top: 10px;
  display: flex; align-items: center; gap: 8px;
}

/* ======================================================
   CEO EXECUTIVE DASHBOARD STYLES
   ====================================================== */

/* Hero / Summary */
.ceo-hero {
  background: linear-gradient(135deg, #0f172a 0%, #1e293b 60%, #212934 100%);
  border-radius: 16px;
  padding: 32px 36px;
  color: #fff;
  margin-bottom: 4px;
}
.ceo-hero-header { display: flex; align-items: flex-start; justify-content: space-between; flex-wrap: wrap; gap: 8px; margin-bottom: 4px; }
.ceo-hero-title { font-size: 22px; font-weight: 800; display: flex; align-items: center; gap: 10px; }
.ceo-hero-title i { color: #60a5fa; }
.ceo-hero-meta { font-size: 12px; color: #94a3b8; margin-top: 2px; }
.ceo-hero-sub { font-size: 12px; color: #64748b; margin-bottom: 28px; }

.ceo-kpi-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 16px;
  margin-bottom: 24px;
}
.ceo-kpi-card {
  background: rgba(255,255,255,0.07);
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 12px;
  padding: 18px 20px;
  backdrop-filter: blur(4px);
  transition: background 0.2s;
}
.ceo-kpi-card:hover { background: rgba(255,255,255,0.11); }
.ceo-kpi-card.ceo-kpi-alert { border-color: rgba(220,38,38,0.35); background: rgba(220,38,38,0.08); }
.ceo-kpi-label { font-size: 11px; text-transform: uppercase; letter-spacing: 0.06em; color: #94a3b8; margin-bottom: 6px; }
.ceo-kpi-value { font-size: 28px; font-weight: 800; color: #fff; line-height: 1; margin-bottom: 5px; }
.ceo-kpi-note  { font-size: 11px; color: #64748b; }

.ceo-hero-context { display: flex; flex-wrap: wrap; gap: 16px; border-top: 1px solid rgba(255,255,255,0.08); padding-top: 18px; }
.ceo-context-item { display: flex; align-items: center; gap: 8px; font-size: 12.5px; color: #cbd5e1; }

/* Scorecard */
.ceo-scorecard-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 18px;
  margin-bottom: 16px;
}
.ceo-sc-card {
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 20px 22px;
}
.ceo-sc-header { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 16px; }
.ceo-sc-icon { width: 38px; height: 38px; border-radius: 9px; display: flex; align-items: center; justify-content: center; font-size: 16px; flex-shrink: 0; }
.ceo-sc-title-wrap { flex: 1; min-width: 0; }
.ceo-sc-name { font-size: 16px; font-weight: 700; }
.ceo-sc-rev  { font-size: 11px; color: var(--text-muted); margin-top: 1px; }
.ceo-sc-badge { padding: 3px 10px; border-radius: 20px; font-size: 11px; font-weight: 700; white-space: nowrap; flex-shrink: 0; }

.ceo-sc-cogs-row { margin-bottom: 14px; }
.ceo-sc-cogs-nums { display: flex; align-items: baseline; flex-wrap: wrap; gap: 5px; margin-bottom: 10px; }
.ceo-sc-cogs-actual { font-size: 26px; font-weight: 800; line-height: 1; }
.ceo-sc-cogs-label  { font-size: 11px; color: var(--text-muted); }
.ceo-sc-cogs-sep    { font-size: 11px; color: var(--text-muted); margin: 0 2px; }
.ceo-sc-cogs-target { font-size: 16px; font-weight: 700; color: var(--text-muted); }
.ceo-sc-cogs-gap    { font-size: 11px; font-weight: 600; margin-left: 4px; padding: 1px 7px; border-radius: 20px; background: rgba(220,38,38,0.1); }
.ceo-sc-cogs-gap.ok { color: #16a34a; background: #dcfce7; }

.ceo-sc-bar-wrap { position: relative; }
.ceo-sc-bar-bg { height: 8px; background: var(--bg-alt); border-radius: 4px; overflow: visible; position: relative; }
.ceo-sc-bar-fill { height: 100%; border-radius: 4px; transition: width 0.6s ease; }
.ceo-sc-bar-target { position: absolute; top: -3px; bottom: -3px; width: 2px; background: #374151; border-radius: 1px; transform: translateX(-1px); }
.ceo-sc-bar-labels { display: flex; justify-content: space-between; font-size: 10px; color: var(--text-muted); margin-top: 4px; position: relative; }
.ceo-sc-bar-tgt-label { position: absolute; transform: translateX(-50%); font-size: 9px; }

.ceo-sc-detail { font-size: 12.5px; color: var(--text-muted); line-height: 1.55; margin: 0 0 12px; }
.ceo-sc-footer { display: flex; justify-content: space-between; align-items: flex-end; flex-wrap: wrap; gap: 6px; border-top: 1px solid var(--border); padding-top: 12px; }
.ceo-sc-note { font-size: 11.5px; color: var(--text-muted); flex: 1; min-width: 0; }
.ceo-sc-savings { font-size: 12px; font-weight: 700; color: #16a34a; white-space: nowrap; display: flex; align-items: center; gap: 5px; }

.ceo-sc-total-bar {
  background: linear-gradient(90deg, #14532d15, #15803d20);
  border: 1px solid #16a34a40;
  border-radius: 10px;
  padding: 14px 20px;
  font-size: 14px;
  color: var(--text);
  display: flex;
  align-items: center;
  gap: 10px;
}
.ceo-sc-total-bar i { color: #16a34a; font-size: 18px; }
.ceo-sc-total-bar strong { color: #166534; font-size: 16px; }

/* Actions */
.ceo-actions-list { display: flex; flex-direction: column; gap: 12px; }
.ceo-action-card {
  display: flex;
  gap: 0;
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: 12px;
  overflow: hidden;
}
.ceo-ac-left { padding: 22px 18px; display: flex; align-items: flex-start; justify-content: center; background: var(--bg-alt); border-right: 1px solid var(--border); min-width: 56px; }
.ceo-ac-num { width: 32px; height: 32px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 14px; font-weight: 800; }
.ceo-ac-body { flex: 1; padding: 18px 22px; }
.ceo-ac-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; margin-bottom: 8px; }
.ceo-ac-category { font-size: 10px; text-transform: uppercase; letter-spacing: 0.07em; color: var(--text-muted); font-weight: 600; }
.ceo-ac-badges { display: flex; gap: 6px; flex-wrap: wrap; }
.ceo-ac-badge { padding: 2px 9px; border-radius: 20px; font-size: 10px; font-weight: 700; white-space: nowrap; }
.ceo-ac-title { font-size: 16px; font-weight: 700; margin-bottom: 8px; }
.ceo-ac-detail { font-size: 13px; color: var(--text-muted); line-height: 1.55; margin: 0 0 12px; }
.ceo-ac-meta { display: flex; flex-wrap: wrap; gap: 16px; }
.ceo-ac-meta-item { display: flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--text-muted); }
.ceo-ac-meta-item i { color: #6366f1; width: 13px; }
.ceo-ac-meta-item strong { color: var(--text); font-size: 13px; }

/* Trend chart */
.ceo-trend-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 14px;
  margin-bottom: 24px;
}
.ceo-trend-stat {
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 16px 18px;
}
.ceo-trend-stat-v { font-size: 22px; font-weight: 800; }
.ceo-trend-stat-l { font-size: 11px; color: var(--text-muted); margin-top: 3px; }

.ceo-trend-chart-wrap {
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 20px 16px 8px;
  margin-bottom: 20px;
}
.ceo-trend-svg { width: 100%; height: auto; display: block; }
.ceo-trend-x-labels {
  display: flex;
  justify-content: space-between;
  padding: 4px 4px 8px;
  font-size: 10px;
  color: var(--text-muted);
}

.ceo-trend-table-wrap { overflow-x: auto; border: 1px solid var(--border); border-radius: 10px; }
.ceo-trend-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.ceo-trend-table th { background: var(--bg-alt); padding: 9px 14px; text-align: left; font-weight: 600; font-size: 11px; text-transform: uppercase; letter-spacing: 0.04em; color: var(--text-muted); border-bottom: 1px solid var(--border); }
.ceo-trend-table td { padding: 8px 14px; border-bottom: 1px solid var(--border-light, var(--border)); }
.ceo-tr-high { background: #dcfce720; }
.ceo-tr-low  { background: #fee2e220; }
.ceo-tr-flag { font-size: 10px; font-weight: 700; padding: 1px 6px; border-radius: 10px; margin-left: 4px; }
.ceo-tr-flag.high { background: #dcfce7; color: #166534; }
.ceo-tr-flag.low  { background: #fee2e2; color: #991b1b; }

/* Dark mode adjustments */
.dark .ceo-hero { background: linear-gradient(135deg, #020617 0%, #0f172a 60%, #0c1a2e 100%); }
.dark .ceo-kpi-card { background: rgba(255,255,255,0.05); border-color: rgba(255,255,255,0.08); }

/* ── CEO Findings Section ─────────────────────────────────── */
.nav-badge.orange { background: rgba(234,88,12,0.18); color: #f97316; }
.ceo-findings-intro { font-size: 13px; color: var(--text-muted); background: var(--bg-alt); border: 1px solid var(--border); border-radius: 10px; padding: 12px 16px; margin-bottom: 20px; line-height: 1.6; }
.ceo-findings-list { display: flex; flex-direction: column; gap: 16px; }
.ceo-finding-card { background: var(--bg-card); border: 1px solid var(--border); border-radius: 12px; padding: 20px 24px; }
.ceo-finding-header { display: flex; align-items: flex-start; gap: 14px; margin-bottom: 12px; }
.ceo-finding-icon { width: 40px; height: 40px; border-radius: 10px; display: flex; align-items: center; justify-content: center; font-size: 16px; flex-shrink: 0; margin-top: 2px; }
.ceo-finding-title-wrap { flex: 1; }
.ceo-finding-title { font-size: 16px; font-weight: 700; color: var(--text); margin-bottom: 4px; }
.ceo-finding-meta { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.ceo-finding-badge { font-size: 11px; font-weight: 700; padding: 2px 8px; border-radius: 10px; }
.ceo-finding-loc { font-size: 12px; color: var(--text-muted); }
.ceo-finding-loc i { margin-right: 3px; }
.ceo-finding-detail { font-size: 13px; color: var(--text-secondary, var(--text-muted)); line-height: 1.65; margin-bottom: 16px; }
.ceo-finding-numbers { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 10px; }
.ceo-finding-num { background: var(--bg-alt); border: 1px solid var(--border); border-radius: 8px; padding: 10px 14px; }
.ceo-finding-num-val { font-size: 18px; font-weight: 800; margin-bottom: 2px; }
.ceo-finding-num-lbl { font-size: 11px; color: var(--text-muted); font-weight: 500; }

/* ── CEO Navigation Cards (Summary → Sub-sections) ─────── */
.ceo-nav-grid {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-top: 28px;
}
.ceo-nav-card {
  display: flex;
  align-items: center;
  gap: 18px;
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 18px 22px;
  cursor: pointer;
  transition: border-color .15s, box-shadow .15s, transform .12s;
}
.ceo-nav-card:hover {
  border-color: #60a5fa;
  box-shadow: 0 4px 18px rgba(96,165,250,0.12);
  transform: translateY(-1px);
}
.ceo-nav-icon {
  width: 48px;
  height: 48px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  color: #fff;
  flex-shrink: 0;
}
.ceo-nav-body { flex: 1; min-width: 0; }
.ceo-nav-title { font-size: 16px; font-weight: 700; color: var(--text); margin-bottom: 3px; }
.ceo-nav-sub   { font-size: 12.5px; color: var(--text-muted); }
.ceo-nav-arrow { font-size: 14px; color: var(--text-muted); flex-shrink: 0; transition: transform .15s; }
.ceo-nav-card:hover .ceo-nav-arrow { transform: translateX(3px); color: #60a5fa; }

/* ── CEO Back Button ──────────────────────────────────────── */
.ceo-back-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 600;
  color: var(--text-muted);
  cursor: pointer;
  padding: 7px 14px;
  border: 1px solid var(--border);
  border-radius: 8px;
  margin-bottom: 22px;
  transition: color .15s, border-color .15s;
}
.ceo-back-btn:hover { color: #60a5fa; border-color: #60a5fa; }
.ceo-back-btn i { font-size: 12px; }

/* ── Bessemer Action Plan ─────────────────────────────────── */
.bpl-insight-banner { display:flex; gap:14px; align-items:flex-start; background:#fefce8; border:1px solid #fde047; border-radius:12px; padding:16px 18px; margin-bottom:24px; font-size:13px; color:#713f12; line-height:1.65; }
.bpl-insight-banner i { color:#ca8a04; font-size:18px; margin-top:2px; flex-shrink:0; }
.dark .bpl-insight-banner { background:#1c1307; border-color:#713f1240; color:#fde68a; }

.bpl-gap-grid { display:flex; align-items:center; gap:12px; margin-bottom:28px; flex-wrap:wrap; }
.bpl-gap-card { flex:1; min-width:120px; background:var(--card-bg); border:1px solid var(--border); border-radius:12px; padding:16px 18px; text-align:center; }
.bpl-gap-card.bpl-gap-target { border-color:#16a34a30; background:#f0fdf420; }
.bpl-gap-card.bpl-gap-opp    { border-color:#991b1b30; background:#eff6ff20; }
.bpl-gap-label { font-size:11px; font-weight:600; color:var(--text-muted); text-transform:uppercase; letter-spacing:0.04em; margin-bottom:6px; }
.bpl-gap-val   { font-size:26px; font-weight:900; line-height:1.1; }
.bpl-gap-sub   { font-size:11px; color:var(--text-muted); margin-top:4px; }
.bpl-gap-arrow { font-size:20px; color:var(--text-muted); flex-shrink:0; }

.bpl-steps-list { display:flex; flex-direction:column; gap:16px; margin-bottom:28px; }
.bpl-card { background:var(--card-bg); border:1px solid var(--border); border-radius:12px; overflow:hidden; }
.bpl-card-header { display:flex; align-items:flex-start; gap:12px; padding:16px 20px 12px; border-bottom:1px solid var(--border); }
.bpl-step-num { font-size:11px; font-weight:800; color:var(--text-muted); background:var(--bg-alt); border:1px solid var(--border); border-radius:20px; padding:3px 9px; flex-shrink:0; margin-top:3px; }
.bpl-card-icon { width:38px; height:38px; border-radius:10px; display:flex; align-items:center; justify-content:center; font-size:16px; flex-shrink:0; }
.bpl-card-titles { flex:1; }
.bpl-card-title { font-size:15px; font-weight:700; color:var(--text); margin-bottom:5px; }
.bpl-pri-badge { font-size:11px; font-weight:700; padding:2px 9px; border-radius:10px; }
.bpl-impact-col { text-align:right; flex-shrink:0; }
.bpl-impact-val { font-size:16px; font-weight:900; line-height:1.2; }
.bpl-impact-ann { font-size:11px; color:var(--text-muted); margin-top:2px; }
.bpl-card-body { padding:16px 20px; }
.bpl-detail { font-size:13px; color:var(--text-secondary,var(--text-muted)); line-height:1.65; margin:0 0 14px; }
.bpl-how { background:var(--bg-alt); border:1px solid var(--border); border-radius:8px; padding:12px 14px; margin-bottom:10px; }
.bpl-how-lbl { font-size:11px; font-weight:700; color:var(--text); margin-bottom:6px; text-transform:uppercase; letter-spacing:0.04em; }
.bpl-how-lbl i { margin-right:6px; color:#16a34a; }
.bpl-how-text { font-size:13px; color:var(--text-secondary,var(--text-muted)); line-height:1.6; }
.bpl-effort { font-size:12px; color:var(--text-muted); font-style:italic; }
.bpl-effort i { margin-right:5px; }

.bpl-bench-wrap { background:var(--card-bg); border:1px solid var(--border); border-radius:12px; padding:20px; }
.bpl-bench-hdr { display:flex; align-items:center; gap:10px; font-size:14px; font-weight:700; color:var(--text); margin-bottom:14px; }
.bpl-bench-note { font-size:12px; color:var(--text-muted); }
.bpl-bench-caption { font-size:12px; color:var(--text-muted); margin-top:14px; margin-bottom:0; font-style:italic; line-height:1.6; }

/* ── 90-Day Profitability Roadmap ─────────────────────────── */
.rpm-headline-banner { display:grid; grid-template-columns:1fr auto 1fr auto 1fr; align-items:center; background:var(--card-bg); border:1px solid var(--border); border-radius:14px; padding:20px 24px; margin-bottom:24px; gap:16px; }
.rpm-hl-item { text-align:center; }
.rpm-hl-val { font-size:26px; font-weight:900; color:#dc2626; line-height:1.1; }
.rpm-hl-lbl { font-size:11px; color:var(--text-muted); margin-top:4px; font-weight:500; }
.rpm-hl-divider { width:1px; height:48px; background:var(--border); }

.rpm-waterfall { background:var(--card-bg); border:1px solid var(--border); border-radius:14px; padding:22px; margin-bottom:24px; }
.rpm-wf-hdr { font-size:13px; font-weight:700; color:var(--text); margin-bottom:18px; }
.rpm-wf-grid { display:grid; grid-template-columns:1fr 1fr 1fr; gap:24px; }
.rpm-wf-loc { font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:0.05em; color:var(--text-muted); margin-bottom:12px; }
.rpm-wf-bar-wrap { display:flex; align-items:center; gap:8px; margin-bottom:8px; }
.rpm-wf-bar { height:26px; border-radius:4px; display:flex; align-items:center; padding:0 10px; min-width:60px; transition:width .3s; }
.rpm-wf-bar-pct { font-size:12px; font-weight:800; color:#fff; white-space:nowrap; }
.rpm-wf-lbl { font-size:11px; color:var(--text-muted); white-space:nowrap; }
.rpm-wf-savings-track { display:flex; flex-direction:column; gap:12px; }
.rpm-wf-savings-row { display:flex; justify-content:space-between; align-items:center; padding:8px 12px; background:var(--bg-alt); border:1px solid var(--border); border-radius:8px; }
.rpm-wf-savings-row.rpm-wf-grand { border-style:dashed; }
.rpm-wf-savings-lbl { font-size:12px; color:var(--text-muted); }
.rpm-wf-savings-val { font-size:16px; font-weight:800; }
.rpm-wf-note { font-size:10px; color:var(--text-muted); margin-top:10px; font-style:italic; line-height:1.5; }

.rpm-phases-list { display:flex; flex-direction:column; gap:20px; margin-bottom:20px; }
.rpm-phase-card { background:var(--card-bg); border:1px solid var(--border); border-radius:14px; overflow:hidden; }
.rpm-phase-header { display:flex; align-items:flex-start; gap:14px; padding:18px 22px 14px; border-bottom:1px solid var(--border); background:var(--bg-alt); }
.rpm-phase-icon { width:42px; height:42px; border-radius:10px; display:flex; align-items:center; justify-content:center; font-size:17px; flex-shrink:0; margin-top:2px; }
.rpm-phase-titles { flex:1; }
.rpm-phase-label { font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:0.05em; margin-bottom:4px; }
.rpm-phase-title { font-size:17px; font-weight:800; color:var(--text); margin-bottom:4px; }
.rpm-phase-sub { font-size:12px; color:var(--text-muted); }
.rpm-phase-impact { text-align:right; flex-shrink:0; }
.rpm-phase-impact-val { font-size:20px; font-weight:900; line-height:1.2; }
.rpm-phase-impact-ann { font-size:12px; color:var(--text-muted); margin-top:2px; }
.rpm-phase-impact-split { display:flex; gap:8px; justify-content:flex-end; margin-top:4px; }
.rpm-phase-impact-split span { font-size:10px; color:var(--text-muted); background:var(--bg-alt); border:1px solid var(--border); border-radius:4px; padding:2px 6px; }
.rpm-phase-intro { font-size:13px; color:var(--text-muted); padding:14px 22px 10px; font-style:italic; border-bottom:1px solid var(--border); }
.rpm-actions-list { display:flex; flex-direction:column; gap:0; }
.rpm-action-row { display:flex; gap:14px; padding:14px 22px; border-bottom:1px solid var(--border-light,var(--border)); align-items:flex-start; }
.rpm-action-row:last-child { border-bottom:none; }
.rpm-action-loc { font-size:10px; font-weight:700; padding:3px 9px; border-radius:10px; white-space:nowrap; flex-shrink:0; margin-top:3px; }
.rpm-action-loc i { margin-right:4px; }
.rpm-action-body { flex:1; }
.rpm-action-title { font-size:13px; font-weight:700; color:var(--text); margin-bottom:5px; }
.rpm-action-detail { font-size:12px; color:var(--text-muted); line-height:1.6; margin-bottom:6px; }
.rpm-action-impact { font-size:11px; font-weight:700; color:#16a34a; }
.rpm-action-impact i { margin-right:5px; }

.rpm-footnote { font-size:12px; color:var(--text-muted); background:var(--bg-alt); border:1px solid var(--border); border-radius:10px; padding:12px 16px; line-height:1.65; }
.rpm-footnote i { margin-right:6px; color:var(--text-muted); }

@media (max-width: 768px) {
  .rpm-headline-banner { grid-template-columns:1fr; gap:8px; }
  .rpm-hl-divider { width:100%; height:1px; }
  .rpm-wf-grid { grid-template-columns:1fr; }
  .rpm-phase-header { flex-wrap:wrap; }
  .rpm-phase-impact { text-align:left; }
}

/* ── Location Plan of Action (Birmingham / Bessemer) ─────── */
.lp-snapshot { display:flex; align-items:center; gap:12px; margin-bottom:12px; flex-wrap:wrap; }
.lp-snap-card { flex:1; min-width:130px; background:var(--card-bg); border:1px solid var(--border); border-radius:12px; padding:16px 18px; text-align:center; }
.lp-snap-card.lp-snap-target { border-color:#16a34a30; }
.lp-snap-card.lp-snap-gap    { border-color:#991b1b30; }
.lp-snap-label { font-size:11px; font-weight:600; color:var(--text-muted); text-transform:uppercase; letter-spacing:0.04em; margin-bottom:6px; }
.lp-snap-val   { font-size:28px; font-weight:900; line-height:1.1; }
.lp-snap-sub   { font-size:11px; color:var(--text-muted); margin-top:5px; }
.lp-snap-arrow { font-size:22px; color:var(--text-muted); flex-shrink:0; }
.lp-rev-note   { font-size:11px; color:var(--text-muted); margin-bottom:20px; font-style:italic; }
.lp-rev-note i { margin-right:5px; }

.lp-insight { display:flex; gap:12px; align-items:flex-start; background:var(--bg-alt); border-radius:10px; padding:14px 16px; margin-bottom:20px; font-size:13px; color:var(--text-secondary,var(--text-muted)); line-height:1.65; }
.lp-insight i { font-size:16px; margin-top:2px; flex-shrink:0; }

.lp-progress { background:var(--card-bg); border:1px solid var(--border); border-radius:12px; padding:18px 20px; margin-bottom:24px; }
.lp-progress-label { font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:0.05em; color:var(--text-muted); margin-bottom:14px; }
.lp-progress-track { display:flex; flex-direction:column; gap:10px; }
.lp-prog-step { display:flex; align-items:center; gap:10px; }
.lp-prog-bar-wrap { flex:1; background:var(--bg-alt); border-radius:4px; height:28px; overflow:hidden; }
.lp-prog-bar { height:100%; border-radius:4px; display:flex; align-items:center; padding:0 10px; transition:width .4s ease; min-width:50px; }
.lp-prog-pct { font-size:12px; font-weight:800; color:#fff; white-space:nowrap; }
.lp-prog-lbl { font-size:11px; color:var(--text-muted); width:52px; flex-shrink:0; }

.lp-phases-list { display:flex; flex-direction:column; gap:18px; margin-bottom:24px; }
.lp-phase { background:var(--card-bg); border:1px solid var(--border); border-radius:14px; overflow:hidden; }
.lp-phase-header { display:flex; align-items:flex-start; gap:14px; padding:16px 20px; }
.lp-phase-icon { width:40px; height:40px; border-radius:10px; display:flex; align-items:center; justify-content:center; font-size:16px; flex-shrink:0; margin-top:2px; }
.lp-phase-meta { flex:1; }
.lp-phase-tag   { font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:0.05em; margin-bottom:3px; }
.lp-phase-title { font-size:16px; font-weight:800; color:var(--text); margin-bottom:3px; }
.lp-phase-note  { font-size:12px; color:var(--text-muted); }
.lp-phase-savings { text-align:right; flex-shrink:0; }
.lp-phase-sav-wk { font-size:18px; font-weight:900; line-height:1.2; }
.lp-phase-sav-yr { font-size:11px; color:var(--text-muted); margin-top:2px; }

.lp-actions-list { border-top:1px solid var(--border); }
.lp-action { display:flex; gap:14px; padding:14px 20px; border-bottom:1px solid var(--border-light,var(--border)); align-items:flex-start; }
.lp-action:last-child { border-bottom:none; }
.lp-action-num { font-size:12px; font-weight:800; width:26px; height:26px; border-radius:50%; display:flex; align-items:center; justify-content:center; flex-shrink:0; margin-top:2px; }
.lp-action-body { flex:1; }
.lp-action-title  { font-size:13px; font-weight:700; color:var(--text); margin-bottom:5px; }
.lp-action-detail { font-size:12px; color:var(--text-muted); line-height:1.65; margin-bottom:6px; }
.lp-action-impact { font-size:11px; font-weight:700; }
.lp-action-impact i { margin-right:4px; }

.lp-bench { background:var(--card-bg); border:1px solid var(--border); border-radius:12px; padding:18px 20px; }
.lp-bench-hdr { display:flex; align-items:center; gap:9px; font-size:13px; font-weight:700; color:var(--text); margin-bottom:14px; }
.lp-bench-note { font-size:12px; color:var(--text-muted); margin-top:12px; margin-bottom:0; font-style:italic; line-height:1.6; }

@media (max-width:640px) {
  .lp-snapshot { flex-direction:column; }
  .lp-snap-arrow { transform:rotate(90deg); }
  .lp-phase-header { flex-wrap:wrap; }
  .lp-phase-savings { text-align:left; }
}

/* ═══════════════════════════════════════════════════════
   EXECUTIVE CHEAT SHEET — LAYOUT & VISUAL CLEANUP
   ═══════════════════════════════════════════════════════ */

/* Remove sidebar — every pixel is content */
.sidebar,.sidebar-overlay { display:none !important; }
.main { margin-left:0 !important; transition:none !important; }
.hamburger { display:none !important; }

/* Topbar — clean, full-width */
.topbar { padding:0 52px; }

/* Tab bar — full-width, more presence */
.tab-bar { padding:0 52px; height:50px; }
.tab-btn { padding:0 26px; font-size:13.5px; font-weight:600; letter-spacing:.01em; gap:8px; }
[data-theme="light"] .tab-bar { border-bottom:1.5px solid rgba(0,0,0,0.09); }

/* Content — generous whitespace, centered */
.content { padding:44px 60px; max-width:1200px; }

/* Sections — more breathing room */
.section { margin-bottom:72px; }
.section-title { font-size:23px; }
.section-header { margin-bottom:28px; }
.section-icon { width:44px; height:44px; font-size:18px; }

/* Stat cards — bigger, more impactful */
.stats-grid { gap:22px; margin-bottom:44px; grid-template-columns:repeat(4,1fr); }
.stat-card { padding:28px 26px; gap:20px; border-radius:14px; }
.stat-value { font-size:34px; margin-bottom:6px; }
.stat-label { font-size:11.5px; margin-bottom:5px; }
.stat-note { font-size:12px; }
.stat-icon { width:50px; height:50px; font-size:22px; }

/* Cards — more padding */
.card-header { padding:18px 24px; }
.card-title { font-size:14.5px; }

/* Tables — more readable */
thead th { padding:13px 18px; font-size:11.5px; }
tbody td { padding:13px 18px; font-size:13.5px; }

/* Hide per-section export dropdowns — operational noise */
.sec-export-btn { display:none !important; }

/* Two-column layout more spacious */
.two-col { gap:24px; }

/* Overview hero — more presence */
.overview-hero { padding:32px 36px; border-radius:16px; margin-bottom:40px; }
.overview-title { font-size:26px; }
.overview-subtitle { font-size:14px; }

/* Assessment grid */
.assessment-grid { gap:24px; }
.assessment-item { padding:18px 24px; }

/* ── Financials Tab ──────────────────────────────── */
.fin-kpi-grid {
  display: grid; grid-template-columns: repeat(4,1fr); gap: 14px; margin-bottom: 20px;
}
@media (max-width: 900px) { .fin-kpi-grid { grid-template-columns: repeat(2,1fr); } }
@media (max-width: 600px) { .fin-kpi-grid { grid-template-columns: 1fr; } }

/* ── Financials page accordions ─────────────────────────────── */
.fin-acc-section {
  border: 1px solid var(--border);
  border-radius: 10px;
  margin-bottom: 10px;
  overflow: hidden;
}
.fin-acc-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 20px; background: var(--surface);
  cursor: pointer; user-select: none;
  transition: background .15s;
}
.fin-acc-header:hover { background: var(--bg); }
.fin-acc-title {
  display: flex; align-items: center; gap: 10px;
  font-weight: 700; font-size: 14px; color: var(--text);
}
.fin-acc-title i { color: var(--accent); font-size: 15px; }
.fin-acc-chevron {
  color: var(--text-muted); font-size: 12px;
  transition: transform .2s;
}
.fin-acc-section.fin-acc-open .fin-acc-chevron { transform: rotate(180deg); }
.fin-acc-body { display: none; padding: 20px; }
.fin-acc-section.fin-acc-open .fin-acc-body { display: block; }
@media print {
  .fin-acc-section { border: none; margin-bottom: 0; }
  .fin-acc-header { display: none; }
  .fin-acc-body { display: block !important; padding: 0; }
}

/* ── CFO Financial Dashboard ─────────────────────────────────── */
.fin-exec-banner {
  background: linear-gradient(135deg, rgba(59,130,246,0.08) 0%, rgba(59,130,246,0.02) 100%);
  border: 1px solid rgba(59,130,246,0.18);
  border-radius: 10px;
  padding: 20px 24px;
  margin-bottom: 20px;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: 12px;
}
.fin-exec-banner-title { font-size: 18px; font-weight: 800; color: var(--text-100); margin-bottom: 4px; }
.fin-exec-banner-sub   { font-size: 12px; color: var(--text-400); }
.fin-exec-banner-date  { font-size: 11px; font-weight: 600; color: var(--accent); background: rgba(59,130,246,0.1); padding: 4px 10px; border-radius: 20px; white-space: nowrap; }

.fin-hero-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 14px; margin-bottom: 14px; }
.fin-hero-card {
  background: var(--bg-1);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 18px 16px;
  position: relative;
  overflow: hidden;
}
.fin-hero-card::before { content:''; position:absolute; top:0; left:0; right:0; height:3px; }
.fin-hero-card.green::before  { background: #22c55e; }
.fin-hero-card.amber::before  { background: #f59e0b; }
.fin-hero-card.red::before    { background: #ef4444; }
.fin-hero-card.blue::before   { background: var(--accent); }
.fin-hero-card.neutral::before { background: var(--text-400); }
.fin-hero-label { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--text-400); margin-bottom: 8px; }
.fin-hero-value { font-size: 32px; font-weight: 900; color: var(--text-100); line-height: 1; margin-bottom: 5px; }
.fin-hero-sub   { font-size: 11px; color: var(--text-400); }
.fin-hero-delta { font-size: 11px; font-weight: 700; margin-top: 5px; }
.fin-hero-delta.pos { color: #22c55e; }
.fin-hero-delta.neg { color: #ef4444; }
.fin-hero-delta.neu { color: var(--text-400); }

.fin-wc-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; margin-bottom: 14px; }
.fin-wc-card  { background: var(--bg-1); border: 1px solid var(--border); border-radius: 10px; padding: 16px 18px; }
.fin-wc-label { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--text-400); margin-bottom: 6px; }
.fin-wc-value { font-size: 22px; font-weight: 800; color: var(--text-100); margin-bottom: 3px; }
.fin-wc-sub   { font-size: 11px; color: var(--text-400); }

.fin-ratios-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 12px; margin-bottom: 20px; }
.fin-ratio-card  { background: var(--bg-2); border-radius: 8px; padding: 12px 14px; text-align: center; }
.fin-ratio-label { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--text-400); margin-bottom: 6px; }
.fin-ratio-value { font-size: 18px; font-weight: 800; color: var(--text-100); margin-bottom: 2px; }
.fin-ratio-context { font-size: 10px; color: var(--text-400); }

.fin-risk-register { display: flex; flex-direction: column; gap: 8px; }
.fin-risk-item {
  display: flex; gap: 12px; align-items: flex-start;
  background: var(--bg-1); border-radius: 8px; padding: 12px 16px;
}
.fin-risk-item.high  { border-left: 3px solid #ef4444; }
.fin-risk-item.watch { border-left: 3px solid #f59e0b; }
.fin-risk-item.pos   { border-left: 3px solid #22c55e; }
.fin-risk-tag {
  font-size: 9px; font-weight: 800; text-transform: uppercase; letter-spacing: .1em;
  padding: 3px 8px; border-radius: 4px; white-space: nowrap; flex-shrink: 0; margin-top: 1px;
}
.fin-risk-item.high  .fin-risk-tag { background: rgba(239,68,68,0.12);  color: #ef4444; }
.fin-risk-item.watch .fin-risk-tag { background: rgba(245,158,11,0.12); color: #f59e0b; }
.fin-risk-item.pos   .fin-risk-tag { background: rgba(34,197,94,0.12);  color: #22c55e; }
.fin-risk-title { font-size: 12px; font-weight: 700; color: var(--text-100); margin-bottom: 2px; }
.fin-risk-body  { font-size: 12px; color: var(--text-300); line-height: 1.45; }

.fin-section-label {
  font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .1em;
  color: var(--text-400); margin: 22px 0 10px; display: flex; align-items: center; gap: 8px;
}
.fin-section-label::after { content: ''; flex: 1; height: 1px; background: var(--border); }

.fin-comp-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 20px; }
.fin-comp-card { background: var(--bg-1); border: 1px solid var(--border); border-radius: 10px; padding: 18px 20px; }
.fin-comp-year { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .07em; margin-bottom: 14px; }
.fin-comp-row  { display: flex; justify-content: space-between; align-items: baseline; padding: 5px 0; border-bottom: 1px solid var(--border); font-size: 12px; }
.fin-comp-row:last-child { border-bottom: none; padding-bottom: 0; }
.fin-comp-row-label { color: var(--text-400); }
.fin-comp-row-val   { font-weight: 700; color: var(--text-100); }
.fin-comp-row-note  { font-weight: 400; color: var(--text-400); font-size: 10px; margin-left: 5px; }

.fin-bar-list  { display: flex; flex-direction: column; gap: 9px; }
.fin-bar-item  { display: grid; grid-template-columns: 130px 1fr 80px; gap: 12px; align-items: center; font-size: 12px; }
.fin-bar-label { color: var(--text-300); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fin-bar-track { background: var(--bg-2); border-radius: 4px; height: 8px; overflow: hidden; }
.fin-bar-fill  { height: 8px; border-radius: 4px; background: var(--accent); }
.fin-bar-amount { text-align: right; font-weight: 700; color: var(--text-200); }

.fin-cf-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 20px; }
.fin-cf-card  { background: var(--bg-1); border: 1px solid var(--border); border-radius: 10px; padding: 18px 20px; }
.fin-cf-year  { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .07em; margin-bottom: 14px; }
.fin-cf-row   { display: flex; justify-content: space-between; align-items: baseline; padding: 7px 0; border-bottom: 1px solid var(--border); font-size: 12px; }
.fin-cf-row:last-of-type { border-bottom: none; }
.fin-cf-label { color: var(--text-400); }

/* ── CEO Executive Brief additions ───────────────────── */
.fin-narrative {
  background: var(--bg-1); border: 1px solid var(--border); border-radius: 10px;
  padding: 18px 22px; margin-bottom: 16px;
}
.fin-narrative-label {
  font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .1em;
  color: var(--text-400); margin-bottom: 10px;
}
.fin-narrative-body { font-size: 13px; color: var(--text-300); line-height: 1.65; margin: 0; }

.fin-five-grid {
  display: grid; grid-template-columns: repeat(5,1fr); gap: 12px; margin-bottom: 16px;
}
.fin-five-card {
  background: var(--bg-1); border: 1px solid var(--border); border-radius: 10px;
  padding: 16px 14px; border-top: 3px solid var(--border);
}
.fin-five-label   { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .07em; color: var(--text-400); margin-bottom: 8px; }
.fin-five-value   { font-size: 22px; font-weight: 900; color: var(--text-100); line-height: 1; margin-bottom: 5px; }
.fin-five-context { font-size: 10px; color: var(--text-400); }

.fin-health-grid {
  display: grid; grid-template-columns: repeat(4,1fr); gap: 10px; margin-bottom: 20px;
}
.fin-health-item {
  background: var(--bg-1); border: 1px solid var(--border); border-radius: 8px; padding: 12px 14px;
}
.fin-health-name  { font-size: 11px; font-weight: 700; color: var(--text-200); }
.fin-health-value { font-size: 14px; font-weight: 800; margin-bottom: 3px; }
.fin-health-note  { font-size: 10px; color: var(--text-400); line-height: 1.4; }

.fin-action-item  { border-radius: 8px; padding: 14px 16px; }
.fin-action-header { display: flex; align-items: center; gap: 10px; margin-bottom: 7px; }
.fin-action-num   {
  width: 22px; height: 22px; border-radius: 50%; display: flex; align-items: center;
  justify-content: center; font-size: 11px; font-weight: 800; color: #fff; flex-shrink: 0;
}
.fin-action-tag   {
  font-size: 9px; font-weight: 800; text-transform: uppercase; letter-spacing: .1em;
  padding: 2px 8px; border-radius: 4px; white-space: nowrap; flex-shrink: 0;
}
.fin-action-title { font-size: 13px; font-weight: 700; color: var(--text-100); }
.fin-action-body  { font-size: 12px; color: var(--text-300); line-height: 1.55; padding-left: 32px; }

/* ── Monthly trend bar chart ─────────────────────────── */
.fin-chart-wrap  { display: flex; align-items: flex-end; gap: 4px; height: 90px; padding-bottom: 0; }
.fin-chart-col   { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; height: 100%; cursor: default; }
.fin-chart-col-2026 { border-left: 1px dashed rgba(59,130,246,0.3); padding-left: 2px; }
.fin-chart-bar-wrap { width: 100%; flex: 1; display: flex; align-items: flex-end; }
.fin-chart-bar  { width: 100%; border-radius: 3px 3px 0 0; transition: opacity .15s; }
.fin-chart-col:hover .fin-chart-bar { opacity: 0.75; }
.fin-chart-label { font-size: 8px; color: var(--text-400); margin-top: 4px; text-align: center; white-space: nowrap; }

@media (max-width: 960px) {
  .fin-hero-grid   { grid-template-columns: repeat(2,1fr); }
  .fin-wc-grid     { grid-template-columns: 1fr 1fr; }
  .fin-ratios-grid { grid-template-columns: repeat(2,1fr); }
  .fin-comp-grid   { grid-template-columns: 1fr; }
  .fin-cf-grid     { grid-template-columns: 1fr; }
  .fin-five-grid   { grid-template-columns: repeat(3,1fr); }
  .fin-health-grid { grid-template-columns: repeat(2,1fr); }
}
@media (max-width: 600px) {
  .fin-hero-grid   { grid-template-columns: 1fr; }
  .fin-wc-grid     { grid-template-columns: 1fr; }
  .fin-ratios-grid { grid-template-columns: 1fr 1fr; }
  .fin-bar-item    { grid-template-columns: 90px 1fr 65px; }
  .fin-five-grid   { grid-template-columns: 1fr 1fr; }
  .fin-health-grid { grid-template-columns: 1fr; }
  .fin-action-body { padding-left: 0; }
}

/* ═══════════════════════════════════════════════════
   BUSINESS BRIEF — Printable M&A Document
═══════════════════════════════════════════════════ */
.brief-controls {
  display: flex; align-items: center; gap: 14px; margin-bottom: 20px; flex-wrap: wrap;
}
.brief-print-btn {
  display: inline-flex; align-items: center; gap: 8px; background: #212934;
  color: white; border: none; padding: 10px 22px; border-radius: 8px;
  font-weight: 700; font-size: 13px; cursor: pointer; transition: background .15s;
}
.brief-print-btn:hover { background: #1e40af; }
.brief-print-btn i { font-size: 14px; }
.brief-hint { font-size: 12px; color: var(--text-400); }

.brief-doc { max-width: 860px; margin: 0 auto; font-family: -apple-system, 'Segoe UI', Arial, sans-serif; }

.brief-page {
  background: #fff; border: 1px solid #d1d5db;
  border-radius: 10px; padding: 50px 54px;
  margin-bottom: 28px; box-shadow: 0 4px 20px rgba(0,0,0,0.07);
  color: #111827;
}

/* ── Document Header ── */
.brief-header { border-bottom: 3px solid #212934; padding-bottom: 22px; margin-bottom: 32px; display: flex; justify-content: space-between; align-items: flex-start; }
.brief-header-left {}
.brief-company  { font-size: 30px; font-weight: 900; color: #212934; letter-spacing: .04em; line-height: 1; }
.brief-tagline  { font-size: 13px; font-weight: 600; color: #b91c1c; margin-top: 5px; }
.brief-prepared { font-size: 10px; color: #9ca3af; margin-top: 10px; text-transform: uppercase; letter-spacing: .1em; }
.brief-confidential {
  font-size: 9px; font-weight: 800; text-transform: uppercase; letter-spacing: .12em;
  background: #212934; color: white; padding: 4px 10px; border-radius: 4px; white-space: nowrap;
}
.brief-page-header {
  font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: .12em;
  color: #9ca3af; border-bottom: 1px solid #e5e7eb; padding-bottom: 10px; margin-bottom: 28px;
  display: flex; justify-content: space-between;
}

/* ── Sections ── */
.brief-section { margin-bottom: 30px; }
.brief-section:last-child { margin-bottom: 0; }
.brief-section-title {
  font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .12em;
  color: #212934; padding-bottom: 6px; margin-bottom: 14px;
  border-bottom: 2px solid #b91c1c; display: inline-block;
}
.brief-body { font-size: 13px; color: #374151; line-height: 1.72; margin: 0; }
.brief-body + .brief-body { margin-top: 10px; }

/* ── Key Metrics Grid ── */
.brief-metrics-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; }
.brief-metric-card {
  background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 8px;
  padding: 14px 16px; border-top: 3px solid #b91c1c;
}
.brief-metric-label { font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: #6b7280; margin-bottom: 6px; }
.brief-metric-value { font-size: 22px; font-weight: 900; color: #212934; line-height: 1; margin-bottom: 3px; }
.brief-metric-note  { font-size: 10px; color: #6b7280; }

/* ── Brief Tables ── */
.brief-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.brief-table th {
  background: #212934; color: white; padding: 9px 12px;
  text-align: left; font-weight: 700; font-size: 10px; text-transform: uppercase; letter-spacing: .05em;
}
.brief-table th.r, .brief-table td.r { text-align: right; }
.brief-table td { padding: 8px 12px; border-bottom: 1px solid #e5e7eb; color: #374151; font-size: 12px; }
.brief-table tr:nth-child(even) td { background: #f9fafb; }
.brief-table tr.total td { font-weight: 800; background: #fef2f2; color: #212934; border-top: 2px solid #212934; border-bottom: 2px solid #212934; }
.brief-table tr.sub td  { color: #9ca3af; padding-left: 28px; }
.brief-table tr.hi td   { color: #15803d; font-weight: 700; }
.brief-table tr.lo td   { color: #dc2626; }

/* ── Two-column layout ── */
.brief-two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.brief-col-head { font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .1em; color: #212934; margin-bottom: 10px; padding-bottom: 6px; border-bottom: 1px solid #e5e7eb; }

/* ── Bullet list ── */
.brief-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 6px; }
.brief-list li { font-size: 12px; color: #374151; padding-left: 16px; position: relative; line-height: 1.55; }
.brief-list li::before { content: '▸'; position: absolute; left: 0; color: #b91c1c; font-size: 10px; top: 2px; }
.brief-list.tight { gap: 4px; }

/* ── Strategic Roadmap ── */
.brief-roadmap { display: flex; flex-direction: column; gap: 0; border: 1px solid #e5e7eb; border-radius: 8px; overflow: hidden; }
.brief-roadmap-item { display: grid; grid-template-columns: 88px 1fr; }
.brief-roadmap-phase {
  background: #212934; color: white; padding: 14px 12px;
  font-size: 9px; font-weight: 800; text-transform: uppercase; letter-spacing: .1em;
  display: flex; align-items: flex-start; line-height: 1.4;
}
.brief-roadmap-item:not(:last-child) .brief-roadmap-phase { border-bottom: 1px solid #34404f; }
.brief-roadmap-content { padding: 12px 16px; border-bottom: 1px solid #e5e7eb; background: #fff; }
.brief-roadmap-item:last-child .brief-roadmap-content { border-bottom: none; }
.brief-roadmap-title  { font-size: 12px; font-weight: 700; color: #111827; margin-bottom: 5px; }
.brief-roadmap-items  { font-size: 11px; color: #6b7280; line-height: 1.6; }

/* ── Targets grid ── */
.brief-targets-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 10px; }
.brief-target-card {
  background: #fef2f2; border: 1px solid #fecaca; border-radius: 8px; padding: 12px 14px; text-align: center;
}
.brief-target-label { font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: .07em; color: #991b1b; margin-bottom: 6px; }
.brief-target-value { font-size: 18px; font-weight: 900; color: #212934; }
.brief-target-note  { font-size: 10px; color: #6b7280; margin-top: 3px; }

/* ── Acquisition thesis cards ── */
.brief-thesis-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 12px; }
.brief-thesis-card { background: #fef2f2; border: 1px solid #fecaca; border-radius: 8px; padding: 14px 16px; }
.brief-thesis-head { font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .07em; color: #991b1b; margin-bottom: 6px; }
.brief-thesis-body { font-size: 11px; color: #374151; line-height: 1.55; }

/* ── Valuation box ── */
.brief-valuation {
  background: #212934; color: white; border-radius: 10px;
  padding: 28px 32px; text-align: center; margin-top: 24px;
}
.brief-val-label { font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: .12em; opacity: .6; margin-bottom: 8px; }
.brief-val-range { font-size: 40px; font-weight: 900; letter-spacing: -.01em; margin-bottom: 6px; }
.brief-val-basis { font-size: 11px; opacity: .7; margin-bottom: 16px; }
.brief-val-grid  { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; margin-top: 16px; border-top: 1px solid rgba(255,255,255,.2); padding-top: 16px; }
.brief-val-col   { text-align: center; }
.brief-val-col-label { font-size: 9px; opacity: .6; text-transform: uppercase; letter-spacing: .08em; margin-bottom: 4px; }
.brief-val-col-value { font-size: 18px; font-weight: 800; }
.brief-val-disclaimer { font-size: 10px; opacity: .5; margin-top: 14px; font-style: italic; }

/* ══════════════════════════════════════════════════════════
   MANAGER TABS — Birmingham & Bessemer Operations Guide
   ══════════════════════════════════════════════════════════ */

/* Controls bar */
.mgr-controls {
  display: flex; align-items: center; gap: 14px;
  padding: 14px 20px; background: var(--surface); border-bottom: 1px solid var(--border);
  position: sticky; top: 0; z-index: 10;
}
.mgr-print-btn {
  display: flex; align-items: center; gap: 8px;
  padding: 8px 18px; border-radius: 6px;
  background: #1e40af; color: white; border: none; cursor: pointer;
  font-size: 13px; font-weight: 600; letter-spacing: .02em;
}
.mgr-print-btn:hover { background: #1d3fa8; }
.mgr-hint { font-size: 12px; color: var(--text-muted); }

/* Document wrapper */
.mgr-doc { max-width: 1300px; margin: 0 auto; padding: 0 20px 40px; border-radius: 12px; overflow: visible; }

/* Individual page */
.mgr-page {
  background: var(--surface); border: 1px solid var(--border); border-radius: 10px;
  padding: 32px 36px; margin-bottom: 28px;
  box-shadow: 0 1px 4px rgba(0,0,0,.06);
}
.mgr-page-order { padding: 28px 24px; }

/* Facility header */
.mgr-header {
  display: flex; justify-content: space-between; align-items: flex-start;
  gap: 20px; margin-bottom: 20px;
  padding-bottom: 20px; border-bottom: 2px solid var(--border);
}
.mgr-facility-name { font-size: 26px; font-weight: 900; letter-spacing: -.02em; color: var(--text); }
.mgr-facility-sub  { font-size: 13px; color: var(--text-muted); margin-top: 3px; }
.mgr-facility-date { font-size: 11px; color: var(--text-muted); margin-top: 2px; }
.mgr-header-right  { display: flex; gap: 16px; flex-shrink: 0; }
.mgr-kpi { text-align: center; padding: 10px 16px; background: var(--bg); border-radius: 8px; border: 1px solid var(--border); min-width: 100px; }
.mgr-kpi-val { display: block; font-size: 20px; font-weight: 800; color: var(--accent); }
.mgr-kpi-lbl { display: block; font-size: 10px; color: var(--text-muted); text-transform: uppercase; letter-spacing: .06em; margin-top: 2px; }

/* Rules strip */
.mgr-rule-strip {
  display: flex; flex-wrap: wrap; gap: 10px;
  padding: 12px 16px; background: var(--bg); border-radius: 8px; margin-bottom: 22px;
  font-size: 12px; font-weight: 500; color: var(--text);
}
.mgr-rule-item { display: flex; align-items: center; gap: 6px; }
.mgr-rule-item i { color: #16a34a; font-size: 11px; }
.mgr-rule-warn i { color: #f59e0b; }

/* Section titles inside pages */
.mgr-section-title {
  font-size: 14px; font-weight: 700; color: var(--text);
  display: flex; align-items: center; gap: 8px;
  margin-bottom: 12px; text-transform: uppercase; letter-spacing: .06em;
}
.mgr-section-title i { color: var(--accent); }

/* Menu grid table */
.mgr-menu-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.mgr-menu-table {
  width: 100%; border-collapse: collapse; font-size: 12px;
  min-width: 780px;
}
.mgr-menu-table th {
  background: var(--bg); padding: 8px 10px; font-weight: 700;
  text-align: left; border: 1px solid var(--border);
  font-size: 11px; text-transform: uppercase; letter-spacing: .05em; color: var(--text-muted);
  white-space: nowrap;
}
.mgr-menu-table td {
  border: 1px solid var(--border); padding: 8px 10px; vertical-align: top;
  min-width: 110px;
}
.mgr-menu-table tr:nth-child(even) td { background: var(--bg); }
.mgr-meal-main { font-weight: 600; font-size: 12px; color: var(--text); margin-bottom: 2px; line-height: 1.3; }
.mgr-meal-sub  { font-size: 10px; color: var(--text-muted); font-style: italic; margin-bottom: 3px; }
.mgr-meal-sides { font-size: 10px; color: var(--text-muted); margin-bottom: 4px; }
.mgr-meal-meta { display: flex; gap: 6px; align-items: center; }
.mgr-cost { font-size: 11px; font-weight: 700; color: #16a34a; }
.mgr-cost.mgr-cost-hi { color: #ef4444; }
.mgr-cal  { font-size: 10px; color: var(--text-muted); }

/* Page heading (Order Guide, Budget) */
.mgr-page-heading {
  font-size: 18px; font-weight: 800; color: var(--text); margin-bottom: 10px;
  display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap;
}
.mgr-page-heading i { color: var(--accent); font-size: 16px; }
.mgr-page-heading-sub { font-size: 12px; font-weight: 400; color: var(--text-muted); margin-top: 2px; display: block; width: 100%; }

.mgr-order-note {
  font-size: 12px; color: var(--text-muted); background: var(--bg);
  border-radius: 7px; padding: 10px 14px; margin-bottom: 18px;
  border-left: 3px solid var(--accent); line-height: 1.5;
}
.mgr-order-note strong { color: var(--text); }

/* Category block */
.mgr-cat-block { margin-bottom: 20px; }
.mgr-cat-header {
  display: flex; align-items: center; gap: 8px;
  font-size: 13px; font-weight: 700; color: var(--text);
  padding: 8px 12px; background: var(--bg); border-radius: 6px 6px 0 0;
  border-left: 4px solid #b91c1c; border: 1px solid var(--border);
  text-transform: uppercase; letter-spacing: .06em; margin-bottom: 0;
}
.mgr-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.mgr-order-table {
  width: 100%; border-collapse: collapse; font-size: 11.5px; min-width: 900px;
}
.mgr-order-table th {
  background: var(--bg); padding: 7px 10px; font-weight: 700;
  text-align: left; border: 1px solid var(--border);
  font-size: 10px; text-transform: uppercase; letter-spacing: .05em;
  color: var(--text-muted); white-space: nowrap;
}
.mgr-order-table td {
  padding: 7px 10px; border: 1px solid var(--border); vertical-align: middle;
  color: var(--text);
}
.mgr-order-table tr:nth-child(even) td { background: var(--bg); }
.mgr-item-name { font-weight: 600; font-size: 12px; color: var(--text); }
.mgr-item-use  { font-size: 10px; color: var(--text-muted); margin-top: 2px; }
.mgr-badge-pref {
  display: inline-block; margin-left: 6px; padding: 1px 5px;
  background: #dcfce7; color: #15803d; border-radius: 3px;
  font-size: 9px; font-weight: 700; letter-spacing: .04em;
}
.mgr-vendor-tag {
  display: inline-block; padding: 2px 7px; border-radius: 4px;
  font-size: 10px; font-weight: 700; color: white; white-space: nowrap;
}
.mgr-qty-cell { font-weight: 800; font-size: 13px; text-align: center; color: #1e40af; }

/* Vendor comparison table */
.mgr-cmp-table .mgr-cmp-item-cell { background: var(--surface); vertical-align: top; }
.mgr-cmp-primary-row td { background: var(--surface) !important; }
.mgr-cmp-alt-row td {
  background: var(--bg) !important;
  padding-top: 5px; padding-bottom: 5px;
  border-top: 1px dashed var(--border);
}
.mgr-cmp-primary-label {
  display: inline-block; padding: 1px 6px; border-radius: 3px;
  background: #fee2e2; color: #991b1b; font-size: 9px; font-weight: 700;
  text-transform: uppercase; letter-spacing: .04em;
}
.mgr-cmp-quote { font-size: 10px; color: var(--text-muted); font-style: italic; }
.mgr-cmp-note-text { font-size: 10px; color: var(--text-muted); margin-top: 2px; }
.mgr-cmp-save-alt {
  display: inline-block; padding: 1px 6px; border-radius: 3px;
  background: #dcfce7; color: #15803d; font-size: 9px; font-weight: 700;
}
.mgr-cmp-save-primary {
  display: inline-block; padding: 1px 6px; border-radius: 3px;
  background: #fee2e2; color: #991b1b; font-size: 9px; font-weight: 700;
}

/* Budget page */
.mgr-budget-grid {
  display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 18px; margin-bottom: 24px;
}
.mgr-budget-card {
  background: var(--bg); border-radius: 9px; padding: 18px 20px;
  border: 1px solid var(--border);
}
.mgr-budget-card-title {
  font-size: 12px; font-weight: 700; color: var(--text-muted);
  text-transform: uppercase; letter-spacing: .08em;
  display: flex; align-items: center; gap: 7px; margin-bottom: 14px;
}
.mgr-budget-card-title i { color: var(--accent); }
.mgr-budget-total { font-size: 32px; font-weight: 900; color: var(--accent); }
.mgr-budget-sub { font-size: 11px; color: var(--text-muted); margin-top: 4px; }
.mgr-budget-vendor {
  display: grid; grid-template-columns: 10px 1fr auto 100px;
  align-items: center; gap: 8px; margin-bottom: 10px;
}
.mgr-vendor-dot { width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; }
.mgr-budget-vendor-name { font-size: 12px; font-weight: 600; color: var(--text); }
.mgr-budget-vendor-amt { font-size: 11px; font-weight: 700; color: var(--text); white-space: nowrap; }
.mgr-budget-cat {
  display: grid; grid-template-columns: 1fr 80px auto;
  align-items: center; gap: 8px; margin-bottom: 8px;
}
.mgr-budget-cat-name { font-size: 11px; color: var(--text); }
.mgr-budget-cat-amt  { font-size: 11px; font-weight: 700; color: var(--text); white-space: nowrap; text-align: right; }
.mgr-budget-track { height: 6px; background: var(--border); border-radius: 99px; overflow: hidden; }
.mgr-budget-fill  { height: 100%; border-radius: 99px; transition: width .3s; }
.mgr-budget-row   { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.mgr-budget-label { font-size: 11px; color: var(--text); min-width: 80px; }
.mgr-budget-val   { font-size: 11px; font-weight: 700; min-width: 60px; text-align: right; }

/* Manager rules list */
.mgr-rules-block {
  background: var(--bg); border-radius: 9px; padding: 20px 24px;
  border: 1px solid var(--border); margin-bottom: 20px;
}
.mgr-rules-title {
  font-size: 13px; font-weight: 700; color: var(--text);
  display: flex; align-items: center; gap: 7px;
  text-transform: uppercase; letter-spacing: .06em; margin-bottom: 14px;
}
.mgr-rules-title i { color: var(--accent); }
.mgr-rules-list { padding-left: 20px; margin: 0; }
.mgr-rules-list li {
  font-size: 12.5px; color: var(--text); margin-bottom: 9px; line-height: 1.5;
}
.mgr-rules-list li strong { color: var(--text); }

/* Contact / quick reference */
.mgr-contact-block { background: var(--bg); border-radius: 9px; padding: 18px 22px; border: 1px solid var(--border); }
.mgr-contact-title { font-size: 12px; font-weight: 700; color: var(--text-muted); text-transform: uppercase; letter-spacing: .08em; margin-bottom: 14px; }
.mgr-contact-grid  { display: grid; grid-template-columns: repeat(4,1fr); gap: 14px; }
.mgr-contact-item  { font-size: 11.5px; color: var(--text); line-height: 1.5; }
.mgr-contact-item strong { color: var(--text); font-size: 12px; }

/* Responsive */
@media (max-width: 960px) {
  .mgr-header { flex-direction: column; }
  .mgr-header-right { flex-wrap: wrap; }
  .mgr-budget-grid { grid-template-columns: 1fr; }
  .mgr-contact-grid { grid-template-columns: repeat(2,1fr); }
}
@media (max-width: 600px) {
  .mgr-page { padding: 20px 14px; }
  .mgr-kpi  { padding: 8px 12px; min-width: 80px; }
  .mgr-kpi-val { font-size: 16px; }
  .mgr-contact-grid { grid-template-columns: 1fr; }
}

/* ── Nested rules sub-list ── */
.mgr-rules-sub {
  padding-left: 18px; margin: 8px 0 4px;
  list-style: disc;
}
.mgr-rules-sub li {
  font-size: 12px; color: var(--text); margin-bottom: 6px; line-height: 1.5;
}
.mgr-rules-sub li strong { color: var(--text); }

/* ══════════════════════════════════════════════════
   FOOD LOG
   ══════════════════════════════════════════════════ */
.mgr-log-meta {
  display: flex; flex-wrap: wrap; gap: 16px;
  padding: 12px 16px; background: var(--bg); border-radius: 8px;
  margin-bottom: 18px; border: 1px solid var(--border);
}
.mgr-log-meta-field {
  font-size: 12px; font-weight: 600; color: var(--text);
  display: flex; align-items: center; gap: 8px;
}
.mgr-log-line {
  display: inline-block; width: 120px; border-bottom: 1.5px solid var(--text-muted);
}

.mgr-log-week-label {
  font-size: 13px; font-weight: 700; color: var(--text);
  display: flex; align-items: center; gap: 8px;
  text-transform: uppercase; letter-spacing: .06em;
  margin: 16px 0 8px; padding-left: 2px;
}
.mgr-log-week-label i { color: var(--accent); }

.mgr-log-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; margin-bottom: 14px; }

.mgr-log-table {
  width: 100%; border-collapse: collapse; font-size: 11px;
  min-width: 860px;
}
.mgr-log-table thead th {
  background: #212934; color: white;
  padding: 6px 7px; text-align: center;
  font-size: 10px; font-weight: 700; text-transform: uppercase;
  letter-spacing: .04em; border: 1px solid #2d4f7a;
  white-space: nowrap; line-height: 1.3;
}
.mgr-log-table td {
  border: 1px solid var(--border); padding: 5px 7px;
  vertical-align: middle; font-size: 11px; color: var(--text);
}
.mgr-log-day-first { border-top: 2px solid #212934 !important; }
.mgr-log-day-cell {
  font-weight: 800; font-size: 11px; text-align: center;
  background: var(--bg); letter-spacing: .06em; vertical-align: middle;
}
.mgr-log-meal-code {
  font-weight: 700; text-align: center; font-size: 11px;
  width: 20px;
}
.mgr-log-meal-b { color: #d97706; }
.mgr-log-meal-l { color: #2563eb; }
.mgr-log-meal-d { color: #7c3aed; }
.mgr-log-dinner { background: rgba(124,58,237,.04); }
.mgr-log-item-name { font-weight: 600; min-width: 140px; }
.mgr-log-ingredients { font-size: 9.5px; color: var(--text-muted); font-style: italic; margin-top: 3px; line-height: 1.4; }
.mgr-log-sides-cell { font-size: 10px; color: var(--text-muted); min-width: 120px; }
.mgr-log-est-cost { text-align: center; font-weight: 700; color: #16a34a; white-space: nowrap; }
.mgr-log-pop { text-align: center; color: var(--text-muted); }
.mgr-log-write {
  min-width: 52px; background: #fafafa;
  border: 1px solid var(--border) !important;
}
[data-theme="dark"] .mgr-log-write { background: rgba(255,255,255,.03); }
.mgr-log-init { min-width: 36px; max-width: 36px; }
.mgr-log-total-row td {
  background: var(--bg); font-weight: 700; border-top: 2px solid #212934 !important;
}

.mgr-log-notes-block { margin-bottom: 16px; }
.mgr-log-notes-label { font-size: 11px; font-weight: 700; color: var(--text-muted); margin-bottom: 6px; }
.mgr-log-notes-line {
  border-bottom: 1px solid var(--border); height: 22px; margin-bottom: 4px;
}

.mgr-log-footer { margin-top: 16px; display: flex; flex-direction: column; gap: 12px; }
.mgr-log-sig { font-size: 12px; font-weight: 600; color: var(--text); display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.mgr-log-line-long  { display: inline-block; width: 220px; border-bottom: 1.5px solid var(--text-muted); }
.mgr-log-line-short { display: inline-block; width: 100px; border-bottom: 1.5px solid var(--text-muted); }

/* ══════════════════════════════════════════════════════════
   PRINT STYLES — Brief & Manager Tabs
   Triggered via printDoc(wrapId) which sets data-printing-wrap
   on body. Each section only prints when its wrap is targeted.
   ══════════════════════════════════════════════════════════ */
@media print {
  /* Force all colors to print */
  * { -webkit-print-color-adjust: exact !important; print-color-adjust: exact !important; }

  /* ── Hide all chrome ── */
  .sidebar, .tab-bar, #tabBar, .brief-controls, .mgr-controls,
  .topbar, .hamburger, .topbar-actions,
  body > *:not(#main) { display: none !important; }

  /* ── Hide all content sections by default ── */
  #main, .content > * { display: none !important; }

  /* ── Un-hide .app container (direct body child, not #main) ── */
  /* #app-shell ID gives specificity 0,1,1,1 — beats body > *:not(#main) at 0,1,0,1 */
  body[data-printing-wrap] #app-shell,
  body[data-printing-section] #app-shell { display: block !important; }

  /* ── Brief: show only brief-wrap ── */
  body[data-printing-wrap="brief-wrap"] #main  { display: block !important; }
  body[data-printing-wrap="brief-wrap"] #brief-wrap { display: block !important; }

  /* ── Birmingham: show only birmingham-wrap ── */
  body[data-printing-wrap="birmingham-wrap"] #main { display: block !important; }
  body[data-printing-wrap="birmingham-wrap"] #birmingham-wrap { display: block !important; }

  /* ── Bessemer: show only bessemer-wrap ── */
  body[data-printing-wrap="bessemer-wrap"] #main { display: block !important; }
  body[data-printing-wrap="bessemer-wrap"] #bessemer-wrap { display: block !important; }

  /* ── Brief page layout (portrait) ── */
  body[data-printing-wrap="brief-wrap"] { margin: 0 !important; background: white !important; }
  .brief-doc      { max-width: 100%; padding: 0; margin: 0; }
  .brief-page {
    border: none !important; box-shadow: none !important;
    border-radius: 0 !important; padding: 20px 0 !important;
    margin: 0 !important; page-break-after: always;
  }
  .brief-page:last-child { page-break-after: auto; }

  /* ── Manager page layout (landscape) ── */
  body[data-printing-wrap="birmingham-wrap"],
  body[data-printing-wrap="bessemer-wrap"] {
    margin: 0 !important; background: white !important;
  }

  body[data-printing-wrap="birmingham-wrap"] .mgr-doc,
  body[data-printing-wrap="bessemer-wrap"]   .mgr-doc {
    max-width: 100%; padding: 0 4px; margin: 0;
  }

  body[data-printing-wrap="birmingham-wrap"] .mgr-page,
  body[data-printing-wrap="bessemer-wrap"]   .mgr-page {
    border: none !important; box-shadow: none !important;
    border-radius: 0 !important; padding: 0 !important;
    margin: 0 !important; page-break-after: always;
  }
  body[data-printing-wrap="birmingham-wrap"] .mgr-page:last-child,
  body[data-printing-wrap="bessemer-wrap"]   .mgr-page:last-child { page-break-after: auto; }

  /* ── Accordion print: each section on its own page ── */
  body[data-printing-wrap="birmingham-wrap"] .mgr-acc-section,
  body[data-printing-wrap="bessemer-wrap"]   .mgr-acc-section {
    page-break-after: always;
    border: none !important;
  }
  body[data-printing-wrap="birmingham-wrap"] .mgr-acc-section:last-child,
  body[data-printing-wrap="bessemer-wrap"]   .mgr-acc-section:last-child { page-break-after: auto; }
  body[data-printing-wrap="birmingham-wrap"] .mgr-overview-bar,
  body[data-printing-wrap="bessemer-wrap"]   .mgr-overview-bar {
    border-radius: 0 !important;
  }
  body[data-printing-wrap="birmingham-wrap"] .mgr-rule-strip,
  body[data-printing-wrap="bessemer-wrap"]   .mgr-rule-strip {
    margin-bottom: 0 !important;
  }

  /* ── Table print fixes ── */
  .mgr-menu-table,
  .mgr-order-table { font-size: 9.5pt !important; min-width: 0 !important; width: 100% !important; }
  .mgr-menu-table th, .mgr-menu-table td,
  .mgr-order-table th, .mgr-order-table td { padding: 4px 6px !important; }
  .mgr-menu-scroll, .mgr-table-wrap { overflow: visible !important; }
  .mgr-order-table tr { page-break-inside: avoid; }
  .mgr-menu-table  tr { page-break-inside: avoid; }
  .mgr-cat-block        { page-break-inside: auto;  margin-bottom: 8px; }
  .mgr-cat-header       { page-break-after: avoid; }
  .mgr-order-table thead { display: table-header-group; }
  .mgr-meal-main  { font-size: 9pt !important; }
  .mgr-meal-sub   { font-size: 7.5pt !important; }
  .mgr-meal-sides { font-size: 7.5pt !important; }
  .mgr-meal-meta  { font-size: 7.5pt !important; }
  .mgr-menu-scroll { overflow: visible !important; }

  /* ── Manager header in print ── */
  .mgr-header { padding-bottom: 10px; margin-bottom: 12px; }
  .mgr-kpi-val  { font-size: 14pt !important; }
  .mgr-facility-name { font-size: 18pt !important; }
  .mgr-budget-grid { grid-template-columns: 1fr 1fr 1fr !important; }
  .mgr-contact-grid { grid-template-columns: repeat(4,1fr) !important; }
  .mgr-rules-block, .mgr-contact-block { page-break-inside: avoid; }

  /* ── Food log print fixes ── */
  .mgr-log-table { font-size: 8.5pt !important; min-width: 0 !important; width: 100% !important; }
  .mgr-log-table thead th, .mgr-log-table td { padding: 3px 5px !important; }
  .mgr-log-scroll { overflow: visible !important; }
  .mgr-log-write { background: white !important; }
  .mgr-log-table tr { page-break-inside: avoid; }
  .mgr-log-week-label { page-break-before: auto; margin-top: 10px; }
  .mgr-log-notes-line { border-bottom: 1px solid #999 !important; }
  .mgr-log-line, .mgr-log-line-long, .mgr-log-line-short { border-bottom-color: #999 !important; }
  .mgr-log-table thead th { background: #212934 !important; color: white !important; }

  /* ── Color badge print accuracy ── */
  .mgr-vendor-tag    { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .mgr-badge-pref    { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .mgr-qty-cell      { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .brief-confidential{ -webkit-print-color-adjust: exact; print-color-adjust: exact; }

  /* ── Accordion: force all sections open for full-doc print ── */
  body[data-printing-wrap] .mgr-acc-body    { display: block !important; }
  body[data-printing-wrap] .mgr-acc-header  { display: none !important; }
  body[data-printing-wrap] .mgr-acc-section { border: none !important; margin-bottom: 0 !important; }

  /* ── Per-section print: show overview bar + target section only ── */
  /* Must un-hide #main first — it's hidden by the generic rule above */
  body[data-printing-section] #main { display: block !important; }

  body[data-printing-section] #brief-wrap,
  body[data-printing-section] #birmingham-wrap,
  body[data-printing-section] #bessemer-wrap { display: none !important; }

  body[data-printing-section^="birmingham"] #birmingham-wrap { display: block !important; }
  body[data-printing-section^="bessemer"]   #bessemer-wrap   { display: block !important; }

  /* hide all accordion sections in the shown wrap, then reveal just the target */
  body[data-printing-section^="birmingham"] #birmingham-wrap .mgr-acc-section,
  body[data-printing-section^="bessemer"]   #bessemer-wrap   .mgr-acc-section { display: none !important; }

  body[data-printing-section="birmingham-menu"]   #birmingham-acc-menu,
  body[data-printing-section="bessemer-menu"]     #bessemer-acc-menu   { display: block !important; }
  body[data-printing-section="birmingham-order"]  #birmingham-acc-order,
  body[data-printing-section="bessemer-order"]    #bessemer-acc-order  { display: block !important; }
  body[data-printing-section="birmingham-budget"] #birmingham-acc-budget,
  body[data-printing-section="bessemer-budget"]   #bessemer-acc-budget { display: block !important; }
  body[data-printing-section="birmingham-log"]    #birmingham-acc-log,
  body[data-printing-section="bessemer-log"]      #bessemer-acc-log    { display: block !important; }

  /* force the body of the revealed section open */
  body[data-printing-section] .mgr-acc-body    { display: block !important; }
  body[data-printing-section] .mgr-acc-header  { display: none !important; }

  .mgr-overview-bar  { -webkit-print-color-adjust: exact; print-color-adjust: exact; }

  /* ingredient list in print */
  .mgr-log-ingredients { font-size: 7pt !important; }
}

/* ── Manager accordion ──────────────────────────────────── */
.mgr-overview-bar {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 16px;
  background: linear-gradient(135deg, #212934 0%, #2d6a4f 100%);
  border-radius: 12px 12px 0 0;
  padding: 20px 24px 16px;
  color: white;
}
.mgr-overview-left .mgr-facility-name { font-size: 1.4rem; font-weight: 800; letter-spacing: .04em; color: white; }
.mgr-overview-left .mgr-facility-sub  { font-size: 0.8rem; opacity: .85; margin-top: 2px; color: white; }
.mgr-overview-left .mgr-facility-date { font-size: 0.75rem; opacity: .7; margin-top: 4px; color: white; }

.mgr-accordion {
  border: 1px solid var(--border);
  border-top: none;
  border-radius: 0 0 12px 12px;
  overflow: hidden;
}
.mgr-acc-section {
  border-bottom: 1px solid var(--border);
}
.mgr-acc-section:last-child { border-bottom: none; }

.mgr-acc-header {
  width: 100%;
  display: flex;
  align-items: center;
  background: var(--card-bg);
  border: none;
  transition: background 0.15s;
}
.mgr-acc-section.mgr-acc-open > .mgr-acc-header { background: rgba(30,58,95,.07); }

.mgr-acc-toggle {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 20px;
  background: none;
  border: none;
  cursor: pointer;
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--text);
  text-align: left;
  gap: 12px;
}
.mgr-acc-toggle:hover { opacity: .8; }

.mgr-acc-chevron {
  font-size: 0.8rem;
  color: var(--text-muted);
  transition: transform 0.2s ease;
  flex-shrink: 0;
}
.mgr-acc-section.mgr-acc-open .mgr-acc-chevron { transform: rotate(180deg); }

.mgr-sec-pdf-btn {
  flex-shrink: 0;
  padding: 7px 14px;
  margin: 6px 12px 6px 0;
  background: #dc2626;
  color: white;
  border: none;
  border-radius: 6px;
  font-size: 0.75rem;
  font-weight: 700;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 5px;
  white-space: nowrap;
  transition: background 0.15s;
}
.mgr-sec-pdf-btn:hover { background: #b91c1c; }

.mgr-acc-body {
  display: none;
  padding: 20px 24px 24px;
  background: var(--bg);
}
.mgr-acc-section.mgr-acc-open > .mgr-acc-body { display: block; }

.mgr-kpi-note {
  font-size: 0.65rem;
  opacity: .75;
  font-weight: 400;
}

/* ════════════════════════════════════════════════════════════
   Vendors tab overrides (2026-05-11)
   Scope: #overview section only (Vendors tab → Overview)
   Appended; do not modify existing rules above.
   ════════════════════════════════════════════════════════════ */

/* Strip the hero of its card-like background, border, gradient halos, and
   excess padding so it reads as a plain page header. */
#overview .overview-hero,
#overview.overview-hero {
  background: none !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 0 0 8px 0 !important;
  margin-bottom: 28px !important;
  overflow: visible !important;
}
#overview .overview-hero::before,
#overview .overview-hero::after { display: none !important; }

/* Wider gap between stat cards. */
#overview .stats-grid {
  gap: 28px !important;
}

/* Three-card variant — override the global 4-column rule for this grid. */
#overview .stats-grid.stats-grid-3 {
  grid-template-columns: repeat(3, 1fr) !important;
}

/* Replace the border with a subtle elevation so card edges read against the
   page background. Card bg stays at --bg-card (one step lighter than --bg-body
   in both themes). */
#overview .stat-card {
  border: 1px solid transparent !important;
  box-shadow:
    0 1px 2px rgba(33,41,52,0.04),
    0 4px 12px rgba(33,41,52,0.06) !important;
}
[data-theme="dark"] #overview .stat-card {
  box-shadow:
    0 1px 2px rgba(0,0,0,0.35),
    0 4px 16px rgba(0,0,0,0.45) !important;
}
#overview .stat-card:hover {
  border-color: var(--border-strong) !important;
  box-shadow:
    0 2px 4px rgba(33,41,52,0.06),
    0 8px 20px rgba(33,41,52,0.10) !important;
}
[data-theme="dark"] #overview .stat-card:hover {
  box-shadow:
    0 2px 4px rgba(0,0,0,0.45),
    0 8px 24px rgba(0,0,0,0.55) !important;
}


