/**
 * STRATIXAOS CRM — shared theme tokens (internal app).
 * Palette: #343d46, #4f5b66, #65737e, #a7adba, #c0c5ce
 */
:root {
    /* Brand — dark palette first */
    --crm-primary: #343d46;
    --crm-primary-hover: #4f5b66;
    --crm-primary-dark: #2a3138;
    --crm-primary-accent: #65737e;
    --crm-primary-light: #4f5b66;
    --crm-primary-ring: rgba(52, 61, 70, 0.35);

    /* Map legacy base.html variables */
    --primary-color: var(--crm-primary);
    --primary-hover: var(--crm-primary-hover);
    --primary-light: var(--crm-primary-light);

    /* Layout */
    --crm-sidebar-bg: #2a3138;
    --crm-sidebar-hover: #343d46;
    --crm-sidebar-active: #65737e;
    --sidebar-bg: var(--crm-sidebar-bg);
    --sidebar-hover: var(--crm-sidebar-hover);

    --crm-body-bg: #d8dce2;
    --body-bg: var(--crm-body-bg);
    --crm-card-bg: #f4f5f7;
    --card-bg: var(--crm-card-bg);
    --crm-border: #65737e;
    --border-color: #a7adba;
    --topbar-bg: #343d46;

    /* Text */
    --crm-text: #2a3138;
    --text-primary: var(--crm-text);
    --crm-text-muted: #4f5b66;
    --text-secondary: var(--crm-text-muted);
    --crm-text-on-dark: #c0c5ce;

    /* Semantic pipeline status badges */
    --crm-status-new: #7c3aed;
    --crm-status-follow-up: #f59e0b;
    --crm-status-in-progress: #0ea5e9;
    --crm-status-active: #4f5b66;
    --crm-status-declined: #ef4444;
    --crm-status-contacted: #6366f1;
    --crm-status-nurture: #64748b;

    --success-color: #343d46;
    --warning-color: #f59e0b;
    --danger-color: #ef4444;
    --info-color: #0ea5e9;
    --secondary-color: #65737e;

    /* Bootstrap 5 — remap green "success" to STRATIXAOS dark brand */
    --bs-success: #343d46;
    --bs-success-rgb: 52, 61, 70;
    --bs-success-text-emphasis: #2a3138;
    --bs-success-bg-subtle: #d8dce2;
    --bs-success-border-subtle: #a7adba;
}

/* Bootstrap success utilities → STRATIXAOS dark (buttons, badges, alerts, filters) */
.btn-success {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--crm-primary);
    --bs-btn-border-color: var(--crm-primary);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--crm-primary-hover);
    --bs-btn-hover-border-color: var(--crm-primary-hover);
    --bs-btn-focus-shadow-rgb: 52, 61, 70;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--crm-primary-hover);
    --bs-btn-active-border-color: var(--crm-primary-hover);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: var(--crm-primary);
    --bs-btn-disabled-border-color: var(--crm-primary);
}

.btn-outline-success {
    --bs-btn-color: var(--crm-primary);
    --bs-btn-border-color: var(--crm-primary);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--crm-primary);
    --bs-btn-hover-border-color: var(--crm-primary);
    --bs-btn-focus-shadow-rgb: 52, 61, 70;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--crm-primary-hover);
    --bs-btn-active-border-color: var(--crm-primary-hover);
}

.bg-success {
    background-color: var(--crm-primary) !important;
}

.text-success {
    color: var(--crm-primary) !important;
}

.border-success {
    border-color: var(--crm-primary) !important;
}

.alert-success {
    --bs-alert-color: #2a3138;
    --bs-alert-bg: #d8dce2;
    --bs-alert-border-color: #a7adba;
}

.bg-success.bg-opacity-10 {
    background-color: rgba(52, 61, 70, 0.12) !important;
}

.bg-success.text-white,
.card-header.bg-success {
    background-color: var(--crm-primary) !important;
    color: #fff !important;
}

.modal-header.bg-success {
    background-color: var(--crm-primary) !important;
    color: #fff !important;
}

.form-check-input:checked {
    background-color: var(--crm-primary);
    border-color: var(--crm-primary);
}

.form-check-input:focus {
    border-color: var(--crm-primary-accent);
    box-shadow: 0 0 0 0.25rem var(--crm-primary-ring);
}

