/* Dark mode overrides aktiveres når har class="dark" (eller ) */
/* Basalt layout */
html.dark body,
body.dark {
background: #0b0f14;
color: #e6e7e9;
}
html.dark .container {
background: #12161c;
border-color: #1f2733;
}
/* Links */
html.dark a, html.dark a:visited { color: #8ab4ff; }
html.dark a:hover { color: #cfe1ff; text-decoration: underline; }
/* Header/nav */
html.dark #primary_nav_wrap { color: #e6e7e9; }
html.dark .burger-line { background-color: #e6e7e9; }
/* Topmenu + dropdowns */
html.dark li a, html.dark li a:visited {
background-color: #1b2230;
color: #e6e7e9;
}
html.dark li a:hover { background-color: #2b3547; }
html.dark #primary_nav_wrap ul { background-color: #1b2230; }
html.dark #primary_nav_wrap ul li a { border-bottom-color: #364152; }
html.dark #primary_nav_wrap ul li ul {
background-color: #1b2230;
border-radius: 5px;
}
/* Mobile menu */
@media (max-width: 768px) {
html.dark #primary_nav_wrap ul {
background-color: #1b2230;
}
html.dark #primary_nav_wrap ul li a {
border-bottom: 1px solid #364152;
}
}
/* Sideindhold */
html.dark #pageContent {
border: 1px dashed #2d3644;
}
/* Tabeller */
html.dark table { background: transparent; }
html.dark th, html.dark td { border-color: #2d3644; }
html.dark th {
background-color: #1e2633;
color: #e6e7e9;
}
html.dark tr { background-color: #0f1419; }
html.dark tr:nth-child(even) { background-color: #121923; }
/* Centrer/Right helpers */
html.dark .center { color: #e6e7e9; }
html.dark .right { color: #e6e7e9; }
/* Login + inputs */
html.dark .login-container {
background-color: #151a21;
color: #e6e7e9;
box-shadow: 0 4px 14px rgba(0,0,0,.4);
}
html.dark .headline { color: #e6e7e9; }
html.dark .input-group label { color: #cfd3da; }
html.dark .input-group input,
html.dark input[type="text"],
html.dark input[type="tel"],
html.dark input[type="number"],
html.dark input[type="password"] {
background: #0f1419;
color: #e6e7e9;
border: 1px solid #2d3644;
}
/* Knapper */
html.dark .login-button {
background-color: #2563eb;
color: #e6e7e9;
border: 1px solid #1e3a8a;
}
html.dark .login-button:hover { background-color: #1e40af; }
/* Produktliste + checkbokse */
html.dark .product-item {
background: #0f1419;
border: 1px solid #2d3644;
}
html.dark .product-item input[type="checkbox"] {
background: #0f1419;
border-color: #586372;
}
html.dark .product-item input[type="checkbox"]:checked {
background-color: #2563eb;
border-color: #2563eb;
}
html.dark .product-item input[type="checkbox"]:checked::after { color: #fff; }
html.dark .product-item span::before {
background-color: #0f1419;
border-color: #2d3644;
}
html.dark .product-item input[type="checkbox"]:checked + span::before {
background-color: #2563eb;
border-color: #2563eb;
color: #fff;
}
/* Board-kort */
html.dark .board-grid { /* grid er OK som i lys */ }
html.dark .board-card {
background-color: #141a22;
border: 1px solid #2d3644;
box-shadow: 0 2px 6px rgba(0,0,0,.4);
}
html.dark .board-card h2 { color: #e6e7e9; }
html.dark .status-free { color: #63d471; font-weight: 600; }
html.dark .status-occupied { color: #ff6b6b; font-weight: 600; }
html.dark .board-card.free { background-color: #000; }
html.dark .board-card.occupied { background-color: #201314; }
/* Navigation links under tabeller osv */
html.dark .navigation a {
color: #8ab4ff;
}
/* Excl. moms-grå */
html.dark .excl-vat { color: #9aa3ad; }
/* Datepicker smålabels */
html.dark .datepicker-label { color: #cfd3da; }
/* Modaler (Board Control m.fl.) overstyrer inline med !important */
html.dark .mm-modal { background: rgba(0,0,0,.6) !important; }
html.dark .mm-modal > div {
background: #151a21 !important;
color: #e6e7e9 !important;
}
html.dark input.login-input,
html.dark .mm-modal input.login-input {
background: #0f1419 !important;
color: #e6e7e9 !important;
border: 1px solid #2d3644 !important;
color-scheme: dark;
}
/* Små badges/strip (fx totaler) */
html.dark #grand_total_strip { color: #e6e7e9; }