.usecase-workspace{display:grid;gap:18px}.uc-topbar{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap}.uc-topbar h2{margin:0}.uc-topbar-actions{display:flex;gap:8px;flex-wrap:wrap}.uc-layout{display:grid;grid-template-columns:minmax(230px,300px) minmax(0,1fr);gap:18px;align-items:start}.uc-sidebar,.uc-editor,.uc-preview,.uc-check-panel{background:#fff;border:1px solid #d8e2ef;border-radius:16px;box-shadow:0 7px 22px rgba(35,55,85,.07)}.uc-sidebar{padding:14px;position:sticky;top:12px}.uc-list{display:grid;gap:8px;margin-top:12px}.uc-list-item{width:100%;text-align:left;border:1px solid #dbe5f0;background:#f7f9fc;border-radius:11px;padding:11px;cursor:pointer}.uc-list-item.active{border-color:#7654c6;background:#f3efff;box-shadow:inset 4px 0 0 #7654c6}.uc-list-item strong,.uc-list-item small{display:block}.uc-list-item small{margin-top:4px;color:#607086}.uc-list-empty{padding:18px 8px;text-align:center;color:#68778b}.uc-progress{height:8px;border-radius:99px;background:#e8edf4;overflow:hidden;margin-top:7px}.uc-progress>span{display:block;height:100%;background:linear-gradient(90deg,#7654c6,#4169c1)}.uc-editor{padding:18px;min-width:0}.uc-editor-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;border-bottom:1px solid #e3e9f1;padding-bottom:14px;margin-bottom:14px}.uc-editor-head h3{margin:2px 0 4px}.uc-badge{display:inline-flex;border-radius:999px;padding:5px 9px;font-size:.78rem;font-weight:700;background:#eee9ff;color:#5734a7}.uc-tabs{display:flex;gap:7px;flex-wrap:wrap;margin:0 0 16px}.uc-tabs button{border:1px solid #d6e0ec;background:#f8fafc;color:#33445c;border-radius:999px;padding:8px 12px}.uc-tabs button.active{background:#334e9a;color:#fff;border-color:#334e9a}.uc-section{display:none}.uc-section.active{display:block}.uc-section-title{padding:12px 14px;border-radius:12px;background:#edf4ff;border-left:5px solid #4169c1;margin-bottom:14px}.uc-section-title h3{margin:0 0 3px}.uc-section-title p{margin:0;color:#5d6f86}.uc-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.uc-grid.one{grid-template-columns:1fr}.uc-field{display:grid;gap:6px;min-width:0}.uc-field.full{grid-column:1/-1}.uc-field label{font-weight:700;color:#263951;font-size:.92rem}.uc-field label small{display:block;font-weight:400;color:#66778d;margin-top:2px}.uc-field input,.uc-field textarea,.uc-field select{width:100%;box-sizing:border-box;border:1px solid #cfd9e5;border-radius:9px;padding:10px 11px;font:inherit;background:#fff;color:#18273a}.uc-field textarea{min-height:104px;resize:vertical}.uc-field textarea.tall{min-height:160px}.uc-field input:focus,.uc-field textarea:focus,.uc-field select:focus{outline:3px solid rgba(65,105,193,.14);border-color:#4169c1}.uc-actions{display:flex;gap:8px;justify-content:space-between;flex-wrap:wrap;padding-top:16px;margin-top:16px;border-top:1px solid #e5eaf1}.uc-actions>div{display:flex;gap:8px;flex-wrap:wrap}.uc-button{border:1px solid #cfd9e5;background:#fff;border-radius:9px;padding:9px 12px;font-weight:700;cursor:pointer}.uc-button.primary{background:#334e9a;color:#fff;border-color:#334e9a}.uc-button.danger{color:#9b2f3e;border-color:#e4bbc2;background:#fff7f8}.uc-button.soft{background:#f1edff;color:#5734a7;border-color:#d9cdf8}.uc-sdg-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.uc-sdg{display:flex;gap:9px;align-items:flex-start;border:1px solid #dbe3ed;border-radius:10px;padding:10px;background:#fafcff}.uc-sdg input{margin-top:3px}.uc-sdg strong{display:block}.uc-sdg small{display:block;color:#6b7b8e}.uc-check-panel{padding:16px}.uc-score-row{display:grid;grid-template-columns:140px 1fr;gap:16px;align-items:center}.uc-score-ring{width:116px;height:116px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(#4169c1 var(--score),#e8edf4 0);position:relative}.uc-score-ring:before{content:"";position:absolute;inset:10px;background:#fff;border-radius:50%}.uc-score-ring strong{position:relative;font-size:1.55rem}.uc-checklist{display:grid;gap:10px;margin-top:16px}.uc-check{border:1px solid #dce4ee;border-radius:11px;padding:12px}.uc-check-head{display:flex;gap:12px;justify-content:space-between;align-items:flex-start}.uc-check p{margin:0;font-weight:650}.uc-check-controls{display:flex;gap:5px;flex-wrap:wrap;margin-top:9px}.uc-check-controls button{font-size:.78rem;border:1px solid #d5dee9;border-radius:7px;background:#fff;padding:6px 8px}.uc-check-controls button.selected[data-v="yes"]{background:#e4f5ea;color:#1f6b3b;border-color:#9ed0ae}.uc-check-controls button.selected[data-v="partial"]{background:#fff3d7;color:#855c08;border-color:#e7c874}.uc-check-controls button.selected[data-v="no"]{background:#fde8eb;color:#963247;border-color:#e2a7b2}.uc-check-controls button.selected[data-v="na"]{background:#edf0f4;color:#526173}.uc-check textarea{width:100%;box-sizing:border-box;margin-top:8px;min-height:58px;border:1px solid #d5dee8;border-radius:8px;padding:8px}.uc-preview{padding:20px}.uc-card-title{border-left:6px solid #7654c6;padding:12px 15px;background:#f4f0ff;border-radius:10px;margin-bottom:16px}.uc-card-title h2{margin:0 0 4px}.uc-card-meta{display:flex;gap:7px;flex-wrap:wrap}.uc-card-meta span{background:#edf2f8;padding:5px 8px;border-radius:999px;font-size:.8rem}.uc-preview-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.uc-preview-block{border:1px solid #dce4ee;border-radius:11px;padding:13px;overflow-wrap:anywhere}.uc-preview-block.full{grid-column:1/-1}.uc-preview-block h4{margin:0 0 7px;color:#334e9a}.uc-preview-block p{white-space:pre-wrap;margin:0;color:#34465b}.uc-warning{background:#fff8e6;border:1px solid #ecd38c;border-radius:10px;padding:11px;color:#765810}.uc-success{background:#ecf8f0;border:1px solid #a9d4b8;border-radius:10px;padding:11px;color:#265f3a}.uc-existing-routes{margin-top:18px;padding-top:18px;border-top:1px solid #dce4ee}.uc-existing-routes .scenario{margin-top:12px}.uc-import-input{display:none}@media(max-width:1000px){.uc-layout{grid-template-columns:1fr}.uc-sidebar{position:static}.uc-list{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:720px){.uc-grid,.uc-sdg-grid,.uc-preview-grid,.uc-list{grid-template-columns:1fr}.uc-score-row{grid-template-columns:1fr}.uc-score-ring{margin:auto}.uc-editor,.uc-preview{padding:14px}.uc-editor-head{display:block}.uc-topbar-actions{width:100%}.uc-topbar-actions .uc-button{flex:1}.uc-check-head{display:block}}
@media print{body *{visibility:hidden!important}.uc-preview,.uc-preview *{visibility:visible!important}.uc-preview{position:absolute;inset:0;border:0;box-shadow:none}.uc-preview .uc-button{display:none!important}}

.uc-field-help{margin-top:8px;border:1px solid #dbe4ee;border-radius:10px;background:#f7fafc;padding:8px 10px}.uc-field-help summary{cursor:pointer;font-weight:800;color:#245477}.uc-field-help p{margin:7px 0;line-height:1.5;color:#34465b;font-size:.9rem}
/* 11.9.0 – assessment-first classificatieworkflow */
.uc-route-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:16px 0}.uc-route-summary{border:1px solid #d7e0ec;border-left:5px solid #7890ad;border-radius:16px;background:#fff;padding:18px}.uc-route-summary.yes{border-left-color:#2f855a}.uc-route-summary.no{border-left-color:#4b6f9f}.uc-route-summary.unknown{border-left-color:#c58a20}.uc-route-summary.muted{background:#f5f7fa;color:#53657b}.uc-route-head{display:flex;gap:12px;justify-content:space-between;align-items:flex-start;margin-bottom:10px}.uc-route-head h3{margin:4px 0 0}.uc-route-status{font-size:.78rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:#60738b}.uc-route-pill{font-size:.8rem;font-weight:800;border-radius:999px;padding:6px 9px;background:#eef2f7}.uc-route-pill.yes{background:#e7f6ed;color:#226840}.uc-route-pill.no{background:#eaf1fb;color:#315f95}.uc-route-pill.unknown{background:#fff4d9;color:#805b10}.uc-consolidated{margin-top:16px;border-radius:16px;padding:20px;background:#edf4ff;border-left:5px solid #4269c7}.uc-consolidated.yes{background:#eaf7ef;border-left-color:#2f855a}.uc-consolidated.no{background:#eef4fb;border-left-color:#4b6f9f}.uc-consolidated h3{margin:8px 0}.uc-consolidated p{margin:7px 0}@media(max-width:760px){.uc-route-grid{grid-template-columns:1fr}.uc-route-head{display:block}.uc-route-pill{display:inline-block;margin-top:8px}}


/* 12.4.1 · bredere Use Case Card-werkruimte op laptop/desktop */
#list > .usecase-workspace{grid-column:1 / -1;width:100%;max-width:1480px;margin:0 auto;}
.usecase-workspace{width:100%;}
@media(min-width:1180px){
  .uc-layout{grid-template-columns:minmax(260px,320px) minmax(0,1fr);gap:24px;width:100%;}
  .uc-editor{padding:22px;max-width:1160px;}
  .uc-sidebar{max-width:320px;}
  .uc-grid{grid-template-columns:repeat(2,minmax(260px,1fr));}
  .uc-field.full textarea{min-height:150px;}
}
@media(min-width:1500px){
  .uc-layout{grid-template-columns:320px minmax(0,1fr);}
  .uc-editor{max-width:1280px;}
}
@media(min-width:1001px) and (max-width:1179px){
  #list > .usecase-workspace{max-width:1120px;}
  .uc-layout{grid-template-columns:minmax(230px,280px) minmax(0,1fr);gap:18px;}
}
@media(max-width:1000px){
  #list > .usecase-workspace{max-width:100%;}
}

/* 12.4.2 · feitelijke desktopbreedte Use Case Card
   De algemene .list wordt vanaf 700px een 2-koloms grid. Daardoor kreeg de volledige
   Use Case Workspace slechts één halve pagina. In usecase-modus moet de workspace
   juist de volledige beschikbare contentbreedte innemen. */
.list:has(> .usecase-workspace){grid-template-columns:minmax(0,1fr)!important;}
#list > .usecase-workspace{grid-column:1 / -1!important;max-width:none!important;width:100%!important;margin:0!important;}
@media(min-width:1180px){
  .usecase-workspace .uc-layout{grid-template-columns:300px minmax(0,1fr)!important;gap:24px;}
  .usecase-workspace .uc-sidebar{width:300px;max-width:300px;}
  .usecase-workspace .uc-editor{width:100%;max-width:none!important;min-width:0;padding:22px 26px;}
  .usecase-workspace .uc-grid{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:20px;row-gap:14px;}
}
@media(min-width:1001px) and (max-width:1179px){
  .usecase-workspace .uc-layout{grid-template-columns:270px minmax(0,1fr)!important;gap:18px;}
  .usecase-workspace .uc-editor{max-width:none!important;width:100%;}
}
@media(max-width:1000px){
  .list:has(> .usecase-workspace){display:block;}
  .usecase-workspace .uc-layout{grid-template-columns:1fr!important;}
}

/* 12.4.3 · correctie werkelijke DOM-structuur
   De Use Case Workspace staat binnen .standardized-page; daarom moet die wrapper
   de volledige rij en breedte krijgen. Alleen de rechter werkkolom groeit. */
@media(min-width:1001px){
  #list:has(.usecase-workspace){grid-template-columns:minmax(0,1fr)!important;}
  #list > .standardized-page:has(.usecase-workspace){
    grid-column:1 / -1!important;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
  }
  #list > .standardized-page:has(.usecase-workspace) > .usecase-workspace{
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
  }
  .usecase-workspace .uc-layout{
    grid-template-columns:300px minmax(0,1fr)!important;
    width:100%!important;
    max-width:none!important;
  }
  .usecase-workspace .uc-sidebar{width:300px!important;max-width:300px!important;}
  .usecase-workspace .uc-editor{width:100%!important;max-width:none!important;min-width:0!important;}
}
@media(min-width:1001px) and (max-width:1179px){
  .usecase-workspace .uc-layout{grid-template-columns:270px minmax(0,1fr)!important;}
  .usecase-workspace .uc-sidebar{width:270px!important;max-width:270px!important;}
}

/* 12.5.0 Assessment Router */
.uc-route-summary.warn{border-left:5px solid #d78324}.uc-route-summary.sector{border-left:5px solid #6b4bb6}.uc-route-summary.done{border-left:5px solid #2d7a55}.uc-route-summary.advise{border-left:5px solid #2f6fa3}
