:root {
    --clt-page-bg: #f3f4f6;
    --clt-surface-bg: #ffffff;
    --clt-accent: #354F52;
    --clt-accent-hover: #354F52;
    --clt-headline: #354F52;
    --bs-primary: #354F52;
    --bs-primary-rgb: 53, 79, 82;
    --bs-link-color: #354F52;
    --bs-link-hover-color: #354F52;
}

html[data-bs-theme="dark"] {
    --clt-page-bg: #0d1117;
    --clt-surface-bg: #161b22;
    --clt-accent: #58a6ff;
    --clt-accent-hover: #79c0ff;
    --clt-headline: #c9d1d9;
    --bs-primary: #58a6ff;
    --bs-primary-rgb: 88, 166, 255;
    --bs-link-color: #58a6ff;
    --bs-link-hover-color: #79c0ff;
    --bs-body-color: #c9d1d9;
    --bs-body-bg: #0d1117;
    --bs-border-color: #30363d;
    --bs-secondary-color: #8b949e;
    --bs-tertiary-bg: #161b22;
}

/* Force primary buttons to use CLT accent regardless of Bootstrap defaults. */
.btn-primary {
    --bs-btn-bg: var(--clt-accent);
    --bs-btn-border-color: var(--clt-accent);
    --bs-btn-hover-bg: var(--clt-accent-hover);
    --bs-btn-hover-border-color: var(--clt-accent-hover);
    --bs-btn-active-bg: var(--clt-accent);
    --bs-btn-active-border-color: var(--clt-accent);
}

/* Ensure active pills use CLT accent. */
.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
    background-color: var(--clt-accent);
}

/* App background */
body {
    background-color: var(--clt-page-bg);
}

/* App list pane headline color */
#listCol .list-group-item .fw-semibold {
    color: var(--clt-headline);
}

/* Compact list pane typography (fit more results per screen). */
#listCol {
    font-size: 0.925rem;
    --clt-summary-lines: 2;
}

#listCol .list-group-item {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    padding-left: 0.75rem;
    padding-right: 0.75rem;
}

#listCol .list-group-item .fw-semibold {
    font-size: 0.95rem;
}

#listCol .text-muted.small {
    font-size: 0.8rem;
}

#listCol .summary-snippet {
    font-size: 0.85rem;
    margin-top: 0 !important;
    line-height: 1.25;
    overflow: hidden;
    min-width: 0;

    /* Multi-line clamp (Outlook-like preview). */
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: var(--clt-summary-lines);
}

#listCol .clt-list-item {
    padding-right: 2.05rem;
}

#listCol .clt-list-item .clt-chevron {
    right: 0.6rem;
}

html[data-bs-theme="light"] #listCol .list-group-item:hover {
    background-color: #f8fafc;
}

html[data-bs-theme="dark"] #listCol .list-group-item:hover {
    background-color: rgba(255, 255, 255, 0.04);
}

html[data-bs-theme="light"] #listCol .list-group-item.active {
    background-color: #eaf2ff;
    border-color: #dbeafe;
    color: var(--bs-body-color);
}

html[data-bs-theme="dark"] #listCol .list-group-item.active {
    background-color: rgba(96, 165, 250, 0.18);
    border-color: rgba(96, 165, 250, 0.28);
    color: var(--bs-body-color);
}

/* Dark mode card and surface styling */
html[data-bs-theme="dark"] .card {
    background-color: var(--clt-surface-bg);
    border-color: var(--bs-border-color);
    color: var(--bs-body-color);
}

html[data-bs-theme="dark"] .modal-content {
    background-color: var(--clt-surface-bg);
    border-color: var(--bs-border-color);
    color: var(--bs-body-color);
}

html[data-bs-theme="dark"] .form-control,
html[data-bs-theme="dark"] .form-select {
    background-color: #0d1117;
    border-color: var(--bs-border-color);
    color: var(--bs-body-color);
}

