/*
 * SalesConnect workspace palette, phase one.
 * Scoped to authenticated workspaces so behavior and public/login screens are unchanged.
 */
#mainApp,
#dgApp {
  --pro-navy: #07111f;
  --pro-navy-mid: #0d1d2c;
  --pro-bg: #f3f1e9;
  --pro-surface: #fffefa;
  --pro-border: #d9ded6;
  --pro-border-dark: #bdc6bc;
  --pro-text: #0b1725;
  --pro-text-2: #344552;
  --pro-text-3: #667580;
  --pro-text-4: #929c9f;
  --pro-shadow-sm: 0 1px 2px rgba(7, 17, 31, 0.04), 0 4px 12px rgba(7, 17, 31, 0.025);
  --pro-shadow-md: 0 8px 24px rgba(7, 17, 31, 0.07);
  --sc-signal: #c8ff3d;
  --sc-signal-dark: #6b8f00;
  --sc-paper: #f3f2eb;
  --sc-paper-2: #e9e7dc;
}

#mainApp,
#dgApp,
#mainApp button,
#dgApp button,
#mainApp input,
#dgApp input,
#mainApp select,
#dgApp select,
#mainApp textarea,
#dgApp textarea {
  font-family: "Archivo", sans-serif !important;
}

#mainApp .main-container,
#dgApp .main-container,
#mainApp .tab-content.active,
#dgApp .tab-content.active {
  background: var(--pro-bg) !important;
}

#mainApp .header,
#dgApp .header {
  background: var(--pro-navy) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

#mainApp .user-badge,
#dgApp #dgUserBadge {
  color: #f8fafc !important;
  background: rgba(255, 255, 255, 0.08) !important;
  border: 1px solid rgba(255, 255, 255, 0.16) !important;
  box-shadow: none !important;
}

#mainApp .category-legend,
#dgApp .category-legend,
#mainApp .stat-card,
#dgApp .stat-card,
#mainApp .prospect-card,
#dgApp .prospect-card,
#mainApp .select-all-container,
#dgApp .select-all-container,
#mainApp .upcoming-followups,
#dgApp .upcoming-followups {
  background: var(--pro-surface) !important;
  border-color: var(--pro-border) !important;
}

#mainApp .filter-section:not(.hierarchy-filters),
#dgApp .filter-section:not(.hierarchy-filters) {
  background: rgba(255, 254, 250, 0.72) !important;
  border: 1px solid var(--pro-border) !important;
  box-shadow: 0 10px 32px rgba(7, 17, 31, 0.035) !important;
}

#mainApp .tab-content h2,
#mainApp .tab-content h3,
#dgApp .tab-content h2,
#dgApp .tab-content h3,
#mainApp .prospect-name,
#dgApp .prospect-name {
  color: var(--pro-text) !important;
  font-family: "Archivo", sans-serif !important;
}

#mainApp input:focus,
#mainApp select:focus,
#mainApp textarea:focus,
#dgApp input:focus,
#dgApp select:focus,
#dgApp textarea:focus {
  border-color: #88ad27 !important;
  box-shadow: 0 0 0 3px rgba(184, 255, 44, 0.2) !important;
  outline: none !important;
}

#mainApp input,
#mainApp select,
#mainApp textarea,
#dgApp input,
#dgApp select,
#dgApp textarea {
  border-color: var(--pro-border) !important;
  color: var(--pro-text) !important;
  background: #fff !important;
}

/* Readability pass: raise everyday workspace text without applying a page-wide
   zoom. Deliberately leave headings, status badges, icons, and data-table
   sizing alone so existing layouts remain stable. */
#mainApp,
#dgApp {
  font-size: 15px;
}

#mainApp .tab-content p,
#dgApp .tab-content p,
#mainApp .tab-content label,
#dgApp .tab-content label,
#mainApp .tab-content input,
#dgApp .tab-content input,
#mainApp .tab-content select,
#dgApp .tab-content select,
#mainApp .tab-content textarea,
#dgApp .tab-content textarea {
  font-size: 14px !important;
}