/* Table headers — dark brand strip */
.table thead th,
.table > :not(caption) > * > th,
thead.table-light th,
.table-light > :not(caption) > * > th {
    background-color: #4f5b66 !important;
    color: #c0c5ce !important;
    border-bottom-color: #343d46 !important;
}

.pipeline-table th,
.submission-pipeline-table thead th {
    background-color: #4f5b66 !important;
    color: #c0c5ce !important;
    border-bottom-color: #343d46 !important;
}

/* Filter bars */
.filter-bar .btn-success,
.submission-pipeline-filter-row .btn-success,
.submission-pipeline-filter-row .spf-filter-btn {
    background-color: var(--crm-primary);
    border-color: var(--crm-primary);
    color: #fff;
}

.filter-bar .btn-success:hover,
.submission-pipeline-filter-row .btn-success:hover {
    background-color: var(--crm-primary-hover);
    border-color: var(--crm-primary-hover);
    color: #fff;
}

.filter-bar .form-control:focus,
.filter-bar .form-select:focus,
.submission-pipeline-filter-row .spf-control:focus {
    border-color: var(--crm-primary) !important;
    box-shadow: 0 0 0 3px var(--crm-primary-ring) !important;
}

/* Pipeline / CRM components */
.crm-breadcrumb {
    font-size: 0.8rem;
    color: var(--crm-text-muted);
    margin-bottom: 0.25rem;
}

.crm-breadcrumb a {
    color: var(--crm-text-muted);
    text-decoration: none;
}

.crm-breadcrumb a:hover {
    color: var(--crm-primary);
}

.crm-page-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 1rem;
}

.crm-page-header h2 {
    font-size: 1.35rem;
    font-weight: 700;
    margin: 0;
    color: var(--crm-text);
}

.crm-page-header .subtitle {
    font-size: 0.85rem;
    color: var(--crm-text-muted);
    margin: 0;
}

.crm-view-toggle .btn {
    font-size: 0.8rem;
    padding: 0.35rem 0.75rem;
}

.crm-view-toggle .btn.active {
    background: var(--crm-primary);
    border-color: var(--crm-primary);
    color: #fff;
}

.crm-search-wrap {
    position: relative;
}

.crm-search-wrap .bi-search {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #adb5bd;
    pointer-events: none;
}

.crm-search-wrap input {
    padding-left: 34px;
}

.filter-bar .crm-search-wrap input {
    padding-left: 2rem;
    line-height: 1.35;
}

.crm-date-pills .btn {
    font-size: 0.72rem;
    padding: 2px 10px;
}

.filter-bar .form-label {
    font-size: 0.78rem;
    margin-bottom: 2px;
    font-weight: 600;
    line-height: 1.2;
}

.filter-bar .form-control-sm,
.filter-bar .form-select-sm {
    min-height: 2.125rem;
    height: auto;
    line-height: 1.35;
    padding-top: 0.375rem;
    padding-bottom: 0.375rem;
    font-size: 0.8125rem;
}

.filter-bar .form-select-sm {
    padding-left: 0.625rem;
    padding-right: 2rem;
    background-position: right 0.55rem center;
    background-size: 12px 9px;
}

.filter-bar .form-control-sm {
    padding-left: 0.625rem;
    padding-right: 0.625rem;
}

.filter-bar .crm-date-pills {
    display: inline-flex;
    flex-wrap: nowrap;
    align-items: stretch;
    gap: 0.25rem;
    min-height: 2.125rem;
    height: auto;
}

.filter-bar .crm-date-pills .btn {
    font-size: 0.72rem;
    padding: 0 0.45rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
    line-height: 1;
}

.crm-date-pills .btn.active {
    background: var(--crm-primary);
    border-color: var(--crm-primary);
    color: #fff;
}

/* Manager intake: collapsed multi-select sales rep dropdown */
.rep-ms-dropdown {
    min-width: 10rem;
}

.rep-ms-dropdown--bulk {
    min-width: 12rem;
}

.rep-ms-dropdown--modal {
    flex: 1 1 auto;
}

.rep-ms-dropdown--row {
    min-width: 9.5rem;
    max-width: 11rem;
}

.rep-ms-dropdown__toggle {
    font-size: 0.8125rem;
    padding: 0.375rem 0.65rem;
    border-color: #d1d5db;
    background: #fff;
    color: var(--crm-text);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.35rem;
}

.rep-ms-dropdown__toggle::after {
    margin-left: auto;
    flex-shrink: 0;
}

