.portaal-body{background:var(--cc-soft,#f4f8f9);min-height:100vh}
.portaal-main{padding:clamp(1.5rem,4vw,2.75rem) 0 3rem}
.portaal-userchip{
  display:inline-block;font-size:11px;letter-spacing:.06em;text-transform:uppercase;
  color:var(--cc-muted);max-width:12rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
/* Portaal: altijd zichtbare nav (geen apart mobiel-menu) */
.portaal-body .nav{
  display:flex;flex-wrap:wrap;gap:.65rem 1rem;justify-content:flex-end;
}
.portaal-body .header__cta{display:inline-flex}
@media (max-width:600px){
  .portaal-body .header{flex-wrap:wrap}
  .portaal-body .nav{width:100%;justify-content:flex-start;order:3;padding-bottom:.5rem}
}
.portaal-card{
  background:#fff;border:1px solid var(--cc-line,#e4ecef);border-radius:10px;
  padding:clamp(1.15rem,3vw,1.75rem);margin:0 0 1.25rem;
}
.portaal-card h1,.portaal-card h2{text-transform:none;margin:0 0 .75rem}
.portaal-card h1:after,.portaal-card h2:after{margin-top:8px}
.portaal-lead{margin:0 0 1.25rem;color:var(--cc-muted);max-width:40rem}
.portaal-flash{
  padding:.85rem 1rem;border-radius:8px;margin:0 0 1rem;font-size:.95rem;
}
.portaal-flash--ok{background:#eef7f2;color:#1e5c3a;border:1px solid #b7d9c6}
.portaal-flash--err{background:#fbf0f0;color:#8b2e2e;border:1px solid #e4b4b4}
.portaal-form{display:grid;gap:1rem;max-width:26rem}
.portaal-form label{display:grid;gap:.35rem;font-size:.85rem;text-transform:uppercase;letter-spacing:.06em;color:var(--cc-muted)}
.portaal-form input[type="text"],
.portaal-form input[type="password"],
.portaal-form input[type="file"],
.portaal-form select{
  font:inherit;padding:.7rem .85rem;border:1px solid var(--cc-line);border-radius:8px;
  color:var(--cc-dark);background:#fff;min-height:44px;font-size:16px;text-transform:none;letter-spacing:0;
}
.portaal-form .portaal-actions{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:.25rem}
.portaal-btn{
  display:inline-flex;align-items:center;justify-content:center;min-height:44px;
  padding:.7rem 1.15rem;border-radius:6px;border:1px solid var(--cc-brand);
  background:var(--cc-brand);color:#fff!important;font:inherit;font-size:12px;
  letter-spacing:.08em;text-transform:uppercase;cursor:pointer;text-decoration:none;
}
.portaal-btn:hover{background:var(--cc-brand-hover);color:#fff!important}
.portaal-btn--ghost{background:#fff;color:var(--cc-dark)!important;border-color:#ddd}
.portaal-btn--ghost:hover{border-color:var(--cc-brand);color:var(--cc-brand)!important}
.portaal-btn--danger{background:#8b2e2e;border-color:#8b2e2e}
.portaal-btn--danger:hover{background:#6e2424;border-color:#6e2424}
.portaal-grid{display:grid;gap:1.25rem}
@media (min-width:900px){.portaal-grid--2{grid-template-columns:1fr 1fr}}
.portaal-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.portaal-table{width:100%;border-collapse:collapse;font-size:.92rem}
.portaal-table th,.portaal-table td{
  text-align:left;padding:.65rem .5rem;border-bottom:1px solid var(--cc-line);vertical-align:middle;
}
.portaal-table th{
  font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;color:var(--cc-muted);font-weight:600;
}
.portaal-table td .portaal-btn{min-height:40px;padding:.45rem .8rem;font-size:11px}
.portaal-empty{margin:0;color:var(--cc-muted);font-size:.95rem}
.portaal-thumb{
  width:56px;height:56px;object-fit:cover;border-radius:6px;border:1px solid var(--cc-line);background:#fff;
}
.portaal-admin-nav{display:flex;flex-wrap:wrap;gap:.75rem;margin:0 0 1.25rem}
.portaal-hint{margin:.35rem 0 0;font-size:.85rem;color:var(--cc-muted);text-transform:none;letter-spacing:0}
