
body{font:16px system-ui,sans-serif;margin:0;background:#f4f7fa;color:#173042}
header{background:#14364a;color:white;padding:1.2rem 5vw}header a{color:white;margin-right:1.2rem}
main{max-width:1100px;margin:2rem auto;padding:0 1rem}
section{background:white;padding:1.5rem;border-radius:12px;box-shadow:0 2px 12px #102e3d14}
a{color:#176e8a}table{width:100%;border-collapse:collapse}td,th{padding:.7rem;border-bottom:1px solid #dce5ea;text-align:left}
input,select{padding:.65rem;max-width:100%;border:1px solid #bbcbd3;border-radius:5px}
button,.button{display:inline-block;background:#176e8a;color:white;border:0;padding:.65rem .9rem;border-radius:6px;text-decoration:none;cursor:pointer}
form.inline{display:inline} .message{padding:.8rem;background:#e4f4ed;margin-bottom:.6rem}
@media(max-width:700px){table{display:block;overflow-x:auto}header a{display:inline-block;margin:.4rem}}

/* Paket 8.1: Responsive Grundlayout */
* { box-sizing: border-box; }
body { overflow-wrap: anywhere; }
header nav { display: flex; flex-wrap: wrap; gap: .5rem; }
header nav a { padding: .55rem .7rem; }
main { width: 100%; }
section { min-width: 0; }
table { width: 100%; }
button, .button, input, select {
    min-height: 44px;
}
button, .button { touch-action: manipulation; }

@media (max-width: 767px) {
    header { padding: 1rem; }
    header nav { margin: .8rem 0; }
    header nav a { margin: 0; }
    main { margin: 1rem auto; padding: 0 .7rem; }
    section { padding: 1rem; }
    table { display: block; overflow-x: auto; }
    th, td { white-space: nowrap; }
    input, select { width: 100%; }
}

@media (min-width: 768px) and (max-width: 1024px) {
    main { padding: 0 1.5rem; }
}

/* KLARLAGE_CI_85 */

/* KLARLAGE_CI_85 : CI-konformes Layout, bestehende Funktionen bleiben erhalten */
:root{--kl-anthrazit:#2C313A;--kl-rot:#D71920;--kl-silber:#7C828A;--kl-bg:#f4f5f7;--kl-border:#e0e3e7}
body{background:var(--kl-bg);color:var(--kl-anthrazit);font-family:system-ui,-apple-system,'Segoe UI',sans-serif}
header{background:var(--kl-anthrazit);border-bottom:4px solid var(--kl-rot);padding:1rem clamp(1rem,3vw,3rem)}
header strong{font-size:1.25rem;letter-spacing:-.02em}header nav{margin:.6rem 0;align-items:center}
header nav a{color:#f7f7f7;text-decoration:none;border-radius:7px;padding:.65rem .8rem}
header nav a:hover,header nav a:focus-visible{background:#ffffff22;text-decoration:underline}
header form{margin:.5rem 0 0}header select{background:#fff;color:var(--kl-anthrazit)}
main{max-width:1600px;margin:1.5rem auto;padding:0 clamp(.7rem,2vw,2rem)}
main>section{border:1px solid var(--kl-border);border-radius:14px;box-shadow:0 3px 16px #2c313a0a;padding:clamp(1rem,2vw,2rem)}
a{color:#8c141a}a:hover{text-decoration-thickness:2px}
button,.button{background:var(--kl-anthrazit);color:white;border-radius:8px;min-height:44px;font-weight:600}
button:hover,.button:hover{background:#444b57;color:white}
button:focus-visible,.button:focus-visible,a:focus-visible{outline:3px solid var(--kl-rot);outline-offset:2px}
input:focus,select:focus,textarea:focus{outline:2px solid var(--kl-rot);outline-offset:1px}
th{background:#f1f2f4;color:var(--kl-anthrazit);font-weight:700}
.kl-tabs{display:flex;gap:.5rem;flex-wrap:wrap;padding:.75rem 0;margin:1rem 0;border-bottom:1px solid var(--kl-border)}
.kl-tabs a{display:inline-block;padding:.65rem .9rem;color:var(--kl-anthrazit);text-decoration:none;border-radius:7px}
.kl-tabs a:hover,.kl-tabs a[aria-current='page']{background:#edf0f2;border-bottom:2px solid var(--kl-rot)}
.kl-planned{display:inline-flex;gap:.4rem;align-items:center;padding:.55rem .7rem;border:1px dashed #a8adb4;border-radius:7px;background:#f1f2f4;color:#7C828A;font-size:.88rem}
.kl-subtle{color:#626a74}.kl-pill{display:inline-block;background:#f1f2f4;border-radius:20px;padding:.35rem .7rem;font-size:.83rem}
.kl-hero{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:1rem}
.kl-hero h1{margin:.1rem 0 .4rem;font-size:clamp(1.4rem,2.5vw,2rem)}
.kl-facts{display:flex;flex-wrap:wrap;gap:1rem;margin:1rem 0}.kl-fact{min-width:140px;flex:1 1 140px;border-left:3px solid var(--kl-rot);padding:.3rem .8rem;background:#fafafa}.kl-fact span{display:block;color:#626a74;font-size:.79rem}.kl-fact b{display:block;margin-top:.3rem}
.kl-workspace{display:grid;grid-template-columns:minmax(210px,275px) minmax(0,1fr);gap:1rem}.kl-card{background:#fff;border:1px solid var(--kl-border);border-radius:12px;padding:1rem;margin-bottom:1rem}.kl-card h2,.kl-card h3{margin-top:0}.kl-actions{display:flex;gap:.6rem;flex-wrap:wrap;margin:.8rem 0}.kl-actions .button{font-size:.9rem}.kl-actions a{white-space:normal}
.kl-day{border:1px solid var(--kl-border);border-radius:10px;margin:1rem 0;overflow:hidden}.kl-day>summary{cursor:pointer;background:#f0f2f5;font-weight:700;padding:.9rem}.kl-tablewrap{overflow-x:auto}.kl-tablewrap table{min-width:650px}.kl-tablewrap th,.kl-tablewrap td{vertical-align:top;padding:.65rem}.kl-legacy{margin-top:1.3rem;border:1px solid var(--kl-border);border-radius:10px;padding:.7rem}.kl-legacy summary{font-weight:600;cursor:pointer;padding:.5rem}
@media(max-width:800px){.kl-workspace{grid-template-columns:1fr}.kl-facts{gap:.5rem}.kl-fact{min-width:45%}.kl-tabs{overflow-x:auto}.kl-actions .button{width:100%;text-align:center}.kl-card{padding:.8rem}}

/* KLARLAGE_HEADER_FIX_851 */
:root { --kl-charcoal: #2C313A; --kl-red: #D71920; --kl-silver: #7C828A; }
body > header, header { background-color: #2C313A !important; color: #ffffff !important; border-bottom: 3px solid #D71920; }
body > header strong, body > header nav a, body > header label, body > header form, body > header form label,
header strong, header nav a, header label { color: #ffffff !important; opacity: 1 !important; }
header strong { display: inline-block; margin-bottom: .5rem; font-size: 1.22rem; }
header nav { display: flex; flex-wrap: wrap; gap: .35rem; }
header nav a { display: inline-block; text-decoration: none; border-radius: 6px; padding: .6rem .7rem; }
header nav a:hover, header nav a:focus-visible { background: #494f59 !important; color: #fff !important; }
header form { margin-top: .7rem; }
header form label { display: inline-flex; align-items: center; flex-wrap: wrap; gap: .7rem; }
header select { min-width: 150px; background: #fff !important; color: #2C313A !important; border: 1px solid #b7bdc6; }
header select option { color: #2C313A; background: #fff; }
header a:focus-visible, header select:focus-visible { outline: 3px solid #D71920; outline-offset: 2px; }
@media(max-width:767px) { header nav a { padding: .55rem .5rem; } header form label { width: 100%; } header select { width: auto; max-width: 100%; } }

.kl-form{max-width:1000px}.kl-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.kl-field{min-width:0}.kl-field label{display:block;font-weight:600;margin:.3rem 0}.kl-field input:not([type=checkbox]),.kl-field select,.kl-field textarea{width:100%;max-width:100%}.kl-field textarea{max-height:180px}.kl-error,.errorlist{color:#9d1620}.kl-dashboard-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.kl-calendar{table-layout:fixed;min-width:840px}.kl-calendar td,.kl-calendar th{padding:.45rem}.kl-calendar td{vertical-align:top;height:110px;white-space:normal}.kl-calendar-event{overflow-wrap:normal;word-break:normal;display:block;padding:.5rem;margin-top:.3rem;background:#f1f2f4;border-left:3px solid #d71920;border-radius:4px;font-size:.85rem}.kl-calendar-event small{display:block}.kl-calendar-scroll{overflow:auto}label{max-width:100%}.kl-actions select{max-width:260px}
@media(max-width:700px){.kl-fields,.kl-dashboard-grid{grid-template-columns:1fr}.kl-actions{align-items:stretch}.kl-actions label,.kl-actions select{width:100%;max-width:100%}}
