
/* Dashboard */
.dashboard-page { max-width: 1440px; }
.dashboard-header { display:flex; justify-content:space-between; align-items:flex-end; gap:20px; }
.dashboard-updated { font-size:12px; color:var(--muted); padding-bottom:5px; }
.dashboard-filters { display:flex; align-items:end; gap:10px; padding:14px; margin-bottom:18px; border:1px solid var(--form-card-border); border-radius:12px; background:var(--form-card-bg); box-shadow:var(--form-card-shadow); }
.dashboard-filter { flex:1 1 150px; min-width:130px; display:grid; gap:5px; }
.dashboard-filter label { color:var(--muted); font-size:10px; font-weight:600; text-transform:uppercase; letter-spacing:.08em; }
.dashboard-filter input,.dashboard-filter select { width:100%; min-height:35px; border:1px solid var(--border); border-radius:16px; padding:0 9px; color:var(--field-input-color); background:var(--field-input-bg); font:inherit; font-size:12px; }
.dashboard-reset { min-height:35px; padding:0 13px; border:1px solid var(--border); border-radius:16px; background:transparent; color:var(--field-input-color); cursor:pointer; font-size:12px; white-space:nowrap; }
.dashboard-reset:hover { border-color:var(--teal); color:var(--teal); }
.dashboard-kpis { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin-bottom:18px; }
.dashboard-kpi,.dashboard-card { background:var(--form-card-bg); border:1px solid var(--form-card-border); border-radius:12px; box-shadow:var(--form-card-shadow); }
.dashboard-kpi { padding:17px; display:grid; gap:7px; }
.dashboard-kpi span { color:var(--muted); font-size:12px; }
.dashboard-kpi strong { color:var(--page-title-color); font:700 28px/1 'Syne',sans-serif; letter-spacing:-.03em; overflow:hidden; text-overflow:ellipsis; }
.dashboard-kpi small { color:var(--muted); font-size:11px; }
.dashboard-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.dashboard-card { padding:18px; min-width:0; }
.dashboard-card--wide { grid-column:span 2; }
.dashboard-card-head { display:flex; justify-content:space-between; gap:12px; margin-bottom:16px; }
.dashboard-card h2 { margin:0; color:var(--page-title-color); font:600 15px/1.2 'Syne',sans-serif; }
.dashboard-card p { margin:5px 0 0; color:var(--muted); font-size:11px; }
.dashboard-chip { color:var(--teal); background:var(--teal-dim); border:1px solid var(--teal-border); padding:4px 7px; border-radius:999px; font-size:10px; white-space:nowrap; }
.dashboard-bar-chart { height:190px; display:flex; align-items:end; justify-content:space-around; gap:20px; padding:8px 16px 0; border-bottom:1px solid var(--border); }
.dashboard-bar-item { height:100%; flex:1; max-width:68px; display:flex; flex-direction:column; align-items:center; justify-content:end; gap:7px; color:var(--muted); font-size:11px; }
.dashboard-bar-item b { color:var(--field-input-color); font-size:12px; font-weight:600; }
.dashboard-bar-track { height:130px; width:100%; display:flex; align-items:end; background:linear-gradient(to top,transparent 32%,var(--border) 33%,transparent 34%,transparent 65%,var(--border) 66%,transparent 67%); }
.dashboard-bar-track i { width:100%; min-height:4px; border-radius:16px; background:var(--teal); }
.dashboard-rankings { display:grid; gap:15px; min-height:160px; }
.dashboard-ranking { display:grid; grid-template-columns:minmax(80px,1fr) 2fr 24px; gap:10px; align-items:center; font-size:12px; color:var(--field-input-color); }
.dashboard-ranking > div { height:7px; overflow:hidden; border-radius:999px; background:var(--teal-dim); }
.dashboard-ranking i { display:block; height:100%; border-radius:inherit; background:var(--teal); }
.dashboard-ranking b { text-align:right; font-size:11px; }
.dashboard-deliveries { display:grid; }
.dashboard-delivery { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:12px 0; border-top:1px solid var(--border); }
.dashboard-delivery b,.dashboard-delivery span { display:block; }
.dashboard-delivery b { color:var(--field-input-color); font-size:12px; font-weight:600; }
.dashboard-delivery span,.dashboard-delivery time { margin-top:3px; color:var(--muted); font-size:11px; }
.dashboard-delivery time { white-space:nowrap; }
.dashboard-link { color:var(--teal); font-size:11px; text-decoration:none; }
.dashboard-empty { color:var(--muted); font-size:12px; padding:24px 0; }
@media(max-width:1050px) { .dashboard-filters { flex-wrap:wrap; } .dashboard-kpis { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:720px) { .dashboard-header { align-items:flex-start; flex-direction:column; } .dashboard-grid { grid-template-columns:1fr; } .dashboard-card--wide { grid-column:auto; } .dashboard-kpis { grid-template-columns:1fr; } .dashboard-filters { align-items:stretch; } .dashboard-filter { flex-basis:100%; } .dashboard-reset { width:100%; } .dashboard-delivery { align-items:flex-start; flex-direction:column; gap:3px; } }
.dashboard-ranking,.dashboard-bar-item { border:0; font:inherit; cursor:pointer; }
.dashboard-ranking { width:100%; background:transparent; padding:2px 0; text-align:left; }
.dashboard-ranking:hover span,.dashboard-ranking.is-selected span { color:var(--teal); }
.dashboard-ranking.is-selected i,.dashboard-bar-item.is-selected .dashboard-bar-track i { background:var(--teal-dark); }
.dashboard-bar-item { background:transparent; padding:0; }
.dashboard-bar-item:hover b,.dashboard-bar-item.is-selected b { color:var(--teal); }
/* CRM-style dashboard presentation */
.crm-dashboard { max-width: 1560px; color: #1f2e45; }
.crm-tabs { height:48px; display:flex; align-items:center; gap:22px; border-bottom:1px solid #dbe3ed; margin:-8px -40px 18px; padding:0 40px; background:#f6f8fb; }
.crm-tab { height:48px; padding:0 2px; color:#33445e; font-size:14px; background:none; border:0; border-bottom:2px solid transparent; cursor:pointer; }
.crm-tab.active { color:#3970de; border-bottom-color:#3970de; font-weight:600; }
.crm-updated { margin-left:auto; font-size:12px; color:#7a8698; }
.crm-filterbar { display:flex; align-items:center; flex-wrap:wrap; gap:12px 22px; padding:14px 18px; margin-bottom:20px; background:#fff; border:1px solid #dbe1e8; border-radius:16px; box-shadow:0 1px 2px rgba(20,40,70,.04);}
.crm-filter { display:flex; gap:8px; align-items:center; color:#7b8595; font-size:14px; white-space:nowrap; }
.crm-filter select,.crm-card header select { border:0; outline:0; min-width:95px; background:transparent; color:#0878ed; font:inherit; cursor:pointer; }
.crm-date-range { display:flex; align-items:center; gap:6px; color:#7b8595; font-size:12px; }
.crm-date-range[hidden] { display:flex !important; visibility:hidden; height:0; overflow:hidden; }
.crm-date-range input { width:125px; padding:6px; border:1px solid #d3dae3; border-radius:4px; color:#415069; }
.crm-btn { min-height:32px; padding:0 12px; border:1px solid #0d75e8; border-radius:3px; background:#fff; color:#0d75e8; cursor:pointer; font-size:12px; }
.crm-btn-primary { background:#0878ed; color:#fff; }
.crm-kpis { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin-bottom:0px; }
.crm-kpis article { padding:14px 18px; min-height:82px; background:#fff; border:1px solid #dbe1e8; border-radius:16px; box-shadow:0 1px 2px rgba(20,40,70,.04); }
.crm-kpis span,.crm-kpis small { display:block; color:#758196; font-size:12px; }.crm-kpis strong { display:block; margin:4px 0; color:#23324a; font-size:25px; line-height:1; }.crm-kpis small { font-size:11px; }
.crm-grid { display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-bottom:20px; }.crm-grid-single { grid-template-columns:1fr; }
.crm-main-grid { grid-template-columns:1.75fr 1fr; gap:16px; align-items:start; }
.crm-main-grid .crm-card { align-self:start; }
.crm-bottom-grid { grid-template-columns:1.75fr 1fr; gap:16px; align-items:start; }
.crm-bottom-grid > .crm-card-wide-left  { margin-top:-163px; }
.crm-tracker-row > .crm-card-wide-left { margin-top:-74px; }

.crm-card { background:#fff; border:1px solid #d9dfe7; border-radius:16px; overflow:hidden; box-shadow:0 1px 2px rgba(20,40,70,.04); }.crm-card header { display:flex; justify-content:space-between; align-items:start; min-height:88px; padding:21px 18px; border-bottom:1px solid #dde3ea; }.crm-card h2 { margin:0 0 3px; color:#243348; font-size:16px; font-weight:500; }.crm-card em { display:inline-block; padding:2px 6px; border-radius:10px; background:#0db8a5; color:#fff; font-size:10px; font-style:normal; }.crm-help { display:inline-grid; place-items:center; width:15px; height:15px; border:1px solid #536176; border-radius:50%; font-size:10px; color:#536176; }.crm-menu { border:1px solid #d1d8e1; border-radius:3px; background:#fff; color:#687486; font-size:16px; line-height:28px; cursor:pointer; }.crm-card-body { padding:17px 20px; min-height:282px; }.crm-card-wide .crm-card-body { min-height:250px; }.crm-card-wide-left .crm-card-body { min-height:260px; }.crm-card-narrow-right .crm-card-body { min-height:330px; }.crm-chart-title { margin:0 0 9px; color:#7b8494; font-size:13px; text-align:center; }.crm-line-chart { height:225px; }.crm-line-chart svg { width:100%; height:100%; overflow:visible; }.crm-line-chart line { stroke:#e3e8ee; stroke-width:1; }.crm-line-chart polygon { fill:rgba(84,151,218,.35); }.crm-line-chart polyline { fill:none; stroke:#6ca9df; stroke-width:2; }.crm-line-chart text { fill:#6f798a; font-size:10px; }.crm-line-chart text:not(:last-child) { text-anchor:middle; fill:#53769c; font-weight:600; }
.crm-funnel { display:grid; justify-items:center; gap:0; min-height:128px; padding:4px 10px; }.crm-funnel button { display:block; min-height:24px; border:0; clip-path:polygon(0 0,100% 0,95% 100%,5% 100%); color:#fff; cursor:pointer; }.crm-funnel button:hover { filter:brightness(.9); }.crm-funnel span { font-size:11px; font-weight:600; }.crm-legend { display:flex; flex-wrap:wrap; justify-content:center; gap:9px 16px; margin-top:12px; }.crm-legend button { padding:0; border:0; background:transparent; color:#374152; font-size:11px; font-weight:600; cursor:pointer; }.crm-legend i { display:inline-block; width:10px; height:10px; margin-right:5px; border-radius:50%; vertical-align:-1px; }.crm-axis-title { color:#7c8798; font-size:13px; text-align:center; margin:0 0 12px; }.crm-status-chart { display:grid; gap:13px; max-width:950px; margin:auto; }.crm-horizontal-bar { display:grid; grid-template-columns:170px 1fr 35px; align-items:center; gap:12px; border:0; background:transparent; padding:0; color:#44536a; text-align:left; cursor:pointer; }.crm-horizontal-bar:hover span { color:#0d75e8; }.crm-horizontal-bar div { height:12px; border-radius:2px; background:#edf3fa; overflow:hidden; }.crm-horizontal-bar i { display:block; height:100%; background:#75b5df; }.crm-horizontal-bar b { font-size:12px; text-align:right; }.crm-delivery-strip { display:flex; justify-content:center; gap:24px; margin:22px 0 0; padding-top:12px; border-top:1px solid #e5e9ee; color:#66748a; font-size:11px; }.crm-delivery-strip > div:not(.crm-delivery-title) { display:flex; gap:7px; }.crm-delivery-strip b { color:#34435a; }.crm-delivery-title { color:#7b8798; }.crm-empty { display:grid; place-items:center; min-height:110px; color:#7c8798; font-size:13px; }
@media(max-width:1080px) { .crm-grid { grid-template-columns:1fr; }.crm-kpis { grid-template-columns:repeat(2,1fr); }.crm-tabs { margin-left:-24px; margin-right:-24px; padding:0 24px; }.crm-filterbar { gap:10px; } }
@media(max-width:650px) { .crm-kpis { grid-template-columns:1fr; }.crm-tabs { gap:14px; overflow:auto; }.crm-updated { display:none; }.crm-filterbar { align-items:stretch; }.crm-filter { justify-content:space-between; width:100%; }.crm-horizontal-bar { grid-template-columns:100px 1fr 25px; }.crm-delivery-strip { flex-direction:column; gap:8px; }.crm-date-range { width:100%; }.crm-date-range input { flex:1; } }
/* Chart.js dashboard canvases */
.crm-chart-canvas { position:relative; width:100%; }
.crm-line-chart { height:225px; }
.crm-pie-chart { width:100%; max-height:50%; height:30%; min-height:104px; margin:0; display:flex; align-items:center; justify-content:flex-start; gap:14px; }
.crm-pie-chart canvas { width:220px !important; height:260px !important; max-width:220px !important; max-height:260px !important; flex:0 0 220px; }
.crm-pie-legend { display:grid; gap:5px; min-width:0; max-width:165px; }
.crm-pie-legend-item { display:flex; align-items:center; gap:7px; min-width:0; padding:3px 5px; border:0; border-radius:4px; background:transparent; color:#657287; font:11px Arial, sans-serif; text-align:left; cursor:pointer; transition:background-color .2s ease, color .2s ease, transform .2s ease; }
.crm-pie-legend-item i { width:10px; height:10px; flex:0 0 10px; border-radius:50%; }
.crm-pie-legend-item span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.crm-pie-legend-item.is-selected { background:#eaf3ff; color:#0d75e8; font-weight:600; animation:crm-pie-legend-focus .35s ease-out; }
@keyframes crm-pie-legend-focus { from { opacity:.45; transform:translateX(-4px); } to { opacity:1; transform:translateX(0); } }
.crm-funnel { height:400px; min-height:400px; display:block; padding:0; }
.crm-status-chart { height:235px; min-height:235px; display:block; max-width:950px; }
.crm-chart-canvas canvas { width:100% !important; height:100% !important; }
.crm-status-layers { width:min(100%, 520px); height:290px; margin:0 auto; box-sizing:border-box; display:flex; flex-direction:column; justify-content:center; gap:1px; padding:5px 0; }
.crm-status-layer { width:var(--layer-width); min-width:42%; min-height:28px; align-self:center; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:0 12px 0 16px; border:0; border-radius:2px; background:var(--layer-color); box-shadow:0 1px 0 rgba(19,44,72,.16), 0 3px 7px rgba(35,64,92,.08); clip-path:polygon(1.5% 0,98.5% 0,100% 100%,0 100%); color:#fff; font:inherit; font-size:11px; font-weight:600; line-height:1; cursor:pointer; transition:filter .15s ease, transform .15s ease, width .15s ease; }
.crm-status-layer--presented { clip-path:polygon(0 0,100% 0,92.5% 100%,7.5% 100%) !important; }
.crm-status-layer--money { width:48%; min-width:48%; height:46px; min-height:46px; padding:0 10px; clip-path: inset(0) !important; border-radius:0; }
.crm-status-layer:hover { filter:brightness(.92) saturate(1.08); transform:translateY(-1px); }
.crm-status-layer span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; text-shadow:0 1px 1px rgba(17,44,69,.2); }
.crm-status-layer b { flex:0 0 auto; min-width:23px; padding:4px 6px; border-radius:10px; background:rgba(255,255,255,.22); text-align:center; font-size:11px; }
.crm-status-layers-empty { display:grid; place-items:center; height:250px; color:#7c8798; font-size:13px; }
.crm-pipeline-diagram { position:relative; width:min(100%, 363px); aspect-ratio:1600 / 1738; margin:0 auto; background:url('Pipeline%20Chart.png') center / contain no-repeat; }
.crm-funnel .crm-pipeline-hitbox { position:absolute; left:10%; width:80%; height:var(--hitbox-height); min-height:0; top:var(--hitbox-top); display:flex; flex-direction:row; align-items:center; justify-content:center; gap:7px; padding:0; border:0; background:transparent; clip-path:none; color:#fff; font:inherit; text-align:center; cursor:pointer; transform:translate(var(--hitbox-shift-x, 0), var(--hitbox-shift-y, 0)); }
.crm-pipeline-hitbox span { white-space:nowrap; font-size:10px; font-weight:600; line-height:1.1; text-shadow:0 1px 2px rgba(9,35,52,.4); transition:font-size .15s ease; }
.crm-pipeline-hitbox b { display:grid; place-items:center; flex:0 0 24px; width:24px; height:24px; border-radius:50%; background:rgba(255,255,255,.27); color:#fff; font-size:11px; line-height:1; }
.crm-pipeline-hitbox:hover:not(.crm-pipeline-hitbox--money) b, .crm-pipeline-hitbox:focus-visible:not(.crm-pipeline-hitbox--money) b { background:rgba(255,255,255,.48); outline:2px solid rgba(255,255,255,.8); outline-offset:2px; }
.crm-pipeline-hitbox:hover:not(.crm-pipeline-hitbox--money) span, .crm-pipeline-hitbox:focus-visible:not(.crm-pipeline-hitbox--money) span { font-size:16px; }
/* Adjust --hitbox-top to move a label up/down, or --hitbox-shift-x to move it left/right. */
.crm-pipeline-hitbox--presented { --hitbox-top:7%; --hitbox-height:35%; }
.crm-pipeline-hitbox--evaluation { --hitbox-top:37.25%; --hitbox-height:14%; }
.crm-pipeline-hitbox--negotiation { --hitbox-top:50.5%; --hitbox-height:13%; }
.crm-pipeline-hitbox--ordered { --hitbox-top:63%; --hitbox-height:13%; }
.crm-pipeline-hitbox--money { --hitbox-top:77.5%; --hitbox-height:8%; cursor:default; }
.crm-pipeline-hitbox--money span { color:#fff; font-size:7px; text-shadow:0 1px 2px rgba(9,35,52,.4); }
.crm-pipeline-hitbox--money b { flex-basis:16px; width:16px; height:16px; color:#fff; background:rgba(255,255,255,.48); font-size:7px; }
.crm-pipeline-hitbox--ordered span { font-size:9px; }
.crm-pipeline-hitbox--ordered b { flex-basis:21px; width:21px; height:21px; font-size:10px; }
.crm-pipeline-hitbox--ordered:hover span, .crm-pipeline-hitbox--ordered:focus-visible span { font-size:11px; }
.crm-pipeline-hitbox--total { --hitbox-top:91%; --hitbox-height:9%; }
.crm-short-body {height:308px !important;}

.crm-kpis article {
    padding: 24px;
    border-radius: 16px;
    background: linear-gradient(180deg,#ffffff,#f8fafc);
    border: 1px solid #e2e8f0;
    box-shadow:
        0 1px 2px rgba(0,0,0,.05),
        0 8px 24px rgba(15,23,42,.06);
    transition: all .25s ease;
}

.crm-kpis article:hover {
    transform: translateY(-3px);
    box-shadow:
        0 10px 30px rgba(15,23,42,.10);
}

.crm-kpis strong {
    font-size: clamp(38px, 2.5vw, 46px);
    font-weight: 700;
    color: #0f172a;
}

@media (max-width: 1300px) {
    .crm-kpis strong {
        font-size: 34px;
    }
}

.crm-kpis span {
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.kpi-projects {
    border-left: 4px solid #3b82f6;
}

.kpi-orders {
    border-left: 4px solid #10b981;
}

.kpi-pipeline {
    border-left: 4px solid #f59e0b;
}

.kpi-delivery {
    border-left: 4px solid #ef4444;
}

.crm-filterbar {
    padding: 20px;
    border-radius: 16px;
    border: 1px solid #e2e8f0;
    background: #ffffff;
    box-shadow: 0 4px 12px rgba(15,23,42,.05);
}

.crm-filter select {
    padding: 10px 14px;
    min-height: 40px;
    border: 1px solid #cbd5e1;
    border-radius: 10px;
    background: #f8fafc;
    color: #0f172a;
}

.crm-card em {
    background: #dcfce7;
    color: #166534;
    font-size: 11px;
    font-weight: 600;
    padding: 5px 10px;
    border-radius: 20px;
}

.crm-card h2 {
    font-size: 18px;
    font-weight: 700;
    color: #0f172a;
}


.crm-top-row {
    display: grid;
    grid-template-columns: 4fr 1fr; /* 80 / 20 */
    gap: 20px;
    margin-bottom: 20px;
}

.crm-top-row .crm-filterbar {
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
    margin-bottom: 0;
}

.crm-top-row .crm-filter {
    width: 100%;
}

.crm-top-row .crm-filter select {
    width: 100%;
}

.crm-bottom-row {
    display: grid;
    grid-template-columns: 3fr 2fr; /* 60 / 40 */
    gap: 20px;
    margin-bottom: 20px;
}

@media (max-width: 1080px) {

    .crm-top-row,
    .crm-bottom-row {
        grid-template-columns: 1fr;
    }

}

.crm-tracker-row .crm-card-wide-left .crm-card-body,
.crm-tracker-row .crm-card-narrow-right .crm-card-body { min-height:0; }
.crm-aging-chart { height:236px; }
.crm-table-count { font-size:12px; color:#7a8698; }
.crm-table-chip { display:inline-flex; align-items:center; gap:7px; padding:4px 6px 4px 10px; border-radius:999px; background:#eef2f7; color:#334155; font-size:11px; font-weight:600; }
.crm-table-chip button { display:grid; place-items:center; width:16px; height:16px; border:0; border-radius:50%; background:transparent; color:#64748b; cursor:pointer; font-size:12px; line-height:1; padding:0; }
.crm-table-chip button:hover { background:#dde3ea; color:#0f172a; }
.crm-table-wrap { height:334px; overflow:auto; border:1px solid #e5e9ee; border-radius:10px; }
.crm-table { width:100%; table-layout:fixed; border-collapse:collapse; font-size:11.5px; }
.crm-table th:nth-child(1), .crm-table td:nth-child(1) { width:42%; }
.crm-table th:nth-child(2), .crm-table td:nth-child(2) { width:22%; }
.crm-table th:nth-child(3), .crm-table td:nth-child(3) { width:22%; }
.crm-table th:nth-child(4), .crm-table td:nth-child(4) { width:14%; }
.crm-table thead th { position:sticky; top:0; background:#f6f8fb; color:#67748a; font-size:10px; font-weight:600; text-transform:uppercase; letter-spacing:.04em; text-align:left; padding:7px 12px; border-bottom:1px solid #e5e9ee; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.crm-table tbody td { padding:6px 12px; border-bottom:1px solid #eef1f5; color:#243348; vertical-align:top; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.crm-table tbody tr:last-child td { border-bottom:0; }
.crm-table tbody tr:hover { background:#f8fafc; }
.crm-table-name { white-space:normal; word-break:break-word; line-height:1.35; }
.crm-table-empty { padding:32px; text-align:center; color:#7c8798; font-size:13px; white-space:normal; }

@media (max-width:650px) {
    .crm-table { font-size:12px; }
    .crm-table thead th, .crm-table tbody td { padding:8px 10px; }
}

/* Time filter stretches across row initially */
.crm-filter-primary {
    flex: 1;
}

.crm-filter-primary select {
    width: 100%;
}

/* Hide extra filters by default */
.crm-extra-filters {
    display: none;
}

/* Expanded view */
.crm-filterbar.expanded .crm-extra-filters {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px 22px;
}

/* Time filter returns to normal size when expanded */
.crm-filterbar.expanded .crm-filter-primary {
    flex: 0 0 auto;
}

.crm-filterbar.expanded .crm-filter-primary select {
    width: auto;
    min-width: 120px;
}


.crm-filter-actions {
    display: flex;
    gap: 10px;
    align-items: center;
}



.crm-status-layers {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: min(100%, 520px);
    margin: 0 auto;
    padding: 0;
    min-height: 210px;
}

.crm-status-layer {
    width: var(--layer-width);
    height: var(--layer-height, 58px);
    min-height: 58px;
    margin: 0 auto;
    border: 0;
    border-radius: 0;
    background: var(--layer-color);
    color: #fff;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
   
    transition: filter .2s ease, transform .2s ease;
    transform-origin: center;
}

.crm-status-layer + .crm-status-layer {
    margin-top: -1.4px;
}

.crm-status-layer:hover {
    filter: brightness(1.04);
    transform: translateY(-1px);
}

.crm-status-label {
    font-size: 14px;
    font-weight: 600;
    line-height: 1.2;
    text-align: center;
}

.crm-status-count {
    font-size: 20px;
    font-weight: 700;
    line-height: 1.2;
    margin-top: 4px;
}
