/* ==========================================================================
   ASHE CRM ÃƒÂ¢Ã¢â€šÂ¬Ã¢â‚¬Â responsive application theme
   Loaded after app.css. One density scale, one shell, one responsive contract.

   Design rules:
   - The shell owns the viewport: topbar + scrollable workspace + fixed footer.
   - Spacing uses a 4px scale; no unused gaps between unrelated blocks.
   - Text starts at 12px for dense data; controls stay at least 28px high.
   - Tables keep primary columns and collapse secondary columns on smaller widths.
   - Dashboard is a single workspace: 4 primary KPIs, 4 secondary metrics,
     recent lists and activity; it must fit a 1366x768 laptop viewport.
   ========================================================================== */

:root {
    --theme-bg: #f2f5f9;
    --theme-surface: #ffffff;
    --theme-surface-soft: #f7f9fc;
    --theme-text: #172033;
    --theme-muted: #667085;
    --theme-line: #e1e7ef;
    --theme-line-strong: #cfd8e5;
    --theme-primary: #175cd3;
    --theme-primary-dark: #0e3d7a;
    --theme-sidebar: #0d2438;
    --theme-sidebar-soft: #16344d;
    --theme-sidebar-text: #b7c6d6;
    --theme-success: #087a55;
    --theme-warning: #a15c00;
    --theme-danger: #b42318;
    --theme-radius: 7px;
    --theme-radius-sm: 5px;
    --theme-shadow: 0 1px 2px rgba(16, 24, 40, 0.05);
    --theme-sidebar-width: 204px;
    --theme-topbar-height: 42px;
    --theme-footer-height: 28px;
    --theme-font: "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
    --theme-text-xs: 10.5px;
    --theme-text-sm: 12px;
    --theme-text-md: 13px;
    --theme-text-lg: 18px;
    --theme-space-1: 4px;
    --theme-space-2: 8px;
    --theme-space-3: 12px;
    --theme-space-4: 16px;

    /* Keep the existing Bootstrap custom properties aligned with the theme. */
    --ashe-navy: #0e3d7a;
    --ashe-blue: #175cd3;
    --ashe-blue-light: #eaf2fd;
    --ashe-dark: #172033;
    --ashe-gray: #667085;
    --ashe-border: #e1e7ef;
    --ashe-bg: #f2f5f9;
    --ashe-sidebar: #0d2438;
    --ashe-sidebar-muted: #b7c6d6;
}

body:not(.login-page) {
    background: var(--theme-bg);
    color: var(--theme-text);
    font-family: var(--theme-font);
    font-size: var(--theme-text-md);
    line-height: 1.42;
}

body:not(.login-page) .card {
    border: 1px solid var(--theme-line);
    border-radius: var(--theme-radius);
    box-shadow: var(--theme-shadow);
}

body:not(.login-page) .card-header {
    min-height: 32px;
    padding: 6px 10px;
    background: var(--theme-surface);
    border-bottom-color: var(--theme-line);
}

body:not(.login-page) .card-body {
    padding: 10px;
}

body:not(.login-page) .section-title {
    margin: 0;
    font-size: var(--theme-text-sm);
    font-weight: 700;
    letter-spacing: 0.005em;
}

body:not(.login-page) .text-muted,
body:not(.login-page) .cell-sub {
    color: var(--theme-muted) !important;
}

body:not(.login-page) .cell-sub {
    margin-top: 1px;
    font-size: var(--theme-text-xs);
    line-height: 1.35;
}

body:not(.login-page) .cell-main {
    font-size: var(--theme-text-sm);
    line-height: 1.35;
}

/* --------------------------------------------------------------------------
   Login ÃƒÂ¢Ã¢â€šÂ¬Ã¢â‚¬Â same visual language, no oversized brand block
   -------------------------------------------------------------------------- */

.login-page {
    padding: 14px;
}

.login-card {
    width: 100%;
    max-width: 390px;
    border: 0;
    border-radius: 10px;
    box-shadow: 0 18px 44px rgba(2, 20, 40, 0.28);
}

.login-card .card-body {
    padding: 22px !important;
}

.login-brand-logo {
    width: 238px;
    max-height: 52px;
    object-fit: contain;
    object-position: left center;
}

.login-card h1 {
    font-size: 18px;
    line-height: 1.2;
}

.login-card p.small {
    font-size: 12px;
    line-height: 1.4;
}

.login-page .form-label {
    margin-bottom: 2px;
    font-size: 12px;
}

.login-page .form-control {
    min-height: 32px;
    padding: 4px 8px;
    font-size: 12px;
}

.login-page .alert {
    padding: 7px 9px;
    margin-bottom: 10px;
    font-size: 12px;
}

.login-footer {
    font-size: 10.5px;
    padding: 8px !important;
}

@media (max-width: 575.98px) {
    .login-card {
        max-width: 100%;
    }

    .login-brand-logo {
        width: 210px;
    }

    .login-card .card-body {
        padding: 18px !important;
    }
}

/* --------------------------------------------------------------------------
   Desktop application shell
   -------------------------------------------------------------------------- */

@media (min-width: 992px) {
    html,
    body:not(.login-page) {
        height: 100%;
        overflow: hidden;
    }

    body:not(.login-page) .app-shell {
        height: 100dvh;
        overflow: hidden;
    }

    body:not(.login-page) .app-sidebar {
        width: var(--theme-sidebar-width);
        height: 100dvh;
        overflow: hidden;
        background: var(--theme-sidebar);
    }

    body:not(.login-page) .app-main {
        height: 100dvh;
        min-height: 0;
        margin-left: var(--theme-sidebar-width);
        overflow: hidden;
        display: flex;
        flex-direction: column;
    }

    body:not(.login-page) .app-topbar {
        flex: 0 0 var(--theme-topbar-height);
        min-height: var(--theme-topbar-height);
        padding: 0 12px;
        position: static;
        background: var(--theme-surface);
    }

    body:not(.login-page) .app-content {
        flex: 1 1 auto;
        min-height: 0;
        overflow-y: auto;
        overflow-x: hidden;
        padding: 8px 12px 10px;
    }

    body:not(.login-page) .app-main > footer {
        flex: 0 0 var(--theme-footer-height);
        min-height: var(--theme-footer-height);
        padding: 4px 12px !important;
        font-size: var(--theme-text-xs);
        line-height: 1.3;
        background: var(--theme-surface);
    }
}