.rep-ms-dropdown--has-value .rep-ms-dropdown__toggle {
    border-color: var(--crm-primary);
}

.rep-ms-dropdown__menu {
    width: 100%;
    min-width: 11rem;
    max-height: 12rem;
    overflow-y: auto;
    padding: 0.35rem;
    border-color: var(--crm-border);
    z-index: 1060;
}

.rep-ms-dropdown__option {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    cursor: pointer;
    font-size: 0.8125rem;
    border-radius: 6px;
    padding: 0.4rem 0.5rem;
    margin: 0;
    white-space: nowrap;
}

.rep-ms-dropdown__option:hover,
.rep-ms-dropdown__option:focus {
    background: #f8fafc;
    color: var(--crm-text);
}

.rep-ms-dropdown__option .form-check-input {
    margin: 0;
    flex-shrink: 0;
}

.rep-ms-dropdown__text {
    overflow: hidden;
    text-overflow: ellipsis;
}

.crm-avatar {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--crm-primary), var(--crm-primary-hover));
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    font-size: 0.72rem;
    flex-shrink: 0;
}

.user-avatar {
    border-radius: 50% !important;
    background: linear-gradient(135deg, var(--crm-primary), var(--crm-primary-hover)) !important;
}

.pipeline-table {
    width: max-content;
    min-width: 100%;
    table-layout: auto;
}

.pipeline-table th {
    font-size: 0.7rem !important;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    background-color: #4f5b66 !important;
    color: #c0c5ce !important;
    font-weight: 600;
    border-bottom: 1px solid #343d46 !important;
    white-space: nowrap;
    vertical-align: middle;
}

.pipeline-table td {
    white-space: nowrap;
    vertical-align: middle;
}

.pipeline-table .pipeline-cell {
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: var(--col-max, 12rem);
}

