/* Hintergrund: Leiterplatten-Motiv, Inhalt auf einer hellen Fläche darüber */
body {
    background: #f3f6f4 url("../img/hintergrund.svg") center / cover no-repeat fixed;
    min-height: 100vh;
}
.inhalt {
    background: rgba(255, 255, 255, 0.5);
    border-radius: .75rem;
    box-shadow: 0 2px 14px rgba(0, 0, 0, .06);
    padding: 1.5rem;
}
@media (max-width: 576px) {
    .inhalt { padding: 1rem .75rem; border-radius: .5rem; }
}

body { font-size: 0.95rem; }
.table td, .table th { vertical-align: middle; }
.wert { font-weight: 600; font-size: 1.05rem; white-space: nowrap; }
.mono { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; }
.klein { font-size: 0.82rem; color: var(--bs-secondary-color); }
.menge-form { display: inline-flex; gap: .25rem; align-items: center; }
.menge-form .btn { padding: 0 .45rem; line-height: 1.4; }
.filterleiste .form-control, .filterleiste .form-select { min-width: 9rem; }
.kachel { border: 1px solid var(--bs-border-color); border-radius: .5rem; padding: 1rem; height: 100%; }
.kachel .zahl { font-size: 1.8rem; font-weight: 700; }

/* Widerstand mit Farbringen */
.widerstand {
    position: relative;
    display: inline-flex;
    align-items: stretch;
    gap: 3px;
    height: 16px;
    margin: 0 14px;
    padding: 0 9px;
    background: #e9d9b7;
    border: 1px solid #c9b58c;
    border-radius: 8px;
    vertical-align: middle;
}
.widerstand::before,
.widerstand::after {
    content: "";
    position: absolute;
    top: 50%;
    width: 14px;
    height: 2px;
    margin-top: -1px;
    background: #9aa0a6;
}
.widerstand::before { left: -15px; }
.widerstand::after { right: -15px; }
.widerstand .ring {
    width: 5px;
    box-shadow: inset 0 0 0 0.5px rgba(0, 0, 0, .25);
}
.widerstand .ring.toleranz { margin-left: 7px; }

/* ---------------------------------------------------------------
   Dunkles Design (umschaltbar, Bootstrap data-bs-theme="dark")
   --------------------------------------------------------------- */
.symbol-hell { display: none; }
[data-bs-theme="dark"] .symbol-hell { display: inline; }
[data-bs-theme="dark"] .symbol-dunkel { display: none; }

[data-bs-theme="dark"] body {
    background: #111814 url("../img/hintergrund-dunkel.svg") center / cover no-repeat fixed;
}
[data-bs-theme="dark"] .inhalt {
    background: rgba(18, 24, 21, 0.5);
    box-shadow: 0 2px 18px rgba(0, 0, 0, .45);
}
[data-bs-theme="dark"] .table {
    --bs-table-bg: transparent;
}
[data-bs-theme="dark"] .navbar.bg-dark {
    background-color: #0b0f0d !important;
    border-bottom: 1px solid #1f2b25;
}
[data-bs-theme="dark"] .widerstand {
    background: #cdb98f;
    border-color: #a8956b;
}
[data-bs-theme="dark"] .widerstand::before,
[data-bs-theme="dark"] .widerstand::after {
    background: #7d8580;
}