/* Fachanordnung; Studio-Tokens und Scrollbars kommen aus packages/ui/studio.css. */
:root { --qualification-danger: #a52d20; --qualification-danger-soft: #fff2ee; --qualification-warning: #805500; --qualification-warning-soft: #fff6df; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
.access-panel { width:min(500px,calc(100% - 32px)); margin:55px auto; padding:30px; border:1px solid var(--line); border-radius:var(--radius); background:var(--surface); box-shadow:var(--shadow); }
.requirement-choices { display:grid; gap:8px; border:0; padding:10px 0; margin:12px 0; }.requirement-choices legend { font-size:12px; font-weight:600; }.requirement-choice { display:flex; gap:11px; align-items:center; padding:11px; border:1px solid var(--line); border-radius:8px; cursor:pointer; }.requirement-choice:hover { background:var(--accent-soft); }.requirement-choice input { width:18px; height:18px; min-height:18px; flex-shrink:0; accent-color:var(--accent); }.requirement-choice b { font-size:12px; }.requirement-choice small { margin-top:4px; }.requirement-search { display:block; font-size:12px; font-weight:600; margin-top:18px; }.requirement-search input { width:100%; margin-top:6px; }.matrix-explanation { border-radius:0; margin-bottom:0; border-left:0; border-right:0; }.cell.na { font-size:10px; }#catalog-upload-status { min-height:22px; font-size:12px; color:var(--accent); }
.access-panel h1 { font-size:26px; margin:24px 0 12px; }.access-panel p { margin-bottom:20px; }.access-panel label { display:block; margin:17px 0 6px; font-weight:600; font-size:12px; }.access-panel input { width:100%; }.access-panel small { margin-top:5px; }.access-panel .password-field { display:flex; gap:8px; }.access-panel #access-error { color:var(--qualification-danger); font-size:12px; min-height:20px; margin:16px 0; }
#load-error { margin:0 23px; }#retry-load { margin:0 23px 15px; }.qualification-content .page-heading >.actions { max-width:650px; justify-content:flex-end; }details { margin:16px 0; }summary { cursor:pointer; font-size:12px; font-weight:600; }summary:hover { color:var(--accent); }#upload-feedback { min-height:24px; font-size:12px; color:var(--accent); margin-top:12px; }
.qualification-shell { display:grid; grid-template-columns:246px minmax(0,1fr); min-height:100dvh; }
.qualification-sidebar { padding:32px 17px 24px; background:var(--surface); border-right:1px solid var(--line); display:flex; flex-direction:column; position:sticky; top:0; height:100dvh; overflow:auto; }
.original-logo { width:198px; height:47px; display:block; margin:0 auto; flex-shrink:0; }
.qualification-sidebar .workspace { margin:34px 0; padding:13px 10px; }
.qualification-sidebar .nav-item { font-size:12px; padding:13px 11px; gap:9px; }
.nav-item > span:first-child { display:flex; }.nav-count { margin-left:auto; font-size:10px; }
.qualification-content { min-width:0; }.qualification-content .topbar { min-height:65px; height:auto; padding:12px 32px; flex-wrap:wrap; gap:12px; }.qualification-content .breadcrumb { min-width:0; flex-wrap:wrap; overflow-wrap:anywhere; }.qualification-content .demo-pill { min-width:0; max-width:100%; overflow-wrap:anywhere; }
.qualification-content main { max-width:1900px; padding:32px; }.qualification-content h1 { font-size:32px; }
.qualification-content .page-heading { margin-bottom:24px; align-items:flex-end; }.qualification-content .page-heading .eyebrow { margin-bottom:9px; }
.actions { display:flex; gap:8px; align-items:center; flex-wrap:wrap; }.demo-pill { font-size:10px; font-weight:650; color:var(--accent); background:var(--accent-soft); padding:6px 10px; border-radius:6px; }
.demo-state { font-size:11px; padding:24px 8px 0; }.demo-state .local-indicator { display:inline-block; margin-right:6px; }.demo-state small { margin-top:8px; }
.scope-note { display:flex; align-items:center; gap:10px; font-size:11px; color:var(--muted); margin-bottom:23px; }.scope-note >span:first-child { color:var(--accent); display:flex; }.scope-note #reference-day { margin-left:auto; white-space:nowrap; }
.qualification-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); margin-bottom:25px; border:1px solid var(--line); border-radius:12px; background:var(--surface); padding:20px 0; }
.metric { padding:0 23px; border-right:1px solid var(--line); }.metric:last-child { border:0; }.metric strong { font:600 29px var(--display); display:block; margin:5px 0; }.metric .metric-label { font-size:11px; color:var(--muted); }.metric small { font-size:10px; }.metric.danger strong { color:var(--qualification-danger); }.metric.warning strong { color:var(--qualification-warning); }
.coverage-track { height:4px; border-radius:4px; margin-top:10px; background:var(--accent-soft); overflow:hidden; }.coverage-track progress { display:block; height:4px; width:100%; accent-color:var(--accent); }
.qualification-panel { border:1px solid var(--line); border-radius:14px; background:var(--surface); overflow:hidden; box-shadow:var(--shadow); }.panel-heading { display:flex; align-items:center; justify-content:space-between; padding:22px 23px; border-bottom:1px solid var(--line); }.panel-heading h2 { font-size:18px; }.panel-heading p { font-size:11px; margin-top:5px; }.panel-kicker { font-size:9px; letter-spacing:1.5px; color:var(--accent); }
.filters { padding:18px 23px; display:flex; flex-wrap:wrap; gap:12px; background:var(--surface); }.filters label,.field label { display:block; font-size:10px; font-weight:600; color:var(--muted); }.filters >label { flex:1; min-width:115px; }.search-field { flex:1.7; min-width:210px; }.search-field >div { position:relative; }.search-field input { width:100%; padding-right:34px; }#clear-search { position:absolute; right:2px; top:3px; width:32px; height:32px; font-size:20px; border-radius:6px; }
input,select,textarea { font:inherit; color:var(--text); border:1px solid var(--line); border-radius:7px; background:var(--surface); padding:9px 10px; min-height:38px; }select { cursor:pointer; }.filters select { width:100%; margin-top:5px; font-size:11px; }.search-field input { margin-top:5px; font-size:12px; }textarea { resize:none; min-height:80px; width:100%; }
.table-scroll { overflow:auto; max-height:600px; min-height:390px; scrollbar-gutter:stable; }table { border-collapse:separate; border-spacing:0; width:100%; font-size:12px; }th,td { border-bottom:1px solid var(--line); padding:12px 14px; text-align:left; vertical-align:middle; }thead th { position:sticky; top:0; z-index:2; background:var(--bg); color:var(--muted); font-weight:600; font-size:10px; }tbody tr:hover td { background:color-mix(in srgb,var(--accent-soft) 38%,var(--surface)); }.matrix-table { min-width:1450px; }.matrix-table th { text-align:center; min-width:102px; }.matrix-table th:first-child { min-width:36px; }.matrix-table td { padding:10px 9px; text-align:center; }.matrix-table th:nth-child(2),.matrix-table td:nth-child(2) { position:sticky; left:0; text-align:left; min-width:224px; background:var(--surface); z-index:1; box-shadow:3px 0 5px #23273d06; }.matrix-table thead th:nth-child(2) { z-index:3; background:var(--bg); }.matrix-table th small { font-size:9px; font-weight:400; margin-top:3px; }
.person { display:flex; align-items:center; gap:10px; text-align:left; border-radius:5px; padding:2px; }.person .avatar { width:31px; height:31px; font-size:10px; }.person b { font-size:12px; font-weight:600; }.person small { font-size:10px; margin-top:3px; }.cell { display:inline-flex; justify-content:center; align-items:center; width:35px; height:29px; border-radius:6px; font-size:14px; font-weight:650; background:var(--accent-soft); color:var(--accent); border:1px solid transparent; }.cell:hover { border-color:currentColor; }.cell.due,.badge.due { background:var(--qualification-warning-soft); color:var(--qualification-warning); }.cell.expired,.cell.missing,.badge.expired,.badge.missing { background:var(--qualification-danger-soft); color:var(--qualification-danger); }.cell.revision,.cell.review,.badge.revision,.badge.review { background:var(--bg); color:var(--muted); }.cell.na { color:var(--muted); background:transparent; }.badge { display:inline-block; padding:4px 8px; border-radius:5px; font-size:10px; background:var(--accent-soft); color:var(--accent); white-space:nowrap; }
.list-footer { display:flex; align-items:center; justify-content:space-between; gap:15px; padding:13px 23px; font-size:11px; color:var(--muted); border-top:1px solid var(--line); }.list-footer .button { min-width:36px; min-height:35px; padding:5px 10px; }.page-size { display:flex; align-items:center; gap:6px; }.page-size select { min-height:33px; padding:4px; }.legend { display:flex; gap:17px; flex-wrap:wrap; margin-top:17px; font-size:10px; color:var(--muted); }.legend >span { display:flex; align-items:center; gap:6px; }.legend .cell { width:23px; height:22px; font-size:11px; }.footnote { font-size:10px; margin-top:22px; }.text-button { color:var(--accent); font-weight:600; padding:4px; border-radius:4px; }
.selection-bar { display:flex; gap:12px; align-items:center; flex-wrap:wrap; background:var(--accent-soft); padding:10px 23px; font-size:12px; }.empty { text-align:center; padding:85px 25px; min-height:390px; }.empty h3 { margin-bottom:9px; }.empty p { max-width:460px; margin:auto; }
.qualification-dialog { border:1px solid var(--line); padding:0; background:var(--surface); color:var(--text); }.qualification-dialog[open] { display:flex; flex-direction:column; }.qualification-dialog .window-header { display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); gap:12px; flex-shrink:0; }.qualification-dialog .window-header h2 { font-size:21px; margin-top:6px; }.qualification-dialog form { display:flex; flex-direction:column; flex:1; min-height:0; }.qualification-dialog .floating-workspace { overflow:auto; }.qualification-dialog .detail-body { overflow:auto; }.qualification-dialog .window-context p { margin-bottom:14px; }.qualification-dialog .window-context h3 { overflow-wrap:anywhere; }.window-footer { border-top:1px solid var(--line); padding:15px 24px; display:flex; align-items:center; justify-content:space-between; gap:14px; flex-shrink:0; }.window-footer small { max-width:240px; }.qualification-dialog.maximized { width:calc(100vw - 30px); height:calc(100dvh - 30px); max-width:none; max-height:none; }
.fields { display:grid; grid-template-columns:1fr 1fr; gap:15px; }.field input,.field select { width:100%; margin-top:5px; font-size:12px; }.field.wide { grid-column:1/-1; }.field-error { display:block; min-height:16px; font-size:11px; color:var(--qualification-danger); margin-top:3px; }[aria-invalid=true] { border-color:var(--qualification-danger); }.detail-note { font-size:11px; background:var(--bg); border:1px solid var(--line); padding:14px; border-radius:8px; margin-bottom:20px; }.profile-qualifications { display:grid; gap:8px; }.profile-row { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:10px; border:1px solid var(--line); border-radius:8px; }.profile-row b { font-size:12px; }.profile-row small { margin-top:3px; }.qualification-toast { position:fixed; bottom:22px; left:50%; transform:translate(-50%,20px); opacity:0; background:var(--text); color:var(--surface); padding:12px 20px; border-radius:9px; z-index:30; pointer-events:none; transition:.2s; font-size:12px; }.qualification-toast.visible { opacity:1; transform:translate(-50%,0); }
.employee-choice{min-width:0}.employee-new-label{display:block;margin-top:10px}.employee-new-label[hidden]{display:none}.employee-manage-link{display:inline-block;font-size:12px;line-height:1.5;color:var(--accent);margin-top:6px}.employee-manage-link:hover{text-decoration:underline}.employee-manage-link:focus-visible{outline:3px solid var(--accent);outline-offset:3px}.employee-choice [type=hidden]{display:none}
@media (max-width:1100px) { .qualification-shell { grid-template-columns:205px minmax(0,1fr); }.original-logo { width:170px; }.qualification-content main { padding:24px 20px; }.page-heading { flex-wrap:wrap; }.metric { padding:0 15px; } }
@media (max-width:760px) { .qualification-shell { display:block; }.qualification-sidebar { position:static; height:auto; padding:15px; }.qualification-sidebar .workspace,.qualification-sidebar .nav-label,.qualification-sidebar .sidebar-bottom { display:none; }.qualification-sidebar nav { display:flex; overflow:auto; gap:4px; margin-top:15px; }.qualification-sidebar .nav-item { flex:0 0 auto; width:auto; white-space:nowrap; padding:10px; }.qualification-content .topbar { padding:12px 16px; }.breadcrumb { font-size:10px; gap:6px; }.demo-pill { font-size:9px; }.qualification-content main { padding:23px 15px; }.qualification-content h1 { font-size:27px; }.qualification-metrics { grid-template-columns:1fr 1fr; row-gap:20px; }.metric:nth-child(2) { border:0; }.metric strong { font-size:25px; }.scope-note { flex-wrap:wrap; }#reference-day { width:100%; }.panel-heading,.filters { padding:16px; }.panel-kicker { display:none; }.list-footer { padding:12px; flex-wrap:wrap; }.qualification-dialog { max-width:calc(100vw - 16px); max-height:calc(100dvh - 16px); }.qualification-dialog .floating-workspace { grid-template-columns:1fr; }.qualification-dialog .window-context { display:none; }.qualification-dialog .detail-body { padding:20px; }.fields { grid-template-columns:1fr; }.window-footer { flex-wrap:wrap; padding:12px; }.window-footer small { max-width:none; }.window-footer .actions { margin-left:auto; }.table-scroll { max-height:520px; } }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; } }
@media (max-width:760px) { .customer-start-steps .profile-row { flex-direction:column; align-items:stretch; }.customer-start-steps .profile-row>div { min-width:0; max-width:100%; }.customer-start-steps .actions { width:100%; }.customer-start-steps .button { flex:1 1 100%; min-width:0; max-width:100%; white-space:normal; overflow-wrap:anywhere; justify-content:center; } }

/* Kundenstart: drei ruhige Arbeitsgruppen mit durchgängigen Aktionsspalten. */
.customer-start-steps{gap:16px}.customer-start-group{border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--surface)}.customer-start-group>h2{font-size:13px;font-weight:600;padding:12px 16px;background:var(--bg);border-bottom:1px solid var(--line);color:var(--accent)}
.customer-start-steps .customer-start-row{display:grid;grid-template-columns:minmax(0,1fr) 340px;align-items:center;gap:24px;border:0;border-radius:0;padding:16px}.customer-start-row+.customer-start-row{border-top:1px solid var(--line)}.customer-start-row>div{min-width:0}.customer-start-row h3{font-size:14px;line-height:1.4;margin:0 0 5px}.customer-start-row p{font-size:12px;line-height:1.55;color:var(--muted);max-width:85ch}.customer-start-steps .actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;align-items:stretch}.customer-start-steps .button{width:100%;min-width:0;min-height:44px;padding:8px 10px;font-size:12px;white-space:normal;overflow-wrap:anywhere;justify-content:center;box-shadow:none}
@media(max-width:1000px){.customer-start-steps .customer-start-row{grid-template-columns:1fr;gap:12px}.customer-start-steps .actions{width:100%;max-width:500px}}
@media(max-width:520px){.customer-start-steps .actions{grid-template-columns:1fr}.customer-start-steps .customer-start-row{padding:14px}}

.customer-start-steps .actions>.button:only-child{grid-column:1/-1}

@media(max-width:760px){.matrix-table .cell{min-width:44px;min-height:44px}.matrix-table .person{min-height:44px}}