.pipeline-table .pipeline-cell > a {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.pipeline-table .col-date { --col-max: 9.5rem; min-width: 9.5rem; }
.pipeline-table .col-source { --col-max: 8.5rem; min-width: 8.5rem; }
.pipeline-table .col-rep-assigned { --col-max: 11rem; min-width: 11rem; }
.pipeline-table .col-rep-status { min-width: 11.5rem; }
.pipeline-table .col-status { min-width: 5rem; }
.pipeline-table .col-business { --col-max: 14rem; min-width: 10rem; }
.pipeline-table .col-state { --col-max: 4rem; min-width: 4rem; }
.pipeline-table .col-ein { --col-max: 8.5rem; min-width: 8.5rem; }
.pipeline-table .col-time-biz { --col-max: 10rem; min-width: 8rem; }
.pipeline-table .col-name { --col-max: 8rem; min-width: 6rem; }
.pipeline-table .col-ssn {
    --col-max: 10.5rem;
    min-width: 10.5rem;
    font-family: ui-monospace, monospace;
    font-size: 0.78rem;
}
.pipeline-table .col-phone { --col-max: 9rem; min-width: 8.5rem; }
.pipeline-table .col-email { --col-max: 14rem; min-width: 11rem; }
.pipeline-table .col-money { --col-max: 9rem; min-width: 8rem; }
.pipeline-table .col-callback-date { --col-max: 7rem; min-width: 7rem; }
.pipeline-table .col-callback-time { --col-max: 7rem; min-width: 6.5rem; }
.pipeline-table .col-opted { min-width: 4.5rem; text-align: center; }
.pipeline-table .col-actions { min-width: 4rem; text-align: center; }

.pipeline-table .col-rep-assigned .rep-name {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;
}

.pipeline-table tbody tr {
    transition: background-color 0.12s ease;
}

.pipeline-table tbody tr:hover {
    background-color: #f8fafc;
}

.pipeline-table--compact th,
.pipeline-table--compact td {
    font-size: 0.75rem !important;
    padding: 0.35rem 0.45rem !important;
}

.pipeline-table .col-notes {
    --col-max: 12rem;
    min-width: 8rem;
    max-width: 12rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.pipeline-table .col-intake-tracker {
    width: 1%;
    white-space: nowrap;
}

.intake-tracker {
    display: inline-flex;
    flex-wrap: nowrap;
    gap: 2px;
    align-items: stretch;
    max-width: max-content;
}

.intake-step {
    flex: 0 0 auto;
    font-size: 0.6rem;
    line-height: 1.2;
    text-align: center;
    padding: 3px 4px;
    border-radius: 4px;
    background: #e2e8f0;
    color: #64748b;
    white-space: nowrap;
    border-bottom: 2px solid transparent;
}

.intake-step.is-done {
    background: #4f5b66;
    color: #c0c5ce;
    border-bottom-color: #65737e;
    font-weight: 600;
}

/* Lead source badges */
.badge-source-website { background: #343d46; color: #c0c5ce; }
.badge-source-referral { background: #ffedd5; color: #c2410c; }
.badge-source-internal { background: #dbeafe; color: #1d4ed8; }
.badge-source-lead_sheet { background: #e0e7ff; color: #4338ca; }
.badge-source-text_blast { background: #fce7f3; color: #be185d; }
.badge-source-email_blast { background: #f3e8ff; color: #7e22ce; }
.badge-source-other { background: #f1f5f9; color: #475569; }

/* Rep status badges */
.badge-rep-new { background: #ede9fe; color: #6d28d9; }
.badge-rep-attempting { background: #fef3c7; color: #b45309; }
.badge-rep-contacted { background: #dbeafe; color: #1d4ed8; }
.badge-rep-follow-up { background: #fef9c3; color: #a16207; }
.badge-rep-working { background: #343d46; color: #c0c5ce; }
.badge-rep-nurture { background: #f1f5f9; color: #475569; }
.badge-rep-not-interested { background: #fee2e2; color: #b91c1c; }

.badge-pipeline-new {
    background: var(--crm-status-new);
    color: #fff;
}

.badge-opted-yes { color: var(--crm-status-active); }
.badge-opted-no { color: var(--crm-status-declined); }

.rep-status-select {
    font-size: 0.75rem;
    padding: 0.15rem 0.35rem;
    width: 100%;
    min-width: 10.5rem;
    max-width: 11.5rem;
    border-radius: 6px;
    border: 1px solid var(--crm-border);
}

.stat-card.primary {
    background: linear-gradient(135deg, var(--crm-primary) 0%, var(--crm-primary-hover) 100%) !important;
}

.btn-purple:focus,
.btn-outline-purple:focus,
.btn-purple:active,
.btn-outline-purple:active {
    box-shadow: 0 0 0 0.25rem var(--crm-primary-ring) !important;
}

.form-control:focus,
.form-select:focus {
    border-color: var(--crm-primary) !important;
    box-shadow: 0 0 0 3px var(--crm-primary-ring) !important;
}

.brand-logo {
    display: inline-flex;
    align-items: center;
    gap: 0.65rem;
}

.brand-logo__mark {
    flex-shrink: 0;
    display: block;
}

.brand-logo__name {
    font-weight: 700;
    letter-spacing: 0.04em;
    line-height: 1.2;
}

.brand-logo--auth {
    flex-direction: column;
    gap: 0.5rem;
}

.brand-logo--auth .brand-logo__mark {
    width: 48px;
    height: 48px;
}

.brand-logo--auth .brand-logo__name {
    font-size: 1.625rem;
}

.brand-logo--sidebar .brand-logo__mark {
    width: 33px;
    height: 33px;
    opacity: 0.95;
}

.brand-logo--sidebar .brand-logo__name {
    font-size: 0.95rem;
    font-weight: 600;
    color: #fff;
    letter-spacing: 0.06em;
}

.brand-logo--external .brand-logo__name {
    font-size: 1.35rem;
    font-weight: 600;
    color: #fff;
    letter-spacing: 0.06em;
}

.sidebar-brand .brand-mark {
    color: var(--crm-primary-accent);
}

/* Dark topbar */
.topbar {
    color: var(--crm-text-on-dark);
    border-bottom-color: #4f5b66 !important;
    box-shadow: 0 2px 8px rgba(42, 49, 56, 0.25);
}

.topbar-title,
.topbar .user-info .name {
    color: #ffffff !important;
}

.topbar .user-info .role {
    color: #a7adba !important;
}

.topbar .crm-breadcrumb,
.topbar .crm-breadcrumb a {
    color: #a7adba !important;
}

.topbar .crm-breadcrumb a:hover {
    color: #c0c5ce !important;
}

.topbar .btn-outline-primary {
    color: #c0c5ce;
    border-color: #65737e;
}

.topbar .btn-outline-primary:hover {
    background: #4f5b66;
    border-color: #4f5b66;
    color: #fff;
}