/* Bootstrap-5-Dark-Mode fuer die Anwendung. */

/* Native Controls (Scrollbars, Select-Popups, Datepicker der Inputs) dunkel rendern */
html[data-theme="dark"] {
	color-scheme: dark;
	--bs-body-bg: #1a1d21;
	--bs-body-color: #cfd3d8;
	--bs-emphasis-color: #f3f5f7;
	--bs-secondary-color: #9aa0a6;
	--bs-secondary-bg: #23272d;
	--bs-tertiary-bg: #2b3037;
	--bs-border-color: #3a3f46;
	--bs-link-color: #5aa9e6;
	--bs-link-hover-color: #85c1f0;
	--bs-card-bg: #23272d;
	--bs-card-border-color: #3a3f46;
	--bs-modal-bg: #23272d;
	--bs-dropdown-bg: #26292e;
	--bs-dropdown-border-color: #3a3f46;
	--bs-table-color: #cfd3d8;
	--bs-table-bg: transparent;
	--bs-table-striped-bg: #202429;
	--bs-table-hover-bg: #2a2f36;
	--bs-table-border-color: #3a3f46;
}

/* Grundflaechen */
html[data-theme="dark"] body {
	background-color: #1a1d21;
	color: #cfd3d8;
}

html[data-theme="dark"] #page-content-wrapper a:not(.btn) {
	color: #5aa9e6;
}
html[data-theme="dark"] #page-content-wrapper a:not(.btn):hover,
html[data-theme="dark"] #page-content-wrapper a:not(.btn):focus {
	color: #85c1f0;
}

html[data-theme="dark"] hr {
	border-top-color: #3a3f46;
}

html[data-theme="dark"] .text-muted {
	color: #9aa0a6;
}

html[data-theme="dark"] .page-header {
	border-bottom-color: #3a3f46;
}

/* Tabellen */
html[data-theme="dark"] .table {
	color: #cfd3d8;
}
html[data-theme="dark"] .table > thead > tr > th,
html[data-theme="dark"] .table > tbody > tr > th,
html[data-theme="dark"] .table > tfoot > tr > th,
html[data-theme="dark"] .table > thead > tr > td,
html[data-theme="dark"] .table > tbody > tr > td,
html[data-theme="dark"] .table > tfoot > tr > td {
	border-top-color: #3a3f46;
}
html[data-theme="dark"] .table > thead > tr > th {
	border-bottom-color: #4a505a;
}
html[data-theme="dark"] .table-bordered,
html[data-theme="dark"] .table-bordered > thead > tr > th,
html[data-theme="dark"] .table-bordered > tbody > tr > th,
html[data-theme="dark"] .table-bordered > tfoot > tr > th,
html[data-theme="dark"] .table-bordered > thead > tr > td,
html[data-theme="dark"] .table-bordered > tbody > tr > td,
html[data-theme="dark"] .table-bordered > tfoot > tr > td {
	border-color: #3a3f46;
}
html[data-theme="dark"] .table-striped > tbody > tr:nth-of-type(odd) {
	background-color: #202429;
}
html[data-theme="dark"] .table-hover > tbody > tr:hover {
	background-color: #2a2f36;
}
html[data-theme="dark"] .table-cards > tbody > tr,
html[data-theme="dark"] .table-cards > tbody > tr.alert-warning {
	background: none;
}

/* Cards */
html[data-theme="dark"] .card {
	background-color: #23272d;
	border-color: #3a3f46;
}
html[data-theme="dark"] .card > .card-header {
	background-color: #2b3037;
	background-image: none;
	border-color: #3a3f46;
	color: #cfd3d8;
}
html[data-theme="dark"] .card-footer {
	background-color: #2b3037;
	border-top-color: #3a3f46;
}

/* Formularfelder */
html[data-theme="dark"] .form-control {
	background-color: #2a2e34;
	border-color: #454b52;
	color: #e2e5e9;
}
html[data-theme="dark"] .form-control:focus {
	border-color: #5aa9e6;
	box-shadow: inset 0 1px 1px rgba(0,0,0,.2), 0 0 6px rgba(90,169,230,.4);
}
html[data-theme="dark"] .form-control::placeholder {
	color: #7a8189;
}
html[data-theme="dark"] .form-control[disabled],
html[data-theme="dark"] .form-control[readonly],
html[data-theme="dark"] fieldset[disabled] .form-control {
	background-color: #23262b;
	color: #8a9098;
}
/* Select-Felder (.form-select): dunkler Hintergrund + heller Pfeil,
   sonst waere der Standard-Caret (#343a40) auf dunklem Grund unsichtbar. */