#mainApp .prospect-company,
#dgApp .prospect-company,
#mainApp .prospect-meta,
#dgApp .prospect-meta,
#mainApp .form-help,
#dgApp .form-help {
  font-size: 13px !important;
}

#sc-prospect-panel .sc-fp-workspace {
  font-size: 14px;
}

#sc-prospect-panel .sc-fp-workspace .sc-fp-company-meta,
#sc-prospect-panel .sc-fp-workspace .sc-fp-score-factor > div:first-child,
#sc-prospect-panel .sc-fp-workspace .sc-fp-score-summary p,
#sc-prospect-panel .sc-fp-workspace .sc-fp-score-summary p b {
  font-size: 12px;
}

#sc-prospect-panel .sc-fp-workspace .sc-fp-kicker,
#sc-prospect-panel .sc-fp-workspace .sc-fp-section-head span,
#sc-prospect-panel .sc-fp-workspace .sc-fp-ai-content span,
#sc-prospect-panel .sc-fp-workspace .sc-fp-enhance-grid article > span {
  font-size: 11px;
}

.workspace-search-control {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: stretch;
  gap: 6px;
  width: 100%;
}

.workspace-search-control input[type="search"] {
  width: 100% !important;
  min-width: 0;
}

.workspace-search-button {
  min-width: 78px;
  min-height: 38px;
  margin: 0;
  padding: 8px 14px;
  border: 1px solid #88ad27;
  border-radius: 7px;
  color: #07111f;
  background: #b8ff2c;
  box-shadow: none;
  font-family: "Archivo", sans-serif;
  font-size: 12px;
  font-weight: 750;
  cursor: pointer;
}

.workspace-search-button:hover {
  border-color: #789c23;
  background: #a9ee27;
}

.workspace-search-button:focus-visible {
  outline: 3px solid rgba(184, 255, 44, 0.28);
  outline-offset: 2px;
}

@media (max-width: 620px) {
  .workspace-search-control {
    grid-template-columns: minmax(0, 1fr) 72px;
  }

  .workspace-search-button {
    min-width: 72px;
    padding-inline: 10px;
  }
}

/* Shared workspace density and homepage-aligned surfaces. */
#mainApp .tab-content.active,
#dgApp .tab-content.active {
  padding: 14px 16px !important;
}

#mainApp .category-legend,
#dgApp .category-legend,
#mainApp .filter-section:not(.hierarchy-filters),
#dgApp .filter-section:not(.hierarchy-filters),
#mainApp .select-all-container,
#dgApp .select-all-container,
#mainApp .prospect-data-tools,
#dgApp .prospect-data-tools {
  border: 1px solid var(--pro-border) !important;
  border-radius: 10px !important;
  background: var(--pro-surface) !important;
  box-shadow: var(--pro-shadow-sm) !important;
}

#mainApp .filter-section:not(.hierarchy-filters),
#dgApp .filter-section:not(.hierarchy-filters) {
  padding: 12px 14px !important;
  margin-bottom: 10px !important;
}

#mainApp .filter-section label,
#dgApp .filter-section label,
#mainApp .form-group label,
#dgApp .form-group label {
  color: #53616c !important;
  font-family: "IBM Plex Mono", monospace !important;
  font-size: 10px !important;
  font-weight: 600 !important;
  letter-spacing: 0.055em;
  text-transform: uppercase;
}

#mainApp input,
#mainApp select,
#mainApp textarea,
#dgApp input,
#dgApp select,
#dgApp textarea {
  border-radius: 7px !important;
  box-shadow: none !important;
}

#mainApp .btn-primary,
#mainApp button.btn-primary,
#dgApp .btn-primary,
#dgApp button.btn-primary {
  color: var(--pro-navy) !important;
  background: var(--sc-signal) !important;
  border: 1px solid #a8db24 !important;
  box-shadow: none !important;
}

#mainApp .btn-primary:hover,
#dgApp .btn-primary:hover {
  background: #b9ee32 !important;
}

