@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap");

:root {
  --black: #020406;
  --white: #ffffff;
  --gold: #e7edf6;
  --gold-light: #ffffff;
  --orange: #e7edf6;
  /* Portal-wide glass (same as dashboard): card/panel 0.35, sidebar 0.42, nav near-opaque */
  --portal-card-bg: rgba(0, 0, 0, 0.35);
  --portal-sidebar-bg: rgba(0, 0, 0, 0.42);
  --portal-panel-bg: rgba(0, 0, 0, 0.35);
  --portal-nav-bg: rgba(0, 0, 0, 0.92);
  --gray: var(--portal-panel-bg);
  --gray-mid: var(--portal-sidebar-bg);
  --gray-border: rgba(255, 255, 255, 0.14);
  --gray-text: #c0c8d6;
  --blue: #d6deea;
  --portal-font: "Inter", "Segoe UI", "Helvetica Neue", Arial, sans-serif;
}

html,
body {
  background: var(--black) !important;
}

body {
  position: relative;
  isolation: isolate;
  color: var(--white);
  font-family: var(--portal-font) !important;
  letter-spacing: 0.01em;
  line-height: 1.45;
}

body * {
  font-family: var(--portal-font) !important;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -2;
  background-image:
    linear-gradient(140deg, rgba(2, 4, 8, 0.82), rgba(2, 4, 8, 0.76)),
    url("https://assets.cdn.filesafe.space/UryrOQKz7XrlpqiWvJGM/media/69dbc82bb30bc523712452ea.jpg");
  background-size: cover;
  background-position: center;
  filter: saturate(0.4) contrast(1.05) brightness(0.72);
}

body::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  background:
    radial-gradient(circle at 14% 12%, rgba(65, 105, 170, 0.12), transparent 40%),
    radial-gradient(circle at 83% -5%, rgba(255, 255, 255, 0.08), transparent 36%),
    linear-gradient(180deg, rgba(1, 2, 4, 0.2), rgba(1, 2, 4, 0.7));
  pointer-events: none;
}

.main,
.content {
  padding: 30px !important;
}

.tx-header,
.tabs-bar {
  padding-left: 30px !important;
  padding-right: 30px !important;
}

.sidebar {
  background: var(--portal-sidebar-bg) !important;
  border-color: var(--gray-border) !important;
  box-shadow: 0 16px 42px rgba(0, 0, 0, 0.5);
  -webkit-backdrop-filter: blur(12px) saturate(110%);
  backdrop-filter: blur(12px) saturate(110%);
}

.tabs-bar,
.tx-header,
.card,
.stat-card,
.cap-card,
.tx-table,
.modal,
.agent-card,
.summary-card,
.doc-item,
.party-card,
.type-card,
.phase-option,
.qa-btn,
.info-banner,
.toast,
.upload-zone,
.login-wrap .card {
  background: var(--portal-panel-bg) !important;
  border-color: var(--gray-border) !important;
  box-shadow: 0 16px 42px rgba(0, 0, 0, 0.5);
  -webkit-backdrop-filter: blur(12px) saturate(110%);
  backdrop-filter: blur(12px) saturate(110%);
}

.table-header,
.table-row,
.tx-row,
.tx-item,
.wizard-steps,
.modal-header,
.modal-footer,
.card-header,
.summary-row,
.info-row,
.expense-item,
.history-item {
  border-color: rgba(255, 255, 255, 0.11) !important;
  background: rgba(0, 0, 0, 0.38) !important;
}

.card,
.tx-table,
.modal,
.stat-card,
.cap-card {
  border-radius: 14px !important;
  background: var(--portal-card-bg) !important;
}

.card-header,
.modal-header {
  padding: 18px 22px !important;
  background: transparent !important;
}

.card-body,
.modal-body {
  padding: 24px !important;
  background: transparent !important;
}

.table-row,
.tx-row,
.tx-item,
.doc-item,
.checklist-item {
  padding-top: 15px !important;
  padding-bottom: 15px !important;
}

.form-group {
  margin-bottom: 20px !important;
}

.page-header {
  margin-bottom: 30px !important;
}

.two-col,
.summary-grid,
.people-grid {
  gap: 20px !important;
}

.nav {
  background: var(--portal-nav-bg) !important;
  border-bottom-color: rgba(255, 255, 255, 0.1) !important;
  border-left: none !important;
  border-right: none !important;
  border-top: none !important;
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.35);
  min-height: 56px;
  -webkit-backdrop-filter: blur(12px) saturate(110%);
  backdrop-filter: blur(12px) saturate(110%);
}

.nav-logo,
.card-title,
.modal-title,
.page-title,
.logo-text,
.tx-title {
  color: var(--white) !important;
  font-family: var(--portal-font) !important;
  font-weight: 700 !important;
  letter-spacing: 0.02em !important;
}

.card-title,
.modal-title {
  color: #f7f9fd !important;
}

.nav-links {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: wrap;
}

