/* dc-dark.css — colour themes and dark mode for the whole site. Loaded LAST (includes/header.php).
 * Two switches on <html>: data-accent="indigo|violet|emerald|amber|rose|sky|teal|slate" (the brand colour) and data-theme="light|dark" (the surfaces).
 * Bootstrap's own dark palette comes from data-bs-theme (set together with data-theme); everything below fixes what this project hard-coded in light colours.
 * Contrast: text colours here are >= 4.5:1 on their surfaces. Pictures are never inverted or dimmed. */

/* ============ Colour themes (brand colour for links and text, deep gradient for buttons so white text always reads) ============ */
html[data-accent="indigo"]  { --dc-brand: #4f46e5; --dc-brand-2: #7c3aed; --dc-brand-dark: #3730a3; --dc-btn-a: #4f46e5; --dc-btn-b: #7c3aed; --dc-rgb: 79, 70, 229; }
html[data-accent="violet"]  { --dc-brand: #7c3aed; --dc-brand-2: #a855f7; --dc-brand-dark: #5b21b6; --dc-btn-a: #7c3aed; --dc-btn-b: #a855f7; --dc-rgb: 124, 58, 237; }
html[data-accent="emerald"] { --dc-brand: #047857; --dc-brand-2: #10b981; --dc-brand-dark: #065f46; --dc-btn-a: #047857; --dc-btn-b: #10b981; --dc-rgb: 4, 120, 87; }
html[data-accent="amber"]   { --dc-brand: #b45309; --dc-brand-2: #d97706; --dc-brand-dark: #92400e; --dc-btn-a: #b45309; --dc-btn-b: #d97706; --dc-rgb: 180, 83, 9; }
html[data-accent="rose"]    { --dc-brand: #e11d48; --dc-brand-2: #f43f5e; --dc-brand-dark: #be123c; --dc-btn-a: #e11d48; --dc-btn-b: #f43f5e; --dc-rgb: 225, 29, 72; }
html[data-accent="sky"]     { --dc-brand: #0369a1; --dc-brand-2: #0ea5e9; --dc-brand-dark: #075985; --dc-btn-a: #0369a1; --dc-btn-b: #0ea5e9; --dc-rgb: 3, 105, 161; }
html[data-accent="teal"]    { --dc-brand: #0f766e; --dc-brand-2: #14b8a6; --dc-brand-dark: #115e59; --dc-btn-a: #0f766e; --dc-btn-b: #14b8a6; --dc-rgb: 15, 118, 110; }
html[data-accent="slate"]   { --dc-brand: #475569; --dc-brand-2: #64748b; --dc-brand-dark: #334155; --dc-btn-a: #475569; --dc-btn-b: #64748b; --dc-rgb: 71, 85, 105; }
html[data-theme="dark"][data-accent="indigo"]  { --dc-brand: #a5b4fc; --dc-brand-dark: #c7d2fe; }
html[data-theme="dark"][data-accent="violet"]  { --dc-brand: #c4b5fd; --dc-brand-dark: #ddd6fe; }
html[data-theme="dark"][data-accent="emerald"] { --dc-brand: #6ee7b7; --dc-brand-dark: #a7f3d0; }
html[data-theme="dark"][data-accent="amber"]   { --dc-brand: #fcd34d; --dc-brand-dark: #fde68a; }
html[data-theme="dark"][data-accent="rose"]    { --dc-brand: #fda4af; --dc-brand-dark: #fecdd3; }
html[data-theme="dark"][data-accent="sky"]     { --dc-brand: #7dd3fc; --dc-brand-dark: #bae6fd; }
html[data-theme="dark"][data-accent="teal"]    { --dc-brand: #5eead4; --dc-brand-dark: #99f6e4; }
html[data-theme="dark"][data-accent="slate"]   { --dc-brand: #cbd5e1; --dc-brand-dark: #e2e8f0; }
html[data-accent] {
  --dc-grad: linear-gradient(135deg, var(--dc-btn-a), var(--dc-btn-b)); --accent-gradient: var(--dc-grad);
  --primary-color: var(--dc-brand); --primary-hover: var(--dc-brand-dark); --dc-ring: 0 0 0 .22rem rgba(var(--dc-rgb), .28);
  --bs-primary: var(--dc-brand); --bs-link-color: var(--dc-brand); --bs-link-hover-color: var(--dc-brand-dark);
}
html[data-accent] .btn-primary { background: var(--dc-grad); box-shadow: 0 4px 14px rgba(var(--dc-rgb), .3); color: #fff; }
html[data-accent] .btn-primary:hover, html[data-accent] .btn-primary:focus { box-shadow: 0 8px 22px rgba(var(--dc-rgb), .4); }
html[data-accent] .btn-outline-primary { color: var(--dc-brand); border-color: rgba(var(--dc-rgb), .45); }
html[data-accent] .btn-outline-primary:hover { background: var(--dc-btn-a); border-color: var(--dc-btn-a); color: #fff; }
html[data-accent] .text-primary { color: var(--dc-brand) !important; }
html[data-accent] .bg-primary { background-color: var(--dc-btn-a) !important; }
html[data-accent] .form-check-input:checked { background-color: var(--dc-btn-a); border-color: var(--dc-btn-a); }
html[data-accent] .input-group-text { background: rgba(var(--dc-rgb), .1); color: var(--dc-brand-dark); }
html[data-accent] .app-sidebar .sb-link:hover, html[data-accent] .app-sidebar .sb-toggle:hover { color: var(--dc-brand); }
html[data-accent] .app-sidebar .sb-link.active, html[data-accent] .app-sidebar .sb-toggle.has-active { background: rgba(var(--dc-rgb), .12); color: var(--dc-brand); }
html[data-accent] .nav-link:hover, html[data-accent] .nav-link.active { color: var(--dc-brand) !important; }

/* the colour picker swatches */
.dc-swatch { width: 28px; height: 28px; border-radius: 50%; border: 3px solid transparent; background: var(--c); cursor: pointer; padding: 0; box-shadow: 0 0 0 1px rgba(100, 116, 139, .45); }
.dc-swatch[aria-pressed="true"] { border-color: var(--bs-body-bg, #fff); box-shadow: 0 0 0 2px var(--c); }
.dc-swatch.c-amber { --c: #d97706; }

/* ============ Dark surfaces ============ */
html[data-theme="dark"] {
  color-scheme: dark;
  --dc-ink: #f1f5f9; --dc-text: #cbd5e1; --dc-muted: #9aa8bd; --dc-line: #26314a; --dc-soft: #101829;
  --bg-body: #0b1220; --card-shadow: 0 10px 40px rgba(0, 0, 0, .45);
  --bs-body-bg: #0b1220; --bs-body-color: #cbd5e1; --bs-border-color: #26314a; --bs-emphasis-color: #f1f5f9; --bs-secondary-color: #9aa8bd; --bs-tertiary-bg: #121b2e; --bs-secondary-bg: #121b2e;
  --c-bg: #16213a; --surface: #141c2e; --surface-2: #19233a; --edge: #26314a;
}
html[data-theme="dark"] body { background-color: #0b1220; color: #cbd5e1; }
html[data-theme="dark"] h1, html[data-theme="dark"] h2, html[data-theme="dark"] h3, html[data-theme="dark"] h4, html[data-theme="dark"] h5, html[data-theme="dark"] h6,
html[data-theme="dark"] .fw-bold:not(.text-white):not(.btn):not(.badge):not([class*="text-"]) { color: #f1f5f9; }
html[data-theme="dark"] .text-dark, html[data-theme="dark"] .text-black { color: #e2e8f0 !important; }
html[data-theme="dark"] .text-muted, html[data-theme="dark"] .text-secondary, html[data-theme="dark"] .form-text, html[data-theme="dark"] .small.text-muted { color: #9aa8bd !important; }
html[data-theme="dark"] .bg-white, html[data-theme="dark"] .bg-body { background-color: #141c2e !important; }
html[data-theme="dark"] .bg-light, html[data-theme="dark"] .bg-body-tertiary, html[data-theme="dark"] .bg-body-secondary { background-color: #101829 !important; }
html[data-theme="dark"] .border, html[data-theme="dark"] .border-top, html[data-theme="dark"] .border-bottom, html[data-theme="dark"] .border-start, html[data-theme="dark"] .border-end { border-color: #26314a !important; }
html[data-theme="dark"] hr { border-color: #26314a; opacity: 1; }
html[data-theme="dark"] a:not(.btn):not(.nav-link):not(.dropdown-item):not(.page-link):not(.list-group-item):not(.card):not(.badge):not(.accordion-button):not(.sb-link):not(.navbar-brand):not([class*="text-"]):not([class*="dc-"]):not(.bottom-nav-item) { color: var(--dc-brand); }

/* navigation */
html[data-theme="dark"] .navbar { background: rgba(11, 18, 32, .86) !important; border-bottom-color: #26314a; }
html[data-theme="dark"] .navbar-brand { color: #f1f5f9 !important; }
html[data-theme="dark"] .nav-link, html[data-theme="dark"] .dc-nav-groups > .nav-item > .nav-link { color: #cbd5e1 !important; }
html[data-theme="dark"] .navbar-toggler { filter: invert(1) grayscale(1); }
html[data-theme="dark"] .app-sidebar { background: #0f1729; border-right-color: #26314a; }
html[data-theme="dark"] .app-sidebar .sb-link, html[data-theme="dark"] .app-sidebar .sb-toggle { color: #b6c2d6; }
html[data-theme="dark"] .app-sidebar .sb-link:hover, html[data-theme="dark"] .app-sidebar .sb-toggle:hover { background: #17213a; }
html[data-theme="dark"] .app-sidebar .sb-sub { border-left-color: #26314a; }
html[data-theme="dark"] .bottom-nav { background: rgba(15, 23, 41, .94); border-top-color: #26314a; box-shadow: 0 -10px 30px rgba(0, 0, 0, .4); }
html[data-theme="dark"] .bottom-nav-item { color: #8392aa; }
html[data-theme="dark"] .dropdown-menu, html[data-theme="dark"] .dc-mega-menu { background: #141c2e; border: 1px solid #26314a !important; }
html[data-theme="dark"] .dropdown-item { color: #cbd5e1; }
html[data-theme="dark"] .dropdown-item:hover, html[data-theme="dark"] .dropdown-item:focus { background: #1b2742; color: #fff; }
html[data-theme="dark"] .dropdown-divider { border-color: #26314a; }
html[data-theme="dark"] .dc-mega-item { color: #e2e8f0; } html[data-theme="dark"] .dc-mega-item:hover { background: #1b2742; }
html[data-theme="dark"] .dc-mega-icon { background: #1b2742; color: var(--dc-brand); } html[data-theme="dark"] .dc-mega-desc { color: #9aa8bd; }
html[data-theme="dark"] .dc-mega-more { color: var(--dc-brand); border-top-color: #26314a; }
html[data-theme="dark"] .dc-mini-chip { background: #3a2a08; color: #fcd34d; } html[data-theme="dark"] .dc-mini-chip.soon { background: #26314a; color: #cbd5e1; }
html[data-theme="dark"] .dc-nav-search input { background: #101829; border-color: #26314a; color: #e2e8f0; }
@media (max-width: 991.98px) { html[data-theme="dark"] .dc-mega-menu { background: #101829; } }

/* cards, panels, tables */
html[data-theme="dark"] .card, html[data-theme="dark"] main .card { background-color: #141c2e; border-color: #26314a; }
html[data-theme="dark"] .card:hover { box-shadow: 0 20px 50px rgba(0, 0, 0, .5); }
html[data-theme="dark"] main .card .card-header, html[data-theme="dark"] .card-header { background: #19233a; border-bottom-color: #26314a; color: #f1f5f9; }
html[data-theme="dark"] .card-footer { background: #19233a; border-top-color: #26314a; }
html[data-theme="dark"] main .card.bg-light { background: #101829 !important; border-color: #26314a; }
html[data-theme="dark"] .dc-stat { background: linear-gradient(180deg, #19233a, #141c2e 70%); }
html[data-theme="dark"] a.dc-tile { color: #f1f5f9; } html[data-theme="dark"] a.dc-tile:hover { background: #1b2742; }
html[data-theme="dark"] a.dc-tile .dc-title { color: #f1f5f9; } html[data-theme="dark"] a.dc-tile .dc-desc { color: #9aa8bd; }
html[data-theme="dark"] .dc-icon { background: #1b2742; color: var(--c, var(--dc-brand)); }
html[data-theme="dark"] .dc-chip { background: #1b2742; color: #dbe4f3; border-color: #2c3a5a; }
html[data-theme="dark"] .dc-stat .dc-stat-label { color: #b6c2d6; } html[data-theme="dark"] .dc-stat .dc-stat-value, html[data-theme="dark"] .dc-section { color: #f1f5f9; }
html[data-theme="dark"] .stat-tile { background: #19233a; } html[data-theme="dark"] .stat-tile .label { color: #9aa8bd; } html[data-theme="dark"] .stat-tile .value { color: #f1f5f9; } html[data-theme="dark"] .stat-tile .hint { color: #7d8ba3; }
html[data-theme="dark"] .dc-chart-head h6 { color: #f1f5f9; } html[data-theme="dark"] .dc-chart-head .sub { color: #9aa8bd; }
html[data-theme="dark"] .dc-ui .table thead th, html[data-theme="dark"] .table thead th { color: #9aa8bd; }
html[data-theme="dark"] .dc-ui h3.fw-bold, html[data-theme="dark"] .dc-ui h4.fw-bold:first-child { color: #f1f5f9; }
html[data-theme="dark"] .dc-ui .empty-state { color: #9aa8bd; } html[data-theme="dark"] .dc-ui .stat-card .fs-5, html[data-theme="dark"] .dc-ui .stat-card .fs-4 { color: #f1f5f9; }
html[data-theme="dark"] .dc-ui .form-label.small, html[data-theme="dark"] .dc-ui label.small, html[data-theme="dark"] .form-label, html[data-theme="dark"] .form-check-label { color: #cbd5e1; }
html[data-theme="dark"] .table { --bs-table-bg: transparent; --bs-table-color: #cbd5e1; --bs-table-border-color: #26314a; --bs-table-striped-bg: #16213a; --bs-table-hover-bg: #1b2742; --bs-table-hover-color: #fff; color: #cbd5e1; }
html[data-theme="dark"] .table > :not(caption) > * > * { background-color: transparent; color: inherit; border-bottom-color: #26314a; }
html[data-theme="dark"] .table-light, html[data-theme="dark"] .table-light > th, html[data-theme="dark"] .table-light > td { --bs-table-bg: #19233a; --bs-table-color: #cbd5e1; background-color: #19233a !important; color: #cbd5e1 !important; }
html[data-theme="dark"] .list-group-item { background: #141c2e; color: #cbd5e1; border-color: #26314a; }
html[data-theme="dark"] .accordion-item, html[data-theme="dark"] .accordion-button { background: #141c2e; color: #e2e8f0; border-color: #26314a; }
html[data-theme="dark"] .accordion-button:not(.collapsed) { background: #1b2742; color: #fff; }
html[data-theme="dark"] .accordion-button::after { filter: invert(1); }
html[data-theme="dark"] .modal-content { background: #141c2e; color: #cbd5e1; border: 1px solid #26314a; }
html[data-theme="dark"] .modal-header, html[data-theme="dark"] .modal-footer { border-color: #26314a; }
html[data-theme="dark"] .btn-close { filter: invert(1) grayscale(1) brightness(2); }
html[data-theme="dark"] .page-link { background: #141c2e; border-color: #26314a; color: var(--dc-brand); }
html[data-theme="dark"] .page-item.active .page-link { background: var(--dc-btn-a); border-color: var(--dc-btn-a); color: #fff; }
html[data-theme="dark"] .page-item.disabled .page-link { background: #101829; color: #64748b; }
html[data-theme="dark"] .breadcrumb-item.active, html[data-theme="dark"] .breadcrumb-item + .breadcrumb-item::before { color: #9aa8bd; }
html[data-theme="dark"] .nav-tabs { border-color: #26314a; } html[data-theme="dark"] .nav-tabs .nav-link.active { background: #141c2e; border-color: #26314a #26314a #141c2e; color: #fff !important; }
html[data-theme="dark"] .progress { background: #26314a; }
html[data-theme="dark"] code { color: #f0abfc; } html[data-theme="dark"] pre { background: #101829; color: #e2e8f0; border: 1px solid #26314a; }

/* forms and buttons */
html[data-theme="dark"] .form-control, html[data-theme="dark"] .form-select, html[data-theme="dark"] .input-group-text, html[data-theme="dark"] textarea, html[data-theme="dark"] select {
  background-color: #101829; border-color: #34425f; color: #e2e8f0; }
html[data-theme="dark"] .form-control:focus, html[data-theme="dark"] .form-select:focus { background-color: #101829; color: #fff; border-color: var(--dc-brand); }
html[data-theme="dark"] .form-control:disabled, html[data-theme="dark"] .form-control[readonly], html[data-theme="dark"] .form-select:disabled { background-color: #19233a; color: #9aa8bd; }
html[data-theme="dark"] .form-control::placeholder, html[data-theme="dark"] textarea::placeholder { color: #6f7f99; }
html[data-theme="dark"] .form-control:hover, html[data-theme="dark"] .form-select:hover { border-color: #53648a; }
html[data-theme="dark"] .form-select { --bs-form-select-bg-img: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23cbd5e1' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e"); }
html[data-theme="dark"] .input-group-text { background: #19233a; color: var(--dc-brand); }
html[data-theme="dark"] input[type="file"].form-control { background: #101829; }
html[data-theme="dark"] input[type="file"].form-control::file-selector-button { background: #1b2742; color: #e2e8f0; border-right-color: #34425f; }
html[data-theme="dark"] .form-check-input { background-color: #101829; border-color: #53648a; }
html[data-theme="dark"] .btn-light { background: #19233a; border-color: #2c3a5a; color: #e2e8f0; } html[data-theme="dark"] .btn-light:hover { background: #22304d; border-color: #3a4b73; color: #fff; }
html[data-theme="dark"] .btn-outline-primary, html[data-theme="dark"] .btn-outline-secondary, html[data-theme="dark"] .btn-outline-dark, html[data-theme="dark"] .btn-outline-success, html[data-theme="dark"] .btn-outline-danger, html[data-theme="dark"] .btn-outline-warning { background: transparent; }
html[data-theme="dark"] .btn-outline-secondary { color: #cbd5e1; border-color: #4a5a7d; } html[data-theme="dark"] .btn-outline-secondary:hover { background: #22304d; color: #fff; }
html[data-theme="dark"] .btn-outline-dark { color: #e2e8f0; border-color: #4a5a7d; } html[data-theme="dark"] .btn-outline-dark:hover { background: #e2e8f0; color: #0b1220; border-color: #e2e8f0; }
html[data-theme="dark"] .btn-outline-success { color: #6ee7b7; border-color: #1f7a5a; } html[data-theme="dark"] .btn-outline-danger { color: #fda4af; border-color: #9f1d3b; } html[data-theme="dark"] .btn-outline-warning { color: #fcd34d; border-color: #946a12; }
html[data-theme="dark"] .btn-dark { background: #26314a; } html[data-theme="dark"] .btn-link { color: var(--dc-brand); }
html[data-theme="dark"] .badge.bg-light { background: #26314a !important; color: #e2e8f0 !important; }
html[data-theme="dark"] .badge.text-dark { color: #e2e8f0 !important; }

/* alerts */
html[data-theme="dark"] .alert-info { background: #0c2a3d; border-color: #14506f; color: #bae6fd; } html[data-theme="dark"] .alert-warning { background: #3a2a08; border-color: #6b4d0c; color: #fde68a; }
html[data-theme="dark"] .alert-success { background: #0a3324; border-color: #14664a; color: #a7f3d0; } html[data-theme="dark"] .alert-danger { background: #3d0f1a; border-color: #7f1d33; color: #fecdd3; }
html[data-theme="dark"] .alert-secondary, html[data-theme="dark"] .alert-light { background: #19233a; border-color: #26314a; color: #cbd5e1; }
html[data-theme="dark"] .alert a { color: inherit; text-decoration: underline; }
html[data-theme="dark"] .swal2-popup { background: #141c2e !important; color: #e2e8f0 !important; } html[data-theme="dark"] .swal2-title, html[data-theme="dark"] .swal2-html-container { color: #e2e8f0 !important; }

/* public site pieces */
html[data-theme="dark"] .dc-pub-hero { filter: none; }
html[data-theme="dark"] .dc-locked, html[data-theme="dark"] .dc-plan, html[data-theme="dark"] .dc-tpl, html[data-theme="dark"] .dc-legal-body, html[data-theme="dark"] .dc-legal-nav { background: #141c2e; border-color: #26314a; color: #cbd5e1; }
html[data-theme="dark"] .dc-plan-name, html[data-theme="dark"] .dc-plan-price .amt, html[data-theme="dark"] .dc-tpl h3, html[data-theme="dark"] .dc-legal-body h1, html[data-theme="dark"] .dc-legal-body h2 { color: #f1f5f9; }
html[data-theme="dark"] .dc-legal-nav a { color: #cbd5e1; } html[data-theme="dark"] .dc-legal-nav a.active { color: var(--dc-brand); }
html[data-theme="dark"] .dc-media { background: #19233a; }
html[data-theme="dark"] .dc-pchip { background: #141c2e; color: #e2e8f0; border-color: #26314a; }
html[data-theme="dark"] .dc-pub-search input { background: #101829; color: #e2e8f0; }
html[data-theme="dark"] .cover-frame { background: #101829; } html[data-theme="dark"] .cover-frame.cover-empty { color: #64748b; }
html[data-theme="dark"] .dc-upload-item { color: #9aa8bd; }
html[data-theme="dark"] ::-webkit-scrollbar-track { background: #0b1220; } html[data-theme="dark"] ::-webkit-scrollbar-thumb { background: #34425f; }
html[data-theme="dark"] img.dc-invert-dark { filter: invert(1) hue-rotate(180deg); }
html[data-theme="dark"] .dc-chat-bubble, html[data-theme="dark"] .dc-agent-panel { background: #141c2e; color: #e2e8f0; border-color: #26314a; }
html[data-theme="dark"] .leaflet-container { filter: brightness(.85) contrast(1.05); }

/* things that must stay light: the design studio canvas and printed/PDF-like pages choose it themselves with data-dc-light on <html> */
html[data-dc-light] { color-scheme: light; }

html[data-theme="dark"] .dc-plan-list li { color: #cbd5e1; } html[data-theme="dark"] .dc-plan-list li.no { color: #7d8ba3; } html[data-theme="dark"] .dc-plan-list li.no i { background: #19233a; color: #7d8ba3; }
html[data-theme="dark"] .dc-plan-sub, html[data-theme="dark"] .dc-plan-price .cur, html[data-theme="dark"] .dc-plan-price .per { color: #9aa8bd; }

/* a chosen option card (radio buttons drawn as buttons): the accent, not Bootstrap's grey */
html[data-accent] .btn-check:checked + .btn-outline-secondary, html[data-accent] .btn-check:checked + .btn-outline-primary { background: rgba(var(--dc-rgb), .13); border-color: var(--dc-btn-a); color: var(--dc-ink, #0f172a); box-shadow: 0 0 0 2px rgba(var(--dc-rgb), .25); }
html[data-theme="dark"][data-accent] .btn-check:checked + .btn-outline-secondary, html[data-theme="dark"][data-accent] .btn-check:checked + .btn-outline-primary { background: rgba(var(--dc-rgb), .28); color: #fff; }