html[data-bs-theme="dark"] .form-control:focus,
html[data-bs-theme="dark"] .form-select:focus {
    background-color: #0d1117;
    border-color: var(--clt-accent);
    color: var(--bs-body-color);
}

html[data-bs-theme="dark"] .table {
    color: var(--bs-body-color);
}

html[data-bs-theme="dark"] .table-striped > tbody > tr:nth-of-type(odd) > * {
    background-color: rgba(255, 255, 255, 0.03);
}

html[data-bs-theme="dark"] .btn-light {
    background-color: var(--clt-surface-bg);
    border-color: var(--bs-border-color);
    color: var(--bs-body-color);
}

html[data-bs-theme="dark"] .btn-light:hover {
    background-color: rgba(255, 255, 255, 0.08);
    border-color: var(--bs-border-color);
    color: var(--bs-body-color);
}

html[data-bs-theme="dark"] .list-group-item {
    background-color: var(--clt-surface-bg);
    border-color: var(--bs-border-color);
    color: var(--bs-body-color);
}

html[data-bs-theme="dark"] .offcanvas {
    background-color: var(--clt-surface-bg);
    color: var(--bs-body-color);
}

html[data-bs-theme="dark"] .navbar {
    background-color: var(--clt-surface-bg) !important;
}

html[data-bs-theme="dark"] .dropdown-menu {
    background-color: var(--clt-surface-bg);
    border-color: var(--bs-border-color);
}

html[data-bs-theme="dark"] .dropdown-item {
    color: var(--bs-body-color);
}

html[data-bs-theme="dark"] .dropdown-item:hover,
html[data-bs-theme="dark"] .dropdown-item:focus {
    background-color: rgba(255, 255, 255, 0.08);
    color: var(--bs-body-color);
}

html[data-bs-theme="dark"] .alert {
    background-color: var(--clt-surface-bg);
    border-color: var(--bs-border-color);
    color: var(--bs-body-color);
}

html[data-bs-theme="dark"] .pagination .page-link {
    background-color: var(--clt-surface-bg);
    border-color: var(--bs-border-color);
    color: var(--bs-body-color);
}

html[data-bs-theme="dark"] .pagination .page-link:hover {
    background-color: rgba(255, 255, 255, 0.08);
}

html[data-bs-theme="dark"] .pagination .page-item.active .page-link {
    background-color: var(--clt-accent);
    border-color: var(--clt-accent);
}

html[data-bs-theme="dark"] .badge {
    background-color: rgba(88, 166, 255, 0.2);
    color: #79c0ff;
}

html[data-bs-theme="dark"] .breadcrumb-item a {
    color: var(--clt-accent);
}

html[data-bs-theme="dark"] hr {
    border-color: var(--bs-border-color);
    opacity: 0.25;
}

html[data-bs-theme="dark"] .border,
html[data-bs-theme="dark"] .border-top,
html[data-bs-theme="dark"] .border-bottom,
html[data-bs-theme="dark"] .border-start,
html[data-bs-theme="dark"] .border-end {
    border-color: var(--bs-border-color) !important;
}

/* Ensure all text uses proper body color in dark mode */
html[data-bs-theme="dark"] {
    color-scheme: dark;
}

html[data-bs-theme="dark"] h1,
html[data-bs-theme="dark"] h2,
html[data-bs-theme="dark"] h3,
html[data-bs-theme="dark"] h4,
html[data-bs-theme="dark"] h5,
html[data-bs-theme="dark"] h6 {
    color: var(--clt-headline);
}

html[data-bs-theme="dark"] .text-muted {
    color: var(--bs-secondary-color) !important;
}

html[data-bs-theme="dark"] .bg-light {
    background-color: var(--clt-surface-bg) !important;
}

html[data-bs-theme="dark"] .bg-white {
    background-color: var(--clt-surface-bg) !important;
}

html[data-bs-theme="dark"] .text-dark {
    color: var(--bs-body-color) !important;
}