.nav-link {
  border-radius: 999px !important;
  border: 1px solid rgba(255, 255, 255, 0.14) !important;
  background: rgba(255, 255, 255, 0.04) !important;
  color: #ecf2ff !important;
  padding: 7px 15px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  text-decoration: none !important;
}

.nav-link:hover,
.nav-link.active {
  background: rgba(255, 255, 255, 0.16) !important;
  color: var(--white) !important;
  border-color: rgba(255, 255, 255, 0.28) !important;
}

.btn-primary {
  background: rgba(0, 0, 0, 0.7) !important;
  color: var(--white) !important;
  border: 1px solid rgba(255, 255, 255, 0.26) !important;
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.34);
}

.btn-primary:hover {
  background: rgba(0, 0, 0, 0.82) !important;
}

.btn-secondary,
.filter-btn,
.doc-btn,
.radio-btn,
.person-action-btn,
.ai-suggestion {
  background: rgba(255, 255, 255, 0.04) !important;
  border-color: rgba(255, 255, 255, 0.16) !important;
  color: #edf3ff !important;
}

.btn-secondary:hover,
.filter-btn:hover,
.doc-btn:hover,
.radio-btn:hover,
.person-action-btn:hover,
.ai-suggestion:hover {
  background: rgba(255, 255, 255, 0.14) !important;
  border-color: rgba(255, 255, 255, 0.32) !important;
}

.filter-btn.active,
.radio-btn.sel {
  background: rgba(255, 255, 255, 0.2) !important;
  color: #ffffff !important;
}

.form-input,
.form-select,
.search-input,
.ai-input {
  background: rgba(0, 0, 0, 0.46) !important;
  border: 1px solid rgba(255, 255, 255, 0.16) !important;
  color: var(--white) !important;
}

.form-input:focus,
.form-select:focus,
.search-input:focus,
.ai-input:focus {
  border-color: rgba(255, 255, 255, 0.48) !important;
  box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.14);
}

.form-input::placeholder,
.search-input::placeholder,
.ai-input::placeholder {
  color: #9eacbf !important;
}

.page-subtitle,
.page-sub,
.form-label,
.info-label,
.tx-meta,
.tx-ref,
.stat-sub,
.wizard-step,
.timeline-label,
.summary-row-label,
.history-meta {
  color: #c1cad7 !important;
}

.status-submitted,
.phase-contract,
.phase-pre_closing,
.status-in_review,
.type-commercial,
.bb-ai-suggestion,
.bb-ai-suggestion:hover,
.bb-ai-input:focus,
.bb-ai-mic:hover,
.bb-ai-send,
.bb-ai-send:hover,
.bb-msg-user {
  color: #ffffff !important;
}

.bb-ai-panel,
.bb-ai-header,
.bb-msg-ai,
.bb-ai-suggestion,
.bb-ai-input,
.bb-ai-input-row,
.bb-ai-close,
.bb-ai-mic {
  background: var(--portal-card-bg) !important;
  border-color: rgba(255, 255, 255, 0.14) !important;
}

.bb-ai-header {
  background: var(--portal-card-bg) !important;
}

.bb-ai-send {
  background: rgba(255, 255, 255, 0.2) !important;
  border: 1px solid rgba(255, 255, 255, 0.32) !important;
}

.bb-msg-user,
.bb-ai-suggestion {
  background: rgba(255, 255, 255, 0.08) !important;
  border-color: rgba(255, 255, 255, 0.18) !important;
}

.logo-sub,
.footer-note,
.card-sub {
  color: #d4dbe6 !important;
}

.tab,
.tx-address,
.doc-name,
.checklist-text,
.info-value,
.summary-row-value {
  color: var(--white) !important;
}

a,
.card-action,
.detail-q-edit {
  color: #edf3ff !important;
}

.tab.active,
.wizard-step.active {
  color: #ffffff !important;
  border-bottom-color: rgba(255, 255, 255, 0.8) !important;
}

.tab-badge {
  background: rgba(255, 255, 255, 0.16) !important;
  color: #ffffff !important;
}

.sidebar-badge {
  background: rgba(255, 255, 255, 0.16) !important;
  color: #ffffff !important;
}

/* Remove purple/pink broker chip styling and keep neutral */
.admin-badge {
  background: rgba(255, 255, 255, 0.18) !important;
  color: #ffffff !important;
  border: 1px solid rgba(255, 255, 255, 0.3) !important;
}

/* Admin sidebar selected/highlight states should stay neutral */
.sidebar-item.active,
.sidebar-item:hover {
  background: rgba(255, 255, 255, 0.08) !important;
  color: #ffffff !important;
  border-left-color: rgba(255, 255, 255, 0.46) !important;
}

/* Dashboard "trim" lines and accents */
.stat-card::before,
.cap-bar-fill {
  background: rgba(255, 255, 255, 0.32) !important;
}

.cap-bar-wrap {
  background: rgba(255, 255, 255, 0.12) !important;
}