/* Sidebar is intentionally quiet: compact navigation, no oversized branding. */
body:not(.login-page) .sidebar-brand {
    padding: 8px 10px 7px;
    gap: 1px;
}

body:not(.login-page) .brand-logo {
    width: 158px;
    max-height: 34px;
    object-fit: contain;
    object-position: left center;
}

body:not(.login-page) .brand-subtitle {
    font-size: 10.5px;
}

body:not(.login-page) .sidebar-nav {
    padding: 3px 6px 6px;
}

body:not(.login-page) .sidebar-nav .nav-link {
    min-height: 30px;
    margin-bottom: 1px;
    padding: 5px 8px;
    border-radius: var(--theme-radius-sm);
    gap: 8px;
    font-size: 12px;
}

body:not(.login-page) .nav-icon {
    width: 15px;
    height: 15px;
}

body:not(.login-page) .sidebar-section-label {
    padding: 8px 8px 2px;
    font-size: 10.5px;
}

body:not(.login-page) .sidebar-footer {
    padding: 6px 8px;
}

body:not(.login-page) .avatar {
    width: 28px;
    height: 28px;
    font-size: 10.5px;
}

body:not(.login-page) .sidebar-user {
    margin-bottom: 4px;
    gap: 7px;
}

body:not(.login-page) .sidebar-user-meta strong {
    font-size: 12px;
}

body:not(.login-page) .sidebar-user-meta span {
    font-size: 10.5px;
}

body:not(.login-page) .sidebar-account-link {
    margin-top: 3px;
    font-size: 10.5px;
}

/* Topbar: one line, no decorative duplicate title. */
body:not(.login-page) .topbar-inner {
    height: var(--theme-topbar-height);
    gap: 8px;
}

body:not(.login-page) .topbar-logo {
    width: 112px;
    max-height: 28px;
    object-fit: contain;
    object-position: left center;
}

body:not(.login-page) .topbar-divider,
body:not(.login-page) .topbar-title,
body:not(.login-page) .topbar-subtitle {
    display: none;
}

body:not(.login-page) .topbar-actions {
    gap: 5px;
}

body:not(.login-page) .app-main > footer .d-flex {
    gap: 6px;
}