html[data-theme="dark"] .form-select {
	background-color: #2a2e34;
	border-color: #454b52;
	color: #e2e5e9;
	--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='%23dee2e6' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
}
html[data-theme="dark"] .form-select:focus {
	border-color: #5aa9e6;
	box-shadow: inset 0 1px 1px rgba(0,0,0,.2), 0 0 6px rgba(90,169,230,.4);
}
html[data-theme="dark"] .form-select[disabled] {
	background-color: #23262b;
	color: #8a9098;
}
/* Zeit-Auswahl-Toggle an das dunkle Feld angleichen (wie .form-select). */
html[data-theme="dark"] .zeit-caret,
html[data-theme="dark"] .zeit-caret:hover,
html[data-theme="dark"] .zeit-caret:focus,
html[data-theme="dark"] .zeit-caret:active,
html[data-theme="dark"] .zeit-caret.show {
	background-color: #2a2e34;
	border-color: #454b52;
	color: #dee2e6;
}
html[data-theme="dark"] .input-group-text {
	background-color: #2b3037;
	border-color: #454b52;
	color: #cfd3d8;
}

/* Buttons */
html[data-theme="dark"] .btn {
	background-image: none;
	text-shadow: none;
}

/* Farbige Buttons: solide Bootstrap-Grundfarben behalten, Text weiss sicherstellen */
html[data-theme="dark"] .btn-primary,
html[data-theme="dark"] .btn-success,
html[data-theme="dark"] .btn-info,
html[data-theme="dark"] .btn-warning,
html[data-theme="dark"] .btn-danger {
	color: #fff;
}

/* Secondary Buttons */
html[data-theme="dark"] .btn-secondary {
	background-color: #2d3238;
	border-color: #4a505a;
	color: #d4d7db;
}
html[data-theme="dark"] .btn-secondary:hover,
html[data-theme="dark"] .btn-secondary:focus,
html[data-theme="dark"] .btn-secondary:active,
html[data-theme="dark"] .btn-secondary.active,
html[data-theme="dark"] .btn-secondary.show {
	background-color: #3a4048;
	border-color: #5a616b;
	color: #fff;
}

/* Dropdowns / Typeahead */
html[data-theme="dark"] .dropdown-menu {
	background-color: #26292e;
	border-color: #3a3f46;
	box-shadow: 0 6px 12px rgba(0,0,0,.45);
}
html[data-theme="dark"] .dropdown-menu > li > a {
	color: #cfd3d8;
}
html[data-theme="dark"] .dropdown-menu > li > a:hover,
html[data-theme="dark"] .dropdown-menu > li > a:focus {
	background-color: #2f353c;
	color: #fff;
}
html[data-theme="dark"] .dropdown-menu .divider {
	background-color: #3a3f46;
}

/* Nav-Tabs */
html[data-theme="dark"] .nav-tabs {
	border-bottom-color: #3a3f46;
}
html[data-theme="dark"] .nav-tabs .nav-link {
	color: #cfd3d8;
}
html[data-theme="dark"] .nav-tabs .nav-link:hover {
	background-color: #2a2f36;
	border-color: #3a3f46 #3a3f46 #3a3f46;
	color: #fff;
}
html[data-theme="dark"] .nav-tabs .nav-link.active,
html[data-theme="dark"] .nav-tabs .nav-link.active:hover,
html[data-theme="dark"] .nav-tabs .nav-link.active:focus {
	background-color: #1a1d21;
	border-color: #3a3f46 #3a3f46 transparent;
	color: #cfd3d8;
}

/* List-Groups */
html[data-theme="dark"] .list-group-item {
	background-color: #23272d;
	border-color: #3a3f46;
	color: #cfd3d8;
}

/* Modals */
html[data-theme="dark"] .modal-content {
	background-color: #23272d;
	border-color: #3a3f46;
	box-shadow: 0 5px 15px rgba(0,0,0,.6);
}
html[data-theme="dark"] .modal-header {
	border-bottom-color: #3a3f46;
}
html[data-theme="dark"] .modal-footer {
	border-top-color: #3a3f46;
}
html[data-theme="dark"] .close {
	color: #e2e5e9;
	text-shadow: 0 1px 0 #000;
	opacity: .6;
}
html[data-theme="dark"] .close:hover,
html[data-theme="dark"] .close:focus {
	color: #fff;
	opacity: 1;
}

/* Code */
html[data-theme="dark"] code {
	background-color: #2b1216;
	color: #ff9aa2;
}
html[data-theme="dark"] pre {
	background-color: #202429;
	border-color: #3a3f46;
	color: #cfd3d8;
}

/* Alerts: gedaempfte, dunkle Varianten statt greller Pastellflaechen.
   Ohne Hintergrundbild bleibt die jeweilige dunkle Hintergrundfarbe sichtbar.
   Gilt auch fuer als Zell-/Zeilen-Markierung genutzte .alert-*-Klassen. */