#capPercent,
.tx-ref,
.tx-phase,
.tx-type-badge,
.status-badge,
.phase-badge {
  color: #ffffff !important;
}

/* Dashboard headings and cap badges should be neutral white */
.cap-title,
.cap-plan-badge,
.stat-badge,
.badge-green,
.badge-gold,
.badge-red,
#capPlanBadge,
#capPercent,
#capStatSplit,
#capStatRemaining,
#capStatBrokerPaid {
  color: #ffffff !important;
}

.cap-plan-badge,
.stat-badge,
.badge-green,
.badge-gold,
.badge-red {
  background: rgba(255, 255, 255, 0.14) !important;
  border-color: rgba(255, 255, 255, 0.24) !important;
}

.tx-type-badge,
.status-badge,
.phase-badge,
.tx-phase {
  background: rgba(255, 255, 255, 0.12) !important;
  border: 1px solid rgba(255, 255, 255, 0.24) !important;
}

.phase-pre_closing,
.status-in_review,
.type-commercial,
.status-submitted,
.phase-contract {
  background: rgba(255, 255, 255, 0.08) !important;
  color: #ffffff !important;
}

/* Also neutralize any other status/phase chip variants */
.phase-start,
.phase-showing,
.phase-post_closing,
.status-approved,
.status-rejected,
.status-active,
.status-closed {
  background: rgba(255, 255, 255, 0.08) !important;
  color: #ffffff !important;
}

.next-step-item,
.doc-item,
.checklist-item,
.expense-item,
.history-item {
  margin-bottom: 10px !important;
  line-height: 1.6 !important;
}

.next-step-item,
.doc-item,
.checklist-item {
  background: var(--portal-card-bg) !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
}

/* Keep the 3 major cards as one consistent translucent-black surface */
.tx-header,
.card,
.tx-table {
  background: var(--portal-card-bg) !important;
}

.tx-header .tabs-bar,
.tx-header .tab,
.card .card-header,
.card .card-body {
  background: transparent !important;
}

/* Prevent inner row blocks from looking like separate darker slabs */
.card .info-row,
.card .summary-row {
  background: transparent !important;
}

/* Keep card-contained rows transparent so the full card reads as one surface */
.card .table-row,
.card .tx-row,
.card .tx-item {
  background: transparent !important;
}

/* Non-card row contexts can keep translucent black */
.summary-row,
.info-row,
.table-row,
.tx-item,
.tx-row {
  background: rgba(0, 0, 0, 0.32) !important;
}

.next-step-item {
  padding: 13px 14px !important;
}

.next-step-num {
  background: rgba(255, 255, 255, 0.16) !important;
  color: #ffffff !important;
  border: 1px solid rgba(255, 255, 255, 0.28);
}

.doc-meta,
.checklist-due {
  line-height: 1.55 !important;
}

.agent-avatar {
  border: 1px solid rgba(255, 255, 255, 0.52);
  background-color: #ffffff !important;
  color: #111723 !important;
}

.loading-bar {
  background: linear-gradient(90deg, #dce4f1, #ffffff) !important;
}

/* Global neutralized highlight pass (remove yellow/gold look) */
:root {
  --gold: #e7edf6 !important;
  --gold-light: #ffffff !important;
  --blue: #d6deea !important;
}

.btn.primary,
.filter-btn.active,
.radio-btn.sel,
.type-card.selected,
.phase-option.selected,
.party-card.selected,
.role-btn.selected,
.wizard-step.active,
.tab.active,
.sidebar-item.active,
.catalog-item.active {
  background: var(--portal-sidebar-bg) !important;
  border-color: rgba(255, 255, 255, 0.3) !important;
  color: #ffffff !important;
}

.btn.primary:hover,
.filter-btn.active:hover,
.role-btn.selected:hover,
.type-card.selected:hover,
.phase-option.selected:hover,
.party-card.selected:hover {
  background: rgba(0, 0, 0, 0.52) !important;
}

.card-action,
.crumb-link,
.resource-link,
.ideas-list a {
  color: #eef3fb !important;
}

.catalog-item:hover,
.doc-item:hover,
.checklist-item:hover,
.upload-zone:hover,
.upload-zone.dragover,
.qa-btn:hover {
  border-color: rgba(255, 255, 255, 0.3) !important;
  background: var(--portal-sidebar-bg) !important;
}

.loading-bar,
.spinner {
  border-top-color: #ffffff !important;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.4), #ffffff) !important;
}

/* Contacts page: remove blue card treatment and keep brand black glass */
.industry-card,
.industry-head,
.contact-row,
.catalog-card {
  background: var(--portal-card-bg) !important;
  border-color: rgba(255, 255, 255, 0.14) !important;
}

.tag.public,
.tag.private {
  color: #f2f6fd !important;
  border-color: rgba(255, 255, 255, 0.22) !important;
  background: var(--portal-card-bg) !important;
}

/* Portal glass: cards/panels 0.35, sidebars 0.42, top bar ~opaque */