html[data-clt-theme="night"] {
    --clt-page-bg: #f4eee3;
    --clt-surface-bg: #fbf5ea;
    --clt-accent: #8c6640;
    --clt-accent-hover: #9f764d;
    --clt-headline: #473426;
    --bs-primary: #8c6640;
    --bs-primary-rgb: 140, 102, 64;
    --bs-link-color: #8c6640;
    --bs-link-hover-color: #9f764d;
    --bs-body-color: #3d2f24;
    --bs-body-bg: #f4eee3;
    --bs-border-color: #d8c8b1;
    --bs-secondary-color: #75624f;
    --bs-tertiary-bg: #f0e5d4;
    color-scheme: light;
}

html[data-clt-theme="night"] #listCol .list-group-item:hover {
    background-color: #efe2cf;
}

html[data-clt-theme="night"] #listCol .list-group-item.active {
    background-color: #ebdbc2;
    border-color: #d9bd97;
    color: var(--bs-body-color);
}

html[data-clt-theme="night"] .form-control,
html[data-clt-theme="night"] .form-select {
    background-color: #f9f1e4;
    border-color: var(--bs-border-color);
    color: var(--bs-body-color);
}

html[data-clt-theme="night"] .form-control:focus,
html[data-clt-theme="night"] .form-select:focus {
    background-color: #f9f1e4;
    border-color: var(--clt-accent);
    color: var(--bs-body-color);
}

html[data-clt-theme="night"] .btn-light:hover,
html[data-clt-theme="night"] .dropdown-item:hover,
html[data-clt-theme="night"] .dropdown-item:focus,
html[data-clt-theme="night"] .pagination .page-link:hover {
    background-color: #eee1cd;
    color: var(--bs-body-color);
}

html[data-clt-theme="night"] .badge {
    background-color: #e4d3b7;
    color: #684b2f;
}

html[data-clt-theme="night"] .bg-white {
    background-color: var(--clt-surface-bg) !important;
}

html[data-clt-theme="night"] .bg-light {
    background-color: var(--bs-tertiary-bg) !important;
}

html[data-clt-theme="night"] .text-dark {
    color: var(--bs-body-color) !important;
}

html[data-clt-theme="night"] .card,
html[data-clt-theme="night"] .modal-content,
html[data-clt-theme="night"] .list-group-item,
html[data-clt-theme="night"] .offcanvas,
html[data-clt-theme="night"] .dropdown-menu,
html[data-clt-theme="night"] .table,
html[data-clt-theme="night"] .accordion-item,
html[data-clt-theme="night"] .accordion-button,
html[data-clt-theme="night"] .cltSubscriptionGateCard {
    background-color: var(--clt-surface-bg);
    border-color: var(--bs-border-color);
    color: var(--bs-body-color);
}

html[data-clt-theme="night"] .sidebar,
html[data-clt-theme="night"] .sidebar + .flex-grow-1 .navbar,
html[data-clt-theme="night"] .navbar {
    background-color: var(--clt-surface-bg) !important;
}

html[data-clt-theme="night"] .btn-light,
html[data-clt-theme="night"] .pagination .page-link,
html[data-clt-theme="night"] .input-group-text,
html[data-clt-theme="night"] .alert {
    background-color: #f7efdf;
    border-color: var(--bs-border-color);
    color: var(--bs-body-color);
}

html[data-clt-theme="night"] .table-striped > tbody > tr:nth-of-type(odd) > * {
    background-color: #f2e8d8;
}

html[data-clt-theme="night"] .dropdown-item {
    color: var(--bs-body-color);
}

html[data-clt-theme="night"] .border,
html[data-clt-theme="night"] .border-top,
html[data-clt-theme="night"] .border-bottom,
html[data-clt-theme="night"] .border-start,
html[data-clt-theme="night"] .border-end,
html[data-clt-theme="night"] hr {
    border-color: var(--bs-border-color) !important;
}

html[data-clt-theme="night"] .accordion-button:not(.collapsed) {
    background-color: #ede1cc;
    color: var(--bs-body-color);
}