#mainApp .btn-secondary,
#mainApp button.btn-secondary,
#dgApp .btn-secondary,
#dgApp button.btn-secondary {
  color: var(--pro-text-2) !important;
  background: #fff !important;
  border: 1px solid var(--pro-border-dark) !important;
}

/* Prospect actions keep their behavior while gaining a consistent hierarchy. */
#mainApp button.sc-pd-view-btn,
#mainApp button[onclick*="openProspectDetail("],
#dgApp button[onclick*="dgOpenProspect("] {
  color: var(--pro-navy) !important;
  background: #fff !important;
  border: 1px solid #bac5cb !important;
  box-shadow: none !important;
}

#mainApp button[onclick*="openActivityModal("],
#dgApp button[onclick*="dgLaunchActivityAction("] {
  color: var(--pro-navy) !important;
  background: var(--sc-signal) !important;
  border: 1px solid #a8db24 !important;
  box-shadow: none !important;
}

#mainApp button[onclick*="showHandoffModal("],
#dgApp button[onclick*="dgLaunchHandoffAction("] {
  color: #fff !important;
  background: #294150 !important;
  border: 1px solid #294150 !important;
  box-shadow: none !important;
}

#mainApp button[onclick*="openDealDeskModal("],
#dgApp button[onclick*="dgLaunchDealDeskAction("] {
  color: #fff !important;
  background: var(--pro-navy) !important;
  border: 1px solid var(--pro-navy) !important;
  box-shadow: none !important;
}

#mainApp .prospect-card,
#dgApp .prospect-card {
  border-color: var(--pro-border) !important;
  box-shadow: 0 1px 0 rgba(7, 17, 31, 0.04) !important;
}

#mainApp .prospect-card:hover,
#dgApp .prospect-card:hover {
  box-shadow: 0 6px 18px rgba(7, 17, 31, 0.07) !important;
}

#mainApp .prospect-data-tools-title,
#dgApp .prospect-data-tools-title {
  color: var(--pro-text-2) !important;
  background: transparent !important;
  padding: 7px 10px 5px;
  border-bottom: 1px solid var(--pro-border);
  font-size: 11px;
  font-weight: 700;
}

#mainApp .prospect-data-tools-title::before,
#dgApp .prospect-data-tools-title::before {
  content: "\2195";
  margin-right: 7px;
  color: var(--sc-signal-dark) !important;
}

#mainApp .prospect-data-tools-grid,
#dgApp .prospect-data-tools-grid {
  background: #fbfcf7;
}

/* Compact Prospect workspace summary and filter bar. */
#mainApp #statsRow > div {
  height: 48px !important;
  max-height: 48px !important;
  min-height: 48px;
  overflow: hidden;
}

#mainApp #prospectStatsGrid > div,
#mainApp #sqlStatsGrid > div {
  min-height: 48px;
  box-sizing: border-box;
  padding: 5px 9px !important;
  background: var(--pro-surface) !important;
  border-color: var(--pro-border) !important;
  box-shadow: none !important;
}

#mainApp #prospectStatsGrid > div {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

#mainApp #totalProspects,
#mainApp #hotProspects,
#mainApp #warmProspects,
#mainApp #pendingFollowups,
#mainApp #soldCount,
#mainApp #quotedCount,
#mainApp #lostCount {
  padding: 0 !important;
  font-size: 18px !important;
  line-height: 1 !important;
}

#mainApp #prospectStatsGrid > div > div:last-child {
  margin: 0 !important;
  color: var(--pro-text-3) !important;
  font-size: 10px !important;
  font-weight: 600 !important;
}

#mainApp #sqlStatsGrid > div > div:last-child,
#mainApp #sqlStatsGrid > div > div:last-child > div {
  padding: 0 !important;
}

#mainApp .prospect-data-tools .prospect-data-tools-grid {
  padding: 6px !important;
  gap: 5px !important;
}

#mainApp .prospect-data-tools button {
  min-height: 30px;
  padding: 5px 8px !important;
  font-size: 11px !important;
  box-shadow: none !important;
}