body:not(.login-page) .app-main > footer .d-flex > span:first-child {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body:not(.login-page) .app-main > footer .d-flex > span:last-child {
    flex: 0 0 auto;
    font-size: 10.5px;
}

/* --------------------------------------------------------------------------
   Page header and controls
   -------------------------------------------------------------------------- */

body:not(.login-page) .page-header {
    min-height: 28px;
    margin: 0 0 7px;
    padding: 0;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

body:not(.login-page) .page-header h1 {
    margin: 0;
    color: var(--theme-text);
    font-size: var(--theme-text-lg);
    line-height: 1.15;
    letter-spacing: -0.015em;
}

body:not(.login-page) .page-header p {
    margin: 1px 0 0;
    color: var(--theme-muted);
    font-size: var(--theme-text-xs);
    line-height: 1.3;
}

body:not(.login-page) .page-actions {
    gap: 4px;
}

body:not(.login-page) .btn {
    min-height: 28px;
    padding: 3px 9px;
    border-radius: var(--theme-radius-sm);
    font-size: var(--theme-text-sm);
    line-height: 1.25;
}

body:not(.login-page) .btn-sm {
    min-height: 24px;
    padding: 2px 7px;
    font-size: var(--theme-text-xs);
}

body:not(.login-page) .btn-primary {
    background: var(--theme-primary);
    border-color: var(--theme-primary);
}

body:not(.login-page) .form-label {
    margin-bottom: 2px;
    color: #344054;
    font-size: var(--theme-text-xs);
    font-weight: 600;
}

body:not(.login-page) .form-control,
body:not(.login-page) .form-select {
    min-height: 28px;
    padding: 3px 7px;
    border-color: var(--theme-line-strong);
    border-radius: var(--theme-radius-sm);
    font-size: var(--theme-text-sm);
    line-height: 1.3;
}

body:not(.login-page) .filter-bar {
    margin-bottom: 7px;
    padding: 6px 8px;
    border-radius: var(--theme-radius);
    background: var(--theme-surface);
}

/* --------------------------------------------------------------------------
   Tables
   -------------------------------------------------------------------------- */

body:not(.login-page) .table {
    margin: 0;
    color: var(--theme-text);
    font-size: var(--theme-text-sm);
}

body:not(.login-page) .table > :not(caption) > * > * {
    padding: 5px 8px;
    border-bottom-color: var(--theme-line);
}

body:not(.login-page) .table thead th {
    padding: 5px 8px;
    background: var(--theme-surface-soft);
    color: var(--theme-muted);
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.045em;
    text-transform: uppercase;
    white-space: nowrap;
}

body:not(.login-page) .table tbody tr:hover {
    background: #f8fafc;
}

body:not(.login-page) .badge {
    padding: 2px 5px;
    border-radius: 4px;
    font-size: 10.5px;
    font-weight: 700;
    line-height: 1.25;
}

body:not(.login-page) .table-responsive {
    min-height: 0;
}

body:not(.login-page) .empty-state {
    padding: 20px 12px;
}

body:not(.login-page) .empty-state h2 {
    margin-bottom: 3px;
    font-size: var(--theme-text-md);
}

body:not(.login-page) .empty-state p {
    margin-bottom: 8px;
    font-size: var(--theme-text-xs);
}

/* --------------------------------------------------------------------------
   Dashboard ÃƒÂ¢Ã¢â€šÂ¬Ã¢â‚¬Â compact, fit-to-laptop workspace
   -------------------------------------------------------------------------- */

body.dashboard-page .app-content {
    padding-bottom: 6px;
}

body.dashboard-page .page-header {
    margin-bottom: 6px;
}

body.dashboard-page .dashboard-kpis {
    margin-bottom: 6px !important;
}

body.dashboard-page .dashboard-kpis .stat-card .card-body {
    padding: 6px 8px;
}

body.dashboard-page .dashboard-kpis .stat-label {
    font-size: 10.5px;
    letter-spacing: 0.04em;
}

body.dashboard-page .dashboard-kpis .stat-value {
    margin-top: 1px;
    font-size: 18px;
    line-height: 1.1;
}

body.dashboard-page .dashboard-kpis .text-muted.small {
    margin-top: 1px !important;
    font-size: 10.5px !important;
    line-height: 1.2;
}

body.dashboard-page .dashboard-kpis .stat-icon {
    width: 22px;
    height: 22px;
}

body.dashboard-page .dashboard-kpis .stat-icon svg {
    width: 12px;
    height: 12px;
}

body.dashboard-page .dashboard-mini-panel {
    margin-bottom: 6px !important;
}

body.dashboard-page .dashboard-mini-panel .card-body {
    padding: 4px 6px;
}

body.dashboard-page .mini-stat-grid {
    gap: 2px 6px;
}

body.dashboard-page .mini-stat {
    padding: 2px 6px;
    border-left: 2px solid var(--theme-line);
}

body.dashboard-page .mini-stat-label {
    font-size: 10.5px;
}

body.dashboard-page .mini-stat-value {
    margin-top: 0;
    font-size: 12px;
}

body.dashboard-page .mini-stat-hint {
    font-size: 10.5px;
}

body.dashboard-page .app-content > .row.g-3 {
    --bs-gutter-x: 6px;
    --bs-gutter-y: 6px;
}

body.dashboard-page .card-header {
    min-height: 28px;
    padding: 4px 8px;
}

body.dashboard-page .card-body {
    padding: 0;
}

body.dashboard-page .table > :not(caption) > * > * {
    padding: 3px 7px;
}

body.dashboard-page .table thead th {
    padding: 3px 7px;
    font-size: 10.5px;
}

body.dashboard-page .cell-main {
    font-size: 12px;
}

body.dashboard-page .cell-sub {
    font-size: 10.5px;
}

body.dashboard-page .dashboard-recent-leads,
body.dashboard-page .dashboard-recent-quotes {
    width: 100%;
    table-layout: fixed;
}

body.dashboard-page .dashboard-recent-leads th:nth-child(1) {
    width: 55%;
}

body.dashboard-page .dashboard-recent-leads th:nth-child(2) {
    width: 17%;
}

body.dashboard-page .dashboard-recent-leads th:nth-child(3) {
    width: 14%;
}

body.dashboard-page .dashboard-recent-leads th:nth-child(4) {
    width: 14%;
}

body.dashboard-page .dashboard-recent-quotes th:nth-child(1) {
    width: 58%;
}

body.dashboard-page .dashboard-recent-quotes th:nth-child(2) {
    width: 18%;
}

body.dashboard-page .dashboard-recent-quotes th:nth-child(3) {
    width: 24%;
}

body.dashboard-page .dashboard-recent-leads .cell-main,
body.dashboard-page .dashboard-recent-leads .cell-sub,
body.dashboard-page .dashboard-recent-quotes .cell-main,
body.dashboard-page .dashboard-recent-quotes .cell-sub {
    display: block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body.dashboard-page .timeline li {
    padding: 0 0 6px 12px;
}

body.dashboard-page .timeline-title {
    font-size: 12px;
}

body.dashboard-page .timeline-meta {
    font-size: 10.5px;
}

body.dashboard-page .col-12 .card-body {
    padding: 7px 10px;
}

body.dashboard-page .app-main > footer {
    min-height: 26px;
}

/* --------------------------------------------------------------------------
   List pages: no page inflation. The content area scrolls internally on desktop.
   -------------------------------------------------------------------------- */

body.list-page .app-content {
    overflow-y: auto;
}

body.list-page .page-header {
    margin-bottom: 6px;
}

body.list-page > .card,
body.list-page .card {
    border-radius: var(--theme-radius);
}

body.list-page .filter-bar {
    margin-bottom: 6px;
}

body.list-page .table > :not(caption) > * > * {
    padding-top: 4px;
    padding-bottom: 4px;
}

/* Compact follow-up tab strip. */
body:not(.login-page) .followup-tabs {
    display: flex;
    align-items: center;
    gap: 3px;
    flex-wrap: nowrap;
    overflow-x: auto;
    max-width: 100%;
    padding-bottom: 1px;
    scrollbar-width: none;
}

body:not(.login-page) .followup-tabs::-webkit-scrollbar {
    display: none;
}

body:not(.login-page) .followup-tab {
    flex: 0 0 auto;
    min-height: 22px;
    padding: 2px 7px;
    border-radius: 4px;
    font-size: 10.5px;
    line-height: 1.25;
}

body:not(.login-page) .followup-tab .badge {
    margin-left: 2px;
    padding: 1px 4px;
    font-size: 10.5px;
}

/* --------------------------------------------------------------------------
   Responsive contract
   -------------------------------------------------------------------------- */

@media (max-width: 1199.98px) {
    body:not(.login-page) .app-content {
        padding: 8px 10px 10px;
    }

    body:not(.login-page) .topbar-logo {
        width: 105px;
    }

    body.dashboard-page .dashboard-kpis .stat-value {
        font-size: 15px;
    }

    body.dashboard-page .dashboard-kpis .text-muted.small {
        display: none;
    }

    body.dashboard-page .col-xl-7,
    body.dashboard-page .col-xl-5 {
        flex: 0 0 100%;
        width: 100%;
    }

    body.dashboard-page .dashboard-mini-panel {
        margin-top: 0;
    }
}

@media (max-width: 991.98px) {
    body:not(.login-page) {
        overflow-x: hidden;
        overflow-y: auto;
    }

    body:not(.login-page) .app-shell,
    body:not(.login-page) .app-main {
        height: auto;
        min-height: 100dvh;
        overflow: visible;
    }

    body:not(.login-page) .app-main {
        margin-left: 0;
    }

    body:not(.login-page) .app-topbar {
        position: sticky;
        top: 0;
        min-height: 44px;
        padding: 0 8px;
        z-index: 1020;
    }

    body:not(.login-page) .app-topbar .topbar-inner {
        height: 44px;
    }

    body:not(.login-page) .topbar-logo {
        width: 112px;
    }

    body:not(.login-page) .topbar-title {
        display: block;
        max-width: 44vw;
        overflow: hidden;
        color: var(--theme-text);
        font-size: 13px;
        font-weight: 650;
        line-height: 1.2;
        white-space: nowrap;
        text-overflow: ellipsis;
    }

    body:not(.login-page) .topbar-divider,
    body:not(.login-page) .topbar-subtitle {
        display: none;
    }

    body:not(.login-page) .app-content {
        padding: 8px 8px 10px;
        overflow: visible;
    }

    body:not(.login-page) .app-main > footer {
        min-height: 26px;
        padding: 4px 8px !important;
        font-size: 10.5px;
        line-height: 1.25;
    }

    body:not(.login-page) .app-main > footer .d-flex > span:last-child {
        display: none;
    }
}

/* Tablet landscape: keep the shell fixed like desktop so the page itself never
   grows beyond the device viewport; the workspace scrolls internally. */
@media (min-width: 768px) and (max-width: 991.98px) {
    html,
    body:not(.login-page) {
        height: 100%;
        overflow: hidden;
    }

    body:not(.login-page) .app-shell {
        height: 100dvh;
        overflow: hidden;
    }

    body:not(.login-page) .app-main {
        height: 100dvh;
        min-height: 0;
        margin-left: 0;
        overflow: hidden;
    }

    body:not(.login-page) .app-topbar {
        flex: 0 0 44px;
        position: static;
    }

    body:not(.login-page) .app-content {
        flex: 1 1 auto;
        min-height: 0;
        overflow-y: auto;
        overflow-x: hidden;
    }

    body:not(.login-page) .app-main > footer {
        flex: 0 0 26px;
    }
}

@media (max-width: 767.98px) {
    body:not(.login-page) .page-header h1 {
        font-size: 18px;
    }

    body:not(.login-page) .page-header p {
        font-size: 12px;
    }

    body:not(.login-page) .table {
        font-size: 12px;
    }

    body:not(.login-page) .table > :not(caption) > * > * {
        padding: 4px 5px;
    }

    body:not(.login-page) .table thead th {
        padding: 4px 5px;
        font-size: 10.5px;
    }

    body:not(.login-page) .card-header {
        padding: 5px 7px;
    }

    body:not(.login-page) .card-body {
        padding: 8px;
    }

    body:not(.login-page) .dashboard-mini-panel .card-body {
        padding: 4px 5px;
    }

    body:not(.login-page) .topbar-logo {
        display: none;
    }

    body.dashboard-page .dashboard-kpis .stat-value {
        font-size: 14px;
    }

    body.dashboard-page .dashboard-kpis .stat-card .card-body {
        padding: 6px 7px;
    }

    body.dashboard-page .mini-stat-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 575.98px) {
    body:not(.login-page) .app-content {
        padding: 6px 6px 8px;
    }

    body:not(.login-page) .page-header {
        margin-bottom: 5px;
    }

    body:not(.login-page) .page-header h1 {
        font-size: 16px;
    }

    body:not(.login-page) .page-actions {
        width: 100%;
    }

    body:not(.login-page) .page-actions .btn {
        flex: 1 1 auto;
    }

    body:not(.login-page) .topbar-actions .btn {
        min-height: 24px;
        padding: 2px 5px;
        font-size: 10.5px;
    }

    body:not(.login-page) .topbar-actions .dropdown-toggle {
        max-width: 4.8rem;
    }

    body:not(.login-page) .card {
        border-radius: 6px;
    }

    body:not(.login-page) .stat-value {
        font-size: 14px;
    }

    body:not(.login-page) .table > :not(caption) > * > * {
        padding: 3px 4px;
    }

    body:not(.login-page) .table thead th {
        padding: 3px 4px;
        font-size: 10.5px;
    }

    body:not(.login-page) .btn-sm {
        min-height: 22px;
        padding: 2px 5px;
        font-size: 10.5px;
    }

    body:not(.login-page) .followup-tab {
        padding: 2px 6px;
        font-size: 10.5px;
    }

    body:not(.login-page) .followup-tabs {
        flex-wrap: wrap;
        overflow: visible;
    }

    body.dashboard-page .page-header p {
        display: none;
    }

    body.dashboard-page .dashboard-kpis {
        --bs-gutter-x: 5px;
        --bs-gutter-y: 5px;
    }

    body.dashboard-page .dashboard-kpis .stat-value {
        font-size: 13px;
    }

    body.dashboard-page .dashboard-kpis .stat-label {
        font-size: 10.5px;
    }

    body.dashboard-page .dashboard-kpis .text-muted.small {
        display: none;
    }

    body.dashboard-page .mini-stat-hint {
        display: none;
    }

    body.dashboard-page .dashboard-mini-panel .card-body {
        padding: 3px 4px;
    }
}

@media (max-width: 360px) {
    body:not(.login-page) .topbar-title {
        display: none;
    }

    body:not(.login-page) .topbar-inner {
        gap: 3px;
    }

    body:not(.login-page) .topbar-actions {
        gap: 2px;
    }

    body:not(.login-page) .topbar-actions .btn {
        min-height: 22px;
        padding: 2px 4px;
    }

    body:not(.login-page) .topbar-actions .dropdown-toggle {
        max-width: 4.2rem;
        font-size: 10.5px;
    }

    body:not(.login-page) .app-content {
        padding: 5px 5px 7px;
    }

    body:not(.login-page) .page-header h1 {
        font-size: 15px;
    }

    body:not(.login-page) .followup-tabs {
        flex-wrap: wrap;
        overflow: visible;
    }
}

/* ==========================================================================
   Final typography decision: Calibri with a readable compact scale.
   Base 12px; metadata 10.5px; navigation/controls 12px; page title 18px.
   ========================================================================== */
html,
body,
body * {
    font-family: Calibri, "Segoe UI", Arial, sans-serif !important;
}

body:not(.login-page) {
    font-size: 12px !important;
}

body:not(.login-page) .app-content,
body:not(.login-page) .table,
body:not(.login-page) .btn,
body:not(.login-page) .form-control,
body:not(.login-page) .form-select,
body:not(.login-page) .dropdown-item,
body:not(.login-page) .alert,
body:not(.login-page) .nav-link {
    font-size: 12px;
}

body:not(.login-page) .page-header h1 {
    font-size: 18px !important;
}

body:not(.login-page) .table thead th,
body:not(.login-page) .form-label,
body:not(.login-page) .cell-sub,
body:not(.login-page) .badge,
body:not(.login-page) .stat-label,
body:not(.login-page) .mini-stat-label,
body:not(.login-page) .mini-stat-hint,
body:not(.login-page) .timeline-meta,
body:not(.login-page) .sidebar-section-label,
body:not(.login-page) .page-header p,
body:not(.login-page) .app-main > footer {
    font-size: 10.5px !important;
}

body:not(.login-page) .stat-value,
body:not(.login-page) .mini-stat-value {
    font-size: 16px !important;
}

body:not(.login-page) .sidebar-nav .nav-link {
    font-size: 12px !important;
}

body:not(.login-page) .brand-subtitle,
body:not(.login-page) .sidebar-user-meta span,
body:not(.login-page) .sidebar-account-link,
body:not(.login-page) .followup-tab,
body:not(.login-page) .mini-stat-label,
body:not(.login-page) .mini-stat-hint {
    font-size: 10.5px !important;
}

/* Optional desktop menu visibility. The choice is remembered in localStorage. */
@media (min-width: 992px) {
    body:not(.login-page) .app-sidebar,
    body:not(.login-page) .app-main {
        transition: margin-left 160ms ease, transform 160ms ease;
    }

    html.sidebar-hidden body:not(.login-page) .app-sidebar {
        transform: translateX(-100%);
        visibility: hidden;
    }

    html.sidebar-hidden body:not(.login-page) .app-main {
        margin-left: 0;
    }
}

#sidebar-toggle {
    width: 28px;
    min-height: 26px;
    padding: 3px 5px;
    color: var(--theme-muted);
}

#sidebar-toggle:hover {
    color: var(--theme-text);
    background: var(--theme-surface-soft);
}

/* ==========================================================================
   Edge-to-edge workspace language
   The shell and content share the same borders. No decorative outer gutters.
   ========================================================================== */
:root {
    --theme-sidebar-width: clamp(184px, 14.5vw, 216px);
    --theme-topbar-height: 40px;
    --theme-footer-height: 26px;
    --theme-radius: 4px;
    --theme-radius-sm: 3px;
}

body:not(.login-page) .app-content {
    padding: 0 !important;
    border-left: 1px solid var(--theme-line);
}

body:not(.login-page) .page-header {
    margin: 0 !important;
    padding: 7px clamp(8px, 0.9vw, 14px);
    background: var(--theme-surface);
    border-bottom: 1px solid var(--theme-line);
}

body:not(.login-page) .filter-bar {
    margin: 0 !important;
    padding: 7px clamp(8px, 0.9vw, 14px);
    border-right: 0;
    border-left: 0;
    border-radius: 0;
    box-shadow: none;
}

body:not(.login-page) .app-content > .row.g-3 {
    margin: 0 !important;
    --bs-gutter-x: 1px;
    --bs-gutter-y: 1px;
}

body:not(.login-page) .app-content > .row.g-3 > [class*="col"] {
    padding-right: 0;
    padding-left: 0;
}

body:not(.login-page) .app-content > .row.g-3 .card {
    border-radius: 0;
    box-shadow: none;
}

body:not(.login-page) .app-content > .card {
    margin-right: 0;
    margin-left: 0;
    border-right: 0;
    border-left: 0;
    border-radius: 0;
    box-shadow: none;
}

body:not(.login-page) .app-content > .card:first-of-type {
    border-top: 0;
}

body:not(.login-page) .app-content > .row.g-3 + .card,
body:not(.login-page) .app-content > .card + .row.g-3 {
    margin-top: 0;
}

body:not(.login-page) .app-content .card-header {
    border-radius: 0;
}

body:not(.login-page) .app-content .card-footer {
    border-radius: 0;
}

body:not(.login-page) .app-main > footer {
    padding: 4px clamp(8px, 0.9vw, 14px) !important;
}

/* Dashboard is a single edge-to-edge workspace on laptop/desktop. */
@media (min-width: 1200px) {
    body.dashboard-page .app-content {
        display: flex;
        flex-direction: column;
        min-height: 0;
        overflow: hidden !important;
    }

    body.dashboard-page .page-header,
    body.dashboard-page .dashboard-kpis,
    body.dashboard-page .dashboard-mini-panel {
        flex: 0 0 auto;
    }

    body.dashboard-page .dashboard-kpis {
        margin: 0 !important;
    }

    body.dashboard-page .dashboard-mini-panel {
        margin: 0 !important;
        border-right: 0;
        border-left: 0;
        border-radius: 0;
        box-shadow: none;
    }

    body.dashboard-page .app-content > .row.g-3:last-of-type {
        flex: 1 1 auto;
        min-height: 0;
        overflow: hidden;
        margin: 0 !important;
    }

    body.dashboard-page .app-content > .row.g-3:last-of-type > [class*="col"] {
        min-height: 0;
        overflow: hidden;
    }

    body.dashboard-page .app-content > .row.g-3:last-of-type .card {
        height: 100%;
        border-radius: 0;
        box-shadow: none;
    }

    body.dashboard-page .app-content > .row.g-3:last-of-type .table-responsive {
        overflow: auto;
    }

    body.dashboard-page .app-content > .row.g-3:last-of-type .col-12 .card-body {
        overflow-y: auto;
    }
}

@media (max-width: 1199.98px) {
    body.dashboard-page .dashboard-mini-panel {
        margin: 0 !important;
        border-right: 0;
        border-left: 0;
        border-radius: 0;
        box-shadow: none;
    }

    body.dashboard-page .dashboard-kpis {
        margin: 0 !important;
    }
}

@media (max-width: 991.98px) {
    body:not(.login-page) .app-content {
        border-left: 0;
    }
}

/* Keep dashboard lists filling the available desktop height; keep phones short. */
@media (min-width: 1200px) {
    body.dashboard-page .app-content > .row.g-3:last-of-type .card-body {
        min-height: 0;
    }

    body.dashboard-page .app-content > .row.g-3:last-of-type .table-responsive {
        max-height: 100%;
    }
}

@media (max-width: 1199.98px) {
    body.dashboard-page .dashboard-recent-leads tbody tr:nth-child(n+6),
    body.dashboard-page .dashboard-recent-quotes tbody tr:nth-child(n+6),
    body.dashboard-page .timeline li:nth-child(n+5) {
        display: none;
    }
}

/* ==========================================================================
   Final density correction:
   Reclaim horizontal space from cells/columns and spend it on readable text.
   ========================================================================== */
:root {
    --theme-text-xs: 11px;
    --theme-text-sm: 12.5px;
    --theme-text-md: 13px;
    --theme-text-lg: 19px;
}

body:not(.login-page) {
    font-size: 13px !important;
}

body:not(.login-page) .table {
    font-size: 12.5px !important;
}

body:not(.login-page) .table > :not(caption) > * > * {
    padding: 3px 5px !important;
}

body:not(.login-page) .table thead th {
    padding: 3px 5px !important;
    font-size: 11px !important;
    letter-spacing: 0.025em;
}

body:not(.login-page) .cell-main {
    font-size: 12.5px !important;
}

body:not(.login-page) .cell-sub {
    font-size: 10.5px !important;
}

body:not(.login-page) .page-header h1 {
    font-size: 19px !important;
}

body:not(.login-page) .page-header p {
    font-size: 11px !important;
}

body:not(.login-page) .btn,
body:not(.login-page) .form-control,
body:not(.login-page) .form-select,
body:not(.login-page) .nav-link,
body:not(.login-page) .dropdown-item,
body:not(.login-page) .alert {
    font-size: 12.5px !important;
}

body:not(.login-page) .form-label {
    font-size: 11px !important;
}

body:not(.login-page) .badge {
    font-size: 10.5px !important;
}

body:not(.login-page) .sidebar-nav .nav-link {
    font-size: 12.5px !important;
}

body:not(.login-page) .card-header {
    padding: 5px 7px !important;
}

body:not(.login-page) .card-body {
    padding: 7px !important;
}

body:not(.login-page) .filter-bar {
    padding: 6px 8px !important;
}

body:not(.login-page) .filter-bar .row {
    --bs-gutter-x: 4px;
    --bs-gutter-y: 4px;
}

body:not(.login-page) .app-content > .row.g-3 {
    --bs-gutter-x: 1px;
    --bs-gutter-y: 1px;
}

body.dashboard-page .dashboard-kpis .stat-label {
    font-size: 10.5px !important;
}

body.dashboard-page .dashboard-kpis .stat-value {
    font-size: 17px !important;
}

body.dashboard-page .dashboard-kpis .text-muted.small {
    font-size: 10.5px !important;
}

body.dashboard-page .mini-stat-label {
    font-size: 10px !important;
}

body.dashboard-page .mini-stat-value {
    font-size: 13px !important;
}

body.dashboard-page .mini-stat-hint {
    font-size: 10px !important;
}

body.dashboard-page .table > :not(caption) > * > * {
    padding: 2px 4px !important;
}

body.dashboard-page .table thead th {
    padding: 2px 4px !important;
    font-size: 10.5px !important;
}

body.dashboard-page .dashboard-recent-leads th:nth-child(1) {
    width: 54%;
}

body.dashboard-page .dashboard-recent-leads th:nth-child(2) {
    width: 14%;
}

body.dashboard-page .dashboard-recent-leads th:nth-child(3) {
    width: 18%;
}

body.dashboard-page .dashboard-recent-leads th:nth-child(4) {
    width: 14%;
}

body.dashboard-page .dashboard-recent-quotes th:nth-child(1) {
    width: 61%;
}

body.dashboard-page .dashboard-recent-quotes th:nth-child(2) {
    width: 17%;
}

body.dashboard-page .dashboard-recent-quotes th:nth-child(3) {
    width: 22%;
}

@media (max-width: 575.98px) {
    body:not(.login-page) {
        font-size: 12px !important;
    }

    body:not(.login-page) .table {
        font-size: 11.5px !important;
    }

    body:not(.login-page) .btn,
    body:not(.login-page) .form-control,
    body:not(.login-page) .form-select,
    body:not(.login-page) .nav-link {
        font-size: 11.5px !important;
    }

    body:not(.login-page) .page-header h1 {
        font-size: 17px !important;
    }

    body:not(.login-page) .table > :not(caption) > * > * {
        padding: 2px 3px !important;
    }

    body:not(.login-page) .table thead th {
        padding: 2px 3px !important;
        font-size: 10px !important;
    }

    body:not(.login-page) .cell-main {
        font-size: 12px !important;
    }
}

@media (max-width: 575.98px) {
    body.dashboard-page .dashboard-recent-leads th:nth-child(1) {
        width: 70%;
    }

    body.dashboard-page .dashboard-recent-leads th:nth-child(3) {
        width: 30%;
    }
}

/* Dashboard desktop layout: true border-to-border grid, no clipped footer. */
@media (min-width: 1200px) {
    body.dashboard-page .app-content > .row.g-3:last-of-type {
        display: grid;
        grid-template-columns: 58.333333% 41.666667%;
        grid-template-rows: minmax(0, 1fr) auto;
        gap: 1px;
        flex: 1 1 auto;
        min-height: 0;
        overflow: hidden;
    }

    body.dashboard-page .app-content > .row.g-3:last-of-type > .col-xl-7 {
        grid-column: 1;
        grid-row: 1;
        width: auto;
        padding: 0;
        min-height: 0;
    }

    body.dashboard-page .app-content > .row.g-3:last-of-type > .col-xl-5 {
        grid-column: 2;
        grid-row: 1;
        width: auto;
        padding: 0;
        min-height: 0;
    }

    body.dashboard-page .app-content > .row.g-3:last-of-type > .col-12 {
        grid-column: 1 / -1;
        grid-row: 2;
        padding: 0;
        min-height: 0;
    }

    body.dashboard-page .app-content > .row.g-3:last-of-type .card {
        height: 100%;
        min-height: 0;
        display: flex;
        flex-direction: column;
    }

    body.dashboard-page .app-content > .row.g-3:last-of-type .card > .card-header {
        flex: 0 0 auto;
    }

    body.dashboard-page .app-content > .row.g-3:last-of-type .card > .table-responsive {
        flex: 1 1 auto;
        min-height: 0;
        overflow: auto;
    }

    body.dashboard-page .app-content > .row.g-3:last-of-type > .col-12 .card > .card-body {
        overflow-y: auto;
    }
}

/* ==========================================================================
   Boxed dashboard layout override
   The base theme intentionally used an edge-to-edge, flat workspace. This
   final layer restores separate cards, gutters and normal page scrolling.
   ========================================================================== */
body.dashboard-page {
    overflow-y: auto !important;
}

body.dashboard-page .app-shell,
body.dashboard-page .app-main {
    overflow: visible !important;
}

body.dashboard-page .app-content {
    display: block !important;
    overflow: visible !important;
    padding: 14px 16px 22px !important;
    background: #f2f6fb;
    border-left: 0 !important;
}

body.dashboard-page .page-header {
    margin: 0 0 14px !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
}

body.dashboard-page .app-content > .row.g-3,
body.dashboard-page .dashboard-kpis {
    margin: 0 0 14px !important;
    --bs-gutter-x: 14px !important;
    --bs-gutter-y: 14px !important;
    overflow: visible !important;
}

body.dashboard-page .app-content > .row.g-3 > [class*="col"],
body.dashboard-page .dashboard-kpis > [class*="col"] {
    padding-left: calc(var(--bs-gutter-x) * 0.5) !important;
    padding-right: calc(var(--bs-gutter-x) * 0.5) !important;
}

body.dashboard-page .app-content > .row.g-3 .card,
body.dashboard-page .app-content > .card {
    border: 1px solid #d7e1ed !important;
    border-radius: 10px !important;
    box-shadow: 0 3px 12px rgba(15, 42, 67, 0.08) !important;
    overflow: hidden;
}

body.dashboard-page .app-content > .row.g-3 .card > .card-header,
body.dashboard-page .app-content > .card > .card-header {
    border-radius: 10px 10px 0 0 !important;
    background: #f8fafc !important;
    border-bottom: 1px solid #e0e8f1 !important;
    padding: 8px 12px !important;
}

body.dashboard-page .app-content > .row.g-3:last-of-type {
    flex: none !important;
    overflow: visible !important;
    margin-bottom: 14px !important;
}

body.dashboard-page .app-content > .row.g-3:last-of-type > [class*="col"] {
    min-height: 0 !important;
    overflow: visible !important;
}

body.dashboard-page .app-content > .row.g-3:last-of-type .card {
    height: 100% !important;
}

body.dashboard-page .app-content > .card {
    margin: 0 0 14px !important;
}

body.dashboard-page .dashboard-kpis .stat-card {
    border-top: 3px solid var(--ashe-blue) !important;
    border-radius: 10px !important;
    box-shadow: 0 3px 12px rgba(15, 42, 67, 0.08) !important;
}

body.dashboard-page .dashboard-kpis .stat-card .card-body {
    padding: 12px 14px 11px !important;
}

body.dashboard-page .dashboard-kpis .stat-value {
    margin-top: 3px !important;
    font-size: 22px !important;
}

body.dashboard-page .dashboard-kpis .stat-label {
    font-size: 11px !important;
}

body.dashboard-page .dashboard-kpis .text-muted.small {
    margin-top: 2px !important;
    font-size: 11px !important;
}

body.dashboard-page .dashboard-kpis .stat-icon {
    width: 32px !important;
    height: 32px !important;
}

body.dashboard-page .dashboard-kpis .stat-icon svg {
    width: 16px !important;
    height: 16px !important;
}

body.dashboard-page .dashboard-mini-panel {
    margin: 0 0 14px !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

body.dashboard-page .dashboard-mini-panel .card-body {
    padding: 0 !important;
}

body.dashboard-page .mini-stat-grid {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 14px !important;
}

body.dashboard-page .mini-stat {
    min-height: 96px !important;
    padding: 12px 14px !important;
    background: #ffffff !important;
    border: 1px solid #d7e1ed !important;
    border-radius: 10px !important;
    box-shadow: 0 3px 12px rgba(15, 42, 67, 0.08) !important;
}

body.dashboard-page .mini-stat-label {
    font-size: 11px !important;
}

body.dashboard-page .mini-stat-value {
    margin-top: 3px !important;
    font-size: 22px !important;
}

body.dashboard-page .mini-stat-hint {
    font-size: 11px !important;
    padding-top: 4px !important;
}

body.dashboard-page .table > :not(caption) > * > * {
    padding: 7px 10px !important;
}

body.dashboard-page .table thead th {
    padding: 7px 10px !important;
    font-size: 11px !important;
}

body.dashboard-page .cell-main {
    font-size: 13px !important;
}

body.dashboard-page .cell-sub {
    font-size: 11px !important;
}

@media (max-width: 991.98px) {
    body.dashboard-page .mini-stat-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 575.98px) {
    body.dashboard-page .app-content {
        padding: 10px 10px 18px !important;
    }

    body.dashboard-page .dashboard-kpis {
        --bs-gutter-x: 10px !important;
        --bs-gutter-y: 10px !important;
    }

    body.dashboard-page .dashboard-kpis .stat-value {
        font-size: 18px !important;
    }

    body.dashboard-page .mini-stat-value {
        font-size: 18px !important;
    }
}

/* ==========================================================================
   Leads register: dense, bordered Excel-style grid
   ========================================================================== */
body.leads-page .filter-bar {
    margin: 0 0 12px !important;
    padding: 12px 14px !important;
    background: #ffffff;
    border: 1px solid #cfd9e6 !important;
    border-radius: 8px !important;
    box-shadow: 0 2px 7px rgba(15, 42, 67, 0.06);
}

body.leads-page .filter-bar .form-label {
    margin-bottom: 3px;
    color: #56677d;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

body.leads-page .filter-bar .form-control,
body.leads-page .filter-bar .form-select {
    border: 1px solid #bcc9d8;
    border-radius: 6px;
    font-size: 12px;
}

body.leads-page .card {
    border: 1px solid #c8d4e2 !important;
    border-radius: 8px !important;
    box-shadow: 0 2px 8px rgba(15, 42, 67, 0.07) !important;
    overflow: hidden;
}

body.leads-page .card > .card-header {
    background: #eef3f9 !important;
    border-bottom: 1px solid #c8d4e2 !important;
    padding: 8px 12px !important;
}

body.leads-page .leads-table-wrap {
    border-top: 1px solid #c8d4e2;
    overflow: auto;
}

body.leads-page .leads-table {
    width: 100%;
    min-width: 1900px;
    margin: 0 !important;
    border-collapse: collapse;
    table-layout: fixed;
    font-size: 11.5px;
}

body.leads-page .leads-table th,
body.leads-page .leads-table td {
    border: 1px solid #c9d5e2 !important;
    padding: 7px 8px !important;
    vertical-align: top !important;
    line-height: 1.35;
    word-break: normal;
}

body.leads-page .leads-table thead th {
    position: sticky;
    top: 0;
    z-index: 2;
    background: #e5edf6 !important;
    color: #43566e !important;
    font-size: 10px !important;
    font-weight: 800;
    letter-spacing: 0.045em;
    text-transform: uppercase;
    border-bottom: 2px solid #b9c8da !important;
    white-space: nowrap;
}

body.leads-page .leads-table tbody tr:nth-child(even) {
    background: #f8fbfe;
}

body.leads-page .leads-table tbody tr:hover {
    background: #eef6ff !important;
}

body.leads-page .leads-table .row-num {
    width: 36px;
    color: #7a8ca3;
    font-size: 10px;
    text-align: center;
    background: #f3f7fb;
}

body.leads-page .leads-table .lead-col { width: 170px; }
body.leads-page .leads-table .company-col { width: 185px; }
body.leads-page .leads-table .contact-col { width: 170px; }
body.leads-page .leads-table .requirement-col { width: 185px; }
body.leads-page .leads-table .spec-col { width: 205px; }
body.leads-page .leads-table .status-col { width: 105px; }
body.leads-page .leads-table .priority-col { width: 125px; }
body.leads-page .leads-table .activity-col { width: 155px; }
body.leads-page .leads-table .created-col { width: 125px; }
body.leads-page .leads-table .actions-col { width: 105px; text-align: center; }

body.leads-page .leads-table .cell-main {
    display: inline-block;
    color: #123d72;
    font-size: 12.5px;
    font-weight: 700;
    text-decoration: none;
    margin-bottom: 2px;
}

body.leads-page .leads-table .cell-main:hover {
    text-decoration: underline;
}

body.leads-page .leads-table .cell-sub {
    color: #62748a !important;
    font-size: 10.5px;
    line-height: 1.35;
}

body.leads-page .leads-table .cell-line {
    display: block;
    color: #43566e;
    font-size: 10.8px;
    line-height: 1.4;
}

body.leads-page .leads-table .cell-line strong {
    color: #2c3e54;
}

body.leads-page .leads-table .badge {
    border: 1px solid rgba(34, 56, 82, 0.14);
    font-size: 10px;
    padding: 3px 6px;
}

body.leads-page .leads-table .actions-cell {
    white-space: nowrap;
    display: table-cell;
}

body.leads-page .leads-table .actions-cell .btn {
    padding: 3px 6px;
    font-size: 10.5px;
    border-radius: 5px;
    margin: 1px;
}

body.leads-page .leads-table + .table-responsive {
    border-radius: 0;
}

@media (max-width: 991.98px) {
    body.leads-page .leads-table {
        min-width: 1700px;
    }
}

/* One-view leads register: flexible seven-column Excel grid. */
body.leads-page .leads-table {
    width: 100% !important;
    min-width: 0 !important;
    table-layout: fixed !important;
}

body.leads-page .leads-table th.row-num,
body.leads-page .leads-table td.row-num { width: 3%; }

body.leads-page .leads-table th.lead-col { width: 17%; }
body.leads-page .leads-table th.company-col { width: 18%; }
body.leads-page .leads-table th.requirement-col { width: 24%; }
body.leads-page .leads-table th.status-col { width: 10%; }
body.leads-page .leads-table th.activity-col { width: 11%; }
body.leads-page .leads-table th.created-col { width: 10%; }
body.leads-page .leads-table th.actions-col { width: 7%; }

body.leads-page .leads-table td {
    overflow-wrap: anywhere;
    word-break: break-word;
}

body.leads-page .leads-table .cell-line,
body.leads-page .leads-table .cell-sub {
    max-width: 100%;
}

@media (max-width: 991.98px) {
    body.leads-page .leads-table {
        min-width: 940px !important;
    }
}

/* Compact Excel-style lead grid: minimal column spacing while retaining all detail. */
body.leads-page .leads-table th,
body.leads-page .leads-table td {
    padding: 5px 6px !important;
    line-height: 1.3;
    font-size: 10.8px;
}

body.leads-page .leads-table th {
    font-size: 9.5px !important;
    letter-spacing: 0.035em;
}

body.leads-page .leads-table th.lead-col { width: 15% !important; }
body.leads-page .leads-table th.company-col { width: 17% !important; }
body.leads-page .leads-table th.requirement-col { width: 30% !important; }
body.leads-page .leads-table th.status-col { width: 8% !important; }
body.leads-page .leads-table th.activity-col { width: 11% !important; }
body.leads-page .leads-table th.created-col { width: 9% !important; }
body.leads-page .leads-table th.actions-col { width: 7% !important; }

body.leads-page .leads-table .cell-main { font-size: 12px; }
body.leads-page .leads-table .cell-sub { font-size: 10px; line-height: 1.3; }
body.leads-page .leads-table .cell-line { font-size: 10.5px; line-height: 1.3; }
body.leads-page .leads-table .badge { font-size: 9.5px; padding: 2px 5px; }

/* Final compact lead column balance: keep every action inside the viewport. */
body.leads-page .leads-table th.lead-col { width: 14% !important; }
body.leads-page .leads-table th.company-col { width: 16% !important; }
body.leads-page .leads-table th.requirement-col { width: 29% !important; }
body.leads-page .leads-table th.status-col { width: 9% !important; }
body.leads-page .leads-table th.activity-col { width: 10% !important; }
body.leads-page .leads-table th.created-col { width: 9% !important; }
body.leads-page .leads-table th.actions-col { width: 10% !important; }

body.leads-page .leads-table .actions-cell {
    white-space: normal !important;
}

body.leads-page .leads-table .actions-cell .btn {
    padding: 2px 4px !important;
    font-size: 9px !important;
    margin: 1px 0 !important;
    display: inline-block;
}