html[data-theme="dark"] .alert-success {
	background-color: #16321f;
	background-image: none;
	border-color: #245231;
	color: #b6e0bf;
}
html[data-theme="dark"] .alert-info {
	background-color: #16323a;
	background-image: none;
	border-color: #22525f;
	color: #a9dbe6;
}
html[data-theme="dark"] .alert-warning {
	background-color: #3d3417;
	background-image: none;
	border-color: #6b5a1f;
	color: #ecd591;
}
html[data-theme="dark"] .alert-danger {
	background-color: #3b1a1e;
	background-image: none;
	border-color: #642a30;
	color: #f0b3b8;
}

/* Farbige Tabellenzeilen (Status-Hervorhebung in Rechnungs-/Listenansichten).
   Verwendet werden .alert-* sowie die Bootstrap-Kontextklassen auf <tr>.
   Hintergrund direkt auf die Zellen (td/th) + !important, damit die
   .table-striped-Regeln nicht gewinnen; Text hell fuer Lesbarkeit. */
html[data-theme="dark"] .table > tbody > tr.alert-success > td,
html[data-theme="dark"] .table > tbody > tr.alert-success > th,
html[data-theme="dark"] .table > tbody > tr.success > td,
html[data-theme="dark"] .table > tbody > tr.success > th {
	background-color: #17321e !important;
	color: #cbe6d1;
}
html[data-theme="dark"] .table > tbody > tr.alert-warning > td,
html[data-theme="dark"] .table > tbody > tr.alert-warning > th,
html[data-theme="dark"] .table > tbody > tr.warning > td,
html[data-theme="dark"] .table > tbody > tr.warning > th {
	background-color: #38300f !important;
	color: #ecd591;
}
html[data-theme="dark"] .table > tbody > tr.alert-danger > td,
html[data-theme="dark"] .table > tbody > tr.alert-danger > th,
html[data-theme="dark"] .table > tbody > tr.danger > td,
html[data-theme="dark"] .table > tbody > tr.danger > th {
	background-color: #381a1d !important;
	color: #f0b3b8;
}
html[data-theme="dark"] .table > tbody > tr.alert-info > td,
html[data-theme="dark"] .table > tbody > tr.alert-info > th,
html[data-theme="dark"] .table > tbody > tr.info > td,
html[data-theme="dark"] .table > tbody > tr.info > th {
	background-color: #14313a !important;
	color: #a9dbe6;
}
html[data-theme="dark"] .table > tbody > tr.active > td,
html[data-theme="dark"] .table > tbody > tr.active > th {
	background-color: #2a2f36 !important;
	color: #cfd3d8;
}

/* Links in farbigen Zeilen an die jeweilige Tonalitaet anpassen */
html[data-theme="dark"] .table > tbody > tr.alert-success a:not(.btn),
html[data-theme="dark"] .table > tbody > tr.success a:not(.btn) { color: #8fd6a2; }
html[data-theme="dark"] .table > tbody > tr.alert-warning a:not(.btn),
html[data-theme="dark"] .table > tbody > tr.warning a:not(.btn) { color: #e8c85f; }
html[data-theme="dark"] .table > tbody > tr.alert-danger a:not(.btn),
html[data-theme="dark"] .table > tbody > tr.danger a:not(.btn) { color: #f2a6ae; }
html[data-theme="dark"] .table > tbody > tr.alert-info a:not(.btn),
html[data-theme="dark"] .table > tbody > tr.info a:not(.btn) { color: #7ecfe0; }

/* Bootstrap-Datepicker Dropdown */
html[data-theme="dark"] .datepicker.dropdown-menu {
	background-color: #26292e;
	border-color: #3a3f46;
	color: #cfd3d8;
}
html[data-theme="dark"] .datepicker table tr td,
html[data-theme="dark"] .datepicker table tr th {
	color: #cfd3d8;
}
html[data-theme="dark"] .datepicker table tr td.day:hover,
html[data-theme="dark"] .datepicker table tr td.focused {
	background-color: #3a4048;
}
html[data-theme="dark"] .datepicker table tr td.old,
html[data-theme="dark"] .datepicker table tr td.new {
	color: #777c83;
}
html[data-theme="dark"] .datepicker table tr td.disabled,
html[data-theme="dark"] .datepicker table tr td.disabled:hover {
	color: #555b62;
}
html[data-theme="dark"] .datepicker .datepicker-switch:hover,
html[data-theme="dark"] .datepicker .prev:hover,
html[data-theme="dark"] .datepicker .next:hover {
	background-color: #3a4048;
}

/* Wells/Borders im Login-Formular */
html[data-theme="dark"] .form-signin {
	color: #cfd3d8;
}

html[data-theme="dark"] .login-copyright {
	color: #98a2ad;
}