#mainApp #prospectsTab .prospect-filter-bar {
  padding: 10px 12px !important;
}

#mainApp #prospectsTab .prospect-filter-bar .filter-row {
  display: grid !important;
  grid-template-columns:
    minmax(150px, 1.4fr)
    minmax(130px, 1.15fr)
    repeat(4, minmax(105px, 0.85fr))
    minmax(185px, 1.25fr)
    minmax(135px, 1fr);
  align-items: flex-end !important;
  gap: 7px !important;
}

#mainApp #prospectsTab .prospect-filter-bar .filter-row:has(#dgSharedLocationFilterGroup:not([style*="display:none"])) {
  grid-template-columns:
    minmax(145px, 1.25fr)
    minmax(120px, 1fr)
    minmax(110px, 0.9fr)
    repeat(4, minmax(100px, 0.8fr))
    minmax(180px, 1.2fr)
    minmax(130px, 0.95fr);
}

#mainApp #prospectsTab .prospect-filter-bar .filter-group {
  width: auto !important;
  min-width: 120px !important;
  margin: 0 !important;
}

#mainApp #prospectsTab .prospect-filter-bar .filter-group:first-child {
  min-width: 150px !important;
}

#mainApp #prospectsTab .prospect-filter-bar .filter-group:nth-child(2) {
  min-width: 130px !important;
}

#mainApp #prospectsTab .prospect-filter-bar .filter-group:nth-last-child(2) {
  min-width: 185px !important;
}

#mainApp #prospectsTab .prospect-filter-bar .filter-group:nth-last-child(2) > div {
  flex-wrap: nowrap !important;
  gap: 4px !important;
}

#mainApp #prospectsTab .prospect-filter-bar .filter-group:last-child {
  min-width: 135px !important;
}

#mainApp #prospectsTab .prospect-filter-bar input,
#mainApp #prospectsTab .prospect-filter-bar select {
  width: 100% !important;
  min-width: 0 !important;
  height: 36px !important;
  margin: 0 !important;
  padding: 6px 10px !important;
  box-sizing: border-box;
  font-size: 12px !important;
}

#mainApp #prospectsTab .prospect-filter-bar .status-filter-btn {
  min-height: 36px;
  padding: 6px 10px !important;
  box-shadow: none !important;
}

#mainApp #selectAllContainer {
  min-height: 38px;
  box-sizing: border-box;
  margin: 0 0 8px !important;
  padding: 7px 12px !important;
}

@media (min-width: 901px) and (max-width: 1450px) {
  #mainApp #prospectsTab .prospect-filter-bar .filter-row,
  #mainApp #prospectsTab .prospect-filter-bar .filter-row:has(#dgSharedLocationFilterGroup:not([style*="display:none"])) {
    grid-template-columns: repeat(4, minmax(130px, 1fr));
  }
}

/* Legacy Dealer Group prospect shell mirrors the shared compact layout. */
#dgApp .dg-category-legend {
  display: flex;
  align-items: center;
  gap: 18px;
  padding: 7px 14px !important;
  margin-bottom: 8px !important;
}

#dgApp .dg-category-legend > div:last-child {
  flex: 1;
}

#dgApp #dgDailyDashboard {
  margin-bottom: 8px !important;
}

#dgApp .daily-dashboard-card {
  min-height: 90px;
  box-sizing: border-box;
  padding: 10px 12px !important;
}

#dgApp .dg-stats-row {
  grid-template-columns: 4fr 3fr;
  gap: 5px !important;
  margin-bottom: 8px !important;
}

#dgApp .dg-stats-row > div {
  gap: 5px !important;
}

#dgApp .dg-stats-row > div > div {
  padding: 7px 9px !important;
  border-color: var(--pro-border) !important;
  background: var(--pro-surface) !important;
}

#dgApp .dg-data-tools {
  margin-bottom: 8px !important;
}

#dgApp .dg-data-tools summary {
  min-height: 36px;
  display: flex;
  align-items: center;
  padding: 8px 12px;
  cursor: pointer;
  font-size: 12px;
  font-weight: 700;
  list-style: none;
}

