/* Contract-HUB Design-Tokens – Markenfarbe wird per applyBranding() zur Laufzeit gesetzt. */
:root{--brand:#4a7fa0;--ink:#263c49;--muted:#5b6b74;--bg:#f4f7fa;--line:#dde7ee;--nav:#075f91;--lime:#d9f1fd;--green:#066b9e;--line-input:#8fa3b0;--focus:#0b3d5c}
aside{background:white;color:#667e8d;border-right:1px solid #dce7ed}
.brand .logo{font-size:0;letter-spacing:0}
.brand .logo img{width:100%;height:auto;display:block}
.brand small{color:#83929b;margin-top:15px;font-size:9px;letter-spacing:2.3px}
.nav a{color:#577181}
.nav a.active{background:#e6f4fc;color:#066b9e}
.nav a:hover{background:#f0f7fb}
.asidefoot{border-color:#e3ebf1;color:#8095a1}
.asidefoot b{color:var(--brand)}
.primary{background:var(--brand);border-color:var(--brand)}
.primary:hover{background:#075f91}
.hero,.contextbar{background:linear-gradient(115deg,#075f91,var(--brand))}
.hero p,.contextbar p{color:#e0f1fb}
.hero .eyebrow{color:white}
.contextbar select{background:#0879af;border-color:#69afd0}
.contextbar label{color:#c9eafa}
.lime{background:#fff;border-color:#fff;color:#066b9e}
.step.selected{border-color:var(--brand);box-shadow:inset 0 -2px var(--brand)}
.langbtn.active{border-color:var(--brand);background:#e8f5fc;box-shadow:inset 0 -2px var(--brand)}
.clauseitem.active{background:#edf7fd;border-left-color:var(--brand)}
.sourcebox,.summarybox{background:#f7f9fb}
.helpbox,.scopeinfo,.devnote,.airesult{background:#edf6fc;border-color:#d4e9f6;color:#43677d}
.scopeinfo.warn,.pending{background:#fff6e8;color:#8d692d}
.dropzone{border-color:#95bcd3;background:#f6fbfe}
.dropzone:hover{background:#edf7fd}
.timelinepath span{background:#e8f4fb}
.document .watermark{color:var(--brand)}
.presentationLink{border-color:#9dcee6;color:#066b9e}
/* Fokus – mindestens 3:1-Kontrast auf hellem Hintergrund */
:focus-visible{outline:2.5px solid var(--focus);outline-offset:2px;border-radius:3px}
/* Formulare: Mindest-Schriftgröße 16 px (verhindert Auto-Zoom), Tippflächen ≥ 44 px */
input,select,textarea{font-size:16px;border-color:var(--line-input);min-height:44px;box-sizing:border-box}
button{min-height:44px}
button.link{min-height:1em;padding:0}
/* Dialog (natives <dialog>-Element via dialog.js) */
dialog{padding:0;border:none;border-radius:12px;box-shadow:0 8px 40px rgba(0,0,0,.18);max-width:min(95vw,620px);width:100%}
dialog.wide{max-width:min(95vw,860px)}
dialog::backdrop{background:rgba(0,0,0,.35)}
/* Wizard-Dialog */
dialog.modal.wizard{width:min(1100px,96vw);height:92dvh;display:flex;flex-direction:column}
.modal.wizard .modalbody{flex:1;overflow:hidden;display:flex;flex-direction:column;padding:0}
.wizardbody{flex:1;overflow-y:auto;padding:20px 26px}
.wizardsteps{list-style:none;padding:16px 20px;margin:0;display:flex;gap:12px;border-bottom:1px solid var(--line)}
.wizardsteps li{flex:1 1 0;min-width:0;padding:12px 10px;background:white;border:1px solid var(--line);border-radius:9px;font-size:11px;font-weight:500;min-height:72px;display:flex;flex-direction:column}
.wizardsteps li[data-wizard-state="done"]{background:#f0f7e6}
.wizardsteps li[data-wizard-state="waiting"]{background:#fffdf0}
.wizardsteps li[aria-current="step"]{border-color:var(--brand);box-shadow:inset 0 -2px var(--brand)}
.wizardsteps .wz-num{display:inline-flex;width:21px;height:21px;align-items:center;justify-content:center;border-radius:50%;background:#edf0e8;font-size:10px;margin-bottom:6px}
.wizardsteps li[data-wizard-state="done"] .wz-num{background:#d8edb8}
.wizardsteps li[data-wizard-state="waiting"] .wz-num{background:#f0dfc1}
.wizardsteps .wz-name{font-weight:600;font-size:12px;line-height:1.3}
.wizardsteps .wz-state{font-size:10px;color:var(--muted);margin-top:4px}
/* Feldfehler */
.fielderror{color:#a7272b;font-size:11px;margin:4px 0 0;line-height:1.4}
.dialerror{background:#fef1f1;border:1px solid #f5b7b7;border-radius:7px;padding:10px 13px;font-size:12px;color:#a7272b;margin-bottom:12px}
/* Toast-Arten */
.toast{padding:10px 14px;border-radius:7px;font-size:12px;line-height:1.5;display:flex;align-items:center;gap:8px}
.toast-info,.toast{background:#075f91;color:white}
.toast-success{background:#2b7a3c;color:white}
.toast-error{background:#a7272b;color:white}
.toast-close{color:white;background:none;border:none;cursor:pointer;margin-left:auto;padding:0;min-height:1em;font-size:14px;line-height:1}
/* Sprachauswahl im Kopf */
.langsel{font-size:12px;min-height:32px;padding:3px 6px;border-radius:6px;border:1px solid var(--line-input);background:white}
/* Schublade und Handy-Elemente: auf dem Desktop verbergen */
.menubtn,.drawerfoot,.drawerbackdrop,.u-mobile-only{display:none}
@media(max-width:760px){
/* Bestehende Regeln */
aside{border-bottom:1px solid #dce7ed}
.nav a.active{color:#066b9e}
/* Schublade – nur aside.drawer (contracts.html bleibt unberührt) */
aside.drawer{position:fixed;top:0;left:0;width:min(85vw,320px);height:100dvh;transform:translateX(-100%);visibility:hidden;transition:transform .25s ease,visibility .25s;overflow:auto;z-index:200}
body.drawer-open aside.drawer{transform:none;visibility:visible}
aside.drawer .brand,aside.drawer .navlabel{display:block}
aside.drawer .asidefoot{display:none}
aside.drawer .nav{display:flex;flex-direction:column;overflow:visible}
aside.drawer .nav a{min-height:44px;display:flex;align-items:center;padding:0 20px}
.drawerfoot{display:block}
.drawerbackdrop{position:fixed;inset:0;background:rgba(0,0,0,.35);z-index:199}
body.drawer-open .drawerbackdrop{display:block}
/* Kopfzeile */
.menubtn{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;min-height:44px;padding:0;background:none;border:none;cursor:pointer}
/* Karten (table.cards) */
table.cards thead{display:block;position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
table.cards tr{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:10px;padding:12px 14px;margin-bottom:12px}
table.cards td{display:block;border:none;padding:4px 0;font-size:13px;overflow-wrap:anywhere;hyphens:auto;order:2}
table.cards td[data-label]::before{content:attr(data-label);display:block;font-size:10px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);margin-bottom:2px}
table.cards td.c-head{order:0;font-weight:600;font-size:14px}
table.cards td.c-status{order:1}
table.cards td.c-actions{order:3;display:flex;flex-wrap:wrap;gap:6px;padding-top:8px}
table.cards td.c-actions button{flex:1 1 auto}
.tablewrap:has(table.cards){overflow:visible}
/* Dialoge vollbild */
dialog.modal[open]{width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;margin:0;border-radius:0;display:flex;flex-direction:column;overflow-wrap:anywhere;hyphens:auto}
dialog.modal[open] .modalbody{flex:1;overflow:auto}
dialog.modal[open] .modalfoot{position:sticky;bottom:0;background:#fff}
/* Tippziele >= 44 px */
button.link{min-height:44px}
button.mini{min-height:44px}
.toast-close{min-height:44px;min-width:44px;padding:8px}
.js-dlg-close{min-height:44px;min-width:44px}
.chip{min-height:44px}
.langsel{min-height:44px}
/* Schrittleiste M1 – überschreibt portal.css */
.steps{grid-template-columns:1fr;gap:5px}
.step{font-size:13px;min-height:44px}
/* Statuszeile M2 */
.statusline{display:block}
.statusline .owner{display:block;margin-top:4px}
/* Upload M6 */
.u-desk-only{display:none}
.u-mobile-only{display:inline}
.upload-input{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
.dropzone{min-height:56px}
/* Wizard-Stepper mobile: kompakt, eine Zeile */
dialog.modal.wizard[open] .modalbody{overflow:hidden;display:flex;flex-direction:column;padding:0}
.wizardsteps{flex-direction:row;overflow-x:auto;padding:8px 12px;gap:4px}
.wizardsteps li{flex:0 0 auto;min-height:44px;min-width:44px;padding:6px 8px;flex-direction:row;align-items:center;gap:6px}
.wizardsteps li .wz-name{display:none}
.wizardsteps li[aria-current="step"] .wz-name{display:inline;font-size:12px}
.wizardsteps .wz-state{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.wizardsteps .wz-num{margin-bottom:0}
}
/* Fix S3/F5: radio and checkbox don't need the 44 px input min-height; tap area comes from the label */
input[type=radio],input[type=checkbox]{min-height:0;width:auto}
/* Schublade: kein Übergang für Nutzer, die das bevorzugen */
@media(prefers-reduced-motion:reduce){aside.drawer{transition:none}}