:root {
  --sales-navy: #11191d;
  --sales-teal: #087f78;
  --sales-teal-dark: #056a64;
  --sales-red: #b63f3f;
  --sales-orange: #b96522;
  --sales-yellow: #9b6a0b;
  --sales-green: #2f7f4f;
  --sales-blue: #315ca8;
}

.sales-app-body {
  --ink: #11191d;
  --muted: #64707a;
  --line: #dce2e6;
  --teal-soft: #e8f5f3;
  --amber-soft: #fff0e4;
  color-scheme: light;
  min-width: 320px;
  background: #eef2f5;
  color: var(--ink);
}
.sales-app-body .site-header { color: #f3faf7; }
.sales-app-body .site-header nav { color: #b5c5bf; }
.sales-app-body .site-header nav a:hover,
.sales-app-body .site-header nav a:focus-visible,
.sales-app-body .site-header nav a.active { color: #f3faf7; }
.sales-app-body .site-header nav a.active { box-shadow: inset 0 -2px #17d6a3; }
.sales-app-body p { margin-top: 0; }
.sales-app-body [hidden] { display: none !important; }
.sales-shell { width: min(1460px, calc(100% - 36px)); margin: 0 auto; padding: 32px 0 64px; }
.app-heading { display: flex; align-items: end; justify-content: space-between; gap: 28px; margin-bottom: 24px; }
.app-heading h1 { max-width: none; margin: 0; font-size: clamp(1.85rem, 3vw, 2.6rem); line-height: 1.05; }
.app-heading > div:first-child > p:last-child { margin-top: 8px; color: var(--muted); max-width: 780px; }
.app-eyebrow { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; color: var(--sales-teal); font-size: .75rem; font-weight: 900; letter-spacing: .09em; text-transform: uppercase; }
.live-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--sales-teal); box-shadow: 0 0 0 4px rgba(8,127,120,.13); }
.app-heading-actions { display: flex; align-items: center; gap: 14px; }
.sync-status { color: var(--muted); font-size: .82rem; text-align: right; }
.app-button { min-height: 40px; border: 1px solid var(--line); border-radius: 7px; padding: 9px 14px; background: #fff; color: var(--ink); font: inherit; font-size: .88rem; font-weight: 800; cursor: pointer; }
.app-button:hover, .app-button:focus-visible { border-color: #aeb8c1; transform: translateY(-1px); }
.primary-button { border-color: var(--sales-teal); background: var(--sales-teal); color: #fff; }
.primary-button:hover { border-color: var(--sales-teal-dark); background: var(--sales-teal-dark); }
.secondary-button { white-space: nowrap; }
.text-button { border: 0; padding: 8px; background: none; color: var(--sales-teal); font: inherit; font-weight: 800; cursor: pointer; }

.summary-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; margin-bottom: 18px; }
.summary-card { position: relative; min-height: 128px; overflow: hidden; border: 1px solid var(--line); border-radius: 8px; padding: 18px; background: #fff; box-shadow: 0 8px 24px rgba(16,20,23,.045); }
.summary-card::before { position: absolute; top: 0; left: 0; width: 100%; height: 3px; background: var(--sales-teal); content: ""; }
.summary-card span { display: block; color: #56626c; font-size: .75rem; font-weight: 850; letter-spacing: .035em; text-transform: uppercase; }
.summary-card strong { display: block; margin-top: 10px; font-size: clamp(1.55rem, 2.2vw, 2.1rem); line-height: 1; }
.summary-card small { display: block; margin-top: 9px; color: #78838c; }
.summary-card.accent-hot::before { background: var(--sales-red); }
.summary-card.accent-hot strong { color: var(--sales-red); }

.workspace-card { overflow: hidden; border: 1px solid var(--line); border-radius: 9px; background: #fff; box-shadow: 0 18px 46px rgba(16,20,23,.07); }
.workspace-tabs { display: flex; gap: 2px; overflow-x: auto; border-bottom: 1px solid var(--line); padding: 0 18px; background: #fafbfc; }
.workspace-tab { position: relative; border: 0; padding: 17px 16px 15px; background: transparent; color: #64707a; font: inherit; font-size: .9rem; font-weight: 850; cursor: pointer; white-space: nowrap; }
.workspace-tab::after { position: absolute; right: 12px; bottom: -1px; left: 12px; height: 3px; border-radius: 3px 3px 0 0; background: transparent; content: ""; }
.workspace-tab.active { color: var(--ink); }
.workspace-tab.active::after { background: var(--sales-teal); }
.workspace-tab span { display: inline-grid; min-width: 22px; height: 21px; margin-left: 5px; place-items: center; border-radius: 20px; background: #e9edef; padding: 0 6px; font-size: .72rem; }
.tab-panel { min-height: 500px; }
.lead-toolbar, .panel-heading { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 20px 22px 14px; }
.search-field { display: flex; width: min(620px, 100%); min-height: 42px; align-items: center; gap: 9px; border: 1px solid var(--line); border-radius: 7px; padding: 0 12px; background: #fff; }
.search-field:focus-within { border-color: var(--sales-teal); box-shadow: 0 0 0 3px rgba(8,127,120,.1); }
.search-field input { width: 100%; border: 0; outline: 0; background: transparent; font: inherit; }
.sort-field { display: flex; align-items: center; gap: 7px; color: var(--muted); font-size: .82rem; white-space: nowrap; }
select, input, textarea { border: 1px solid #cfd6dc; border-radius: 6px; background: #fff; color: var(--ink); padding: 9px 10px; font: inherit; }
select:focus, input:focus, textarea:focus { border-color: var(--sales-teal); outline: 3px solid rgba(8,127,120,.1); }
.sort-field select { min-height: 40px; }
.filter-button { display: block; }
.quick-filters { display: flex; gap: 7px; overflow-x: auto; padding: 0 22px 15px; scrollbar-width: thin; }
.quick-filter { border: 1px solid var(--line); border-radius: 99px; padding: 7px 11px; background: #fff; color: #53606a; font: inherit; font-size: .77rem; font-weight: 800; cursor: pointer; white-space: nowrap; }
.quick-filter:hover, .quick-filter.active { border-color: var(--sales-teal); background: var(--teal-soft); color: var(--sales-teal); }
.quick-filter.hot-filter.active, .quick-filter.hot-filter:hover { border-color: #e3b3b3; background: #fff0f0; color: var(--sales-red); }
.advanced-filters { display: grid; grid-template-columns: repeat(7, minmax(130px, 1fr)); gap: 12px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 16px 22px; background: #f7f9fa; }
.advanced-filters label, .settings-card label { display: grid; gap: 5px; color: #59656f; font-size: .74rem; font-weight: 800; }
.advanced-filters input, .advanced-filters select { width: 100%; min-height: 39px; font-size: .82rem; }
.advanced-filters .project-group-filter { grid-column: span 4; min-width: 0; border: 1px solid #cfd6dc; border-radius: 7px; padding: 9px 11px 11px; background: #fff; }
.project-group-filter legend { padding: 0 5px; color: #59656f; font-size: .74rem; font-weight: 850; }
.project-group-options { display: flex; max-height: 118px; flex-wrap: wrap; gap: 7px; overflow-y: auto; padding: 2px; }
.advanced-filters .project-group-options label { display: flex; width: auto; align-items: center; gap: 6px; border: 1px solid #dce2e6; border-radius: 99px; padding: 6px 9px; background: #f9fbfb; color: #4d5b64; cursor: pointer; font-size: .72rem; white-space: nowrap; }
.advanced-filters .project-group-options label:has(input:checked) { border-color: var(--sales-teal); background: var(--teal-soft); color: var(--sales-teal-dark); }
.advanced-filters .project-group-options input { width: 14px; min-height: 14px; margin: 0; accent-color: var(--sales-teal); }
.filter-actions { display: flex; align-items: end; gap: 6px; }

.table-wrap { width: 100%; overflow-x: auto; }
.data-table { width: 100%; border-collapse: collapse; font-size: .8rem; white-space: nowrap; }
.data-table th { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 11px 12px; background: #f6f8f9; color: #59656e; font-size: .69rem; letter-spacing: .045em; text-align: left; text-transform: uppercase; }
.data-table th.sortable-column { padding: 0; }
.sort-button { display: flex; width: 100%; min-height: 39px; align-items: center; justify-content: space-between; gap: 7px; border: 0; padding: 10px 12px; background: transparent; color: inherit; font: inherit; font-weight: 800; letter-spacing: inherit; text-align: left; text-transform: inherit; cursor: pointer; white-space: nowrap; }
.sort-button:hover, .sort-button:focus-visible { background: #eaf1f2; color: var(--sales-teal); outline: none; }
.sort-button:focus-visible { box-shadow: inset 0 0 0 2px var(--sales-teal); }
.sort-button.active { background: #edf6f4; color: var(--sales-teal-dark); }
.sort-indicator { min-width: 12px; color: #89959e; font-size: .82rem; line-height: 1; }
.sort-button.active .sort-indicator { color: var(--sales-teal); }
.data-table td { border-bottom: 1px solid #e8ecef; padding: 12px; color: #37424a; vertical-align: middle; }
.data-table tbody tr[data-id] { cursor: pointer; }
.data-table tbody tr[data-id]:hover { background: #f3faf9; }
.data-table .address-cell { max-width: 260px; overflow: hidden; color: var(--ink); font-weight: 800; text-overflow: ellipsis; }
.data-table .contractor-cell { max-width: 200px; overflow: hidden; text-overflow: ellipsis; }
.data-table .contact-cell { min-width: 185px; max-width: 235px; white-space: normal; }
.lead-contact { display: grid; gap: 4px; align-items: start; }
.lead-contact a { width: fit-content; color: var(--sales-teal-dark); font-size: .73rem; font-weight: 800; text-decoration: none; overflow-wrap: anywhere; }
.lead-contact a:hover, .lead-contact a:focus-visible { text-decoration: underline; }
.lead-contact .license-lookup-link { margin-top: 2px; color: var(--sales-blue); }
.contact-missing { color: #879198; font-size: .72rem; font-style: italic; }
.builder-tools { display: flex; align-items: end; gap: 10px; }
.lookup-note { margin-top: 14px; color: var(--muted); font-size: .75rem; line-height: 1.5; }
.data-table .score-cell { color: var(--ink); font-size: .98rem; font-weight: 900; }
.score-ring { display: inline-grid; width: 39px; height: 39px; place-items: center; border: 3px solid #c9d2d8; border-radius: 50%; background: #fff; }
.score-ring.hot { border-color: var(--sales-red); color: var(--sales-red); }
.score-ring.high { border-color: var(--sales-orange); color: var(--sales-orange); }
.score-ring.medium { border-color: var(--sales-yellow); color: var(--sales-yellow); }
.score-ring.low { border-color: #89959e; color: #626e77; }
.priority, .status-pill, .health-pill, .count-pill { display: inline-flex; align-items: center; border-radius: 99px; padding: 5px 8px; font-size: .66rem; font-weight: 900; letter-spacing: .04em; }
.priority.hot { background: #ffeded; color: var(--sales-red); }
.priority.high { background: var(--amber-soft); color: var(--sales-orange); }
.priority.medium { background: #fff7d9; color: #80600d; }
.priority.low, .priority.not_relevant { background: #edf0f2; color: #66717a; }
.status-pill { background: #edf3f8; color: var(--sales-blue); }
.empty-cell { padding: 44px !important; color: var(--muted) !important; text-align: center !important; white-space: normal; }
.pagination { display: flex; align-items: center; justify-content: space-between; gap: 16px; border-top: 1px solid var(--line); padding: 14px 22px; color: var(--muted); font-size: .78rem; }
.pagination > div { display: flex; align-items: center; gap: 12px; }
.pagination button { border: 1px solid var(--line); border-radius: 5px; padding: 7px 10px; background: #fff; cursor: pointer; }
.pagination button:disabled { opacity: .45; cursor: default; }

.panel-heading { padding: 24px 22px; }
.panel-heading h2, .settings-card h2 { font-size: 1.25rem; }
.panel-heading p, .settings-card > p, .settings-title-row p { margin-top: 6px; color: var(--muted); font-size: .86rem; }
.compact-search { display: grid; gap: 4px; color: var(--muted); font-size: .72rem; font-weight: 800; }
.compact-search input { min-width: 240px; }
.builder-name { color: var(--ink); font-weight: 900; }
.builder-score { color: var(--sales-teal); font-size: .96rem; font-weight: 900; }

.map-legend { display: flex; gap: 14px; color: var(--muted); font-size: .75rem; }
.map-legend span { display: flex; align-items: center; gap: 5px; }
.dot { display: inline-block; width: 9px; height: 9px; border-radius: 50%; }
.dot.hot { background: var(--sales-red); }.dot.high { background: var(--sales-orange); }.dot.medium { background: var(--sales-teal); }
.permit-map { position: relative; height: min(620px, 64vh); min-height: 430px; overflow: hidden; margin: 0 22px; border: 1px solid #cbd4da; border-radius: 8px; background: linear-gradient(145deg, #e8eee9, #dbe6e2); }
.map-grid { position: absolute; inset: 0; opacity: .45; background-image: linear-gradient(rgba(60,87,83,.12) 1px, transparent 1px), linear-gradient(90deg, rgba(60,87,83,.12) 1px, transparent 1px); background-size: 48px 48px; }
.map-grid::before, .map-grid::after { position: absolute; border: 2px solid rgba(59,99,91,.24); border-radius: 46% 54% 54% 46%; content: ""; transform: rotate(-8deg); }
.map-grid::before { inset: 11% 19% 14% 15%; }.map-grid::after { inset: 24% 35% 26% 36%; border-radius: 56% 44% 38% 62%; }
.map-watermark { position: absolute; right: 28px; bottom: 22px; color: rgba(40,75,69,.25); font-size: clamp(1rem, 3vw, 2.7rem); font-weight: 950; letter-spacing: .08em; }
.map-marker { position: absolute; z-index: 3; width: 17px; height: 17px; border: 3px solid #fff; border-radius: 50%; background: var(--sales-teal); box-shadow: 0 4px 10px rgba(16,20,23,.28); cursor: pointer; transform: translate(-50%, -50%); }
.map-marker.hot { width: 23px; height: 23px; background: var(--sales-red); }.map-marker.high { width: 20px; height: 20px; background: var(--sales-orange); }
.map-marker:hover, .map-marker:focus-visible { z-index: 5; outline: 4px solid rgba(8,127,120,.2); }
.map-tooltip { position: absolute; z-index: 6; width: 250px; border: 1px solid var(--line); border-radius: 7px; padding: 12px; background: #fff; box-shadow: 0 14px 36px rgba(16,20,23,.2); font-size: .78rem; pointer-events: none; transform: translate(-50%, calc(-100% - 15px)); }
.map-tooltip strong { display: block; margin-bottom: 5px; color: var(--ink); }.map-tooltip span { color: var(--muted); }
.map-empty { position: absolute; inset: 0; display: grid; place-items: center; color: #61706e; }
.map-disclaimer { margin: 10px 22px 24px; color: var(--muted); font-size: .74rem; }

.source-policy { border: 1px solid var(--line); border-radius: 99px; padding: 7px 11px; color: var(--muted); font-size: .72rem; font-weight: 800; }
.source-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; padding: 0 22px 24px; }
.source-card { border: 1px solid var(--line); border-radius: 8px; padding: 17px; }
.source-card-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.source-card h3 { font-size: 1rem; }.source-card > p { margin-top: 5px; color: var(--muted); font-size: .76rem; }
.health-pill.online { background: #e7f4eb; color: var(--sales-green); }.health-pill.degraded { background: #fff4dc; color: #8a6612; }.health-pill.offline { background: #ffeded; color: var(--sales-red); }.health-pill.not_configured { background: #edf0f2; color: #68737b; }
.source-metrics { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 10px; margin-top: 14px; }
.source-metrics div { border-radius: 6px; background: #f6f8f9; padding: 9px; }.source-metrics span { display: block; color: #76818a; font-size: .62rem; font-weight: 800; text-transform: uppercase; }.source-metrics strong { display: block; margin-top: 3px; color: #344049; font-size: .78rem; }
.source-error { color: var(--sales-red) !important; }

.settings-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; padding: 24px 22px; background: #f7f9fa; }
.settings-card { border: 1px solid var(--line); border-radius: 8px; padding: 20px; background: #fff; }
.settings-card.full { grid-column: 1 / -1; }.settings-card form, .settings-card > label { display: grid; gap: 12px; margin-top: 16px; }.settings-card .app-button { width: fit-content; margin-top: 12px; }
.admin-session-row { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-top: 18px; }
.admin-session-row .app-button { margin-top: 0; text-align: center; }
.settings-title-row { display: flex; justify-content: space-between; gap: 16px; }.count-pill { align-self: start; background: var(--teal-soft); color: var(--sales-teal); }
.alert-list { display: grid; gap: 8px; margin-top: 16px; }.alert-item { display: flex; justify-content: space-between; gap: 18px; border-top: 1px solid var(--line); padding-top: 12px; }.alert-item strong { display: block; }.alert-item span { color: var(--muted); font-size: .78rem; }

.drawer-scrim { position: fixed; z-index: 39; inset: 0; background: rgba(15,20,23,.45); backdrop-filter: blur(2px); }
.lead-drawer { position: fixed; z-index: 40; top: 0; right: 0; width: min(620px, 100%); height: 100vh; overflow-y: auto; border-left: 1px solid var(--line); background: #fff; box-shadow: -24px 0 70px rgba(16,20,23,.22); transform: translateX(105%); transition: transform 190ms ease; }
.lead-drawer.open { transform: translateX(0); }.drawer-close { position: absolute; z-index: 2; top: 17px; right: 18px; display: grid; width: 36px; height: 36px; place-items: center; border: 1px solid var(--line); border-radius: 50%; background: #fff; color: #46515a; font-size: 1.5rem; cursor: pointer; }
.drawer-hero { padding: 30px 58px 24px 28px; background: var(--sales-navy); color: #fff; }.drawer-hero h2 { margin-top: 12px; font-size: 1.45rem; }.drawer-hero p { margin-top: 8px; color: rgba(255,255,255,.7); }
.drawer-score-row { display: flex; align-items: center; gap: 12px; }.drawer-score-row .score-ring { width: 56px; height: 56px; border-width: 4px; background: transparent; color: #fff; font-size: 1.25rem; }.drawer-priority { display: grid; gap: 3px; }.drawer-priority strong { font-size: .9rem; }.drawer-priority span { color: rgba(255,255,255,.66); font-size: .76rem; }
.drawer-section { border-bottom: 1px solid var(--line); padding: 22px 28px; }.drawer-section h3 { margin-bottom: 14px; font-size: .82rem; letter-spacing: .06em; text-transform: uppercase; }.detail-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 15px 20px; }.detail-item span { display: block; color: #78838b; font-size: .68rem; font-weight: 800; letter-spacing: .035em; text-transform: uppercase; }.detail-item strong, .detail-item a { display: block; margin-top: 4px; color: #28333a; font-size: .9rem; overflow-wrap: anywhere; }.drawer-reason { border-left: 3px solid var(--sales-teal); padding-left: 13px; color: #39454c; }
.service-list { display: flex; flex-wrap: wrap; gap: 7px; }.service-list span { border-radius: 99px; background: var(--teal-soft); padding: 6px 9px; color: var(--sales-teal); font-size: .74rem; font-weight: 800; }
.timing-callout { border: 1px solid #cde3df; border-radius: 7px; background: #f1faf8; padding: 14px; }.timing-callout strong { display: block; color: var(--sales-teal); }.timing-callout span { display: block; margin-top: 4px; color: var(--muted); font-size: .8rem; }
.workflow-form { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }.workflow-form label, .note-form label { display: grid; gap: 5px; color: var(--muted); font-size: .72rem; font-weight: 800; }.workflow-form .full { grid-column: 1 / -1; }.workflow-form button { width: fit-content; }
.note-form { display: grid; gap: 8px; }.note-form textarea { min-height: 80px; resize: vertical; }.note-list { display: grid; gap: 10px; margin-top: 16px; }.note-item { border-left: 2px solid var(--line); padding-left: 12px; }.note-item p { color: #39454c; white-space: pre-wrap; }.note-item span { display: block; margin-top: 4px; color: #7b858c; font-size: .68rem; }
.toast { position: fixed; z-index: 50; right: 22px; bottom: 22px; max-width: 380px; border-radius: 7px; padding: 13px 16px; background: #11191d; color: #fff; box-shadow: 0 12px 32px rgba(0,0,0,.25); font-size: .85rem; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; }

@media (max-width: 1180px) { .summary-grid { grid-template-columns: repeat(3,1fr); }.advanced-filters { grid-template-columns: repeat(4,1fr); } }
@media (max-width: 780px) {
  .sales-shell { width: min(100% - 20px, 1460px); padding-top: 22px; }.nav { width: min(100% - 24px, var(--max)); }.nav-links .nav-link:not(.active) { display: none; }
  .app-heading { align-items: start; flex-direction: column; }.app-heading-actions { width: 100%; justify-content: space-between; }.sync-status { text-align: left; }
  .summary-grid { grid-template-columns: repeat(2,1fr); }.summary-card { min-height: 112px; padding: 15px; }
  .lead-toolbar { flex-wrap: wrap; }.search-field { order: 1; width: 100%; }.sort-field { order: 2; }.filter-button { display: block; order: 3; }
  .advanced-filters { grid-template-columns: repeat(2,1fr); }.advanced-filters .project-group-filter { grid-column: 1 / -1; }.panel-heading { align-items: start; flex-direction: column; }.builder-tools { width: 100%; align-items: stretch; flex-direction: column; }.compact-search, .compact-search input { width: 100%; }
  .source-list { grid-template-columns: 1fr; }.settings-grid { grid-template-columns: 1fr; }.settings-card.full { grid-column: auto; }.permit-map { margin: 0 12px; }.map-legend { flex-wrap: wrap; }
}
@media (max-width: 500px) { .summary-grid { grid-template-columns: 1fr 1fr; gap: 8px; }.summary-card small { display: none; }.summary-card { min-height: 94px; }.advanced-filters { grid-template-columns: 1fr; }.detail-grid, .workflow-form { grid-template-columns: 1fr; }.workflow-form .full { grid-column: auto; }.source-metrics { grid-template-columns: repeat(2,1fr); }.app-heading-actions { align-items: start; flex-direction: column; }.pagination { align-items: start; flex-direction: column; } }
@media (prefers-reduced-motion: reduce) { .lead-drawer { transition: none; } }