#dgApp .dg-data-tools summary::-webkit-details-marker {
  display: none;
}

#dgApp .dg-data-tools summary::before {
  content: "\21C5";
  margin-right: 8px;
  font-size: 16px;
}

#dgApp .dg-data-tools[open] summary {
  border-bottom: 1px solid var(--pro-border);
}

#dgApp .dg-data-tools .prospect-data-tools-grid {
  padding: 8px;
}

@media (max-width: 900px) {
  #mainApp .tab-content.active,
  #dgApp .tab-content.active {
    padding: 10px !important;
  }

  #dgApp .dg-category-legend {
    display: block;
  }

  #dgApp .dg-stats-row {
    grid-template-columns: 1fr;
  }

  #mainApp #prospectsTab .prospect-filter-bar .filter-row,
  #mainApp #prospectsTab .prospect-filter-bar .filter-row:has(#dgSharedLocationFilterGroup:not([style*="display:none"])) {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    align-items: end !important;
  }

  #mainApp #prospectsTab .prospect-filter-bar .filter-group,
  #mainApp #prospectsTab .prospect-filter-bar .filter-group:first-child,
  #mainApp #prospectsTab .prospect-filter-bar .filter-group:nth-child(2),
  #mainApp #prospectsTab .prospect-filter-bar .filter-group:nth-last-child(2),
  #mainApp #prospectsTab .prospect-filter-bar .filter-group:last-child {
    width: 100% !important;
    min-width: 0 !important;
  }

  #mainApp #prospectsTab .prospect-filter-bar .prospect-search-group {
    grid-column: 1 / -1;
  }
}

@media (max-width: 520px) {
  #mainApp .header,
  #dgApp .header {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 8px !important;
    margin: 0 !important;
    padding: calc(10px + env(safe-area-inset-top)) 12px 10px !important;
  }

  #mainApp .header-logo-wrapper,
  #dgApp .header-logo-wrapper {
    width: 100%;
    max-width: none !important;
    justify-content: center;
    padding: 0 !important;
  }

  #mainApp .user-info,
  #dgApp .user-info {
    position: static !important;
    width: 100%;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 40px;
    gap: 7px !important;
    align-items: stretch !important;
  }

  #mainApp .user-badge,
  #dgApp #dgUserBadge {
    position: static !important;
    min-width: 0;
    padding: 7px 10px !important;
    border-radius: 10px !important;
    font-size: 11px !important;
    line-height: 1.25 !important;
    text-align: left;
    overflow: hidden;
  }

  #mainApp .user-info > button,
  #dgApp .user-info > button {
    position: static !important;
    width: 40px !important;
    height: 100% !important;
    min-height: 40px;
    margin: 0 !important;
    padding: 0 !important;
  }

  #mainApp .prospect-data-tools-grid,
  #dgApp .prospect-data-tools-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  #mainApp #prospectsTab .prospect-filter-bar {
    padding: 9px !important;
  }

  #mainApp .prospect-card .prospect-header,
  #dgApp .prospect-card .prospect-header {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 8px !important;
  }

  #mainApp .prospect-card-title,
  #dgApp .prospect-card-title {
    width: 100%;
    min-width: 0;
  }

  #mainApp .prospect-card-actions,
  #dgApp .prospect-card-actions {
    width: 100%;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px !important;
    justify-content: stretch !important;
  }

  #mainApp .prospect-card-actions button,
  #dgApp .prospect-card-actions button {
    width: 100%;
    min-width: 0;
    min-height: 42px;
    margin: 0 !important;
    padding: 8px 7px !important;
    white-space: nowrap;
  }

  #mainApp .prospect-card-actions .status-badge,
  #mainApp .prospect-card-actions .contact-status-badge,
  #mainApp .prospect-card-actions .sale-status-badge,
  #dgApp .prospect-card-actions .status-badge,
  #dgApp .prospect-card-actions .contact-status-badge,
  #dgApp .prospect-card-actions .sale-status-badge {
    justify-self: start;
  }
}