/*
 * Tabler 기본 대비를 높인 오버라이드. LumaTutor(ela-coach)에서 가져와
 * 변수 접두사만 이 저장소에 맞게 바꿨다. Tabler 자체는 건드리지 않는다 —
 * vendor/ 아래 파일을 고치면 업그레이드가 불가능해진다.
 */
:root[data-bs-theme="dark"] {
    --mktg-dark-canvas: #101720;
    --mktg-dark-title: #141d28;
    --mktg-dark-surface: #172231;
    --mktg-dark-surface-muted: #1a2635;
    --mktg-dark-border: #2a394a;
    --mktg-dark-selection-bg: rgba(65, 125, 230, .58);
    --mktg-dark-selection-text: #ffffff;
    --tblr-body-bg: var(--mktg-dark-canvas);
    --tblr-bg-surface: var(--mktg-dark-surface);
    --tblr-bg-surface-secondary: var(--mktg-dark-canvas);
    --tblr-bg-surface-tertiary: var(--mktg-dark-surface-muted);
    --tblr-border-color: var(--mktg-dark-border);
    --tblr-border-color-translucent: rgba(148, 163, 184, .16);
    --tblr-box-shadow: 0 1px 2px rgba(0, 0, 0, .18);
}

:root[data-bs-theme="dark"] ::selection {
    color: var(--mktg-dark-selection-text);
    background: var(--mktg-dark-selection-bg);
}

:root[data-bs-theme="dark"] input::selection,
:root[data-bs-theme="dark"] textarea::selection,
:root[data-bs-theme="dark"] .form-control::selection {
    color: #ffffff;
    background: #2f6fde;
}

:root[data-bs-theme="dark"] body,
:root[data-bs-theme="dark"] .page,
:root[data-bs-theme="dark"] .page-wrapper,
:root[data-bs-theme="dark"] .page-body {
    background: var(--mktg-dark-canvas);
}

:root[data-bs-theme="dark"] .navbar:not(.navbar-vertical),
:root[data-bs-theme="dark"] .page-header {
    background: var(--mktg-dark-title);
    border-color: var(--mktg-dark-border);
}

:root[data-bs-theme="dark"] .card,
:root[data-bs-theme="dark"] .list-group-item,
:root[data-bs-theme="dark"] .dropdown-menu,
:root[data-bs-theme="dark"] .modal-content,
:root[data-bs-theme="dark"] .offcanvas,
:root[data-bs-theme="dark"] .popover,
:root[data-bs-theme="dark"] .toast {
    background-color: var(--mktg-dark-surface);
    border-color: var(--mktg-dark-border);
    box-shadow: 0 1px 2px rgba(0, 0, 0, .2);
}

:root[data-bs-theme="dark"] .card-header,
:root[data-bs-theme="dark"] .card-footer {
    background: var(--mktg-dark-surface-muted);
    border-color: var(--mktg-dark-border);
}

:root[data-bs-theme="dark"] .table {
    --tblr-table-bg: var(--mktg-dark-surface);
    --tblr-table-striped-bg: var(--mktg-dark-surface-muted);
    --tblr-table-hover-bg: #1d2b3b;
    --tblr-table-border-color: var(--mktg-dark-border);
}

:root[data-bs-theme="dark"] .table thead th {
    background: var(--mktg-dark-surface-muted);
    border-bottom-color: #35475b;
}