:root {
    --bg: #0b1220;
    --bg-accent: #0f1a2d;
    --surface: #111a2a;
    --surface-2: #162236;
    --border: #2a3a56;
    --text: #eaf0ff;
    --muted: #9fb0d0;
    --link: #9ed0ff;
    --link-hover: #d3e9ff;
    --btn: #2f72d8;
    --btn-hover: #255fb5;
    --success: #68d59f;
    --error: #ff9090;
}

body.theme-light {
    --bg: #eef3fb;
    --bg-accent: #e5edf8;
    --surface: #ffffff;
    --surface-2: #f3f7fd;
    --border: #cbd8ee;
    --text: #0f213c;
    --muted: #466086;
    --link: #1d5fb8;
    --link-hover: #0d4ea8;
    --btn: #2f72d8;
    --btn-hover: #255fb5;
    --success: #1f7a54;
    --error: #a43737;
}

* {
    box-sizing: border-box;
}

html,
body {
    margin: 0;
    padding: 0;
}

body {
    font-family: "Segoe UI", "Noto Sans", Arial, sans-serif;
    color: var(--text);
    line-height: 1.5;
    background:
        radial-gradient(1200px 700px at -10% -10%, #1b355f 0%, transparent 55%),
        radial-gradient(1200px 700px at 110% 10%, #173452 0%, transparent 50%),
        linear-gradient(160deg, var(--bg) 0%, var(--bg-accent) 100%);
    min-height: 100vh;
}

body.theme-light {
    background:
        radial-gradient(1200px 700px at -10% -10%, #d8e6fa 0%, transparent 55%),
        radial-gradient(1200px 700px at 110% 10%, #d6e7fb 0%, transparent 50%),
        linear-gradient(160deg, var(--bg) 0%, var(--bg-accent) 100%);
}

header {
    position: sticky;
    top: 0;
    z-index: 20;
    backdrop-filter: blur(8px);
    background: rgba(8, 14, 24, 0.82);
    border-bottom: 1px solid var(--border);
    padding: 12px 18px;
}

body.theme-light header {
    background: rgba(239, 245, 255, 0.92);
}

main {
    width: min(1180px, calc(100% - 24px));
    margin: 18px auto 28px;
    padding: 18px;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: linear-gradient(180deg, rgba(17, 26, 42, 0.95) 0%, rgba(15, 23, 37, 0.95) 100%);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.35);
}

body.theme-light main {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.97) 0%, rgba(245, 250, 255, 0.97) 100%);
    box-shadow: 0 12px 28px rgba(39, 74, 126, 0.12);
}

h1,
h2,
h3,
h4 {
    margin: 0 0 10px;
    line-height: 1.25;
    color: #f4f8ff;
}

p,
ul,
ol,
table,
form,
section {
    margin-top: 0;
    margin-bottom: 12px;
}

/* Beseitigt schlecht lesbare, inline gesetzte Standard-Blautoene */
a,
a:visited {
    color: var(--link) !important;
    text-decoration-color: rgba(158, 208, 255, 0.45);
}

a:hover,
a:focus-visible {
    color: var(--link-hover) !important;
    text-decoration-color: rgba(211, 233, 255, 0.95);
}

/* Einheitlicher, sichtbarer Tastaturfokus für Links, Formulare, Details und Buttons */
:where(a, button, .btn, input, select, textarea, summary, [tabindex]):focus-visible {
    outline: 3px solid #8cc8ff;
    outline-offset: 2px;
    box-shadow: 0 0 0 4px rgba(14, 25, 42, 0.55);
}

body.theme-light :where(a, button, .btn, input, select, textarea, summary, [tabindex]):focus-visible {
    outline-color: #1d5fb8;
    box-shadow: 0 0 0 4px rgba(221, 233, 251, 0.95);
}

.fancy-check:focus-within {
    outline: 3px solid #8cc8ff;
    outline-offset: 2px;
}

body.theme-light .fancy-check:focus-within {
    outline-color: #1d5fb8;
}

a[style*="color:inherit"],
a[style*="color: inherit"] {
    color: inherit !important;
}

nav ul {
    list-style: none;
    margin: 10px 0 0;
    padding: 0;
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

nav li {
    margin: 0;
}

.nav-item-right {
    margin-left: auto;
}

nav a {
    display: inline-block;
    padding: 6px 10px;
    border-radius: 999px;
    border: 1px solid #35517f;
    background: #15253d;
    text-decoration: none;
    font-size: 0.93rem;
}

.box,
.card,
.card-pw,
section,
article,
details.task {
    border: 1px solid var(--border);
    border-radius: 10px;
    background: #0f1828;
}

.box,
.card,
.card-pw {
    padding: 18px;
}

label {
    display: block;
    margin-bottom: 10px;
    font-weight: 550;
}

input:not([type="checkbox"]):not([type="radio"]),
textarea,
select {
    width: 100% !important;
    margin-top: 6px;
    padding: 9px 10px !important;
    border-radius: 8px !important;
    border: 1px solid #334665 !important;
    background: #0c1524 !important;
    color: var(--text) !important;
}

input:focus,
textarea:focus,
select:focus {
    outline: none;
    border-color: #5f84c3;
    box-shadow: 0 0 0 3px rgba(95, 132, 195, 0.18);
}

input[readonly]:not([type="checkbox"]):not([type="radio"]),
textarea[readonly],
select:disabled,
input:disabled:not([type="checkbox"]):not([type="radio"]),
textarea:disabled {
    border-color: #5a6a89 !important;
    background: repeating-linear-gradient(
        -45deg,
        #1a2335,
        #1a2335 8px,
        #182131 8px,
        #182131 16px
    ) !important;
    color: #c3d1ec !important;
    cursor: not-allowed;
}

textarea {
    resize: vertical;
    min-height: 90px;
}

button,
.btn {
    display: inline-block;
    border: 1px solid #4884de !important;
    background: linear-gradient(180deg, #3e80de 0%, var(--btn) 100%) !important;
    color: #ffffff !important;
    border-radius: 8px !important;
    padding: 9px 14px !important;
    font-weight: 650;
    text-decoration: none;
    cursor: pointer;
}

a.btn,
a.btn:visited {
    color: #ffffff !important;
    text-decoration: none;
}

button:hover,
.btn:hover {
    background: linear-gradient(180deg, #356fc2 0%, var(--btn-hover) 100%);
}

table {
    width: 100%;
    border-collapse: collapse;
    border: 1px solid var(--border);
    background: #0f1828;
}

th,
td {
    border: 1px solid var(--border);
    padding: 8px 10px;
    text-align: left;
}

th {
    background: #16243a;
    color: #dce8ff;
}

details.task {
    margin-bottom: 10px;
    overflow: hidden;
}

details.task summary {
    list-style: none;
    cursor: pointer;
    padding: 10px 12px;
    background: #15233a;
}

details.task summary::-webkit-details-marker {
    display: none;
}

.task-open summary {
    color: #d8e7ff;
}

.task-ok summary {
    background: #183127;
    color: #9be1bc;
}

.task-warn summary {
    background: #3a2b13;
    color: #ffdca5;
}

.task-bad summary {
    background: #402020;
    color: #ffc3c3;
}

.task-body {
    padding: 12px;
    border-top: 1px solid var(--border);
    background: #0d1524;
}

.protokoll-legend {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin: 0 0 12px 0;
}

.legend-pill {
    border-radius: 999px;
    padding: 2px 10px;
    font-size: 12px;
    border: 1px solid transparent;
}

.legend-pill--ok {
    background: #103425;
    border-color: #1f7a54;
    color: #b8f2d7;
}

.legend-pill--warn {
    background: #3d2d12;
    border-color: #8a6328;
    color: #ffe4b8;
}

.legend-pill--bad {
    background: #3b1a1a;
    border-color: #8e3535;
    color: #ffcaca;
}

.status-choices {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.status-choice {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border-radius: 999px;
    border: 1px solid #36445f;
    padding: 5px 10px;
    cursor: pointer;
}

.status-choice--ok {
    background: #122e24;
    border-color: #1f7a54;
    color: #b8f2d7;
}

.status-choice--warn {
    background: #38290f;
    border-color: #8a6328;
    color: #ffe4b8;
}

.status-choice--bad {
    background: #3a1919;
    border-color: #8e3535;
    color: #ffcaca;
}

.notice {
    border-radius: 8px;
    padding: 8px 10px;
    border: 1px solid var(--border);
}

.notice.success {
    background: #193126;
    border-color: #2b7d55;
    color: var(--success);
}

.notice.error {
    background: #3d1d1d;
    border-color: #8c3a3a;
    color: var(--error);
}

.empty-state {
    margin: 0;
    padding: 10px 12px;
    border: 1px dashed var(--border);
    border-radius: 8px;
    background: var(--surface-2);
    color: var(--muted);
}

.response {
    max-width: 720px;
    margin: 70px auto;
}

.inline-fields {
    display: flex;
    align-items: flex-end;
    gap: 12px;
    flex-wrap: wrap;
}

.inline-fields .grow {
    flex: 1 1 180px;
    margin-bottom: 0;
}

.inline-fields .tight {
    margin-bottom: 0;
}

.fancy-check {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    user-select: none;
    border-radius: 999px;
    border: 1px solid #2d3550;
    background: linear-gradient(135deg, #121826 0%, #1b253b 100%);
    color: #dce7ff;
    padding: 8px 12px;
    margin-top: 6px;
}

.fancy-check input[type="checkbox"] {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.fancy-check__mark {
    width: 20px;
    height: 20px;
    border-radius: 6px;
    border: 1px solid #4f80ff;
    background: #0d1424;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
    color: #fff;
    font-size: 13px;
    line-height: 1;
}

.fancy-check input[type="checkbox"]:checked + .fancy-check__mark {
    background: #4f80ff;
    border-color: #9cb9ff;
    box-shadow: 0 0 0 2px rgba(79, 128, 255, 0.25);
}

.fancy-check input[type="checkbox"]:checked + .fancy-check__mark::before {
    content: "\2713";
}

.fancy-check--warn {
    border-color: #5b4320;
    background: linear-gradient(135deg, #20170d 0%, #3a2710 100%);
    color: #ffe6bf;
}

.fancy-check--warn .fancy-check__mark {
    border-color: #f6ad3f;
}

.fancy-check--warn input[type="checkbox"]:checked + .fancy-check__mark {
    background: #f6ad3f;
    border-color: #ffd28a;
    box-shadow: 0 0 0 2px rgba(246, 173, 63, 0.25);
}

.fancy-check--photo {
    border-color: #1f5f4f;
    background: linear-gradient(135deg, #0d1d19 0%, #14342b 100%);
    color: #c9ffef;
}

.fancy-check--photo .fancy-check__mark {
    border-color: #2ecc71;
}

.fancy-check--photo input[type="checkbox"]:checked + .fancy-check__mark {
    background: #2ecc71;
    border-color: #7af0ad;
    box-shadow: 0 0 0 2px rgba(46, 204, 113, 0.25);
}

.dashboard-switch {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 12px;
}

.dashboard-chip {
    display: inline-block;
    padding: 6px 12px;
    border-radius: 999px;
    border: 1px solid #35517f;
    background: #15253d;
    text-decoration: none;
}

.dashboard-chip.is-active {
    border-color: #5f84c3;
    background: #1d3558;
}

.dashboard-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 10px;
}

.dash-card {
    padding: 12px;
}

.dash-card h3 {
    margin-bottom: 8px;
}

.dash-card ul {
    padding-left: 18px;
    margin: 0;
}

.dash-card li + li {
    margin-top: 6px;
}

.dash-card small {
    display: block;
    opacity: 0.8;
}

.dash-card--warn {
    border-color: #8e3535;
    background: #241316;
}

body.theme-light h1,
body.theme-light h2,
body.theme-light h3,
body.theme-light h4 {
    color: #0c213d;
}

body.theme-light .box,
body.theme-light .card,
body.theme-light .card-pw,
body.theme-light section,
body.theme-light article,
body.theme-light details.task,
body.theme-light table,
body.theme-light .task-body {
    background: #f7faff;
}

body.theme-light nav a,
body.theme-light .dashboard-chip {
    background: #e9f1ff;
    border-color: #94b3e8;
    color: #1b4f99 !important;
}

body.theme-light .dash-card--warn {
    background: #fff3f3;
    border-color: #e7b1b1;
}

body.theme-light .notice {
    background: #eef4ff;
    border-color: #b9ccef;
    color: #183860;
}

body.theme-light .notice.success {
    background: #edf9f1;
    border-color: #9fd8b4;
    color: #1e5f3e;
}

body.theme-light .notice.error {
    background: #fff3f3;
    border-color: #e7b1b1;
    color: #7a2222;
}

body.theme-light input:not([type="checkbox"]):not([type="radio"]),
body.theme-light textarea,
body.theme-light select {
    border-color: #9fb7df !important;
    background: #ffffff !important;
    color: #0f213c !important;
}

body.theme-light input[readonly]:not([type="checkbox"]):not([type="radio"]),
body.theme-light textarea[readonly],
body.theme-light select:disabled,
body.theme-light input:disabled:not([type="checkbox"]):not([type="radio"]),
body.theme-light textarea:disabled {
    border-color: #8ea6ce !important;
    background: repeating-linear-gradient(
        -45deg,
        #e7eef9,
        #e7eef9 8px,
        #dde8f8 8px,
        #dde8f8 16px
    ) !important;
    color: #304d77 !important;
}

body.theme-light input:focus,
body.theme-light textarea:focus,
body.theme-light select:focus {
    border-color: #4f80d9 !important;
    box-shadow: 0 0 0 3px rgba(79, 128, 217, 0.2);
}

@media (max-width: 760px) {
    main {
        width: calc(100% - 12px);
        margin-top: 10px;
        padding: 12px;
        border-radius: 10px;
    }

    header {
        padding: 10px 12px;
    }

    button,
    .btn {
        width: 100%;
    }

    .nav-item-right {
        margin-left: 0;
    }
}

/* UI-Konsolidierung: ausgelagerte ehemalige Inline-Styles */
.ui-cons-001 { border:1px solid #2f3442; border-radius:8px; padding:10px; background:#0d111a; display:flex; gap:10px; flex-wrap:wrap; align-items:center; justify-content:space-between; }
.ui-cons-002 { border:1px solid #2f3442; border-radius:8px; padding:12px; }
.ui-cons-003 { border:1px solid #2f3442; border-radius:8px; padding:12px; margin-bottom:12px; }
.ui-cons-004 { border:1px solid #2f3442; border-radius:8px; padding:8px 10px; background:#0c0f16; }
.ui-cons-005 { border:1px solid #2f3442; border-radius:8px; padding:8px; background:#0d111a; }
.ui-cons-006 { border:1px solid #2f3442; border-radius:8px; padding:8px; background:rgba(0,0,0,0.15); display:grid; gap:6px; }
.ui-cons-007 { border:1px solid #333; border-radius:8px; padding:12px; }
.ui-cons-008 { border:1px solid #333; border-radius:8px; padding:12px; margin-bottom:12px; }
.ui-cons-009 { border:1px solid #333; border-radius:8px; padding:12px; margin-top:12px; }
.ui-cons-010 { border:1px solid #b8891a; border-radius:8px; padding:8px; background:#3f2f10; color:#ffe7a8; }
.ui-cons-011 { border:1px solid var(--border); border-radius:8px; padding:12px; display:flex; align-items:flex-start; gap:10px; background:var(--surface); }
.ui-cons-012 { border:1px solid var(--border); padding:15px; border-radius:8px; background:var(--surface); }
.ui-cons-013 { cursor:pointer; }
.ui-cons-014 { cursor:pointer; color:#aab3c7; }
.ui-cons-015 { cursor:pointer; display:flex; justify-content:space-between; gap:8px; align-items:flex-start; flex-wrap:wrap; }
.ui-cons-016 { cursor:pointer; display:flex; justify-content:space-between; gap:8px; flex-wrap:wrap; align-items:center; }
.ui-cons-017 { display:block; }
.ui-cons-018 { display:block; margin-bottom:6px; }
.ui-cons-019 { display:block; margin-top:2px; }
.ui-cons-020 { display:block; margin-top:2px; opacity:.9; }
.ui-cons-021 { display:block; margin-top:6px; }
.ui-cons-022 { display:block; margin-top:6px; opacity:.8; }
.ui-cons-023 { display:flex; flex-direction:column; gap:15px; }
.ui-cons-024 { display:flex; flex-wrap:wrap; gap:6px; }
.ui-cons-025 { display:flex; flex-wrap:wrap; gap:8px; justify-content:space-between; align-items:flex-start; }
.ui-cons-026 { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:8px; }
.ui-cons-027 { display:flex; gap:10px; flex-wrap:wrap; align-items:end; }
.ui-cons-028 { display:flex; gap:6px; align-items:center; flex-wrap:wrap; }
.ui-cons-029 { display:flex; gap:6px; align-items:flex-start; }
.ui-cons-030 { display:flex; gap:6px; align-items:flex-start; flex-wrap:wrap; }
.ui-cons-031 { display:flex; gap:6px; flex-wrap:wrap; }
.ui-cons-032 { display:flex; gap:6px; flex-wrap:wrap; justify-content:flex-end; }
.ui-cons-033 { display:flex; gap:6px; flex-wrap:wrap; margin-bottom:8px; }
.ui-cons-034 { display:flex; gap:6px; flex-wrap:wrap; margin-top:6px; }
.ui-cons-035 { display:flex; gap:8px; flex-wrap:wrap; }
.ui-cons-036 { display:flex; gap:8px; flex-wrap:wrap; margin:0 0 8px 0; }
.ui-cons-037 { display:flex; gap:8px; flex-wrap:wrap; margin:8px 0 12px; }
.ui-cons-038 { display:flex; gap:8px; flex-wrap:wrap; margin-top:8px; }
.ui-cons-039 { display:flex; justify-content:space-between; gap:8px; flex-wrap:wrap; }
.ui-cons-040 { display:flex; justify-content:space-between; gap:8px; flex-wrap:wrap; align-items:center; }
.ui-cons-041 { display:flex; justify-content:space-between; gap:8px; flex-wrap:wrap; align-items:flex-start; }
.ui-cons-042 { display:grid; gap:6px; }
.ui-cons-043 { display:grid; gap:6px; margin-bottom:10px; }
.ui-cons-044 { display:grid; gap:8px; }
.ui-cons-045 { display:grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap:12px; }
.ui-cons-046 { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:12px; }
.ui-cons-047 { display:inline; }
.ui-cons-048 { display:inline-block; margin-left:6px; }
.ui-cons-049 { display:inline-block; padding:7px 10px; border:1px solid #3f4a6a; border-radius:6px; text-decoration:none; background:#2a3144; color:#dbe4ff; }
.ui-cons-050 { display:inline-block; padding:7px 10px; border:1px solid #8a6328; border-radius:6px; text-decoration:none; background:#3d2d12; color:#ffe4b8; }
.ui-cons-051 { display:none; }
.ui-cons-052 { flex-grow:1; }
.ui-cons-053 { font-size:13px; }
.ui-cons-054 { font-weight:600; }
.ui-cons-055 { list-style:none; margin:0; padding:0; display:grid; gap:8px; }
.ui-cons-056 { list-style:none; padding:0; margin:0 0 8px 0; display:grid; gap:8px; }
.ui-cons-057 { list-style:none; padding:0; margin:0; display:grid; gap:8px; }
.ui-cons-058 { margin:0 0 8px 0; }
.ui-cons-059 { margin:0; }
.ui-cons-060 { margin:0; opacity:.85; }
.ui-cons-061 { margin:0; padding-left:18px; }
.ui-cons-062 { margin:10px 0 0 0; }
.ui-cons-063 { margin:12px 0 6px 0; }
.ui-cons-064 { margin:8px 0 0 0; }
.ui-cons-065 { margin:8px 0 0 0; display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.ui-cons-066 { margin:8px 0; }
.ui-cons-067 { margin-bottom:12px; }
.ui-cons-068 { margin-top:10px; }
.ui-cons-069 { margin-top:10px; border:1px solid #2f3442; border-radius:8px; background:#10131b; }
.ui-cons-070 { margin-top:10px; display:flex; gap:8px; flex-wrap:wrap; align-items:flex-end; }
.ui-cons-071 { margin-top:10px; display:grid; gap:8px; }
.ui-cons-072 { margin-top:12px; border:1px solid #333; border-radius:8px; padding:12px; }
.ui-cons-073 { margin-top:12px; border:1px solid var(--border); border-radius:8px; padding:12px; }
.ui-cons-074 { margin-top:4px; }
.ui-cons-075 { margin-top:6px; }
.ui-cons-076 { margin-top:6px; opacity:.9; }
.ui-cons-077 { margin-top:6px; white-space:pre-wrap; }
.ui-cons-078 { margin-top:8px; }
.ui-cons-079 { margin-top:8px; display:flex; justify-content:space-between; gap:8px; flex-wrap:wrap; align-items:flex-start; }
.ui-cons-080 { margin-top:8px; display:grid; gap:8px; }
.ui-cons-081 { min-width:110px; }
.ui-cons-082 { min-width:140px; }
.ui-cons-083 { min-width:180px; }
.ui-cons-084 { opacity:.7; }
.ui-cons-085 { opacity:.8; }
.ui-cons-086 { padding:10px 12px; border-top:1px solid #2a2f3b; }
.ui-cons-087 { padding:10px 12px; cursor:pointer; display:flex; flex-wrap:wrap; gap:8px; justify-content:space-between; align-items:center; }
.ui-cons-088 { padding:2px 8px; }
.ui-cons-089 { padding:2px 8px; border-radius:999px; border:1px solid #1f7a54; background:#103425; color:#b8f2d7; font-size:12px; }
.ui-cons-090 { padding:2px 8px; border-radius:999px; border:1px solid #3f4a6a; background:#2a3144; color:#dbe4ff; font-size:12px; }
.ui-cons-091 { padding:2px 8px; border-radius:999px; border:1px solid #4f586c; background:#2b313d; color:#b8c2d8; font-size:12px; }
.ui-cons-092 { padding:2px 8px; border-radius:999px; border:1px solid #8a6328; background:#3d2d12; color:#ffe4b8; font-size:12px; }
.ui-cons-093 { padding:2px 8px; border-radius:999px; border:1px solid #8e3535; background:#3b1a1a; color:#ffcaca; font-size:12px; }
.ui-cons-094 { padding:2px 8px; border-radius:999px; border:1px solid #b8891a; background:#4d3a0f; color:#ffe7a8; font-size:12px; }
.ui-cons-095 { padding:2px 8px; border-radius:999px; border:1px solid var(--border); background:var(--surface-2); color:var(--text); font-size:12px; }
.ui-cons-096 { padding:2px 8px; border-radius:999px; font-size:12px; border:1px solid #b8891a; background:#4d3a0f; color:#ffe7a8; }
.ui-cons-097 { padding:8px; border:1px solid #2f7a2f; background:#123012; color:#b8f0b8; border-radius:6px; }
.ui-cons-098 { padding:8px; border:1px solid #7a2f2f; background:#301212; color:#ffbcbc; border-radius:6px; }
.ui-cons-099 { width:100%; }
.ui-cons-100 { width:100%; height:70vh; border:1px solid #2f3442; border-radius:6px; background:#fff; }
.ui-cons-101 { width:100%; margin-top:6px; }
.ui-cons-102 { width:120px; max-width:100%; height:90px; object-fit:cover; border-radius:8px; border:1px solid #3a4256; }
.ui-cons-103 { width:120px; max-width:100%; height:90px; object-fit:cover; border-radius:8px; border:1px solid #3a4256; cursor:zoom-in; transition:all .2s ease; }
.ui-cons-104 { width:120px; max-width:100%; height:90px; object-fit:cover; border-radius:8px; border:1px solid var(--border); }

/* UI-Konsolidierung: semantische Wiederverwendungs-Klassen */
.link-strong { font-weight: 600; }

.ol-card {
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 8px;
    background: var(--surface);
    color: var(--text);
}
.ol-card--important {
    border-color: #b8891a;
    background: #4d3a0f;
    color: #ffe7a8;
}
.ol-card--overdue {
    border-color: #b8891a;
    background: #4d3a0f;
    color: #ffe7a8;
}
.ol-card--missing-date {
    border-color: #b04a4a;
    background: #3b1a1a;
    color: #ffcaca;
}

.entry-card {
    border: 1px solid #2f3442;
    border-radius: 8px;
    padding: 8px;
    background: #0d111a;
}
.entry-card--important {
    border-color: #b8891a;
    background: #4d3a0f;
    color: #ffe7a8;
}
.entry-card--done {
    border-color: #3a3f4c;
    background: #1c212b;
    color: #9098a8;
}

.status-btn-important.is-active {
    border-color: #f0a500 !important;
    background: #5a3d05 !important;
    color: #ffd98a !important;
}
.status-btn-done.is-active {
    border-color: #2f7a2f !important;
    background: #123012 !important;
    color: #b8f0b8 !important;
}

.photo-thumb {
    width: 120px;
    max-width: 100%;
    height: 90px;
    object-fit: cover;
    border-radius: 8px;
    border: 1px solid #3a4256;
}
.photo-thumb--zoomable {
    cursor: zoom-in;
    transition: all 0.2s ease;
}
.photo-thumb--border-var {
    border-color: var(--border);
}

.inline-form { display: inline; }
.m0 { margin: 0; }

.quick-link {
    display: inline-block;
    padding: 7px 10px;
    border: 1px solid #3f4a6a;
    border-radius: 6px;
    text-decoration: none;
    background: #2a3144;
    color: #dbe4ff !important;
}
.quick-link--customer {
    border-color: #8a6328;
    background: #3d2d12;
    color: #ffe4b8 !important;
}

.status-chip,
.status-action {
    display: inline-block;
    border-radius: 999px;
    border: 1px solid #3f4a6a;
    background: #2a3144;
    color: #dbe4ff;
    font-size: 12px;
    line-height: 1.2;
    padding: 2px 8px;
}

button.status-action {
    cursor: pointer;
}

.status-chip--important,
.status-action--important {
    border-color: #d09a2c;
    background: #5a3d05;
    color: #ffd98a;
}

.status-chip--done,
.status-action--done {
    border-color: #2f7a54;
    background: #123012;
    color: #b8f0b8;
}

.status-chip--attention,
.status-action--attention {
    border-color: #b8891a;
    background: #4d3a0f;
    color: #ffe7a8;
}

.status-chip--photo-required,
.status-action--photo-required {
    border-color: #8a6328;
    background: #3d2d12;
    color: #ffe4b8;
}

.status-chip--neutral,
.status-action--neutral {
    border-color: #4f586c;
    background: #2b313d;
    color: #b8c2d8;
}

.status-action:not(.is-active) {
    opacity: 0.92;
}

.status-action.is-active {
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.15);
}

.status-pill {
    display: inline-block;
    border-radius: 999px;
    font-size: 12px;
    padding: 2px 8px;
}
.status-pill--neutral {
    background: #2a3144;
    border: 1px solid #3f4a6a;
    color: #dbe4ff;
    padding: 3px 10px;
    font-weight: 600;
}
.status-pill--detail-neutral {
    background: #1b2234;
    border: 1px solid #36456d;
    color: #dbe4ff;
}
.status-pill--ok {
    background: #103425;
    border: 1px solid #1f7a54;
    color: #b8f2d7;
}
.status-pill--warn {
    background: #3d2d12;
    border: 1px solid #8a6328;
    color: #ffe4b8;
}
.status-pill--bad {
    background: #3b1a1a;
    border: 1px solid #8e3535;
    color: #ffcaca;
}

.icon-star-btn {
    padding: 2px 8px !important;
}

.objekt-memo-card {
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 8px;
    background: var(--surface);
}
.objekt-memo-card--important {
    border-color: #b8891a;
    background: #4d3a0f;
    color: #ffe7a8;
}
.objekt-memo-card--done {
    background: var(--surface-2);
    color: var(--muted);
}

.memo-state-btn.is-important {
    border-color: #d09a2c !important;
}
.memo-state-btn.is-done {
    border-color: #2f7a54 !important;
}

.color-dot-30 {
    display: inline-block;
    width: 30px;
    height: 30px;
    border-radius: 50%;
}
.color-dot-20 {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    flex-shrink: 0;
}

/* GUI-Vereinheitlichung: gemeinsame Karten-, Listen- und Details-Patterns */
.dash-card,
.ui-cons-003,
.ui-cons-007,
.ui-cons-072,
.ui-cons-073,
.ui-cons-012 {
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 12px;
    background: var(--surface);
}

.dash-card h3,
.ui-cons-003 > h3,
.ui-cons-007 > h3,
.ui-cons-072 > h3,
.ui-cons-073 > h3,
.ui-cons-012 > h3 {
    margin: 0 0 8px 0;
    font-size: 1.05rem;
}

.ui-cons-063 {
    margin: 12px 0 8px 0;
    font-size: 0.98rem;
}

.dash-card ul,
.ui-cons-055,
.ui-cons-056,
.ui-cons-057 {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 8px;
}

.ui-cons-004,
.ui-cons-005,
.ol-card,
.entry-card,
.objekt-memo-card {
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 8px;
    background: var(--surface);
}

.protocol-details,
.ui-cons-062,
.ui-cons-069,
.objekt-memo-card > details {
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--surface-2);
    overflow: hidden;
}

.protocol-details > summary,
.ui-cons-062 > summary,
.ui-cons-069 > summary,
.objekt-memo-card > details > summary {
    padding: 10px 12px;
    border-bottom: 1px solid var(--border);
}

body.theme-light .ol-card--important,
body.theme-light .ol-card--overdue {
    background: #fff3cc;
    color: #6b4c15;
}
body.theme-light .ol-card--missing-date {
    background: #fdecec;
    color: #7a1f1f;
}

