/* ── ENVISION DMS Design System ─────────────────────────────────────────────
   Brand palette: Deep Navy, Porter Teal, Warm Gold, Professional Grays
   ────────────────────────────────────────────────────────────────────────── */

:root {
  /* Brand */
  --porter-navy:    #10233d;
  --porter-navy-2:  #163555;
  --porter-navy-3:  #1f4b73;
  --porter-teal:    #00B4A6;
  --porter-teal-2:  #00C8B8;
  --teal:           var(--porter-teal);
  --accent:         var(--porter-teal);
  --porter-gold:    #F5A623;
  --porter-gold-2:  #FFBD4F;
  --porter-blue:    #2563EB;

  /* Semantic */
  --ink:    #0F1923;
  --text:   var(--ink);
  --muted:  #64748b;
  --line:   #E2E8F0;
  --paper:  #dfeefa;
  --panel:  rgba(255,255,255,.93);

  /* Status */
  --green:      #059669;
  --green-soft: #D1FAE5;
  --blue:       #2563EB;
  --blue-soft:  #DBEAFE;
  --gold:       #D97706;
  --gold-soft:  #FEF3C7;
  --red:        #DC2626;
  --red-soft:   #FEE2E2;
  --purple:     #7C3AED;
  --purple-soft:#EDE9FE;
  --expand-btn-bg: #ddd6fe;
  --expand-btn-border: #c4b5fd;
  --expand-btn-text: #5b21b6;
  --collapse-btn-bg: #f3e8ff;
  --collapse-btn-border: #e9d5ff;
  --collapse-btn-text: #7c3aed;

  /* Elevation */
  --shadow-sm: 0 1px 3px rgba(15,25,35,.08), 0 1px 2px rgba(15,25,35,.04);
  --shadow:    0 4px 16px rgba(15,25,35,.10), 0 2px 6px rgba(15,25,35,.06);
  --shadow-lg: 0 20px 50px rgba(15,25,35,.18);

  /* Motion */
  --ease:  cubic-bezier(.4,0,.2,1);
  --fast:  120ms;
  --mid:   200ms;
  --slow:  350ms;
}

body.dark-mode {
  --ink: #F8FAFC;
  --muted: #A7B4C5;
  --line: rgba(148,163,184,.26);
  --paper: #091520;
  --panel: rgba(17, 31, 48, .94);
  background:
    radial-gradient(circle at top left, rgba(0,180,166,.14), transparent 28rem),
    linear-gradient(135deg, #07111d 0%, #0c1c2e 52%, #13283d 100%);
}

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

[hidden] { display: none !important; }

html {
  font-size: 14px;
  overflow-x: clip;
  max-width: 100%;
}

body {
  margin: 0;
  min-height: 100vh;
  max-width: 100%;
  overflow-x: clip;
  color: var(--ink);
  background:
    radial-gradient(circle at top left, rgba(119, 190, 229, .38), transparent 32rem),
    linear-gradient(135deg, #d7ecfb 0%, #edf6fc 45%, #cfe5f6 100%);
  font-family: 'Inter', ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  -webkit-font-smoothing: antialiased;
}

html:has(.shell:not([hidden])) {
  overflow: hidden;
  height: 100%;
}

body:has(.shell:not([hidden])) {
  overflow: hidden;
  height: 100dvh;
  min-height: 100dvh;
}

/* ── Scrollbar ─────────────────────────────────────────────────────────────── */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #C1CDD7; border-radius: 999px; }
::-webkit-scrollbar-thumb:hover { background: #8EA0B0; }

/* ── Base elements ─────────────────────────────────────────────────────────── */
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
a { color: var(--porter-teal); text-decoration: none; }
a:hover { text-decoration: underline; }

/* ─────────────────────────────────────────────────────────────────────────────
   SHELL
───────────────────────────────────────────────────────────────────────────── */
.shell {
  display: grid;
  grid-template-columns: 236px minmax(0, 1fr);
  min-height: 100dvh;
  max-height: 100dvh;
  height: 100dvh;
  max-width: 100%;
  overflow: hidden;
}

/* Fieldsets used for read-only System guards must not force min-content page width */
fieldset {
  min-width: 0;
  max-width: 100%;
  border: 0;
  margin: 0;
  padding: 0;
}

/* ─────────────────────────────────────────────────────────────────────────────
   SIDEBAR
───────────────────────────────────────────────────────────────────────────── */
.sidebar {
  position: sticky;
  top: 0;
  height: 100vh;
  display: flex;
  flex-direction: column;
  gap: 0;
  background: linear-gradient(180deg, #0c223c 0%, #102f4d 100%);
  color: #fff;
  overflow: hidden;
  border-right: 1px solid rgba(255, 255, 255, .06);
}

.brand {
  display: flex;
  gap: 10px;
  align-items: center;
  padding: 16px 14px 12px;
  border-bottom: 1px solid rgba(255,255,255,.06);
  flex-shrink: 0;
}

.mark {
  flex: 0 0 auto;
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  background: var(--porter-teal);
  color: #fff;
}

.brand strong {
  display: block;
  font-size: 14px;
  font-weight: 800;
  letter-spacing: -0.2px;
  color: #fff;
}

.brand span {
  display: block;
  font-size: 10px;
  color: rgba(255,255,255,.42);
  font-weight: 500;
  margin-top: 1px;
}

/* Search */
.search-sidebar {
  position: relative;
  padding: 10px 12px 6px;
  flex-shrink: 0;
}

.search-icon {
  position: absolute;
  left: 26px;
  top: 50%;
  transform: translateY(-50%);
  color: rgba(255,255,255,.35);
  font-size: 16px;
  pointer-events: none;
}

.search-sidebar input {
  width: 100%;
  height: 32px;
  padding: 0 36px 0 28px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 7px;
  color: #fff;
  font-size: 12px;
  transition: background var(--fast) var(--ease), border-color var(--fast) var(--ease);
}

.search-sidebar input::placeholder { color: rgba(255,255,255,.3); }
.search-sidebar input:focus {
  outline: none;
  background: rgba(255,255,255,.12);
  border-color: var(--porter-teal);
}

/* Nav */
#moduleNav {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 4px 8px 10px;
  scrollbar-width: thin;
  scrollbar-color: rgba(255,255,255,.18) transparent;
}

#moduleNav::-webkit-scrollbar { width: 4px; }
#moduleNav::-webkit-scrollbar-thumb {
  background: rgba(255,255,255,.16);
  border-radius: 999px;
}

.nav-group + .nav-group {
  margin-top: 4px;
  padding-top: 6px;
  border-top: 1px solid rgba(255,255,255,.05);
}

.nav-section-label {
  padding: 4px 10px 6px;
  color: rgba(255,255,255,.34);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.nav-button {
  width: 100%;
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  border: 0;
  border-radius: 6px;
  padding: 7px 10px;
  background: transparent;
  color: rgba(255,255,255,.72);
  text-align: left;
  font-size: 12.5px;
  font-weight: 500;
  line-height: 1.2;
  transition: background var(--fast) var(--ease), color var(--fast) var(--ease);
  position: relative;
}

.nav-button:hover {
  background: rgba(255,255,255,.06);
  color: #fff;
}

.nav-button.active {
  background: rgba(0, 180, 166, .14);
  color: #e8fffc;
  font-weight: 600;
}

.nav-button.active::before {
  content: "";
  position: absolute;
  left: 0;
  top: 5px;
  bottom: 5px;
  width: 3px;
  border-radius: 0 3px 3px 0;
  background: var(--porter-teal-2);
}

.nav-button .nav-icon {
  width: 22px;
  height: 22px;
  display: grid;
  place-items: center;
  font-size: 13px;
  border-radius: 0;
  background: transparent;
  opacity: .88;
}

.nav-button.active .nav-icon {
  opacity: 1;
}

.nav-label {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: inherit;
}

.count {
  padding: 0 5px;
  border-radius: 999px;
  background: rgba(255,255,255,.1);
  color: rgba(255,255,255,.75);
  font-size: 10px;
  font-weight: 700;
  min-width: 18px;
  line-height: 16px;
  text-align: center;
}

.count.alert {
  background: var(--porter-gold);
  color: #1a1100;
}

/* Sidebar footer */
.sidebar-footer {
  margin-top: auto;
  padding: 10px 12px 12px;
  border-top: 1px solid rgba(255,255,255,.06);
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex-shrink: 0;
}

.health {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  padding: 10px 12px;
  background: rgba(0,180,166,.1);
  border: 1px solid rgba(0,180,166,.2);
  border-radius: 8px;
}

.pulse {
  flex: 0 0 auto;
  width: 8px;
  height: 8px;
  margin-top: 3px;
  border-radius: 50%;
  background: var(--porter-teal);
  box-shadow: 0 0 0 0 rgba(0, 180, 166, 0.4);
  animation: pulse 2s infinite;
}

@keyframes pulse {
  0%   { box-shadow: 0 0 0 0 rgba(0, 180, 166, 0.4); }
  70%  { box-shadow: 0 0 0 7px rgba(0, 180, 166, 0); }
  100% { box-shadow: 0 0 0 0 rgba(0, 180, 166, 0); }
}

.health strong {
  display: block;
  color: var(--porter-teal-2);
  font-size: 12px;
  font-weight: 700;
}

.health small {
  color: rgba(255,255,255,.35);
  font-size: 11px;
}

.health-link {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  color: inherit;
  text-decoration: none;
  width: 100%;
  text-align: left;
  background: none;
  border: 0;
  padding: 0;
  font: inherit;
  cursor: pointer;
}
div.health-link { cursor: default; }

.health-link:hover .health-dash-link {
  color: var(--porter-teal-2);
  text-decoration: underline;
}

.user-chip {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  border-radius: 8px;
  background: rgba(255,255,255,.05);
  cursor: pointer;
  transition: background var(--fast) var(--ease);
}

.user-chip:hover { background: rgba(255,255,255,.1); }

.avatar {
  width: 32px;
  height: 32px;
  border-radius: 8px;
  background: var(--porter-teal);
  color: #fff;
  display: grid;
  place-items: center;
  font-size: 11px;
  font-weight: 800;
  flex: 0 0 auto;
}

.user-chip strong {
  display: block;
  font-size: 12.5px;
  color: rgba(255,255,255,.9);
}

.user-chip small {
  display: block;
  font-size: 11px;
  color: rgba(255,255,255,.4);
}

.view-as-chip {
  color: #93C5FD !important;
  font-weight: 900;
}

.view-as-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 16px;
  margin: 0 0 16px;
  max-width: 100%;
  padding: 12px 16px;
  border: 1px solid rgba(245, 166, 35, .45);
  border-radius: 14px;
  background: linear-gradient(90deg, rgba(245, 166, 35, .14), rgba(37, 99, 235, .08));
  box-shadow: 0 8px 24px rgba(15, 23, 42, .06);
}

.view-as-banner-copy {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.view-as-banner-copy strong {
  display: block;
  font-size: 15px;
}

.view-as-banner-copy small,
.view-as-banner-meta {
  color: var(--muted);
  font-size: 12px;
}

.view-as-banner-meta strong {
  display: inline;
  font-size: 12px;
  color: var(--text);
}

.sandbox-mode-badge {
  margin-left: 4px;
}

.sandbox-mode-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 16px;
  margin: 0 0 16px;
  max-width: 100%;
  padding: 12px 16px;
  border: 1px solid rgba(245, 166, 35, .55);
  border-radius: 14px;
  background: linear-gradient(90deg, rgba(245, 166, 35, .18), rgba(234, 179, 8, .08));
  box-shadow: 0 8px 24px rgba(15, 23, 42, .06);
}

.sandbox-mode-banner-copy {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.sandbox-mode-banner-copy strong {
  display: block;
  font-size: 15px;
}

.sandbox-mode-banner-copy small {
  color: var(--muted);
  font-size: 12px;
  display: block;
  max-width: 720px;
}

.integration-sandbox-note {
  margin: 0 0 8px;
  padding: 0 12px;
}

body.sandbox-mode-active main {
  scroll-margin-top: 8px;
}

body.view-as-active main {
  border-top: 3px solid rgba(245, 166, 35, .75);
}

/* ─────────────────────────────────────────────────────────────────────────────
   MAIN / TOPBAR
───────────────────────────────────────────────────────────────────────────── */
main {
  min-width: 0;
  max-width: 100%;
  min-height: 0;
  overflow-x: clip;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 22px 24px;
  display: flex;
  flex-direction: column;
  gap: 0;
  background:
    linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,0) 260px);
}

.topbar {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px 16px;
  margin-bottom: 20px;
  min-width: 0;
  max-width: 100%;
}

.topbar-left {
  flex: 1 1 220px;
  min-width: 0;
}

.topbar-center {
  flex: 1 1 280px;
  max-width: 420px;
  min-width: 160px;
  position: relative;
}

.function-search-wrap {
  position: relative;
  width: 100%;
}

.function-search-wrap input[type="search"] {
  width: 100%;
  min-width: 0;
}

.topbar-left h1 {
  margin: 4px 0 0;
  font-size: 24px;
  font-weight: 800;
  letter-spacing: -0.5px;
  line-height: 1.15;
  overflow-wrap: anywhere;
}

.topbar-new-plus {
  width: 40px;
  height: 40px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.ro-mark-line-complete-btn {
  border-color: var(--blue);
  background: var(--blue);
  color: #fff;
  font-weight: 700;
}

.ro-mark-line-complete-btn:hover {
  border-color: #1d4ed8;
  background: #1d4ed8;
  box-shadow: 0 4px 12px rgba(37, 99, 235, 0.28);
}

.ro-mark-all-lines-complete-btn {
  border: 1px solid #93c5fd;
  background: #bfdbfe;
  color: #1e3a8a;
  font-weight: 700;
}

.ro-mark-all-lines-complete-btn:hover {
  border-color: #60a5fa;
  background: #93c5fd;
  color: #1e3a8a;
}

.run-vis-btn {
  border-color: var(--blue);
  background: var(--blue);
  color: #fff;
  font-weight: 700;
  white-space: nowrap;
}

.run-vis-btn:hover {
  border-color: #1d4ed8;
  background: #1d4ed8;
}

.ro-vehicle-vis-actions {
  margin-top: 8px;
}

.ro-footer-line-complete-bar {
  flex: 1 1 100%;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  padding: 10px 0 8px;
  border-top: 2px solid var(--blue-soft);
  margin-bottom: 4px;
}

.ro-detail-modal-footer {
  flex-wrap: wrap;
}

.warranty-desk-panel .panel-header-row {
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.warranty-desk-kpis {
  margin-bottom: 12px;
}

.warranty-desk-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 10px;
  align-items: end;
  margin-bottom: 10px;
}

.warranty-desk-filters input[type="search"],
.warranty-desk-filters select {
  min-width: 160px;
}

.warranty-desk-filters .compact-date {
  display: grid;
  gap: 4px;
  font-size: 11px;
  color: var(--muted);
}

.warranty-desk-dcs-note {
  margin: 0 0 12px;
}

.warranty-desk-table td small {
  display: block;
  color: var(--muted);
}

.warranty-desk-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  min-width: 140px;
}

.warranty-submit-btn {
  background: linear-gradient(180deg, #1d6fd8, #1558b0);
  border-color: #124a96;
  color: #fff;
}

.warranty-submit-btn:hover {
  background: linear-gradient(180deg, #2480ef, #1862c4);
}

.topbar-right {
  display: flex;
  gap: 8px;
  align-items: center;
  flex: 1 1 360px;
  min-width: 0;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.eyebrow {
  color: var(--porter-teal);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .6px;
  text-transform: uppercase;
}

/* Goal badge */
.goal-badge {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 5px 10px;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
  font-size: 12px;
  font-weight: 700;
  color: var(--muted);
}

.goal-badge .goal-val {
  color: var(--green);
}

.company-switcher {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
  min-width: 0;
  max-width: 100%;
}

.company-switcher .company-switcher-picker {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
  max-width: 220px;
}

.company-switcher-search {
  height: 30px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255,255,255,.92);
  color: var(--ink);
  padding: 0 8px;
  font-size: 11px;
  width: 100%;
}

.company-switcher-count {
  font-size: 10px;
  line-height: 1.2;
}

.company-switcher select {
  height: 36px;
  max-width: 190px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255,255,255,.92);
  color: var(--ink);
  padding: 0 9px;
  font-size: 12px;
  font-weight: 800;
}

.company-switcher select:disabled {
  color: var(--muted);
  background: rgba(255,255,255,.62);
}

.company-switcher .company-context-label {
  font-size: 12px;
  font-weight: 800;
  color: var(--ink);
  white-space: nowrap;
  max-width: 190px;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Buttons */
.primary,
.secondary,
.icon-button,
.danger {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 36px;
  border-radius: 8px;
  font-weight: 700;
  font-size: 13px;
  transition: all var(--fast) var(--ease);
}

.enterprise-policy-strip,
.announcement-strip {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-top: 12px;
}

.enterprise-policy-strip {
  padding: 10px;
  border: 1px solid rgba(0,180,166,.22);
  border-radius: 8px;
  background: rgba(0,180,166,.08);
}

.enterprise-policy-strip strong {
  color: var(--porter-teal);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.enterprise-policy-strip span,
.announcement-strip span {
  display: inline-flex;
  min-height: 24px;
  align-items: center;
  padding: 3px 8px;
  border-radius: 999px;
  background: rgba(255,255,255,.72);
  color: var(--ink);
  font-size: 11px;
  font-weight: 800;
}

.announcement-strip span.warning {
  background: var(--gold-soft);
  color: #92400e;
}

.announcement-strip span.info {
  background: var(--blue-soft);
  color: #1d4ed8;
}

.micro-button {
  min-height: 24px;
  border: 1px solid rgba(0,180,166,.28);
  border-radius: 999px;
  background: var(--porter-teal);
  color: #fff;
  font-size: 11px;
  font-weight: 900;
  padding: 0 10px;
}

.config-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 10px;
  padding: 16px;
}

.config-toggle,
.config-field {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 44px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255,255,255,.72);
  color: var(--ink);
  font-size: 12px;
  font-weight: 800;
}

.config-toggle input[type="checkbox"] {
  width: 18px;
  height: 18px;
  flex: 0 0 auto;
  accent-color: var(--porter-teal);
}

.config-field {
  display: grid;
  align-items: start;
}

.config-field input {
  width: 100%;
  min-height: 34px;
}

.policy-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 0 16px 16px;
}

.module-config-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(230px, 100%), 1fr));
  gap: 14px;
  padding: 16px;
  min-width: 0;
}

.module-config-card {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255,255,255,.76);
  box-shadow: var(--shadow-sm);
}

.module-config-card header {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.module-config-card div {
  display: grid;
  gap: 5px;
}

.module-config-card small {
  color: var(--muted);
  font-weight: 700;
}

.switch {
  position: relative;
  display: inline-flex;
  align-items: center;
}

.switch input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.switch span {
  width: 38px;
  height: 22px;
  border-radius: 999px;
  background: #CBD5E1;
  position: relative;
  transition: background var(--mid) var(--ease);
}

.switch span::after {
  content: "";
  position: absolute;
  width: 18px;
  height: 18px;
  left: 2px;
  top: 2px;
  border-radius: 50%;
  background: #fff;
  box-shadow: var(--shadow-sm);
  transition: transform var(--mid) var(--ease);
}

.switch input:checked + span {
  background: var(--porter-teal);
}

.switch input:checked + span::after {
  transform: translateX(16px);
}

body.dark-mode .enterprise-policy-strip,
body.dark-mode .module-config-card,
body.dark-mode .config-toggle,
body.dark-mode .config-field {
  background: rgba(15,23,42,.72);
}

body.dark-mode .enterprise-policy-strip span,
body.dark-mode .announcement-strip span {
  background: rgba(30,41,59,.9);
}

.enterprise-cockpit {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 8px;
  margin-top: 14px;
}

.enterprise-cockpit div {
  display: grid;
  gap: 2px;
  min-height: 66px;
  padding: 10px;
  border: 1px solid rgba(37,99,235,.16);
  border-radius: 8px;
  background: rgba(255,255,255,.76);
}

.enterprise-cockpit strong {
  font-size: 18px;
  font-weight: 900;
  color: var(--ink);
}

.enterprise-cockpit span {
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
  color: var(--muted);
}

.enterprise-cockpit small {
  color: var(--muted);
  font-weight: 700;
}

.link-button {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--blue);
  padding: 0;
  font: inherit;
  font-weight: 900;
  text-align: left;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  cursor: pointer;
}

.customer-link {
  color: var(--porter-teal);
}

.prospect-link {
  color: var(--purple);
}

.company-link {
  color: var(--porter-navy);
}

.customer-modal-body {
  flex: 1 1 auto;
  min-height: 0;
  max-height: none;
  overflow: auto;
  overscroll-behavior: contain;
}

.customer-modal-shell {
  display: flex;
  flex-direction: column;
  max-height: calc(100dvh - 32px);
  min-height: 0;
}

.customer-modal-footer {
  flex: 0 0 auto;
  border-top: 1px solid var(--line);
  background: #FAFBFC;
}

.customer-modal-save-footer {
  position: static;
  bottom: auto;
  margin: 0;
  box-shadow: none;
  backdrop-filter: none;
}

dialog#customerModal[open] {
  display: flex;
  flex-direction: column;
}

dialog#customerModal[open] .customer-modal-shell {
  width: 100%;
}

.company-modal-body {
  max-height: min(78vh, 900px);
  overflow: auto;
}

.employee-profile-body {
  max-height: min(78vh, 900px);
  overflow: auto;
}

.party-assignment-panel {
  grid-column: 1 / -1;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--panel-soft, rgba(255, 255, 255, 0.02));
}
.party-mode-tabs {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 12px;
}
.party-mode-tab {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border: 1px solid var(--line);
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
}
.party-mode-tab:has(input:checked) {
  border-color: var(--blue);
  background: var(--blue-soft);
}
.party-hint {
  margin: 6px 0 0;
}
.workflow-party-picker .workflow-party-search-wrap {
  position: relative;
}
.workflow-party-typeahead {
  position: absolute;
  left: 0;
  right: 0;
  top: calc(100% + 4px);
  z-index: 40;
  max-height: 320px;
  overflow: auto;
  background: var(--panel, #fff);
  border: 1px solid var(--line);
  border-radius: 10px;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.12);
  padding: 6px;
}
.workflow-party-typeahead.is-floating {
  position: fixed;
  right: auto;
  z-index: calc(var(--modal-stack-z, 10000) + 30);
}
.credit-hold-banner {
  display: block;
  width: 100%;
  box-sizing: border-box;
  background: #b91c1c;
  color: #fff;
  font-size: clamp(1.1rem, 2.4vw, 1.75rem);
  font-weight: 800;
  letter-spacing: 0.14em;
  text-align: center;
  padding: 10px 14px;
  border: 2px solid #7f1d1d;
  border-radius: 8px;
  margin: 0 0 10px;
  text-transform: uppercase;
  line-height: 1.2;
}
.credit-hold-banner--compact {
  display: inline-block;
  width: auto;
  font-size: 0.72rem;
  letter-spacing: 0.1em;
  padding: 3px 8px;
  margin: 0 6px 4px 0;
  vertical-align: middle;
}
.credit-hold-banner--accounting {
  font-size: clamp(1.35rem, 2.8vw, 2rem);
  margin-bottom: 8px;
}
.credit-hold-accounting-strip {
  margin: 0 0 14px;
  padding: 12px 14px;
  border: 2px solid #fecaca;
  border-radius: 10px;
  background: #fef2f2;
}
.credit-limit-exceeded-banner {
  display: block;
  width: 100%;
  box-sizing: border-box;
  background: #b91c1c;
  color: #fff;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-align: center;
  padding: 10px 14px;
  border: 2px solid #7f1d1d;
  border-radius: 8px;
  margin: 0 0 10px;
  text-transform: uppercase;
}
.credit-limit-nearing-banner {
  display: block;
  width: 100%;
  box-sizing: border-box;
  background: #f59e0b;
  color: #1f2937;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-align: center;
  padding: 10px 14px;
  border: 2px solid #d97706;
  border-radius: 8px;
  margin: 0 0 10px;
  text-transform: uppercase;
}
.credit-limit-flag.compact {
  font-size: 10px;
  letter-spacing: 0.04em;
}
.customer-credit-summary {
  margin: 4px 0 8px;
}
.credit-hold-accounting-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  margin-top: 8px;
}
.credit-hold-accounting-item .link-button {
  font-weight: 700;
}
.customer-profile-flags-alert {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  margin: 0 0 12px;
  background: #fef2f2;
  border: 1px solid #fecaca;
  border-radius: 8px;
  color: #991b1b;
}
.customer-profile-flags-alert strong {
  margin-right: 4px;
}
.workflow-party-selected {
  margin-top: 10px;
}
.workflow-party-chip {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  border: 1px solid var(--porter-teal, #0d9488);
  border-radius: 10px;
  background: #f0fdfa;
}
.workflow-party-chip-main {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}
.workflow-party-chip-main strong,
.workflow-party-chip-main small {
  display: block;
}
.workflow-party-chip-icon {
  font-size: 18px;
}
.workflow-party-new-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 10px;
}
.workflow-party-new-fields .wide {
  grid-column: 1 / -1;
}
.search-party-btn.workflow-party-add-btn {
  border-color: var(--porter-teal, #0d9488);
  background: var(--porter-teal, #0d9488);
  color: #fff;
}
.search-party-btn.workflow-party-add-btn:hover {
  filter: brightness(1.05);
  background: var(--porter-teal, #0d9488);
}
.customer-history-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-top: 16px;
}
.customer-history-section header h3 {
  margin: 0 0 8px;
  font-size: 13px;
}
@media (max-width: 900px) {
  .customer-history-grid { grid-template-columns: 1fr; }
}

.customer-360 {
  display: grid;
  gap: 16px;
}

.customer-profile-card {
  display: grid;
  gap: 10px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255,255,255,.82);
}

.customer-profile-form-grid,
.customer-profile-more-grid {
  padding: 0 !important;
  gap: 10px 12px;
  /* Keep two columns even when global .form-grid collapses at 720px */
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

.customer-address-block {
  display: grid;
  gap: 8px;
}

.customer-address-row {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(72px, 0.7fr) minmax(90px, 0.9fr);
  gap: 10px;
}

.customer-vin-field {
  display: grid;
  gap: 6px;
}

.customer-vin-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
}

.customer-profile-more {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 8px 10px;
  background: rgba(246, 248, 251, 0.7);
}

.customer-profile-more > summary {
  cursor: pointer;
  font-weight: 700;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--muted);
  list-style: none;
}

.customer-profile-more > summary::-webkit-details-marker { display: none; }

.customer-profile-more[open] > summary {
  margin-bottom: 10px;
}

@media (max-width: 720px) {
  .customer-address-row {
    grid-template-columns: 1fr 1fr;
  }
  .customer-address-row label:first-child {
    grid-column: 1 / -1;
  }
  .customer-vin-row {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 520px) {
  .customer-profile-form-grid,
  .customer-profile-more-grid {
    grid-template-columns: 1fr !important;
  }
  .customer-address-row {
    grid-template-columns: 1fr;
  }
  .customer-address-row label:first-child {
    grid-column: auto;
  }
}

.customer-profile-card header {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
}

.customer-profile-card header strong {
  display: block;
  font-size: 18px;
  font-weight: 900;
}

.customer-profile-card header span {
  color: var(--muted);
  font-weight: 700;
}

.customer-relationship-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 14px;
}

.company-profile-form {
  display: grid;
  gap: 16px;
}

.company-logo-upload-row {
  display: grid;
  grid-template-columns: minmax(160px, auto) minmax(200px, 1fr) auto;
  gap: 8px;
  align-items: center;
}

.company-logo-preview {
  max-height: 72px;
  max-width: 220px;
  object-fit: contain;
  margin-top: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 6px;
  background: #fff;
}

.company-profile-summary {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 14px;
  padding: 16px 22px;
  border-bottom: 1px solid var(--line);
  background: linear-gradient(180deg, #FFFFFF 0%, #F7FAFC 100%);
}

.company-profile-summary strong {
  display: block;
  font-size: 18px;
  font-weight: 900;
  color: var(--ink);
}

.company-seed-removal.danger-zone {
  margin-top: 16px;
  padding: 14px 16px;
  border: 1px solid color-mix(in srgb, var(--red) 35%, var(--border));
  border-radius: 10px;
  background: color-mix(in srgb, var(--red) 6%, var(--panel));
}

.company-seed-removal header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
}

.company-seed-removal h3 {
  margin: 0;
  font-size: 1rem;
}

.company-profile-summary span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.company-config-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  padding: 0 22px 4px;
}

.company-config-grid article {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255,255,255,.8);
  overflow: hidden;
}

.company-config-grid article > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 13px 14px;
  border-bottom: 1px solid var(--line);
  background: #F8FAFC;
}

.company-config-grid article > header strong {
  font-size: 13px;
  font-weight: 900;
}

.form-grid.compact {
  gap: 10px;
  padding: 14px;
}

.tenant-note {
  margin: 0 0 14px;
  padding: 12px 14px;
  border: 1px solid rgba(37,99,235,.16);
  border-radius: 8px;
  background: var(--blue-soft);
  color: var(--ink);
  font-size: 12.5px;
  font-weight: 700;
  line-height: 1.45;
  max-width: 100%;
  overflow-wrap: anywhere;
}

.panel .tenant-note {
  margin-left: 14px;
  margin-right: 14px;
}

.location-list {
  padding: 0 14px 14px;
}

.add-record-link {
  align-self: center;
  white-space: nowrap;
}
/* Company page — Sales Tax Rates callout (pastel yellow, cannot miss) */
.company-tax-rates-callout {
  margin: 0 0 14px;
  padding: 14px 16px;
  border: 2px solid #fcd34d;
  border-radius: 12px;
  background: linear-gradient(180deg, #fffbeb 0%, #fef3c7 55%, #fde68a 100%);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.75) inset, 0 6px 18px rgba(146, 64, 14, 0.1);
  color: #78350f;
}
.company-tax-rates-callout > header {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 8px;
}
.company-tax-rates-callout > header strong {
  display: block;
  font-size: 16px;
  font-weight: 800;
  color: #92400e;
  letter-spacing: 0.01em;
}
.company-tax-rates-kicker {
  display: block;
  margin-top: 2px;
  font-size: 12px;
  font-weight: 600;
  color: #a16207;
}
.company-tax-rates-callout > header .badge {
  background: #fef9c3;
  border: 1px solid #f59e0b;
  color: #92400e;
  font-weight: 700;
}
.company-tax-rates-callout > .meta {
  margin: 0 0 10px;
  color: #92400e;
}
.company-tax-rates-list {
  display: grid;
  gap: 8px;
}
.company-tax-rate-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: end;
  padding: 10px 12px;
  border: 1px solid #fcd34d;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.72);
}
.company-tax-rate-identity {
  flex: 1 1 160px;
  min-width: 140px;
}
.company-tax-rate-identity strong {
  display: block;
  color: #78350f;
  font-size: 13px;
}
.company-tax-rate-identity small {
  display: block;
  color: #a16207;
  font-size: 11px;
  font-weight: 500;
}
.company-tax-rate-field {
  display: grid;
  gap: 4px;
  margin: 0;
  font-size: 11px;
  font-weight: 700;
  color: #92400e;
  text-transform: none;
  letter-spacing: 0;
}
.company-tax-rate-field input {
  width: 110px;
  min-height: 36px;
  font-size: 14px;
  font-weight: 700;
  color: #78350f;
  border-color: #fbbf24;
  background: #fffbeb;
}
.company-tax-rate-save-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 36px;
  padding: 8px 14px;
  border-radius: 8px;
  border: 1px solid #f59e0b;
  background: linear-gradient(180deg, #fef9c3 0%, #fde68a 100%);
  color: #78350f;
  font-weight: 800;
  cursor: pointer;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.7) inset, 0 1px 2px rgba(146, 64, 14, 0.1);
}
.company-tax-rate-save-btn:hover {
  background: linear-gradient(180deg, #fde68a 0%, #fcd34d 100%);
  border-color: #d97706;
  color: #451a03;
}
.company-tax-rate-save-btn:disabled {
  opacity: 0.65;
  cursor: wait;
}
body.dark-mode .company-tax-rates-callout {
  background: linear-gradient(180deg, #4a3a12 0%, #3d2f0e 100%);
  border-color: #a1802a;
  color: #fde68a;
  box-shadow: none;
}
body.dark-mode .company-tax-rates-callout > header strong,
body.dark-mode .company-tax-rate-identity strong {
  color: #fef3c7;
}
body.dark-mode .company-tax-rates-kicker,
body.dark-mode .company-tax-rate-identity small,
body.dark-mode .company-tax-rates-callout > .meta {
  color: #fde68a;
}
body.dark-mode .company-tax-rate-row {
  background: rgba(0, 0, 0, 0.25);
  border-color: #a1802a;
}
body.dark-mode .company-tax-rate-field input {
  background: #2a220c;
  border-color: #a1802a;
  color: #fef3c7;
}
body.dark-mode .company-tax-rate-save-btn {
  background: linear-gradient(180deg, #5a4716 0%, #4a3a12 100%);
  border-color: #d4a940;
  color: #fef3c7;
}
/* "Add Customer" — pastel yellow button everywhere (replaces blue hyperlink look).
   Restored after v1124 tax-rates insert accidentally dropped this selector. */
button[data-add-customer],
button.link-button[data-add-customer],
button.add-record-link[data-add-customer] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 8px 16px;
  background: linear-gradient(180deg, #fefce8 0%, #fef3c7 100%);
  border: 1px solid #fde68a;
  border-radius: 8px;
  color: #92400e;
  font-weight: 800;
  text-decoration: none;
  cursor: pointer;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.7) inset, 0 1px 2px rgba(146, 64, 14, 0.08);
  transition: background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease, transform 0.05s ease;
}
button[data-add-customer]:hover,
button.link-button[data-add-customer]:hover,
button.add-record-link[data-add-customer]:hover {
  background: linear-gradient(180deg, #fef9c3 0%, #fde68a 100%);
  border-color: #fcd34d;
  color: #78350f;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.6) inset, 0 2px 6px rgba(146, 64, 14, 0.14);
}
button[data-add-customer]:active {
  transform: translateY(1px);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.4) inset;
}
button[data-add-customer]:focus-visible {
  outline: 2px solid #f59e0b;
  outline-offset: 2px;
}
body.dark-mode button[data-add-customer] {
  background: linear-gradient(180deg, #4a3a12 0%, #3d2f0e 100%);
  border-color: #a1802a;
  color: #fde68a;
  box-shadow: none;
}
body.dark-mode button[data-add-customer]:hover {
  background: linear-gradient(180deg, #5a4716 0%, #4a3a12 100%);
  border-color: #d4a940;
  color: #fef3c7;
}
/* Command-deck chip keeps its stacked label + hint layout, just tinted yellow. */
button.command-deck-btn[data-add-customer] {
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 2px;
  padding: 10px 12px;
  text-align: left;
  font-weight: inherit;
}
button.command-deck-btn[data-add-customer] small { color: #a16207; }
body.dark-mode button.command-deck-btn[data-add-customer] small { color: #fcd34d; }

.vin-decode-box {
  display: flex;
  align-items: center;
  gap: 10px;
  padding-top: 18px;
}

.vin-decode-box .meta {
  line-height: 1.35;
}

.vehicle-vin-decode-panel {
  padding: 12px 14px;
  border: 1px solid var(--border, #d8dee8);
  border-radius: 10px;
  background: var(--panel-soft, rgba(255, 255, 255, 0.02));
}

.vehicle-vin-decode-panel .panel-header-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}

.vehicle-vin-facts {
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
}

.document-vehicle-header {
  padding: 10px 12px;
  margin: 0 0 12px;
  border: 1px solid var(--border, #d8dee8);
  border-radius: 8px;
  background: var(--panel-soft, rgba(255, 255, 255, 0.02));
}

.document-vehicle-header.compact {
  margin-bottom: 8px;
  padding: 8px 10px;
}

.document-vehicle-headline {
  font-size: 13px;
  line-height: 1.45;
}

.document-vehicle-headline .document-vehicle-sep {
  color: var(--muted);
  font-weight: normal;
}

.document-vehicle-meta {
  margin-top: 4px;
}

.document-vehicle-wo {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-bottom: 4px;
}

.vehicle-vin-spec-form.compact .line-edit-grid {
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
}

.vehicle-rv-panel {
  margin-top: 12px;
  border: 1px solid var(--border, #d8dee8);
  border-radius: 8px;
  background: linear-gradient(180deg, rgba(34, 139, 84, 0.06), transparent 48px);
}

.vehicle-rv-panel .line-edit-grid {
  padding: 0 16px 16px;
}

.vehicle-rv-facts {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 8px 16px;
}

.specialty-unit-panel {
  margin-top: 12px;
  border: 1px solid var(--border, #d8dee8);
  border-radius: 8px;
  background: linear-gradient(180deg, rgba(59, 130, 246, 0.05), transparent 52px);
}

.specialty-unit-panel.marine-unit-panel {
  background: linear-gradient(180deg, rgba(37, 99, 235, 0.07), transparent 52px);
}

.specialty-unit-panel.motorsport-unit-panel {
  background: linear-gradient(180deg, rgba(124, 58, 237, 0.07), transparent 52px);
}

.specialty-unit-panel .line-edit-grid,
.specialty-unit-panel .table-wrap {
  padding: 0 16px 16px;
}

.ro-pay-type-breakdown {
  margin: 0 0 12px;
  padding: 12px 14px;
  border: 1px solid var(--border, #d8dee8);
  border-radius: 8px;
  background: linear-gradient(180deg, rgba(16, 185, 129, 0.06), transparent 48px);
}

.ro-pay-type-breakdown.compact header {
  margin-bottom: 8px;
}

.ro-pay-type-breakdown header {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  align-items: baseline;
  margin-bottom: 10px;
}

.ro-warranty-jobs-panel .panel-header-row,
.rental-fleet-panel .panel-header-row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
  flex-wrap: wrap;
}

.rental-fleet-panel .facts {
  padding: 0 16px 8px;
}

.specialty-config-summary .source-row {
  padding: 6px 0;
}

.company-vertical-config {
  border: 1px solid var(--border, #d8dee8);
  border-radius: 8px;
  padding: 12px 14px;
  background: var(--panel, #fff);
}

.company-vertical-config.wide {
  grid-column: 1 / -1;
}

.badge.purple {
  background: rgba(124, 58, 237, 0.14);
  color: #5b21b6;
  border: 1px solid rgba(124, 58, 237, 0.25);
}

.specialty-serial-table input,
.specialty-serial-table select,
.specialty-warranty-table input,
.specialty-warranty-table select {
  width: 100%;
  min-width: 88px;
}

.specialty-checklist-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 8px 14px;
  padding: 0 16px 12px;
}

.specialty-inspection-panel .detail-actions {
  padding: 0 16px 16px;
}

.workflow-context-rail {
  position: sticky;
  top: 0;
  z-index: 9;
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px 24px;
  padding: 10px 14px;
  margin-bottom: 12px;
  border: 1px solid rgba(0, 120, 180, 0.22);
  border-radius: 12px;
  background: linear-gradient(180deg, #fff 0%, #f4fafc 100%);
  box-shadow: 0 4px 16px rgba(15, 25, 35, 0.08);
}

.workflow-context-party,
.workflow-context-vehicle {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: min(100%, 220px);
}

.workflow-context-party small,
.workflow-context-vehicle small {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--muted);
}

.workflow-context-vehicle {
  align-items: flex-end;
  text-align: right;
}

.workflow-context-ymm {
  font-size: 13px;
  font-weight: 700;
}

.workflow-context-meta {
  max-width: 420px;
}

.workflow-context-party-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
}

.workflow-context-party-main {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.workflow-context-change-party {
  flex-shrink: 0;
  white-space: nowrap;
}

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

.workflow-party-reassign-current {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 10px 12px;
  margin-bottom: 12px;
  border-radius: 10px;
  background: var(--panel-soft, #f4f7fa);
  border: 1px solid var(--line);
}

.workflow-party-reassign .party-assignment-panel {
  margin-top: 8px;
}

.repair-shop-context-bar {
  display: flex;
  align-items: center;
  gap: 10px 16px;
  flex-wrap: wrap;
  padding: 10px 14px;
  margin-bottom: 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: linear-gradient(180deg, #fff 0%, #f8fbfd 100%);
}

.repair-shop-quick-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 12px;
}

.repair-shop-tile {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  min-height: 110px;
  text-align: left;
  padding: 14px 16px;
}

.repair-shop-tile-icon {
  font-size: 22px;
  line-height: 1;
}

.repair-shop-tile strong {
  font-size: 15px;
}

.repair-shop-tile small {
  color: var(--muted);
  line-height: 1.35;
}

.repair-shop-search-panel .repair-shop-search-wrap {
  position: relative;
}

.repair-shop-customer-search {
  width: 100%;
  max-width: 520px;
}

.repair-shop-customer-ta {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  right: 0;
  z-index: 12;
}

.repair-shop-pipeline {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
  gap: 8px;
}

.repair-shop-pipeline-card.active {
  outline: 2px solid #0078b4;
  outline-offset: 1px;
}

.repair-shop-home-hero .repair-shop-home-actions {
  flex-wrap: wrap;
  gap: 8px;
}

.repair-shop-garage-focus #repairShopGarageViewHost {
  min-height: calc(100vh - 180px);
}

.repair-shop-garage-module-head {
  display: flex;
  align-items: baseline;
  gap: 12px;
  margin-bottom: 8px;
}

.repair-shop-garage-module-head h2 {
  margin: 0;
}

.repair-shop-pipeline-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  padding: 14px 10px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
  cursor: pointer;
}

.repair-shop-pipeline-card strong {
  font-size: 24px;
  line-height: 1;
}

.repair-shop-pipeline-card small {
  color: var(--muted);
  text-align: center;
}

.repair-shop-pipeline-card.tone-blue { border-color: rgba(0, 120, 180, 0.25); background: #f4fafc; }
.repair-shop-pipeline-card.tone-gold { border-color: rgba(180, 130, 0, 0.25); background: #fffaf0; }
.repair-shop-pipeline-card.tone-green { border-color: rgba(0, 140, 80, 0.25); background: #f3fbf6; }

.repair-shop-accounting-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 12px;
  margin-bottom: 16px;
}

.repair-shop-account-card {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
}

.repair-shop-account-card small {
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-size: 10px;
}

.repair-shop-account-card strong {
  font-size: 22px;
}

.repair-shop-row-hint {
  margin: 0 0 10px;
}

.repairshop-role-context .service-role-stat {
  cursor: pointer;
}

.ro-mileage-header {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px 20px;
  padding: 12px 14px;
  margin-bottom: 12px;
  border: 1px solid rgba(180, 130, 0, 0.28);
  border-radius: 12px;
  background: linear-gradient(180deg, #fffdf7 0%, #fff8e8 100%);
}

.ro-mileage-header.ro-mileage-missing {
  border-color: rgba(200, 40, 40, 0.35);
  background: linear-gradient(180deg, #fff8f8 0%, #fff1f1 100%);
}

.ro-mileage-header-copy strong {
  display: block;
  font-size: 15px;
}

.ro-mileage-fields {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 18px;
}

.ro-mileage-field {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 160px;
}

.ro-mileage-field.required-missing input {
  border-color: var(--red);
  box-shadow: 0 0 0 1px rgba(200, 40, 40, 0.15);
}

.ro-header-detail-panel .ro-header-mileage-section {
  padding-top: 8px;
  margin-top: 4px;
  border-top: 1px dashed rgba(120, 130, 150, 0.25);
}

.ro-header-detail-panel .ro-header-mileage-section.ro-mileage-missing {
  padding: 10px;
  border: 1px solid rgba(200, 40, 40, 0.28);
  border-radius: 8px;
  background: linear-gradient(180deg, #fff8f8 0%, #fff1f1 100%);
}

.ro-overview-customer-panel {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 12px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
}

.ro-overview-customer-panel small,
.ro-overview-vehicle small {
  display: block;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--muted);
}

.ro-overview-ro-fields {
  margin-top: 0;
}

.ro-overview-lines-table tbody tr {
  cursor: pointer;
}

.ro-overview-actions {
  margin-top: 4px;
}

.ro-delete-blocked-note {
  color: var(--muted);
}

.deal-section-title-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}

.vin-picker-list {
  display: grid;
  gap: 8px;
  margin: 12px 0 16px;
}

.vin-picker-option {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  padding: 10px 12px;
  text-align: left;
}

.vin-picker-option strong {
  font-size: 13px;
}

dialog.parts-document-modal .workflow-context-rail {
  top: 0;
  margin: 0 0 12px;
}

.ro-detail-modal-body .workflow-context-rail,
.ro-overview-modal-body .workflow-context-rail,
#appointmentModalBody .workflow-context-rail,
.detail .workflow-context-rail {
  top: 0;
  border-radius: 0;
  margin: 0 0 12px;
  border-left: none;
  border-right: none;
}

.parts-doc-vehicle-header .document-vehicle-header {
  margin-bottom: 8px;
  border: none;
  padding: 0;
  background: transparent;
}

.parts-doc-vehicle-header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px 16px;
  padding: 10px 12px;
  margin-bottom: 10px;
  border: 1px solid var(--border, #d8dee8);
  border-radius: 8px;
  background: var(--panel-soft, rgba(255, 255, 255, 0.02));
}

.parts-doc-party-header {
  padding: 10px 12px;
  margin-bottom: 10px;
  border: 1px solid var(--border, #d8dee8);
  border-radius: 8px;
  background: var(--panel-soft, rgba(255, 255, 255, 0.02));
}

.parts-doc-party-header-label {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 8px 12px;
  margin-bottom: 8px;
}

.parts-doc-party-header-label small {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted);
}

.parts-doc-party-display-main {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.parts-doc-party-display-main small {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted);
}

.parts-doc-party-actions {
  display: flex;
  gap: 8px;
  margin-top: 8px;
}

.parts-doc-header-customer-vehicle {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.parts-kit-suggest-panel.dismissed {
  padding: 14px 16px;
  border-style: dashed;
  opacity: 0.92;
}

.parts-kit-suggest-dismissed {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
}

.parts-doc-vehicle-headline {
  flex: 1 1 240px;
  font-size: 13px;
}

.parts-doc-vehicle-header .parts-doc-vin-row {
  flex: 0 1 auto;
  padding-top: 0;
}

.empty-actions {
  display: flex;
  justify-content: center;
  gap: 14px;
  margin-top: 12px;
}

.archived-list-title {
  margin: 14px 0 8px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .4px;
  text-transform: uppercase;
}

.numbering-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
  gap: 14px;
  padding: 0 20px 20px;
}

.numbering-card {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  overflow: hidden;
}

.numbering-card > header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 13px 14px;
  border-bottom: 1px solid var(--line);
  background: #F8FAFC;
}

.numbering-fields {
  display: grid;
  gap: 10px;
  padding: 14px;
}

.numbering-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

body.dark-mode .enterprise-cockpit div,
body.dark-mode .customer-profile-card,
body.dark-mode .company-config-grid article {
  background: rgba(15,23,42,.72);
}

.primary {
  border: 1px solid var(--porter-teal);
  background: var(--porter-teal);
  color: #fff;
  padding: 0 14px;
}

.primary:hover {
  background: var(--porter-teal-2);
  border-color: var(--porter-teal-2);
  box-shadow: 0 4px 12px rgba(0,180,166,.3);
}

.secondary {
  border: 1px solid var(--line);
  background: var(--panel);
  color: var(--ink);
  padding: 0 12px;
}

.secondary:hover {
  border-color: #b0bec8;
  background: #f8fafc;
}

/* Expand = light purple; Collapse = even lighter purple */
button.btn-expand,
.secondary.btn-expand {
  background: var(--expand-btn-bg);
  border-color: var(--expand-btn-border);
  color: var(--expand-btn-text);
}
button.btn-expand:hover,
.secondary.btn-expand:hover {
  background: #c4b5fd;
  border-color: #a78bfa;
  color: #4c1d95;
}
button.btn-collapse,
.secondary.btn-collapse {
  background: var(--collapse-btn-bg);
  border-color: var(--collapse-btn-border);
  color: var(--collapse-btn-text);
}
button.btn-collapse:hover,
.secondary.btn-collapse:hover {
  background: #ede9fe;
  border-color: #ddd6fe;
  color: #5b21b6;
}

/* Integration credential Reset Data — light purple, sits at end of action row */
.integration-config-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.integration-config-actions .btn-reset-data {
  margin-left: auto;
}
.integration-webhook-manage {
  margin: 12px 0 8px;
  padding: 10px 0 2px;
  border-top: 1px solid rgba(15, 23, 42, 0.08);
}
.integration-webhook-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-top: 8px;
}

/* Super User vendor onboarding — IP detect, copy supply packet, webhook helpers */
.integration-setup-toolkit {
  margin: 0 0 16px;
  padding: 14px 16px;
  border-radius: 12px;
  border: 2px solid #c4b5fd;
  background: linear-gradient(180deg, #f5f3ff 0%, #ede9fe 100%);
  box-shadow: 0 1px 0 rgba(91, 33, 182, 0.06);
}
.integration-setup-toolkit-header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
}
.integration-setup-toolkit-header strong {
  font-size: 1.05rem;
  color: #4c1d95;
}
.integration-setup-checklist {
  margin: 0 0 12px 1.1rem;
  padding: 0;
  color: #3730a3;
  font-size: 0.92rem;
  line-height: 1.45;
}
.integration-setup-checklist li {
  margin-bottom: 4px;
}
.integration-setup-ip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-top: 6px;
}
.integration-setup-ip-row input {
  flex: 1 1 180px;
  min-width: 140px;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-weight: 600;
}
.integration-setup-toolkit-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}
.integration-setup-toolkit-actions .primary,
.integration-setup-toolkit-actions .secondary {
  font-weight: 600;
}
.integration-setup-toolkit .meta {
  display: block;
  margin-top: 6px;
}
button.btn-reset-data {
  background: var(--expand-btn-bg, #ddd6fe);
  border: 1px solid var(--expand-btn-border, #c4b5fd);
  color: var(--expand-btn-text, #5b21b6);
  font-weight: 600;
  border-radius: 8px;
  padding: 0.55rem 1rem;
  cursor: pointer;
}
button.btn-reset-data:hover {
  background: #c4b5fd;
  border-color: #a78bfa;
  color: #4c1d95;
}

button.secondary:disabled,
button.primary:disabled {
  opacity: 0.55;
  cursor: not-allowed;
  box-shadow: none;
}

button.secondary:disabled:hover {
  border-color: var(--line);
  background: var(--panel);
}

button.primary:disabled:hover {
  filter: none;
}

.danger {
  border: 1px solid var(--red);
  background: var(--red-soft);
  color: var(--red);
  padding: 0 12px;
}

.danger:hover {
  background: var(--red);
  color: #fff;
}

.icon-button {
  width: 36px;
  height: 36px;
  border: 1px solid var(--line);
  background: var(--panel);
  color: var(--muted);
  padding: 0;
  font-size: 18px;
  position: relative;
}

.icon-button:hover {
  border-color: #b0bec8;
  color: var(--ink);
  background: #f8fafc;
}

.notif-button { color: var(--muted); }
.notif-dot {
  position: absolute;
  top: 6px;
  right: 6px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--porter-gold);
  border: 2px solid var(--panel);
}

/* ─────────────────────────────────────────────────────────────────────────────
   VIEWS
───────────────────────────────────────────────────────────────────────────── */
.view { display: none; }
.view.active {
  display: grid;
  gap: 18px;
  min-width: 0;
  max-width: 100%;
  overflow-x: clip;
  animation: fadeSlide var(--slow) var(--ease);
}

@keyframes fadeSlide {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ─────────────────────────────────────────────────────────────────────────────
   KPI CARDS
───────────────────────────────────────────────────────────────────────────── */
.kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.kpi {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 18px;
  box-shadow: var(--shadow-sm);
  position: relative;
  overflow: hidden;
  transition: transform var(--fast) var(--ease), box-shadow var(--fast) var(--ease);
}

.kpi:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow);
}

.kpi::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--porter-teal), var(--porter-gold));
  opacity: 0;
  transition: opacity var(--mid) var(--ease);
}

.kpi:hover::before { opacity: 1; }

.kpi-label {
  color: var(--muted);
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .4px;
}

.kpi-value {
  display: block;
  margin: 10px 0 4px;
  font-size: 28px;
  font-weight: 800;
  letter-spacing: -1px;
  color: var(--ink);
  line-height: 1;
}

.kpi-sub {
  display: block;
  font-size: 12px;
  color: var(--muted);
}

.kpi-trend {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-size: 11.5px;
  font-weight: 700;
  margin-top: 8px;
}

.kpi-trend.up   { color: var(--green); }
.kpi-trend.down { color: var(--red); }
.kpi-trend.flat { color: var(--muted); }

/* ─────────────────────────────────────────────────────────────────────────────
   GRID LAYOUTS
───────────────────────────────────────────────────────────────────────────── */
.grid-2 {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(0, 0.6fr);
  gap: 18px;
  min-width: 0;
}

.grid-2-even {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.grid-3 {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

/* ─────────────────────────────────────────────────────────────────────────────
   PANELS
───────────────────────────────────────────────────────────────────────────── */
.panel {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 12px;
  box-shadow: 0 14px 38px rgba(26, 78, 121, .09), var(--shadow-sm);
  backdrop-filter: blur(8px);
  min-width: 0;
  overflow: hidden;
}

.panel > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 18px;
  border-bottom: 1px solid var(--line);
}

.panel h2, .panel h3 {
  margin: 0;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: -0.2px;
}

.panel-body {
  padding: 16px 18px;
}

.panel-body.flush { padding: 0; }

/* Panel filters bar */
.panel-filters {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 18px;
  border-bottom: 1px solid var(--line);
  background: #FAFBFC;
  flex-wrap: wrap;
}

.batch-post-filters label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin: 0;
  cursor: default;
}

.batch-post-filters input[type="date"] {
  cursor: pointer;
}

/* ─────────────────────────────────────────────────────────────────────────────
   CHART CONTAINERS
───────────────────────────────────────────────────────────────────────────── */
.chart-wrap {
  position: relative;
  padding: 16px 18px;
}

.chart-wrap canvas {
  max-height: 220px;
}

/* ─────────────────────────────────────────────────────────────────────────────
   TABLES
───────────────────────────────────────────────────────────────────────────── */
.table-wrap {
  overflow-x: auto;
}

.table-wrap table thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: #f8fafc;
  box-shadow: 0 1px 0 var(--line);
}

.table-wrap tbody tr:hover {
  background: rgba(0, 180, 166, .04);
}

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

th, td {
  padding: 10px 14px;
  border-bottom: 1px solid var(--line);
  text-align: left;
  vertical-align: middle;
}

th {
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .4px;
  background: #eef7fe;
  position: sticky;
  top: 0;
  z-index: 1;
}

tr:last-child td { border-bottom: 0; }

tbody tr {
  transition: background var(--fast) var(--ease);
}

tbody tr:hover { background: #F8FBFD; }

td small {
  display: block;
  color: var(--muted);
  font-size: 11.5px;
  margin-top: 2px;
}

/* ─────────────────────────────────────────────────────────────────────────────
   STATUS BADGES
───────────────────────────────────────────────────────────────────────────── */
.badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 9px;
  border-radius: 999px;
  font-size: 11.5px;
  font-weight: 700;
  white-space: nowrap;
  background: var(--blue-soft);
  color: var(--blue);
}

.badge::before {
  content: '';
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: currentColor;
  flex: 0 0 auto;
}

.badge.green  { background: var(--green-soft); color: var(--green); }
.badge.gold   { background: var(--gold-soft);  color: var(--gold); }
.badge.red    { background: var(--red-soft);   color: var(--red); }
.badge.purple { background: var(--purple-soft); color: var(--purple); }
.badge.gray   { background: #F1F5F9; color: var(--muted); }
.badge.sync-pending { background: var(--gold-soft); color: var(--gold); }
.badge.sync-done    { background: var(--green-soft); color: var(--green); }

.succession-card {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 14px 16px;
  box-shadow: var(--shadow-sm);
}
.succession-card strong { display: block; font-size: 15px; margin-bottom: 4px; }
.succession-card .readiness-bar {
  height: 6px;
  border-radius: 999px;
  background: var(--line);
  margin: 8px 0;
  overflow: hidden;
}
.succession-card .readiness-bar span {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, var(--porter-teal), var(--green));
  border-radius: inherit;
}

.dvi-upload-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
.dvi-area-card {
  border: 1px dashed var(--line);
  border-radius: 10px;
  padding: 12px;
  text-align: center;
}
.dvi-area-card img { max-width: 100%; border-radius: 8px; margin-top: 8px; }

.kpi-drill { cursor: pointer; transition: transform var(--fast) var(--ease), box-shadow var(--fast) var(--ease); }
.kpi-drill:hover { transform: translateY(-2px); box-shadow: var(--shadow); }

.kpi-label-link,
.pipeline-stage-link,
.drill-stat-link {
  background: none;
  border: 0;
  padding: 0;
  color: inherit;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
  text-decoration: underline;
  text-decoration-color: rgba(0, 180, 166, .45);
  text-underline-offset: 3px;
}

.kpi-label-link:hover,
.pipeline-stage-link:hover,
.drill-stat-link:hover {
  color: var(--porter-teal);
}

.drill-badge {
  cursor: pointer;
  border: 0;
  font: inherit;
}

.drill-badge:hover {
  filter: brightness(1.05);
  box-shadow: var(--shadow-sm);
}

.drill-filter-banner {
  margin: 0 0 14px;
  padding: 10px 14px;
  border-radius: 8px;
  border: 1px solid rgba(0, 180, 166, .28);
  background: rgba(0, 180, 166, .08);
  font-size: 13px;
}

.drill-row .drill-value {
  font-weight: 800;
}

.cockpit-drill {
  display: grid;
  gap: 2px;
  width: 100%;
  padding: 10px 12px;
  border: 1px solid transparent;
  border-radius: 8px;
  background: transparent;
  text-align: left;
  cursor: pointer;
  transition: border-color var(--fast) var(--ease), background var(--fast) var(--ease);
}

.cockpit-drill:hover {
  border-color: rgba(0, 180, 166, .35);
  background: rgba(0, 180, 166, .06);
}

.cockpit-drill strong { font-size: 18px; }
.cockpit-drill span { font-size: 12px; font-weight: 700; color: var(--muted); }
.cockpit-drill small { font-size: 11px; color: var(--muted); }

.pipeline-dim {
  opacity: .45;
}

.goal-val .link-button {
  font-weight: 800;
  font-size: inherit;
}

.ai-insights-panel .insight-chip {
  display: inline-flex;
  align-items: center;
  margin: 0 8px 8px 0;
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: var(--panel);
  font-size: 13px;
  cursor: pointer;
}
.ai-insights-panel .insight-chip.gold { border-color: var(--gold); color: var(--gold); background: var(--gold-soft); }
.ai-insights-panel .insight-chip.red { border-color: var(--red); color: var(--red); background: var(--red-soft); }
.ai-insights-panel .insight-chip.green { border-color: var(--green); color: var(--green); background: var(--green-soft); }

.goal-badge .goal-val { animation: goalPulse 2.4s ease-in-out infinite; }
@keyframes goalPulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.72; }
}

/* ─────────────────────────────────────────────────────────────────────────────
   CARDS
───────────────────────────────────────────────────────────────────────────── */
.cards { display: grid; gap: 10px; }

.card {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 14px;
  box-shadow: var(--shadow-sm);
  transition: border-color var(--fast) var(--ease), box-shadow var(--fast) var(--ease);
}

.card:hover {
  border-color: #b0bec8;
  box-shadow: var(--shadow);
}

.card-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
  margin-bottom: 8px;
}

.card-header strong {
  font-size: 13.5px;
  font-weight: 700;
  overflow-wrap: anywhere;
}

.card-meta {
  color: var(--muted);
  font-size: 12px;
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}

.card-meta .dot::before {
  content: '•';
  margin: 0 2px;
}

/* Priority indicators */
.priority-high   { border-left: 3px solid var(--red); }
.priority-medium { border-left: 3px solid var(--gold); }
.priority-low    { border-left: 3px solid var(--green); }

/* ─────────────────────────────────────────────────────────────────────────────
   TIMELINE / ACTIVITY FEED
───────────────────────────────────────────────────────────────────────────── */
.timeline {
  display: grid;
  gap: 0;
}

.timeline article {
  display: flex;
  gap: 12px;
  padding: 12px 18px;
  border-bottom: 1px solid var(--line);
}

.timeline article:last-child { border-bottom: 0; }

.timeline-dot {
  flex: 0 0 auto;
  width: 8px;
  height: 8px;
  margin-top: 5px;
  border-radius: 50%;
  background: var(--porter-teal);
}

.timeline time {
  display: block;
  color: var(--muted);
  font-size: 11px;
  margin-bottom: 2px;
}

.timeline p {
  margin: 0;
  font-size: 13px;
  line-height: 1.5;
}

/* ─────────────────────────────────────────────────────────────────────────────
   MODULE HEADER
───────────────────────────────────────────────────────────────────────────── */
.module-header {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 14px;
  padding: 20px 22px;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 12px;
  box-shadow: var(--shadow-sm);
}

.module-header-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

.module-workflow-bar {
  border-top: 1px solid var(--line);
  padding-top: 14px;
  display: grid;
  gap: 10px;
}

.module-workflow-primary {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 14px;
}

.module-workflow-search {
  display: grid;
  gap: 4px;
  min-width: min(320px, 100%);
  flex: 1 1 240px;
}

.module-workflow-search-label {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--muted);
}

.module-workflow-search input {
  width: 100%;
  padding: 9px 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
  font-size: 13px;
}

.module-workflow-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.workflow-stat {
  display: grid;
  gap: 2px;
  padding: 6px 10px;
  border-radius: 10px;
  background: rgba(0, 180, 166, .08);
  border: 1px solid rgba(0, 180, 166, .16);
  min-width: 72px;
}

.workflow-stat strong {
  font-size: 14px;
  line-height: 1.1;
}

.workflow-stat small {
  font-size: 10px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .03em;
}

.module-workflow-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.workflow-kbd-hint {
  font-size: 11px;
  color: var(--muted);
  padding: 4px 8px;
  border-radius: 8px;
  background: rgba(15, 25, 35, .05);
  border: 1px solid var(--line);
}

.module-workflow-tips {
  padding: 10px 12px;
  border-radius: 10px;
  background: linear-gradient(135deg, rgba(37, 99, 235, .06), rgba(0, 180, 166, .06));
  border: 1px solid rgba(37, 99, 235, .12);
}

.module-workflow-tips.collapsed {
  display: none;
}

.module-workflow-tips ol {
  margin: 8px 0 6px;
  padding-left: 18px;
  color: var(--ink);
  font-size: 13px;
}

.module-workflow-tips li + li { margin-top: 4px; }

.workflow-shortcut-key {
  cursor: pointer;
}

.workflow-shortcut-key:hover {
  color: var(--porter-teal);
}

.workflow-filtered-out {
  display: none !important;
}

button.micro, .secondary.micro {
  padding: 5px 10px;
  font-size: 11px;
}

.nav-button.nav-priority:not(.active) {
  color: rgba(255, 255, 255, .86);
}

.nav-button.nav-priority:not(.active) .nav-icon {
  opacity: 1;
}

#densityToggle.active {
  color: var(--porter-teal);
  background: rgba(0, 180, 166, .12);
}

body.compact-density {
  font-size: 13px;
}

body.compact-density .module-header {
  padding: 14px 16px;
  gap: 10px;
}

body.compact-density .panel header,
body.compact-density .panel-body {
  padding-top: 10px;
  padding-bottom: 10px;
}

body.compact-density th,
body.compact-density td {
  padding: 7px 10px;
  font-size: 12px;
}

body.compact-density .form-grid label input,
body.compact-density .form-grid label select,
body.compact-density .form-grid label textarea {
  padding: 7px 10px;
}

body.compact-density .record-button {
  padding: 8px 10px;
}

body.compact-density .kpis .kpi,
body.compact-density .workspace-stat-chips .badge {
  transform: scale(.96);
}

/* ── iPad / touch mode (toggle in top bar) ─────────────────────────────────── */
#ipadModeToggle.active {
  color: var(--porter-teal);
  background: rgba(0, 180, 166, .12);
}

#densityToggle:disabled {
  opacity: .45;
  cursor: not-allowed;
}

body.ipad-mode {
  -webkit-tap-highlight-color: rgba(0, 180, 166, .18);
  touch-action: manipulation;
}

body.ipad-mode button,
body.ipad-mode .icon-button,
body.ipad-mode .subtab,
body.ipad-mode .nav-button,
body.ipad-mode .record-button,
body.ipad-mode .link-button,
body.ipad-mode .search-party-btn,
body.ipad-mode .ta-item,
body.ipad-mode .breadcrumb-item button {
  touch-action: manipulation;
}

body.ipad-mode .icon-button,
body.ipad-mode #densityToggle,
body.ipad-mode #ipadModeToggle,
body.ipad-mode #darkModeToggle {
  width: 44px;
  height: 44px;
  min-width: 44px;
  min-height: 44px;
}

body.ipad-mode button,
body.ipad-mode .primary,
body.ipad-mode .secondary,
body.ipad-mode .danger {
  min-height: 44px;
  padding: 10px 16px;
  font-size: 14px;
}

body.ipad-mode button.compact,
body.ipad-mode .secondary.compact,
body.ipad-mode .primary.compact,
body.ipad-mode .link-button {
  min-height: 40px;
  padding: 8px 14px;
  font-size: 13px;
}

body.ipad-mode .subtab,
body.ipad-mode .sub-tab-strip .subtab {
  min-height: 44px;
  padding: 0 16px;
  font-size: 14px;
}

body.ipad-mode .subtabs,
body.ipad-mode .sub-tab-strip {
  flex-wrap: nowrap;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 4px;
  scrollbar-width: thin;
}

body.ipad-mode .form-grid label input,
body.ipad-mode .form-grid label select,
body.ipad-mode .form-grid label textarea,
body.ipad-mode input[type="search"],
body.ipad-mode input[type="text"],
body.ipad-mode input[type="email"],
body.ipad-mode input[type="tel"],
body.ipad-mode input[type="number"],
body.ipad-mode input[type="password"],
body.ipad-mode select,
body.ipad-mode textarea {
  min-height: 44px;
  font-size: 16px;
}

body.ipad-mode th,
body.ipad-mode td {
  padding: 12px 14px;
}

body.ipad-mode .record-button {
  min-height: 56px;
  padding: 12px 14px;
}

body.ipad-mode .record-button strong,
body.ipad-mode .record-button .record-meta {
  font-size: 14px;
}

body.ipad-mode .clickable-row,
body.ipad-mode .source-row,
body.ipad-mode .dispatch-card,
body.ipad-mode .shop-ro-card,
body.ipad-mode .inv-card,
body.ipad-mode .opportunity-card {
  min-height: 44px;
}

body.ipad-mode .topbar-right .secondary,
body.ipad-mode .topbar-right .primary,
body.ipad-mode .messages-topbar-btn {
  min-height: 44px;
}

body.ipad-mode .mobile-help-fab {
  width: 56px;
  height: 56px;
  font-size: 13px;
  bottom: calc(16px + env(safe-area-inset-bottom, 0px));
  right: calc(16px + env(safe-area-inset-right, 0px));
}

body.ipad-mode main {
  padding-bottom: calc(20px + env(safe-area-inset-bottom, 0px));
}

body.ipad-mode dialog {
  max-height: calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 16px);
}

body.ipad-mode .modal-header .icon-button {
  width: 44px;
  height: 44px;
}

body.ipad-mode input[type="checkbox"],
body.ipad-mode input[type="radio"] {
  width: 22px;
  height: 22px;
  flex: 0 0 22px;
}

body.ipad-mode .check-row {
  min-height: 44px;
  gap: 12px;
}

body.ipad-mode .dispatch-card,
body.ipad-mode .recon-card[draggable="true"] {
  cursor: pointer;
}

body.ipad-mode .dispatch-card::after,
body.ipad-mode .recon-card[draggable="true"]::after {
  content: "Tap to open";
  display: block;
  font-size: 11px;
  font-weight: 700;
  color: var(--porter-teal);
  margin-top: 4px;
}

body.ipad-mode .service-ro-list-hint {
  background: rgba(0, 180, 166, .08);
  border: 1px solid rgba(0, 180, 166, .2);
  border-radius: 8px;
  padding: 10px 12px;
}

.onboarding-tour {
  position: fixed;
  inset: 0;
  z-index: 12000;
  pointer-events: none;
}

.onboarding-tour-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(8, 18, 30, .62);
  pointer-events: auto;
}

.onboarding-tour-spotlight {
  position: fixed;
  border-radius: 12px;
  box-shadow: 0 0 0 9999px rgba(8, 18, 30, .62);
  border: 2px solid rgba(0, 200, 184, .85);
  pointer-events: none;
  transition: all var(--mid) var(--ease);
}

.onboarding-tour-card {
  position: fixed;
  z-index: 2;
  width: min(380px, calc(100vw - 32px));
  padding: 18px 18px 14px;
  border-radius: 14px;
  background: var(--panel);
  border: 1px solid var(--line);
  box-shadow: var(--shadow-lg);
  pointer-events: auto;
}

.onboarding-tour-card h2 {
  margin: 6px 0 8px;
  font-size: 18px;
}

.onboarding-tour-card p {
  margin: 0;
  color: var(--muted);
  line-height: 1.5;
  font-size: 13px;
}

.onboarding-tour-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 16px;
}

.onboarding-tour-actions > div {
  display: flex;
  gap: 8px;
}

body.tour-active .shell > main {
  pointer-events: none;
}

.module-header-left h2 {
  margin: 6px 0 0;
  font-size: 20px;
  font-weight: 800;
  letter-spacing: -0.4px;
}

.module-header-left p {
  margin: 6px 0 0;
  color: var(--muted);
  font-size: 13px;
  max-width: 680px;
}

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

/* ─────────────────────────────────────────────────────────────────────────────
   SPLIT LIST (master-detail)
───────────────────────────────────────────────────────────────────────────── */
.split-list {
  display: grid;
  grid-template-columns: 300px minmax(0, 1fr);
  gap: 18px;
}

.record-list {
  display: grid;
  gap: 6px;
  align-content: start;
}

.record-list-scroll {
  display: grid;
  gap: 6px;
  max-height: min(72vh, 640px);
  overflow-y: auto;
  padding-right: 4px;
  scroll-behavior: smooth;
}

.service-ro-list-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 4px 2px 8px;
  gap: 8px;
  flex-wrap: wrap;
}

.service-ro-search-wrap {
  display: grid;
  gap: 4px;
  padding: 0 0 8px;
  position: sticky;
  top: 0;
  z-index: 2;
  background: var(--bg, #f4f7f9);
}

.service-ro-search-row {
  display: flex;
  gap: 6px;
  align-items: center;
}

.service-ro-search-wrap input[type="search"] {
  flex: 1;
  width: 100%;
  min-width: 0;
}

.recent-ro-strip {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  padding: 0 0 8px;
}

.recent-ro-label {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .4px;
  color: var(--muted);
}

.recent-ro-chip {
  padding: 4px 10px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--panel);
  font-size: 11px;
  font-weight: 600;
  cursor: pointer;
  transition: border-color .15s, background .15s;
}

.recent-ro-chip:hover {
  border-color: var(--accent, #0d9488);
}

.recent-ro-chip.active {
  border-color: var(--porter-teal, #00b4a6);
  background: #f0fdfb;
}

.service-ro-search-count {
  font-size: 11px;
  padding: 0 2px;
}

.service-ro-list-hint {
  margin: 6px 0 0;
  font-size: 11px;
  padding: 0 2px;
}

.service-ro-list-hint kbd {
  display: inline-block;
  padding: 1px 5px;
  border: 1px solid var(--line);
  border-radius: 4px;
  background: var(--panel);
  font-size: 10px;
  font-family: inherit;
}

.service-role-context {
  margin-bottom: 14px;
}

.service-role-context-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
  padding: 14px 16px;
}

.service-role-identity {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.service-role-identity strong {
  font-size: 15px;
}

.service-role-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.service-role-stat {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  min-width: 88px;
  padding: 8px 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--panel);
  cursor: pointer;
  transition: border-color .15s, box-shadow .15s, background .15s;
  font: inherit;
  color: inherit;
}

.service-role-stat:hover {
  border-color: var(--accent, #0d9488);
  box-shadow: var(--shadow-sm);
}

.service-role-stat.active {
  border-color: var(--porter-teal, #00b4a6);
  background: #f0fdfb;
  box-shadow: 0 0 0 2px rgba(0,180,166,.12);
}

.service-role-stat strong {
  font-size: 18px;
  line-height: 1.1;
}

.service-role-stat small {
  font-size: 10px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .3px;
}

.service-role-stat.gold strong { color: #b45309; }
.service-role-stat.blue strong { color: #0369a1; }
.service-role-stat.purple strong { color: #7c3aed; }
.service-role-stat.red strong { color: #dc2626; }

.sales-role-context,
.parts-role-context,
.bdc-role-context,
.prospects-role-context,
.crm-role-context,
.bhph-role-context,
.inventory-role-context,
.accounting-role-context,
.reports-role-context,
.repairshop-role-context {
  margin-bottom: 14px;
}

.parts-ro-layout {
  display: grid;
  grid-template-columns: minmax(320px, 1.05fr) minmax(420px, 1.35fr);
  gap: 14px;
  align-items: start;
}

.parts-ro-list-panel .panel-intro {
  padding: 0 16px 8px;
}

.parts-ro-filters {
  display: grid;
  gap: 10px;
  padding: 0 16px 12px;
}

.parts-ro-filter-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.parts-ro-filter-chips .chip {
  min-height: 34px;
  padding: 0 12px;
  border: 1px solid #b0bec8;
  border-radius: 999px;
  background: #f1f5f9;
  color: var(--ink);
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: background var(--fast) var(--ease), border-color var(--fast) var(--ease), color var(--fast) var(--ease);
}

.parts-ro-filter-chips .chip:hover:not(.active) {
  background: #e2e8f0;
  border-color: #94a3b8;
  color: var(--ink);
}

.parts-ro-filter-chips .chip.active {
  background: var(--porter-teal);
  color: #fff;
  border-color: var(--porter-teal);
}

body.dark-mode .parts-ro-filter-chips .chip {
  background: rgba(15, 25, 35, 0.55);
  border-color: var(--line);
  color: var(--ink);
}

body.dark-mode .parts-ro-filter-chips .chip:hover:not(.active) {
  background: rgba(15, 25, 35, 0.72);
}

body.dark-mode .parts-ro-filter-chips .chip.active {
  background: var(--porter-teal);
  color: #fff;
  border-color: var(--porter-teal);
}

.parts-ro-workbench .parts-workflow-lines,
.ro-detail-parts-block .parts-workflow-lines {
  overflow: visible;
  max-height: none;
}

.parts-ro-workbench .ro-detail-part-line {
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.72);
}

.parts-ro-workbench .ro-detail-part-line:focus-within {
  border-color: rgba(0, 180, 166, 0.45);
  box-shadow: 0 0 0 3px rgba(0, 180, 166, 0.12);
}

.ro-detail-part-line.ro-part-entry-added {
  opacity: 0.55;
  background: rgba(0, 180, 166, 0.08);
  border-color: rgba(0, 180, 166, 0.4);
  pointer-events: none;
}

.parts-ro-workbench .parts-batch-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.ro-part-search-wrap .field-label,
.workflow-part-search-wrap .field-label {
  display: block;
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--muted);
  margin-bottom: 6px;
}

.ro-part-search-wrap .ro-part-typeahead,
.workflow-part-search-wrap .workflow-part-typeahead {
  z-index: 120;
}

.parts-ro-workbench .ro-part-search-wrap,
.ro-detail-parts-block .ro-part-search-wrap {
  overflow: visible;
}

.company-gate-enterprise-details {
  border: 1px solid rgba(33, 97, 140, .12);
  border-radius: 10px;
  padding: 0 12px 12px;
  background: rgba(255,255,255,.5);
}

.company-gate-enterprise-details summary {
  cursor: pointer;
  font-weight: 700;
  padding: 12px 4px;
  color: var(--ink);
  list-style: none;
}

.company-gate-enterprise-details summary::-webkit-details-marker {
  display: none;
}

.company-gate-recent-locations-host {
  display: grid;
  gap: 8px;
}

.company-gate-recent-locations-host:empty {
  display: none;
}

.company-gate-browse-hint {
  margin: 0 0 10px;
}

.company-gate-list-search {
  max-height: min(42vh, 420px);
  overflow-y: auto;
  overscroll-behavior: contain;
  padding-right: 4px;
}

.company-gate-location-chip {
  max-width: 100%;
  text-align: left;
  white-space: normal;
}

.parts-ro-workbench > header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 14px 18px;
  border-bottom: 1px solid var(--line);
}

.parts-ro-workbench-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.parts-ro-workbench-actions .secondary.compact {
  color: var(--ink);
  background: var(--panel);
  border-color: var(--line);
}

.parts-quick-search-body {
  display: grid;
  gap: 12px;
}

.parts-quick-search-results {
  max-height: min(58vh, 520px);
  overflow: auto;
}

.parts-quick-search-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  white-space: nowrap;
}

.parts-ro-table-wrap {
  max-height: 420px;
  overflow: auto;
}

.parts-ro-row.selected td {
  background: color-mix(in srgb, var(--teal) 12%, transparent);
}

.parts-ro-workbench .parts-ro-workbench-meta {
  display: grid;
  gap: 6px;
  padding: 0 16px 12px;
  border-bottom: 1px solid var(--line);
}

.parts-ro-workbench-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.parts-ro-lines-summary {
  display: grid;
  gap: 10px;
  padding: 12px 16px;
}

.parts-ro-op-line {
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 10px 12px;
  background: var(--panel);
}

.parts-ro-op-line.locked {
  opacity: 0.72;
}

.parts-ro-op-head {
  font-size: 13px;
  margin-bottom: 6px;
}

.parts-ro-parts-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.parts-ro-part-chip {
  display: inline-flex;
  align-items: center;
  padding: 4px 8px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--teal) 10%, var(--panel));
  border: 1px solid var(--line);
  font-size: 12px;
}

.parts-ro-line-parts-table {
  margin-top: 8px;
}

.parts-ro-line-parts-table.parts-ro-line-highlight,
.parts-ro-op-line.parts-ro-line-highlight {
  outline: 2px solid color-mix(in srgb, var(--teal) 55%, transparent);
  outline-offset: 2px;
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--teal) 12%, transparent);
  transition: outline-color 0.2s ease, box-shadow 0.2s ease;
}

.parts-ro-line-empty {
  margin: 6px 0 0;
}

.parts-ro-workbench .ro-detail-parts-block {
  margin: 0 16px 16px;
}

@media (max-width: 1100px) {
  .parts-ro-layout {
    grid-template-columns: 1fr;
  }
}

.accounting-context-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  margin-bottom: 10px;
  padding: 10px 14px;
  background: linear-gradient(180deg, rgba(37, 99, 235, 0.06), rgba(37, 99, 235, 0.02));
  border: 1px solid var(--line);
  border-radius: 12px;
}

.accounting-context-tab {
  margin-left: auto;
}

.accounting-quick-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 14px;
}

.accounting-quick-nav-btn {
  border: 1px solid var(--line);
  background: var(--panel, #fff);
  color: var(--text, #0f172a);
  border-radius: 999px;
  padding: 7px 14px;
  font-size: 0.92rem;
  font-weight: 600;
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease, color 0.15s ease;
}

.accounting-quick-nav-btn:hover {
  border-color: var(--accent, #2563eb);
  color: var(--accent, #2563eb);
}

.accounting-quick-nav-btn.active {
  background: var(--accent, #2563eb);
  border-color: var(--accent, #2563eb);
  color: #fff;
}

.learned-data-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 12px;
}

.learned-data-card {
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 12px 14px;
  background: var(--panel, #fff);
}

.learned-data-card header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
}

.learned-data-card header strong {
  flex: 1;
  font-size: 0.95rem;
}

.learned-data-card .score-ring {
  font-weight: 700;
  font-size: 0.85rem;
  padding: 2px 8px;
  border-radius: 999px;
  background: rgba(100, 116, 139, 0.12);
}

.learned-data-card .score-ring.hot {
  background: rgba(234, 88, 12, 0.15);
  color: #c2410c;
}

.forms-powersports-coverage-callout {
  margin-bottom: 12px;
  border-left: 4px solid var(--accent, #2563eb);
}

.forms-powersports-coverage-callout.gold {
  border-left-color: #d97706;
}

.accounting-tab-groups {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 14px;
  padding: 12px 14px;
  background: var(--panel, #f8fafc);
  border: 1px solid var(--line);
  border-radius: 12px;
}

.fuzzy-acct-tabs {
  flex-wrap: wrap;
  gap: 6px;
}

.acct-catalog-browser {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.acct-catalog-chips {
  flex-wrap: wrap;
  gap: 6px;
}

.acct-catalog-chips .secondary.active,
.acct-catalog-chips button.active {
  border-color: var(--accent, #2563eb);
  color: var(--accent, #2563eb);
}

.acct-catalog-group {
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 8px 12px 12px;
  background: rgba(255, 255, 255, 0.55);
  margin-bottom: 10px;
}

.acct-catalog-group > summary {
  cursor: pointer;
  list-style: none;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px 0;
}

.acct-catalog-group > summary::-webkit-details-marker {
  display: none;
}

.acct-catalog-category {
  margin-top: 10px;
}

.acct-catalog-category h4 {
  margin: 0 0 6px;
  font-size: 13px;
  font-weight: 650;
}

.company-module-access-panel .company-module-access-grid {
  margin-top: 8px;
}

.company-module-access-panel .permission-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 8px 12px;
}

.accounting-tab-group {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
}

.accounting-tab-group-label {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--muted);
  min-width: 120px;
}

.accounting-subtabs {
  flex: 1;
  margin: 0;
  padding: 0;
  border: none;
  background: transparent;
}

.accounting-subtabs .subtab {
  font-size: 12px;
  padding: 6px 12px;
}

.accounting-workbench-card {
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 14px 16px;
  background: #fff;
}

.accounting-blocker-list {
  margin: 8px 0 0;
  padding-left: 18px;
  color: var(--muted);
  font-size: 13px;
}

.accounting-voucher-form,
.accounting-recurring-form {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: 10px 12px;
  align-items: end;
}

.accounting-voucher-form .primary,
.accounting-recurring-form .primary {
  grid-column: 1 / -1;
  justify-self: start;
}

body.dark-mode .accounting-tab-groups { background: rgba(255,255,255,0.04); }
body.dark-mode .accounting-context-bar { background: rgba(255,255,255,0.04); }
body.dark-mode .accounting-quick-nav-btn { background: rgba(255,255,255,0.04); }
body.dark-mode .learned-data-card { background: rgba(255,255,255,0.03); }
body.dark-mode .accounting-workbench-card { background: rgba(255,255,255,0.03); }

.accounting-tab-nav.collapsed { margin-bottom: 10px; }
.accounting-tab-groups--nested {
  margin-bottom: 0;
  padding: 0;
  background: transparent;
  border: none;
  border-radius: 0;
}

.daily-close-section-toggles {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 10px 16px;
  margin: 12px 0 4px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: rgba(15, 118, 110, 0.04);
}
.daily-close-toggle {
  display: flex;
  flex-direction: column;
  gap: 2px;
  cursor: pointer;
}
.daily-close-toggle input { margin-right: 6px; }
.daily-close-toggle small { color: var(--muted); font-size: 11px; }
.daily-close-kpis .kpi { min-height: 88px; }
.daily-close-detail-section + .daily-close-detail-section { margin-top: 14px; }
.daily-close-filters { flex-wrap: wrap; gap: 10px; align-items: flex-end; }

body.dark-mode .daily-close-section-toggles { background: rgba(255,255,255,0.04); }

.inventory-accounting-card {
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 14px 16px;
  background: #fff;
}

.inventory-accounting-alert {
  margin-top: 10px;
  padding: 8px 10px;
  border-radius: 8px;
  background: rgba(234, 179, 8, 0.12);
  border: 1px solid rgba(234, 179, 8, 0.35);
}

body.dark-mode .inventory-accounting-card { background: rgba(255,255,255,0.03); }

.report-quick-chip {
  align-items: flex-start;
  text-align: left;
  min-width: 150px;
  max-width: 230px;
}

/* Custom-role permission picker */
.custom-role-permissions .perm-bulk-actions { display: flex; gap: 12px; flex-wrap: wrap; }
.custom-role-permissions .perm-groups { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 12px; padding: 4px 0 0; }
.perm-group { border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; margin: 0; }
.perm-group legend { font-weight: 700; font-size: 12.5px; padding: 0 6px; }
.perm-group legend small { display: block; font-weight: 400; color: var(--muted); font-size: 10.5px; }
.perm-group-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 4px 12px; margin-top: 6px; }
.perm-pick { font-size: 12px; }
.perm-pick.perm-highlight { background: #fff7ed; border-radius: 6px; padding: 2px 6px; font-weight: 600; }
@media (max-width: 720px) { .perm-group-grid { grid-template-columns: 1fr; } }

/* Time clock */
.time-clock-panel .time-clock-emp { display: block; max-width: 320px; margin-bottom: 10px; }
.time-clock-readout { display: flex; gap: 24px; margin-bottom: 12px; }
.time-clock-readout small { display: block; color: var(--muted); font-size: 11px; }
.time-clock-readout strong { font-size: 22px; }
.time-clock-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; }
.time-clock-actions button.danger { background: #fee2e2; color: #b91c1c; border: 1px solid #fecaca; border-radius: 8px; padding: 8px 14px; font-weight: 600; }
.time-clock-actions button.danger:disabled { opacity: .5; cursor: not-allowed; }
.time-clock-log { max-width: 360px; }

/* Online booking / appointment reminders */
.online-booking-panel { margin: 12px 0; }
.online-booking-panel.collapsed .online-booking-head { border-bottom: none; }
.online-booking-panel.expanded .online-booking-head {
  border-bottom: 1px solid var(--border);
  padding-bottom: 10px;
  margin-bottom: 4px;
}
.online-booking-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  flex-wrap: wrap;
}
.online-booking-head-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.online-booking-summary {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  padding: 8px 16px 12px;
}
.online-booking-link-hint {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.online-booking-body { padding-top: 4px; }

.appointment-board-panel { margin: 12px 0; }
.appointment-board-panel.collapsed .appointment-board-head { border-bottom: none; }
.appointment-board-panel.expanded .appointment-board-head {
  border-bottom: 1px solid var(--border);
  padding-bottom: 10px;
  margin-bottom: 4px;
}
.appointment-board-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  flex-wrap: wrap;
}
.appointment-board-head-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.appointment-board-summary {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  padding: 8px 16px 12px;
}
.appt-board-filter-hint { text-transform: capitalize; }
.appointment-board-body { padding-top: 4px; }

.booking-link-row { display: flex; gap: 8px; margin: 4px 0 10px; }
.booking-link-row input { flex: 1; font-family: ui-monospace, monospace; font-size: 12px; }
.appt-remind-btn { margin-left: 6px; }
.report-quick-chip strong { color: var(--porter-teal, #00b4a6); font-size: 12px; }
.report-quick-chip small { white-space: normal; line-height: 1.25; }

.record-button {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 12px 14px;
  background: var(--panel);
  text-align: left;
  transition: border-color var(--fast) var(--ease), box-shadow var(--fast) var(--ease);
}

.record-button strong {
  display: block;
  font-size: 13.5px;
  font-weight: 700;
}

.record-button .record-meta {
  color: var(--muted);
  font-size: 12px;
  margin-top: 3px;
}

.record-button.active {
  border-color: var(--porter-teal);
  box-shadow: 0 0 0 3px rgba(0,180,166,.12);
  background: #F0FDFB;
}

.record-button:hover:not(.active) {
  border-color: #b0bec8;
  box-shadow: var(--shadow-sm);
}

/* ─────────────────────────────────────────────────────────────────────────────
   DETAIL PANEL
───────────────────────────────────────────────────────────────────────────── */
.detail {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 12px;
  overflow: hidden;
  box-shadow: var(--shadow-sm);
}

.detail-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  padding: 18px 20px;
  border-bottom: 1px solid var(--line);
  background: #FAFCFE;
}

.detail-header h2 {
  margin: 0 0 4px;
  font-size: 18px;
  font-weight: 800;
}

.detail-header .meta {
  color: var(--muted);
  font-size: 12.5px;
}

.facts {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  padding: 16px 20px;
}

.fact {
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #FAFBFC;
}

.fact span {
  display: block;
  color: var(--muted);
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .3px;
}

.fact strong {
  display: block;
  margin-top: 5px;
  font-size: 14px;
  font-weight: 700;
  overflow-wrap: anywhere;
}

.detail-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 14px 20px;
  border-top: 1px solid var(--line);
  background: #FAFBFC;
}

/* ─────────────────────────────────────────────────────────────────────────────
   DEAL PIPELINE / KANBAN
───────────────────────────────────────────────────────────────────────────── */
.pipeline {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.sales-filter-bar {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  padding: 10px 16px;
  margin: 0 0 12px;
  background: linear-gradient(135deg, #f8fafc 0%, #f0fdfa 100%);
  border: 1px solid var(--line);
  border-radius: 10px;
}
.sales-sp-filter {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  font-weight: 600;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .3px;
}
.sales-sp-filter select {
  min-width: 180px;
  padding: 6px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  font-size: 13px;
  font-weight: 600;
  color: var(--ink);
}
.deal-card .deal-sp-pill {
  display: inline-block;
  font-size: 10px;
  font-weight: 700;
  padding: 2px 6px;
  border-radius: 4px;
  background: var(--blue-soft);
  color: var(--ink);
  margin-top: 4px;
}

.pipeline-col {
  background: #F8FAFC;
  border: 1px solid var(--line);
  border-radius: 10px;
  overflow: hidden;
}

.pipeline-col-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 14px;
  border-bottom: 1px solid var(--line);
  background: var(--panel);
}

.pipeline-col-header strong {
  font-size: 13px;
  font-weight: 700;
}

.pipeline-stage-bar {
  height: 3px;
  margin-bottom: 8px;
  border-radius: 999px;
}

.pipeline-cards {
  display: grid;
  gap: 8px;
  padding: 10px;
  min-height: 80px;
  border-radius: 0 0 10px 10px;
  transition: background .15s ease;
}

.pipeline-col.drop-active,
.pipeline-cards.drop-active {
  background: rgba(0, 180, 166, .12);
  outline: 2px dashed var(--porter-teal);
  outline-offset: -4px;
}

.pipeline-col.drop-denied,
.pipeline-cards.drop-denied {
  background: rgba(239, 68, 68, .08);
  outline: 2px dashed var(--red, #ef4444);
  outline-offset: -4px;
}

.deal-card-draggable {
  cursor: grab;
  position: relative;
  touch-action: none;
}

.deal-card-draggable:active {
  cursor: grabbing;
}

.deal-card-draggable.dragging {
  opacity: .45;
}

.deal-drag-handle {
  position: absolute;
  top: 8px;
  right: 8px;
  cursor: grab;
  color: var(--muted, #64748b);
  font-size: 14px;
  line-height: 1;
  user-select: none;
  padding: 2px 4px;
  touch-action: none;
  min-width: 36px;
  min-height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
}

.deal-drag-handle:active {
  cursor: grabbing;
}

.deal-card {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  box-shadow: var(--shadow-sm);
  cursor: pointer;
  transition: box-shadow var(--fast) var(--ease), transform var(--fast) var(--ease);
}

.deal-card:hover {
  box-shadow: var(--shadow);
  transform: translateY(-1px);
}

.deal-card-name {
  font-size: 13px;
  font-weight: 700;
  margin-bottom: 4px;
}

.deal-card-vehicle {
  font-size: 11.5px;
  color: var(--muted);
  margin-bottom: 6px;
}

.deal-card-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.deal-card-gross {
  font-size: 13px;
  font-weight: 800;
  color: var(--green);
}

/* ─────────────────────────────────────────────────────────────────────────────
   TECHNICIAN BOARD
───────────────────────────────────────────────────────────────────────────── */
.tech-board {
  display: grid;
  gap: 10px;
}
.tech-board.dispatch-board-wrap {
  display: block;
}

.tech-row {
  display: grid;
  grid-template-columns: 160px minmax(0,1fr);
  gap: 12px;
  align-items: center;
}

.tech-name {
  font-size: 13px;
  font-weight: 700;
}

.tech-name small {
  display: block;
  font-size: 11px;
  color: var(--muted);
  font-weight: 500;
}

.tech-jobs {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.tech-job {
  padding: 6px 10px;
  border: 1px solid var(--line);
  border-radius: 7px;
  font-size: 11.5px;
  font-weight: 600;
  background: var(--panel);
  cursor: pointer;
  transition: border-color var(--fast) var(--ease);
}

.tech-job:hover { border-color: var(--porter-teal); }

.tech-job.wip     { border-color: var(--blue);  background: var(--blue-soft);  color: var(--blue); }
.tech-job.done    { border-color: var(--green); background: var(--green-soft); color: var(--green); }
.tech-job.waiting { border-color: var(--gold);  background: var(--gold-soft);  color: var(--gold); }

/* ─────────────────────────────────────────────────────────────────────────────
   PROGRESS BARS
───────────────────────────────────────────────────────────────────────────── */
.progress-row {
  display: grid;
  grid-template-columns: 180px 1fr 80px;
  gap: 12px;
  align-items: center;
  margin-bottom: 12px;
}

.progress-label {
  font-size: 13px;
  font-weight: 600;
}

.progress-track {
  height: 8px;
  background: var(--line);
  border-radius: 999px;
  overflow: hidden;
}

.progress-fill {
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--porter-teal), var(--porter-gold));
  transition: width var(--slow) var(--ease);
}

.progress-fill.danger { background: linear-gradient(90deg, var(--red), #FF7F6E); }

.progress-pct {
  font-size: 12px;
  font-weight: 700;
  text-align: right;
}

/* ─────────────────────────────────────────────────────────────────────────────
   FILTERS
───────────────────────────────────────────────────────────────────────────── */
.filters {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
}

.filter-input {
  height: 34px;
  min-width: 200px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 10px;
  background: var(--panel);
  font-size: 13px;
  color: var(--ink);
  transition: border-color var(--fast) var(--ease);
}

.filter-input:focus {
  outline: none;
  border-color: var(--porter-teal);
  box-shadow: 0 0 0 3px rgba(0,180,166,.08);
}

.filter-chip {
  height: 34px;
  padding: 0 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  font-size: 13px;
  font-weight: 600;
  color: var(--muted);
  transition: all var(--fast) var(--ease);
}

.filter-chip.active,
.filter-chip:hover {
  border-color: var(--porter-teal);
  color: var(--porter-teal);
  background: rgba(0,180,166,.06);
}

/* ─────────────────────────────────────────────────────────────────────────────
   EMPTY STATE
───────────────────────────────────────────────────────────────────────────── */
.empty {
  padding: 48px 24px;
  text-align: center;
  color: var(--muted);
}

.empty-icon {
  font-size: 32px;
  margin-bottom: 12px;
  opacity: .35;
}

.empty strong {
  display: block;
  color: var(--ink);
  font-size: 15px;
  font-weight: 700;
  margin-bottom: 6px;
}

.empty span { font-size: 13px; }

/* ─────────────────────────────────────────────────────────────────────────────
   MODAL
───────────────────────────────────────────────────────────────────────────── */
dialog:not([open]) {
  display: none;
}

dialog[open] {
  position: fixed;
  inset: 0;
  width: min(860px, calc(100vw - 32px));
  height: fit-content;
  max-height: calc(100vh - 32px);
  margin: auto;
  overflow: hidden;
}

#searchModal[open] {
  width: min(920px, calc(100vw - 32px));
}

#searchModal.search-modal-front,
#searchModal.modal-stack-front {
  z-index: var(--modal-stack-z, 10000);
}

body.has-open-modal:not(.parts-document-modal-open) .module-chrome-top,
body.has-open-modal:not(.parts-document-modal-open) .module-quick-actions,
body.has-open-modal .mobile-help-fab {
  visibility: hidden;
  pointer-events: none;
}

body.has-open-modal dialog[open] {
  z-index: var(--modal-stack-z, 10000);
}

.party-search-create-panel {
  margin-top: 8px;
}

.party-search-create-panel .form-grid {
  margin-bottom: 12px;
}

.fi-tab-nav-bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 14px 0 4px;
  margin-top: 12px;
  border-top: 1px solid var(--line);
  flex-wrap: wrap;
}

.fi-tab-nav-indicator {
  text-align: center;
  flex: 1 1 auto;
}

.we-owe-list {
  display: grid;
  gap: 8px;
}

.we-owe-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 8px;
  align-items: center;
}

.we-owe-row input {
  width: 100%;
}

dialog {
  width: min(860px, calc(100vw - 32px));
  border: 0;
  border-radius: 14px;
  box-shadow: var(--shadow-lg);
  padding: 0;
  animation: modalIn var(--mid) var(--ease);
}

dialog::backdrop {
  background: rgba(13, 27, 42, 0.55);
  backdrop-filter: blur(4px);
}

dialog.modal-underlay {
  z-index: calc(var(--modal-stack-z, 9990) - 1);
  pointer-events: none;
}

dialog.modal-stack-front {
  z-index: var(--modal-stack-z, 10000);
}

dialog#reviewModal.modal-stack-front,
dialog.modal-stack-over-parts-doc.modal-stack-front {
  z-index: var(--modal-stack-z, 10000);
}

dialog.parts-document-modal.modal-underlay {
  filter: brightness(0.96);
}

dialog.modal-underlay::backdrop {
  opacity: 0;
  backdrop-filter: none;
}

dialog.modal-wide {
  width: min(1100px, calc(100vw - 32px));
}

dialog.modal-tall {
  max-height: calc(100vh - 24px);
}

@keyframes modalIn {
  from { opacity: 0; transform: scale(.97) translateY(8px); }
  to   { opacity: 1; transform: scale(1)  translateY(0); }
}

.modal { padding: 0; }

.modal-wide {
  width: 100%;
}

.modal-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  padding: 20px 22px;
  border-bottom: 1px solid var(--line);
  background: #FAFCFE;
}

.modal-header h2 {
  margin: 4px 0 0;
  font-size: 19px;
  font-weight: 800;
  letter-spacing: -0.3px;
}

.tabs {
  display: flex;
  gap: 6px;
  padding: 14px 22px 0;
  border-bottom: 1px solid var(--line);
  overflow-x: auto;
}

.tab {
  border: 1px solid var(--line);
  border-radius: 8px 8px 0 0;
  border-bottom: 0;
  padding: 8px 14px;
  background: #F8FAFC;
  font-size: 13px;
  font-weight: 700;
  color: var(--muted);
  white-space: nowrap;
  transition: all var(--fast) var(--ease);
}

.tab.active {
  background: var(--porter-teal);
  border-color: var(--porter-teal);
  color: #fff;
}

.tab:hover:not(.active) {
  background: #F0FDFB;
  color: var(--porter-teal);
  border-color: var(--porter-teal);
}

/* ─────────────────────────────────────────────────────────────────────────────
   FORMS
───────────────────────────────────────────────────────────────────────────── */
.form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  padding: 20px 22px;
}

label {
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-size: 11.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .3px;
}

input, select, textarea {
  width: 100%;
  min-height: 38px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 8px 11px;
  color: var(--ink);
  background: var(--panel);
  font-size: 13.5px;
  text-transform: none;
  transition: border-color var(--fast) var(--ease), box-shadow var(--fast) var(--ease);
}

input:focus, select:focus, textarea:focus {
  outline: none;
  border-color: var(--porter-teal);
  box-shadow: 0 0 0 3px rgba(0,180,166,.1);
}

textarea {
  min-height: 80px;
  resize: vertical;
}

.wide { grid-column: 1 / -1; }

.form-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  padding: 14px 22px 20px;
  border-top: 1px solid var(--line);
  background: #FAFBFC;
}

/* Checkbox row */
.check-row {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 600;
  color: var(--ink);
  text-transform: none;
  letter-spacing: 0;
}

.check-row input[type="checkbox"],
.check-row input[type="radio"] {
  width: 16px;
  height: 16px;
  min-height: 0;
  flex: 0 0 auto;
  border-radius: 4px;
  cursor: pointer;
  accent-color: var(--porter-teal);
}

.garage-op-picker {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin: 12px 0 16px;
}

.garage-op-option {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--panel, #fff);
  cursor: pointer;
  text-transform: none;
  letter-spacing: 0;
  font-weight: 400;
  color: var(--ink);
  transition: border-color .15s, box-shadow .15s, background .15s;
}

.garage-op-option:hover {
  border-color: var(--porter-teal, #0d9488);
  background: rgba(13, 148, 136, 0.04);
}

.garage-op-option:has(input:checked) {
  border-color: var(--porter-teal, #0d9488);
  box-shadow: 0 0 0 1px rgba(13, 148, 136, 0.25);
  background: rgba(13, 148, 136, 0.08);
}

.garage-op-option input[type="radio"] {
  width: 18px;
  height: 18px;
  min-height: 0;
  margin-top: 2px;
  flex: 0 0 auto;
  accent-color: var(--porter-teal, #0d9488);
}

.garage-op-option-body {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
  flex: 1 1 auto;
}

.garage-op-option-body strong {
  font-size: 13px;
  color: var(--porter-teal, #0d9488);
}

.garage-op-option-title {
  font-size: 14px;
  font-weight: 600;
  color: var(--ink);
}

.garage-op-option-meta {
  font-size: 12px;
  color: var(--muted);
  font-weight: 500;
}

.ro-header-detail-panel .ro-header-datetime-row {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(3, minmax(190px, 1fr));
  gap: 8px;
}

.ro-header-detail-panel .ro-header-datetime-row label input[type="datetime-local"] {
  min-width: 0;
}

.ro-detail-line-nav-sticky {
  position: sticky;
  top: 0;
  z-index: 6;
  background: var(--panel, #fff);
  padding: 6px 0 8px;
  margin: 0 0 4px;
  border-bottom: 1px solid var(--line);
}

.ro-detail-line-nav-sticky .ro-line-tabs {
  margin: 0;
  padding: 0;
  border-bottom: none;
}

@media (max-width: 720px) {
  .ro-header-detail-panel .ro-header-datetime-row {
    grid-template-columns: 1fr;
  }
}

.print-copy-body {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.print-copy-body .check-row {
  padding: 4px 0;
}

.print-copy-actions {
  margin: 8px -22px -20px;
}

/* ─────────────────────────────────────────────────────────────────────────────
   DEAL MODAL BODY
───────────────────────────────────────────────────────────────────────────── */
.deal-modal-body {
  display: grid;
  grid-template-columns: 1fr 340px;
  min-height: 400px;
  max-height: min(78vh, 900px);
  overflow-y: auto;
  overscroll-behavior: contain;
  align-items: start;
  align-content: start;
}

.deal-modal-body > :not(.deal-modal-main):not(.deal-modal-sidebar) {
  grid-column: 1 / -1;
}

.deal-modal-main {
  grid-column: 1;
  border-right: 1px solid var(--line);
  padding: 20px;
  min-width: 0;
}

.deal-modal-sidebar {
  grid-column: 2;
  min-width: 0;
}

.deal-modal-sidebar {
  padding: 20px;
  background: #FAFCFE;
}

.deal-section-title {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .4px;
  color: var(--muted);
  margin: 0 0 12px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--line);
}

.fi-product {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 0;
  border-bottom: 1px solid var(--line);
  font-size: 13px;
}

.fi-product:last-child { border-bottom: 0; }

/* ─────────────────────────────────────────────────────────────────────────────
   NOTIFICATIONS DRAWER
───────────────────────────────────────────────────────────────────────────── */
.notif-drawer {
  position: fixed;
  top: 0;
  right: 0;
  height: 100vh;
  width: 360px;
  background: var(--panel);
  border-left: 1px solid var(--line);
  box-shadow: var(--shadow-lg);
  z-index: 200;
  display: flex;
  flex-direction: column;
  transform: translateX(100%);
  transition: transform var(--slow) var(--ease);
}

.notif-drawer.open {
  transform: translateX(0);
}

.notif-drawer[hidden] { display: flex; }

.notif-drawer header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px 18px 14px;
  border-bottom: 1px solid var(--line);
}

.notif-drawer h2 { margin: 0; font-size: 16px; font-weight: 700; }

.notif-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(13,27,42,.3);
  z-index: 199;
  opacity: 0;
  transition: opacity var(--slow) var(--ease);
}

.notif-backdrop.open { opacity: 1; }
.notif-backdrop[hidden] { display: block; visibility: hidden; }

/* ─────────────────────────────────────────────────────────────────────────────
   MESSAGE CENTER (GLOBAL TOPBAR)
───────────────────────────────────────────────────────────────────────────── */
.messages-topbar-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 14px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: var(--panel);
  color: var(--ink);
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  transition: border-color var(--fast) var(--ease), box-shadow var(--fast) var(--ease), transform var(--fast) var(--ease);
}

.messages-topbar-btn:hover {
  border-color: rgba(0, 180, 166, .45);
  box-shadow: 0 4px 14px rgba(0, 180, 166, .12);
}

.messages-topbar-btn.has-unread {
  border-color: rgba(212, 160, 23, .55);
  background: rgba(212, 160, 23, .08);
}

.messages-badge {
  min-width: 20px;
  height: 20px;
  padding: 0 6px;
  border-radius: 999px;
  background: var(--gold);
  color: #fff;
  font-size: 11px;
  font-weight: 800;
  display: inline-grid;
  place-items: center;
}

.messages-drawer {
  position: fixed;
  top: 0;
  right: 0;
  height: 100vh;
  width: min(460px, 100vw);
  background: var(--panel);
  border-left: 1px solid var(--line);
  box-shadow: var(--shadow-lg);
  z-index: 210;
  display: flex;
  flex-direction: column;
  transform: translateX(100%);
  transition: transform var(--slow) var(--ease);
}

.messages-drawer.open { transform: translateX(0); }
.messages-drawer[hidden] { display: flex; }

.messages-drawer-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 18px 18px 12px;
  border-bottom: 1px solid var(--line);
}

.messages-drawer-header h2 {
  margin: 0;
  font-size: 18px;
  font-weight: 800;
}

.messages-drawer-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 18px;
  border-bottom: 1px solid var(--line);
  flex-wrap: wrap;
}

.messages-filter-tabs {
  display: inline-flex;
  gap: 4px;
  background: var(--surface-2, rgba(0,0,0,.04));
  border-radius: 10px;
  padding: 3px;
}

.messages-helpdesk-crm-banner {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  padding: 10px 18px;
  border-bottom: 1px solid var(--line);
  background: var(--surface-2, rgba(0,0,0,.03));
}

.messages-helpdesk-crm-banner[hidden] { display: none; }

.support-crm-link {
  font-size: 12px;
  font-weight: 700;
}

.messages-filter-btn {
  border: none;
  background: transparent;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  padding: 6px 12px;
  border-radius: 8px;
  cursor: pointer;
}

.messages-filter-btn.active {
  background: var(--panel);
  color: var(--ink);
  box-shadow: 0 1px 3px rgba(0,0,0,.12);
}

.messages-toolbar-actions {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}

.messages-compose-form {
  padding: 12px 18px;
  border-bottom: 1px solid var(--line);
  background: linear-gradient(180deg, rgba(0, 180, 166, .04), transparent);
}

.messages-compose-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}

.messages-compose-grid .wide { grid-column: 1 / -1; }

.messages-compose-grid label {
  display: grid;
  gap: 4px;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .35px;
  color: var(--muted);
}

.messages-compose-grid input,
.messages-compose-grid select,
.messages-compose-grid textarea {
  font-size: 13px;
  min-height: 36px;
}

.messages-compose-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 10px;
}

.messages-search-wrap {
  padding: 10px 18px;
  border-bottom: 1px solid var(--line);
}

.messages-center-list {
  overflow-y: auto;
  flex: 1;
  padding: 10px 12px 18px;
  display: grid;
  gap: 10px;
}

.message-center-item {
  display: flex;
  gap: 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 12px;
  background: var(--surface);
}

.message-center-item.unread {
  border-color: rgba(212, 160, 23, .45);
  background: rgba(212, 160, 23, .06);
}

.message-center-item.inbound { border-left: 4px solid var(--gold); }
.message-center-item.outbound { border-left: 4px solid var(--blue); }

.message-center-avatar {
  width: 38px;
  height: 38px;
  border-radius: 10px;
  background: var(--porter-navy);
  color: #fff;
  display: grid;
  place-items: center;
  font-size: 12px;
  font-weight: 800;
  flex: 0 0 auto;
}

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

.message-center-body header {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  align-items: flex-start;
  margin-bottom: 6px;
}

.message-center-body header strong {
  display: block;
  font-size: 13px;
}

.message-center-body header small {
  color: var(--muted);
  font-size: 11px;
}

.message-center-time {
  color: var(--muted);
  font-size: 11px;
  white-space: nowrap;
}

.message-center-body p {
  margin: 0 0 8px;
  font-size: 13px;
  line-height: 1.45;
  white-space: pre-wrap;
}

.message-center-actions {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}

.messages-center-empty {
  padding: 28px 16px;
  text-align: center;
  color: var(--muted);
  display: grid;
  gap: 6px;
}

.messages-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(13,27,42,.32);
  z-index: 209;
  opacity: 0;
  transition: opacity var(--slow) var(--ease);
}

.messages-backdrop.open { opacity: 1; }
.messages-backdrop[hidden] { display: block; visibility: hidden; }

.internal-messaging-compact .messages-compact-note {
  padding: 0 16px 8px;
  margin: 0;
}

.open-tasks-list {
  display: grid;
  gap: 10px;
}

.open-task-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 12px 14px;
  background: var(--panel);
}

.open-task-row.priority-high {
  border-color: rgba(212, 160, 23, .45);
  background: rgba(212, 160, 23, .05);
}

.open-task-main {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.open-task-title {
  font-size: 14px;
  font-weight: 700;
  text-align: left;
}

.open-task-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  font-size: 12px;
  color: var(--muted);
}

.open-deals-list {
  display: grid;
  gap: 10px;
}

.open-deal-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 12px 14px;
  background: var(--panel);
}

.open-deal-main {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.open-deal-id {
  font-size: 14px;
  font-weight: 700;
  text-align: left;
}

.open-deal-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  font-size: 12px;
  color: var(--muted);
}

.integration-health-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border-color: rgba(212, 160, 23, .45);
  color: var(--text);
  white-space: nowrap;
}

.integration-health-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--gold);
  box-shadow: 0 0 0 4px rgba(212, 160, 23, .15);
}

.empty-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: center;
  margin-top: 12px;
}

tr.row-selected td {
  background: rgba(0, 168, 150, .06);
}

.task-card-clickable {
  cursor: pointer;
  transition: border-color var(--fast) var(--ease), transform var(--fast) var(--ease);
}

.task-card-clickable:hover {
  border-color: rgba(0, 180, 166, .4);
  transform: translateY(-1px);
}

.parts-order-search-wrap,
.parts-order-filters .parts-order-search-wrap {
  position: relative;
  min-width: 240px;
}

.audit-detail-view textarea {
  font-family: var(--mono, ui-monospace, monospace);
  font-size: 12px;
  line-height: 1.45;
}

.config-highlight {
  outline: 2px solid rgba(0, 180, 166, .55);
  outline-offset: 2px;
  border-radius: 8px;
  transition: outline-color .3s ease;
}

.hcm-tab-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 16px;
  padding-bottom: 4px;
  border-bottom: 1px solid var(--line);
}

.hcm-tab-strip .subtab {
  font-size: 12px;
  padding: 8px 12px;
}

.notif-list {
  overflow-y: auto;
  flex: 1;
}

.notif-item {
  display: flex;
  gap: 12px;
  padding: 14px 18px;
  border-bottom: 1px solid var(--line);
  transition: background var(--fast) var(--ease);
  cursor: default;
}

.notif-item:hover { background: #F8FAFC; }

.notif-icon {
  width: 34px;
  height: 34px;
  border-radius: 8px;
  display: grid;
  place-items: center;
  font-size: 15px;
  flex: 0 0 auto;
}

.notif-icon.sales     { background: var(--green-soft); }
.notif-icon.service   { background: var(--blue-soft); }
.notif-icon.parts     { background: var(--gold-soft); }
.notif-icon.bdc       { background: var(--purple-soft); }
.notif-icon.accounting { background: #FEE2E2; }

.notif-text strong {
  display: block;
  font-size: 13px;
  font-weight: 700;
  margin-bottom: 2px;
}

.notif-text span {
  font-size: 12px;
  color: var(--muted);
}

.notif-time {
  font-size: 11px;
  color: var(--muted);
  margin-top: 4px;
}

/* ─────────────────────────────────────────────────────────────────────────────
   TOAST NOTIFICATIONS
───────────────────────────────────────────────────────────────────────────── */
#toastContainer {
  position: fixed;
  bottom: 24px;
  right: 24px;
  z-index: 9999;
  display: flex;
  flex-direction: column-reverse;
  gap: 10px;
  pointer-events: none;
}

.dialog-toast-host {
  position: sticky;
  top: 0;
  z-index: 5;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 12px 16px 0;
  pointer-events: none;
}

.dialog-toast-host .toast {
  pointer-events: auto;
  min-width: 0;
  max-width: none;
  width: 100%;
  animation: none;
}

.modal-alert-host {
  padding: 0 16px;
}

.modal-alert-host:not([hidden]) {
  padding-top: 12px;
}

.modal-alert {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 12px 14px;
  border-radius: 10px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(13, 27, 42, 0.96);
  color: #fff;
  font-size: 13px;
}

.modal-alert.success { border-left: 4px solid var(--green); }
.modal-alert.warning { border-left: 4px solid var(--porter-gold); }
.modal-alert.error { border-left: 4px solid var(--red); }
.modal-alert.info { border-left: 4px solid var(--porter-teal); }

.modal-alert-icon {
  flex: 0 0 auto;
  font-size: 16px;
  line-height: 1.2;
}

.modal-alert-body {
  flex: 1 1 auto;
  display: grid;
  gap: 4px;
}

.modal-alert-body strong {
  display: block;
  font-size: 14px;
}

.modal-alert-body span {
  color: rgba(255,255,255,.72);
  font-size: 12px;
}

.modal-alert-dismiss {
  flex: 0 0 auto;
  border: 0;
  background: transparent;
  color: rgba(255,255,255,.7);
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
  padding: 0 2px;
}

.appt-board-actions {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}

.appt-board-filters {
  display: flex;
  gap: 8px;
  padding: 0 16px 12px;
  flex-wrap: wrap;
}

.appt-week-strip {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 8px;
  padding: 0 16px 14px;
}

.appt-day-card {
  display: grid;
  gap: 2px;
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid var(--line);
  background: var(--panel-2, #f7f9fc);
  text-align: left;
  cursor: pointer;
  transition: transform var(--fast) var(--ease), box-shadow var(--fast) var(--ease);
}

.appt-day-card:hover {
  transform: translateY(-1px);
  box-shadow: var(--shadow-sm);
}

.appt-day-card.today {
  border-color: var(--porter-teal);
  box-shadow: inset 0 0 0 1px rgba(0, 168, 181, 0.25);
}

.appt-day-card strong {
  font-size: 15px;
}

.appt-day-card small,
.appt-day-label {
  color: var(--muted);
  font-size: 11px;
}

.appt-convert-hint {
  margin: 0 0 8px;
  padding: 0 2px;
}

.appointment-weather-advisory {
  grid-column: 1 / -1;
  margin: 0;
  padding: 10px 12px;
  border-radius: 10px;
  background: rgba(0, 168, 181, 0.08);
  border: 1px solid rgba(0, 168, 181, 0.18);
  font-size: 13px;
  line-height: 1.45;
}

.appointment-weather-advisory-warn {
  background: rgba(245, 166, 35, 0.12);
  border-color: rgba(245, 166, 35, 0.35);
}

tr.appt-row-highlight td {
  background: rgba(0, 168, 181, 0.12);
  transition: background 1.8s ease;
}

tr.pick-row-highlight td {
  background: rgba(245, 166, 35, 0.18);
  box-shadow: inset 0 0 0 1px rgba(245, 166, 35, 0.45);
}

.ro-tech-select {
  width: 100%;
  min-width: 180px;
  max-width: 320px;
  font-size: 13px;
}

.fact .ro-tech-select {
  margin-top: 2px;
}

.toast {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 14px 16px;
  border-radius: 10px;
  box-shadow: var(--shadow-lg);
  min-width: 300px;
  max-width: 420px;
  pointer-events: auto;
  background: var(--porter-navy);
  color: #fff;
  font-size: 13px;
  animation: toastIn var(--mid) var(--ease);
  border-left: 4px solid var(--porter-teal);
}

.toast.success { border-left-color: var(--green); }
.toast.warning { border-left-color: var(--porter-gold); }
.toast.error   { border-left-color: var(--red); }
.toast.clickable-toast { cursor: pointer; }
.toast.clickable-toast:hover { transform: translateY(-1px); box-shadow: 0 10px 24px rgba(0,0,0,.22); }
.toast.drill-down-toast {
  border-left-color: var(--porter-gold);
  background: linear-gradient(135deg, var(--porter-navy) 0%, #16345f 100%);
}
.toast.drill-down-toast .toast-action {
  color: #ffe08a;
  font-size: 13px;
}
.toast-action {
  display: block;
  color: rgba(255,255,255,.92);
  padding: 0;
  min-height: 0;
  margin-top: 6px;
  font-size: 12px;
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.parts-multi-line-block {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 12px;
  background: var(--surface-2, rgba(255,255,255,.02));
}

.parts-multi-line-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 10px;
}

.parts-vehicle-banner {
  margin: 6px 0 0;
  font-size: 0.95rem;
}

.parts-vehicle-banner .meta {
  margin-left: 4px;
  color: var(--muted);
}

.parts-quote-totals {
  margin: 14px 0;
  padding: 12px 14px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--surface-2, rgba(255,255,255,.02));
  max-width: 360px;
  margin-left: auto;
}

.parts-total-row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 4px 0;
  font-size: 0.92rem;
}

.parts-total-row.customer-pay {
  margin-top: 8px;
  padding-top: 10px;
  border-top: 2px solid var(--border);
  font-size: 1.05rem;
  font-weight: 700;
}

.customer-import-preview {
  margin: 12px 0;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--surface-2, rgba(255,255,255,.02));
}

.customer-import-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-bottom: 10px;
}

.customer-import-hint {
  margin-top: 10px;
  white-space: pre-wrap;
}

.migration-hub-panel .migration-steps {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-top: 12px;
}

.migration-step {
  padding: 12px 14px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--surface-2, rgba(255,255,255,.02));
}

.migration-step .badge {
  margin-right: 8px;
}

.migration-entity-tabs {
  margin-top: 10px;
}

.parts-invoice-workbench {
  margin: 0;
  border: 1px solid #d0dce6;
  border-radius: 14px;
  overflow: visible;
  background: #fff;
  box-shadow: 0 4px 16px rgba(15, 25, 35, 0.05);
  display: flex;
  flex-direction: column;
  min-height: 0;
  gap: 0;
}

.parts-kit-workflow-zone {
  position: relative;
  z-index: 5;
  padding: 14px 14px 0;
  background: linear-gradient(180deg, #fff9e8 0%, #fff 100%);
  border-bottom: 2px solid color-mix(in srgb, var(--gold) 45%, var(--line));
}

.parts-kit-workflow-zone.kit-just-advanced .parts-kit-suggest-panel {
  animation: parts-kit-advance-flash 2s ease;
}

@keyframes parts-kit-advance-flash {
  0%, 100% { box-shadow: 0 0 0 0 transparent; }
  20% { box-shadow: 0 0 0 3px color-mix(in srgb, #2d8f4e 35%, transparent); }
  50% { box-shadow: 0 0 0 1px color-mix(in srgb, #2d8f4e 18%, transparent); }
}

.parts-invoice-command-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 16px;
  border-bottom: 1px solid #d7e2ec;
  background: linear-gradient(180deg, #edf4f8 0%, #f8fbfd 100%);
}

.parts-invoice-command-title h2 {
  margin: 0;
  font-size: 1rem;
  font-weight: 800;
  color: var(--ink);
  letter-spacing: -0.02em;
}

.parts-invoice-subtitle {
  margin: 2px 0 0;
  font-size: 0.78rem;
  color: var(--muted);
}

.parts-invoice-kpi-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.invoice-kpi {
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
  padding: 5px 11px;
  border-radius: 999px;
  background: #fff;
  border: 1px solid var(--line);
  font-size: 0.82rem;
  color: var(--muted);
  box-shadow: 0 1px 2px rgba(15, 25, 35, 0.04);
}

.invoice-kpi strong {
  color: var(--ink);
  font-size: 0.92rem;
}

.invoice-kpi.muted strong {
  color: var(--porter-teal);
}

.parts-invoice-command-tools {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.invoice-line-filter {
  min-width: 180px;
  padding: 8px 10px;
  border-radius: 8px;
  border: 1px solid var(--line);
  background: #fff;
  font-size: 0.88rem;
  color: var(--ink);
}

.parts-invoice-zone-head,
.parts-invoice-classic-entry-title {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px 12px;
  padding: 10px 16px;
  background: #f1f6fa;
  border-bottom: 1px solid #d7e2ec;
}

.parts-invoice-zone-title {
  font-size: 0.78rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #334155;
}

.parts-invoice-zone-meta {
  font-size: 0.76rem;
  color: #64748b;
}

.parts-invoice-committed-zone {
  border-bottom: 1px solid #e2e8f0;
  flex: 0 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
}

.parts-invoice-sheet-wrap {
  max-height: min(38vh, 360px);
  overflow: auto;
  background: #fafcfe;
  flex: 0 1 auto;
  -webkit-overflow-scrolling: touch;
}

.parts-invoice-sheet {
  width: 100%;
  min-width: 0;
  table-layout: fixed;
  border-collapse: collapse;
  font-size: 0.84rem;
  color: var(--ink);
  border: 1px solid #b8c5d1;
}

.parts-invoice-sheet thead th {
  position: sticky;
  z-index: 3;
  background: #e8eef4;
  border: 1px solid #c5d2de;
  padding: 0;
  text-align: left;
}

.parts-invoice-head-main th {
  top: 0;
  padding: 7px 12px 4px;
  font-size: 0.64rem;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: #64748b;
  background: linear-gradient(180deg, #d8e4ee 0%, #e4ecf3 100%);
  line-height: 1.2;
  min-height: 28px;
}

.parts-invoice-head-cols th {
  top: 29px;
  padding: 8px 10px;
  font-size: 0.68rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #475569;
  white-space: nowrap;
  background: #edf2f7;
  border-bottom: 2px solid var(--porter-teal);
  font-weight: 800;
}

.parts-invoice-head-main .head-group.item { border-right: 1px solid #c5d2de; }
.parts-invoice-head-main .head-group.pricing { border-left: 1px solid #c5d2de; border-right: 1px solid #c5d2de; }

.parts-invoice-sheet td {
  padding: 7px 8px;
  border: 1px solid #d7e2ec;
  vertical-align: middle;
  background: #fff;
  overflow: hidden;
  text-overflow: ellipsis;
}

.parts-invoice-sheet .col-desc,
.parts-invoice-sheet .col-part {
  overflow: hidden;
  text-overflow: ellipsis;
}

.parts-invoice-sheet .invoice-desc {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.parts-invoice-committed-row:nth-child(odd) td {
  background: #fff;
}

.parts-invoice-committed-row:nth-child(even) td {
  background: #f3f6fa;
}

.parts-invoice-committed-row:hover td {
  background: #e8f4ff;
}

.parts-invoice-committed-row .col-num {
  text-align: center;
  font-weight: 700;
  color: #64748b;
  background: #eef2f7 !important;
  border-right: 1px solid #b8c5d1;
}

.parts-invoice-committed-row .col-ext {
  border-left: 1px solid #b8c5d1;
}

.parts-invoice-committed-row .invoice-ext {
  font-size: 0.92rem;
}

.parts-invoice-committed-row.filtered-out {
  display: none;
}

.parts-invoice-entry-label td {
  padding: 10px 14px 6px;
  background: linear-gradient(180deg, #e6f7f5, #f0fdfa);
  border-top: 2px solid rgba(0, 180, 166, 0.35);
  border-bottom: 1px dashed rgba(0, 180, 166, 0.25);
}

/* Classic add-lines panel — separate from committed line grid */
.parts-invoice-classic-entry {
  margin-top: 0;
  border-top: 3px solid rgba(0, 180, 166, 0.35);
  background: #f3f8fb;
  overflow: visible;
  flex: 0 0 auto;
}

.parts-invoice-classic-entry-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px 16px;
  padding: 10px 16px;
  background: linear-gradient(180deg, #e4f5f2 0%, #f0faf9 100%);
  border-bottom: 1px solid rgba(0, 180, 166, 0.18);
}

.parts-invoice-entry-hints {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.entry-hint-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 10px;
  border-radius: 999px;
  border: 1px solid #d7e2ec;
  background: #fff;
  font-size: 0.72rem;
  color: #64748b;
  white-space: nowrap;
}

.entry-hint-chip kbd {
  padding: 1px 5px;
  border-radius: 4px;
  border: 1px solid #cbd5e1;
  background: #f8fafc;
  font-size: 0.68rem;
  font-weight: 700;
  color: #334155;
}

.parts-invoice-classic-entry-stack {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 14px 16px 16px;
  max-height: min(32vh, 320px);
  overflow-x: hidden;
  overflow-y: auto;
  background: linear-gradient(180deg, #f8fbfd 0%, #f1f6fa 100%);
}

.parts-classic-entry-row {
  position: relative;
  border: 1px solid #c5d2de;
  border-radius: 12px;
  background: #fff;
  padding: 12px 42px 14px 14px;
  box-shadow: 0 2px 8px rgba(15, 25, 35, 0.04);
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.parts-classic-entry-row::before {
  content: "";
  position: absolute;
  left: 0;
  top: 10px;
  bottom: 10px;
  width: 4px;
  border-radius: 0 4px 4px 0;
  background: #cbd5e1;
  transition: background 0.15s ease;
}

.parts-classic-entry-row.entry-row-filled::before {
  background: var(--porter-teal);
}

.parts-classic-entry-row.npn-line {
  border-color: rgba(217, 119, 6, 0.45);
  background: linear-gradient(180deg, #fff 0%, #fffbeb 100%);
  box-shadow: 0 4px 14px rgba(217, 119, 6, 0.08);
}

.parts-classic-entry-row.npn-line::before {
  background: #f59e0b;
}

.parts-classic-entry-row:focus-within {
  border-color: rgba(0, 180, 166, 0.55);
  box-shadow: 0 4px 16px rgba(0, 180, 166, 0.1);
}

.parts-classic-entry-row:focus-within::before {
  background: var(--porter-teal);
}

.classic-entry-toolbar {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 12px 6px;
  padding-bottom: 10px;
  border-bottom: 1px solid #e8eef4;
}

.classic-entry-num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.65rem;
  height: 1.65rem;
  border-radius: 8px;
  background: linear-gradient(145deg, #ccfbf1, #99f6e4);
  color: #0f766e;
  font-weight: 800;
  font-size: 0.82rem;
  flex-shrink: 0;
}

.classic-entry-title {
  font-size: 0.82rem;
  font-weight: 700;
  color: #475569;
}

.classic-entry-toolbar .classic-entry-type {
  margin-left: 4px;
}

.classic-entry-dismiss {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 12;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  padding: 0;
  border-radius: 8px;
  border: 1px solid #fecaca;
  background: #fff5f5;
  color: #dc2626;
  font-size: 0.9rem;
  line-height: 1;
  cursor: pointer;
  flex-shrink: 0;
}

.classic-entry-dismiss:hover {
  background: #fee2e2;
  border-color: #fca5a5;
}

.classic-entry-fields {
  display: grid;
  grid-template-columns: minmax(100px, 0.95fr) minmax(140px, 1.35fr) minmax(72px, 0.65fr) 56px minmax(72px, 0.6fr) 76px 76px 84px;
  grid-template-areas: "part desc bin qty mode cost sale ext";
  gap: 10px 12px;
  align-items: end;
  margin-left: 6px;
  margin-right: 0;
}

.cef-part { grid-area: part; }
.cef-desc-stock { grid-area: desc; }
.cef-bin { grid-area: bin; }
.cef-qty { grid-area: qty; }
.cef-mode { grid-area: mode; }
.cef-cost { grid-area: cost; }
.cef-sale { grid-area: sale; }
.cef-ext { grid-area: ext; }

.parts-classic-entry-row.npn-line .classic-entry-fields {
  grid-template-columns: 92px minmax(0, 1fr) 60px 76px 76px 84px;
  grid-template-areas:
    "part npndesc npndesc npndesc npndesc npndesc"
    "part qty cost sale ext ext";
  row-gap: 12px;
}

.parts-classic-entry-row.npn-line .cef-part {
  align-self: start;
}

.parts-classic-entry-row.npn-line .cef-npn-desc {
  grid-area: npndesc;
  min-width: 0;
}

.parts-classic-entry-row.npn-line .cef-qty { grid-area: qty; }
.parts-classic-entry-row.npn-line .cef-cost { grid-area: cost; }
.parts-classic-entry-row.npn-line .cef-sale { grid-area: sale; }
.parts-classic-entry-row.npn-line .cef-ext { grid-area: ext; }

.classic-field {
  display: flex;
  flex-direction: column;
  gap: 5px;
  min-width: 0;
}

.classic-label {
  font-size: 0.64rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #64748b;
}

.classic-field .invoice-cell-input,
.classic-field .line-pricing-mode {
  width: 100%;
  min-width: 0;
  min-height: 38px;
  font-size: 0.88rem;
  border-radius: 8px;
  border-color: #cbd5e1;
}

.classic-readout {
  display: flex;
  align-items: center;
  min-height: 38px;
  padding: 8px 10px;
  border: 1px solid #dbe3ec;
  border-radius: 8px;
  background: #f8fafc;
  font-size: 0.84rem;
  line-height: 1.35;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--ink);
}

.classic-readout-bin {
  white-space: normal;
  align-items: flex-start;
  flex-direction: column;
  justify-content: center;
  gap: 1px;
}

.classic-readout small {
  display: block;
  font-size: 0.72rem;
  color: var(--muted);
}

.classic-entry-npn-note {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 12px 0 0 6px;
  padding: 10px 12px;
  border-radius: 8px;
  background: #fffbeb;
  border: 1px solid rgba(217, 119, 6, 0.28);
  font-size: 0.8rem;
  color: #92400e;
  line-height: 1.4;
}

.classic-npn-badge {
  flex-shrink: 0;
  padding: 3px 10px;
  border-radius: 999px;
  background: #fde68a;
  color: #92400e;
  font-size: 0.66rem;
  font-weight: 800;
  letter-spacing: 0.06em;
}

.parts-classic-entry-row:not(.npn-line):not(.cost-visible) .cef-cost {
  display: none;
}

.cef-npn-only[hidden],
.cef-stock-only[hidden] {
  display: none !important;
}

.parts-classic-entry-row .workflow-part-search-wrap {
  position: relative;
  z-index: 1;
  min-width: 0;
}

.parts-classic-entry-row.npn-line .workflow-part-typeahead {
  display: none !important;
}

.parts-classic-entry-row:focus-within .workflow-part-search-wrap {
  z-index: 5;
}

.parts-classic-entry-row .workflow-part-typeahead {
  position: absolute;
  left: 0;
  right: 0;
  top: calc(100% + 6px);
  z-index: 30;
  max-height: 220px;
  overflow: auto;
  box-shadow: 0 12px 28px rgba(15, 25, 35, 0.14);
}

.parts-classic-entry-row .invoice-ext-preview {
  display: flex;
  align-items: center;
  min-height: 38px;
  padding: 0 4px;
  font-size: 0.95rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  color: var(--porter-teal);
}

.parts-invoice-foot td {
  background: #f1f6fa !important;
  border-top: 2px solid #c5d2de;
  padding: 10px 12px;
  font-weight: 700;
}

.parts-invoice-foot .foot-label {
  text-align: right;
  color: var(--muted);
  font-size: 0.82rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-weight: 700;
}

.parts-invoice-entry-label span {
  font-size: 0.78rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #0f766e;
}

.parts-invoice-entry-label small {
  display: block;
  margin-top: 4px;
  color: var(--muted);
}

.parts-invoice-entry-label kbd {
  padding: 1px 5px;
  border-radius: 4px;
  border: 1px solid var(--line);
  background: #fff;
  font-size: 0.72rem;
}

.parts-invoice-empty-row td {
  padding: 28px 16px;
  text-align: center;
  background: #f8fafc;
}

.parts-invoice-empty {
  display: grid;
  gap: 6px;
  color: var(--muted);
}

.parts-invoice-empty strong {
  color: var(--ink);
  font-size: 1rem;
}

.col-num { width: 2.2rem; text-align: center; color: var(--muted); }
.col-part { width: 9%; }
.col-desc { width: 30%; }
.col-stock { width: 8%; white-space: nowrap; }
.col-qty { width: 5%; }
.col-mode { width: 7%; }
.col-cost, .col-sale { width: 8%; text-align: right; }
.col-ext { width: 9%; text-align: right; }
.col-src { width: 5%; }
.col-actions { width: 5.5rem; min-width: 5.5rem; text-align: right; padding-left: 4px; padding-right: 6px; }

.parts-invoice-sheet td.col-actions {
  overflow: visible;
  white-space: nowrap;
}

.entry-dot {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.4rem;
  height: 1.4rem;
  border-radius: 999px;
  background: #ccfbf1;
  color: #0f766e;
  font-weight: 700;
  font-size: 0.9rem;
}

.invoice-cell-input {
  width: 100%;
  min-width: 0;
  padding: 7px 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  font-size: 0.86rem;
  color: var(--ink);
  transition: border-color .15s, background .15s, box-shadow .15s;
}

.invoice-cell-input:hover {
  border-color: #94a3b8;
}

.invoice-cell-input:focus {
  outline: none;
  border-color: var(--porter-teal);
  background: #fff;
  box-shadow: 0 0 0 3px rgba(0, 180, 166, 0.15);
}

.invoice-cell-qty { text-align: center; }
.invoice-cell-money { text-align: right; font-variant-numeric: tabular-nums; }

.invoice-part-link,
.invoice-part-code {
  font-weight: 700;
  color: var(--porter-teal);
}

.invoice-part-link {
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  text-align: left;
}

.invoice-desc {
  display: block;
  max-width: 280px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--ink);
}

.invoice-qty {
  display: inline-flex;
  align-items: baseline;
  gap: 2px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

.invoice-price-badge,
.invoice-src-pill {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.invoice-price-badge {
  background: #f1f5f9;
  color: #475569;
}

.invoice-src-pill.stock { background: #f1f5f9; color: #475569; }
.invoice-src-pill.epc { background: #dbeafe; color: #1d4ed8; }
.invoice-src-pill.kit { background: #ede9fe; color: #6d28d9; }
.invoice-src-pill.npn { background: #fef3c7; color: #b45309; }
.invoice-src-pill.labor { background: #e0f2fe; color: #0369a1; }
.invoice-src-pill.entry { background: #ccfbf1; color: #0f766e; }

.invoice-ext,
.invoice-ext-preview {
  font-variant-numeric: tabular-nums;
}

.invoice-margin {
  display: block;
  font-size: 0.72rem;
  margin-top: 2px;
}

.invoice-margin.pos { color: #059669; }
.invoice-margin.neg { color: #dc2626; }

.invoice-row-actions {
  display: inline-flex;
  gap: 3px;
  justify-content: flex-end;
  opacity: 1;
}

.invoice-row-btn {
  width: 26px;
  height: 26px;
  padding: 0;
  border-radius: 7px;
  border: 1px solid var(--line);
  background: #fff;
  color: var(--ink);
  cursor: pointer;
  font-size: 0.78rem;
  line-height: 1;
  flex-shrink: 0;
}

.invoice-row-btn:hover {
  background: #f1f5f9;
}

.invoice-row-btn.danger {
  color: #dc2626;
  border-color: #fecaca;
  background: #fff5f5;
}

.parts-invoice-foot .foot-total strong {
  font-size: 1.05rem;
  color: var(--porter-teal);
  font-variant-numeric: tabular-nums;
}

.parts-invoice-foot-detail .foot-meta {
  text-align: right;
  color: var(--muted);
  font-size: 0.8rem;
}

.parts-invoice-foot .foot-total {
  text-align: right;
}

.parts-invoice-foot .foot-total span {
  display: block;
  font-size: 0.72rem;
  text-transform: uppercase;
  color: var(--muted);
}

.module-smart-insight {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 0 0 12px;
  padding: 12px 14px;
  border-radius: 12px;
  border: 1px solid rgba(0, 180, 166, 0.22);
  background: linear-gradient(135deg, #f0fdfa 0%, #fff 100%);
  font-size: 0.88rem;
  position: relative;
}

.smart-insight-dismiss {
  flex: 0 0 auto;
  align-self: flex-start;
  margin-left: auto;
  border: 0;
  background: transparent;
  color: var(--muted);
  font-size: 1.25rem;
  line-height: 1;
  cursor: pointer;
  padding: 0 2px;
}

.smart-insight-dismiss:hover {
  color: var(--ink);
}

.company-optional-modules .check-row span {
  line-height: 1.45;
}

.micr-specs-panel .form-grid.compact {
  margin-top: 8px;
}

.micr-preview-box {
  margin-top: 12px;
  padding: 12px 14px;
  border-radius: 10px;
  border: 1px dashed rgba(0, 180, 166, 0.35);
  background: rgba(0, 180, 166, 0.05);
}

.micr-preview-line {
  display: block;
  margin-top: 8px;
  padding: 10px 12px;
  border-radius: 8px;
  background: #fff;
  border: 1px solid var(--line);
  font-family: "MICR E13B", "E13B", "OCR A Extended", "Courier New", monospace;
  font-size: 14pt;
  letter-spacing: 0.14em;
  word-break: break-all;
}

.module-smart-insight p {
  flex: 1;
  margin: 0;
  color: var(--ink);
  line-height: 1.45;
}

.module-smart-icon {
  flex: 0 0 auto;
  color: var(--porter-teal);
  font-size: 1rem;
  margin-top: 1px;
}

.parts-order-receive-cell input[type="number"] {
  width: 72px;
  min-height: 36px;
  text-align: center;
}
.parts-order-receive-actions {
  display: inline-flex;
  gap: 4px;
  flex-wrap: wrap;
}
.parts-order-list-footer {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  padding: 12px 16px;
  border-top: 1px solid var(--line);
  background: var(--panel-soft, #f8fafc);
}
.parts-order-list-header {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}
.parts-order-list-header-main {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}
.parts-order-list-header-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.order-list-date-label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: var(--muted, #64748b);
}
.order-list-date-label input[type="date"] {
  padding: 4px 8px;
  border: 1px solid var(--line, #d0d5dd);
  border-radius: 6px;
}
.parts-order-list-summary {
  margin: 0 16px 6px;
}
.parts-order-list-intro {
  margin: 0 16px 10px;
}
.parts-order-list-vendor-bar {
  display: grid;
  grid-template-columns: minmax(220px, 1.4fr) minmax(160px, 1fr) auto auto;
  gap: 10px 12px;
  align-items: end;
  margin: 0 16px 12px;
  padding: 10px 12px;
  border: 2px solid var(--blue, #2563eb);
  border-radius: 10px;
  background: #f8fbff;
}
.parts-order-list-vendor-bar .parts-order-source-picker select.parts-order-source-select {
  height: auto;
  min-height: 38px;
  max-height: 42px;
}
.parts-order-list-table-wrap {
  max-height: min(58vh, 640px);
  overflow: auto;
  margin: 0 16px 12px;
  border: 1px solid var(--line, #d0d5dd);
  border-radius: 8px;
  background: #fff;
}
.parts-order-list-epc-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  margin: 0 16px 12px;
  padding: 10px 12px;
  border: 1px dashed var(--line, #d0d5dd);
  border-radius: 10px;
  background: #fafafa;
}
.parts-order-list-epc-bar .meta {
  flex: 1 1 180px;
}
.parts-order-list-quick-add {
  margin: 0 16px 12px;
  padding: 10px 12px;
  border: 1px solid var(--line, #d0d5dd);
  border-radius: 10px;
  background: #fff;
}
.order-list-vendor-field {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 140px;
}
.order-list-vendor-field select,
.order-list-vendor-field input {
  width: 100%;
  max-width: 180px;
  font-size: 12px;
}
.parts-order-vendor-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  padding: 10px 16px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
  margin: 0 16px 12px;
}
.parts-order-vendor-bar select {
  min-width: 220px;
}

/* OEM factory order type picker — STK / EMG / SPO segmented control */
.oem-order-type-picker {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: min(100%, 320px);
}
.oem-order-type-picker-label {
  font-size: 12px;
  font-weight: 600;
  color: var(--muted, #667085);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.oem-order-type-segments {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 4px;
  border: 1px solid var(--line, #d0d5dd);
  border-radius: 10px;
  background: #fff;
}
.oem-order-type-seg {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1px;
  min-width: 72px;
  padding: 8px 10px;
  border: 1px solid transparent;
  border-radius: 8px;
  background: transparent;
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}
.oem-order-type-seg .oem-order-type-code {
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.06em;
  line-height: 1.1;
}
.oem-order-type-seg .oem-order-type-name {
  font-size: 10px;
  font-weight: 600;
  color: var(--muted, #667085);
  line-height: 1.1;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}
.oem-order-type-seg.blue.active { background: #eff6ff; border-color: #2563eb; box-shadow: inset 0 0 0 1px #2563eb; }
.oem-order-type-seg.red.active { background: #fef2f2; border-color: #dc2626; box-shadow: inset 0 0 0 1px #dc2626; }
.oem-order-type-seg.gold.active { background: #fffbeb; border-color: #d97706; box-shadow: inset 0 0 0 1px #d97706; }
.oem-order-type-seg.gray.active { background: #f3f4f6; border-color: #6b7280; box-shadow: inset 0 0 0 1px #6b7280; }
.oem-order-type-seg.purple.active { background: #f5f3ff; border-color: #7c3aed; box-shadow: inset 0 0 0 1px #7c3aed; }
.oem-order-type-seg.blue.active .oem-order-type-code { color: #1d4ed8; }
.oem-order-type-seg.red.active .oem-order-type-code { color: #b91c1c; }
.oem-order-type-seg.gold.active .oem-order-type-code { color: #b45309; }
.oem-order-type-seg.gray.active .oem-order-type-code { color: #374151; }
.oem-order-type-seg.purple.active .oem-order-type-code { color: #6d28d9; }
.oem-order-type-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 3px 8px;
  border-radius: 999px;
  border: 1px solid transparent;
  font-size: 11px;
  line-height: 1.2;
  white-space: nowrap;
}
.oem-order-type-badge .oem-order-type-code {
  font-weight: 800;
  letter-spacing: 0.05em;
}
.oem-order-type-badge .oem-order-type-name {
  font-weight: 600;
  opacity: 0.9;
}
.oem-order-type-badge.blue { background: #eff6ff; border-color: #bfdbfe; color: #1d4ed8; }
.oem-order-type-badge.red { background: #fef2f2; border-color: #fecaca; color: #b91c1c; }
.oem-order-type-badge.gold { background: #fffbeb; border-color: #fde68a; color: #b45309; }
.oem-order-type-badge.gray { background: #f3f4f6; border-color: #e5e7eb; color: #374151; }
.oem-order-type-badge.purple { background: #f5f3ff; border-color: #ddd6fe; color: #6d28d9; }
.oem-order-type-chip {
  display: inline-flex;
  align-items: center;
  padding: 2px 7px;
  margin-right: 4px;
  border-radius: 6px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.05em;
}
.oem-order-type-chip.blue { background: #eff6ff; color: #1d4ed8; }
.oem-order-type-chip.red { background: #fef2f2; color: #b91c1c; }
.oem-order-type-chip.gold { background: #fffbeb; color: #b45309; }
.oem-order-type-line-picker {
  display: inline-flex;
  gap: 3px;
  flex-wrap: wrap;
}
.oem-order-type-line-seg {
  min-width: 34px;
  padding: 4px 6px;
  border: 1px solid var(--line, #d0d5dd);
  border-radius: 6px;
  background: #fff;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.04em;
  cursor: pointer;
}
.oem-order-type-line-seg.active.blue { background: #eff6ff; border-color: #2563eb; color: #1d4ed8; }
.oem-order-type-line-seg.active.red { background: #fef2f2; border-color: #dc2626; color: #b91c1c; }
.oem-order-type-line-seg.active.gold { background: #fffbeb; border-color: #d97706; color: #b45309; }
.oem-order-type-line-seg.active.gray { background: #f3f4f6; border-color: #6b7280; color: #374151; }
.oem-order-type-defaults-panel { margin-bottom: 14px; }
.oem-order-type-defaults-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 12px;
  margin-top: 10px;
}
.oem-order-type-default-row {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.oem-order-type-default-row select {
  width: 100%;
}

.parts-transfer-form select {
  min-width: 140px;
}

.parts-transfers-panel .ro-part-add {
  margin-bottom: 12px;
}

dialog.modal-invoice-sheet,
dialog.parts-document-modal {
  width: min(1480px, calc(100vw - 16px));
  max-width: none;
  background: #fff;
}

dialog.parts-document-modal,
dialog.parts-order-modal {
  max-height: calc(100dvh - 12px);
  height: calc(100dvh - 12px);
  overflow: hidden;
  overscroll-behavior: contain;
}

html.parts-document-modal-open,
body.parts-document-modal-open {
  overflow: hidden;
  overscroll-behavior: none;
  height: 100%;
}

html.parts-document-modal-open body {
  touch-action: none;
}

html.parts-document-modal-open #partsDocumentModal,
html.parts-document-modal-open #partsDocumentModal * {
  touch-action: pan-y;
}

dialog.modal-parts-workflow {
  width: min(1280px, calc(100vw - 24px));
  max-width: none;
}

dialog.modal-invoice-sheet .modal-invoice-sheet {
  width: 100%;
  background: #fff;
}

dialog.parts-document-modal .modal-invoice-sheet {
  display: flex;
  flex-direction: column;
  height: 100%;
  max-height: calc(100dvh - 12px);
  min-height: 0;
  overflow: hidden;
}

dialog.parts-document-modal .modal-header.parts-document-header {
  flex: 0 0 auto;
}

dialog.modal-invoice-sheet .parts-document-header {
  background: linear-gradient(180deg, #f8fbfd 0%, #fff 100%);
  border-bottom: 3px solid var(--porter-teal);
}

dialog.modal-invoice-sheet .parts-document-body,
dialog.parts-document-modal .parts-document-body {
  padding: 18px 22px 22px;
  background: linear-gradient(165deg, #eef6fa 0%, #f8fbfd 42%, #fff 100%);
}

.parts-document-shell {
  display: flex;
  flex-direction: column;
  flex: 1 0 auto;
  min-height: min-content;
  gap: 0;
}

.parts-document-scroll-wrap {
  position: relative;
  flex: 1 0 auto;
  display: flex;
  flex-direction: column;
}

.parts-document-scroll {
  flex: 1 0 auto;
  overflow: visible;
  padding: 8px 6px 16px 0;
  margin-right: -2px;
}

dialog.parts-document-modal .parts-document-body.is-scrolled:not(.is-scrolled-top) {
  box-shadow: inset 0 10px 10px -10px rgba(15, 25, 35, 0.12);
}

dialog.parts-document-modal .parts-document-body.is-scrolled:not(.is-scrolled-bottom)::after {
  content: "";
  position: sticky;
  bottom: 0;
  display: block;
  height: 14px;
  margin-top: -14px;
  background: linear-gradient(0deg, rgba(15, 25, 35, 0.08), transparent);
  pointer-events: none;
}

.parts-doc-scroll-nav {
  flex: 0 0 auto;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  padding: 0 0 8px;
  border-bottom: 1px dashed rgba(0, 180, 166, 0.2);
  margin-bottom: 8px;
}

.parts-doc-header-toggle {
  margin-left: auto;
}

.parts-doc-compact-header.is-collapsed .parts-doc-header-body {
  display: none;
}

.parts-doc-compact-header.is-collapsed {
  margin-bottom: 8px;
  padding-bottom: 12px;
}

dialog.parts-document-modal .parts-invoice-command-bar {
  position: relative;
  top: auto;
  z-index: 1;
  box-shadow: none;
}

dialog.parts-document-modal .parts-invoice-sheet thead th {
  position: static;
  top: auto;
  z-index: auto;
}

.parts-document-cashier-bar {
  flex: 0 0 auto;
  display: grid;
  gap: 10px;
  margin-top: 0;
  padding: 14px 16px 16px;
  border-top: 3px solid var(--porter-teal);
  border-radius: 14px 14px 0 0;
  background: linear-gradient(180deg, #f0faf9 0%, #fff 55%);
  box-shadow: 0 -8px 24px rgba(15, 25, 35, 0.08);
  position: sticky;
  bottom: 0;
  z-index: 8;
}

.parts-cashier-bar-summary {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px 16px;
}

.parts-cashier-bar-totals {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}

.parts-cashier-bar-label {
  font-size: 0.72rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #64748b;
}

.parts-cashier-bar-amount {
  font-size: 1.35rem;
  font-weight: 800;
  color: var(--ink);
  letter-spacing: -0.02em;
}

.parts-cashier-bar-meta {
  margin: 0;
}

.parts-cashier-bar-zones {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
  gap: 12px;
  align-items: stretch;
}

.parts-cashier-zone {
  display: grid;
  gap: 8px;
  padding: 12px 14px;
  border: 1px solid #d7e2ec;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.92);
}

.parts-cashier-zone-accounting {
  border-color: rgba(0, 180, 166, 0.35);
  background: linear-gradient(180deg, rgba(0, 180, 166, 0.06) 0%, rgba(255, 255, 255, 0.95) 100%);
  box-shadow: inset 0 0 0 1px rgba(0, 180, 166, 0.08);
}

.parts-cashier-zone-accounting.muted {
  border-color: #d7e2ec;
  background: #f8fbfd;
  box-shadow: none;
}

.parts-cashier-zone-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 4px 10px;
}

.parts-cashier-zone-title {
  font-size: 0.74rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.09em;
  color: #334155;
}

.parts-cashier-zone-accounting .parts-cashier-zone-title {
  color: #0f766e;
}

.parts-cashier-zone-sub {
  font-size: 0.72rem;
}

.parts-cashier-closing-actions .primary {
  box-shadow: 0 2px 8px rgba(0, 180, 166, 0.22);
}

.parts-cashier-zone-idle,
.parts-cashier-zone-done {
  margin: 0;
}

@media (max-width: 900px) {
  .parts-cashier-bar-zones {
    grid-template-columns: 1fr;
  }
}

.parts-cashier-zone-accounting.closing-zone-attention {
  animation: parts-closing-zone-pulse 2.8s ease;
}

@keyframes parts-closing-zone-pulse {
  0%, 100% { box-shadow: inset 0 0 0 0 transparent; }
  18% { box-shadow: 0 0 0 3px color-mix(in srgb, var(--porter-teal) 40%, transparent), inset 0 0 0 1px rgba(0, 180, 166, 0.25); }
  45% { box-shadow: 0 0 0 1px color-mix(in srgb, var(--porter-teal) 20%, transparent); }
}

.parts-cashier-bar-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}

.parts-cashier-bar-note,
.parts-cashier-perm-hint {
  margin: 0;
}

.parts-invoice-committed-row.just-posted {
  animation: parts-line-posted-flash 1.8s ease;
}

@keyframes parts-line-posted-flash {
  0%, 100% { background: transparent; }
  15% { background: color-mix(in srgb, #2d8f4e 22%, transparent); }
  45% { background: color-mix(in srgb, #2d8f4e 10%, transparent); }
}

.parts-doc-compact-header {
  display: grid;
  gap: 12px;
  padding: 14px 16px;
  margin-bottom: 14px;
  border: 1px solid rgba(0, 180, 166, 0.18);
  border-radius: 14px;
  background: linear-gradient(180deg, #fff 0%, #f8fcfd 100%);
  box-shadow: 0 4px 18px rgba(15, 25, 35, 0.06);
  position: sticky;
  top: 0;
  z-index: 7;
}

.parts-document-shell > .parts-doc-compact-header {
  position: relative;
  top: auto;
  z-index: 6;
}

.parts-doc-top-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.parts-doc-context-row {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(260px, 1fr);
  gap: 10px;
  align-items: stretch;
}

.parts-doc-meta-line {
  font-size: 11px;
  padding-top: 2px;
  border-top: 1px dashed var(--line);
}

.parts-doc-vehicle-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.parts-doc-vehicle-chip {
  display: inline-flex;
  align-items: baseline;
  gap: 4px;
  padding: 6px 10px;
  border-radius: 8px;
  border: 1px solid var(--line);
  background: #fff;
  font-size: 13px;
}

.parts-doc-vin-row.compact {
  margin-top: 0;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
}

.parts-doc-next-step {
  display: flex;
  gap: 12px;
  align-items: center;
  padding: 12px 14px;
  border-radius: 12px;
  border: 1px solid rgba(0, 180, 166, 0.2);
  background: linear-gradient(135deg, #eefaf8 0%, #fff 100%);
  min-height: 100%;
  box-shadow: 0 2px 8px rgba(0, 180, 166, 0.06);
}

.parts-doc-next-copy {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.parts-doc-next-copy strong {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--porter-teal);
}

.parts-doc-next-copy span {
  font-size: 12px;
  color: var(--muted);
  line-height: 1.35;
}

.parts-doc-next-icon {
  flex-shrink: 0;
  font-size: 16px;
  font-weight: 800;
  color: var(--porter-teal);
  line-height: 1;
}

.parts-doc-hero {
  border-color: rgba(0, 180, 166, 0.22);
  background: linear-gradient(135deg, #fff 0%, #eef9f8 100%);
  box-shadow: var(--shadow-sm);
}

.parts-doc-total-card {
  border-color: rgba(0, 180, 166, 0.25);
  background: #fff;
}

.parts-doc-total-card strong {
  color: var(--porter-teal);
}

.parts-doc-vin-row {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 8px;
  margin-top: 10px;
}

.parts-doc-vin-row input {
  min-width: 240px;
  max-width: 320px;
}

.parts-doc-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 2px;
  padding: 14px 16px;
  border: 1px solid #d7e2ec;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.95);
  box-shadow: 0 -4px 20px rgba(15, 25, 35, 0.05);
  position: sticky;
  bottom: 0;
  z-index: 2;
}

.parts-doc-summary-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.parts-doc-summary-card {
  display: grid;
  gap: 3px;
  padding: 12px 14px;
  border: 1px solid #d7e2ec;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 1px 3px rgba(15, 25, 35, 0.04);
  min-width: 0;
}

.parts-doc-summary-card.highlight {
  border-color: rgba(0, 180, 166, 0.4);
  background: linear-gradient(145deg, #fff 0%, #e8faf8 100%);
  box-shadow: 0 4px 14px rgba(0, 180, 166, 0.12);
}

.parts-doc-summary-card small {
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #94a3b8;
}

.parts-doc-summary-card strong {
  font-size: 15px;
  line-height: 1.25;
  overflow: hidden;
  text-overflow: ellipsis;
}

.parts-doc-summary-card .meta {
  font-size: 11px;
  line-height: 1.35;
  overflow: hidden;
  text-overflow: ellipsis;
}

.parts-doc-summary-card.highlight strong {
  font-size: 1.35rem;
  color: var(--porter-teal);
  font-variant-numeric: tabular-nums;
}

.parts-receiving-workflow {
  display: grid;
  gap: 14px;
}

.parts-receiving-header-panel {
  display: grid;
  gap: 12px;
  padding: 14px 16px;
  border: 1px solid #c9d4df;
  border-radius: 12px;
  background: linear-gradient(180deg, #fff 0%, #f7fbfd 100%);
}

.parts-receiving-lead {
  margin: 0;
  font-size: 13px;
  color: var(--muted);
  line-height: 1.45;
}

.parts-receiving-meta-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.parts-receiving-accounting-strip {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid rgba(59, 130, 246, 0.22);
  background: #eff6ff;
}

.parts-receiving-accounting-strip.detail {
  margin: 0 0 12px;
}

.parts-receiving-vendor-wrap {
  display: grid;
  gap: 8px;
}

.parts-receiving-vendor-hint {
  margin: 0;
}

.parts-receiving-vendor-chip .workflow-party-chip {
  margin-top: 4px;
}

.parts-receiving-line {
  grid-template-columns: minmax(220px, 2fr) 72px minmax(110px, 1fr) 36px;
}

.parts-receiving-detail-header {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(180px, 0.8fr);
  gap: 12px;
  margin-bottom: 12px;
}

.parts-receiving-detail-vendor,
.parts-receiving-detail-total {
  display: grid;
  gap: 4px;
  padding: 12px 14px;
  border: 1px solid #c9d4df;
  border-radius: 10px;
  background: #fff;
}

.parts-receiving-detail-vendor small,
.parts-receiving-detail-total small {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--muted);
  font-weight: 700;
}

.parts-receiving-detail-total strong {
  color: var(--porter-teal);
  font-size: 1.2rem;
}

.parts-receiving-lines-table table {
  border-collapse: collapse;
}

.parts-receiving-lines-table th,
.parts-receiving-lines-table td {
  border: 1px solid #c9d4df;
}

.parts-receiving-lines-table tbody tr:nth-child(even) {
  background: #f6f9fc;
}

.parts-receiving-source-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-top: 12px;
}

.parts-receiving-source-grid .source-row.wide {
  grid-column: 1 / -1;
}

@media (max-width: 900px) {
  .parts-receiving-meta-grid,
  .parts-receiving-detail-header,
  .parts-receiving-source-grid {
    grid-template-columns: 1fr;
  }
  .parts-receiving-line {
    grid-template-columns: 1fr;
  }
}

.parts-invoices-hub header {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
}

.parts-invoices-hub-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.parts-invoices-kpis {
  margin: 0 0 12px;
}

.parts-invoice-guide {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  margin-bottom: 14px;
  border-radius: 10px;
  background: #f8fbfd;
  border: 1px solid var(--line);
  font-size: 13px;
}

.parts-invoice-guide strong {
  margin-right: 6px;
}

.parts-invoice-empty-tips {
  margin: 10px 0 0;
  padding-left: 18px;
  color: var(--muted);
  font-size: 12px;
}

.panel.nested {
  box-shadow: none;
  border: 1px solid var(--line);
}

@media (max-width: 1100px) {
  .parts-doc-summary-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .parts-doc-context-row {
    grid-template-columns: 1fr;
  }
  .classic-entry-fields {
    grid-template-columns: 1fr 1fr;
    grid-template-areas: none;
  }
  .parts-classic-entry-row.npn-line .classic-entry-fields {
    grid-template-columns: 1fr 1fr;
    grid-template-areas: none;
  }
  .classic-field.cef-part,
  .classic-field.cef-npn-desc,
  .classic-field.cef-desc-stock {
    grid-column: 1 / -1;
    grid-area: auto;
  }
  .parts-classic-entry-row.npn-line .cef-npn-desc,
  .parts-classic-entry-row.npn-line .cef-qty,
  .parts-classic-entry-row.npn-line .cef-cost,
  .parts-classic-entry-row.npn-line .cef-sale,
  .parts-classic-entry-row.npn-line .cef-ext {
    grid-area: auto;
  }
  .classic-entry-npn-note {
    flex-direction: column;
    align-items: flex-start;
  }
}

@media (max-width: 720px) {
  .parts-doc-summary-strip {
    grid-template-columns: 1fr;
  }
}


dialog.modal-invoice-sheet .line-modal-body,
dialog.parts-document-modal .line-modal-body {
  padding-bottom: 0;
  max-height: none;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
}

dialog.parts-document-modal .parts-document-body {
  padding: 18px 22px 0;
  overflow: hidden;
  overscroll-behavior: contain;
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
}

dialog.parts-document-modal .parts-document-shell {
  flex: 1 1 auto;
  min-height: 0;
  max-height: 100%;
  overflow: hidden;
}

dialog.parts-document-modal .parts-doc-compact-header {
  flex: 0 0 auto;
}

dialog.parts-document-modal .parts-document-scroll-wrap {
  flex: 1 1 auto;
  min-height: 0;
  overflow: hidden;
}

dialog.parts-document-modal .parts-document-scroll {
  overflow-y: auto;
  overflow-x: hidden;
  flex: 1 1 auto;
  min-height: 0;
  -webkit-overflow-scrolling: touch;
  scroll-behavior: smooth;
}

dialog.parts-document-modal .parts-invoice-sheet-wrap {
  overflow: auto;
  max-height: min(42vh, 420px);
}

dialog.parts-document-modal .parts-invoice-classic-entry {
  flex-shrink: 0;
}

dialog.parts-document-modal .parts-invoice-classic-entry-stack {
  min-height: 200px;
  overflow: visible;
}

dialog.parts-document-modal .parts-invoice-committed-zone {
  min-height: 0;
}

dialog.parts-document-modal .parts-document-save-bar,
dialog.parts-document-modal .parts-document-cashier-bar,
dialog.parts-document-modal .sticky-actions {
  position: relative;
  bottom: auto;
  flex: 0 0 auto;
}

dialog.parts-document-modal .parts-document-cashier-bar {
  z-index: 3;
}

.parts-invoice-sheet .line-pricing-mode {
  width: 100%;
  padding: 6px 8px;
  border-radius: 8px;
  border: 1px solid var(--line);
  background: #fff;
  font-size: 0.82rem;
  color: var(--ink);
}

.parts-invoice-sheet .col-stock small {
  display: block;
  font-size: 0.72rem;
  color: var(--muted);
}

body.dark-mode dialog.modal-invoice-sheet .parts-invoice-workbench,
body.dark-mode dialog.parts-document-modal .parts-invoice-workbench {
  background: rgba(17, 31, 48, 0.96);
  border-color: rgba(148, 163, 184, 0.22);
}

body.dark-mode dialog.modal-invoice-sheet .parts-invoice-command-bar,
body.dark-mode dialog.parts-document-modal .parts-invoice-command-bar {
  background: linear-gradient(180deg, rgba(0, 180, 166, 0.12), rgba(17, 31, 48, 0.5));
}

body.dark-mode dialog.modal-invoice-sheet .parts-invoice-sheet-wrap,
body.dark-mode dialog.parts-document-modal .parts-invoice-sheet-wrap {
  background: rgba(9, 21, 32, 0.5);
}

body.dark-mode dialog.modal-invoice-sheet .parts-invoice-sheet td,
body.dark-mode dialog.parts-document-modal .parts-invoice-sheet td {
  background: rgba(17, 31, 48, 0.85);
  border-bottom-color: rgba(148, 163, 184, 0.15);
}

body.dark-mode dialog.modal-invoice-sheet .parts-invoice-sheet thead th,
body.dark-mode dialog.parts-document-modal .parts-invoice-sheet thead th {
  background: rgba(22, 38, 58, 0.98);
}

body.dark-mode dialog.modal-invoice-sheet .parts-classic-entry-row,
body.dark-mode dialog.parts-document-modal .parts-classic-entry-row {
  background: rgba(17, 31, 48, 0.92);
  border-color: rgba(0, 180, 166, 0.35);
}

body.dark-mode dialog.modal-invoice-sheet .parts-classic-entry-row.npn-line,
body.dark-mode dialog.parts-document-modal .parts-classic-entry-row.npn-line {
  background: rgba(40, 32, 16, 0.85);
  border-color: rgba(217, 119, 6, 0.45);
}

body.dark-mode dialog.modal-invoice-sheet .parts-invoice-classic-entry,
body.dark-mode dialog.parts-document-modal .parts-invoice-classic-entry {
  background: rgba(12, 24, 38, 0.9);
  border-color: rgba(0, 180, 166, 0.3);
}

body.dark-mode dialog.modal-invoice-sheet .classic-readout,
body.dark-mode dialog.parts-document-modal .classic-readout {
  background: rgba(9, 21, 32, 0.85);
  border-color: rgba(148, 163, 184, 0.22);
}

body.dark-mode dialog.modal-invoice-sheet .invoice-cell-input,
body.dark-mode dialog.parts-document-modal .invoice-cell-input,
body.dark-mode dialog.modal-invoice-sheet .parts-invoice-sheet .line-pricing-mode,
body.dark-mode dialog.parts-document-modal .parts-invoice-sheet .line-pricing-mode {
  background: rgba(9, 21, 32, 0.85);
  border-color: rgba(148, 163, 184, 0.22);
  color: var(--ink);
}

body.dark-mode dialog.modal-invoice-sheet .parts-document-body,
body.dark-mode dialog.parts-document-modal .parts-document-body {
  background: linear-gradient(180deg, #07111d 0%, #0c1c2e 100%);
}

body.dark-mode dialog.modal-invoice-sheet .parts-doc-actions,
body.dark-mode dialog.parts-document-modal .parts-doc-actions,
body.dark-mode dialog.modal-invoice-sheet .parts-doc-hero,
body.dark-mode dialog.parts-document-modal .parts-doc-hero {
  background: rgba(17, 31, 48, 0.94);
  border-color: rgba(148, 163, 184, 0.22);
}

body.dark-mode dialog.parts-document-modal .parts-document-cashier-bar {
  background: linear-gradient(180deg, rgba(0, 180, 166, 0.12) 0%, rgba(17, 31, 48, 0.98) 55%);
  border-top-color: rgba(0, 180, 166, 0.45);
}

body.dark-mode dialog.parts-document-modal .parts-cashier-zone {
  background: rgba(17, 31, 48, 0.92);
  border-color: rgba(148, 163, 184, 0.22);
}

body.dark-mode dialog.parts-document-modal .parts-cashier-zone-accounting {
  background: linear-gradient(180deg, rgba(0, 180, 166, 0.14) 0%, rgba(17, 31, 48, 0.96) 100%);
  border-color: rgba(0, 180, 166, 0.35);
}

.print-preview-dialog {
  width: min(96vw, 1100px);
  max-width: none;
}

.print-preview-modal {
  width: 100%;
  max-height: 92vh;
  display: flex;
  flex-direction: column;
}

.print-preview-body {
  flex: 1;
  min-height: 60vh;
  overflow: auto;
}

.print-preview-frame {
  width: 100%;
  height: 100%;
  min-height: 62vh;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #fff;
}

.print-preview-actions {
  margin-top: 12px;
}

.workspace-context-strip {
  margin: 0 0 14px;
  padding: 10px 14px;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: linear-gradient(90deg, rgba(59,130,246,.08), rgba(16,185,129,.06));
  font-size: 0.9rem;
}

.parts-workflow-pages .parts-workflow-page {
  display: none;
}

.parts-workflow-pages .parts-workflow-page.active {
  display: block;
}

.parts-page-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px solid var(--border);
}

.parts-page-indicator {
  font-size: 12px;
  color: var(--muted, var(--ink-3));
}

.parts-batch-actions {
  margin-top: 10px;
}

.parts-ro-workbench .ro-detail-part-line,
.ro-detail-parts-block .ro-detail-part-line {
  display: grid;
  grid-template-columns: minmax(96px, 0.85fr) minmax(220px, 2.2fr) 72px minmax(120px, 1fr) minmax(100px, 1fr) auto auto;
  gap: 10px 12px;
  align-items: end;
}

.parts-ro-workbench .ro-detail-part-line .line-ro-line,
.ro-detail-parts-block .ro-detail-part-line .line-ro-line {
  min-width: 0;
}

.parts-ro-workbench .ro-detail-part-line .line-ro-line select,
.ro-detail-parts-block .ro-detail-part-line .line-ro-line select {
  width: 100%;
  min-width: 0;
}

.parts-workflow-line:not(tr):has(.line-ro-line):not(.ro-detail-part-line) {
  grid-template-columns: 0.9fr 1.6fr 0.6fr 0.8fr auto;
}

.parts-workflow-lines {
  display: flex;
  flex-direction: column;
  gap: 12px;
  max-height: min(520px, 55vh);
  overflow-y: auto;
  padding-right: 4px;
}

.parts-paged-block .parts-workflow-lines {
  max-height: none;
}

.parts-workflow-line:not(tr) {
  display: grid;
  grid-template-columns: minmax(200px, 2fr) minmax(200px, 2.2fr) 72px minmax(130px, 1fr) minmax(110px, 1fr) minmax(110px, 1fr) 36px;
  gap: 10px 12px;
  align-items: end;
}

.parts-workflow-line-card {
  align-items: stretch;
  padding: 12px 14px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.02);
}

.parts-workflow-line-card:focus-within,
.parts-workflow-line-card:hover {
  border-color: rgba(20, 184, 166, 0.35);
  background: rgba(20, 184, 166, 0.05);
}

.workflow-field-card {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--muted);
}

.workflow-field-card input,
.workflow-field-card select {
  min-height: 40px;
  padding: 9px 10px;
  font-size: 0.9rem;
  font-weight: 400;
  text-transform: none;
  letter-spacing: normal;
  color: var(--ink);
  background: #fff;
}

.workflow-field-card .workflow-part-typeahead {
  position: absolute;
  left: 0;
  right: 0;
  top: calc(100% + 4px);
  z-index: 12;
  max-height: 240px;
  overflow: auto;
}

.workflow-part-search-wrap.wide {
  position: relative;
}

.parts-workflow-line .workflow-line-remove {
  align-self: end;
  min-width: 36px;
  min-height: 40px;
  padding: 0;
  font-size: 1.1rem;
  line-height: 1;
}

.parts-workflow-line label {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 12px;
}

.detail-focus-pulse {
  outline: 2px solid var(--porter-teal);
  outline-offset: 4px;
  border-radius: 12px;
  transition: outline-color 0.4s ease;
}

.line-actions-cell {
  white-space: nowrap;
}

.danger-text {
  color: var(--red) !important;
}

.line-remove-x {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 28px;
  min-height: 28px;
  padding: 2px 8px;
  border: 1px solid color-mix(in srgb, var(--red) 35%, transparent);
  border-radius: 6px;
  background: transparent;
  color: var(--red) !important;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
}

.line-remove-x.compact {
  min-width: 24px;
  min-height: 24px;
  padding: 0 6px;
  font-size: 13px;
}

.line-remove-x:hover {
  background: color-mix(in srgb, var(--red) 10%, transparent);
}

.ro-line-tab-wrap {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.ro-line-tab-wrap.active .ro-line-tab {
  border-color: var(--accent, #0d9488);
}

@media (max-width: 720px) {
  .parts-workflow-line:not(tr) { grid-template-columns: 1fr 1fr; }
}

@keyframes toastIn {
  from { opacity: 0; transform: translateX(20px) scale(.96); }
  to   { opacity: 1; transform: translateX(0) scale(1); }
}

.toast-icon { font-size: 16px; flex: 0 0 auto; margin-top: 1px; }

.toast-body strong {
  display: block;
  font-weight: 700;
  margin-bottom: 2px;
}

.toast-body span { color: rgba(255,255,255,.65); font-size: 12px; }

/* ─────────────────────────────────────────────────────────────────────────────
   SEARCH RESULTS
───────────────────────────────────────────────────────────────────────────── */
.search-results-body {
  padding: 16px 22px;
  max-height: 60vh;
  overflow-y: auto;
}

.forms-picker-list.forms-library-list {
  display: grid;
  gap: 8px;
  max-height: min(56vh, 520px);
  overflow: auto;
  padding-right: 4px;
}

.forms-picker-row {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 10px;
  align-items: center;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface);
}

.forms-picker-row strong {
  display: block;
}

.forms-picker-row small {
  display: block;
  color: var(--muted);
}

.search-modal-query-wrap {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  padding: 12px 22px;
  border-bottom: 1px solid var(--line);
  background: #FAFCFE;
  position: sticky;
  top: 0;
  z-index: 3;
}

.party-search-status {
  padding: 0 4px 8px;
  margin: 0;
  font-weight: 600;
  color: var(--ink);
}

.search-modal-vin-wrap {
  flex: 1 1 100%;
  margin-top: 2px;
}

.search-modal-vin-wrap label {
  display: block;
  font-size: 12px;
  color: var(--muted);
}

.search-modal-vin-wrap input {
  width: 100%;
  margin-top: 4px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 8px 10px;
  font-size: 14px;
}

.search-modal-query-wrap .search-icon {
  color: var(--muted);
  font-size: 16px;
}

.search-modal-query-wrap input {
  flex: 1;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px 12px;
  font-size: 14px;
  background: #fff;
}

.search-modal-query-wrap input:focus {
  outline: none;
  border-color: var(--porter-teal);
  box-shadow: 0 0 0 3px rgba(0, 180, 166, 0.12);
}

.search-group-title {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .4px;
  color: var(--muted);
  padding: 8px 0 6px;
}

.search-result-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  margin-bottom: 6px;
  cursor: pointer;
  transition: border-color var(--fast) var(--ease), background var(--fast) var(--ease);
}

button.search-result-item {
  width: 100%;
  text-align: left;
  font: inherit;
  color: inherit;
  background: var(--surface, #fff);
  appearance: none;
}

.search-result-item:hover {
  border-color: var(--porter-teal);
  background: #F0FDFB;
}

.search-result-icon {
  width: 32px;
  height: 32px;
  border-radius: 7px;
  background: var(--blue-soft);
  display: grid;
  place-items: center;
  font-size: 14px;
  flex: 0 0 auto;
}

.search-result-text {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
}

.search-result-text strong {
  display: block;
  font-size: 13.5px;
  font-weight: 700;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.search-result-text span {
  font-size: 12px;
  color: var(--muted);
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* ─────────────────────────────────────────────────────────────────────────────
   INVENTORY GRID
───────────────────────────────────────────────────────────────────────────── */
.inv-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 14px;
  padding: 16px;
}

.inv-card {
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--panel);
  overflow: hidden;
  box-shadow: var(--shadow-sm);
  transition: transform var(--fast) var(--ease), box-shadow var(--fast) var(--ease);
}

.inv-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow);
}

.inv-card-img {
  height: 140px;
  background: linear-gradient(135deg, #E8F4F8 0%, #D0E8F2 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 40px;
  color: rgba(13,27,42,.15);
  border-bottom: 1px solid var(--line);
  position: relative;
}

.inv-card-type {
  position: absolute;
  top: 8px;
  left: 8px;
}

.inv-card-age {
  position: absolute;
  top: 8px;
  right: 8px;
  padding: 2px 7px;
  background: rgba(13,27,42,.6);
  color: #fff;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
}

.inv-card-body {
  padding: 14px;
}

.inv-card-title {
  font-size: 14px;
  font-weight: 800;
  margin-bottom: 4px;
}

.inv-card-sub {
  font-size: 12px;
  color: var(--muted);
  margin-bottom: 10px;
}

.inv-card-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  padding-top: 10px;
  border-top: 1px solid var(--line);
}

.inv-card-deal {
  margin-left: auto;
  font-size: 12px;
}

.inv-card-price {
  font-size: 16px;
  font-weight: 800;
  color: var(--ink);
}

.inv-card-stock {
  font-size: 11px;
  color: var(--muted);
  font-weight: 600;
}

/* ─────────────────────────────────────────────────────────────────────────────
   REPORTS
───────────────────────────────────────────────────────────────────────────── */
.report-stat-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  padding: 16px 18px;
  border-bottom: 1px solid var(--line);
}

.report-stat {
  text-align: center;
}

.report-stat .rs-val {
  font-size: 22px;
  font-weight: 800;
  letter-spacing: -0.5px;
}

.report-stat .rs-label {
  font-size: 11.5px;
  color: var(--muted);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .3px;
  margin-top: 2px;
}

/* ─────────────────────────────────────────────────────────────────────────────
   MISC UTILITIES
───────────────────────────────────────────────────────────────────────────── */
.meta {
  color: var(--muted);
  font-size: 12px;
}

.text-green  { color: var(--green); }
.text-gold   { color: var(--gold); }
.text-red    { color: var(--red); }
.text-blue   { color: var(--blue); }
.text-teal   { color: var(--porter-teal); }
.text-muted  { color: var(--muted); }

.fw-700 { font-weight: 700; }
.fw-800 { font-weight: 800; }

.divider {
  border: 0;
  border-top: 1px solid var(--line);
  margin: 14px 0;
}

.spinner {
  display: inline-block;
  width: 18px;
  height: 18px;
  border: 2px solid rgba(0,180,166,.2);
  border-top-color: var(--porter-teal);
  border-radius: 50%;
  animation: spin .6s linear infinite;
}

@keyframes spin {
  to { transform: rotate(360deg); }
}

.loading-spinner {
  display: block;
  width: 36px;
  height: 36px;
  border: 3px solid rgba(0,180,166,.2);
  border-top-color: var(--porter-teal);
  border-radius: 50%;
  animation: spin .7s linear infinite;
}

tr.group-row td {
  background: rgba(0,180,166,.08);
  font-size: 12px;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--porter-teal);
}

.desking-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}
.desking-grid label {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 12px;
  font-weight: 600;
  color: var(--muted);
}
.sales-flow-kpis {
  margin-bottom: 12px;
}
.sales-lead-roi-panel .table-wrap {
  max-height: 220px;
  overflow: auto;
}
.desk-primary-actions {
  gap: 8px;
  flex-wrap: wrap;
}
.desking-summary {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
  margin-top: 16px;
}
.negotiation-worksheet-panel {
  margin-top: 16px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius, 10px);
  background: var(--panel-soft, #f8fafc);
}
.negotiation-worksheet-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 10px;
}
.negotiation-worksheet-head h3 {
  margin: 0;
  font-size: 14px;
}
.negotiation-worksheet-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.negotiation-worksheet-quad {
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel, #fff);
}
.negotiation-worksheet-quad h4 {
  margin: 0 0 8px;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted);
}
.negotiation-worksheet-quad .source-row {
  font-size: 13px;
}
@media (max-width: 900px) {
  .desking-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .desking-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .negotiation-worksheet-grid { grid-template-columns: 1fr; }
}

.dispatch-hint {
  font-size: 13px; color: var(--muted); margin-bottom: 14px;
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
}
.dispatch-columns {
  display: grid; grid-auto-flow: column; grid-auto-columns: minmax(220px, 1fr);
  gap: 12px; overflow-x: auto; padding-bottom: 8px;
}
.dispatch-col {
  background: var(--surface-2, rgba(0,0,0,.02)); border: 1px solid var(--border);
  border-radius: 12px; padding: 10px; display: flex; flex-direction: column; min-height: 200px; min-width: 220px;
}
.dispatch-col.drop-active,
.dispatch-tech-col.drop-active,
.dispatch-col.dispatch-queue.drop-active {
  background: rgba(0,180,166,.12);
  outline: 2px dashed var(--porter-teal);
  outline-offset: -2px;
}
.dispatch-col.drop-denied,
.dispatch-tech-col.drop-denied,
.dispatch-col.dispatch-queue.drop-denied {
  background: rgba(239,68,68,.08);
  outline: 2px dashed var(--red, #ef4444);
  outline-offset: -2px;
}
.dispatch-tech-col { cursor: default; }
.dispatch-ro-card { border-left-color: var(--porter-teal, #00b4a6); min-height: 72px; }
.dispatch-queue-section { display: flex; flex-direction: column; gap: 8px; margin-bottom: 10px; }
.dispatch-queue-label { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); display: flex; justify-content: space-between; gap: 8px; }
.dispatch-location-note { margin: 0 0 10px; padding: 8px 10px; border-radius: 8px; background: rgba(245,158,11,.08); border: 1px solid rgba(245,158,11,.25); }
.dispatch-empty-tech { min-width: 280px; background: rgba(239,68,68,.04); border-color: rgba(239,68,68,.2); }
.dispatch-col.dispatch-queue { background: rgba(0,180,166,.06); border-color: rgba(0,180,166,.3); }
.dispatch-col-head { display: flex; justify-content: space-between; align-items: center; font-size: 14px; }
.dispatch-col-sub { color: var(--muted); font-size: 11px; margin: 2px 0 6px; }
.dispatch-col-body { display: flex; flex-direction: column; gap: 8px; flex: 1; min-height: 60px; border-radius: 8px; padding: 4px; transition: background .15s ease; }
.dispatch-col-body.drop-active { background: rgba(0,180,166,.16); outline: 2px dashed var(--porter-teal); }
.dispatch-empty { color: var(--muted); font-size: 12px; text-align: center; padding: 16px 4px; margin: 0; }
.dispatch-card {
  background: var(--surface, #fff); border: 1px solid var(--border); border-left: 4px solid var(--blue, #3b82f6);
  border-radius: 8px; padding: 8px 10px; cursor: grab; display: flex; flex-direction: column; gap: 2px;
  box-shadow: 0 1px 2px rgba(0,0,0,.05);
}
.dispatch-card:active { cursor: grabbing; }
.dispatch-card.dragging { opacity: .45; }
.dispatch-card.wip { border-left-color: var(--gold, #f59e0b); }
.dispatch-card.done { border-left-color: var(--green, #16a34a); }
.dispatch-card.waiting { border-left-color: var(--blue, #3b82f6); }
.dispatch-card small { color: var(--muted); font-size: 11px; }
.dispatch-card-head { display: flex; justify-content: space-between; align-items: center; }
.dispatch-line-card .line-badge { font-size: 10px; padding: 2px 6px; }
.dispatch-line-card .dispatch-line-edit { margin-top: 6px; align-self: flex-start; }
.dispatch-card.no-drag { cursor: default; opacity: .72; }
.dispatch-ro-card[draggable="true"],
.dispatch-line-card[draggable="true"] {
  touch-action: none;
}
.dispatch-board-wrap .dispatch-columns { min-height: 220px; }
.dispatch-prefs-panel { margin-bottom: 12px; }
.dispatch-prefs-panel.collapsed .dispatch-prefs-head { border-bottom: none; }
.dispatch-prefs-panel.expanded .dispatch-prefs-head { border-bottom: 1px solid var(--border); padding-bottom: 10px; margin-bottom: 4px; }
.dispatch-prefs-head {
  display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; flex-wrap: wrap;
}
.dispatch-prefs-head-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.dispatch-prefs-summary {
  display: flex; flex-wrap: wrap; gap: 6px; padding: 8px 16px 12px;
}
.dispatch-prefs-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px 18px;
  max-width: 920px;
}
.dispatch-prefs-grid label { display: flex; flex-direction: column; gap: 6px; font-size: 13px; }
.dispatch-prefs-grid .check-row { flex-direction: row; align-items: center; gap: 8px; }
.dispatch-queue-filters {
  display: grid; grid-template-columns: 1fr auto; gap: 6px; align-items: center;
}
.dispatch-queue-filters input[type="search"] {
  width: 100%; font-size: 12px; padding: 6px 8px;
}
.dispatch-queue-filters select { font-size: 12px; min-width: 140px; }
.dispatch-queue-scroll {
  max-height: min(68vh, 720px); overflow-y: auto; padding-right: 4px;
}
.dispatch-queue-count { font-size: 10px; color: var(--muted); white-space: nowrap; }
.dispatch-show-more { font-size: 10px; padding: 0; margin-left: 4px; }
.dispatch-summary-strip {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-bottom: 14px;
}
.dispatch-summary-strip .kpi { padding: 10px 12px; border-radius: 10px; background: var(--surface-2, rgba(0,0,0,.03)); border: 1px solid var(--border); }
.dispatch-summary-strip .kpi-value { font-size: 1.35rem; }
@media (max-width: 760px) {
  .dispatch-prefs-grid { grid-template-columns: 1fr; }
  .dispatch-queue-filters { grid-template-columns: 1fr; }
  .dispatch-summary-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.search-sidebar,
.parts-search-wrap,
.sublet-vendor-search-wrap { position: relative; }

.sublet-vendor-search-wrap input[type="text"] {
  width: 100%;
  min-width: 220px;
}
.ro-opcode-search-wrap,
.ro-part-search-wrap {
  position: relative;
  flex: 1 1 220px;
  min-width: 200px;
}
.ro-opcode-search-wrap .ro-opcode-search-input,
.ro-part-search-wrap .ro-part-search-input {
  width: 100%;
}

.search-typeahead {
  position: absolute; top: calc(100% + 4px); left: 0; right: 0; z-index: 60;
  background: var(--surface, #fff); border: 1px solid var(--border); border-radius: 10px;
  box-shadow: 0 12px 30px rgba(0,0,0,.18); padding: 6px; max-height: 360px; overflow: auto;
}
.search-typeahead .ta-group { font-size: 10px; text-transform: uppercase; letter-spacing: .4px; color: var(--muted); padding: 6px 8px 2px; }
.search-typeahead .ta-item { display: flex; justify-content: space-between; align-items: center; gap: 8px; width: 100%; border: none; background: transparent; text-align: left; padding: 7px 8px; border-radius: 7px; cursor: pointer; color: var(--ink); font-size: 13px; }
.search-typeahead .ta-item:hover { background: var(--surface-2, rgba(0,0,0,.06)); }
.search-typeahead .ta-item small { color: var(--muted); font-size: 11px; }
.search-typeahead .ta-empty { padding: 8px; font-size: 12px; color: var(--muted); }
.search-typeahead .ta-actions { display: flex; gap: 6px; flex-wrap: wrap; border-top: 1px solid var(--border); margin-top: 6px; padding-top: 8px; }
.search-typeahead .ta-create { border: 1px solid var(--border); background: transparent; border-radius: 7px; padding: 5px 9px; font-size: 12px; font-weight: 600; cursor: pointer; color: var(--ink); }
.search-typeahead .ta-create:hover { background: var(--surface-2, rgba(0,0,0,.06)); }
.search-typeahead .ta-hint {
  padding: 6px 8px 2px;
  font-size: 11px;
  color: var(--muted);
}
.search-typeahead .ta-party-block {
  border-bottom: 1px solid var(--line);
  padding-bottom: 4px;
  margin-bottom: 4px;
}
.search-typeahead .ta-party-block:last-of-type { border-bottom: none; }
.search-party-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 4px 8px 8px;
}
.search-party-btn,
.search-create-actions .link-button {
  border: 1px solid var(--line);
  background: var(--panel);
  border-radius: 6px;
  padding: 4px 8px;
  font-size: 11px;
  font-weight: 600;
  cursor: pointer;
  color: var(--ink);
}
.search-party-btn:hover,
.search-create-actions .link-button:hover {
  border-color: var(--porter-teal);
  background: #F0FDFB;
}
.search-party-card {
  border: 1px solid var(--line);
  border-radius: 10px;
  margin-bottom: 8px;
  overflow: hidden;
}
.search-party-card .search-result-item {
  margin-bottom: 0;
  border: none;
  border-radius: 0;
}
.search-party-card .search-result-item .badge {
  flex: 0 0 auto;
}
.search-party-card .search-party-actions {
  background: var(--surface-2, #f8fafc);
  border-top: 1px solid var(--line);
}
.search-create-panel {
  margin-top: 14px;
  padding: 14px;
  border: 1px dashed var(--line);
  border-radius: 10px;
  background: var(--surface-2, #f8fafc);
}
.search-create-panel strong {
  display: block;
  font-size: 13px;
  margin-bottom: 4px;
}
.search-create-actions {
  margin-top: 10px;
}
.search-quick-create-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 10px;
  margin-bottom: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-2, #f8fafc);
}
.search-quick-create-bar__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.search-quick-create-bar__hint {
  font-size: 11px;
  flex: 1 1 180px;
}
.search-quick-create-btn {
  padding: 3px 8px;
  font-size: 11px;
}
body.ipad-mode .search-party-btn,
body.ipad-mode .search-result-item,
body.ipad-mode .search-best-match__main,
body.ipad-mode .search-create-actions .link-button,
body.ipad-mode .search-create-actions .ta-create,
body.ipad-mode .opportunity-actions button {
  min-height: 44px;
}
.ro-inline-part-search {
  flex: 1 1 220px;
  min-width: 180px;
}
.ro-part-add.line-part-editor {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: flex-end;
}
.ro-line-part-add-compact {
  display: grid;
  grid-template-columns: minmax(160px, 2.2fr) 72px minmax(92px, 1fr) minmax(92px, 1fr) auto;
  gap: 8px;
  align-items: end;
  width: 100%;
}
.ro-line-part-add-compact:not([data-can-view-cost="1"]) {
  grid-template-columns: minmax(160px, 2.2fr) 72px minmax(92px, 1fr) auto;
}
.ro-line-part-add-compact .field-label {
  display: block;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--muted, #64748b);
  margin-bottom: 4px;
}
.ro-line-part-add-compact .ro-line-part-code-hint {
  font-weight: 500;
  text-transform: none;
  letter-spacing: 0;
  color: var(--accent, #2563eb);
}
.ro-line-part-add-compact input {
  width: 100%;
  min-width: 0;
}
.ro-line-part-add-compact .ro-line-part-add-hint {
  grid-column: 1 / -1;
  margin: 0;
}
.ro-line-part-add-compact .ro-part-search-wrap {
  min-width: 0;
}

.search-party-actions.inline-actions {
  padding: 0;
  margin: 0;
}
.search-typeahead .search-quick-create-bar {
  margin: 0 0 6px;
  border-radius: 0;
  border-left: none;
  border-right: none;
  border-top: none;
}
.search-best-match {
  margin: 0 0 10px;
  padding: 8px 10px;
  border: 1px solid var(--accent, #2563eb);
  border-radius: 8px;
  background: color-mix(in srgb, var(--accent, #2563eb) 8%, var(--surface, #fff));
}
.search-best-match__eyebrow {
  display: block;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--accent, #2563eb);
  margin-bottom: 6px;
}
.search-best-match__main {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  padding: 8px 10px 6px;
  border: none;
  border-bottom: 1px solid var(--line);
  background: transparent;
  text-align: left;
  cursor: pointer;
}
.search-best-match__main strong {
  font-size: 14px;
  line-height: 1.2;
}
.search-best-match__main small {
  font-size: 11px;
  color: var(--muted, #64748b);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}
.search-best-match__actions,
.search-best-match .search-party-actions {
  width: 100%;
  padding: 8px 10px;
  background: var(--surface-2, #f8fafc);
}
.search-best-match .search-party-actions.inline-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}
.search-best-match__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}
.search-typeahead .search-best-match {
  margin: 0 0 6px;
  border-radius: 0;
  border-left: none;
  border-right: none;
}
.login-codes-cell {
  white-space: nowrap;
}
.login-code-chip {
  margin: 0 4px 4px 0;
  font-weight: 700;
  letter-spacing: 0.04em;
}
.login-code-pill {
  display: inline-block;
  min-width: 2.5em;
  padding: 2px 8px;
  margin-right: 6px;
  border-radius: 6px;
  background: color-mix(in srgb, var(--accent, #2563eb) 12%, var(--surface, #fff));
  color: var(--accent, #2563eb);
  font-size: 12px;
  letter-spacing: 0.06em;
  text-align: center;
}

/* Collapsible control panels */
.collapsible-panel.collapsed .collapsible-panel-head { border-bottom: none; }
.collapsible-panel.expanded .collapsible-panel-head {
  border-bottom: 1px solid var(--border, var(--line));
  padding-bottom: 10px;
  margin-bottom: 4px;
}
.collapsible-panel-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  flex-wrap: wrap;
}
.collapsible-panel-head-main h2 { margin: 0 0 2px; }
.collapsible-panel-head-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.collapsible-panel-summary {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  padding: 8px 16px 12px;
}

.system-trigger-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 10px 16px;
  padding: 12px 16px 16px;
}
.system-trigger-row {
  align-items: flex-start;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid var(--border, var(--line));
  border-radius: 8px;
  background: var(--surface-2, rgba(0,0,0,.02));
}
.system-trigger-row strong { display: block; font-size: 12px; margin-bottom: 2px; }
.system-trigger-row small { display: block; line-height: 1.35; }

/* Super User tooltips — System module (light purple) */
.system-su-tooltip {
  position: relative;
  display: inline-flex;
  vertical-align: middle;
  margin-left: 5px;
  flex-shrink: 0;
}
.system-su-tooltip-mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 17px;
  height: 17px;
  border-radius: 50%;
  font-size: 10px;
  font-weight: 700;
  line-height: 1;
  color: #6d28d9;
  background: #ede9fe;
  border: 1px solid #c4b5fd;
  cursor: help;
}
.system-su-tooltip-body {
  display: none;
  position: absolute;
  z-index: 60;
  left: 0;
  top: calc(100% + 6px);
  min-width: 240px;
  max-width: 340px;
  padding: 9px 11px;
  border-radius: 8px;
  font-size: 11.5px;
  font-weight: 500;
  line-height: 1.45;
  color: #4c1d95;
  background: #f5f3ff;
  border: 1px solid #ddd6fe;
  box-shadow: 0 6px 16px rgba(109, 40, 217, 0.14);
  text-align: left;
  white-space: normal;
  text-transform: none;
  letter-spacing: normal;
}
.system-su-tooltip:hover .system-su-tooltip-body,
.system-su-tooltip:focus-within .system-su-tooltip-body {
  display: block;
}
.check-row .system-su-tooltip {
  margin-top: 1px;
}
.system-tab-with-tip {
  display: inline-flex;
  align-items: center;
  gap: 2px;
}
.system-tab-nav .accounting-tab-group-label {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.system-tab-nav,
.system-tab-groups,
.system-tab-nav .panel-body {
  overflow: visible;
}
.config-toggle {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  flex-wrap: wrap;
}
.config-field .system-su-tooltip {
  margin-left: 4px;
}
#system .panel > header,
.system-tab-nav > header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 8px;
}
.collapsible-panel .panel-intro { padding: 0 0 12px; margin: 0; }
.collapsible-panel.expanded .panel-body.collapsible-panel-body { padding-top: 12px; }
.menu-table td, .menu-table th { vertical-align: middle; }
.menu-table .num-input { max-width: 90px; }
.menu-table .menu-profit { font-weight: 700; color: var(--green, #0b7a6e); }
.seg-filter { display: inline-flex; gap: 2px; background: var(--surface-2, rgba(0,0,0,.05)); border-radius: 8px; padding: 2px; }
.seg-btn { border: none; background: transparent; padding: 4px 9px; font-size: 11px; font-weight: 600; border-radius: 6px; cursor: pointer; color: var(--muted); }
.seg-btn.active { background: var(--surface, #fff); color: var(--ink); box-shadow: 0 1px 2px rgba(0,0,0,.12); }
.seg-btn .seg-count { opacity: .65; font-weight: 700; margin-left: 2px; }
.ro-reopened-banner {
  background: rgba(220, 38, 38, .12); color: #b91c1c; border: 1px solid rgba(220,38,38,.35);
  border-radius: 8px; padding: 8px 12px; margin: 0 0 12px; font-size: 12px; font-weight: 600;
}
.ro-recovered-banner {
  background: rgba(217, 119, 6, .12); color: #b45309; border: 1px solid rgba(217,119,6,.35);
  border-radius: 8px; padding: 8px 12px; margin: 0 0 12px; font-size: 12px; font-weight: 600;
}
.report-export-card {
  border: 1px solid var(--border); border-radius: 10px; padding: 12px;
  display: flex; flex-direction: column; gap: 8px; background: var(--surface-2, rgba(0,0,0,.02));
}
.report-export-card strong { font-size: 13px; letter-spacing: .03em; }
.report-export-actions { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.report-export-card { position: relative; }
.report-catalog-highlight {
  outline: 2px solid var(--gold, #d97706);
  box-shadow: 0 0 0 3px rgba(217, 119, 6, .18);
}
.report-fav-toggle {
  position: absolute; top: 8px; right: 8px; border: none; background: none; cursor: pointer;
  font-size: 18px; line-height: 1; color: var(--muted, #94a3b8); padding: 2px; border-radius: 6px;
}
.report-fav-toggle:hover { color: #f59e0b; background: rgba(245,158,11,.12); }
.report-fav-toggle.active { color: #f59e0b; }
.favorite-report-row { display: flex; flex-wrap: wrap; gap: 8px; padding: 12px 16px; }
.favorite-report-chip {
  display: inline-flex; flex-direction: column; align-items: flex-start; gap: 2px;
  border: 1px solid var(--border); border-radius: 10px; padding: 8px 12px; cursor: pointer;
  background: var(--surface-2, rgba(0,0,0,.02)); font-weight: 600; font-size: 12px; text-align: left;
}
.favorite-report-chip:hover { border-color: var(--porter-teal); background: rgba(13,148,136,.08); }
.favorite-report-chip small { font-weight: 500; color: var(--muted, #94a3b8); }
.catalog-pager { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 16px 12px; flex-wrap: wrap; }
.report-run-form fieldset.report-run-fieldset { border: 1px solid var(--border); border-radius: 10px; padding: 12px 14px; margin: 0 0 12px; }
.report-run-form legend { font-size: 12px; font-weight: 700; padding: 0 6px; color: var(--muted); }
.report-run-date-modes { display: flex; flex-wrap: wrap; gap: 12px 18px; margin-bottom: 10px; }
.report-run-date-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.report-run-field-actions { display: flex; gap: 10px; margin-bottom: 8px; flex-wrap: wrap; }
.report-run-field-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 6px 12px; max-height: 220px; overflow: auto; padding-right: 4px; }
.report-run-form .hidden { display: none !important; }
.report-output-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 14px 0 10px; flex-wrap: wrap; }
.report-output-actions { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.report-preview-table { width: 100%; border-collapse: collapse; }
.report-preview-table th, .report-preview-table td { border: 1px solid var(--border); padding: 6px 8px; font-size: 12px; vertical-align: top; }
.report-preview-table th { background: var(--panel-alt, #f1f5f9); font-weight: 700; }
.report-preview-table td.num, .report-preview-table th.num { text-align: right; white-space: nowrap; }
.report-preview-table tfoot .report-total-row td { font-weight: 700; background: #f3f3f3; }
.report-totals-summary { margin-top: 8px; }
.recon-readout { border: 1px solid var(--border); border-radius: 10px; padding: 6px 12px; }
tr.bank-cleared { background: rgba(22,163,74,.06); }
.close-progress-bar { width: 160px; height: 8px; background: var(--border); border-radius: 6px; overflow: hidden; }
.close-progress-bar span { display: block; height: 100%; background: var(--porter-teal); transition: width .3s ease; }

.oem-toolbar { align-items: flex-end; gap: 12px; flex-wrap: wrap; }
.oem-control { display: flex; flex-direction: column; gap: 4px; font-size: 12px; font-weight: 600; color: var(--muted); }
.oem-control select { min-width: 200px; }
.oem-gl-panel header { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.oem-gl-status { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.oem-gl-safety-banner {
  display: flex; flex-direction: column; gap: 4px;
  margin: 0 16px 12px; padding: 12px 14px;
  border: 1px solid rgba(14, 116, 144, .25); border-radius: 10px;
  background: rgba(14, 116, 144, .06); font-size: 13px;
}
.oem-gl-safety-banner strong { color: var(--porter-teal); }
.oem-gl-safety-note {
  margin: 0 0 12px; padding: 10px 12px; border-radius: 8px; border: 1px solid var(--border);
  background: var(--surface-2, rgba(0,0,0,.02)); font-size: 13px;
}
.oem-gl-safety-note.ok { border-color: rgba(22,163,74,.25); background: rgba(22,163,74,.05); }
.oem-gl-safety-note.warn { border-color: rgba(217,119,6,.35); background: rgba(217,119,6,.06); }
.oem-gl-safety-note.error { border-color: rgba(220,38,38,.35); background: rgba(220,38,38,.05); }
.oem-gl-validation-list { margin: 8px 0 0 18px; padding: 0; }
.oem-gl-mfr-cell .oem-gl-mfr-head { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; }
.oem-gl-mfr-cell strong { display: block; }
.oem-gl-edit.oem-gl-field-error { border-color: #dc2626; box-shadow: 0 0 0 1px rgba(220,38,38,.15); }
.oem-gl-edit.oem-gl-field-warn { border-color: #d97706; box-shadow: 0 0 0 1px rgba(217,119,6,.15); }
.oem-gl-typed-confirm { display: flex; flex-direction: column; gap: 6px; width: 100%; margin-bottom: 12px; text-align: left; }
.oem-gl-typed-confirm input { width: 100%; }
.oem-gl-remove-preview p { margin: 0 0 6px; }
.text-amber { color: #d97706; }
.oem-statement-meta { display: flex; gap: 8px; flex-wrap: wrap; margin: 4px 0 16px; }
td.num, th.num { text-align: right; font-variant-numeric: tabular-nums; }
.oem-edit { width: 100%; }
.num-input { text-align: right; }
.ratio-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; padding: 14px; }
.ratio-card {
  display: flex; justify-content: space-between; align-items: center;
  padding: 12px 14px; border: 1px solid var(--border); border-radius: 10px;
  background: var(--surface-2, rgba(0,0,0,.02));
}
.ratio-card span { font-size: 13px; color: var(--muted); }
.ratio-card strong { font-size: 16px; font-variant-numeric: tabular-nums; }
@media (max-width: 900px) { .ratio-grid { grid-template-columns: 1fr; } }

@media print {
  .subtabs, .oem-toolbar, .app-sidebar, .topbar, .module-header button, [data-oem-print], [data-oem-export-all] { display: none !important; }
}

/* ─────────────────────────────────────────────────────────────────────────────
   RESPONSIVE
───────────────────────────────────────────────────────────────────────────── */
@media (max-width: 1200px) {
  .kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pipeline { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 1320px) {
  .messages-topbar-btn > span:not(.messages-badge) {
    display: none;
  }

  .company-switcher .company-gate-launcher {
    max-width: 7.5rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .topbar-right .dealer-badges {
    display: none;
  }
}

@media (max-width: 1080px) {
  .shell { grid-template-columns: 1fr; }
  .sidebar { position: static; height: auto; }
  nav { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 4px; }
  .grid-2 { grid-template-columns: 1fr; }
  .grid-2-even { grid-template-columns: 1fr; }
  .deal-modal-body { grid-template-columns: 1fr; }
  .deal-modal-main,
  .deal-modal-sidebar { grid-column: 1 / -1; }
  .deal-modal-main { border-right: 0; border-bottom: 1px solid var(--line); }
}

@media (max-width: 720px) {
  main { padding: 14px; }
  .kpis { grid-template-columns: 1fr 1fr; }
  .grid-3 { grid-template-columns: 1fr; }
  .pipeline { grid-template-columns: 1fr; }
  .split-list { grid-template-columns: 1fr; }
  .topbar { flex-direction: column; align-items: stretch; }
  .topbar-right { justify-content: flex-start; }
  .facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .form-grid { grid-template-columns: 1fr; }
  .company-config-grid { grid-template-columns: 1fr; }
  .numbering-row { grid-template-columns: 1fr; }
  .notif-drawer { width: 100%; }
  nav { grid-template-columns: repeat(3, minmax(0, 1fr)); }

  table { min-width: 760px; }
}

@media (max-width: 480px) {
  .kpis { grid-template-columns: 1fr; }
  .facts { grid-template-columns: 1fr; }
  nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ── Enhanced ENVISION DMS screens ───────────────────────────────────────── */
.fallback-chart {
  height: 232px;
  display: grid;
  grid-template-columns: repeat(6, minmax(28px, 1fr));
  gap: 12px;
  align-items: end;
  padding: 10px 2px 0;
}

.fallback-col {
  min-width: 0;
  display: grid;
  gap: 8px;
  justify-items: center;
  height: 100%;
}

.fallback-bars {
  height: 190px;
  width: 100%;
  display: flex;
  align-items: end;
  justify-content: center;
  gap: 4px;
  padding: 0 3px;
  border-bottom: 1px solid var(--line);
}

.fallback-bar {
  width: 12px;
  min-height: 4px;
  border-radius: 7px 7px 0 0;
  background: var(--porter-teal);
  box-shadow: 0 6px 14px rgba(0, 180, 166, .2);
}

.fallback-bar.b1 { background: var(--porter-gold); }
.fallback-bar.b2 { background: var(--blue); }
.fallback-col small { color: var(--muted); font-weight: 700; }

.source-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 0;
  border-bottom: 1px solid var(--line);
  font-size: 13px;
}

.source-row:last-child { border-bottom: 0; }

.score-ring {
  width: 38px;
  height: 38px;
  display: inline-grid;
  place-items: center;
  border-radius: 50%;
  background: var(--blue-soft);
  color: var(--blue);
  font-weight: 900;
  box-shadow: inset 0 0 0 4px rgba(37, 99, 235, .14);
}

.score-ring.hot {
  background: var(--green-soft);
  color: var(--green);
  box-shadow: inset 0 0 0 4px rgba(5, 150, 105, .16);
}

.integration-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  padding: 16px 18px;
}

.integration-catalog-section {
  margin-bottom: 18px;
}

.integration-catalog-section h3 {
  margin: 0 0 10px;
  font-size: 14px;
  color: var(--ink);
}

.integration-catalog-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.integration-catalog-card {
  border: 1px solid rgba(132, 166, 190, .55);
  border-radius: 12px;
  background: linear-gradient(180deg, rgba(255,255,255,.96), rgba(246,251,255,.94));
  padding: 14px;
}

.integration-catalog-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.integration-catalog-head strong {
  display: block;
  font-size: 14px;
}

.integration-catalog-head span,
.integration-catalog-head small {
  display: block;
  color: var(--muted);
  font-size: 12px;
  margin-top: 2px;
}

.integration-catalog-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-top: 10px;
}

.integration-catalog-toggle {
  margin: 0;
}

.integration-catalog-config {
  display: grid;
  gap: 8px;
  margin-top: 10px;
}

.integration-catalog-config label {
  display: grid;
  gap: 4px;
  font-size: 12px;
}

.integration-setup-wizard .integration-catalog-config {
  margin-top: 12px;
}

@media (max-width: 960px) {
  .integration-catalog-grid { grid-template-columns: 1fr; }
}

.integration-card {
  border: 1px solid rgba(132, 166, 190, .55);
  border-radius: 12px;
  background: linear-gradient(180deg, rgba(255,255,255,.96), rgba(246,251,255,.94));
  padding: 15px;
  box-shadow: 0 10px 28px rgba(35, 89, 133, .08);
}

.integration-head,
.integration-actions {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.integration-head strong {
  display: block;
  font-size: 15px;
}

.integration-head span:not(.badge),
.integration-actions small {
  display: block;
  color: var(--muted);
  font-size: 12px;
  margin-top: 2px;
}

.health-meter {
  height: 8px;
  border-radius: 999px;
  background: #dbeafe;
  overflow: hidden;
  margin: 14px 0;
}

.health-meter span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--porter-teal), var(--blue));
}

.integration-meta {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 12px;
}

.integration-meta span {
  color: var(--muted);
  font-size: 11.5px;
}

.integration-meta strong {
  display: block;
  color: var(--ink);
  font-size: 12px;
  margin-top: 1px;
}

.scope-list {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin-bottom: 14px;
}

.scope-list span {
  padding: 4px 8px;
  border-radius: 999px;
  background: #eaf4fc;
  color: #2b5f87;
  font-size: 11px;
  font-weight: 800;
}

.inline-edit-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  align-items: end;
}

.inline-edit-grid label {
  display: grid;
  gap: 5px;
  min-width: 0;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.inline-edit-grid .ro-opcode-search-wrap {
  flex: unset;
  width: 100%;
  min-width: 0;
}

.inline-edit-grid select,
.inline-edit-grid textarea,
.ro-part-add select,
.ro-part-add input {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 8px 9px;
  background: #fff;
  color: var(--ink);
}

.autosave-indicator {
  align-self: center;
  color: var(--green);
  font-size: 12px;
  font-weight: 800;
}

.ro-part-add {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 140px), 1fr));
  gap: 8px;
  align-items: center;
  margin-top: 10px;
}

.ro-part-add.ro-add-line-row {
  grid-template-columns: minmax(200px, 1.4fr) minmax(180px, .95fr) minmax(200px, 1.5fr) auto;
  align-items: start;
}

.ro-part-add.ro-add-line-row .ro-opcode-search-wrap,
.ro-part-add.ro-add-line-row .ro-part-search-wrap {
  flex: unset;
  width: 100%;
  min-width: 0;
}

.ro-part-add.ro-add-line-row select[data-ro-acctcode] {
  width: 100%;
  min-width: 0;
}

.ro-part-add.line-sublet-editor {
  grid-template-columns: minmax(200px, 1.5fr) minmax(160px, 1.2fr) 100px 100px auto;
}

.parts-kit-picker {
  grid-template-columns: minmax(180px, 1.4fr) 72px auto;
  padding: 10px 12px;
  border: 1px dashed var(--line);
  border-radius: 10px;
  background: color-mix(in srgb, var(--panel) 92%, var(--accent) 8%);
}

.parts-kit-picker label.meta {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin: 0;
}

.parts-kit-hint {
  margin: 8px 0 0;
}

.parts-kit-picker-wrap {
  margin-top: 10px;
}

.parts-kit-picker-preview {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  align-items: center;
  margin-top: 8px;
  padding: 8px 12px;
  border-radius: 8px;
  background: color-mix(in srgb, var(--panel) 90%, var(--accent) 10%);
  font-size: 12px;
}

.parts-kit-picker-preview strong {
  color: var(--accent);
}

.parts-kit-picker-preview small {
  flex: 1 1 100%;
  color: var(--muted);
}

.parts-kit-suggest-panel {
  margin: 0 0 14px;
  padding: 14px 16px 16px;
  border: 1px solid color-mix(in srgb, var(--gold) 40%, var(--line));
  border-radius: 14px;
  background: linear-gradient(135deg, color-mix(in srgb, #fff 82%, #f5c842 18%), color-mix(in srgb, #fff 94%, var(--accent) 6%));
  box-shadow: 0 8px 24px rgba(15, 25, 35, 0.06);
}

.parts-kit-suggest-panel.is-posting {
  opacity: 0.72;
}

.parts-kit-workflow-ribbon {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 12px;
}

.parts-kit-workflow-step {
  display: inline-flex;
  align-items: center;
  padding: 4px 10px;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--gold) 30%, var(--line));
  background: rgba(255, 255, 255, 0.65);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: #64748b;
}

.parts-kit-workflow-step.active {
  border-color: color-mix(in srgb, var(--gold) 55%, var(--line));
  background: #fff;
  color: #92400e;
}

.parts-kit-suggest-side {
  display: grid;
  gap: 10px;
  align-content: start;
}

.parts-kit-suggest-controls {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 14px;
  align-items: flex-end;
}

.parts-kit-suggest-cta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.parts-kit-post-primary {
  min-width: 200px;
  font-weight: 800;
}

.parts-kit-suggest-hint {
  flex: 1 1 100%;
  margin: 0;
  font-size: 12px;
}

.parts-kit-suggest-panel.empty {
  border-style: dashed;
  background: var(--panel);
}

.parts-kit-suggest-empty {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 16px;
}

.parts-kit-suggest-head {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 10px 16px;
  align-items: flex-start;
}

.parts-kit-suggest-title {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.parts-kit-suggest-title strong {
  font-size: 1.05rem;
}

.parts-kit-suggest-title small {
  color: var(--muted);
}

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

.parts-kit-suggest-desc {
  margin: 8px 0 0;
}

.parts-kit-suggest-body {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(200px, 0.75fr);
  gap: 14px 20px;
  margin-top: 12px;
  align-items: start;
}

.parts-kit-suggest-label {
  display: block;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 6px;
}

.parts-kit-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.parts-kit-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 8px;
  border-radius: 999px;
  font-size: 12px;
  border: 1px solid var(--line);
  background: var(--panel);
}

.parts-kit-chip.ok {
  border-color: color-mix(in srgb, #2d8f4e 40%, var(--line));
  background: color-mix(in srgb, #2d8f4e 8%, var(--panel));
}

.parts-kit-chip.low {
  border-color: color-mix(in srgb, #c98a12 45%, var(--line));
  background: color-mix(in srgb, #c98a12 10%, var(--panel));
}

.parts-kit-chip.out,
.parts-kit-chip.missing {
  border-color: color-mix(in srgb, #c0392b 40%, var(--line));
  background: color-mix(in srgb, #c0392b 8%, var(--panel));
}

.parts-kit-chip.labor {
  border-color: color-mix(in srgb, var(--accent) 35%, var(--line));
  background: color-mix(in srgb, var(--accent) 8%, var(--panel));
}

.parts-kit-chip-sku {
  font-weight: 600;
}

.parts-kit-chip-qty {
  color: var(--muted);
}

.parts-kit-chip-oh {
  font-size: 11px;
  color: var(--muted);
}

.parts-kit-chip-oh.warn {
  color: #c0392b;
}

.parts-kit-labor-pill {
  display: inline-block;
  padding: 6px 10px;
  border-radius: 8px;
  background: color-mix(in srgb, var(--accent) 10%, var(--panel));
  border: 1px solid color-mix(in srgb, var(--accent) 25%, var(--line));
  font-size: 13px;
}

.parts-kit-suggest-totals {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 140px;
}

.parts-kit-suggest-total {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  font-size: 13px;
}

.parts-kit-suggest-total span {
  color: var(--muted);
}

.parts-kit-suggest-total.accent strong {
  color: var(--accent);
  font-size: 1.05rem;
}

.parts-kit-suggest-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 16px;
  align-items: flex-end;
  justify-content: space-between;
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid color-mix(in srgb, var(--line) 80%, transparent);
}

.parts-kit-suggest-qty input,
.parts-kit-suggest-pick select {
  margin-left: 6px;
}

.parts-kit-suggest-qty input {
  width: 72px;
}

.parts-kit-suggest-pick select {
  width: min(280px, 100%);
}

.parts-kit-breakdown-row td {
  background: color-mix(in srgb, var(--panel) 94%, var(--gold) 6%) !important;
  padding: 8px 12px 12px !important;
}

.parts-kit-breakdown {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.parts-invoice-committed-row.kit-line td {
  background: color-mix(in srgb, var(--panel) 92%, var(--gold) 8%);
}

.parts-invoice-committed-row.just-posted td {
  animation: parts-line-posted-flash 1.6s ease;
}

@keyframes parts-line-posted-flash {
  0%, 100% { background: inherit; }
  18% { background: color-mix(in srgb, #2d8f4e 22%, var(--panel)); }
  45% { background: color-mix(in srgb, #2d8f4e 10%, var(--panel)); }
}

.parts-kit-suggest-kbd {
  margin-left: auto;
}

.invoice-part-code.kit {
  font-weight: 700;
  color: color-mix(in srgb, var(--text) 70%, #9a7209);
}

.invoice-kit-stock {
  font-size: 12px;
}

@media (max-width: 900px) {
  .parts-kit-suggest-body {
    grid-template-columns: 1fr;
  }
  .parts-kit-suggest-actions {
    flex-direction: column;
    align-items: stretch;
  }
  .parts-kit-suggest-cta,
  .parts-kit-suggest-controls {
    width: 100%;
  }
  .parts-kit-post-primary {
    width: 100%;
  }
  .parts-kit-suggest-meta {
    align-items: flex-start;
  }
}

.customer-360-drawers { margin-top: 12px; display: grid; gap: 10px; }
.customer-drawer { border: 1px solid var(--border); border-radius: 10px; padding: 0 12px 12px; background: var(--panel-bg, rgba(255,255,255,.02)); }
.customer-drawer summary { cursor: pointer; padding: 12px 0; list-style: none; }
.customer-drawer summary::-webkit-details-marker { display: none; }
.crm-pm-stage summary { cursor: pointer; padding: 8px 0; }

.parts-kits-panel header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.parts-kits-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 12px;
}

.parts-kit-card {
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 14px;
  background: var(--panel);
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.parts-kit-card-head {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: flex-start;
}

.parts-kit-card-head strong {
  display: block;
  font-size: 15px;
}

.parts-kit-card-desc {
  margin: 0;
  line-height: 1.4;
}

.parts-kit-card-body {
  display: grid;
  gap: 8px;
}

.parts-kit-card-group .source-row.compact {
  padding: 4px 0;
}

.parts-kit-card-actions {
  display: flex;
  gap: 8px;
  margin-top: auto;
}

.parts-kits-empty {
  padding: 8px 0;
}

.parts-kit-editor {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.parts-kit-hero {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: flex-start;
  padding: 14px 16px;
  border-radius: 12px;
  background: linear-gradient(135deg, color-mix(in srgb, var(--accent) 12%, var(--panel)), var(--panel));
  border: 1px solid var(--line);
}

.parts-kit-hero h3 {
  margin: 6px 0 4px;
  font-size: 18px;
}

.parts-kit-hero-total {
  text-align: right;
  min-width: 120px;
}

.parts-kit-hero-total span {
  display: block;
  font-size: 11px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.parts-kit-hero-total strong {
  font-size: 22px;
  color: var(--accent);
}

.parts-kit-section {
  border: 1px solid var(--line);
  border-radius: 12px;
  overflow: hidden;
  background: var(--panel);
}

.parts-kit-section-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  border-bottom: 1px solid var(--line);
  background: color-mix(in srgb, var(--panel) 88%, var(--bg) 12%);
}

.parts-kit-section-head strong {
  display: block;
}

.parts-kit-rows {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.parts-kit-row {
  display: grid;
  grid-template-columns: minmax(180px, 1.4fr) 72px auto;
  gap: 10px;
  align-items: end;
  padding: 12px 14px;
  border-bottom: 1px solid var(--line);
}

.parts-kit-rows.labor .parts-kit-row {
  grid-template-columns: minmax(110px, 0.9fr) minmax(140px, 1.2fr) 72px 92px auto;
}

.parts-kit-row:last-child {
  border-bottom: none;
}

.parts-kit-row label {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 11px;
  color: var(--muted);
  margin: 0;
}

.parts-kit-row input,
.parts-kit-row select {
  font-size: 13px;
}

.parts-kit-row-hint {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.3;
}

.parts-kit-totals {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  padding: 12px 14px;
  border: 1px dashed var(--line);
  border-radius: 10px;
  background: color-mix(in srgb, var(--panel) 92%, var(--accent) 8%);
}

.parts-kit-total-chip {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 90px;
}

.parts-kit-total-chip span {
  font-size: 11px;
  color: var(--muted);
  text-transform: uppercase;
}

.parts-kit-total-chip strong {
  font-size: 16px;
}

.parts-kit-total-chip.accent strong {
  color: var(--accent);
}

.parts-kit-actions {
  justify-content: flex-end;
}

.parts-kit-actions .danger-text {
  margin-right: auto;
}

@media (max-width: 720px) {
  .parts-kit-row,
  .parts-kit-rows.labor .parts-kit-row {
    grid-template-columns: 1fr;
  }
  .parts-kit-hero {
    flex-direction: column;
  }
}

.perm-check {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  cursor: pointer;
}

.perm-check input {
  position: static;
  opacity: 1;
  pointer-events: auto;
  width: 16px;
  height: 16px;
  accent-color: var(--porter-teal);
}

.perm-check span {
  display: none;
}

.perm-check--deprecated {
  opacity: 0.45;
  cursor: not-allowed;
}

.perm-check--deprecated input {
  pointer-events: none;
}

.perm-check input:checked + span {
  border-color: var(--porter-teal);
  background: var(--porter-teal);
}

.perm-check input:checked + span::after {
  content: "✓";
  color: #fff;
  font-size: 12px;
  font-weight: 900;
}

.inv-new-lot-badge {
  font-size: 10px;
  padding: 2px 6px;
  vertical-align: middle;
  white-space: nowrap;
}

.login-gate {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  padding: clamp(16px, 4vw, 32px);
  background: linear-gradient(135deg, rgba(215,236,251,.94), rgba(237,246,252,.96));
  backdrop-filter: blur(12px);
}

.login-gate > .login-card {
  flex: 0 0 auto;
  margin: auto;
  max-height: none;
}

.login-gate > .login-card.company-gate {
  margin: clamp(8px, 2vh, 24px) auto;
}

.login-mode-tabs {
  display: flex;
  gap: 8px;
  margin-bottom: 12px;
  padding: 6px;
  border-radius: 10px;
  background: rgba(255,255,255,.72);
  border: 1px solid var(--line);
  box-shadow: var(--shadow-sm);
}

.login-mode-btn {
  flex: 1;
  min-height: 40px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--muted);
  font-weight: 700;
  cursor: pointer;
  transition: background var(--fast) var(--ease), color var(--fast) var(--ease);
}

.login-mode-btn.active {
  background: linear-gradient(135deg, var(--porter-teal), var(--porter-teal-2));
  color: #fff;
  box-shadow: 0 4px 14px rgba(0,180,166,.28);
}

.tech-portal-banner {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  padding: 12px 16px;
  margin-bottom: 14px;
  border: 1px solid rgba(0,180,166,.22);
  border-radius: 10px;
  background: linear-gradient(135deg, rgba(0,180,166,.08), rgba(37,99,235,.06));
}

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

.tech-ro-card {
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--panel);
  box-shadow: var(--shadow-sm);
  overflow: hidden;
}

.tech-ro-card.reopened {
  border-color: rgba(220,38,38,.35);
  box-shadow: 0 0 0 1px rgba(220,38,38,.12);
}

.tech-ro-head {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: flex-start;
  padding: 14px 16px 8px;
  border-bottom: 1px solid var(--line);
}

.tech-line-list {
  display: grid;
  gap: 8px;
  padding: 10px 12px;
}

tr.ro-part-pending-approval td,
.ro-part-pending-approval td {
  color: var(--muted);
  background: rgba(120, 120, 120, 0.1);
  opacity: 0.88;
}

.tech-line-modal .tech-line-switcher {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 10px;
}

.tech-line-modal .tech-line-chip.active {
  border-color: var(--blue);
  background: var(--blue-soft);
}

.tech-line-modal-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 12px;
}

.tech-line-row {
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255,255,255,.55);
  cursor: pointer;
  transition: border-color var(--fast) var(--ease), box-shadow var(--fast) var(--ease);
}

.tech-line-row:hover {
  border-color: rgba(0,180,166,.45);
  box-shadow: var(--shadow-sm);
}

.tech-line-main {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 4px;
}

.tech-line-actions {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin-top: 8px;
}

.tech-ro-foot {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  padding: 10px 12px 12px;
  border-top: 1px solid var(--line);
}

.forms-toolbar {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
}

.forms-picker-list {
  display: grid;
  gap: 8px;
  max-height: 420px;
  overflow: auto;
}

.forms-picker-row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255,255,255,.6);
}

.fi-workbench-modal .modal { max-width: 1480px; }
.fi-workbench-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 240px;
  gap: 16px;
  align-items: start;
}
.fi-workbench-main { min-width: 0; }
.fi-queue-panel {
  position: sticky;
  top: 0;
  border: 1px solid rgba(124,58,237,.2);
  border-radius: 12px;
  background: rgba(124,58,237,.04);
  overflow: hidden;
}
.fi-queue-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  border-bottom: 1px solid var(--line);
  background: rgba(255,255,255,.6);
}
.fi-queue-list {
  display: flex;
  flex-direction: column;
  max-height: 520px;
  overflow: auto;
}
.fi-queue-item {
  display: block;
  width: 100%;
  text-align: left;
  border: 0;
  border-bottom: 1px solid rgba(0,0,0,.05);
  background: transparent;
  padding: 10px 12px;
  cursor: pointer;
}
.fi-queue-item:hover { background: rgba(124,58,237,.08); }
.fi-queue-item.active {
  background: rgba(124,58,237,.14);
  box-shadow: inset 3px 0 0 var(--purple, #7c3aed);
}
.fi-queue-item strong { display: block; font-size: 13px; }
.fi-queue-item small { display: block; margin-top: 2px; color: var(--muted); font-size: 11px; }
.fi-workbench-hero {
  margin-bottom: 14px;
  padding: 14px 16px;
  border: 1px solid rgba(124,58,237,.2);
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(124,58,237,.08), rgba(255,255,255,.7));
}
.fi-workbench-hero-badges {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 8px;
}
.fi-workbench-hero-sub {
  margin: 0;
  font-size: 14px;
  font-weight: 600;
}
.fi-readiness-panel {
  display: flex;
  gap: 16px;
  align-items: flex-start;
  flex-wrap: wrap;
  margin-bottom: 14px;
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: rgba(255,255,255,.75);
}
.fi-readiness-ring {
  width: 88px;
  height: 88px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  text-align: center;
  background: conic-gradient(var(--purple, #7c3aed) calc(var(--fi-pct) * 1%), var(--line) 0);
  position: relative;
  flex-shrink: 0;
}
.fi-readiness-ring::before {
  content: "";
  position: absolute;
  inset: 8px;
  border-radius: 50%;
  background: var(--bg, #fff);
}
.fi-readiness-ring.ready { background: conic-gradient(var(--green) calc(var(--fi-pct) * 1%), var(--line) 0); }
.fi-readiness-ring.attention { background: conic-gradient(var(--gold) calc(var(--fi-pct) * 1%), var(--line) 0); }
.fi-readiness-value,
.fi-readiness-ring small {
  position: relative;
  z-index: 1;
  display: block;
}
.fi-readiness-value { font-size: 20px; font-weight: 800; line-height: 1; }
.fi-readiness-ring small { font-size: 9px; text-transform: uppercase; color: var(--muted); margin-top: 2px; }
.fi-readiness-copy { flex: 1; min-width: 220px; }
.fi-readiness-stats {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  margin: 8px 0;
  font-size: 13px;
}
.fi-readiness-warnings {
  margin: 8px 0 0;
  padding-left: 18px;
  font-size: 13px;
}
.fi-warn-gold { color: var(--gold); }
.fi-warn-blue { color: var(--blue); }
.fi-quick-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 14px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--line);
}
.fi-tab-bar {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin-bottom: 14px;
}
.fi-tab-btn {
  border: 1px solid var(--line);
  background: rgba(255,255,255,.7);
  border-radius: 999px;
  padding: 8px 14px;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  color: var(--muted);
}
.fi-tab-btn.active {
  background: rgba(124,58,237,.12);
  border-color: rgba(124,58,237,.35);
  color: var(--text);
}
.fi-tab-count {
  display: inline-block;
  min-width: 18px;
  margin-left: 4px;
  padding: 1px 6px;
  border-radius: 999px;
  background: rgba(0,0,0,.06);
  font-size: 10px;
}
.fi-tab-panel { margin-bottom: 14px; }
.fi-tab-panel[hidden] { display: none !important; }
.fi-form-chips { display: flex; gap: 6px; flex-wrap: wrap; }
.fi-form-chip {
  border: 1px solid var(--line);
  background: rgba(255,255,255,.8);
  border-radius: 999px;
  padding: 5px 10px;
  font-size: 11px;
  font-weight: 700;
  cursor: pointer;
}
.fi-form-chip.active {
  background: rgba(124,58,237,.12);
  border-color: rgba(124,58,237,.35);
}
.fi-form-suggested { border-color: rgba(124,58,237,.22); background: rgba(124,58,237,.04); }
.fi-forms-toolbar-actions { margin-top: 0; }
.fi-products-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 12px;
}
.fi-funding-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-bottom: 14px;
}
.fi-funding-card {
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: rgba(0,0,0,.02);
}
.fi-funding-card header { margin-bottom: 8px; }
.fi-notes-field textarea {
  width: 100%;
  min-height: 72px;
  resize: vertical;
}
.fi-workbench-actions-sticky {
  position: sticky;
  bottom: 0;
  background: var(--bg, #fff);
  padding: 12px 0 4px;
  margin-top: 8px;
  z-index: 2;
}
.fi-next-step { margin-top: 0; }
.fi-closed-badge { font-size: 14px; padding: 8px 14px; }
.fi-workflow-steps {
  display: flex;
  align-items: center;
  gap: 0;
  margin-bottom: 18px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: linear-gradient(180deg, rgba(99,102,241,.06), rgba(255,255,255,.5));
}
.fi-workflow-step {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 1;
  min-width: 0;
  border: 0;
  background: transparent;
  padding: 4px 6px;
  border-radius: 8px;
  cursor: pointer;
  text-align: left;
}
.fi-workflow-step:hover { background: rgba(124,58,237,.08); }
.fi-workflow-step:focus-visible { outline: 2px solid rgba(124,58,237,.45); outline-offset: 2px; }
.fi-workflow-step .fi-step-num {
  width: 26px;
  height: 26px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  font-size: 12px;
  font-weight: 800;
  background: var(--line);
  color: var(--muted);
}
.fi-workflow-step.active .fi-step-num,
.fi-workflow-step.done .fi-step-num {
  background: var(--purple, #7c3aed);
  color: #fff;
}
.fi-workflow-step.done .fi-step-num { background: var(--green); }
.fi-workflow-step .fi-step-label {
  font-size: 12px;
  font-weight: 700;
  color: var(--muted);
}
.fi-workflow-step.active .fi-step-label,
.fi-workflow-step.done .fi-step-label { color: var(--text); }
.fi-workflow-connector {
  width: 28px;
  height: 2px;
  background: var(--line);
  margin: 0 6px;
  flex-shrink: 0;
}
.fi-workflow-connector.done { background: var(--green); }
.fi-workbench-grid {
  display: grid;
  grid-template-columns: 1fr 1.2fr 1fr;
  gap: 14px;
  margin-bottom: 14px;
}
.fi-panel {
  border: 1px solid var(--line);
  border-radius: 10px;
  background: rgba(255,255,255,.72);
  overflow: hidden;
}
.fi-panel-highlight {
  border-color: rgba(124,58,237,.28);
  box-shadow: 0 8px 24px rgba(124,58,237,.08);
}
.fi-panel-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  border-bottom: 1px solid var(--line);
  background: rgba(0,0,0,.02);
}
.fi-panel-head h3 { margin: 0; font-size: 13px; }
.fi-panel-body { padding: 12px 14px; }
.fi-panel-title { display: block; font-size: 16px; margin-bottom: 10px; }
.fi-kv {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  padding: 6px 0;
  border-bottom: 1px solid rgba(0,0,0,.04);
  font-size: 13px;
}
.fi-kv span { color: var(--muted); }
.fi-numbers-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}
.fi-number-tile {
  padding: 10px;
  border-radius: 8px;
  background: rgba(124,58,237,.06);
  border: 1px solid rgba(124,58,237,.12);
}
.fi-number-tile small {
  display: block;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .35px;
  color: var(--muted);
  margin-bottom: 4px;
}
.fi-number-tile strong { font-size: 15px; }
.fi-panel-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  padding: 0 14px 12px;
}
.fi-forms-panel { margin-bottom: 14px; }
.fi-forms-toolbar {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
  margin-bottom: 10px;
}
.fi-forms-list {
  display: grid;
  gap: 8px;
  max-height: 280px;
  overflow: auto;
}
.fi-form-row {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 10px;
  align-items: center;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  cursor: pointer;
}
.fi-form-row:hover { border-color: rgba(124,58,237,.35); }
.fi-form-copy strong { display: block; font-size: 13px; }
.fi-form-copy small { color: var(--muted); }
.fi-product-chips { display: flex; gap: 8px; flex-wrap: wrap; }
.fi-workbench-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  align-items: center;
  padding-top: 8px;
  border-top: 1px solid var(--line);
}
.fi-trade-strip {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 8px;
  font-size: 13px;
}
.fi-profit-waterfall { display: grid; gap: 10px; }
.fi-profit-bar {
  display: grid;
  grid-template-columns: 92px 1fr auto;
  gap: 10px;
  align-items: center;
  font-size: 13px;
}
.fi-profit-track {
  height: 10px;
  border-radius: 999px;
  background: rgba(0,0,0,.06);
  overflow: hidden;
}
.fi-profit-fill { height: 100%; border-radius: 999px; }
.fi-profit-fill.front { background: var(--blue); }
.fi-profit-fill.fi { background: var(--purple, #7c3aed); }
.fi-profit-fill.total { background: linear-gradient(90deg, var(--blue), var(--purple, #7c3aed)); }
.fi-credit-gauge {
  display: flex;
  gap: 16px;
  align-items: center;
  margin-bottom: 14px;
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: rgba(255,255,255,.75);
}
.fi-credit-ring {
  width: 88px;
  height: 88px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  text-align: center;
  background: conic-gradient(var(--purple, #7c3aed) calc(var(--fi-pct) * 1%), var(--line) 0);
  position: relative;
  flex-shrink: 0;
}
.fi-credit-gauge.ready .fi-credit-ring { background: conic-gradient(var(--green) calc(var(--fi-pct) * 1%), var(--line) 0); }
.fi-credit-gauge.attention .fi-credit-ring { background: conic-gradient(var(--gold) calc(var(--fi-pct) * 1%), var(--line) 0); }
.fi-credit-ring::before {
  content: "";
  position: absolute;
  inset: 8px;
  border-radius: 50%;
  background: var(--bg, #fff);
}
.fi-credit-ring .fi-readiness-value,
.fi-credit-ring small { position: relative; z-index: 1; display: block; }
.fi-credit-copy { flex: 1; min-width: 180px; }
.fi-stip-tracker,
.fi-compliance-panel {
  margin-bottom: 14px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: rgba(0,0,0,.02);
}
.deal-titling-panel {
  margin: 0 0 16px;
  border: 2px solid #db2777;
  background: linear-gradient(165deg, #fdf2f8 0%, #ffffff 48%, #fff7fb 100%);
  border-radius: 14px;
  padding: 16px 18px;
  box-shadow: 0 2px 12px rgba(219, 39, 119, 0.12);
}
.deal-titling-panel-xml {
  border-color: #ec4899;
  box-shadow: 0 4px 18px rgba(236, 72, 153, 0.16);
}
.deal-titling-panel header {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 6px;
}
.deal-titling-panel header h3 {
  margin: 0;
  font-size: 16px;
  font-weight: 800;
  color: #9d174d;
  letter-spacing: -0.015em;
  display: flex;
  flex-direction: column;
  gap: 2px;
  line-height: 1.2;
}
.deal-titling-eyebrow {
  display: block;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #db2777;
}
.deal-titling-badge,
.deal-titling-ready {
  background: #fce7f3 !important;
  color: #9d174d !important;
  border: 1px solid #f9a8d4;
}
.deal-titling-panel-compact {
  margin-top: 14px;
}
.deal-titling-setup-note {
  color: #9d174d;
  background: #fdf2f8;
  border: 1px solid #f9a8d4;
  border-radius: 8px;
  padding: 8px 10px;
}
.deal-titling-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}
.deal-titling-export-btn,
button.deal-titling-export-btn {
  appearance: none;
  border: none;
  border-radius: 10px;
  padding: 12px 18px;
  font-size: 14px;
  font-weight: 800;
  letter-spacing: 0.01em;
  color: #fff;
  background: linear-gradient(180deg, #f472b6 0%, #db2777 100%);
  box-shadow: 0 2px 0 #9d174d, 0 6px 16px rgba(219, 39, 119, 0.28);
  cursor: pointer;
}
.deal-titling-export-btn:hover,
button.deal-titling-export-btn:hover {
  filter: brightness(1.05);
}
.deal-titling-export-btn.compact,
button.deal-titling-export-btn.compact {
  padding: 8px 12px;
  font-size: 13px;
}
.deal-titling-foot {
  margin-top: 10px;
  color: #9d174d;
}
dialog.et-setup-modal-dialog {
  width: min(1040px, calc(100vw - 24px));
  max-height: calc(100vh - 28px);
}
.et-setup-modal {
  max-height: min(72vh, 820px);
  overflow: auto;
  padding-right: 4px;
}
.et-setup-modal-lead {
  margin: 0 0 12px;
}
.et-setup-focus {
  outline: 2px solid #db2777;
  outline-offset: 3px;
  border-radius: 12px;
  scroll-margin: 16px;
}
.desk-tax-rate-locked {
  color: #475569;
}
.deal-jacket-handoff {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin: 0 0 16px;
  position: relative;
  z-index: 3;
}
@media (max-width: 900px) {
  .deal-jacket-handoff {
    grid-template-columns: 1fr;
  }
}
.deal-jacket-handoff-title {
  margin: 0;
  padding: 14px 16px;
  border: 3px solid #1d4ed8;
  border-radius: 12px;
  background: linear-gradient(165deg, #eff6ff 0%, #ffffff 55%, #dbeafe 100%);
  box-shadow: 0 2px 10px rgba(29, 78, 216, 0.16);
}
.deal-jacket-handoff-title header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-bottom: 6px;
}
.deal-jacket-handoff-title header strong {
  font-size: 15px;
  font-weight: 800;
  color: #1e3a8a;
}
.deal-jacket-handoff-title .deal-titling-actions {
  margin-top: 10px;
  flex-wrap: wrap;
  gap: 8px;
}
.deal-jacket-handoff-pay {
  min-width: 0;
}
.deal-jacket-handoff-pay .secure-pay-cashier-zone,
.deal-jacket-pay-zone {
  margin: 0;
  height: 100%;
}
.secure-pay-cashier-zone {
  margin: 0 0 14px;
  padding: 14px 16px;
  border: 3px solid #0f766e;
  border-radius: 12px;
  background: linear-gradient(165deg, #ecfdf5 0%, #ffffff 55%, #f0fdfa 100%);
  box-shadow: 0 2px 10px rgba(15, 118, 110, 0.18);
  position: relative;
  z-index: 2;
  display: block !important;
  visibility: visible !important;
}
.deal-payment-close-form .secure-pay-cashier-zone {
  order: -1;
  margin-top: 4px;
}
#reviewModalFooter:not(:empty) {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  justify-content: flex-end;
  padding: 12px 16px;
  border-top: 1px solid var(--line);
  background: #f0fdfa;
}
#reviewModalFooter .primary,
#reviewModalFooter .secondary {
  font-weight: 700;
}
.secure-pay-cashier-zone header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-bottom: 6px;
}
.secure-pay-cashier-zone header strong {
  font-size: 15px;
  font-weight: 800;
  letter-spacing: 0.04em;
  color: #115e59;
}
.secure-pay-cashier-zone .secure-pay-actions {
  margin-top: 10px;
  gap: 8px;
  display: flex;
  flex-wrap: wrap;
}
.secure-pay-detail-actions {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  padding: 4px 0;
}
.secure-pay-detail-actions .primary,
.secure-pay-detail-actions .secondary {
  font-weight: 700;
}
.secure-pay-paid-banner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  margin: 8px 0;
  padding: 8px 10px;
  border-radius: 8px;
  background: #d1fae5;
  border: 1px solid #6ee7b7;
}
.secure-pay-pending {
  margin: 6px 0;
}
.deal-title-fax-strip {
  margin: 0 0 16px;
  border: 2px solid #0f766e;
  background: linear-gradient(165deg, #f0fdfa 0%, #ffffff 52%, #ecfeff 100%);
  border-radius: 14px;
  padding: 14px 16px;
  box-shadow: 0 2px 12px rgba(15, 118, 110, 0.12);
}
.deal-title-fax-strip-xml {
  border-color: #db2777;
  background: linear-gradient(165deg, #fdf2f8 0%, #ffffff 48%, #f0fdfa 100%);
  box-shadow: 0 3px 14px rgba(219, 39, 119, 0.14);
}
.deal-title-fax-strip-head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 8px 10px;
  margin-bottom: 10px;
}
.deal-title-fax-strip-head strong {
  display: block;
  font-size: 15px;
  font-weight: 800;
  color: #134e4a;
  letter-spacing: -0.01em;
}
.deal-title-fax-strip-xml .deal-title-fax-strip-head strong {
  color: #9d174d;
}
.deal-title-fax-eyebrow {
  display: block;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #0f766e;
  margin-bottom: 2px;
}
.deal-title-fax-strip-xml .deal-title-fax-eyebrow {
  color: #db2777;
}
.deal-title-fax-strip-actions,
.deal-title-fax-inline,
.deal-title-fax-fax-group,
.deal-queue-handoff-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.deal-title-fax-inline {
  max-width: 420px;
}
.deal-forms-fax-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 10px;
  padding: 10px 12px;
  border-radius: 10px;
  background: #ecfdf5;
  border: 1px solid #99f6e4;
}
.fax-to-lender-btn,
button.fax-to-lender-btn {
  appearance: none;
  border: none;
  border-radius: 10px;
  padding: 12px 18px;
  font-size: 14px;
  font-weight: 800;
  letter-spacing: 0.01em;
  color: #fff;
  background: linear-gradient(180deg, #2dd4bf 0%, #0f766e 100%);
  box-shadow: 0 2px 0 #115e59, 0 6px 16px rgba(15, 118, 110, 0.28);
  cursor: pointer;
}
.fax-to-lender-btn:hover,
button.fax-to-lender-btn:hover {
  filter: brightness(1.05);
}
.fax-to-lender-btn.compact,
button.fax-to-lender-btn.compact {
  padding: 8px 12px;
  font-size: 13px;
}
.deal-queue-title-fax-table td:last-child {
  min-width: 280px;
}
.open-deal-title-fax {
  margin-top: 8px;
}
.desking-title-fax,
.fi-funding-title-fax,
.bhph-title-fax {
  margin-top: 12px;
}
.fi-stip-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
}
.fi-stip-list { display: grid; gap: 6px; }
.fi-stip-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  border-radius: 8px;
  border: 1px solid transparent;
  font-size: 13px;
  cursor: pointer;
}
.fi-stip-row:hover { background: rgba(124,58,237,.05); }
.fi-stip-row.done { background: rgba(34,197,94,.08); border-color: rgba(34,197,94,.2); }
.fi-activity-log {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 8px;
}
.fi-activity-log li {
  display: grid;
  grid-template-columns: 150px 1fr auto;
  gap: 10px;
  font-size: 12px;
  padding: 8px 10px;
  border-radius: 8px;
  background: rgba(0,0,0,.02);
}
.fi-activity-log time { color: var(--muted); }
.fi-kbd-hints {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 10px;
  font-size: 11px;
  color: var(--muted);
}
.fi-kbd-hints kbd {
  display: inline-block;
  min-width: 18px;
  padding: 2px 6px;
  border: 1px solid var(--line);
  border-radius: 4px;
  background: rgba(255,255,255,.8);
  font-size: 10px;
  font-weight: 700;
  margin-right: 4px;
}
.compact-select { min-width: 160px; font-size: 13px; }
@media (max-width: 1100px) {
  .fi-workbench-layout { grid-template-columns: 1fr; }
  .fi-queue-panel { position: static; }
}
.deal-card-fi {
  border-color: rgba(124,58,237,.35);
  box-shadow: inset 0 0 0 1px rgba(124,58,237,.12);
}
.deal-card-cashier {
  border-color: rgba(245,166,35,.45);
  box-shadow: inset 0 0 0 1px rgba(245,166,35,.15);
}
.deal-card-cashier-badge {
  display: inline-block;
  margin: 4px 0 2px;
  font-size: 10px;
}
.deal-workflow-stepper {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px 4px;
  margin: 0 20px 14px;
  padding: 12px 14px;
  border-radius: 10px;
  background: var(--panel-2, #f7f9fc);
  border: 1px solid var(--line);
}

.deal-workflow-step {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.deal-workflow-dot {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  background: var(--line);
  color: var(--muted);
}

.deal-workflow-step.active .deal-workflow-dot {
  background: var(--porter-teal);
  color: #fff;
}

.deal-workflow-step.done .deal-workflow-dot {
  background: var(--green);
  color: #fff;
}

.deal-workflow-label {
  font-size: 12px;
  color: var(--muted);
  white-space: nowrap;
}

.deal-workflow-step.active .deal-workflow-label,
.deal-workflow-step.done .deal-workflow-label {
  color: var(--ink);
  font-weight: 600;
}

.deal-workflow-connector {
  flex: 0 0 18px;
  height: 2px;
  background: var(--line);
  margin: 0 2px;
}

.deal-workflow-connector.done {
  background: var(--green);
}

.deal-workflow-next {
  flex: 1 1 100%;
  margin: 6px 0 0;
}

.sales-close-queue-panel {
  border-color: rgba(245,166,35,.35);
  background: linear-gradient(180deg, rgba(254,243,199,.35), rgba(255,255,255,.72));
}
.sales-close-queue-note { margin: 0 0 12px; }
.sales-close-queue {
  display: grid;
  gap: 10px;
}
.sales-close-card {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  flex-wrap: wrap;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: rgba(255,255,255,.85);
}
.sales-close-card-main {
  display: grid;
  gap: 4px;
  min-width: 0;
}
.sales-close-card-actions {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}
.sales-close-wait { color: var(--gold); font-weight: 700; }
.fi-cashier-gate {
  padding: 12px 14px;
  border-radius: 10px;
  margin-bottom: 14px;
  border: 1px solid var(--line);
}
.fi-cashier-ready {
  background: rgba(34,197,94,.08);
  border-color: rgba(34,197,94,.25);
}
.fi-cashier-wait {
  background: rgba(254,243,199,.55);
  border-color: rgba(245,166,35,.35);
}
.fi-awaiting-cashier { font-size: 13px; padding: 8px 14px; }
.deal-payment-close-form .deal-payment-close-hero {
  margin-bottom: 12px;
  padding: 12px 14px;
  border-radius: 8px;
  background: rgba(0,0,0,.03);
  display: grid;
  gap: 4px;
}
.deal-payment-gl-impact {
  margin-bottom: 14px;
  padding: 12px 14px;
  border-radius: 8px;
  border: 1px solid rgba(124,58,237,.2);
  background: rgba(124,58,237,.05);
}
.deal-payment-gl-impact ul {
  margin: 8px 0 0;
  padding-left: 18px;
  font-size: 13px;
}
.deal-payment-gl-impact li { margin: 4px 0; }
.cashier-internal-ar-block {
  grid-column: 1 / -1;
  margin: 4px 0 8px;
  padding: 12px 14px;
  border-radius: 8px;
  border: 1px solid rgba(37,99,235,.22);
  background: rgba(37,99,235,.04);
  display: grid;
  gap: 10px;
}
.cashier-internal-ar-block header {
  display: grid;
  gap: 2px;
}
.cashier-ar-field small.meta { display: block; margin-top: 4px; }
.forms-picker-toolbar {
  display: flex;
  gap: 10px;
  align-items: center;
  margin-bottom: 10px;
}
@media (max-width: 980px) {
  .fi-workbench-grid { grid-template-columns: 1fr; }
  .fi-numbers-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .fi-products-summary { grid-template-columns: 1fr; }
  .fi-funding-grid { grid-template-columns: 1fr; }
  .fi-workflow-steps { flex-wrap: wrap; gap: 8px; }
  .fi-workflow-connector { display: none; }
}

.dup-suggest-panel {
  margin-top: 10px;
  padding: 12px 14px;
  border: 1px solid rgba(245,166,35,.35);
  border-radius: 8px;
  background: rgba(254,243,199,.55);
}

.dup-suggest-list {
  display: grid;
  gap: 6px;
  margin: 8px 0;
}

.dup-suggest-item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  width: 100%;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  cursor: pointer;
  text-align: left;
}

.dup-suggest-item:hover {
  border-color: var(--porter-teal);
}

.merge-customer-bar {
  align-items: flex-end;
}

.merge-customer-bar label {
  display: grid;
  gap: 4px;
  min-width: 240px;
}

.merge-pick {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  font-size: 13px;
}

.danger-inline {
  border-left: 3px solid var(--red);
  padding: 8px 12px;
  margin-bottom: 10px;
  background: rgba(220, 53, 69, 0.06);
}

.communication-window .comm-window-tabs {
  flex-wrap: wrap;
}

.crm-call-records-tab,
.crm-call-records-tab.active {
  background: #6d28d9 !important;
  color: #fff !important;
  border-color: #5b21b6 !important;
}

.crm-call-records-tab:not(.active) {
  background: #7c3aed !important;
  opacity: 0.92;
}

.crm-call-records-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin: 10px 0 14px;
}

.crm-call-records-toolbar .crm-search {
  flex: 1 1 220px;
  min-width: 180px;
}

.crm-call-records-panel audio {
  vertical-align: middle;
}

.comm-history-table .comm-history-row {
  cursor: pointer;
}

.comm-history-table .comm-history-row.expanded {
  background: rgba(37, 99, 235, 0.06);
}

.comm-history-table .comm-history-detail-body {
  padding: 10px 12px;
  background: var(--surface-muted, #f8fafc);
  border-radius: 8px;
  margin: 4px 0 10px;
}

.comm-history-table .comm-history-message {
  margin: 6px 0 8px;
  white-space: pre-wrap;
  word-break: break-word;
  font: 13px/1.45 ui-sans-serif, system-ui, -apple-system, sans-serif;
  color: var(--text, #1f2937);
}

.comm-history-table .comm-history-subject {
  margin-bottom: 4px;
}

.comm-merge-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 8px 0 12px;
}

.crm-rule-chevron-palette {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  margin: 8px 0 12px;
  padding: 8px 10px;
  border: 1px dashed var(--border);
  border-radius: 8px;
  background: var(--surface-muted, #f8fafc);
}

.crm-rule-chevron-palette .meta {
  margin-right: 4px;
}

.merge-conflict-table .merge-conflict-row {
  background: rgba(212, 160, 23, 0.08);
}

.part-search-input {
  width: 100%;
}

.tab-strip,
.sub-tab-strip {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
  margin: 0 0 16px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255,255,255,.68);
  box-shadow: var(--shadow-sm);
}

.service-mgmt-intro .panel-intro,
.parts-mgmt-intro .panel-intro {
  padding: 0 16px 12px;
  max-width: 920px;
}

.service-mgmt-quick-stats,
.parts-mgmt-quick-stats {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  padding: 0 16px 14px;
}

.service-mgmt-quick-stats .badge,
.parts-mgmt-quick-stats .badge {
  margin: 0;
}

.service-mgmt-tabs,
.parts-mgmt-tabs {
  position: sticky;
  top: 0;
  z-index: 2;
  background: var(--surface, rgba(255,255,255,.92));
  padding-top: 4px;
  margin-bottom: 4px;
  margin-top: -4px;
}

.mgmt-focus-bar {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 8px 16px;
  margin-bottom: 8px;
  background: rgba(255,255,255,.68);
  border-radius: 8px;
  box-shadow: var(--shadow-sm);
}

.mgmt-focus-bar .badge {
  margin-left: auto;
}

.parts-inv-mgmt-hint {
  margin-left: auto;
  font-size: 12px;
  white-space: nowrap;
}

@media (max-width: 900px) {
  .parts-inv-mgmt-hint {
    margin-left: 0;
    width: 100%;
    white-space: normal;
  }
}

.sub-tab-strip {
  margin-top: -8px;
  background: rgba(239,246,255,.78);
}

.ro-lines-table td {
  vertical-align: top;
}

.line-badge {
  display: inline-grid;
  place-items: center;
  width: 30px;
  height: 30px;
  border-radius: 8px;
  background: #0f5f93;
  color: white;
  font-weight: 900;
  letter-spacing: 0;
}

.invoice-actions {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: center;
}

.invoice-actions .secondary {
  min-height: 28px;
  padding: 0 9px;
  font-size: 12px;
}

.permission-denied {
  padding: 14px 16px;
  margin-bottom: 14px;
  border: 1px solid rgba(220,38,38,.18);
  border-radius: 8px;
  background: rgba(254,242,242,.88);
  color: #991b1b;
  font-weight: 700;
}

.dashboard-quick-reports-panel { margin-bottom: 16px; }
.dashboard-quick-reports-head {
  display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; flex-wrap: wrap;
}
.dashboard-quick-reports-head-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.dashboard-quick-reports-grid {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; padding: 0 16px 16px;
}
.quick-report-card {
  background: var(--surface-2, rgba(0,0,0,.02)); border: 1px solid var(--border);
  border-radius: 12px; padding: 12px; display: flex; flex-direction: column; gap: 8px; min-height: 220px;
}
.quick-report-card-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; }
.quick-report-picker { display: flex; flex-direction: column; gap: 4px; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); flex: 1; }
.quick-report-picker select { font-size: 12px; font-weight: 400; text-transform: none; letter-spacing: normal; width: 100%; }
.quick-report-meta strong { display: block; font-size: 14px; }
.quick-report-meta small { color: var(--muted); font-size: 11px; }
.quick-report-table { max-height: 140px; overflow: auto; }
.quick-report-table table { font-size: 11px; }
.quick-report-table th, .quick-report-table td { padding: 4px 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 120px; }
.quick-report-empty { margin: 0; padding: 16px 4px; text-align: center; }
.quick-report-actions { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-top: auto; }
@media (max-width: 1100px) {
  .dashboard-quick-reports-grid { grid-template-columns: 1fr; }
}

.price-code-edit-form .price-code-edit-stats { margin-bottom: 12px; }
.price-code-formula-strip { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 10px 0; }
.price-code-preview-panel { margin-top: 10px; }
.price-code-preview-table { max-height: 220px; overflow: auto; }
.price-code-preview-table small { display: block; color: var(--muted); font-size: 10px; }
.price-code-add-form {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 8px; align-items: end;
}
.parts-price-codes-panel .panel-filters input[type="search"] { max-width: 320px; }

.dashboard-customizer {
  margin-bottom: 16px;
}

.dashboard-customizer header {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.dashboard-customizer .panel-filters {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: 8px;
  align-items: stretch;
}

.dashboard-toggle {
  display: flex;
  gap: 8px;
  align-items: center;
  min-height: 34px;
  padding: 7px 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255,255,255,.64);
  font-weight: 800;
  color: var(--ink);
  white-space: normal;
  line-height: 1.15;
  overflow-wrap: anywhere;
}

.perm-check.dashboard-toggle {
  width: auto;
  height: auto;
  justify-content: flex-start;
}

.perm-check.dashboard-toggle input {
  flex: 0 0 auto;
}

.dashboard-layout-customizer {
  margin-bottom: 16px;
}

.dashboard-layout-customizer .panel-intro {
  padding: 0 16px 12px;
}

.dashboard-empty-state {
  margin-bottom: 16px;
  border: 1px dashed var(--border, #cbd5e1);
  background: linear-gradient(180deg, rgba(0, 180, 166, 0.04) 0%, rgba(255, 255, 255, 0) 100%);
}

.dashboard-empty-state .panel-body {
  padding: 0 16px 16px;
}

.dashboard-empty-actions {
  margin: 12px 0 16px;
  flex-wrap: wrap;
  gap: 8px;
}

.dashboard-empty-section {
  margin-top: 16px;
}

.dashboard-empty-section h3 {
  font-size: 13px;
  margin: 0 0 8px;
}

.dashboard-empty-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.dashboard-empty-launcher {
  max-width: 720px;
}

.dashboard-customizer-head-actions {
  margin-left: auto;
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.dashboard-customizer-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 16px;
  padding: 0 16px 16px;
}

.dashboard-customizer-col h3 {
  font-size: 13px;
  margin: 0 0 8px;
}

.dashboard-customizer-checks {
  display: grid;
  gap: 8px;
  max-height: 320px;
  overflow: auto;
}

.dashboard-layout-order {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 6px;
}

.dashboard-layout-order-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255,255,255,.64);
}

.dashboard-layout-order-actions {
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
}

.dashboard-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 12px;
}

.dashboard-favorites-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin: 0 0 12px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.72);
}

.dashboard-favorite-chip {
  border: 1px solid var(--line);
  background: #fff;
  border-radius: 999px;
  padding: 6px 12px;
  font-size: 12px;
  cursor: pointer;
}

.dashboard-widget-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr));
  gap: 14px;
}

.dashboard-grid-item {
  position: relative;
  min-width: 0;
}

.dashboard-grid-item.dragging {
  opacity: 0.55;
}

.dashboard-grid-item.drop-target {
  outline: 2px dashed var(--accent, #00b4a6);
  outline-offset: 4px;
}

.dashboard-grid-item-handle {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 2;
  cursor: grab;
  color: var(--muted, #64748b);
  font-size: 16px;
  line-height: 1;
  padding: 4px;
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.85);
}

.dashboard-picker-body {
  padding: 0 16px 16px;
  max-height: min(70vh, 640px);
  overflow: auto;
}

.dashboard-picker-tabs {
  display: flex;
  gap: 8px;
  margin-bottom: 12px;
}

.dashboard-picker-tabs .active {
  border-color: var(--accent, #00b4a6);
  color: var(--accent, #00b4a6);
}

.dashboard-picker-panel {
  display: grid;
  gap: 8px;
}

.dashboard-picker-row {
  display: flex;
  gap: 12px;
  align-items: center;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  cursor: pointer;
  text-transform: none;
  letter-spacing: normal;
  font-size: 13px;
  font-weight: 400;
  color: var(--ink);
}

.dashboard-picker-row input[type="checkbox"] {
  width: 18px;
  height: 18px;
  min-height: 0;
  flex: 0 0 18px;
  margin: 0;
  accent-color: var(--porter-teal, #00b4a6);
}

.dashboard-picker-row > span {
  flex: 1;
  min-width: 0;
  text-align: left;
}

.dashboard-picker-row strong {
  display: block;
  font-size: 13px;
  font-weight: 700;
  color: var(--ink);
}

.dashboard-picker-row.is-active {
  border-color: var(--accent, #00b4a6);
  background: rgba(0, 180, 166, 0.05);
}

.dashboard-picker-row small {
  display: block;
  color: var(--muted, #64748b);
  font-size: 12px;
  font-weight: 400;
  text-transform: none;
}

.dashboard-picker-note {
  margin-top: 12px;
}

.dashboard-launcher-grid,
.dashboard-shortcut-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
  gap: 10px;
  padding: 14px 16px;
}

.dashboard-launcher-tile,
.dashboard-shortcut-tile {
  display: grid;
  gap: 6px;
  justify-items: center;
  text-align: center;
  min-height: 88px;
  padding: 12px 8px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: rgba(255,255,255,.78);
  cursor: pointer;
  font: inherit;
  color: var(--ink);
  transition: border-color .15s, box-shadow .15s;
}

.dashboard-launcher-tile:hover,
.dashboard-shortcut-tile:hover {
  border-color: var(--accent);
  box-shadow: 0 4px 14px rgba(33, 97, 140, .12);
}

.dashboard-launcher-icon,
.dashboard-shortcut-icon {
  font-size: 24px;
  line-height: 1;
}

.dashboard-launcher-tile strong,
.dashboard-shortcut-tile strong {
  font-size: 12px;
  font-weight: 800;
}

.dashboard-report-widget .quick-report-table {
  margin: 0 16px 12px;
}

/* Compact dashboard — tidy layout without clipping KPIs or hiding content */
.dashboard-compact-module {
  min-width: 0;
}

.dashboard-compact-shell {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.dashboard-compact-top {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.dashboard-toolbar-compact {
  margin: 0;
}

.dashboard-compact-strip {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.dashboard-compact-hero .workspace-hero {
  margin-bottom: 0;
  padding: 14px 16px;
  grid-template-columns: minmax(0, 1fr);
}

.dashboard-compact-hero .workspace-hero h2 {
  font-size: 20px;
  margin: 6px 0 4px;
}

.dashboard-compact-hero .workspace-hero p {
  font-size: 13px;
}

.dashboard-compact-hero .workspace-priorities {
  display: none;
}

.dashboard-compact-metrics .kpis,
.dashboard-compact-metrics .dashboard-enterprise-kpis {
  margin: 0;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 10px;
}

.dashboard-compact-metrics .kpi {
  padding: 12px 14px;
  min-width: 0;
}

.dashboard-compact-metrics .kpi-value {
  font-size: 24px;
  margin: 6px 0 2px;
  line-height: 1.1;
}

.dashboard-compact-metrics .module-quick-actions {
  margin: 0;
}

.dashboard-attention-compact .ai-insights-panel {
  margin: 0;
}

.dashboard-attention-compact .ai-insights-panel header h2 {
  font-size: 14px;
}

.dashboard-attention-compact .ai-insights-panel .panel-body {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 8px 12px 12px;
}

.dashboard-attention-compact .insight-chip {
  font-size: 11px;
  padding: 5px 8px;
}

.dashboard-widget-grid-compact {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  align-content: start;
}

.dashboard-compact-shell .dashboard-widget-grid-compact .panel {
  margin: 0;
  min-width: 0;
}

.dashboard-compact-shell .dashboard-widget-grid-compact .panel header {
  padding: 10px 12px;
}

.dashboard-compact-shell .dashboard-widget-grid-compact .panel header h2 {
  font-size: 14px;
}

.dashboard-compact-shell .dashboard-widget-grid-compact .panel-body,
.dashboard-compact-shell .dashboard-widget-grid-compact .table-wrap,
.dashboard-compact-shell .dashboard-widget-grid-compact .cards,
.dashboard-compact-shell .dashboard-widget-grid-compact .timeline {
  overflow: auto;
  max-height: 280px;
}

.dashboard-compact-shell .dashboard-widget-grid-compact .grid-2,
.dashboard-compact-shell .dashboard-widget-grid-compact .grid-3 {
  gap: 10px;
}

.dashboard-compact-shell .dashboard-widget-grid-compact .grid-2 .panel,
.dashboard-compact-shell .dashboard-widget-grid-compact .grid-3 > * {
  min-width: 0;
}

.dashboard-compact-shell .dashboard-widget-grid-compact .chart-wrap {
  min-height: 160px;
  max-height: 220px;
}

.dashboard-more-widgets-wrap {
  margin: 0;
}

.dashboard-grid-item-handle {
  display: none;
}

.dashboard-layout-customizer-bare .dashboard-customizer-grid {
  max-height: min(60vh, 520px);
  overflow: auto;
}

@media (max-width: 960px) {
  .dashboard-widget-grid-compact {
    grid-template-columns: 1fr;
  }

  .dashboard-compact-metrics .kpis,
  .dashboard-compact-metrics .dashboard-enterprise-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 560px) {
  .dashboard-compact-metrics .kpis,
  .dashboard-compact-metrics .dashboard-enterprise-kpis {
    grid-template-columns: 1fr;
  }
}

.obsolete-flag,
.archived-badge,
.restored-badge,
.credit-memo-badge {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  padding: 0 8px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 800;
  background: rgba(245,158,11,.14);
  color: #92400e;
}

.login-card {
  width: min(420px, 100%);
  display: grid;
  gap: 14px;
  padding: 24px;
  border: 1px solid rgba(33, 97, 140, .18);
  border-radius: 12px;
  background: rgba(255,255,255,.92);
  box-shadow: 0 24px 80px rgba(24, 76, 110, .22);
}

.login-card label,
.reset-fields label {
  display: grid;
  gap: 6px;
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
  color: var(--muted);
}

.login-card input,
.parts-suggest,
.customer-suggest {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px 11px;
  background: #fff;
  color: var(--ink);
}

#loginMessage.login-error,
#changePasswordMessage.login-error {
  color: #b42318;
  font-weight: 700;
  margin-top: 4px;
}

.reset-fields {
  display: grid;
  gap: 10px;
  padding: 12px;
  border-radius: 10px;
  background: #eef7fd;
  border: 1px solid var(--line);
}

.subtabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 14px;
}

.subtab {
  min-height: 32px;
  padding: 0 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255,255,255,.72);
  color: var(--ink);
  font-weight: 800;
  cursor: pointer;
}

.subtab.active {
  background: var(--porter-blue);
  color: #fff;
  border-color: var(--porter-blue);
}

.locked-panel {
  padding: 22px;
  color: var(--muted);
  font-weight: 700;
}

@media (max-width: 900px) {
  .integration-grid { grid-template-columns: 1fr; }
  .inline-edit-grid,
  .ro-part-add { grid-template-columns: 1fr; }
}

/* ── V4 enterprise additions ─────────────────────────────────────────────── */
.dealer-badges {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-right: 6px;
}

.module-tabs {
  margin: 14px 0;
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: rgba(255,255,255,.62);
}

body.dark-mode .module-tabs {
  background: rgba(15,23,42,.55);
}

.module-tabs button {
  border: 0;
  border-radius: 8px;
  min-height: 34px;
  padding: 0 12px;
  background: transparent;
  color: var(--muted);
  font-weight: 800;
}

.module-tabs button.active {
  background: var(--porter-teal);
  color: white;
  box-shadow: var(--shadow-sm);
}

/* ── Forms module pastel pink controls ───────────────────────────────────── */
#forms {
  --forms-pink: #f9c5d5;
  --forms-pink-soft: #fde6ee;
  --forms-pink-deep: #ef8fad;
  --forms-pink-ink: #7a3a4f;
  --forms-pink-ink-strong: #5c2436;
}
#forms .forms-module-tabs.module-tabs {
  background: linear-gradient(180deg, rgba(253, 230, 238, 0.95), rgba(249, 197, 213, 0.55));
  border-color: rgba(239, 143, 173, 0.55);
}
#forms .forms-module-tabs button,
#forms button.forms-pink-btn {
  color: var(--forms-pink-ink);
  background: transparent;
}
#forms .forms-module-tabs button:hover,
#forms button.forms-pink-btn:hover {
  background: rgba(249, 197, 213, 0.55);
  color: var(--forms-pink-ink-strong);
}
#forms .forms-module-tabs button.active,
#forms button.forms-pink-btn.active {
  background: linear-gradient(180deg, #f9c5d5 0%, #ef8fad 100%);
  color: var(--forms-pink-ink-strong);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.55) inset, 0 2px 10px rgba(239, 143, 173, 0.35);
}
#forms .module-primary-actions-buttons button,
#forms .module-quick-actions button,
#forms .module-primary-actions-bar button,
#forms .header-actions button,
#forms .detail-actions button,
#forms .panel header button,
#forms button.primary,
#forms button.secondary,
#forms .super-kpi-tile,
#forms .link-button.compact,
#forms .micro-button {
  --btn-bg: var(--forms-pink-soft);
  --btn-border: rgba(239, 143, 173, 0.55);
  --btn-ink: var(--forms-pink-ink);
  background: linear-gradient(180deg, #fde6ee 0%, #f9c5d5 100%) !important;
  border-color: rgba(239, 143, 173, 0.6) !important;
  color: var(--forms-pink-ink-strong) !important;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.55) inset;
}
#forms button.primary,
#forms .module-primary-actions-buttons button.primary,
#forms .header-actions button.primary,
#forms .detail-actions button.primary,
#forms .panel header button.primary {
  background: linear-gradient(180deg, #f9c5d5 0%, #ef8fad 100%) !important;
  border-color: rgba(214, 100, 140, 0.55) !important;
  color: var(--forms-pink-ink-strong) !important;
  font-weight: 800;
}
#forms .super-kpi-tile {
  border: 1px solid rgba(239, 143, 173, 0.45) !important;
  border-radius: 12px;
}
#forms .super-kpi-tile:hover {
  background: linear-gradient(180deg, #f9c5d5 0%, #ef8fad 100%) !important;
}
#forms .super-kpi-tile strong {
  color: var(--forms-pink-ink-strong);
}
#forms .action-menu-toggle,
#forms .action-menu-item {
  background: linear-gradient(180deg, #fde6ee 0%, #f9c5d5 100%) !important;
  color: var(--forms-pink-ink-strong) !important;
  border-color: rgba(239, 143, 173, 0.55) !important;
}
body.dark-mode #forms .forms-module-tabs.module-tabs {
  background: rgba(122, 58, 79, 0.35);
  border-color: rgba(239, 143, 173, 0.35);
}
body.dark-mode #forms .forms-module-tabs button.active {
  color: #fff5f8;
}



.calc-result {
  display: grid;
  gap: 14px;
  margin-top: 16px;
}

.collection-board {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 14px;
  padding: 16px;
}

.collection-card {
  display: grid;
  gap: 10px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255,255,255,.78);
  box-shadow: var(--shadow-sm);
}

.collection-card.risk {
  border-color: rgba(220,38,38,.38);
  background: linear-gradient(180deg, rgba(254,226,226,.86), rgba(255,255,255,.86));
}

body.dark-mode .collection-card {
  background: rgba(15,23,42,.72);
}

body.dark-mode .collection-card.risk {
  background: linear-gradient(180deg, rgba(127,29,29,.42), rgba(15,23,42,.72));
}

.collection-card strong {
  font-weight: 900;
}

.collection-card > span {
  color: var(--muted);
  font-size: 12px;
}

body.dark-mode .panel,
body.dark-mode .modal,
body.dark-mode .login-card,
body.dark-mode .kpi,
body.dark-mode .integration-card,
body.dark-mode .subtab,
body.dark-mode .workflow-card,
body.dark-mode .inventory-card,
body.dark-mode .customer-card,
body.dark-mode .part-detail-card,
body.dark-mode .empty {
  background-color: var(--panel);
  color: var(--ink);
  border-color: var(--line);
}

body.dark-mode input,
body.dark-mode select,
body.dark-mode textarea,
body.dark-mode .filter-input,
body.dark-mode .customer-suggest,
body.dark-mode .parts-suggest {
  background: rgba(15,23,42,.9);
  color: var(--ink);
  border-color: var(--line);
}

body.dark-mode table {
  color: var(--ink);
}

body.dark-mode thead th {
  background: rgba(15,23,42,.75);
  color: var(--muted);
}

body.dark-mode tbody tr:hover {
  background: rgba(0,180,166,.08);
}

body.dark-mode .topbar,
body.dark-mode .notif-drawer,
body.dark-mode .messages-drawer {
  background: rgba(9,21,32,.88);
  color: var(--ink);
  border-color: var(--line);
}

body.dark-mode .goal-badge,
body.dark-mode .company-switcher select {
  background: rgba(15,23,42,.8);
  color: var(--ink);
  border-color: var(--line);
}

.danger {
  min-height: 34px;
  padding: 0 14px;
  border: 1px solid rgba(220,38,38,.3);
  border-radius: 8px;
  background: var(--red);
  color: white;
  font-weight: 900;
}

.clickable-row {
  cursor: pointer;
}

.clickable-row:hover {
  background: rgba(0,180,166,.07);
}

.line-link {
  border: 0;
  cursor: pointer;
}

.line-badge.xl {
  display: inline-flex;
  width: auto;
  min-width: 72px;
  justify-content: center;
  padding: 7px 10px;
  font-size: 13px;
}

.line-modal-body {
  max-height: min(78vh, 820px);
  overflow: auto;
}

.ro-detail-modal-body,
.ro-overview-modal-body {
  max-height: min(82vh, 900px);
  overflow: hidden;
  padding: 0;
  display: flex;
  flex-direction: column;
}

.ro-overview-modal-body .ro-overview-shell {
  flex: 1;
  min-height: 0;
  overflow: auto;
  padding: 0 0 12px;
  display: grid;
  gap: 12px;
}

.ro-detail-modal-body .detail-full,
.ro-detail-modal-shell {
  display: flex;
  flex-direction: column;
  min-height: min(82vh, 900px);
  max-height: min(82vh, 900px);
  border: none;
  box-shadow: none;
  overflow: hidden;
}

.ro-detail-modal-main {
  flex: 1;
  overflow: auto;
  padding-bottom: 8px;
}

.ro-detail-modal-section {
  padding: 0 20px 12px;
}

.ro-detail-modal-header {
  padding: 0 20px;
}

.ro-detail-modal-facts {
  padding: 0 20px 12px;
}

.ro-detail-modal-footer {
  flex-shrink: 0;
  margin: 0;
  padding: 12px 20px 16px;
  border-top: 1px solid var(--line);
  background: var(--surface, #fff);
  position: sticky;
  bottom: 0;
  z-index: 12;
  flex-wrap: wrap;
  gap: 8px;
  overflow: visible;
}

.ro-detail-modal-footer .ro-loaner-menu-wrap {
  position: relative;
  z-index: 30;
}

.ro-detail-modal-footer .ro-loaner-menu.ro-footer-menu-open,
.ro-detail-modal-footer .ro-workflow-menu.ro-footer-menu-open {
  top: auto;
  bottom: calc(100% + 4px);
  z-index: 100;
}

.service-ro-selection-hint {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 280px;
  border: 1px dashed var(--line);
  border-radius: 12px;
  background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(244,247,249,.65));
}

.service-ro-selection-card {
  max-width: 420px;
  padding: 24px;
  text-align: center;
}

.service-ro-selection-card h3 {
  margin: 8px 0 6px;
}

.service-ro-selection-tip {
  margin-top: 14px;
  line-height: 1.45;
}

.ro-detail-lines-spreadsheet {
  margin-top: 4px;
}

.ro-detail-lines-hint {
  margin: 0 0 8px;
}

.ro-detail-lines-table table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
}

.ro-detail-lines-table th,
.ro-detail-lines-table td {
  border: 1px solid var(--line);
  padding: 7px 8px;
  vertical-align: top;
}

.ro-detail-lines-table thead th {
  background: var(--surface-2, #eef3f6);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted);
  position: sticky;
  top: 0;
  z-index: 1;
}

.ro-detail-lines-table tbody tr:nth-child(even) {
  background: rgba(0, 0, 0, 0.015);
}

.ro-detail-lines-table tbody tr:hover {
  background: rgba(13, 148, 136, 0.06);
}

.ro-detail-line-row {
  cursor: pointer;
}

.ro-detail-line-row.active {
  background: rgba(13, 148, 136, 0.08);
  box-shadow: inset 3px 0 0 var(--teal, #0d9488);
}

.service-skill-admin {
  display: grid;
  gap: 18px;
  align-content: start;
}

.service-skill-scroll-pane {
  max-height: min(38vh, 360px);
  overflow: auto;
  overscroll-behavior: contain;
}

.service-skill-tech-scroll {
  max-height: min(52vh, 520px);
}

.service-skill-multi {
  width: 100%;
  min-width: 180px;
  max-width: 280px;
  font-size: 12px;
  line-height: 1.35;
}

.service-skill-tech-row td {
  vertical-align: top;
}

.service-skill-tech-row.row-focus td {
  background: rgba(0, 168, 150, 0.08);
}

.service-skill-picker-scroll {
  max-height: min(42vh, 320px);
  overflow: auto;
  overscroll-behavior: contain;
}

.service-skill-tech-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 12px;
  padding: 0 16px 16px;
}

.service-skill-tech-card {
  border: 1px solid var(--border, #d8dee9);
  border-radius: 10px;
  padding: 12px;
  background: var(--panel, #fff);
}

.service-skill-tech-card header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 8px;
  margin-bottom: 8px;
}

.service-skill-tech-card .permission-grid.compact {
  max-height: 220px;
  overflow: auto;
  margin-bottom: 8px;
}

.ro-spreadsheet-line {
  white-space: nowrap;
}

.ro-spreadsheet-text small {
  display: block;
  line-height: 1.35;
}

.ro-overview-lines-table tbody tr,
.ro-detail-lines-table tbody tr {
  cursor: pointer;
}

.detail-compact .facts {
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
}

.deal-section-title-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 4px;
}

.ro-line-preview-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 8px;
  margin-bottom: 10px;
}

.ro-line-preview-card {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 6px;
  width: 100%;
  text-align: left;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface, #fff);
  cursor: pointer;
  transition: border-color .15s, box-shadow .15s, background .15s;
}

.ro-line-preview-card:hover {
  border-color: var(--accent, #0d9488);
  box-shadow: 0 2px 8px rgba(0,0,0,.06);
}

.ro-line-preview-card.active {
  border-color: var(--accent, #0d9488);
  background: linear-gradient(180deg, rgba(13,148,136,.06), rgba(255,255,255,.98));
  box-shadow: 0 0 0 1px rgba(13,148,136,.25);
}

.ro-line-preview-card.editing {
  border-width: 2px;
}

.ro-line-preview-card:focus-visible,
.ro-line-tab:focus-visible {
  outline: 2px solid var(--accent, #0d9488);
  outline-offset: 2px;
}

.ro-line-editing-pill {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .3px;
}

.ro-line-preview-action {
  font-size: 10px;
  opacity: .7;
}

.ro-line-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 0 0 10px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--line);
}

.ro-line-tab {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--surface, #fff);
  font-size: 12px;
  cursor: pointer;
  transition: border-color .15s, background .15s, box-shadow .15s;
}

.ro-line-tab:hover {
  border-color: var(--accent, #0d9488);
  background: rgba(13,148,136,.04);
}

.ro-line-tab.active {
  border-color: var(--accent, #0d9488);
  background: rgba(13,148,136,.1);
  box-shadow: 0 0 0 1px rgba(13,148,136,.2);
}

.ro-line-tab .line-badge.sm {
  font-size: 10px;
  padding: 1px 5px;
}

.ro-line-tab-label {
  max-width: 140px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ro-line-collapsed-hint {
  margin: 12px 0 0;
  padding: 10px 12px;
  border: 1px dashed var(--line);
  border-radius: 8px;
  text-align: center;
}

.ro-line-save-status {
  font-size: 11px;
  font-weight: 600;
  color: var(--muted);
  min-width: 72px;
  text-align: right;
  transition: color .2s;
}

.ro-line-save-status[data-state="saving"] {
  color: var(--accent, #0d9488);
}

.ro-line-save-status[data-state="saved"] {
  color: #059669;
}

.ro-line-save-status[data-state="error"] {
  color: #dc2626;
}

.ro-line-expanded-footer {
  margin-top: 12px;
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.ro-line-expanded-footer .primary {
  margin-left: auto;
}

.ro-line-expanded-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.ro-lines-progress-wrap {
  border-top: 1px solid var(--line);
  padding-top: 12px !important;
}

.ro-lines-progress-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  font-size: 12px;
  margin-bottom: 6px;
}

.ro-progress-bar {
  height: 6px;
  border-radius: 999px;
  background: rgba(0,0,0,.06);
  overflow: hidden;
}

.ro-progress-fill {
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--accent, #0d9488), #34d399);
  transition: width .35s ease;
}

.ro-line-preview-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}

.ro-line-preview-head strong {
  font-size: 13px;
}

.ro-line-preview-ccc {
  margin: 0;
  font-size: 12px;
  line-height: 1.35;
  color: var(--ink);
}

.ro-line-preview-cause {
  margin: 0;
  font-size: 11px;
}

.ro-line-preview-meta {
  font-size: 11px;
  color: var(--muted);
}

.line-detail-form {
  display: grid;
  gap: 16px;
  padding: 18px;
}

.line-detail-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: linear-gradient(180deg, rgba(255,255,255,.94), rgba(248,250,252,.9));
}

.line-detail-hero h3 {
  margin: 8px 0 4px;
  font-size: 18px;
  letter-spacing: 0;
}

.line-detail-hero p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}

.line-money {
  min-width: 150px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  text-align: right;
}

.line-money span,
.line-money small {
  display: block;
  color: var(--muted);
  font-size: 12px;
}

.line-money strong {
  display: block;
  margin: 3px 0;
  font-size: 24px;
  color: var(--ink);
}

.line-facts,
.part-facts-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.ccc-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.ccc-grid label,
.line-edit-grid label {
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
}

.line-edit-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.line-edit-grid label {
  min-width: 0;
}

.line-edit-grid .ro-opcode-search-wrap {
  flex: unset;
  width: 100%;
  min-width: 0;
}

.line-edit-grid .wide {
  grid-column: 1 / -1;
}

.check-card {
  align-content: center;
  min-height: 52px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255,255,255,.74);
}

.check-card input {
  width: auto;
  margin-right: 8px;
}

.line-subsection {
  display: grid;
  gap: 10px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255,255,255,.72);
}

.line-subsection header,
.parts-doc-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.line-subsection h3 {
  margin: 0;
  font-size: 15px;
}

.operating-mode-panel {
  display: grid;
  gap: 12px;
  padding: 16px;
  margin-bottom: 4px;
  border: 2px solid var(--line);
  border-radius: 10px;
  background: linear-gradient(180deg, rgba(255,255,255,.95), rgba(248,250,252,.88));
  box-shadow: var(--shadow-sm, 0 1px 2px rgba(0,0,0,.06));
}

.operating-mode-panel > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.operating-mode-toggle-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 10px;
}

.operating-mode-option {
  display: grid;
  gap: 4px;
  padding: 12px 14px;
  border: 2px solid var(--line);
  border-radius: 10px;
  cursor: pointer;
  background: rgba(255,255,255,.8);
  transition: border-color var(--fast) var(--ease), background var(--fast) var(--ease);
}

.operating-mode-option.is-active {
  border-color: var(--accent, #2563eb);
  background: rgba(37,99,235,.06);
}

.operating-mode-option input {
  margin-right: 8px;
}

.operating-mode-option small {
  color: var(--muted);
  line-height: 1.35;
}

.operating-mode-topbar-btn {
  display: inline-flex;
  align-items: center;
  padding: 4px 8px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: rgba(255,255,255,.72);
  cursor: pointer;
}

.operating-mode-topbar-btn:hover {
  border-color: var(--accent, #2563eb);
  background: rgba(37,99,235,.08);
}

.operating-mode-topbar-readonly {
  display: inline-flex;
  align-items: center;
}

.permission-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(185px, 1fr));
  gap: 8px;
}

.company-forms-panel .company-forms-intro { margin: 0 0 10px; }
.company-forms-toolbar { flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 10px; }
.company-forms-toolbar input[type="search"] { flex: 1 1 220px; min-width: 180px; }
.company-forms-scroll {
  max-height: 300px;
  overflow-y: auto;
  padding: 10px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--surface, #fff);
}
.company-form-row {
  align-items: flex-start;
  padding: 8px 10px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface, #fff);
}
.company-form-row.company-form-suggested {
  border-color: rgba(11, 122, 110, .35);
  background: rgba(11, 122, 110, .04);
}

/* Forms Command Center — hover Print / Preview popup (stays inside card so scroll does not clip) */
.forms-cc-filters {
  display: grid;
  gap: 8px;
  margin-bottom: 8px;
}
.forms-cc-vendor-bar {
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 1px solid rgba(122, 58, 79, 0.18);
  border-radius: 10px;
  background: linear-gradient(180deg, #fff7fa 0%, #fff 100%);
}
.forms-cc-vendor-heading {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 10px;
  align-items: baseline;
  justify-content: space-between;
}
.forms-cc-vendor-heading strong {
  font-size: 13px;
  color: var(--forms-pink-ink, #7a3a4f);
}
.forms-cc-vendor-checks {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 10px;
}
.forms-cc-vendor-check {
  margin: 0;
  padding: 4px 8px;
  border: 1px solid var(--border, #e2e8f0);
  border-radius: 8px;
  background: #fff;
  font-size: 12px;
  font-weight: 600;
}
.forms-cc-vendor-check input {
  margin: 0;
}
.forms-cc-vendor-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}
.forms-cc-vendor-select {
  display: grid;
  gap: 4px;
  margin: 0;
  flex: 1 1 240px;
  min-width: 200px;
  font-size: 11px;
  font-weight: 700;
  color: var(--forms-pink-ink, #7a3a4f);
  text-transform: none;
  letter-spacing: 0;
}
.forms-cc-vendor-select select {
  width: 100%;
  min-height: 36px;
  font-size: 13px;
  font-weight: 600;
}
.forms-cc-apply-bar .primary,
.forms-cc-apply-bar .secondary {
  min-height: 36px;
}
.forms-cc-search {
  width: 100%;
  min-width: 0;
}
.forms-cc-filter-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 8px;
  align-items: end;
}
.forms-cc-filter-row label {
  display: grid;
  gap: 4px;
  margin: 0;
  font-size: 11px;
  font-weight: 600;
  color: var(--muted, #64748b);
  text-transform: none;
  letter-spacing: 0;
}
.forms-cc-filter-row select {
  width: 100%;
  min-width: 0;
  font-size: 13px;
  font-weight: 500;
}
.forms-cc-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}
.forms-cc-form-card {
  flex-direction: column;
  align-items: stretch;
  gap: 6px;
  position: relative;
  min-width: 0;
  transition: border-color var(--fast, 120ms) ease, box-shadow var(--fast, 120ms) ease;
}
.forms-cc-form-card:hover,
.forms-cc-form-card:focus-within {
  border-color: rgba(0, 180, 166, .45);
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.08);
  z-index: 2;
}
.forms-cc-form-main {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  width: 100%;
  min-width: 0;
}
.forms-cc-form-check {
  display: flex;
  gap: 8px;
  align-items: flex-start;
  min-width: 0;
  width: 100%;
  cursor: pointer;
  font: inherit;
  font-weight: 600;
}
.forms-cc-form-check input[type="checkbox"] {
  margin-top: 2px;
  flex: 0 0 auto;
}
.forms-cc-form-copy {
  display: grid;
  gap: 2px;
  min-width: 0;
  flex: 1 1 auto;
}
.forms-cc-form-copy strong {
  display: block;
  font-size: 13px;
  line-height: 1.3;
  font-weight: 700;
  color: var(--ink, #0f172a);
  overflow-wrap: anywhere;
  word-break: break-word;
}
.forms-cc-form-copy small {
  display: block;
  font-weight: 500;
  line-height: 1.35;
  overflow-wrap: anywhere;
}
.forms-cc-form-badges {
  display: flex;
  gap: 6px;
  align-items: center;
  flex-wrap: wrap;
}
.forms-cc-form-popup {
  display: none;
  margin-top: 2px;
  padding: 8px;
  border: 1px solid var(--border, #e2e8f0);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.1);
  gap: 6px;
  flex-wrap: wrap;
  align-items: center;
}
.forms-cc-form-card:hover .forms-cc-form-popup,
.forms-cc-form-card:focus-within .forms-cc-form-popup {
  display: flex;
}
.forms-cc-form-popup button {
  flex: 1 1 auto;
  min-width: 84px;
}
.company-form-label {
  display: grid;
  gap: 2px;
  flex: 1;
}
.company-form-label strong { font-size: 13px; line-height: 1.25; }
.company-form-label small { color: var(--muted); font-size: 11px; line-height: 1.3; }
.company-form-badge { margin-top: 4px; width: fit-content; }

.panel-header-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.panel-header-actions .primary {
  min-height: 34px;
  padding: 0 14px;
  font-size: 13px;
}

.line-part-editor {
  grid-template-columns: minmax(220px, 2fr) 80px repeat(3, minmax(120px, 1fr)) auto;
}

.deal-scenario-editor {
  grid-template-columns: minmax(140px, 1fr) repeat(5, minmax(92px, 1fr)) auto;
}

.table-wrap input,
.table-wrap select {
  max-width: 100%;
}

.sticky-actions {
  position: sticky;
  bottom: 0;
  padding: 12px 16px 14px;
  background: linear-gradient(180deg, rgba(255,255,255,.55), var(--panel));
  border-top: 1px solid var(--line);
  box-shadow: 0 -10px 28px rgba(15, 23, 42, 0.08);
  backdrop-filter: blur(8px);
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  align-items: center;
  z-index: 5;
}

.detail-sticky-save-bar {
  justify-content: flex-end;
}

.detail-sticky-save-bar .detail-save-hint {
  flex: 1 1 200px;
  margin: 0;
  line-height: 1.35;
}

.detail-sticky-save-bar .primary[type="submit"],
.detail-sticky-save-bar button.primary[type="submit"] {
  min-width: 140px;
  font-weight: 600;
}

.mgmt-queue-modal {
  max-height: min(52vh, 520px);
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.72);
}

.module-scroll-region {
  max-height: min(52vh, 560px);
  overflow: auto;
  overscroll-behavior: contain;
}

.module-table-more {
  padding-top: 0;
}

.workflow-modal-shell {
  display: flex;
  flex-direction: column;
  max-height: calc(100dvh - 32px);
  min-height: 0;
  width: 100%;
}

dialog#quickAction {
  overflow: hidden;
  max-height: calc(100dvh - 16px);
}

dialog#quickAction[open] {
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

dialog#quickAction[open] .workflow-modal-shell {
  max-height: calc(100dvh - 32px);
  overflow: hidden;
}

.workflow-modal-shell > .modal-header,
.workflow-modal-shell > .workflow-tabs,
.workflow-modal-shell > #workflowTabs,
.workflow-form-actions {
  flex-shrink: 0;
}

.workflow-tabs,
#workflowTabs {
  position: sticky;
  top: 0;
  z-index: 3;
  background: #fff;
  flex-shrink: 0;
}

.workflow-form-scroll {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
  padding: 16px 22px 8px;
}

.workflow-form-actions {
  flex: 0 0 auto;
  position: sticky;
  bottom: 0;
  z-index: 2;
  margin: 0;
}

.inv-grid.module-scroll-region {
  max-height: min(42vh, 460px);
}

.prospects-kpi-strip .kpi,
.inventory-stock-panel .filter-chip {
  scroll-margin-top: 12px;
}

.parts-document-save-bar {
  margin: 0;
  padding: 12px 16px 14px;
  gap: 12px;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  z-index: 2;
}

.parts-document-save-bar .parts-doc-save-hint {
  flex: 1 1 220px;
  margin: 0;
}

.parts-doc-card {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255,255,255,.76);
  cursor: pointer;
}

.parts-doc-card button,
.parts-doc-card input,
.parts-doc-card select,
.parts-doc-card textarea {
  cursor: auto;
}

.parts-doc-head > span,
.parts-doc-head .parts-doc-open {
  display: grid;
  gap: 3px;
  text-align: left;
}

.workflow-list-footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px 12px;
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px dashed var(--line);
}

.parts-doc-more-lines {
  margin: 6px 0 0;
  padding-left: 4px;
}

.parts-line-list {
  display: grid;
  gap: 8px;
  max-height: min(62vh, 640px);
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
}

.parts-line-button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  min-height: 58px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  color: var(--ink);
  text-align: left;
  cursor: pointer;
}

.parts-line-button:hover {
  border-color: rgba(0,180,166,.42);
  box-shadow: var(--shadow-sm);
}

.parts-line-button span {
  display: grid;
  gap: 3px;
}

.parts-line-button small {
  color: var(--muted);
  font-size: 12px;
}

.line-history-grid {
  align-items: start;
}

.login-intro {
  margin: -2px 0 10px;
  color: var(--muted);
  font-size: 12.5px;
  line-height: 1.45;
}

.signout-button {
  min-height: 34px;
  padding: 0 12px;
  border-radius: 8px;
  font-size: 12px;
  font-weight: 800;
  background: var(--red);
  border: 1px solid rgba(220,38,38,.72);
  color: #fff;
}

.topbar-help-button {
  min-height: 34px;
  padding: 0 12px;
  border-radius: 8px;
}

/* Fixed Help control for iPhone/iPad (no F1 key) */
.mobile-help-fab {
  display: none;
  position: fixed;
  right: max(14px, env(safe-area-inset-right, 0px));
  bottom: max(14px, env(safe-area-inset-bottom, 0px));
  z-index: 90;
  min-height: 36px;
  padding: 0 14px;
  border: 1px solid rgba(37, 99, 235, 0.35);
  border-radius: 999px;
  background: var(--blue, #2563eb);
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  box-shadow: var(--shadow-md, 0 8px 24px rgba(15, 23, 42, 0.18));
  cursor: pointer;
  align-items: center;
  justify-content: center;
  -webkit-tap-highlight-color: transparent;
}

.mobile-help-fab:active {
  transform: scale(0.97);
}

body.tour-active .mobile-help-fab {
  display: none !important;
}

@media (max-width: 1024px), ((hover: none) and (pointer: coarse)) {
  .shell:not([hidden]) ~ .mobile-help-fab {
    display: inline-flex;
  }

  .shell:not([hidden]) main {
    padding-bottom: calc(14px + env(safe-area-inset-bottom, 0px) + 52px);
  }
}

.status-link {
  border: 0;
  min-height: 0;
  padding: 4px 8px;
}

.status-link:hover {
  filter: brightness(.97);
  box-shadow: var(--shadow-sm);
}

.bulk-action-bar,
.dispatch-summary-grid,
.module-report-grid {
  display: grid;
  gap: 8px;
  padding: 12px 16px;
}

.bulk-action-bar {
  grid-template-columns: auto repeat(4, minmax(120px, 1fr)) auto auto auto;
  align-items: center;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: rgba(15,25,35,.035);
}

.bulk-action-bar input {
  min-width: 0;
}

.inventory-search-bar {
  display: grid;
  grid-template-columns: minmax(220px, 2fr) minmax(140px, 1fr) auto auto auto auto;
  gap: 10px;
  align-items: center;
}

.inventory-bulk-grid {
  grid-template-columns: repeat(4, minmax(120px, 1fr)) auto auto auto;
}

.inventory-page-bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 8px 16px;
  border-bottom: 1px solid var(--line);
}

.inventory-page-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.inventory-selected-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 12px 16px;
}

.inventory-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: var(--surface-2, rgba(0,0,0,.03));
  font-size: 12px;
  cursor: pointer;
}

.inventory-chip span {
  opacity: .65;
}

.inventory-count-hero {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px;
  margin-bottom: 10px;
  border-radius: 8px;
  background: rgba(37,99,235,.05);
  border: 1px solid rgba(37,99,235,.15);
}

.inventory-count-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  align-items: center;
}

.inventory-low-row {
  background: rgba(245,166,35,.06);
}

.count-health-strip {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 12px;
  padding: 0 4px;
}
.inventory-freeze-banner {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  margin: 0 0 12px; padding: 10px 14px; border-radius: 10px;
  background: rgba(220, 38, 38, .1); border: 1px solid rgba(220, 38, 38, .35);
  color: #b91c1c; font-size: 13px;
}
.inventory-freeze-banner strong { font-weight: 700; }
.oem-transmission-banner {
  display: flex; flex-direction: column; gap: 6px;
  margin: 0 0 12px; padding: 10px 14px; border-radius: 10px;
  background: rgba(37, 99, 235, .06); border: 1px solid rgba(37, 99, 235, .22);
  font-size: 13px;
}
.oem-transmission-banner--independent {
  background: rgba(107, 114, 128, .08); border-color: rgba(107, 114, 128, .25);
}
.oem-transmission-banner-main {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
}
.oem-transmission-banner-main strong { font-weight: 700; }
.oem-transmission-banner-detail {
  display: flex; flex-wrap: wrap; gap: 8px 14px; align-items: center;
}
.parts-analytics-panel .kpis { margin-top: 0; }
.module-health-panel.healthy { border-color: rgba(22,163,74,.25); }
.module-health-panel .source-row { padding: 8px 16px; }

.count-health-kpi {
  flex: 1 1 120px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 10px 12px;
  border-radius: 8px;
  background: rgba(37,99,235,.05);
  border: 1px solid rgba(37,99,235,.15);
}

.count-health-kpi.warn {
  background: rgba(245,166,35,.08);
  border-color: rgba(245,166,35,.3);
}

.count-health-num { font-size: 22px; font-weight: 700; }
.count-health-label { font-size: 12px; color: var(--muted, #667085); text-transform: uppercase; letter-spacing: .04em; }

.count-pad-builder {
  margin-bottom: 12px;
  border: 1px dashed rgba(37,99,235,.3);
}

.count-pad-grid {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) repeat(3, auto);
  gap: 10px 16px;
  align-items: center;
  margin-bottom: 10px;
}

.count-pad-grid label { display: flex; flex-direction: column; gap: 4px; font-size: 13px; }
.count-pad-grid label.checkbox-inline { flex-direction: row; align-items: center; gap: 6px; }

.count-pad-chips {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin-bottom: 10px;
}

.count-pad-chips .chip {
  padding: 3px 10px;
  border-radius: 999px;
  border: 1px solid rgba(37,99,235,.3);
  background: transparent;
  cursor: pointer;
  font-size: 12px;
}

.count-pad-chips .chip.active {
  background: rgba(37,99,235,.15);
  border-color: rgba(37,99,235,.6);
  font-weight: 600;
}

.count-pad-actions { display: flex; gap: 10px; flex-wrap: wrap; }

.count-program-panel .count-program-toolbar { flex-wrap: wrap; gap: 8px; }
.count-program-table { max-height: 320px; overflow: auto; }
.count-program-more, .count-program-open-header { padding: 8px 16px; }
.daily-count-panel { margin: 12px 0; border: 1px solid var(--border, #e5e7eb); }
.inventory-count-toolbar { flex-wrap: wrap; gap: 8px; margin-bottom: 8px; }
.inventory-count-lines { max-height: 420px; overflow: auto; }
.reorder-po-draft-form .reorder-po-supplier-group { margin-bottom: 12px; }
.reorder-po-draft-form .reorder-po-add-line { margin-top: 8px; }
.reorder-po-summary { margin-bottom: 12px; }

.part-quick-action-panel {
  margin: 12px 0;
  padding: 14px 16px;
  border: 1px solid var(--line, #d0d5dd);
  border-radius: 10px;
  background: var(--panel-muted, #f8fafc);
}
.parts-order-list-panel .ro-part-add { margin-bottom: 12px; }
.new-parts-order-launch {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  margin: 0 0 14px;
  padding: 16px 18px;
  border: 2px solid var(--blue, #2563eb);
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(37, 99, 235, 0.08), rgba(37, 99, 235, 0.02));
}
.new-parts-order-launch-copy strong { display: block; font-size: 1.05rem; margin-bottom: 4px; }
.new-parts-order-launch-btn { min-width: 180px; font-size: 1rem; padding: 12px 20px; }
.create-po-session-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  margin: 0 0 12px;
  padding: 12px 14px;
  border-radius: 10px;
  border: 1px solid #86efac;
  background: rgba(22, 163, 74, 0.08);
}
.create-po-session-banner strong { display: block; }
.create-po-wizard .create-po-steps,
.inventory-count-steps,
.create-po-steps {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  list-style: none;
  margin: 0 0 14px;
  padding: 0;
}
.create-po-steps li,
.inventory-count-steps li {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px;
  border-radius: 999px;
  background: var(--panel-muted, #f1f5f9);
  color: var(--muted, #64748b);
  font-size: 12px;
  font-weight: 600;
}
.create-po-steps li span,
.inventory-count-steps li span {
  display: inline-grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: #cbd5e1;
  color: #0f172a;
  font-size: 11px;
}
.create-po-steps li.active,
.inventory-count-steps li.active {
  background: rgba(37, 99, 235, 0.12);
  color: #1d4ed8;
}
.create-po-steps li.active span,
.inventory-count-steps li.active span {
  background: #2563eb;
  color: #fff;
}
.create-po-steps-compact { margin-bottom: 10px; }
.create-po-outcome-hints {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 10px;
  margin-top: 12px;
}
.create-po-outcome-hints div {
  padding: 10px 12px;
  border-radius: 8px;
  background: var(--panel-muted, #f8fafc);
  border: 1px solid var(--line, #e2e8f0);
}
.create-po-outcome-hints strong { display: block; margin-bottom: 4px; }
.create-po-outcome-hints small { color: var(--muted, #64748b); }
.parts-order-list-footer-guided {
  align-items: center;
}
.parts-order-list-footer-step {
  flex: 1 1 180px;
}
.parts-order-step-label {
  display: inline-block;
  font-weight: 700;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #1d4ed8;
}
.inventory-count-next-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  margin: 0 0 14px;
  padding: 12px 14px;
  border-radius: 10px;
  border: 1px solid #93c5fd;
  background: rgba(37, 99, 235, 0.08);
}
.inventory-count-next-card.muted {
  border-color: var(--line, #e2e8f0);
  background: var(--panel-muted, #f8fafc);
}
.inventory-count-next-card strong { display: block; }
.inventory-count-next-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.new-parts-order-modal .new-parts-order-panel { margin-top: 0; }
.new-parts-order-modal .new-parts-order-tabs { margin: 12px 0; }
.new-parts-order-catalog-tools {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-bottom: 10px;
}
.new-parts-order-catalog-tools input[type="search"],
.new-parts-order-catalog-tools input[type="text"] { flex: 1 1 240px; min-width: 200px; }
.new-parts-order-line-entry-stack {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.new-parts-order-line-entry {
  align-items: center;
}
.new-parts-order-line-entry .classic-entry-num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.6rem;
  height: 1.6rem;
  border-radius: 999px;
  background: var(--surface-2, rgba(0,0,0,.06));
  font-size: 12px;
  font-weight: 700;
  flex-shrink: 0;
}
.new-parts-order-sheet { margin-top: 14px; }
.po-receive-panel { margin-top: 12px; }

.count-variance-cell.text-red,
.text-red { color: #dc2626; }
.count-variance-cell.text-green,
.text-green { color: #16a34a; }

.dispatch-summary-grid {
  grid-template-columns: 1.4fr .8fr;
  padding: 0 0 12px;
}

.tech-job.suggested {
  border: 1px dashed rgba(37,99,235,.45);
  background: var(--blue-soft);
  color: var(--blue);
}

.help-hero-panel .panel-filters {
  border-top: 1px solid var(--line);
}

.help-release-strip:not(:has(> div)) {
  display: block;
  grid-template-columns: unset;
  padding: 10px 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.76);
  font-size: 12.5px;
  line-height: 1.45;
}

.help-release-strip {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  padding: 14px 16px;
}

.help-release-strip > div,
.help-card {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255,255,255,.76);
}

.help-release-strip > div {
  display: grid;
  gap: 4px;
  padding: 12px;
}

.help-release-strip strong,
.help-release-strip small,
.help-meta-row span {
  color: var(--muted);
  font-size: 12px;
}

.help-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.help-perm-grid {
  display: grid;
  gap: 6px;
  margin-top: 10px;
}

.help-perm-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel, #fff);
}

.help-perm-row.denied { opacity: 0.78; }
.help-perm-mark { width: 1.2em; text-align: center; font-weight: 700; flex-shrink: 0; }
.help-perm-row strong { flex: 1; min-width: 0; }

.help-overlay-grid {
  max-height: min(52vh, 520px);
  overflow: auto;
  margin-top: 12px;
}

.help-overlay-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}

.help-overlay-filters input[type="search"] {
  flex: 1 1 220px;
  min-width: 180px;
}

.help-overlay-card {
  min-height: 0;
}

.help-release-popup {
  max-height: min(56vh, 560px);
  overflow: auto;
}

.sandbox-blocked-popup .sandbox-blocked-list {
  margin: 12px 0 0;
  padding-left: 20px;
}

.sandbox-blocked-popup .sandbox-blocked-list li {
  margin-bottom: 6px;
}

.integration-sandbox-note button {
  margin-left: 6px;
  vertical-align: middle;
}

.help-card {
  padding: 16px;
}

.help-card header {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: start;
  margin-bottom: 12px;
}

.help-card h3 {
  margin: 4px 0 0;
  font-size: 16px;
}

.help-feature-list {
  display: grid;
  gap: 12px;
}

.help-feature-list section {
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255,255,255,.6);
}

.help-feature-list h4 {
  margin: 0 0 6px;
  font-size: 13px;
}

.help-feature-list p {
  margin: 0;
  color: var(--ink);
  font-size: 12.5px;
  line-height: 1.45;
}

.help-meta-row {
  display: grid;
  gap: 4px;
  margin-top: 8px;
}

.module-report-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

body.dark-mode .line-detail-hero,
body.dark-mode .line-subsection,
body.dark-mode .parts-doc-card,
body.dark-mode .check-card,
body.dark-mode .parts-line-button,
body.dark-mode .help-card,
body.dark-mode .help-release-strip > div,
body.dark-mode .help-feature-list section {
  background: rgba(15,23,42,.72);
}

@media (max-width: 900px) {
  .line-detail-hero,
  .parts-doc-head,
  .line-subsection header {
    align-items: flex-start;
    flex-direction: column;
  }

  .line-money {
    width: 100%;
    text-align: left;
  }

  .line-facts,
  .part-facts-grid,
  .ccc-grid,
  .line-edit-grid {
    grid-template-columns: 1fr;
  }

  .bulk-action-bar,
  .dispatch-summary-grid,
  .help-release-strip,
  .help-grid,
  .module-report-grid {
    grid-template-columns: 1fr;
  }
  .shop-lanes {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .shop-ro-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .shop-view-grid {
    grid-template-columns: 1fr;
  }
}

/* ── Industry-standard workflow panels ─────────────────────────────────────── */
.opportunity-center-panel .opportunity-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 14px;
}

.opportunity-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 12px;
}

.opportunity-card {
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 14px;
  background: var(--panel);
  display: grid;
  gap: 8px;
}

.opportunity-card header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.opportunity-card h4 {
  margin: 0;
  font-size: 14px;
  line-height: 1.35;
}

.opp-score {
  font-size: 20px;
  color: var(--brand);
}

.opp-owner {
  color: var(--muted);
  font-size: 11px;
}

.opportunity-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}

.recon-board {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
}

.shop-lanes {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.recon-lane,
.shop-lane {
  background: var(--bg);
  border: 1px solid var(--line);
  border-radius: 10px;
  min-height: 220px;
  display: flex;
  flex-direction: column;
}

.shop-lane-waiting { border-top: 3px solid var(--blue, #3b82f6); }
.shop-lane-active { border-top: 3px solid var(--gold, #d4a017); }
.shop-lane-qc { border-top: 3px solid var(--purple, #8b5cf6); }
.shop-lane-ready { border-top: 3px solid var(--green, #16a34a); }

.recon-lane-head,
.shop-lane-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 12px;
  border-bottom: 1px solid var(--line);
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .3px;
}

.recon-lane-body,
.shop-lane-cards {
  padding: 10px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex: 1;
  min-height: 120px;
  border-radius: 0 0 10px 10px;
  transition: background .15s ease;
}

.shop-lane.drop-active .shop-lane-cards,
.shop-lane-cards.drop-active,
.shop-lane.drop-active {
  background: rgba(0, 180, 166, .12);
  outline: 2px dashed var(--porter-teal);
  outline-offset: -4px;
}

.shop-lane.drop-denied .shop-lane-cards,
.shop-lane-cards.drop-denied,
.shop-lane.drop-denied {
  background: rgba(239, 68, 68, .08);
  outline: 2px dashed var(--red, #ef4444);
  outline-offset: -4px;
}

.recon-lane.drop-active .recon-lane-cards,
.recon-lane-cards.drop-active,
.recon-lane.drop-active {
  background: rgba(0, 180, 166, .12);
  outline: 2px dashed var(--porter-teal);
  outline-offset: -4px;
}

.recon-lane.drop-denied .recon-lane-cards,
.recon-lane-cards.drop-denied,
.recon-lane.drop-denied {
  background: rgba(239, 68, 68, .08);
  outline: 2px dashed var(--red, #ef4444);
  outline-offset: -4px;
}

.shop-ro-card[draggable="true"],
.recon-card[draggable="true"] {
  touch-action: none;
}

.shop-lane-empty {
  color: var(--muted);
  font-size: 12px;
  text-align: center;
  padding: 24px 8px;
  margin: 0;
  border: 1px dashed var(--line);
  border-radius: 8px;
}

.recon-card,
.shop-ro-card {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 10px;
  display: grid;
  gap: 8px;
  cursor: grab;
  transition: border-color var(--fast) var(--ease), box-shadow var(--fast) var(--ease), transform var(--fast) var(--ease);
}

.shop-ro-card.dragging {
  opacity: .5;
  cursor: grabbing;
}

.shop-ro-card.active,
.shop-ro-card:hover {
  border-color: rgba(0, 180, 166, .45);
  box-shadow: var(--shadow-sm);
}

.shop-ro-top {
  display: flex;
  align-items: center;
  gap: 8px;
}

.shop-ro-grip {
  color: var(--muted);
  font-size: 14px;
  line-height: 1;
  cursor: grab;
  user-select: none;
}

.shop-ro-body {
  display: grid;
  gap: 4px;
  cursor: pointer;
}

.shop-ro-customer {
  font-size: 13px;
  font-weight: 700;
}

.shop-ro-tech {
  font-size: 11px;
  color: var(--muted);
}

.shop-ro-concern {
  margin: 0;
  font-size: 11px;
  color: var(--muted);
  line-height: 1.4;
}

.shop-ro-actions {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
  margin-top: 2px;
  padding-top: 8px;
  border-top: 1px solid var(--line);
}

.shop-action-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  min-height: 52px;
  padding: 6px 4px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--bg);
  color: var(--text);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .2px;
  cursor: pointer;
  transition: border-color var(--fast) var(--ease), background var(--fast) var(--ease), transform var(--fast) var(--ease);
}

.shop-action-btn:hover {
  border-color: rgba(0, 180, 166, .45);
  background: rgba(0, 180, 166, .06);
  transform: translateY(-1px);
}

.shop-action-btn.done {
  border-color: rgba(22, 163, 74, .35);
  background: rgba(22, 163, 74, .08);
}

.shop-action-icon {
  font-size: 14px;
  line-height: 1;
}

.shop-view-hint {
  margin: 0 0 12px;
  font-size: 12px;
  color: var(--muted);
}

.shop-promise {
  color: var(--gold);
  font-weight: 600;
}

.shop-view-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin-bottom: 12px;
  font-size: 13px;
}

.shop-view-grid {
  display: grid;
  grid-template-columns: 1.2fr 0.9fr 0.9fr;
  gap: 16px;
}

.shop-lines-panel header {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

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

.shop-line-row {
  display: grid;
  grid-template-columns: auto 1fr auto auto auto;
  gap: 8px;
  align-items: center;
  width: 100%;
  text-align: left;
  padding: 8px 10px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface);
  cursor: pointer;
  font: inherit;
  color: inherit;
  transition: border-color .15s, box-shadow .15s, background .15s;
}

.shop-line-row:hover {
  border-color: var(--accent, #0d9488);
  box-shadow: 0 2px 6px rgba(0,0,0,.05);
}

.shop-line-row.active {
  border-color: var(--accent, #0d9488);
  background: rgba(13,148,136,.06);
  box-shadow: 0 0 0 1px rgba(13,148,136,.2);
}

.shop-line-edit-hint {
  pointer-events: none;
  font-size: 11px;
}

.shop-line-main {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.shop-line-main small {
  color: var(--muted);
  font-size: 11px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.shop-line-tech {
  color: var(--muted);
  font-size: 11px;
  white-space: nowrap;
}

.mpi-panel .panel-body {
  display: grid;
  gap: 10px;
}

.mpi-tier {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: var(--panel);
}

.mpi-tier header {
  display: flex;
  justify-content: space-between;
  margin-bottom: 8px;
}

.mpi-tier ul {
  margin: 0 0 10px 18px;
  padding: 0;
  font-size: 13px;
  color: var(--muted);
}

.mpi-good { border-left: 3px solid var(--green); }
.mpi-better { border-left: 3px solid var(--blue); }
.mpi-best { border-left: 3px solid var(--purple); }

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

.recall-campaign-card {
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 14px;
  background: var(--panel);
}

.recall-campaign-card header {
  display: flex;
  justify-content: space-between;
  margin-bottom: 6px;
}

.deal-jacket-checklist {
  display: grid;
  gap: 8px;
  margin: 12px 0;
}

.jacket-item {
  display: grid;
  grid-template-columns: 28px 1fr auto;
  gap: 10px;
  align-items: center;
  width: 100%;
  text-align: left;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  cursor: pointer;
}

.jacket-item.done { background: var(--green-soft); border-color: rgba(16, 185, 129, .35); }
.jacket-item.pending { background: var(--gold-soft); border-color: rgba(245, 166, 35, .35); }

.jacket-progress-bar {
  height: 8px;
  background: var(--line);
  border-radius: 999px;
  overflow: hidden;
  position: relative;
}

.jacket-progress-bar.jacket-progress-lg {
  height: 12px;
  margin-bottom: 10px;
}

.jacket-progress-bar span,
.jacket-progress-bar small {
  display: block;
  margin-top: 6px;
  font-size: 11px;
  color: var(--muted);
}

.jacket-progress-fill {
  height: 100%;
  background: linear-gradient(90deg, var(--brand), var(--green));
  border-radius: 999px;
  transition: width .3s var(--ease);
}

.lender-rate-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 10px;
}

.lender-rate-card {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: var(--panel);
  display: grid;
  gap: 8px;
}

.lender-rate-card header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 8px;
}

.lender-rate-metrics {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 6px;
  font-size: 12px;
}

.lender-rate-metrics em {
  display: block;
  font-style: normal;
  color: var(--muted);
  font-size: 10px;
  text-transform: uppercase;
}

.enterprise-rollup-row {
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 14px;
  margin-bottom: 10px;
  background: var(--panel);
}

.rollup-company {
  margin-bottom: 10px;
}

.rollup-metrics {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
  gap: 10px;
  font-size: 13px;
}

.rollup-metrics em {
  display: block;
  font-style: normal;
  color: var(--muted);
  font-size: 10px;
  text-transform: uppercase;
}

.message-preview-panel textarea {
  width: 100%;
  font-family: inherit;
  font-size: 14px;
  line-height: 1.5;
  padding: 12px;
  border-radius: 8px;
  border: 1px solid var(--line);
  background: var(--bg);
  resize: vertical;
}

/* ── Technician portal & service shop login ─────────────────────────────────── */
.service-tech-login-bar {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  margin: 0 0 14px;
  padding: 14px 16px;
  border: 1px solid rgba(0, 180, 166, .28);
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(0, 180, 166, .08), rgba(37, 99, 235, .05));
}

.tech-login-form {
  display: grid;
  gap: 12px;
  padding: 0 4px 8px;
}

.tech-login-form label {
  display: grid;
  gap: 6px;
  font-size: 12px;
  font-weight: 700;
  color: var(--muted);
}

.tech-portal-banner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 14px;
  padding: 12px 16px;
  border-radius: 10px;
  background: var(--panel);
  border: 1px solid var(--line);
}

.tech-ro-card.clocked-in {
  border-color: rgba(16, 185, 129, .45);
  box-shadow: 0 0 0 1px rgba(16, 185, 129, .12);
}

.tech-ro-timebar {
  display: flex;
  justify-content: space-between;
  font-size: 12px;
  color: var(--muted);
  margin-bottom: 4px;
}

/* ── Sales forms hub & trade valuation ──────────────────────────────────────── */
.sales-forms-hub .forms-hub-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 12px;
  padding: 0 16px 16px;
}

.forms-hub-card {
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 12px;
  background: var(--panel);
  display: grid;
  gap: 6px;
  transition: border-color var(--fast) var(--ease), transform var(--fast) var(--ease);
}

.forms-hub-card:hover {
  border-color: rgba(0, 180, 166, .4);
  transform: translateY(-1px);
}

.forms-hub-card strong {
  font-size: 13px;
  line-height: 1.35;
}

.forms-hub-actions {
  display: flex;
  gap: 8px;
  margin-top: 4px;
}

.forms-hub-filters {
  padding: 0 16px 12px;
}

.forms-frequent-section {
  padding: 0 0 8px;
}

.forms-frequent-title {
  padding: 0 16px 8px;
}

.forms-frequent-grid {
  padding-top: 0;
}

.forms-frequent-empty,
.forms-hub-footnote {
  padding: 0 16px 16px;
}

.forms-hub-empty {
  padding: 0 16px 8px;
}

.forms-hub-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
}

.forms-hub-card-frequent {
  border-color: rgba(0, 180, 166, .28);
  background: linear-gradient(180deg, rgba(0, 180, 166, .05), transparent);
}

.forms-usage-badge {
  flex-shrink: 0;
}

.trade-val-cards {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 10px;
  margin-bottom: 10px;
}

.trade-val-cards article {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: var(--panel);
}

.trade-val-cards em {
  display: block;
  font-style: normal;
  font-size: 10px;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 4px;
}

.trade-val-cards strong {
  font-size: 18px;
}

.login-gate .login-intro {
  line-height: 1.6;
  color: var(--muted);
  font-size: 13.5px;
  margin-bottom: 14px;
}

#changePasswordMessage[role="alert"]:not(:empty) {
  color: var(--porter-red, #c0392b);
  font-weight: 600;
}

#superAdminChangePasswordMessage[role="alert"]:not(:empty) {
  color: var(--porter-red, #c0392b);
  font-weight: 600;
}

.login-card .brand span {
  line-height: 1.45;
}

.company-gate {
  width: min(820px, 100%);
  max-height: min(calc(100vh - 32px), 920px);
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: 0;
  overflow: hidden;
}

.company-gate-head,
.company-gate-body,
.company-gate-foot {
  padding-left: 24px;
  padding-right: 24px;
}

.company-gate-head {
  padding-top: 24px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(33, 97, 140, .1);
  background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.9));
}

.company-gate-intro {
  margin-bottom: 0;
}

.company-gate-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  display: grid;
  gap: 14px;
  padding-top: 16px;
  padding-bottom: 16px;
  scroll-padding-bottom: 16px;
}

.company-gate-foot {
  flex: 0 0 auto;
  display: grid;
  gap: 12px;
  padding-top: 14px;
  padding-bottom: 20px;
  border-top: 1px solid rgba(33, 97, 140, .12);
  background: rgba(248, 252, 255, .96);
  box-shadow: 0 -10px 28px rgba(24, 76, 110, .06);
}

.company-gate-toolbar {
  display: grid;
  gap: 12px;
  margin-bottom: 0;
}

.company-gate-welcome {
  display: grid;
  gap: 4px;
}

.company-gate-welcome strong {
  font-size: 18px;
}

.company-gate-continue-btn {
  width: 100%;
  justify-content: center;
  text-align: center;
}

.company-gate-filters {
  margin: 0;
}

.company-gate-search-hint {
  margin: -6px 0 0;
  font-size: 12px;
}

.company-gate-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(108px, 1fr));
  gap: 10px;
}

.company-gate-stat {
  display: grid;
  gap: 2px;
  padding: 10px 12px;
  border: 1px solid rgba(33, 97, 140, .14);
  border-radius: 10px;
  background: rgba(255,255,255,.82);
  text-align: center;
}

.company-gate-stat strong {
  font-size: 20px;
  line-height: 1.1;
  color: var(--ink);
}

.company-gate-stat small {
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--muted);
}

.company-gate-recent {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.company-gate-recent-label {
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
  color: var(--muted);
}

.company-gate-chip {
  border: 1px solid rgba(33, 97, 140, .18);
  border-radius: 999px;
  padding: 6px 12px;
  background: rgba(255,255,255,.88);
  color: var(--ink);
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}

.company-gate-chip:hover,
.company-gate-chip:focus-visible {
  border-color: rgba(0, 180, 166, .45);
  color: var(--porter-teal);
}

.company-gate-list {
  display: grid;
  gap: 10px;
  padding-right: 2px;
}

.company-gate-card {
  display: grid;
  gap: 0;
  width: 100%;
  border: 1px solid rgba(33, 97, 140, .16);
  border-radius: 10px;
  background: rgba(255,255,255,.88);
  overflow: hidden;
  transition: border-color var(--fast) var(--ease), box-shadow var(--fast) var(--ease), transform var(--fast) var(--ease);
}

.company-gate-card:hover,
.company-gate-card:focus-within {
  border-color: rgba(0, 180, 166, .45);
  box-shadow: 0 8px 24px rgba(24, 76, 110, .12);
  transform: translateY(-1px);
}

.company-gate-card-main {
  display: grid;
  gap: 6px;
  width: 100%;
  text-align: left;
  padding: 14px 16px 10px;
  border: 0;
  background: transparent;
  cursor: pointer;
  color: var(--ink);
  font: inherit;
  outline: none;
}

.company-gate-card-main:focus-visible {
  outline: 2px solid rgba(0, 180, 166, .55);
  outline-offset: -2px;
}

.company-gate-card-title,
.company-gate-card-main strong {
  color: var(--ink);
  font-size: 16px;
  font-weight: 700;
  line-height: 1.3;
  min-width: 0;
  flex: 1 1 auto;
}

.company-gate-card-main small,
.company-gate-card-meta,
.company-gate-card-locations {
  color: var(--muted);
}

.company-gate-card-foot {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 0 16px 14px;
}

.company-gate-card-locations {
  font-size: 12px;
  color: var(--muted);
  line-height: 1.45;
}

.company-switcher .company-gate-launcher {
  white-space: nowrap;
}

.company-gate-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.company-gate-card-head strong {
  font-size: 16px;
}

.company-gate-card small {
  color: var(--muted);
  line-height: 1.45;
}

.company-gate-card-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  font-size: 12px;
  color: var(--muted);
}

.company-gate-card-action {
  font-size: 12px;
  font-weight: 800;
  color: var(--porter-teal);
}

.company-gate-export {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 14px 16px;
  border: 1px solid rgba(33, 97, 140, .16);
  border-radius: 10px;
  background: rgba(255, 255, 255, .72);
}

.company-gate-export label {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--muted);
}

.company-gate-export-row,
.export-company-controls {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}

.company-gate-export-row select,
.export-company-controls select {
  min-width: min(100%, 280px);
  flex: 1 1 220px;
}

.export-company-row {
  align-items: flex-start;
}

.export-company-row > span {
  padding-top: 8px;
}

.company-gate-actions {
  display: grid;
  gap: 10px;
}

.company-gate-empty {
  display: grid;
  gap: 6px;
  padding: 18px;
  border: 1px dashed rgba(33, 97, 140, .24);
  border-radius: 10px;
  background: rgba(255,255,255,.72);
}

.workspace-boot-message {
  margin: 0 0 16px;
  padding: 18px 20px;
  border: 1px solid rgba(33, 97, 140, .18);
  background: rgba(255,255,255,.92);
  text-align: center;
}

body.dark-mode .workspace-boot-message {
  background: rgba(15, 23, 42, .88);
  border-color: rgba(148, 163, 184, .24);
}

.company-gate-signout {
  justify-self: start;
}

body.dark-mode .company-gate-card,
body.dark-mode .company-gate-empty,
body.dark-mode .company-gate-export,
body.dark-mode .company-gate-head,
body.dark-mode .company-gate-foot,
body.dark-mode .company-gate-stat {
  background: rgba(15, 23, 42, .72);
}

body.dark-mode .company-gate-card-main,
body.dark-mode .company-gate-card-title,
body.dark-mode .company-gate-card-main strong {
  color: var(--ink);
}

body.dark-mode .company-gate-card-main small,
body.dark-mode .company-gate-card-meta,
body.dark-mode .company-gate-card-locations {
  color: var(--muted);
}

.req { color: var(--gold); font-weight: 700; }

.module-quick-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 0 0 14px;
}

.module-chrome-top {
  position: sticky;
  top: 0;
  z-index: 24;
  margin: 0 0 6px;
  padding: 4px 0 2px;
  background: linear-gradient(180deg, var(--bg) 78%, transparent);
}

.module-chrome-top:has(.module-workspace-popover:not([hidden])) {
  z-index: 28;
}

.module-primary-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  padding: 8px 12px;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 12px;
  box-shadow: var(--shadow-sm);
}

.module-primary-actions-meta {
  display: grid;
  gap: 1px;
  min-width: min(120px, 100%);
}

.module-primary-actions-meta .eyebrow {
  font-size: 10px;
}

.module-primary-actions-meta strong {
  font-size: 14px;
  letter-spacing: -0.01em;
}

.module-primary-actions-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  flex: 1 1 280px;
  align-items: center;
}

.module-workspace-popover {
  position: absolute;
  left: 12px;
  right: 12px;
  top: calc(100% + 2px);
  z-index: 30;
}

.module-workspace-popover-inner {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 14px;
  box-shadow: var(--shadow-lg, 0 16px 40px rgba(0, 0, 0, .18));
  max-height: min(70vh, 560px);
  overflow: auto;
  padding: 12px 14px 14px;
}

.module-workspace-popover-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--line);
}

.module-workflow-popover {
  border-top: none;
  padding-top: 0;
}

.module-workspace-overview {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
}

.module-workspace-overview .module-overview-body {
  gap: 10px;
}

.sensitive-field-locked {
  color: var(--muted);
  background: var(--bg-soft, rgba(148, 163, 184, .12));
  cursor: not-allowed;
}

.credit-ssn-unlock-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  margin-top: 4px;
}

.credit-ssn-unlock-row small.meta {
  flex: 1 1 220px;
  margin-top: 0;
}

.fi-credit-ssn-field small.meta {
  display: block;
  margin-top: 4px;
}

.credit-applicant-strip {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  margin: 10px 0 4px;
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.7);
}
.credit-applicant-strip.needs-info {
  border-color: #c4a35a;
  background: rgba(234, 179, 8, 0.12);
}
.credit-applicant-strip.ready {
  border-color: rgba(34, 197, 94, 0.35);
  background: rgba(34, 197, 94, 0.08);
}
.credit-applicant-strip .meta {
  flex: 1 1 180px;
}
.credit-applicant-missing-prompt ul {
  margin: 8px 0 12px 1.2em;
}
.credit-applicant-missing-list {
  margin: 0 0 12px;
  padding: 8px 10px;
  border-radius: 8px;
  background: rgba(234, 179, 8, 0.12);
  border: 1px solid rgba(196, 163, 90, 0.45);
}
label.credit-field-required input,
.credit-field-required input {
  border-color: #c4a35a;
  box-shadow: 0 0 0 1px rgba(196, 163, 90, 0.25);
}
.credit-applicant-update-panel .inline-edit-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 10px 12px;
}
.credit-applicant-update-panel .inline-edit-grid label.wide {
  grid-column: 1 / -1;
}

.parts-order-source-picker {
  display: grid;
  gap: 6px;
}

.parts-order-source-picker .parts-order-source-select {
  width: 100%;
  min-height: 140px;
  border-radius: 10px;
}

.parts-order-source-picker option[hidden] {
  display: none;
}

.module-workspace-toggle[aria-expanded="true"] {
  background: var(--accent-soft, rgba(59, 130, 246, .12));
  border-color: var(--accent, #3b82f6);
}

.module-overview-panel.collapsed {
  margin-bottom: 10px;
}

.module-overview-panel .collapsible-panel-summary {
  padding: 0 16px 12px;
}

.view > .module-workflow-bar {
  margin-bottom: 10px;
}

.internal-messaging-panel .internal-compose-form {
  display: grid;
  grid-template-columns: 1.2fr 1fr 0.8fr;
  gap: 8px;
  align-items: start;
}

.internal-messaging-panel .internal-compose-form textarea {
  grid-column: 1 / -1;
}

.internal-message-list {
  display: grid;
  gap: 10px;
  padding: 12px 16px 16px;
  max-height: 420px;
  overflow: auto;
}

.internal-message {
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 12px 14px;
  background: var(--surface);
}

.internal-message.unread {
  border-color: rgba(212, 160, 23, 0.45);
  background: rgba(212, 160, 23, 0.06);
}

.internal-message.inbound { border-left: 4px solid var(--gold); }
.internal-message.outbound { border-left: 4px solid var(--blue); }

.internal-message header {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: flex-start;
  margin-bottom: 8px;
}

.internal-message p {
  margin: 0 0 8px;
  font-size: 14px;
  line-height: 1.45;
}

.internal-message-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.tech-dashboard-ro-list {
  display: grid;
  gap: 10px;
  padding: 14px 16px;
}

.tech-dashboard-ro {
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 12px 14px;
  background: var(--surface);
}

.tech-dashboard-ro.clocked-in {
  border-color: rgba(34, 197, 94, 0.45);
  background: rgba(34, 197, 94, 0.05);
}

.tech-dashboard-ro-head {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  align-items: center;
}

.tech-dashboard-lines {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 8px 0;
}

.tech-dashboard-ro-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.tech-dashboard-ro-list .empty,
.mini-panel .empty {
  padding: 16px;
  margin: 0;
}

button.compact,
.secondary.compact {
  min-height: 28px;
  padding: 0 10px;
  font-size: 12px;
}

.breadcrumbs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: var(--muted);
  margin-bottom: 2px;
}
.breadcrumb-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.breadcrumb-item button {
  background: none;
  border: 0;
  color: var(--porter-teal);
  font-weight: 600;
  cursor: pointer;
  padding: 0;
  font-size: 12px;
}
.breadcrumb-item.active strong { color: var(--ink); }
.breadcrumb-sep { opacity: 0.45; }
.search-sidebar { position: relative; }
.search-kbd {
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 10px;
  padding: 2px 6px;
  border-radius: 6px;
  background: rgba(255,255,255,.08);
  color: rgba(255,255,255,.45);
  border: 1px solid rgba(255,255,255,.12);
  pointer-events: none;
}
.shortcuts-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 18px;
  padding: 8px 4px 16px;
}
.shortcut-row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  font-size: 13px;
}
.shortcut-row kbd {
  font-size: 11px;
  padding: 2px 7px;
  border-radius: 6px;
  background: var(--surface-2);
  border: 1px solid var(--border);
}
.omni-result-item {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  text-align: left;
  padding: 10px 12px;
  border: 0;
  background: transparent;
  cursor: pointer;
  border-radius: 8px;
}
.omni-result-item:hover { background: var(--surface-2); }
.scenario-compare-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 10px;
  margin: 12px 0;
}
.scenario-compare-card {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 10px 12px;
  background: var(--surface);
}
.scenario-compare-card.best { border-color: var(--porter-teal); box-shadow: 0 0 0 1px rgba(0,180,166,.15); }

/* Customer 360 — unified journey insights */
.customer-360-workflow-top {
  padding: 14px 16px;
  border: 1px solid rgba(0, 180, 166, 0.28);
  border-radius: 12px;
  background: linear-gradient(180deg, #f8fffe 0%, #f2fbfb 100%);
}
.customer-360-workflow-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 6px 12px;
  margin-bottom: 10px;
}
.customer-360-workflow-head strong {
  font-size: 15px;
}
.customer-360-workflow-top .workflow-shortcuts {
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
}
.customer-360-top {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(280px, 0.8fr);
  gap: 14px;
  margin-bottom: 14px;
  align-items: start;
}
@media (max-width: 980px) {
  .customer-360-top {
    grid-template-columns: 1fr;
  }
}
.customer-insights-column {
  display: grid;
  gap: 12px;
  align-content: start;
}
.nba-card {
  padding: 14px 16px;
  background: linear-gradient(135deg, rgba(0,180,166,.08), rgba(255,193,7,.06));
  border: 1px solid var(--line);
  border-radius: 12px;
}
.nba-card.clickable-row {
  cursor: pointer;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.nba-card.clickable-row:hover {
  border-color: var(--porter-teal, #0d7377);
  box-shadow: 0 4px 16px rgba(13, 115, 119, .12);
}
.nba-card header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
}
.nba-card p { margin: 0 0 6px; font-size: 14px; }
.nba-card small { color: var(--muted); display: block; margin-bottom: 10px; }
.compact-panel .panel-body { max-height: 320px; overflow: auto; }
.timeline-dot-deal { background: var(--porter-blue); }
.timeline-dot-service { background: var(--gold); }
.timeline-dot-bhph, .timeline-dot-payment, .timeline-dot-collection { background: var(--porter-teal); }
.timeline-dot-bdc { background: #7c5cff; }
.timeline-dot-csi { background: var(--red); }

/* CRM journey kanban */
.journey-kanban {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
  overflow-x: auto;
  padding-bottom: 4px;
}
.journey-lane {
  min-width: 160px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 10px;
}
.journey-lane header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 12px;
  border-bottom: 1px solid var(--line);
  font-size: 12px;
}
.journey-cards { padding: 8px; display: grid; gap: 8px; }
.journey-card {
  padding: 8px 10px;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
  font-size: 12px;
}
.journey-card strong { display: block; margin-bottom: 4px; }
.journey-card small { color: var(--muted); display: block; margin-bottom: 6px; }

/* BHPH contract builder modal */
.bhph-contract-modal {
  display: grid;
  gap: 14px;
}

.bhph-modal-subtitle {
  margin: 4px 0 0;
}

.bhph-contract-wizard {
  gap: 12px;
}

.bhph-wizard-stepper-wrap {
  padding: 4px 0 2px;
}

.bhph-wizard-step-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border-radius: 999px;
}

.bhph-wizard-step-pill.done {
  cursor: pointer;
}

.bhph-wizard-step-num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  font-size: 12px;
  font-weight: 700;
  background: var(--line);
}

.bhph-wizard-step-pill.active .bhph-wizard-step-num,
.bhph-wizard-step-pill.done .bhph-wizard-step-num {
  background: color-mix(in srgb, var(--accent) 18%, var(--panel));
  color: var(--accent);
}

.bhph-wizard-step-label {
  font-size: 12px;
  font-weight: 600;
}

.bhph-wizard-context {
  border: 1px solid var(--line);
  border-radius: 12px;
  background: color-mix(in srgb, var(--panel) 94%, var(--accent) 6%);
  padding: 10px 12px;
}

.bhph-wizard-context-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.bhph-wizard-context-item {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.bhph-wizard-context-item strong {
  font-size: 13px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.bhph-wizard-context-item small {
  color: var(--muted);
  font-size: 11px;
}

.bhph-wizard-context-label {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--muted);
}

.bhph-wizard-context-item.filled strong {
  color: var(--text);
}

.bhph-wizard-context-item.filled.accent strong {
  color: var(--accent);
}

.bhph-wizard-step-intro {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 2px 2px 0;
}

.bhph-wizard-step-intro strong {
  font-size: 1.05rem;
}

.bhph-wizard-step {
  margin: 0;
}

.custom-form-wizard-body {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.wizard-steps {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 4px;
}

.wizard-step {
  border: 1px solid var(--line);
  background: var(--panel-soft, #f6f8fb);
  color: var(--text-muted, #5b6775);
  border-radius: 999px;
  padding: 6px 12px;
  font-size: 12px;
  cursor: pointer;
}

.wizard-step.active {
  border-color: var(--accent);
  background: color-mix(in srgb, var(--accent) 12%, white);
  color: var(--accent);
  font-weight: 600;
}

.wizard-step.done {
  border-color: var(--green, #1f8a4c);
  color: var(--green, #1f8a4c);
}

.wizard-footer {
  margin-top: 8px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
}

.custom-form-wizard-preview {
  margin-top: 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  min-height: 320px;
  background: #fff;
  overflow: hidden;
}

.custom-form-wizard-preview iframe {
  width: 100%;
  min-height: 420px;
  border: 0;
  background: #fff;
}

.bhph-vehicle-preview-wrap {
  padding: 0 14px 14px;
}

.bhph-vehicle-preview {
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 12px 14px;
  background: #f8fafc;
  display: grid;
  gap: 10px;
}

.bhph-vehicle-preview.empty {
  background: var(--panel);
}

.bhph-vehicle-preview-main {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.bhph-vehicle-preview-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 14px 20px;
}

.bhph-vehicle-preview-stats span {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.bhph-vehicle-preview-stats small {
  color: var(--muted);
  font-size: 11px;
}

.bhph-wizard-review-panel {
  display: grid;
  gap: 12px;
  padding: 0 14px 14px;
}

.bhph-wizard-review-placeholder,
.bhph-wizard-save-hint {
  margin: 0;
  padding: 0 2px;
}

.bhph-wizard-print-ready {
  margin-top: 12px;
}

.bhph-wizard-print-ready header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 6px;
}

.bhph-forms-reprint-panel .bhph-contract-filter-row {
  margin: 10px 0 14px;
}

.bhph-wizard-kpis {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.bhph-wizard-facts {
  grid-template-columns: repeat(4, 1fr);
  margin: 12px 0;
  padding: 0 14px 4px;
}

.bhph-wizard-nav {
  justify-content: flex-end;
  gap: 8px;
}

.bhph-wizard-nav [data-close-bhph-contract-modal] {
  margin-right: auto;
}

.bhph-launcher-steps {
  margin: 0 0 12px 18px;
  color: var(--muted);
  line-height: 1.6;
}

@media (max-width: 900px) {
  .bhph-wizard-context-grid,
  .bhph-wizard-kpis,
  .bhph-wizard-facts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.bhph-contract-intro {
  margin: 0;
  line-height: 1.45;
}

.bhph-form-section {
  margin: 0;
}

.bhph-form-section > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 14px;
  border-bottom: 1px solid var(--line);
  background: #f8fafc;
}

.bhph-form-section > .form-grid {
  padding: 12px 14px 14px;
}

.bhph-contract-actions {
  position: sticky;
  bottom: 0;
  background: var(--panel);
  border-top: 1px solid var(--line);
  margin: 4px -4px 0;
  padding-top: 12px;
  z-index: 2;
}

.bhph-contract-detail.bhph-detail-highlight {
  animation: bhph-detail-highlight 2.2s ease;
}

.clickable-row.bhph-just-created {
  animation: bhph-detail-highlight 2.2s ease;
}

@keyframes bhph-detail-highlight {
  0%, 100% { box-shadow: none; }
  20% { box-shadow: 0 0 0 2px color-mix(in srgb, #2d8f4e 45%, transparent); }
  50% { box-shadow: 0 0 0 1px color-mix(in srgb, #2d8f4e 25%, transparent); }
}

.service-cashier-panel header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}

.service-cashier-split-prompt {
  display: grid;
  gap: 12px;
}

.service-cashier-panel .badge.compact {
  margin-right: 4px;
}

.bhph-contract-terms-panel {
  margin-top: 12px;
}

.bhph-contract-detail .nested-collapsible {
  margin-top: 12px;
}

.bhph-contract-detail .nested-collapsible .collapsible-panel-head h2 {
  font-size: 1rem;
}

.bhph-section-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-top: 10px;
}

.bhph-inline-actions {
  margin-top: 8px;
}

.bhph-quick-lookup-grid {
  gap: 10px;
}

.bhph-delinq-board {
  display: grid;
  gap: 12px;
}

.bhph-delinq-card {
  padding: 14px;
  border-radius: 12px;
  border: 1px solid var(--line);
  background: var(--surface);
}

.bhph-delinq-card.risk {
  border-color: rgba(220, 53, 69, 0.35);
  background: rgba(220, 53, 69, 0.04);
}

.bhph-delinq-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}

.bhph-delinq-card-head strong {
  display: block;
}

.bhph-delinq-card-head span {
  display: block;
  margin-top: 4px;
  color: var(--muted);
  font-size: 13px;
}

.bhph-delinq-facts {
  margin-bottom: 10px;
}

.bhph-delinq-fields {
  margin-bottom: 4px;
}

.bhph-payment-list .source-row + .source-row {
  margin-top: 6px;
}

.bhph-contracts-split {
  align-items: start;
}

.bhph-contracts-split .record-list {
  min-height: 0;
}

#helpInternalSections {
  max-height: min(62vh, 680px);
  overflow-y: auto;
  overscroll-behavior: contain;
  padding-right: 4px;
}

.capability-matrix-wrap {
  overscroll-behavior: contain;
}

.bhph-contracts-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}

.bhph-contract-filter-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 14px 10px;
}

.bhph-contract-filter-row .filter-input {
  flex: 1;
  min-width: 180px;
}

.bhph-detail-badges {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.bhph-payoff-progress {
  display: grid;
  gap: 6px;
  margin: 12px 0 4px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: color-mix(in srgb, var(--surface) 88%, #2d8f4e 12%);
}

.bhph-payoff-progress-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  font-size: 13px;
}

.bhph-payoff-progress-bar {
  height: 8px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--line) 70%, transparent);
  overflow: hidden;
}

.bhph-payoff-progress-bar > span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #2d8f4e, #3cb371);
  min-width: 2px;
  transition: width 0.35s ease;
}

.bhph-collection-panel .bhph-collection-grid {
  padding: 0 14px 8px;
}

.bhph-quick-pay-panel .bhph-pay-grid {
  padding: 0 14px 8px;
}

.bhph-amort-panel .bhph-amort-table {
  padding: 0 14px 12px;
}

.bhph-contract-detail-expanded .detail {
  max-height: none;
  overflow: visible;
}

.bhph-contract-detail-expanded .bhph-contract-detail {
  border: 0;
  box-shadow: none;
}

.bhph-calc-result {
  display: grid;
  gap: 12px;
}

.bhph-calc-summary .facts {
  padding: 0 14px 4px;
}

dialog.modal-wide .line-modal-body {
  max-height: calc(100vh - 120px);
  overflow: auto;
}

#deskingModal .line-modal-body {
  padding-bottom: 32px;
}

.desking-nav-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  justify-content: space-between;
  margin: 0 0 12px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: rgba(0, 180, 166, 0.05);
}

.desking-nav-bar .meta {
  margin: 0;
  flex: 1 1 220px;
}

.deal-forms-panel {
  margin: 0 0 16px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--panel-soft, rgba(0, 0, 0, 0.02));
}
.deal-forms-panel-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-bottom: 6px;
}
.deal-forms-panel-note {
  margin: 0 0 10px;
}
.deal-forms-toolbar {
  margin: 0;
}
.deal-forms-panel-compact {
  margin: 0 0 12px;
  padding: 10px 12px;
}

.desking-scenario-actions {
  margin-bottom: 8px;
}

.bhph-contract-launcher .panel-body {
  display: grid;
  gap: 12px;
  padding: 14px 16px;
}

.bhph-integration-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 12px;
  padding: 14px 16px 18px;
}
.bhph-integration-card {
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface);
  display: grid;
  gap: 8px;
}
.bhph-integration-card header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

/* Pay stub preview & PDF letterhead */
.paystub-preview { display: grid; gap: 14px; }
.paystub-letterhead {
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--porter-teal);
  border-radius: 10px;
  background: var(--surface);
  display: grid;
  gap: 4px;
}
.paystub-letterhead strong { font-size: 16px; color: var(--porter-teal); }
.paystub-letterhead span { font-size: 12px; color: var(--muted); }
.paystub-title { margin: 0; font-size: 15px; letter-spacing: 0.04em; text-transform: uppercase; }
.paystub-meta-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.paystub-meta-grid small { display: block; color: var(--muted); font-size: 11px; }
.paystub-columns {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
.paystub-columns section {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px 12px;
  background: var(--panel);
}
.paystub-columns header {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 8px;
}
.paystub-totals {
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(0, 180, 166, 0.06);
}

/* Help getting started */
.help-getting-started { margin-bottom: 14px; }
.help-start-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  padding: 14px 16px 18px;
}
.help-start-grid article {
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface);
}
.help-start-grid strong { display: block; margin-bottom: 6px; font-size: 13px; }
.help-start-grid p { margin: 0; font-size: 12px; color: var(--muted); line-height: 1.55; }

/* Personalized employee workspace */
.workspace-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(280px, 0.9fr);
  gap: 16px;
  padding: 18px 20px;
  margin-bottom: 14px;
  background: linear-gradient(135deg, rgba(0, 180, 166, 0.08), rgba(37, 99, 235, 0.05));
  border: 1px solid var(--line);
  border-radius: 12px;
}
.workspace-hero h2 { margin: 8px 0 4px; font-size: 22px; }
.workspace-hero p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.55; }
.workspace-stat-chips { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 10px; }
.workspace-goal-strip {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 10px;
  font-size: 12px;
}
.workspace-goal-strip strong { font-size: 16px; color: var(--porter-teal); }
.workspace-priorities {
  display: grid;
  gap: 8px;
  align-content: start;
}
.workspace-priorities header small {
  display: block;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--muted);
  font-weight: 700;
  margin-bottom: 4px;
}
.workspace-priority {
  text-align: left;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  cursor: pointer;
}
.workspace-priority strong { display: block; font-size: 13px; }
.workspace-priority small { color: var(--muted); font-size: 11px; }
.workspace-priority.high { border-left: 3px solid var(--red); }
.workspace-priority.medium { border-left: 3px solid var(--gold); }
.workspace-priority.attention-link,
.notif-item.attention-link,
.insight-chip.attention-link,
.integration-health-row {
  cursor: pointer;
  text-align: left;
  width: 100%;
  border: 0;
  background: transparent;
  font: inherit;
  color: inherit;
}
.workspace-priority.attention-link:hover,
.notif-item.attention-link:hover,
.insight-chip.attention-link:hover,
.integration-health-row:hover {
  background: rgba(0, 180, 166, 0.06);
}
.attention-go,
.notif-action-link {
  color: var(--porter-teal, #00b4a6);
  font-weight: 700;
}
.insight-chip .attention-go {
  display: inline-block;
  margin-left: 6px;
  font-size: 11px;
}
.notif-drawer-sub {
  margin: 4px 0 0;
  font-size: 12px;
  max-width: 240px;
}
.integration-health-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 6px 0;
  border-bottom: 1px solid var(--line);
  font-size: 13px;
}
.integration-card-alert {
  border-color: rgba(239, 68, 68, 0.35);
  box-shadow: inset 0 0 0 1px rgba(239, 68, 68, 0.08);
}
.customer-with-sms {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  flex-wrap: wrap;
}
.customer-sms-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface);
  font-size: 13px;
  line-height: 1;
  cursor: pointer;
  vertical-align: middle;
}
.customer-sms-btn:hover {
  border-color: var(--blue);
  background: rgba(37, 99, 235, 0.08);
}
.customer-voip-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface);
  font-size: 13px;
  line-height: 1;
  cursor: pointer;
  vertical-align: middle;
}
.customer-voip-btn:hover {
  border-color: #0f766e;
  background: rgba(15, 118, 110, 0.08);
}
.customer-delivery-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 6px;
}
.bdc-sms-panel .wide {
  width: 100%;
  margin-top: 6px;
}
.voipline-config-panel .inline-edit-grid {
  margin: 12px 0;
}
.sms-composer-panel .sms-composer-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 12px;
}
.sms-composer-panel .inline-edit-grid {
  margin: 12px 0;
}
.sms-composer-panel label strong {
  display: block;
  margin-top: 4px;
  font-size: 14px;
}
.twilio-delivery-hint {
  padding: 8px 10px;
  border-radius: 8px;
  background: rgba(37, 99, 235, 0.06);
  border: 1px solid rgba(37, 99, 235, 0.15);
}
.twilio-config-panel .inline-edit-grid {
  margin: 12px 0;
}
.integration-head.attention-link {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
  width: 100%;
  padding: 0;
  margin: 0 0 10px;
}
.workspace-kpis { margin-bottom: 14px; }

@media (max-width: 900px) {
  .workspace-hero { grid-template-columns: 1fr; }
}

@media print {
  .sidebar,
  .topbar,
  .tabs,
  .module-header-actions,
  .module-chrome-top,
  .module-command-deck,
  .subtabs,
  .panel-filters,
  .print-preview-actions,
  #toastContainer,
  button:not(.print-keep) {
    display: none !important;
  }
  .shell {
    display: block;
  }
  main {
    padding: 0 !important;
  }
  .view.active {
    display: block;
  }
  .panel {
    box-shadow: none;
    border: 1px solid #111;
    break-inside: avoid;
    page-break-inside: avoid;
  }
  .module-scroll-region,
  .record-list-scroll,
  .table-wrap,
  .capability-matrix-wrap,
  #helpInternalSections {
    max-height: none !important;
    overflow: visible !important;
  }
  table thead {
    display: table-header-group;
  }
  tr {
    break-inside: avoid;
    page-break-inside: avoid;
  }
}

/* Service Advisor open-RO popup + super-admin health modal */
.advisor-name-link {
  font-weight: 700;
  color: var(--porter-teal-2, #1f9d9d);
}
.advisor-ros-modal .table-wrap,
.open-ros-search-modal .open-ros-modal-table {
  max-height: min(62vh, 560px);
  overflow: auto;
}
.health-modal .source-row { margin-top: 8px; }
.advisor-ros-modal .meta,
.health-modal .meta { margin: 4px 0 12px; }
.health-modal-status {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 12px;
}
.health-modal-status small { opacity: .75; }
.health-modal .source-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  padding: 6px 0;
  border-bottom: 1px solid rgba(0,0,0,.06);
}
.health-modal .source-row small { display: block; opacity: .65; font-size: 11px; }

/* Service RO preview workspace + parts detail history */
.detail-preview { background: var(--panel, #fff); }
.ro-preview-banner {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 20px;
  background: rgba(31, 157, 157, .08);
  border-bottom: 1px solid rgba(0,0,0,.06);
}
.ro-preview-banner small { opacity: .8; }
.ro-line-preview-only { text-align: left; cursor: pointer; }
.ro-line-preview-only.active { border-color: var(--porter-teal-2, #1f9d9d); box-shadow: 0 0 0 1px var(--porter-teal-2, #1f9d9d); }
.ro-line-preview-concern-label {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .4px;
  color: var(--muted, #64748b);
  margin: 6px 0 2px;
}
.ro-line-preview-grid.preview-only { gap: 10px; }
.record-button .ro-list-id { display: block; font-size: 12px; color: var(--muted, #64748b); }
.record-button .ro-list-customer { display: block; font-size: 14px; }
.part-detail-quick-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin: 12px 0;
}
.part-history-modal .part-history-tabs { margin: 10px 0 14px; }
.part-history-panel[hidden] { display: none; }
.part-history-panel .table-wrap { max-height: 360px; overflow: auto; }

.part-master-detail .part-detail-tabs { margin: 12px 0 16px; flex-wrap: wrap; }
.part-detail-panel[hidden] { display: none; }
.part-master-detail .line-subsection { margin-top: 14px; }
.part-master-detail .parts-receiving-accounting-strip { margin: 12px 0; }
.employee-work-activity .grid-2 { gap: 12px; }
.appointment-related-panel { margin-bottom: 14px; }

/* Integration Access control (System → Integration Access) */
.ia-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.ia-category { margin-top: 14px; }
.ia-category h4 { margin: 0 0 8px; font-size: 12px; text-transform: uppercase; letter-spacing: .4px; color: var(--muted); }
.ia-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 8px; }
.ia-toggle { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 10px; cursor: pointer; transition: border-color .15s, background .15s; }
.ia-toggle:hover { border-color: var(--blue); }
.ia-toggle.on { background: rgba(40, 167, 69, 0.08); border-color: rgba(40, 167, 69, 0.4); }
.ia-toggle.off { opacity: .75; }
.ia-toggle input { width: 18px; height: 18px; flex: 0 0 auto; }
.ia-toggle-body { display: flex; flex-direction: column; line-height: 1.2; }
.ia-toggle-body strong { font-size: 13px; }
.ia-toggle-body small { color: var(--muted); font-size: 11px; }

/* Parts document lifecycle stepper */
.parts-doc-stepper {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  flex: 1;
  min-width: 0;
  padding: 0;
  border: none;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
.parts-doc-step {
  font-size: 10px;
  font-weight: 800;
  color: #94a3b8;
  padding: 6px 12px;
  border-radius: 999px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}
.parts-doc-step.done { color: #047857; background: #ecfdf5; border-color: #a7f3d0; }
.parts-doc-step.active { color: #fff; background: linear-gradient(135deg, var(--porter-teal), #0d9488); border-color: transparent; box-shadow: 0 2px 8px rgba(0, 180, 166, 0.35); }
.parts-doc-step-sep { color: #cbd5e1; font-size: 11px; font-weight: 700; }

/* Express Dealership Setup wizard */
.header-actions { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }

/* ── Action sub-menus (More ▾ popovers) ─────────────────────────────────── */
.action-menu { position: relative; display: inline-flex; }
.action-menu-pop {
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  z-index: 240;
  min-width: 210px;
  max-height: min(60vh, 420px);
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 6px;
  background: var(--panel, #fff);
  border: 1px solid var(--line, #e4e9f0);
  border-radius: 10px;
  box-shadow: 0 12px 32px rgba(15, 23, 42, 0.16);
}
.action-menu-pop[hidden] { display: none; }
.action-menu-pop[data-floating-menu],
[data-ro-footer-menu][data-floating-menu] {
  position: fixed !important;
  z-index: 25000;
  max-height: min(60vh, 420px);
  overflow-y: auto;
}
.action-menu-item {
  display: block;
  width: 100%;
  padding: 8px 12px;
  border: none;
  border-radius: 7px;
  background: transparent;
  color: var(--ink, #0f172a);
  font-size: 13px;
  font-weight: 600;
  text-align: left;
  cursor: pointer;
  white-space: nowrap;
}
.action-menu-item:hover { background: var(--panel-soft, #f1f5f9); }

.express-setup-callout {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 16px;
  margin: 0 0 12px;
  padding: 14px 16px;
  border-radius: 10px;
  background: linear-gradient(90deg, rgba(37,99,235,.10), rgba(37,99,235,.03));
  border: 1px solid rgba(37,99,235,.25);
  max-width: 100%;
}

/* Detail screen efficiency pack — meta bars, stat chips, action rails */
.detail-record-meta-bar {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
  padding: 10px 14px; margin-bottom: 12px; border: 1px solid var(--line); border-radius: 10px;
  background: var(--surface-2, rgba(0,0,0,0.03));
}
.detail-meta-left { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.detail-kind-pill {
  font-size: 10px; font-weight: 800; letter-spacing: .5px; text-transform: uppercase;
  padding: 3px 8px; border-radius: 999px; background: var(--blue-soft, rgba(0,123,255,0.12)); color: var(--blue);
}
.detail-id-copy { font-family: ui-monospace, monospace; font-size: 12px; font-weight: 700; }
.detail-stat-row {
  display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; align-items: flex-start;
}
.detail-stat-chip {
  display: flex; flex-direction: column; gap: 2px; min-width: 72px; height: auto; align-self: flex-start;
  padding: 8px 12px; border-radius: 8px; border: 1px solid var(--line); background: var(--surface, #fff);
}
.detail-stat-chip small { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .3px; color: var(--muted); }
.detail-stat-chip strong { font-size: 14px; font-weight: 800; line-height: 1.1; }
.detail-stat-chip.green { border-color: rgba(40,167,69,0.35); background: rgba(40,167,69,0.06); }
.detail-stat-chip.green strong { color: var(--green, #28a745); }
.detail-stat-chip.gold { border-color: rgba(255,193,7,0.4); background: rgba(255,193,7,0.08); }
.detail-stat-chip.red { border-color: rgba(220,53,69,0.35); background: rgba(220,53,69,0.06); }
.detail-stat-chip.red strong { color: var(--red, #dc3545); }
.detail-efficiency-rail {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  padding: 10px 12px; margin: 10px 0 14px; border-radius: 8px;
  border: 1px dashed var(--line); background: rgba(0,0,0,0.02);
}
.detail-rail-label { font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .4px; color: var(--muted); white-space: nowrap; }
.detail-rail-actions { display: flex; flex-wrap: wrap; gap: 6px; }
.detail-efficiency-rail .secondary.compact { padding: 5px 10px; font-size: 12px; }
.detail-efficiency-rail .primary.compact { padding: 5px 10px; font-size: 12px; }

.service-tracking-toolbar { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.service-tracking-days { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; }
.service-tracking-days input { width: 72px; }
.service-tracking-toolbar input[type="search"] { min-width: 240px; flex: 1 1 220px; }
.service-tracking-filters { display: flex; flex-wrap: wrap; gap: 8px; }
.service-tracking-actions { display: flex; flex-wrap: wrap; gap: 4px; max-width: 320px; }

.express-setup-callout strong { display: block; font-size: 15px; margin-bottom: 2px; }
.express-setup-callout span { font-size: 13px; color: var(--muted); }
.express-stepper { margin-bottom: 14px; }
.express-setup-body { max-height: 64vh; overflow: auto; padding-right: 4px; }
.setup-checklist { display: flex; flex-wrap: wrap; gap: 8px; margin: 10px 0 14px; }
.setup-check { font-size: 12px; font-weight: 600; padding: 4px 10px; border-radius: 999px; border: 1px solid var(--border, #d0d5dd); }
.setup-check.ok { color: #1a7f37; background: rgba(40,167,69,.10); border-color: rgba(40,167,69,.35); }
.setup-check.missing { color: var(--muted); }
.setup-check.warn { color: #9a6700; background: rgba(212,160,23,.10); border-color: rgba(212,160,23,.35); }
.express-role-guide { margin: 12px 0; }
.express-role-guide summary { cursor: pointer; font-weight: 700; padding: 6px 0; }

/* No-Part-Number (NPN) line highlight */
.parts-workflow-line.npn-line { background: rgba(212, 160, 23, 0.10); border-radius: 8px; padding: 6px; }
.parts-workflow-line .line-npn-desc { min-width: 180px; }

.module-process-guide {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-top: 10px;
  padding: 10px 14px;
  border-radius: 10px;
  border: 1px solid rgba(0, 180, 166, 0.28);
  background: rgba(0, 180, 166, 0.06);
}
.module-process-icon { font-size: 18px; font-weight: 800; color: var(--accent, #00b4a6); line-height: 1.2; }
.module-process-copy { flex: 1; min-width: 0; }
.module-process-copy strong { display: block; font-size: 12px; text-transform: uppercase; letter-spacing: .35px; margin-bottom: 2px; }
.module-process-copy span { display: block; font-size: 13px; color: var(--muted); line-height: 1.45; }
.module-process-guide .link-button { white-space: nowrap; align-self: center; }

.module-cross-handoffs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-top: 8px;
}
.module-cross-handoffs-label {
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .35px;
  color: var(--muted);
}
.handoff-chip {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  padding: 8px 12px;
  border-radius: 10px;
  border: 1px solid var(--line, #d0d5dd);
  background: var(--panel, #fff);
  cursor: pointer;
  text-align: left;
  max-width: 220px;
}
.handoff-chip:hover { border-color: var(--accent, #00b4a6); background: rgba(0, 180, 166, 0.05); }
.handoff-chip span { font-size: 11px; color: var(--muted); }
.handoff-chip strong { font-size: 13px; }
.handoff-chip small { font-size: 11px; color: var(--muted); }

.employee-access-panel .tenant-note { margin-bottom: 12px; }
.employee-access-panel .employee-access-actions { display: flex; gap: 8px; margin: 0 0 12px; }
.employee-access-grid { display: grid; gap: 14px; }
.employee-access-company {
  border: 1px solid var(--line, #d0d5dd);
  border-radius: 12px;
  padding: 12px 14px;
  background: var(--panel, #fff);
}
.employee-access-company-head { margin-bottom: 10px; }
.employee-access-campus { margin-top: 10px; padding-top: 10px; border-top: 1px dashed var(--line, #d0d5dd); }
.employee-access-campus-head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 8px;
  font-size: 13px;
  font-weight: 700;
}
.employee-access-campus-head .link-button { margin-left: auto; font-size: 12px; }
.employee-access-location-grid { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }

.vehicle-decode-preview { margin: 0 0 12px; padding: 12px; border: 1px solid var(--line, #d0d5dd); border-radius: 10px; background: var(--panel-muted, #f8fafc); max-height: 220px; overflow: auto; }
.parts-inventory-guard-strip { display: flex; flex-wrap: wrap; gap: 8px; padding: 10px 16px 0; }
.branding-logo-row { display: flex; justify-content: space-between; gap: 12px; align-items: center; padding: 10px 0; border-bottom: 1px dashed var(--line, #d0d5dd); }
.branding-logo-row:last-child { border-bottom: 0; }
.branding-logo-row [data-branding-url-label] { display: block; margin-top: 4px; font-weight: 600; color: var(--ink, #1a2233); }
.branding-logo-actions { display: flex; gap: 8px; align-items: center; }
.company-logo-preview.compact { max-height: 40px; max-width: 100px; object-fit: contain; }
#companyLogoFilename { display: block; margin-top: 6px; font-weight: 600; color: var(--ink, #1a2233); }
.document-vehicle-header .document-vehicle-headline { font-size: 16px; line-height: 1.35; }

/* Super administrator & module command enhancements */
.company-gate-enterprise-host { margin: 12px 0 16px; }
.company-gate-enterprise {
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 16px 18px;
  background: linear-gradient(135deg, rgba(99, 102, 241, 0.06), rgba(0, 180, 166, 0.04));
}
.company-gate-enterprise header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
}
.company-gate-enterprise header h2 { margin: 0; font-size: 18px; }
.company-gate-enterprise-kpis {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 12px;
}
.company-gate-enterprise-kpis .company-gate-stat.warn strong { color: var(--gold); }
.company-gate-enterprise-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 14px;
}
.super-module-launcher header {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 8px;
  margin-bottom: 8px;
}
.super-module-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(108px, 1fr));
  gap: 8px;
}
.super-module-tile {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 10px 8px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface);
  cursor: pointer;
  text-align: center;
  transition: border-color .15s, transform .15s;
}
.super-module-tile:hover,
.super-module-tile:focus-visible {
  border-color: var(--blue);
  transform: translateY(-1px);
}
.super-module-tile.compact { padding: 8px 6px; }
.super-module-tile strong { font-size: 11px; line-height: 1.2; }
.super-module-icon { font-size: 18px; line-height: 1; }

.super-enterprise-command { border: 1px solid rgba(99, 102, 241, 0.25); }
.super-enterprise-command > header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  flex-wrap: wrap;
}
.super-cmd-header-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.super-enterprise-kpis {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
  gap: 10px;
  padding: 12px 16px 0;
}
.super-kpi-tile {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface);
  text-align: left;
  cursor: pointer;
}
.super-kpi-tile:hover,
.super-kpi-tile:focus-visible { border-color: var(--blue); background: rgba(0, 180, 166, 0.04); }
.super-kpi-tile strong { font-size: 22px; line-height: 1.1; }
.super-kpi-tile span { font-size: 12px; font-weight: 700; }
.super-kpi-tile small { font-size: 11px; color: var(--muted); }
.super-enterprise-body {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 16px;
  padding: 14px 16px 16px;
}
@media (max-width: 960px) {
  .super-enterprise-body { grid-template-columns: 1fr; }
}
.super-enterprise-launcher header,
.super-enterprise-pulse header {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 8px;
  margin-bottom: 10px;
}
.super-enterprise-launcher header h3,
.super-enterprise-pulse header h3 { margin: 0; font-size: 15px; }
.super-pulse-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 12px;
}
.super-cmd-footer {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.module-command-deck {
  margin: 0 0 14px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--panel-muted, #f8fafc);
}
.module-command-deck header {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 8px;
  margin-bottom: 10px;
}
.module-command-deck-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
  gap: 8px;
}
.command-deck-btn {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
  text-align: left;
  cursor: pointer;
}
.command-deck-btn:hover,
.command-deck-btn:focus-visible {
  border-color: var(--teal, #00b4a6);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}
.command-deck-btn strong { font-size: 13px; }
.command-deck-btn small { font-size: 11px; color: var(--muted); }

.workspace-hero-super {
  border: 1px solid rgba(99, 102, 241, 0.2);
  background: linear-gradient(135deg, rgba(99, 102, 241, 0.04), transparent);
}
.workspace-super-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin: 10px 0 4px;
}

.floorplan-watch-panel footer {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

body.dark-mode .company-gate-enterprise,
body.dark-mode .module-command-deck,
body.dark-mode .super-kpi-tile,
body.dark-mode .super-module-tile,
body.dark-mode .command-deck-btn {
  background: rgba(15, 23, 42, 0.72);
}

.super-module-context-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin: 8px 0 4px;
  padding: 8px 10px;
  border: 1px dashed rgba(99, 102, 241, 0.35);
  border-radius: 8px;
  background: rgba(99, 102, 241, 0.04);
}
.super-audit-strip {
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
}
.super-audit-strip header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
}
.super-audit-row {
  display: grid;
  grid-template-columns: 90px 1fr auto;
  gap: 8px;
  align-items: center;
  width: 100%;
  text-align: left;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
  margin-bottom: 6px;
  cursor: pointer;
}
.super-audit-row:hover,
.super-audit-row:focus-visible { border-color: var(--blue); }
.super-audit-row strong { font-size: 12px; }
.super-audit-row span { font-size: 13px; }
.super-audit-row small { font-size: 11px; color: var(--muted); white-space: nowrap; }

.super-module-health-host {
  margin-top: 14px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface);
}
.super-module-health-host.warn { border-color: rgba(212, 160, 23, 0.45); }
.super-module-health-host.healthy { border-color: rgba(34, 197, 94, 0.35); }
.super-module-health-host header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
}
.super-health-issue {
  display: block;
  width: 100%;
  text-align: left;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel-muted, #f8fafc);
  margin-bottom: 6px;
  cursor: pointer;
}
.super-health-issue:hover,
.super-health-issue:focus-visible { border-color: var(--gold); }
.super-health-issue strong { display: block; font-size: 13px; }
.super-health-issue small { font-size: 11px; color: var(--muted); }

/* CRM Tools — BDC work hub */
.crm-tools-mount { margin-top: 12px; }
.crm-tools-panel header h2 { margin: 0; }
.crm-tools-intro { margin: 0 0 16px; max-width: 72ch; }
.crm-tools-layout { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: 16px; align-items: start; }
@media (max-width: 960px) { .crm-tools-layout { grid-template-columns: 1fr; } }
.crm-project-sidebar { background: var(--panel); border: 1px solid var(--border); border-radius: 12px; padding: 12px; }
.crm-project-sidebar header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
.crm-project-sidebar ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.crm-project-btn { width: 100%; display: flex; gap: 10px; align-items: center; text-align: left; border: 1px solid transparent; background: transparent; border-radius: 10px; padding: 8px; cursor: pointer; color: inherit; }
.crm-project-btn:hover, .crm-project-btn.active { background: var(--panel-2, rgba(0,0,0,.04)); border-color: var(--border); }
.crm-project-icon { width: 32px; height: 32px; border-radius: 8px; display: grid; place-items: center; color: #fff; font-size: 14px; flex-shrink: 0; }
.crm-activity { margin-top: 16px; border-top: 1px solid var(--border); padding-top: 12px; }
.crm-activity-row { font-size: 12px; margin-bottom: 6px; }
.crm-toolbar { padding: 12px; margin-bottom: 12px; }
.crm-toolbar-row { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.crm-view-tabs { display: flex; gap: 4px; }
.crm-filters { display: flex; gap: 4px; flex-wrap: wrap; }
.crm-filters .secondary.active { background: var(--accent, #0d9488); color: #fff; border-color: transparent; }
.crm-search { min-width: 180px; flex: 1; max-width: 280px; }
.crm-stats { display: flex; gap: 16px; flex-wrap: wrap; margin-top: 10px; font-size: 13px; }
.crm-analytics-strip { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--border); }
.crm-analytics-card { background: var(--panel-2, #f8fafc); border: 1px solid var(--border); border-radius: 8px; padding: 8px 12px; min-width: 88px; }
.crm-analytics-card strong { display: block; font-size: 18px; }
.crm-analytics-sources { display: flex; flex-wrap: wrap; gap: 6px; flex: 1; }
.crm-next-up { margin-bottom: 12px; padding: 12px 14px; }
.crm-board-all { margin-top: 4px; }
.crm-stat strong { font-size: 18px; margin-right: 4px; }
.crm-board { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; align-items: start; }
.crm-board-col { background: var(--panel); border: 1px solid var(--border); border-radius: 12px; min-height: 200px; display: flex; flex-direction: column; }
.crm-board-col-head { display: flex; justify-content: space-between; padding: 10px 12px; border-bottom: 1px solid var(--border); }
.crm-board-col-body { padding: 8px; display: grid; gap: 8px; flex: 1; min-height: 120px; }
.crm-task-card { background: var(--bg, #fff); border: 1px solid var(--border); border-radius: 10px; padding: 10px; cursor: default; }
.crm-task-card.done { opacity: .72; }
.crm-task-card header { display: flex; justify-content: flex-start; align-items: center; gap: 6px; margin-bottom: 6px; }
.crm-board-col.drop-active,
.crm-board-col-body.drop-active,
.crm-timeline-col.drop-active,
.crm-timeline-body.drop-active {
  background: rgba(13, 148, 136, .12);
  outline: 2px dashed #0d9488;
  outline-offset: -2px;
}
.crm-board-col.drop-denied,
.crm-board-col-body.drop-denied {
  background: rgba(239, 68, 68, .08);
  outline: 2px dashed var(--red, #ef4444);
  outline-offset: -2px;
}
.touch-dnd-ghost {
  position: fixed;
  z-index: 12000;
  pointer-events: none;
  opacity: 0.92;
  max-width: min(92vw, 320px);
  box-shadow: 0 12px 32px rgba(15, 23, 42, 0.28);
  transform: rotate(-1deg);
}

@media (hover: none) and (pointer: coarse) {
  .deal-drag-handle,
  .crm-drag-handle {
    min-width: 44px;
    min-height: 44px;
    font-size: 20px;
    padding: 6px;
  }

  .pipeline-col,
  .crm-board-col {
    scroll-margin: 12px;
  }
}

.crm-draggable-card { cursor: grab; touch-action: none; }
.crm-draggable-card:active { cursor: grabbing; }
.crm-draggable-card.dragging,
.crm-timeline-task-wrap.dragging { opacity: .45; }
.crm-board-hint { margin: 0 0 10px; }
.crm-drag-handle { cursor: grab; border: none; background: transparent; padding: 0 4px; color: var(--muted, #64748b); font-size: 14px; line-height: 1; flex-shrink: 0; user-select: none; touch-action: none; min-width: 36px; min-height: 36px; display: inline-flex; align-items: center; justify-content: center; border-radius: 8px; }
.crm-drag-handle:active { cursor: grabbing; }
.crm-timeline-task-wrap { display: flex; gap: 4px; align-items: flex-start; }
.crm-timeline-task-wrap .crm-timeline-task { flex: 1; }
.crm-form-control { pointer-events: auto; }
.crm-task-title { margin: 0 0 4px; font-size: 14px; cursor: pointer; }
.crm-task-meta { margin: 0 0 6px; font-size: 12px; }
.crm-tags { display: flex; gap: 4px; flex-wrap: wrap; margin-bottom: 6px; }
.crm-section-move { width: 100%; font-size: 12px; margin-top: 4px; }
.crm-add-inline { margin: 8px; }
.crm-empty-col { padding: 8px; text-align: center; }
.crm-list-table { margin-top: 4px; }
.crm-calendar { border: 1px solid var(--border); border-radius: 12px; overflow: hidden; }
.crm-cal-nav { display: flex; gap: 8px; align-items: center; padding: 10px 12px; border-bottom: 1px solid var(--border); }
.crm-cal-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); }
.crm-cal-dow { font-size: 11px; font-weight: 600; text-align: center; padding: 8px 4px; background: var(--panel); border-bottom: 1px solid var(--border); }
.crm-cal-cell { min-height: 88px; border-right: 1px solid var(--border); border-bottom: 1px solid var(--border); padding: 4px; }
.crm-cal-cell.today { background: rgba(13, 148, 136, .08); }
.crm-cal-day { font-size: 11px; font-weight: 600; display: block; margin-bottom: 4px; }
.crm-cal-task { display: block; width: 100%; text-align: left; font-size: 11px; padding: 2px 4px; margin-bottom: 2px; border: none; background: var(--panel-2, #f1f5f9); border-radius: 4px; cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.crm-task-detail label { display: block; margin-bottom: 10px; }
.crm-task-detail input, .crm-task-detail textarea, .crm-task-detail select { width: 100%; }
.crm-subtasks ul, .crm-comment-list { margin: 8px 0; padding-left: 0; list-style: none; }
.crm-comment { border: 1px solid var(--border); border-radius: 8px; padding: 8px; margin-bottom: 8px; }
.crm-inline-add { display: flex; gap: 8px; align-items: flex-start; margin-top: 8px; }
.crm-inline-add input, .crm-inline-add textarea { flex: 1; }
.crm-pipeline-strip { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.crm-pipeline-chip { border: 1px solid var(--border); background: var(--panel); border-radius: 999px; padding: 6px 12px; font-size: 12px; cursor: pointer; color: inherit; }
.crm-pipeline-chip.active, .crm-pipeline-chip:hover { border-color: #0d9488; background: rgba(13, 148, 136, .08); }
.crm-pipeline-chip strong { margin-right: 4px; font-size: 14px; }
.crm-pipeline-empty { margin: 0 0 10px; }
.crm-inbox-head { margin-bottom: 12px; }
.crm-inbox-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 10px; }
.crm-saved-views { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.crm-saved-views select { min-width: 130px; font-size: 12px; }
.crm-source-pill { font-size: 10px; }
.crm-project-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 4px; vertical-align: middle; }
.crm-card-actions { display: flex; gap: 6px; align-items: center; margin-top: 6px; }
.crm-card-actions .crm-section-move { flex: 1; }
.crm-activity-btn { display: block; width: 100%; text-align: left; border: none; background: transparent; padding: 4px 0; cursor: pointer; color: inherit; }
.crm-activity-btn:hover { color: #0d9488; }
.crm-task-quick-bar, .crm-workflow-actions { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0; }
.crm-custom-fields { padding: 8px 10px; background: var(--panel-2, #f8fafc); border-radius: 8px; }
.crm-main-wrap { position: relative; max-height: min(calc(100dvh - 280px), 720px); overflow: auto; overscroll-behavior: contain; }
.crm-tools-main { min-height: 0; }
.crm-board-col-body { max-height: min(42vh, 420px); overflow: auto; overscroll-behavior: contain; }
.crm-list-table.module-scroll-region { max-height: min(48vh, 520px); }
.crm-home { display: grid; gap: 20px; }
.crm-home-section header { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; }
.crm-home-section header h3 { margin: 0; font-size: 15px; }
.crm-home-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 10px; }
.crm-home-empty { padding: 24px; text-align: center; }
.crm-home-digest { margin-bottom: 14px; }
.crm-home-digest-stats, .crm-home-digest-pipeline { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.crm-digest-chip { border: 1px solid var(--border); background: var(--panel); border-radius: 8px; padding: 8px 12px; font-size: 12px; cursor: pointer; color: inherit; }
.crm-digest-chip.active, .crm-digest-chip:hover { border-color: #5b4fc7; background: rgba(91, 79, 199, .08); }
.crm-digest-chip strong { display: block; font-size: 18px; line-height: 1.1; }
.crm-timeline-head { margin-bottom: 12px; }
.crm-timeline-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 8px; overflow-x: auto; }
.crm-timeline-col { border: 1px solid var(--border); border-radius: 10px; min-height: 140px; background: var(--panel); }
.crm-timeline-col.today { border-color: #0d9488; box-shadow: inset 0 0 0 1px rgba(13, 148, 136, .2); }
.crm-timeline-col header { display: flex; justify-content: space-between; padding: 8px; border-bottom: 1px solid var(--border); font-size: 12px; }
.crm-timeline-body { padding: 6px; display: grid; gap: 4px; }
.crm-timeline-task { display: block; width: 100%; text-align: left; border: 1px solid var(--border); background: var(--bg, #fff); border-radius: 6px; padding: 6px; cursor: pointer; font-size: 11px; }
.crm-timeline-task small { display: block; color: var(--muted, #64748b); margin-top: 2px; }
.crm-timeline-undated { margin-top: 16px; border-top: 1px solid var(--border); padding-top: 12px; }
.crm-workload header { margin-bottom: 12px; }
.crm-workload-bar { height: 8px; min-width: 80px; border-radius: 999px; background: rgba(148, 163, 184, .25); position: relative; overflow: hidden; }
.crm-workload-bar::after { content: ""; display: block; height: 100%; width: calc(var(--pct, 0) * 1%); background: linear-gradient(90deg, #0d9488, #5b4fc7); border-radius: inherit; }
.crm-task-card.blocked { border-color: rgba(239, 68, 68, .45); }
.crm-subtask-progress { margin: 6px 0; height: 6px; border-radius: 999px; background: rgba(148, 163, 184, .2); position: relative; overflow: hidden; }
.crm-subtask-progress::after { content: ""; display: block; height: 100%; width: calc(var(--pct, 0) * 1%); background: #16a34a; }
.crm-subtask-progress .meta { display: block; font-size: 10px; margin-top: 4px; }
.crm-comment-reply { margin-left: 16px; border-left: 2px solid var(--line); padding-left: 10px; }
.crm-timeline-col[data-crm-drop-due] .crm-timeline-body { min-height: 48px; }
.crm-timeline-task-wrap { touch-action: none; }
.service-manager-efficiency { margin-bottom: 16px; }
.service-efficiency-kpis { padding: 0 16px 8px; }
.variance-approval-queue { margin: 0 16px 16px; border: 1px solid rgba(245, 158, 11, .35); border-radius: 10px; }
.labor-guide-row { align-items: center; }
#partsBulkPreview { border-top: 1px solid var(--line); margin-top: 10px; padding-top: 10px; }
#partsBulkPreview ul { margin: 8px 0 0 18px; }
.crm-list-controls { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin-bottom: 10px; font-size: 13px; }
.crm-list-controls label { display: flex; gap: 6px; align-items: center; }
.crm-list-group-row td { background: var(--panel-2, #f1f5f9); font-size: 13px; }
.crm-bulk-bar { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 10px; padding: 10px 12px; background: rgba(13, 148, 136, .08); border-radius: 10px; }
.crm-bulk-check { display: inline-flex; margin-right: 6px; }
.crm-hide-done { font-size: 12px; display: inline-flex; gap: 6px; align-items: center; white-space: nowrap; }
.crm-project-progress { display: block; height: 3px; margin-top: 6px; border-radius: 999px; background: var(--border); overflow: hidden; }
.crm-project-progress::after { content: ""; display: block; height: 100%; width: calc(var(--pct, 0) * 1%); background: #0d9488; }
.crm-shortcuts-panel { position: absolute; top: 0; right: 0; width: 220px; background: var(--panel); border: 1px solid var(--border); border-radius: 12px; padding: 12px; box-shadow: 0 8px 24px rgba(0,0,0,.12); z-index: 5; }
.crm-shortcuts-panel header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
.crm-shortcuts-panel ul { margin: 0; padding-left: 0; list-style: none; font-size: 12px; }
.crm-shortcuts-panel li { margin-bottom: 6px; }
.crm-shortcuts-panel kbd { background: var(--panel-2, #e2e8f0); border-radius: 4px; padding: 2px 6px; font-size: 11px; margin-right: 6px; }
.crm-pick-project { margin-bottom: 12px; }
.help-internal-guide { border-left: 4px solid #7c3aed; }
.help-internal-guide .help-internal-item { border: 1px solid var(--border); border-radius: 10px; padding: 12px; margin-bottom: 10px; }
.help-internal-guide .help-internal-item ol { margin: 8px 0 0; padding-left: 18px; }
.help-internal-guide .help-internal-item li { margin-bottom: 4px; font-size: 13px; }
.help-internal-focus header { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; flex-wrap: wrap; }
.help-internal-focus .panel-filters { margin: 12px 0; }

.pinkie-matrix-wrap .pinkie-matrix th.pinkie-comp-col,
.pinkie-matrix-wrap .pinkie-matrix td.pinkie-cell { padding: 4px 6px; white-space: nowrap; }
.pinkie-matrix-wrap .pinkie-matrix tbody tr:nth-child(even) { background: rgba(241, 245, 249, 0.45); }

.counter-slip-banner { margin: 8px 0 12px; padding: 10px 12px; border: 1px solid var(--border); border-radius: 8px; background: rgba(59, 130, 246, 0.06); text-align: center; }
.parts-doc-counter-slip { margin: 8px 0; align-items: end; }

.new-po-add-more-lines {
  background: #dbeafe;
  border-color: #93c5fd;
  color: #1e40af;
  font-weight: 600;
}
.new-po-add-more-lines:hover {
  background: #bfdbfe;
  border-color: #60a5fa;
}

.parts-doc-header-slip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-right: 8px;
  padding: 4px 8px;
  border-radius: 8px;
  background: rgba(59, 130, 246, 0.08);
  border: 1px solid rgba(59, 130, 246, 0.2);
  font-size: 0.82rem;
}
.parts-doc-header-slip.inline-slip select {
  min-width: 110px;
}
.parts-doc-top-bar {
  flex-wrap: wrap;
  gap: 8px;
}

.new-parts-order-modal .new-parts-order-line-entry-stack {
  display: grid;
  gap: 10px;
}
.new-parts-order-suggested-tools {
  margin-bottom: 10px;
  flex-wrap: wrap;
}
.new-parts-order-panel header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
}
.new-parts-order-sheet .parts-invoice-sheet-wrap {
  border: 1px solid var(--line);
  border-radius: 10px;
  overflow: hidden;
}
.new-parts-order-tabs {
  margin: 12px 0;
}

.ro-detail-forms-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-top: 8px;
}
.ro-detail-forms-toolbar .record-forms-quick {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.ro-service-estimate-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.ro-loaner-menu-wrap {
  position: relative;
}
.ro-workflow-menus {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}
.ro-workflow-menu-trigger {
  background: var(--purple, #7c3aed);
  border: 1px solid #6d28d9;
  color: #fff;
  font-weight: 700;
  border-radius: 8px;
  padding: 6px 12px;
  cursor: pointer;
}
.ro-workflow-menu-trigger:hover {
  background: #6d28d9;
}
.ro-workflow-menu {
  background: #fff;
  border-color: var(--line, #cbd5e1);
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.12);
}
.ro-workflow-menu .secondary.compact {
  width: 100%;
  justify-content: flex-start;
}
.loaner-menu-trigger {
  background: #7c3aed;
  border: 1px solid #6d28d9;
  color: #fff;
  font-weight: 700;
  border-radius: 8px;
  padding: 6px 12px;
  cursor: pointer;
}
.loaner-menu-trigger:hover {
  background: #6d28d9;
}
.ro-loaner-menu {
  position: absolute;
  z-index: 20;
  top: calc(100% + 4px);
  left: 0;
  min-width: 220px;
  display: grid;
  gap: 6px;
  padding: 8px;
  border-radius: 10px;
  border: 1px solid #c4b5fd;
  background: #faf5ff;
  box-shadow: 0 8px 24px rgba(91, 33, 182, 0.15);
}
.ro-loaner-menu .loaner-form-btn {
  justify-content: flex-start;
}
.print-ro-form-extras {
  margin: 10px 0;
  padding: 10px 12px;
  border-radius: 8px;
  border: 1px dashed #cbd5e1;
  background: #f8fafc;
}
.service-loaners-panel .service-loaners-forms {
  margin-bottom: 12px;
}
.loaner-close-forms {
  margin: 12px 0;
  padding: 10px 12px;
  border-radius: 8px;
  background: #faf5ff;
  border: 1px solid #e9d5ff;
}

/* Forms Library — primary action + nested sub-buttons */
.forms-action-group {
  display: inline-flex;
  align-items: stretch;
  gap: 0;
  margin-top: 10px;
}
.forms-action-primary {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}
.forms-action-sub-wrap {
  position: relative;
  display: inline-flex;
}
.forms-action-sub-toggle {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  min-width: 36px;
  padding-left: 10px;
  padding-right: 10px;
}
.forms-action-sub-menu {
  position: absolute;
  top: calc(100% + 4px);
  right: 0;
  z-index: 40;
  min-width: 200px;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.12);
  padding: 6px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.forms-action-sub-item {
  text-align: left;
  width: 100%;
  border: none;
  background: transparent;
  padding: 8px 10px;
  border-radius: 6px;
  cursor: pointer;
  font: inherit;
}
.forms-action-sub-item:hover:not(:disabled) {
  background: #f1f5f9;
}

/* RO Estimates — Save nests under Add Service Estimate (inline expand in flyout) */
.ro-estimate-nested {
  display: grid;
  gap: 6px;
  width: 100%;
}
.ro-estimate-nested-toggle {
  width: 100%;
  justify-content: flex-start;
}
.ro-estimate-nested-menu {
  display: grid;
  gap: 6px;
  margin: 0;
  padding: 6px 0 0 10px;
  border-left: 2px solid #c4b5fd;
}
.ro-estimate-nested-menu[hidden] {
  display: none !important;
}
.ro-estimate-nested-menu .secondary {
  width: 100%;
  justify-content: flex-start;
}
.ro-detail-modal-header .ro-estimate-nested {
  width: auto;
  min-width: 220px;
}

/* legacy forms-action-group nest kept for Forms hub only */
.ro-estimate-add-group {
  width: 100%;
  display: inline-flex;
  align-items: stretch;
}
.ro-loaner-menu .ro-estimate-add-group,
.ro-workflow-menu .ro-estimate-add-group {
  width: 100%;
}
.ro-estimate-add-group .forms-action-primary {
  flex: 1 1 auto;
  justify-content: flex-start;
}
.ro-estimate-add-group .forms-action-sub-menu {
  right: 0;
  left: auto;
  min-width: 220px;
  z-index: 50;
}
.ro-detail-modal-header .ro-estimate-add-group {
  width: auto;
}
.ro-detail-modal-header .ro-estimate-add-group .forms-action-primary {
  flex: 0 1 auto;
}

.forms-intake-panel {
  margin-top: 16px;
  border-top: 1px solid #e2e8f0;
  padding-top: 12px;
}