/* DealershipCore CRM — red/black production skin.
   This file intentionally overrides the shared operating-core theme without
   changing the shared backend, database contracts, routes or intake logic. */

:root {
  --bg: #050505;
  --surface: #0b0b0d;
  --surface-2: #101014;
  --surface-3: #17171c;
  --border: #242429;
  --border-strong: #393940;
  --text: #f7f7f8;
  --muted: #a1a1aa;
  --faint: #71717a;

  /* Important is deliberate: app.js applies the workspace accent inline. */
  --accent: #e50914 !important;
  --accent-2: #ff3344 !important;
  --accent-soft: rgba(229,9,20,.14) !important;
  --accent-glow: rgba(229,9,20,.32) !important;
  --accent-text: #fff;

  --success: #22c55e;
  --success-soft: rgba(34,197,94,.12);
  --warning: #f59e0b;
  --warning-soft: rgba(245,158,11,.12);
  --danger: #ef4444;
  --danger-soft: rgba(239,68,68,.13);
  --info: #a1a1aa;
  --info-soft: rgba(161,161,170,.12);

  --radius-sm: 8px;
  --radius: 11px;
  --radius-lg: 14px;
  --sidebar-width: 264px;
  --topbar-height: 68px;
  --font: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
}

html { background:#050505; }
body {
  background-color:#050505;
  background-image:
    radial-gradient(850px 420px at 3% -5%, rgba(229,9,20,.09), transparent 58%),
    radial-gradient(650px 360px at 100% 0%, rgba(229,9,20,.035), transparent 62%);
}

/* ---------- shell / navigation ---------- */
.sidebar {
  background:linear-gradient(180deg,#080809 0%,#050505 100%);
  border-right-color:#222226;
}
.sidebar-head {
  height:68px;
  padding:0 20px;
  border-bottom-color:#202024;
}
.sidebar-mark,
.auth-mark {
  background:linear-gradient(145deg,#ff1f2d,#c9000b);
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 7px 22px -7px rgba(229,9,20,.7);
}
.sidebar-title {
  font-size:13px;
  font-weight:750;
  letter-spacing:.01em;
}
.sidebar-title::after {
  content:"Dealership CRM";
  display:block;
  margin-top:1px;
  color:#6f6f78;
  font-size:9px;
  font-weight:700;
  letter-spacing:.13em;
  text-transform:uppercase;
}
.sidebar-nav { padding:15px 12px 24px; }
.nav-group + .nav-group { margin-top:22px; }
.nav-group-label {
  padding:0 10px 7px;
  color:#676770;
  font-size:9.5px;
  font-weight:750;
  letter-spacing:.12em;
}
.nav-item {
  min-height:38px;
  border:1px solid transparent;
  border-radius:8px;
  padding:8px 10px;
  color:#9898a2;
  font-size:13px;
  font-weight:540;
}
.nav-item:hover {
  background:#111114;
  border-color:#202025;
  color:#fff;
}
.nav-item[aria-current="page"] {
  background:linear-gradient(90deg,rgba(229,9,20,.16),rgba(229,9,20,.055));
  border-color:rgba(229,9,20,.24);
  box-shadow:inset 2px 0 0 #e50914;
  color:#fff;
}
.nav-item[aria-current="page"] .icon { color:#ff3542; }
.nav-count.is-alert,
.nav-item[aria-current="page"] .nav-count {
  background:#e50914;
  color:#fff;
}
.sidebar-foot {
  padding:14px;
  background:#070708;
  border-top-color:#202024;
}

/* ---------- top bar ---------- */
.topbar {
  height:68px;
  padding:0 22px;
  background:rgba(5,5,5,.88);
  border-bottom-color:#202024;
  backdrop-filter:blur(16px) saturate(1.05);
}
.search { max-width:460px; }
.search input {
  height:39px;
  border-radius:10px;
  background:#0d0d0f;
  border-color:#27272c;
}
.search input:focus {
  border-color:rgba(229,9,20,.72);
  box-shadow:0 0 0 3px rgba(229,9,20,.12);
}

/* ---------- page rhythm ---------- */
.page { padding:26px 30px 42px; max-width:1500px; }
.page-head {
  align-items:flex-end;
  margin-bottom:19px;
  padding-bottom:2px;
}
.page-head h1 {
  font-size:24px;
  font-weight:760;
  letter-spacing:-.025em;
}
.page-head p {
  max-width:760px;
  margin-top:5px;
  color:#8d8d97;
  font-size:12.5px;
}
.page-actions { gap:8px; }
.section { margin-top:22px; }
.grid { gap:14px; }

/* ---------- surfaces ---------- */
.card,
.kpi,
.daily-guide,
.table-wrap,
.toolbar,
.system-details,
.board-column,
.dropdown,
.modal-card,
.panel {
  background:#0c0c0f;
  border-color:#25252a;
  box-shadow:0 8px 28px -22px rgba(0,0,0,.9);
}
.card:hover,
.kpi:hover { border-color:#34343a; }
.card-head { padding:15px 17px; border-bottom-color:#242429; }
.card-body { padding:17px; }
.card-head h2 { font-size:13.5px; }

/* ---------- command centre ---------- */
.daily-guide {
  position:relative;
  overflow:hidden;
  border-radius:13px;
  padding:20px;
  background:linear-gradient(145deg,#0f0f12,#0a0a0c);
}
.daily-guide::before {
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:3px;
  background:linear-gradient(#ff3344,#9f0008);
}
.daily-eyebrow {
  color:#ff4d59;
  font-size:9.5px;
  font-weight:800;
  letter-spacing:.13em;
}
.daily-step {
  background:#080809;
  border-color:#242429;
  border-radius:9px;
  min-height:92px;
}
.daily-step:hover {
  background:#101013;
  border-color:#3b3b42;
  transform:translateY(-1px);
}
.daily-step.needs-action {
  border-color:rgba(229,9,20,.46);
  background:linear-gradient(145deg,rgba(229,9,20,.10),#09090b 60%);
}
.daily-step-number {
  background:#17171b;
  border-color:#2d2d33;
  color:#c7c7ce;
}
.daily-step.needs-action .daily-step-number {
  background:#e50914;
  border-color:#e50914;
  color:#fff;
}
.daily-step-action { color:#ff4d59; }

/* ---------- KPI hierarchy ---------- */
.kpi {
  border-radius:11px;
  min-height:116px;
  padding:17px;
  text-align:left;
}
.kpi-label {
  color:#85858f;
  font-size:10px;
  font-weight:750;
  letter-spacing:.075em;
  text-transform:uppercase;
}
.kpi-label .icon { color:#ff3a47; }
.kpi-value {
  font-size:28px;
  font-weight:760;
  letter-spacing:-.035em;
}
.kpi-meta { font-size:11px; color:#85858f; }

/* ---------- buttons / inputs ---------- */
.btn {
  border-radius:8px;
  min-height:35px;
  padding-inline:12px;
  font-size:12px;
  font-weight:650;
}
.btn.primary {
  background:linear-gradient(180deg,#ef1b28,#d8000c);
  border-color:#f12a35;
  color:#fff;
  box-shadow:0 6px 18px -8px rgba(229,9,20,.75);
}
.btn.primary:hover {
  background:linear-gradient(180deg,#ff2a37,#e50914);
  border-color:#ff3a46;
  box-shadow:0 8px 22px -8px rgba(229,9,20,.8);
}
.btn:not(.primary) {
  background:#121216;
  border-color:#303036;
}
.btn:not(.primary):hover {
  background:#19191e;
  border-color:#44444b;
}
input,select,textarea,
.field input,.field select,.field textarea {
  background:#08080a;
  border-color:#2a2a30;
  border-radius:8px;
}
input:hover,select:hover,textarea:hover { border-color:#414148; }
input:focus,select:focus,textarea:focus {
  border-color:#e50914;
  box-shadow:0 0 0 3px rgba(229,9,20,.11);
}

/* ---------- CRM toolbars / filters ---------- */
.toolbar {
  gap:8px;
  border:1px solid #26262b;
  border-radius:11px;
  padding:9px;
  background:#0a0a0c;
}
.toolbar input,
.toolbar select { min-height:36px; }
.result-count {
  color:#73737d;
  font-size:11px;
  font-weight:650;
}

/* ---------- contacts / conversations / tasks ---------- */
.table-wrap { border-radius:11px; overflow:hidden; }
table thead tr { background:#08080a; }
th {
  color:#73737d;
  font-size:9.5px;
  font-weight:780;
  letter-spacing:.085em;
  text-transform:uppercase;
}
td,th { border-color:#222227; }
tbody tr { transition:background .12s ease; }
tbody tr:hover { background:rgba(255,255,255,.025); }
.cell-primary { color:#f4f4f5; font-weight:650; }
.cell-sub { color:#7f7f89; }

/* Every red count means work is waiting. */
.nav-count.is-alert,
.dot { box-shadow:0 0 0 3px rgba(229,9,20,.12); }
.delta.down { color:#ff515d; }
.status.high,
.badge.danger { border-color:rgba(239,68,68,.28); }

/* ---------- opportunity board ---------- */
.board {
  gap:11px;
  padding-bottom:10px;
  scrollbar-color:#34343a #080809;
}
.board-column {
  border-radius:11px;
  min-width:280px;
  background:#09090b;
}
.board-column-head {
  position:sticky;
  top:0;
  z-index:2;
  background:#09090b;
  border-color:#25252a;
}
.board-column-title { font-weight:720; }
.board-column-meta { color:#72727c; }
.board-column-body { padding:9px; }
.board-column.is-drop-target {
  border-color:rgba(229,9,20,.65);
  box-shadow:inset 0 0 0 1px rgba(229,9,20,.28);
}
.deal-card {
  position:relative;
  overflow:hidden;
  background:#101013;
  border-color:#29292f;
  border-radius:9px;
  box-shadow:0 5px 16px -13px rgba(0,0,0,.9);
}
.deal-card::before {
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:2px;
  background:#3a3a40;
}
.deal-card:hover {
  background:#141418;
  border-color:#44444b;
  transform:translateY(-1px);
}
.deal-card:has(.delta.down)::before { background:#e50914; width:3px; }
.deal-card:has(.delta.down) { border-color:rgba(229,9,20,.32); }
.deal-value { color:#fff; font-weight:720; }
.deal-move { border-top-color:#26262b; }
.deal-move button:hover { color:#ff4652; }

/* ---------- contact operating drawer ---------- */
.panel {
  border-left:1px solid #303036;
  background:#09090b;
  box-shadow:-24px 0 70px -38px rgba(0,0,0,.95);
}
.panel-head {
  background:linear-gradient(180deg,#101013,#0b0b0d);
  border-bottom-color:#29292f;
}
.panel-name { font-weight:760; }
.panel-quick-actions {
  gap:7px;
  padding-top:12px;
}
.panel-tabs {
  background:#08080a;
  border-bottom-color:#28282e;
}
.panel-tab {
  color:#85858f;
  font-weight:650;
}
.panel-tab[aria-selected="true"] {
  color:#fff;
  box-shadow:inset 0 -2px 0 #e50914;
}
.thread { padding-bottom:10px; }
.message.out .message-bubble {
  background:rgba(229,9,20,.10);
  border-color:rgba(229,9,20,.24);
}
.composer {
  background:#0d0d10;
  border-color:#29292f;
}

/* ---------- auth ---------- */
.auth-card {
  border-color:#2c2c31;
  background:linear-gradient(145deg,#101013,#080809);
}
.auth-story {
  background:
    radial-gradient(500px 260px at 0% 0%,rgba(229,9,20,.14),transparent 65%),
    #09090b;
}
.auth-eyebrow { color:#ff4652; }
.auth-shield { border-color:rgba(229,9,20,.22); background:rgba(229,9,20,.06); }

/* ---------- attention states ---------- */
.attention-item:hover { background:#101013; }
.attention-rail.high,
.attention-rail.critical { background:#e50914; }
.system-pill.is-alert {
  color:#ff626c;
  border-color:rgba(229,9,20,.28);
  background:rgba(229,9,20,.08);
}

.dropdown,.modal-card { border-radius:11px; }
.dropdown-item.unread { background:rgba(229,9,20,.055); }
.skeleton { background:#242429; }

/* Reduce decorative colour noise: reserve colour for status and action. */
.tag { background:#151519; border-color:#2c2c32; color:#a9a9b2; }
.tag.is-type,
.badge.accent { color:#ff626c; border-color:rgba(229,9,20,.25); background:rgba(229,9,20,.08); }

@media (max-width: 980px) {
  :root { --sidebar-width:250px; }
  .page { padding:22px 20px 34px; }
}

@media (max-width: 760px) {
  .page { padding:18px 13px 30px; }
  .topbar { height:60px; padding:0 11px; }
  .page-head { align-items:flex-start; }
  .page-head h1 { font-size:21px; }
  .page-actions { width:100%; overflow-x:auto; padding-bottom:2px; }
  .grid-kpi { grid-template-columns:1fr 1fr; gap:9px; }
  .kpi { min-height:104px; padding:14px; }
  .kpi-value { font-size:23px; }
  .daily-guide { padding:16px; }
  .daily-step { min-height:82px; }
  .toolbar { align-items:stretch; }
  .toolbar input,.toolbar select { width:100%; }
  .board-column { min-width:82vw; }
  .panel { width:min(100vw,560px); }
}

@media (max-width:480px) {
  .grid-kpi { grid-template-columns:1fr; }
  .search kbd { display:none; }
}