/* EGGnium designsystem — componentenbibliotheek (Sprint 04, UI/UX-vernieuwing).
   Overgenomen uit het goedgekeurde prototype (ontwerp/assets/egw-components.css), zonder app-shell, menu's,
   dialogen en notificaties (die staan in eggnium.css). Nieuwe en omgebouwde schermen gebruiken deze egw-*-klassen;
   bestaande .btn/.badge-klassen blijven werken voor nog niet omgebouwde onderdelen.
   BEHEER: CC (gedeeld bestand). Wijzigingen door anderen alleen via een verzoek, niet rechtstreeks. */
:root {
  --egw-white: #ffffff;
  --egw-font-mono: ui-monospace, "Cascadia Mono", Consolas, monospace;
  --egw-fw-regular: 400; --egw-fw-semibold: 600; --egw-fw-bold: 700;
  --egw-lh: 1.45;
  --egw-page-narrow: 960px; --egw-page: 1280px; --egw-page-wide: 1600px;
}.egw-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.egw-muted { color: var(--egw-text-muted); }
.egw-num { font-variant-numeric: tabular-nums; }
/* ---------- Pagina ---------- */
.egw-page { max-width: var(--egw-page); margin: 0 auto; padding: var(--egw-s5) var(--egw-s5) var(--egw-s7); }
.egw-page--wide { max-width: var(--egw-page-wide); }
.egw-page-header { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--egw-s4); margin-bottom: var(--egw-s5); flex-wrap: wrap; }
.egw-page-header-main { display: grid; gap: 4px; min-width: 0; }
.egw-back { display: inline-flex; align-items: center; gap: 6px; font-size: var(--egw-fs-13); color: var(--egw-text-muted); font-weight: var(--egw-fw-semibold); width: fit-content; }
.egw-back:hover { color: var(--egw-primary); text-decoration: none; }
.egw-page-title { display: flex; align-items: center; gap: var(--egw-s3); flex-wrap: wrap; }
.egw-page-sub { color: var(--egw-text-muted); }
.egw-actions { display: flex; align-items: center; gap: var(--egw-s2); flex-wrap: wrap; }
/* ---------- Knoppen ---------- */
.egw-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: 36px; padding: 0 14px; border-radius: var(--egw-radius-sm); border: 1px solid transparent; font: inherit; font-weight: var(--egw-fw-semibold); font-size: var(--egw-fs-14); line-height: 1; cursor: pointer; white-space: nowrap; text-decoration: none; transition: background .12s, border-color .12s; }
.egw-btn:hover { text-decoration: none; }
.egw-btn--primary { background: var(--egw-primary); color: #fff; }
.egw-btn--primary:hover { background: var(--egw-primary-hover); }
.egw-btn--secondary { background: var(--egw-surface); color: var(--egw-gray-800); border-color: var(--egw-border-strong); }
.egw-btn--secondary:hover { background: var(--egw-gray-100); }
.egw-btn--tertiary { background: none; color: var(--egw-primary); padding: 0 8px; }
.egw-btn--tertiary:hover { background: var(--egw-blue-50); }
.egw-btn--danger { background: var(--egw-surface); color: var(--egw-danger-text); border-color: var(--egw-danger-border); }
.egw-btn--danger:hover { background: var(--egw-danger-bg); }
.egw-btn--danger-solid { background: #c62828; color: #fff; }
.egw-btn--danger-solid:hover { background: #a61b1b; }
.egw-btn--sm { height: 30px; padding: 0 10px; font-size: var(--egw-fs-13); }
.egw-btn--icon { width: 32px; height: 32px; padding: 0; }
.egw-btn[disabled], .egw-btn[aria-disabled="true"] { opacity: .5; cursor: not-allowed; }
.egw-btn svg { width: 16px; height: 16px; flex: none; }

/* ---------- Iconen ---------- */
.egw-icon { width: 16px; height: 16px; flex: none; stroke: currentColor; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.egw-icon--lg { width: 20px; height: 20px; }
/* ---------- Kaart / paneel ---------- */
.egw-card { background: var(--egw-surface); border: 1px solid var(--egw-border); border-radius: var(--egw-radius); box-shadow: var(--egw-shadow-raised); }
.egw-card-header { display: flex; align-items: center; justify-content: space-between; gap: var(--egw-s3); padding: var(--egw-s4) var(--egw-s4) 0; }
.egw-card-body { padding: var(--egw-s4); }
.egw-card-footer { padding: var(--egw-s3) var(--egw-s4); border-top: 1px solid var(--egw-border); display: flex; justify-content: space-between; align-items: center; gap: var(--egw-s2); }
.egw-grid { display: grid; gap: var(--egw-s4); }
.egw-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.egw-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.egw-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.egw-grid--main { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); }
.egw-section-title { display: flex; align-items: baseline; justify-content: space-between; gap: var(--egw-s3); margin: var(--egw-s6) 0 var(--egw-s3); }
.egw-section-title h2 { font-size: var(--egw-fs-16); }

/* ---------- Statusbadge ---------- */
.egw-badge { display: inline-flex; align-items: center; gap: 5px; height: 22px; padding: 0 8px; border-radius: var(--egw-radius-pill); border: 1px solid; font-size: var(--egw-fs-12); font-weight: var(--egw-fw-semibold); white-space: nowrap; line-height: 1; }
.egw-badge::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.egw-badge--neutral { color: var(--egw-neutral-text); background: var(--egw-neutral-bg); border-color: var(--egw-neutral-border); }
.egw-badge--info { color: var(--egw-info-text); background: var(--egw-info-bg); border-color: var(--egw-info-border); }
.egw-badge--success { color: var(--egw-success-text); background: var(--egw-success-bg); border-color: var(--egw-success-border); }
.egw-badge--warning { color: var(--egw-warning-text); background: var(--egw-warning-bg); border-color: var(--egw-warning-border); }
.egw-badge--danger { color: var(--egw-danger-text); background: var(--egw-danger-bg); border-color: var(--egw-danger-border); }
.egw-badge--brand { color: var(--egw-teal-600); background: var(--egw-teal-100); border-color: #9fdde6; }
.egw-badge--plain::before { display: none; }

/* ---------- Meldingen ---------- */
.egw-alert { display: grid; grid-template-columns: 20px 1fr auto; gap: var(--egw-s3); align-items: start; padding: var(--egw-s3) var(--egw-s4); border: 1px solid; border-radius: var(--egw-radius); }
.egw-alert strong { display: block; }
.egw-alert--info { color: var(--egw-info-text); background: var(--egw-info-bg); border-color: var(--egw-info-border); }
.egw-alert--success { color: var(--egw-success-text); background: var(--egw-success-bg); border-color: var(--egw-success-border); }
.egw-alert--warning { color: var(--egw-warning-text); background: var(--egw-warning-bg); border-color: var(--egw-warning-border); }
.egw-alert--danger { color: var(--egw-danger-text); background: var(--egw-danger-bg); border-color: var(--egw-danger-border); }
.egw-alert p { color: var(--egw-gray-700); }
.egw-alert .egw-icon { width: 20px; height: 20px; margin-top: 1px; }
/* ---------- Tooltip ---------- */
.egw-tip { position: relative; display: inline-grid; place-items: center; width: 18px; height: 18px; border-radius: 50%; border: 0; background: var(--egw-gray-200); color: var(--egw-gray-700); font-size: 11px; font-weight: var(--egw-fw-bold); cursor: help; vertical-align: middle; }
.egw-tip:hover, .egw-tip:focus-visible { background: var(--egw-blue-100); color: var(--egw-primary); }
.egw-tip-bubble { position: absolute; z-index: 80; left: 50%; bottom: calc(100% + 8px); transform: translateX(-50%); width: max-content; max-width: 280px; padding: 8px 10px; border-radius: var(--egw-radius-sm); background: var(--egw-gray-950); color: #fff; font-size: var(--egw-fs-12); font-weight: var(--egw-fw-regular); line-height: 1.4; text-align: left; box-shadow: var(--egw-shadow-raised); display: none; pointer-events: none; max-width: min(280px, 70vw); }
.egw-tip:hover .egw-tip-bubble, .egw-tip:focus-visible .egw-tip-bubble { display: block; }

/* ---------- Formulier ---------- */
.egw-field { display: grid; gap: 4px; min-width: 0; }
.egw-label { font-size: var(--egw-fs-12); font-weight: var(--egw-fw-semibold); color: var(--egw-gray-700); display: flex; gap: 6px; align-items: center; }
.egw-input, .egw-select, .egw-textarea { width: 100%; height: 36px; padding: 0 10px; border: 1px solid var(--egw-border-strong); border-radius: var(--egw-radius-sm); background: var(--egw-surface); font: inherit; color: var(--egw-text); }
.egw-textarea { height: auto; min-height: 84px; padding: 8px 10px; resize: vertical; }
.egw-input:focus, .egw-select:focus, .egw-textarea:focus { outline: 2px solid var(--egw-focus); outline-offset: -1px; border-color: var(--egw-focus); }
.egw-help { font-size: var(--egw-fs-12); color: var(--egw-text-subtle); }
.egw-field--error .egw-input { border-color: var(--egw-danger-text); }
.egw-field-error { font-size: var(--egw-fs-12); color: var(--egw-danger-text); }
.egw-search { position: relative; }
.egw-search .egw-icon { position: absolute; left: 10px; top: 10px; color: var(--egw-text-subtle); }
.egw-search .egw-input { padding-left: 34px; }
.egw-segmented { display: inline-flex; padding: 2px; border-radius: var(--egw-radius-sm); background: var(--egw-gray-100); border: 1px solid var(--egw-border); }
.egw-segmented button { height: 30px; padding: 0 12px; border: 0; border-radius: 3px; background: none; font: inherit; font-size: var(--egw-fs-13); color: var(--egw-gray-700); cursor: pointer; }
.egw-segmented button[aria-pressed="true"] { background: var(--egw-surface); color: var(--egw-gray-950); font-weight: var(--egw-fw-semibold); box-shadow: var(--egw-shadow-raised); }

/* ---------- Filterbalk ---------- */
.egw-filterbar { display: grid; gap: var(--egw-s3); padding: var(--egw-s3) var(--egw-s4); }
.egw-filter-row { display: grid; grid-template-columns: minmax(220px, 2fr) repeat(3, minmax(150px, 1fr)) auto; gap: var(--egw-s3); align-items: end; }
.egw-chips { display: flex; flex-wrap: wrap; align-items: center; gap: var(--egw-s2); }
.egw-chip { display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0 4px 0 10px; border-radius: var(--egw-radius-pill); background: var(--egw-blue-50); border: 1px solid var(--egw-blue-100); color: var(--egw-blue-700); font-size: var(--egw-fs-12); font-weight: var(--egw-fw-semibold); }
.egw-chip button { display: grid; place-items: center; width: 18px; height: 18px; border-radius: 50%; border: 0; background: none; color: inherit; cursor: pointer; }
.egw-chip button:hover { background: var(--egw-blue-100); }

/* ---------- Lade (meer filters) ---------- */
.egw-drawer { position: fixed; inset: 0 0 0 auto; width: min(420px, 100vw); z-index: 70; background: var(--egw-surface); box-shadow: var(--egw-shadow-dialog); display: grid; grid-template-rows: auto 1fr auto; transform: translateX(105%); transition: transform .2s ease; }
.egw-drawer[data-open] { transform: none; }
.egw-drawer-header, .egw-drawer-footer { padding: var(--egw-s4); display: flex; align-items: center; justify-content: space-between; gap: var(--egw-s2); border-bottom: 1px solid var(--egw-border); }
.egw-drawer-footer { border-top: 1px solid var(--egw-border); border-bottom: 0; }
.egw-drawer-body { padding: var(--egw-s4); overflow: auto; display: grid; gap: var(--egw-s4); align-content: start; }
.egw-drawer-body fieldset { border: 0; padding: 0; margin: 0; display: grid; gap: var(--egw-s3); }
.egw-drawer-body legend { font-weight: var(--egw-fw-semibold); margin-bottom: var(--egw-s2); }
.egw-overlay { position: fixed; inset: 0; z-index: 60; background: rgba(7,17,34,.35); display: none; }
.egw-overlay[data-open] { display: block; }

/* ---------- Tabel ---------- */
.egw-table-wrap { overflow: auto; border-top: 1px solid var(--egw-border); }
.egw-table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: var(--egw-fs-14); }
.egw-table th { position: sticky; top: 0; z-index: 1; background: var(--egw-gray-50); text-align: left; font-size: var(--egw-fs-12); font-weight: var(--egw-fw-semibold); color: var(--egw-gray-600); padding: 10px 12px; border-bottom: 1px solid var(--egw-border); white-space: nowrap; }
.egw-table th button { all: unset; cursor: pointer; display: inline-flex; gap: 4px; align-items: center; }
.egw-table th[aria-sort] button { color: var(--egw-gray-950); }
.egw-table td { padding: 10px 12px; border-bottom: 1px solid var(--egw-gray-100); vertical-align: middle; }
.egw-table tbody tr:hover td { background: var(--egw-blue-50); }
.egw-table--compact td { padding: 6px 12px; }
.egw-cell-title { font-weight: var(--egw-fw-semibold); color: var(--egw-gray-950); }
.egw-cell-title:hover { color: var(--egw-primary); }
.egw-cell-sub { display: block; font-size: var(--egw-fs-12); color: var(--egw-text-subtle); }
.egw-row-actions { display: flex; gap: 4px; justify-content: flex-end; }
.egw-table-footer { display: flex; justify-content: space-between; align-items: center; gap: var(--egw-s3); padding: var(--egw-s3) var(--egw-s4); color: var(--egw-text-muted); font-size: var(--egw-fs-13); }

/* ---------- Lege toestand ---------- */
.egw-empty { display: grid; justify-items: center; gap: var(--egw-s2); padding: var(--egw-s7) var(--egw-s4); text-align: center; color: var(--egw-text-muted); }
.egw-empty .egw-empty-icon { width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; background: var(--egw-gray-100); color: var(--egw-gray-500); }

/* ---------- Tabs ---------- */
.egw-tabs { display: flex; gap: 2px; border-bottom: 1px solid var(--egw-border); overflow-x: auto; }
.egw-tabs a, .egw-tabs button { padding: 10px 14px; color: var(--egw-gray-600); font: inherit; font-weight: var(--egw-fw-semibold); background: none; border: 0; border-bottom: 2px solid transparent; margin-bottom: -1px; cursor: pointer; white-space: nowrap; }
.egw-tabs [aria-selected="true"] { color: var(--egw-primary); border-bottom-color: var(--egw-primary); }
.egw-tabs a:hover, .egw-tabs button:hover { color: var(--egw-gray-950); text-decoration: none; }
.egw-tab-count { margin-left: 6px; color: var(--egw-text-subtle); font-weight: var(--egw-fw-regular); }

/* ---------- KPI-tegel ---------- */
.egw-kpi { display: grid; gap: 6px; padding: var(--egw-s4); color: inherit; position: relative; }
.egw-kpi:hover { text-decoration: none; border-color: var(--egw-blue-500); }
.egw-kpi-label { display: flex; align-items: center; justify-content: space-between; gap: 8px; color: var(--egw-gray-600); font-weight: var(--egw-fw-semibold); font-size: var(--egw-fs-13); }
.egw-kpi-value { font-size: var(--egw-fs-28); font-weight: var(--egw-fw-bold); color: var(--egw-gray-950); letter-spacing: -.5px; }
.egw-kpi-context { font-size: var(--egw-fs-12); color: var(--egw-text-muted); }
.egw-kpi-link { font-size: var(--egw-fs-13); font-weight: var(--egw-fw-semibold); color: var(--egw-primary); }
.egw-kpi--attention { border-left: 3px solid var(--egw-warning-border); }
.egw-kpi--danger { border-left: 3px solid #e57373; }

/* ---------- Lijstje (werk) ---------- */
.egw-list { list-style: none; margin: 0; padding: 0; }
.egw-list li { display: grid; grid-template-columns: auto 1fr auto; gap: var(--egw-s3); align-items: center; padding: 10px var(--egw-s4); border-top: 1px solid var(--egw-gray-100); }
.egw-list li:first-child { border-top: 0; }
.egw-date { display: grid; place-items: center; width: 44px; height: 44px; border-radius: var(--egw-radius); background: var(--egw-gray-100); line-height: 1.05; }
.egw-date strong { font-size: var(--egw-fs-16); }
.egw-date small { font-size: 10px; text-transform: uppercase; color: var(--egw-text-subtle); }
.egw-date--late { background: var(--egw-danger-bg); color: var(--egw-danger-text); }
.egw-date--today { background: var(--egw-blue-100); color: var(--egw-blue-700); }

/* ---------- Sleutel-waarde ---------- */
.egw-kv { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 6px var(--egw-s4); margin: 0; }
.egw-kv dt { color: var(--egw-text-muted); font-size: var(--egw-fs-13); }
.egw-kv dd { margin: 0; font-weight: var(--egw-fw-semibold); min-width: 0; overflow-wrap: anywhere; }
.egw-kv .egw-unknown { color: var(--egw-text-subtle); font-weight: var(--egw-fw-regular); font-style: italic; }
/* ---------- Contextkop ---------- */
.egw-context { position: sticky; top: var(--egw-shell-h); z-index: 20; background: var(--egw-surface); border-bottom: 1px solid var(--egw-border); box-shadow: 0 4px 12px rgba(16,24,40,.04); }
.egw-context-inner { max-width: var(--egw-page-wide); margin: 0 auto; padding: var(--egw-s3) var(--egw-s5); display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: var(--egw-s5); align-items: center; }
.egw-context-identity { display: grid; gap: 2px; min-width: 0; }
.egw-context-identity h1 { font-size: var(--egw-fs-18); display: flex; align-items: center; gap: var(--egw-s2); flex-wrap: wrap; }
.egw-context-meta { display: flex; flex-wrap: wrap; gap: 4px 14px; color: var(--egw-text-muted); font-size: var(--egw-fs-13); }
.egw-context-stat { display: grid; gap: 2px; padding-left: var(--egw-s5); border-left: 1px solid var(--egw-border); }
.egw-context-stat small { font-size: var(--egw-fs-12); color: var(--egw-text-subtle); text-transform: uppercase; letter-spacing: .4px; }
.egw-context-stat strong { font-size: var(--egw-fs-16); }

/* ---------- Volgende stap ---------- */
.egw-next { display: grid; grid-template-columns: auto 1fr auto; gap: var(--egw-s4); align-items: center; padding: var(--egw-s4); border-radius: var(--egw-radius); background: linear-gradient(90deg, var(--egw-blue-50), #f2fbfa); border: 1px solid var(--egw-blue-100); }
.egw-next-icon { width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; background: var(--egw-primary); color: #fff; }
.egw-next small { color: var(--egw-blue-700); font-weight: var(--egw-fw-bold); font-size: var(--egw-fs-12); text-transform: uppercase; letter-spacing: .5px; }

/* ---------- Voortgangsstappen ---------- */
.egw-steps { display: flex; gap: 0; list-style: none; margin: 0; padding: 0; counter-reset: s; overflow-x: auto; }
.egw-steps li { flex: 1; min-width: 120px; display: grid; gap: 6px; padding: 0 8px 0 0; font-size: var(--egw-fs-12); color: var(--egw-text-muted); }
.egw-steps li::before { content: ""; height: 4px; border-radius: 2px; background: var(--egw-gray-200); }
.egw-steps li[data-state="done"]::before { background: var(--egw-green-500); }
.egw-steps li[data-state="current"]::before { background: var(--egw-primary); }
.egw-steps li[data-state="current"] { color: var(--egw-gray-950); font-weight: var(--egw-fw-semibold); }

/* ---------- Responsief (componenten) ---------- */
@media (max-width: 1024px) {
  .egw-filter-row { grid-template-columns: 1fr 1fr; }
  .egw-filter-row > .egw-field:first-child { grid-column: 1 / -1; }
  .egw-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .egw-grid--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .egw-context-inner { grid-template-columns: 1fr auto; }
  .egw-context-stat:last-child { display: none; }
  .egw-hide-md { display: none; }
}
@media (max-width: 640px) {
  .egw-page { padding: var(--egw-s4) var(--egw-s3) var(--egw-s7); }
  .egw-filter-row { grid-template-columns: 1fr; }
  .egw-filter-row > .egw-field[data-mobiel="lade"] { display: none; }
  .egw-grid--2, .egw-grid--3, .egw-grid--4, .egw-grid--main { grid-template-columns: minmax(0, 1fr); }
  .egw-hide-sm { display: none; }
  .egw-context-inner { grid-template-columns: 1fr; padding: var(--egw-s3); gap: var(--egw-s2); }
  .egw-context-stat { display: none; }
  .egw-next { grid-template-columns: 1fr; }
  .egw-next-icon { display: none; }
  .egw-table-wrap--cards thead { display: none; }
  .egw-table-wrap--cards tr { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 8px; padding: 10px 12px; border-bottom: 1px solid var(--egw-gray-100); }
  .egw-table-wrap--cards td { padding: 0; border: 0; }
  .egw-table-wrap--cards td[data-mobile="hide"] { display: none; }
  .egw-page-header { align-items: flex-start; }
  .egw-list li { grid-template-columns: auto minmax(0, 1fr); }
  .egw-list li > .egw-actions { grid-column: 2; }
  .egw-alert { grid-template-columns: 20px minmax(0, 1fr); }
  .egw-alert > .egw-btn { grid-column: 2; justify-self: start; }
  .egw-segmented { flex-wrap: wrap; }
  .egw-grid--4:has(.egw-kpi) { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--egw-s3); }
  .egw-kpi { padding: var(--egw-s3); }
  .egw-kpi-value { font-size: var(--egw-fs-22); }
}
/* ===================== Schermen (CC) ===================== */
/* Algemeen: chips met link, segmentkeuze met radio's, sorteerkoppen, lade open */
.egw-chip a { display: grid; place-items: center; width: 18px; height: 18px; border-radius: 50%; color: inherit; }
.egw-chip a:hover { background: var(--egw-blue-100); text-decoration: none; }
.egw-chip .egw-icon { width: 12px; height: 12px; }
.egw-segmented .egw-segment { position: relative; display: inline-flex; }
.egw-segmented .egw-segment input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.egw-segmented .egw-segment span { display: inline-flex; align-items: center; height: 30px; padding: 0 12px; border-radius: 3px; font-size: var(--egw-fs-13); color: var(--egw-gray-700); }
.egw-segmented .egw-segment input:checked + span { background: var(--egw-surface); color: var(--egw-gray-950); font-weight: var(--egw-fw-semibold); box-shadow: var(--egw-shadow-raised); }
.egw-segmented .egw-segment input:focus-visible + span { outline: 2px solid var(--egw-focus); }
.egw-check { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border: 1px solid var(--egw-border); border-radius: var(--egw-radius-pill); font-size: var(--egw-fs-13); cursor: pointer; background: var(--egw-surface); }
.egw-check:has(input:checked) { border-color: var(--egw-primary); background: var(--egw-blue-50); color: var(--egw-blue-700); }
.egw-th-sort { color: inherit; display: inline-flex; align-items: center; gap: 4px; }
.egw-th-sort:hover { color: var(--egw-gray-950); text-decoration: none; }
.egw-table th[aria-sort] .egw-th-sort { color: var(--egw-gray-950); }
.egw-th-sort .egw-icon { width: 12px; height: 12px; opacity: .6; }
.egw-icon--omlaag { transform: rotate(180deg); }
body.egw-lade-open { overflow: hidden; }
.egw-drawer-header h2 { font-size: var(--egw-fs-18); }
.egw-drawer { z-index: 1001; }
.egw-overlay { z-index: 1000; }

/* Relatieoverzicht */
.egw-relaties { display: grid; gap: 0; }
.egw-relaties .egw-page-header { margin-bottom: var(--egw-s4); }
.egw-relaties-kolommen { display: flex; align-items: center; gap: var(--egw-s2); margin: 0; }
.egw-relaties-kolommen .egw-label { font-size: var(--egw-fs-13); white-space: nowrap; }
.egw-relaties-kolommen .egw-select { width: auto; min-width: 150px; }
.egw-relaties-kaart { overflow: hidden; }
.egw-relaties-kaart .egw-filterbar { border-bottom: 1px solid var(--egw-border); }
.egw-relaties-samenvatting { border-bottom: 1px solid var(--egw-border); }
.egw-relaties .egw-table-wrap { border-top: 0; }
.egw-relaties .relation-col-acties { width: 1%; white-space: nowrap; }
.egw-relaties .relation-row-actions form { margin: 0; }
.egw-relaties .relation-cell-company { min-width: 220px; }
.egw-relaties .egw-table td .egw-badge { max-width: 260px; overflow: hidden; text-overflow: ellipsis; }
.egw-relaties .relation-load-more { border-top: 1px solid var(--egw-border); }
@media (max-width: 640px) {
  .egw-relaties-kolommen .egw-select { min-width: 0; }
  .egw-relaties .egw-filter-row { grid-template-columns: 1fr 1fr; }
  .egw-relaties .egw-filter-row > .egw-field:first-child, .egw-relaties .egw-filter-row > .egw-btn { grid-column: 1 / -1; }
  .egw-relaties .egw-table-wrap--cards tr { grid-template-columns: minmax(0, 1fr) auto; }
  .egw-relaties .egw-table-wrap--cards td.relation-col-acties { grid-column: 2; grid-row: 1 / span 3; align-self: center; }
}
/* Bestaande globale formulierstijlen (egwcrm.css/eggnium.css) hebben hogere specificiteit; nieuwe componenten winnen hier. */
input.egw-input:not([type="checkbox"]):not([type="radio"]):not([type="file"]), select.egw-select { height: 36px; min-height: 36px; padding: 0 10px; }
.egw-search input.egw-input:not([type="checkbox"]):not([type="radio"]):not([type="file"]) { padding-left: 34px; }
textarea.egw-textarea { padding: 8px 10px; }
.egw-field .egw-label, label.egw-label { font-weight: var(--egw-fw-semibold); font-size: var(--egw-fs-12); color: var(--egw-gray-700); margin: 0; }
.egw-page-header h1, .egw-page-header p, .egw-card-header h2, .egw-card-header h3 { margin: 0; }
.egw-table a, a.egw-btn, a.egw-cell-title, .egw-chips a, a.egw-back, a.egw-kpi { text-decoration: none; }
.egw-table a.egw-cell-title:hover { text-decoration: underline; }
.egw-table th.relation-col-acties, .egw-table td.relation-col-acties { position: sticky; right: 0; background: var(--egw-surface); box-shadow: -8px 0 8px -8px rgba(16,24,40,.18); }
.egw-table th.relation-col-acties { background: var(--egw-gray-50); z-index: 2; }
.egw-table tbody tr:hover td.relation-col-acties { background: var(--egw-blue-50); }
.egw-relaties .egw-table td { min-width: 90px; }
.egw-relaties .egw-table td.relation-col-laatste_activiteit, .egw-relaties .egw-table td.relation-col-volgende_taak { min-width: 150px; max-width: 220px; font-size: var(--egw-fs-13); }
@media (max-width: 640px) { .egw-table td.relation-col-acties { position: static; box-shadow: none; } .egw-relaties .egw-table td { min-width: 0; } }.egw-table th a.egw-th-sort, .egw-table th a.egw-th-sort:hover { text-decoration: none; }
@media (max-width: 640px) { .egw-relaties .egw-table-wrap--cards td { grid-column: 1; } .egw-relaties .egw-table-wrap--cards td.relation-col-acties { grid-column: 2; grid-row: 1 / span 4; align-self: start; } .egw-relaties .relation-row-actions { flex-direction: column; align-items: flex-end; } .egw-relaties .egw-filter-row > .egw-field:nth-child(4) { grid-column: 1 / -1; } }
@media (max-width: 640px) { .egw-table-wrap--cards table, .egw-table-wrap--cards tbody { display: block; width: 100%; } .egw-table-wrap--cards tr { width: 100%; } .egw-table-wrap--cards td .egw-badge { max-width: 100%; } }
@media (max-width: 640px) { .egw-relaties .relation-cell-company { min-width: 0; } }
@media (max-width: 640px) { .egw-relaties .egw-table td.relation-col-acties { width: auto; } }

/* Data-analysewerkplek */
.da-sticky-context { position: sticky; top: var(--egw-shell-h); z-index: 20; background: var(--egw-surface); border: 1px solid var(--egw-border); border-radius: var(--egw-radius); box-shadow: 0 4px 12px rgba(16,24,40,.06); margin: 0 0 var(--egw-s4); }
.da-sticky-context .egw-context-inner { max-width: none; padding: var(--egw-s3) var(--egw-s4); }
.da-sticky-context h1.da-name-row, .da-sticky-context h2.da-name-row { font-size: var(--egw-fs-18); display: flex; align-items: center; gap: var(--egw-s2); flex-wrap: wrap; margin: 0; }
.da-sticky-context a.egw-context-stat { color: inherit; text-decoration: none; }
.da-sticky-context a.egw-context-stat strong { color: var(--egw-primary); }
.da-sticky-context a.egw-context-stat:hover strong { text-decoration: underline; }
.egw-werkplek { background: none; border: 0; box-shadow: none; padding: 0; }
.egw-werkplek-body { display: grid; gap: var(--egw-s4); }
.egw-werkplek-stappen li { min-width: 140px; }
.egw-werkplek-tabs a { text-decoration: none; }
.egw-werkplek .egw-next h2 { font-size: var(--egw-fs-18); margin: 2px 0 4px; }
.egw-werkplek .egw-next p { margin: 0 0 4px; }
.egw-werkplek-daarna { font-size: var(--egw-fs-13); color: var(--egw-text-muted); }
.egw-werkplek .da-secondary-action { font-size: var(--egw-fs-13); font-weight: var(--egw-fw-semibold); padding: 0 8px; }
.egw-werkplek-inzicht ul, .egw-werkplek-kern ul { margin: 0; padding-left: 18px; display: grid; gap: 4px; }
.egw-werkplek-inzicht .egw-card-header h3, .egw-werkplek-kern .egw-card-header h3, .egw-werkplek-notities .egw-card-header h3 { display: flex; align-items: center; gap: 8px; font-size: var(--egw-fs-16); margin: 0; }
.egw-werkplek-model { display: grid; gap: 4px; }
.egw-werkplek-model .egw-section-title { margin: var(--egw-s2) 0 0; justify-content: flex-start; }
.egw-werkplek-model .da-analysis-model { margin: 0; }
.egw-werkplek-kern { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: var(--egw-s4); align-items: start; }
.egw-werkplek-kern .egw-card-body { display: grid; gap: var(--egw-s3); }
.egw-werkplek-kern .da-card-summary { margin: 0; color: var(--egw-text-muted); font-size: var(--egw-fs-13); }
.egw-werkplek-kern .egw-kv dd { font-weight: var(--egw-fw-regular); }
.egw-werkplek-kern .da-open-tasks { background: var(--egw-warning-bg); border: 1px solid var(--egw-warning-border); border-radius: var(--egw-radius-sm); padding: 8px 10px; font-size: var(--egw-fs-13); }
.egw-werkplek-meer summary { cursor: pointer; color: var(--egw-primary); font-size: var(--egw-fs-13); font-weight: var(--egw-fw-semibold); }
.egw-werkplek-meer[open] summary { margin-bottom: 6px; }
.egw-werkplek-modeldetail { display: grid; gap: 4px; }
.egw-werkplek-modeldetail p { margin: 0; }
.egw-werkplek-notities .egw-textarea { min-height: 110px; }
.egw-werkplek .egw-section-title { margin: var(--egw-s3) 0 0; }
@media (max-width: 1024px) { .da-sticky-context .egw-context-inner { grid-template-columns: 1fr auto; } .da-sticky-context .egw-context-stat:last-child { display: grid; } .da-sticky-context .da-sticky-outcome { display: none; } }
@media (max-width: 640px) { .da-sticky-context { position: static; } .da-sticky-context .egw-context-inner { grid-template-columns: 1fr; } .da-sticky-context .egw-context-stat { display: none; } .egw-werkplek-kern { grid-template-columns: minmax(0, 1fr); } .egw-werkplek-stappen { display: none; } }.da-sticky-context { display: block; }
.da-sticky-context .egw-context-inner { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; width: 100%; }
.da-sticky-context .da-sticky-identity { max-width: none; width: auto; min-width: 0; display: grid; gap: 2px; }
.da-sticky-context .egw-context-stat { min-width: 0; }
.egw-werkplek-notities .da-final-note, .egw-werkplek-notities .da-general-memo { width: auto; max-width: none; margin: 0; display: grid; }
.egw-werkplek-kern { grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); }
.egw-werkplek .da-analysis-intro { background: none; border: 0; padding: 0; }
@media (max-width: 1024px) { .da-sticky-context .egw-context-inner { grid-template-columns: minmax(0, 1fr) auto; } }
@media (max-width: 640px) { .da-sticky-context .egw-context-inner { grid-template-columns: minmax(0, 1fr); } .egw-werkplek-kern { grid-template-columns: minmax(0, 1fr); } }
/* Belwerkplek (CC) */
.egw-belwerkplek { display: grid; gap: var(--egw-s4); }
.egw-belwerkplek .bw-context { position: sticky; top: var(--egw-shell-h); z-index: 20; border: 1px solid var(--egw-border); border-radius: var(--egw-radius); }
.egw-belwerkplek .bw-context .egw-context-inner { max-width: none; padding: var(--egw-s3) var(--egw-s4); }
.egw-belwerkplek .bw-context h1 { font-size: var(--egw-fs-18); display: flex; align-items: center; gap: var(--egw-s2); flex-wrap: wrap; margin: 0; }
.egw-belwerkplek .bw-context .egw-context-meta a { font-weight: var(--egw-fw-semibold); }
.bw-body { display: grid; gap: var(--egw-s4); }
.bw-call { display: flex; align-items: center; gap: var(--egw-s3); flex-wrap: wrap; padding: var(--egw-s3) var(--egw-s4); border-radius: var(--egw-radius); border: 1px solid var(--egw-border); background: var(--egw-surface); }
.bw-call-nummer { display: grid; gap: 2px; }
.bw-call-nummer strong { font-size: var(--egw-fs-18); }
.bw-call-nummer small { color: var(--egw-text-muted); font-size: var(--egw-fs-12); }
.bw-call .egw-actions { margin-left: auto; }
.bw-grid { align-items: start; }
.bw-zij { display: grid; gap: var(--egw-s4); align-content: start; }
.bw-zij .egw-card-header h2, .bw-afronden .egw-card-header h2, .bw-grid .egw-card-header h2, .bw-gesprek .egw-card-header h2 { font-size: var(--egw-fs-16); margin: 0; }
.bw-briefing { display: grid; gap: var(--egw-s4); }
.bw-regels { margin: 0; padding-left: 18px; display: grid; gap: 4px; }
.bw-regels .is-kritiek { color: var(--egw-danger-text); }
.bw-inline { display: inline; margin: 0; }
/* Gesprek: belscript links, belpaneel en zijkolom rechts — vast in het scherm i.p.v. zwevend */
.bw-gesprek { display: grid; grid-template-columns: minmax(0, 2fr) minmax(300px, 1fr); gap: var(--egw-s4); align-items: start; }
.bw-gesprek > .call-guidance, .bw-gesprek > .bw-zonder-script { grid-column: 1; grid-row: 1 / span 3; position: static; inset: auto; max-height: none; height: auto; overflow: visible; box-shadow: var(--egw-shadow-raised); border: 1px solid var(--egw-border); border-radius: var(--egw-radius); padding: var(--egw-s4); z-index: auto; }
.bw-gesprek > .call-guidance .guide-werkvlak { min-height: 420px; }
.bw-gesprek > .voice-call-dialog, .bw-gesprek > .voice-briefing-gate { grid-column: 2; position: static; inset: auto; width: auto; max-height: none; box-shadow: var(--egw-shadow-raised); border: 1px solid var(--egw-border); border-radius: var(--egw-radius); z-index: auto; }
.bw-gesprek > .voice-call-dialog[hidden] { display: none; }
.bw-gesprek > .voice-call-dialog iframe { width: 100%; min-height: 360px; border: 0; display: block; }
.bw-gesprek > .bw-zij { grid-column: 2; }
.bw-kladblok textarea { min-height: 120px; }
/* Afronden */
.bw-afronden { scroll-margin-top: calc(var(--egw-shell-h) + 120px); }
.bw-afrondformulier { display: grid; gap: var(--egw-s4); }
.bw-afrondformulier fieldset { border: 0; padding: 0; margin: 0; display: grid; gap: var(--egw-s2); }
.bw-afrondformulier .bw-volgende { border: 1px solid var(--egw-border); border-radius: var(--egw-radius); padding: var(--egw-s3) var(--egw-s4); }
.bw-reden { background: var(--egw-warning-bg); border: 1px solid var(--egw-warning-border) !important; border-radius: var(--egw-radius); padding: var(--egw-s3) var(--egw-s4) !important; }
.bw-keuzes { display: flex; flex-wrap: wrap; gap: var(--egw-s2); }
.bw-uitkomst { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: var(--egw-s2); }
.bw-uitkomst label { display: flex; gap: 8px; align-items: flex-start; padding: 10px 12px; border: 1px solid var(--egw-border); border-radius: var(--egw-radius); cursor: pointer; background: var(--egw-surface); font-weight: var(--egw-fw-semibold); font-size: var(--egw-fs-14); }
.bw-uitkomst label:has(input:checked) { border-color: var(--egw-primary); box-shadow: 0 0 0 3px rgba(23,77,175,.14); }
.bw-uitkomst small { display: block; color: var(--egw-text-muted); font-size: var(--egw-fs-12); font-weight: var(--egw-fw-regular); }
.bw-nog-een > summary { cursor: pointer; padding: 0 var(--egw-s4) var(--egw-s3); color: var(--egw-primary); font-weight: var(--egw-fw-semibold); }
.bw-tijdlijn li { grid-template-columns: auto minmax(0, 1fr); }
.bw-legacy { align-items: end; margin-top: var(--egw-s3); }
/* Compacte balk bij een openstaande belactie op andere schermen */
.egw-belbalk { position: fixed; right: 16px; bottom: 16px; z-index: 80; display: flex; align-items: center; gap: 10px; padding: 8px 10px 8px 14px; background: var(--egw-navy-900); color: #fff; border-radius: var(--egw-radius); box-shadow: var(--egw-shadow-dialog); font-size: var(--egw-fs-13); max-width: calc(100vw - 32px); }
.egw-belbalk .egw-icon { color: var(--egw-green-500); }
@media (max-width: 1024px) { .bw-gesprek { grid-template-columns: minmax(0, 1fr); } .bw-gesprek > * { grid-column: 1 !important; grid-row: auto !important; } }
@media (max-width: 640px) { .egw-belwerkplek .bw-context { position: static; } .bw-stappen { display: none; } .egw-belbalk { left: 16px; right: 16px; } }.bw-gesprek .guide-kop-titel { display: none; } .bw-gesprek .voice-call-dialog-heading { display: none; } .bw-gesprek > .voice-call-dialog::before { content: 'Belpaneel'; display: block; padding: var(--egw-s3) var(--egw-s4) 0; font-weight: 600; font-size: var(--egw-fs-16); color: var(--egw-gray-950); } .bw-gesprek .voice-panel-call-status { padding: 0 var(--egw-s4); white-space: pre-line; font-weight: 600; }
.dossier-bellen form { margin: 0; display: inline; } .dossier-bellen .belactie-call, .dossier-bellen summary.belactie-call { display: inline-flex; align-items: center; gap: 6px; height: 36px; padding: 0 14px; border-radius: var(--egw-radius-sm); border: 1px solid transparent; background: var(--egw-primary); color: #fff; font-weight: 600; cursor: pointer; } .dossier-bellen .belactie-call:hover { background: var(--egw-primary-hover); } .dossier-bellen .belactie-call svg { width: 16px; height: 16px; } .dossier-bellen .belactie-unavailable { opacity: .5; }
.bw-verwerking { list-style: none; margin: 0 0 var(--egw-s3); padding: 0; display: grid; gap: 6px; font-size: var(--egw-fs-14); } .bw-verwerking li::before { content: '○ '; color: var(--egw-text-subtle); } .bw-verwerking li[data-ok]::before { content: '✓ '; color: #15803d; } .bw-verwerking li[data-bezig]::before { content: '◐ '; color: var(--egw-primary); }

/* Gespreksbriefing (losse pagina vóór de belwerkplek) in EGGnium-stijl */
body.gb-body { background: var(--egw-bg); font-family: var(--egw-font); color: var(--egw-text); }
.gb { max-width: 1040px; margin: 0 auto; padding: var(--egw-s5) var(--egw-s4) var(--egw-s7); display: grid; gap: var(--egw-s4); }
.gb-kop { display: flex; justify-content: space-between; align-items: flex-end; gap: var(--egw-s4); flex-wrap: wrap; padding: var(--egw-s4) var(--egw-s5); background: var(--egw-surface); border: 1px solid var(--egw-border); border-radius: var(--egw-radius); box-shadow: var(--egw-shadow-raised); }
.gb-kop h1 { margin: 2px 0 0; font-size: var(--egw-fs-22); }
.gb-label { color: var(--egw-blue-700); font-weight: 700; font-size: var(--egw-fs-12); text-transform: uppercase; letter-spacing: .5px; }
.gb-meta { display: flex; gap: var(--egw-s5); margin: 0; }
.gb-meta div { display: grid; gap: 2px; }
.gb-meta dt { font-size: var(--egw-fs-12); color: var(--egw-text-subtle); text-transform: uppercase; letter-spacing: .4px; }
.gb-meta dd { margin: 0; font-weight: 600; }
.gb-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--egw-s4); }
.gb-blok { background: var(--egw-surface); border: 1px solid var(--egw-border); border-radius: var(--egw-radius); box-shadow: var(--egw-shadow-raised); padding: var(--egw-s4); }
.gb-blok h2 { font-size: var(--egw-fs-16); margin: 0 0 var(--egw-s3); }
.gb-regels { grid-column: 1 / -1; }
.gb-kwaliteit { background: var(--egw-info-bg); border-color: var(--egw-info-border); }
.gb-dossier { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 6px var(--egw-s4); margin: 0; }
.gb-dossier dt { color: var(--egw-text-muted); font-size: var(--egw-fs-13); }
.gb-dossier dd { margin: 0; font-weight: 600; }
.gb-acties { display: flex; align-items: center; gap: var(--egw-s3); flex-wrap: wrap; padding: var(--egw-s4) var(--egw-s5); background: var(--egw-surface); border: 1px solid var(--egw-border); border-radius: var(--egw-radius); position: sticky; bottom: var(--egw-s3); box-shadow: var(--egw-shadow-raised); }
.gb-acties .btn-primary { background: var(--egw-primary); border-color: var(--egw-primary); }
.gb-terug { margin-left: auto; }
@media (max-width: 760px) { .gb-grid { grid-template-columns: minmax(0, 1fr); } .gb-meta { flex-wrap: wrap; gap: var(--egw-s3); } }.egw-belkeuze { max-width: 960px; } .egw-belkeuze .egw-card-header h2 { display: flex; align-items: center; gap: 8px; font-size: var(--egw-fs-16); margin: 0; } .egw-belkeuze form { margin: 0; } .egw-belkeuze .egw-card-body { display: grid; gap: var(--egw-s3); }

/* Dashboard */
.egw-dashboard { display: grid; gap: var(--egw-s4); }
.egw-dashboard .egw-page-header { margin-bottom: 0; }
.egw-dashboard .dashboard-scope-filter { margin: 0; }
.egw-dashboard .dashboard-scope-filter fieldset, .egw-dashboard .dashboard-portfolio-filter fieldset { margin: 0; }
.egw-dashboard-meldingen { display: grid; gap: var(--egw-s3); }
.egw-dashboard-meldingen:empty { display: none; }
.egw-dashboard .egw-alert { grid-template-columns: 20px 1fr auto; align-items: center; }
.egw-dashboard .egw-kpi { text-decoration: none; }
.egw-dashboard .egw-kpi:hover { border-color: var(--egw-blue-500); }
.egw-dashboard .egw-kpi-value small { font-size: var(--egw-fs-14); font-weight: 600; color: var(--egw-text-muted); }
.egw-dashboard-werk { align-items: start; }
.egw-dashboard-werk .egw-card-header h2, .egw-dashboard .egw-card-header h2 { font-size: var(--egw-fs-18); margin: 0; }
.egw-dashboard .egw-card-header { padding-bottom: var(--egw-s3); }
.egw-dashboard .egw-list .egw-actions form { margin: 0; }
.egw-dashboard-recent li { grid-template-columns: 0 minmax(0, 1fr) auto; }
.egw-dashboard .egw-table-footer { border-top: 1px solid var(--egw-gray-100); }
.egw-dashboard .dashboard-portfolio { display: grid; gap: var(--egw-s3); }
.egw-dashboard .dashboard-portfolio .egw-section-title { margin: var(--egw-s3) 0 0; align-items: flex-end; flex-wrap: wrap; }
.egw-dashboard .dashboard-portfolio-kop { margin: var(--egw-s2) 0 0; font-size: var(--egw-fs-13); }
@media (max-width: 640px) { .egw-dashboard .egw-alert { grid-template-columns: 20px minmax(0, 1fr); } .egw-dashboard .egw-alert > .egw-btn { grid-column: 2; justify-self: start; } }.egw-dashboard .dashboard-grid--werkvoorraad { grid-template-columns: repeat(auto-fit, minmax(205px, 1fr)); } .egw-dashboard .dashboard-grid--werkvoorraad .dashboard-tile-description { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } @media (max-width: 640px) { .egw-dashboard .dashboard-grid--werkvoorraad { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
/* Lijstschermen (Belvoorraad, Taken, Kandidaten, …) */ .egw-lijstscherm { display: grid; gap: 0; } .egw-lijstscherm > .egw-card { overflow: hidden; } .egw-lijstscherm .egw-filterbar { border-bottom: 1px solid var(--egw-border); } .egw-filter-row--kort { grid-template-columns: minmax(240px, 480px) auto; } .egw-filter-row--beheer { grid-template-columns: repeat(4, minmax(140px, 1fr)) auto auto; } .egw-lijst-samenvatting { border-bottom: 1px solid var(--egw-border); } .egw-lijstscherm .egw-table-wrap { border-top: 0; } .egw-lijstscherm button.egw-cell-title { all: unset; cursor: pointer; font-weight: 600; color: var(--egw-gray-950); } .egw-lijstscherm button.egw-cell-title:hover { color: var(--egw-primary); text-decoration: underline; } .egw-lijstscherm form { margin: 0; } .egw-lijstscherm .egw-row-actions form { display: inline; } @media (max-width: 1024px) { .egw-filter-row--beheer { grid-template-columns: 1fr 1fr; } } @media (max-width: 640px) { .egw-filter-row--kort, .egw-filter-row--beheer { grid-template-columns: 1fr; } .egw-lijstscherm .egw-table-wrap--cards td { grid-column: 1; } .egw-lijstscherm .egw-table-wrap--cards td:last-child { grid-column: 2; grid-row: 1 / span 3; align-self: start; } }

/* Taken */
.egw-takenscherm { display: grid; gap: var(--egw-s4); }
.egw-takenscherm .egw-page-header { margin: 0; }
.egw-takenscherm .egw-segmented a { display: inline-flex; align-items: center; height: 30px; padding: 0 12px; border-radius: 3px; color: var(--egw-gray-700); font-size: var(--egw-fs-13); text-decoration: none; }
.egw-takenscherm .egw-segmented a.is-actief { background: var(--egw-surface); color: var(--egw-gray-950); font-weight: 600; box-shadow: var(--egw-shadow-raised); }
.egw-takenscherm .taken-schakel form { margin: 0; }
.egw-takenscherm .taken-tellers .egw-chip { text-decoration: none; padding-right: 10px; }
.egw-takenscherm .taken-tellers .egw-chip.is-te-laat { background: var(--egw-danger-bg); border-color: var(--egw-danger-border); color: var(--egw-danger-text); }
.egw-takenscherm .taken-sectie { padding: 0; }
.egw-takenscherm .taken-sectie > h2, .egw-takenscherm .taken-afgesloten > summary { font-size: var(--egw-fs-16); margin: 0; padding: var(--egw-s3) var(--egw-s4); border-bottom: 1px solid var(--egw-border); }
.egw-takenscherm .taken-sectie.is-focus { border-color: var(--egw-primary); box-shadow: 0 0 0 3px rgba(23,77,175,.12); }
.egw-takenscherm .taken-afgesloten > p { padding: var(--egw-s3) var(--egw-s4) 0; margin: 0; }
.egw-takenscherm .taak-rij { display: grid; grid-template-columns: 130px minmax(0, 1fr) auto; gap: var(--egw-s3); align-items: start; padding: var(--egw-s3) var(--egw-s4); border-top: 1px solid var(--egw-gray-100); }
.egw-takenscherm .taken-sectie > h2 + .taak-rij { border-top: 0; }
.egw-takenscherm .taak-dag { display: grid; gap: 2px; font-size: var(--egw-fs-13); }
.egw-takenscherm .taak-dag strong { font-size: var(--egw-fs-14); }
.egw-takenscherm .taak-dag span { color: var(--egw-text-subtle); font-size: var(--egw-fs-12); }
.egw-takenscherm .taak-dag.is-te-laat strong { color: var(--egw-danger-text); }
.egw-takenscherm .taak-titel { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; font-weight: 600; }
.egw-takenscherm .taak-context { display: flex; gap: 6px; flex-wrap: wrap; font-size: var(--egw-fs-13); margin-top: 4px; }
.egw-takenscherm .taak-context a { font-weight: 600; }
.egw-takenscherm .taak-meta { font-size: var(--egw-fs-12); margin-top: 2px; color: var(--egw-text-subtle); }
.egw-takenscherm .taak-acties { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; justify-content: flex-end; }
.egw-takenscherm .taak-acties form { margin: 0; }
.egw-takenscherm .taak-belactie { display: flex; gap: 6px; align-items: center; }
.egw-takenscherm .taak-belactie .belactie-call { display: inline-flex; align-items: center; gap: 6px; height: 30px; padding: 0 10px; border-radius: var(--egw-radius-sm); background: var(--egw-primary); color: #fff; border: 0; font-weight: 600; font-size: var(--egw-fs-13); cursor: pointer; }
.egw-takenscherm .taak-actie-label, .egw-takenscherm .taak-actie-uitleg { color: var(--egw-text-muted); font-size: var(--egw-fs-12); max-width: 180px; }
.egw-takenscherm .taak-meer summary { list-style: none; }
.egw-takenscherm .taak-meer summary::-webkit-details-marker { display: none; }
.egw-takenscherm .taak-meer-paneel { display: grid; gap: 8px; margin-top: 6px; padding: 10px; border: 1px solid var(--egw-border); border-radius: var(--egw-radius); background: var(--egw-gray-50); }
.egw-takenscherm .taak-meer-paneel form { display: flex; gap: 6px; align-items: flex-end; flex-wrap: wrap; }
.egw-takenscherm .taken-leeg { color: var(--egw-text-muted); font-size: var(--egw-fs-13); padding: var(--egw-s3) var(--egw-s4); }
@media (max-width: 760px) { .egw-takenscherm .taak-rij { grid-template-columns: 1fr; } .egw-takenscherm .taak-acties { justify-content: flex-start; } }.egw-takenscherm .taak-belactie form { margin: 0; display: inline-flex; } .egw-takenscherm .taak-belactie .belactie-call { width: auto; min-width: 0; white-space: nowrap; overflow: visible; } .egw-takenscherm .taak-belactie .belactie-call span { display: inline; } .egw-takenscherm .taak-context a { text-decoration: none; }
.egw-takenscherm .taak-belactie .belactie-call, .egw-takenscherm .taak-belactie .belactie-call span { font-size: var(--egw-fs-13); line-height: 1; } .egw-takenscherm .taak-belactie .belactie-call svg { width: 14px; height: 14px; }
.egw-filter-row--da { grid-template-columns: minmax(200px, 1.3fr) repeat(3, minmax(140px, 1fr)) minmax(200px, 1.3fr) auto; } .egw-da-werkvoorraad .egw-da-model { margin: 0; padding: var(--egw-s3) var(--egw-s4); border-bottom: 1px solid var(--egw-border); color: var(--egw-text-muted); } .egw-da-werkvoorraad .datascout-run-selection { margin: var(--egw-s3) var(--egw-s4); } .egw-da-bulk { padding: var(--egw-s3) var(--egw-s4); border-bottom: 1px solid var(--egw-border); display: grid; gap: var(--egw-s3); background: var(--egw-gray-50); } .egw-da-bulk h2 { font-size: var(--egw-fs-16); margin: 0; } .egw-da-bulk .datascout-bulk-form { display: flex; gap: var(--egw-s2); align-items: center; flex-wrap: wrap; } @media (max-width: 1024px) { .egw-filter-row--da { grid-template-columns: 1fr 1fr; } } @media (max-width: 640px) { .egw-filter-row--da { grid-template-columns: 1fr; } }
.egw-field--inline { display: inline-flex; align-items: center; gap: 8px; } .egw-field--inline .egw-select { width: auto; }
/* Formulierschermen */ .egw-formulierscherm { display: grid; gap: var(--egw-s4); max-width: 960px; } .egw-formulierscherm .egw-page-header { margin: 0; } .egw-formulier { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--egw-s4); } .egw-formulier > label { display: grid; gap: 4px; font-weight: 600; font-size: var(--egw-fs-13); color: var(--egw-gray-700); } .egw-formulier > label:has(textarea) { grid-column: 1 / -1; } .egw-formulier-acties { grid-column: 1 / -1; display: flex; justify-content: flex-end; gap: var(--egw-s2); border-top: 1px solid var(--egw-border); padding-top: var(--egw-s3); } @media (max-width: 640px) { .egw-formulier { grid-template-columns: 1fr; } } /* Campagnes */ .egw-campagne { display: grid; gap: var(--egw-s4); } .egw-campagne .egw-page-header { margin: 0; } .egw-campagne .campaign-card h2 { font-size: var(--egw-fs-16); margin: 0 0 var(--egw-s3); } .egw-campagne .egw-next { grid-template-columns: auto 1fr auto; } .campaigns-overview .campaigns-controls { display: flex; gap: var(--egw-s3); align-items: end; flex-wrap: wrap; border-bottom: 1px solid var(--egw-border); } .campaigns-overview .egw-table-wrap { border-top: 0; } .campaigns-overview .campaigns-legend { margin-top: var(--egw-s3); }

/* Relatiedetail (dossier) */
.egw-dossier { background: none; border: 0; box-shadow: none; padding: 0; display: grid; gap: var(--egw-s4); }
.egw-dossier > .dossier-header { position: sticky; top: var(--egw-shell-h); z-index: 20; background: var(--egw-surface); border: 1px solid var(--egw-border); border-radius: var(--egw-radius); box-shadow: 0 4px 12px rgba(16,24,40,.06); padding: var(--egw-s3) var(--egw-s4) 0; margin: 0; }
.egw-dossier-kop { display: flex; justify-content: space-between; align-items: flex-end; gap: var(--egw-s4); flex-wrap: wrap; margin: 0 0 var(--egw-s2); padding: 0; border: 0; }
.egw-dossier-kop .detail-header { display: grid; gap: 2px; min-width: 0; }
.egw-dossier-kop h1 { font-size: var(--egw-fs-22); margin: 0; display: flex; align-items: center; gap: var(--egw-s2); flex-wrap: wrap; }
.egw-dossier-kop .detail-header-meta { display: flex; flex-wrap: wrap; gap: 4px 14px; color: var(--egw-text-muted); font-size: var(--egw-fs-13); margin: 0; }
.egw-dossier-kop .detail-header-meta strong { font-weight: 600; color: var(--egw-gray-700); }
.egw-dossier-kop > .actions { display: flex; gap: var(--egw-s2); flex-wrap: wrap; align-items: center; margin: 0; }
.egw-dossier-kop > .actions .btn { height: 36px; }
.egw-dossier .dossier-tabs.egw-tabs { border-bottom: 0; margin: 0 calc(-1 * var(--egw-s4)); padding: 0 var(--egw-s3); border-top: 1px solid var(--egw-border); gap: 0; }
.egw-dossier .dossier-tabs .dossier-tab { padding: 10px 12px; color: var(--egw-gray-600); font-weight: 600; text-decoration: none; border: 0; border-bottom: 2px solid transparent; border-radius: 0; background: none; white-space: nowrap; }
.egw-dossier .dossier-tabs .dossier-tab:hover { color: var(--egw-gray-950); }
.egw-dossier .dossier-tabs .dossier-tab.is-active { color: var(--egw-primary); border-bottom-color: var(--egw-primary); background: none; }
.egw-dossier .dossier-card, .egw-dossier .commercial-block, .egw-dossier .detail-section > .section-heading + *, .egw-dossier .relation-contact-card { border-radius: var(--egw-radius); }
.egw-dossier .dossier-card, .egw-dossier .commercial-block { background: var(--egw-surface); border: 1px solid var(--egw-border); box-shadow: var(--egw-shadow-raised); }
.egw-dossier .detail-section { background: none; border: 0; padding: 0; }
.egw-dossier .section-heading h2, .egw-dossier .dossier-card-heading h2 { font-size: var(--egw-fs-18); }
.egw-dossier .commercial-block h3 { font-size: var(--egw-fs-16); }
@media (max-width: 640px) { .egw-dossier > .dossier-header { position: static; } .egw-dossier-kop h1 { font-size: var(--egw-fs-18); } }.dossier-bellen .belactie-call, .dossier-bellen .belactie-call span { font-size: var(--egw-fs-14); line-height: 1; width: auto; min-width: 0; white-space: nowrap; overflow: visible; } .dossier-bellen .belactie-call { padding: 0 14px; }
/* Gespreksverslag */ .egw-gespreksverslag { display: grid; gap: var(--egw-s4); max-width: 1100px; } .egw-gespreksverslag .egw-page-header { margin: 0; } .egw-gv-kop { display: grid; gap: var(--egw-s3); } .egw-gespreksverslag > .panel { margin: 0; }
.egw-flash { display: grid; gap: var(--egw-s2); margin-bottom: var(--egw-s3); } .egw-flash:empty { display: none; } .egw-flash .egw-alert { margin: 0; align-items: center; } .egw-flash .egw-alert p { color: inherit; margin: 0; } .egw-flash .egw-alert--success { animation: egw-in .18s ease-out; }
.egw-segmented a { display: inline-flex; align-items: center; height: 30px; padding: 0 12px; border-radius: 3px; color: var(--egw-gray-700); font-size: var(--egw-fs-13); text-decoration: none; } .egw-segmented a.is-actief { background: var(--egw-surface); color: var(--egw-gray-950); font-weight: 600; box-shadow: var(--egw-shadow-raised); } .egw-omgeving .egw-page-header { margin-bottom: var(--egw-s3); } .egw-omgeving-modus { display: flex; align-items: center; gap: var(--egw-s3); flex-wrap: wrap; margin-bottom: var(--egw-s3); }
/* Werkplek-deelschermen: terug via de contextkop; de oude terugknop in de blokkop vervalt visueel */ .da-head > div:last-child > a.button-link, .dc-head > div:last-child > a.button-link, .datascout-review-header > div:last-child > a[data-egw-back] { display: none; } .da-head .datascout-position, .dc-head .datascout-position, .datascout-review-header .datascout-position { color: var(--egw-blue-700); font-size: var(--egw-fs-12); font-weight: 700; text-transform: uppercase; letter-spacing: .5px; margin: 0; } .da-head h1, .dc-head h1, .datascout-review-header h1 { font-size: var(--egw-fs-22); margin: 2px 0 0; display: flex; align-items: center; gap: 8px; }
.egw-relatieformulier { max-width: 1100px; } .egw-relatieformulier .message.error { margin: 0; }
/* EG-0146: brede tabellen scrollen binnen .table-wrap in plaats van de hele dossierpagina te verbreden (smal scherm). */
.egw-dossier .tabs-layout { grid-template-columns: minmax(0, 1fr); }
.egw-dossier .egw-dossier-kop { flex-wrap: wrap !important; min-width: 0; } .egw-dossier .egw-dossier-kop > .actions { flex-wrap: wrap !important; min-width: 0; max-width: 100%; } .egw-dossier > .dossier-header { max-width: 100%; overflow: hidden; } .egw-dossier .dossier-tabs { overflow-x: auto; }
/* Dossier: Commercieel */ .egw-commercieel .egw-section-title { margin-top: 0; } .egw-commercieel-raster { align-items: start; } .egw-commercieel-hoofd, .egw-commercieel-zij { display: grid; gap: var(--egw-s4); align-content: start; } .egw-commercieel .egw-card-header h3 { font-size: var(--egw-fs-16); margin: 0; } .egw-commercieel-form { display: grid; gap: var(--egw-s3); } .egw-commercieel-volgende { border: 1px solid var(--egw-border); border-radius: var(--egw-radius); padding: var(--egw-s3); margin: 0; } .egw-commercieel-acties { justify-content: flex-end; } .egw-traject { display: grid; gap: 4px; padding: var(--egw-s3) 0; border-top: 1px solid var(--egw-gray-100); } .egw-traject:first-child { border-top: 0; padding-top: 0; } .egw-traject-kop { display: flex; justify-content: space-between; gap: 8px; align-items: center; } .egw-traject .actions { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; margin: 4px 0 0; } .egw-traject.is-closed { opacity: .7; } .egw-commercieel-koppel { position: relative; } .egw-commercieel-koppel[open] > form { position: absolute; right: 0; top: calc(100% + 6px); z-index: 30; width: 300px; background: var(--egw-surface); border: 1px solid var(--egw-border); border-radius: var(--egw-radius); box-shadow: var(--egw-shadow-dialog); padding: var(--egw-s3); display: grid; gap: var(--egw-s2); } .egw-commercieel-koppel summary { list-style: none; } .egw-commercieel-koppel summary::-webkit-details-marker { display: none; } .egw-commercieel .commercial-more > summary { cursor: pointer; list-style: none; padding-bottom: var(--egw-s3); } .egw-commercieel .egw-list li form { margin: 0; }
.egw-dossier .egw-commercieel .commercial-block { padding: 0; } .egw-commercieel .commercial-context-list { display: block; }
/* EG-0149: Commercieel — formele overdracht uitklapbaar in de adviseurkaart, geopende campagnecontext gemarkeerd, analysekaart ingeklapt met zichtbare uitkomst. */ .egw-commercieel-gegevens { display: grid; gap: var(--egw-s3); } .egw-commercieel-gegevens > .entity-form { display: grid; gap: var(--egw-s3); margin: 0; } .egw-commercieel-details { border-top: 1px solid var(--egw-gray-100); padding-top: var(--egw-s2); } .egw-commercieel-details > summary { cursor: pointer; font-size: var(--egw-fs-14); font-weight: var(--egw-fw-semibold); color: var(--egw-gray-700); padding: 4px 0; } .egw-commercieel-details > summary:focus-visible, .egw-analysekaart--inklapbaar > summary:focus-visible { outline: 2px solid var(--egw-primary); outline-offset: 2px; } .egw-commercieel-details[open] > summary { margin-bottom: var(--egw-s2); } .egw-traject.is-context { background: var(--egw-gray-50); border-radius: var(--egw-radius-sm); box-shadow: inset 3px 0 0 var(--egw-primary); padding: var(--egw-s3) var(--egw-s3) var(--egw-s3) 12px; border-top-color: transparent; } .egw-traject.is-context + .egw-traject { border-top: 0; } .egw-analysekaart--inklapbaar > summary { cursor: pointer; list-style: none; } .egw-analysekaart--inklapbaar > summary::-webkit-details-marker { display: none; } .egw-analysekaart--inklapbaar > summary::after { content: '▸'; margin-left: auto; color: var(--egw-text-subtle); } .egw-analysekaart--inklapbaar[open] > summary::after { content: '▾'; } .egw-commercieel-velden { border: 0; padding: 0; margin: 0; min-width: 0; display: grid; gap: var(--egw-s3); } .egw-commercieel-velden[disabled] { opacity: .6; } .egw-commercieel-velden[disabled] .egw-btn { cursor: not-allowed; } .egw-commercieel-form > .egw-alert p { margin: 0 0 4px; } .egw-commercieel-form > .egw-help { margin: 0; } .egw-commercieel-toevoegen { margin-top: var(--egw-s3); } .egw-commercieel-toevoegen > form { display: grid; gap: var(--egw-s2); margin: 0; } .egw-commercieel-toevoegen > form .egw-help { margin: 0; }
.egw-analysekaart--inklapbaar > summary { padding-bottom: var(--egw-s4); } .egw-analysekaart--inklapbaar[open] > summary { padding-bottom: 0; } .egw-analysekaart--inklapbaar > summary > div { flex: 1 1 14rem; min-width: 0; }
.egw-modelbijdragen .da-model-supplement-list { display: grid; gap: var(--egw-s3); } .egw-modelbijdragen fieldset legend { font-weight: 600; padding: 0 4px; } .egw-modelbijdragen .da-model-supplement-fields { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: var(--egw-s3); }
/* Gespreksverslag: formulierdelen */ .egw-gespreksverslag { display: grid; gap: var(--egw-s4); } .egw-gv-blok { display: grid; gap: var(--egw-s3); } .egw-gv-blok h2, .egw-gv-blok h3 { font-size: var(--egw-fs-16); margin: var(--egw-s2) 0 0; } .egw-gespreksverslag .entity-form { display: grid; gap: var(--egw-s3); } .egw-gespreksverslag select, .egw-gespreksverslag input:not([type=checkbox]):not([type=hidden]), .egw-gespreksverslag textarea { width: 100%; min-height: 38px; padding: 7px 10px; border: 1px solid var(--egw-border-strong, var(--egw-border)); border-radius: var(--egw-radius-sm, 6px); background: var(--egw-surface); color: var(--egw-text); font: inherit; } .egw-gespreksverslag textarea { min-height: 96px; } .egw-gespreksverslag fieldset { border: 1px solid var(--egw-border); border-radius: var(--egw-radius); padding: var(--egw-s3); display: grid; gap: var(--egw-s2); } .egw-gespreksverslag legend { font-weight: 600; padding: 0 4px; } .egw-gv-acties { display: flex; gap: var(--egw-s2); flex-wrap: wrap; justify-content: flex-end; } .egw-gespreksverslag .conflict-card { border-top: 1px solid var(--egw-border); padding-top: var(--egw-s3); display: grid; gap: var(--egw-s2); }
.egw-gv-blok p { margin: 0; } .egw-gv-blok .egw-btn { width: auto; } .egw-gespreksverslag .entity-form > .egw-btn { justify-self: end; } .egw-gespreksverslag .egw-gv-blok .egw-gv-blok { box-shadow: none; background: var(--egw-gray-50, var(--egw-surface)); } .egw-gespreksverslag fieldset .form-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: var(--egw-s2); } .egw-gespreksverslag .egw-gv-acties .egw-btn--secondary:last-child { order: -1; margin-right: auto; }
/* Dossier: formulierknoppen niet over de volle breedte */ .egw-dossier .entity-form > .btn, .egw-dossier .entity-form > button[type=submit] { width: auto; justify-self: end; align-self: end; margin-left: auto; display: inline-flex; } .egw-dossier .sector-profile-form { display: grid; }
.egw-verslag-wacht { display: inline-flex; gap: 6px; align-items: center; margin: 4px 0 0; color: var(--egw-text-muted); } .egw-verslag-wacht svg { width: 14px; height: 14px; }
.egw-tip:focus .egw-tip-bubble { display: block; } /* ook bij tikken op touchscherm */
/* Audit 16-10: het hidden-attribuut wint altijd van componentweergave (bijv. .egw-alert { display: grid }). */ [hidden] { display: none !important; }

/* Analysekaart (belwerkplek, dossier; 20-10): alleen lezen. */ .egw-analysekaart { min-width: 0; overflow-wrap: anywhere; } .egw-analysekaart .egw-card-header { align-items: flex-start; flex-wrap: wrap; gap: .5rem .75rem; } .egw-analysekaart .egw-kv { grid-template-columns: minmax(0, 1fr); } .egw-analysekaart .egw-kv dt { margin-top: .5rem; } .egw-analysekaart h4.egw-label { display: block; margin: 1rem 0 .25rem; } .egw-analysekaart-lijst { margin: 0; padding-left: 1.1rem; } .egw-analysekaart-lijst li { margin: .15rem 0; overflow-wrap: anywhere; } .egw-analysekaart .egw-alert { margin-bottom: .75rem; } .egw-analysekaart dd .egw-cell-sub { display: block; margin-top: .15rem; }

/* EG-0108: Kandidaten-werkvoorraad — meescrollende actiebalk. Alle onderdelen op één regel: 36px hoog, verticaal gecentreerd, zonder de oude marges van label/select uit egwcrm.css. */ .egw-kandidaten > .egw-card { overflow: clip; } .egw-bulkbalk { position: sticky; bottom: 0; z-index: 15; display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-start; gap: var(--egw-s2) var(--egw-s4); min-height: 60px; background: var(--egw-surface); box-shadow: 0 -6px 16px rgba(16,24,40,.08); } .egw-bulkbalk-aantal { display: inline-flex; align-items: center; height: 36px; margin: 0; font-size: var(--egw-fs-14); font-weight: var(--egw-fw-semibold); line-height: 1; color: var(--egw-gray-700); white-space: nowrap; min-width: 8.5rem; } .egw-kandidaten .egw-lijst-samenvatting > span:first-child { white-space: nowrap; } .egw-bulkbalk-groep { display: flex; align-items: center; gap: var(--egw-s2); margin: 0; } .egw-bulkbalk-groep--hoofd { margin-left: auto; } .egw-bulkbalk label.egw-bulkbalk-veld { display: inline-flex; align-items: center; gap: var(--egw-s2); height: 36px; margin: 0; padding: 0; font-size: var(--egw-fs-14); font-weight: var(--egw-fw-semibold); line-height: 1; color: var(--egw-gray-700); } .egw-bulkbalk-label { line-height: 1; } .egw-bulkbalk select.egw-select { display: inline-block; width: auto; min-width: 9.5rem; height: 36px; min-height: 36px; margin: 0; padding: 0 10px; font-size: var(--egw-fs-14); line-height: 34px; vertical-align: middle; } .egw-bulkbalk .egw-btn { height: 36px; margin: 0; vertical-align: middle; } .egw-bulkbalk-hint { flex-basis: 100%; margin: 0; font-size: var(--egw-fs-12); line-height: 1.4; color: var(--egw-text-muted); } .egw-kandidaten .egw-kandidaten-select { width: 40px; text-align: center; } .egw-kandidaten .egw-kandidaten-select input { display: block; margin: 0 auto; width: 16px; height: 16px; } .egw-kandidaten .egw-kandidaten-redenen { margin-top: 4px; max-width: 26rem; white-space: normal; line-height: 1.35; } .egw-kandidaten .schermhulp-open-knop { margin-left: var(--egw-s2); } .egw-kandidaten .egw-row-actions { flex-wrap: wrap; align-items: center; } @media (max-width: 760px) { .egw-bulkbalk-groep--hoofd { margin-left: 0; } } @media (max-width: 640px) { .egw-bulkbalk { flex-direction: column; align-items: stretch; } .egw-bulkbalk-aantal { height: auto; min-width: 0; } .egw-bulkbalk-groep { flex-direction: column; align-items: stretch; } .egw-bulkbalk label.egw-bulkbalk-veld { display: grid; grid-template-columns: auto 1fr; } .egw-bulkbalk select.egw-select { width: 100%; } .egw-bulkbalk .egw-btn { width: 100%; } .egw-kandidaten .egw-table-wrap--cards tr { grid-template-columns: 28px minmax(0, 1fr) auto; } .egw-kandidaten .egw-table-wrap--cards td { grid-column: 2; } .egw-kandidaten .egw-table-wrap--cards td.egw-kandidaten-select { grid-column: 1; grid-row: 1 / span 4; align-self: start; width: auto; padding-top: 2px; } .egw-kandidaten .egw-table-wrap--cards td:last-child { grid-column: 3; grid-row: 1 / span 4; align-self: start; } }

/* EG-0143: relatiedossier — niet-actieve belknop met uitleg (Kandidaat), gemarkeerde campagnecontext, uitlegknop in de kop. */ .belactie-geblokkeerd:not(.relation-action-icon) { display: inline-flex; gap: 6px; align-items: center; width: auto; height: 36px; padding: 0 12px; border-radius: var(--egw-radius-sm); font-weight: var(--egw-fw-semibold); font-size: var(--egw-fs-14); white-space: nowrap; } .belactie-geblokkeerd svg { width: 16px; height: 16px; } .dossier-bellen .belactie-geblokkeerd { opacity: 1; } .egw-dossier .compact-list li.is-context { background: var(--egw-gray-50); border-radius: var(--egw-radius-sm); box-shadow: inset 3px 0 0 var(--egw-primary); padding-left: 8px; } .egw-dossier .compact-list li.is-context small { display: block; } .egw-dossier .detail-header-meta .schermhulp-open-knop { margin-left: auto; }

/* EG-0161: vestiging administratief aan ander bedrijf koppelen. */
.egw-vestiging-koppelen { display: grid; gap: var(--egw-s4); max-width: 60rem; }
.egw-vestiging-koppelen .egw-alert { display: block; }
.egw-vk-zoek { display: flex; flex-wrap: wrap; gap: var(--egw-s3); align-items: flex-end; }
.egw-vk-zoek .egw-field { flex: 1 1 18rem; min-width: 0; }
.egw-vk-resultaten { list-style: none; margin: var(--egw-s3) 0 0; padding: 0; display: grid; gap: var(--egw-s2); }
.egw-vk-resultaten li { padding: var(--egw-s2) var(--egw-s3); border: 1px solid var(--egw-gray-200); border-radius: var(--egw-radius); overflow-wrap: anywhere; }
.egw-vk-resultaten li.is-gekozen { border-color: var(--egw-brand-600, #1d4ed8); background: var(--egw-info-bg); }
.egw-vk-gekozen { display: flex; flex-wrap: wrap; gap: var(--egw-s3); align-items: center; justify-content: space-between; padding: var(--egw-s2) var(--egw-s3); border: 1px solid var(--egw-brand-600, #1d4ed8); border-radius: var(--egw-radius); background: var(--egw-info-bg); overflow-wrap: anywhere; }
.egw-vk-gekozen p { margin: 0; min-width: 0; }
.egw-vk-dl { display: grid; grid-template-columns: minmax(8rem, max-content) 1fr; gap: var(--egw-s2) var(--egw-s4); margin: 0 0 var(--egw-s4); }
.egw-vk-dl dd { margin: 0; }
.egw-vk-uitvoeren { display: grid; gap: var(--egw-s3); }
.egw-vk-leeg { border: 1px solid var(--egw-warning-border); background: var(--egw-warning-bg); border-radius: var(--egw-radius); padding: var(--egw-s3) var(--egw-s4); display: grid; gap: var(--egw-s2); }
@media (max-width: 600px) { .egw-vk-dl { grid-template-columns: 1fr; } }

/* EG-0159 (besluit 421): vaste campagnecontext in het Relaties-overzicht (campagnemodus). */
.egw-campagnecontext { display: flex; align-items: center; gap: var(--egw-s2); flex-wrap: wrap; margin: var(--egw-s2) 0 0; }

/* EG-0159: Commercieel — overzicht van campagnekoppelingen, elk afzonderlijk uitklapbaar; samenvatting laatste contact en volgende actie. */
.egw-commercieel > .egw-section-title { display: flex; justify-content: space-between; align-items: flex-start; gap: var(--egw-s3); flex-wrap: wrap; }
.egw-commercieel > .egw-section-title > div { flex: 1 1 24rem; min-width: 0; }
.egw-commercieel { display: grid; gap: var(--egw-s4); }
.egw-commercieel-samenvatting { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; gap: var(--egw-s3) var(--egw-s4); align-items: center; padding: var(--egw-s3) var(--egw-s4); background: var(--egw-surface); border: 1px solid var(--egw-border); border-radius: var(--egw-radius); }
.egw-commercieel-samenvatting > div { display: grid; gap: 2px; min-width: 0; }
.egw-commercieel-samenvatting strong { overflow-wrap: anywhere; }
.egw-commercieel-samenvatting-acties { display: flex !important; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.egw-koppelingen > .egw-card-body { display: grid; gap: var(--egw-s2); }
.egw-koppeling { border: 1px solid var(--egw-border); border-radius: var(--egw-radius-sm); background: var(--egw-surface); }
.egw-koppeling.is-context { box-shadow: inset 3px 0 0 var(--egw-primary); }
.egw-koppeling.is-closed > summary { opacity: .75; }
.egw-koppeling > summary { display: grid; grid-template-columns: minmax(0, 1.4fr) auto minmax(0, 1.6fr) 1rem; gap: 4px var(--egw-s3); align-items: center; padding: var(--egw-s2) var(--egw-s3); cursor: pointer; list-style: none; }
.egw-koppeling > summary::-webkit-details-marker { display: none; }
.egw-koppeling > summary::after { content: ""; width: 8px; height: 8px; border-right: 2px solid var(--egw-gray-500); border-bottom: 2px solid var(--egw-gray-500); transform: rotate(45deg); justify-self: end; transition: transform .15s; }
.egw-koppeling[open] > summary::after { transform: rotate(-135deg); }
.egw-koppeling > summary:hover, .egw-koppeling[open] > summary { background: var(--egw-gray-50); }
.egw-koppeling > summary:focus-visible { outline: 2px solid var(--egw-primary); outline-offset: -2px; }
.egw-koppeling-titel { display: grid; gap: 2px; min-width: 0; }
.egw-koppeling-titel .egw-cell-sub { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.egw-koppeling-meta { display: flex; flex-wrap: wrap; gap: 2px var(--egw-s3); font-size: var(--egw-fs-13); color: var(--egw-gray-700); min-width: 0; }
.egw-koppeling-inhoud { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--egw-s4); padding: var(--egw-s3) var(--egw-s4) var(--egw-s4); border-top: 1px solid var(--egw-gray-100); }
.egw-koppeling-kolom { display: grid; gap: var(--egw-s2); align-content: start; min-width: 0; }
.egw-koppeling-kolom > h4 { margin: var(--egw-s2) 0 0; }
.egw-koppeling-kolom > h4:first-child { margin-top: 0; }
.egw-koppeling-kolom > .entity-form { display: grid; gap: var(--egw-s3); margin: 0; }
.egw-koppeling-kolom .actions { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; margin: 0; }
.egw-koppeling-contact { margin: 0; }
.egw-koppeling-taken { margin: 0; }
.egw-koppeling-analyse { grid-column: 1 / -1; }
.egw-commercieel-bedrijf { margin: 0; }
@media (max-width: 900px) {
    .egw-commercieel-samenvatting { grid-template-columns: 1fr; }
    .egw-commercieel-samenvatting-acties { justify-content: flex-start; }
    .egw-koppeling > summary { grid-template-columns: minmax(0, 1fr) auto 1rem; }
    .egw-koppeling-meta { grid-column: 1 / 3; grid-row: 2; }
    .egw-koppeling > summary::after { grid-column: 3; grid-row: 1; }
    .egw-koppeling-inhoud { grid-template-columns: 1fr; padding: var(--egw-s3); }
}.egw-dossier .egw-contactmoment { margin-top: var(--egw-s5, 1.25rem); padding: 0; }
.egw-koppeling-naam { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; min-width: 0; }

/* EG-0027 (#445b/#472 D): vaste hulpingang rechtsboven met tekst; op smalle schermen alleen het pictogram. */
.egw-icon-btn.egw-help-btn { width: auto; display: inline-flex; align-items: center; gap: 6px; padding: 0 10px; font-weight: var(--egw-fw-semibold, 600); white-space: nowrap; }
@media (max-width: 1499px) { .egw-help-btn-tekst { display: none; } .egw-icon-btn.egw-help-btn { width: 36px; padding: 0; justify-content: center; } }
/* EG-0027 (#479): met het extra menu-item Belvoorraad (Systeemadmin) wordt het gebruikersblok eerder compact (alleen avatar), zodat het menu niet overlapt. */
@media (max-width: 1399px) { .egw-user-text { display: none; } }
/* EG-0170 (#505, stelsel §8): keuzes in Data-analyse als compacte keuzepillen op één regel; hele pil klikbaar, keuze ook zonder kleur herkenbaar (rand + vet). */
.datascout-radio-row, .dc-radios { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.datascout-radio-row label, .dc-radios label { display: inline-flex; align-items: center; gap: 6px; margin: 0; padding: 4px 10px; border: 1px solid var(--egw-border); border-radius: 999px; background: var(--egw-surface, #fff); font-size: 14px; line-height: 1.3; cursor: pointer; white-space: nowrap; }
.datascout-radio-row label:has(input:checked), .dc-radios label:has(input:checked) { border-color: var(--egw-primary); background: var(--egw-blue-50); color: var(--egw-blue-700); font-weight: var(--egw-fw-semibold, 600); }
.datascout-radio-row label:has(input:focus-visible), .dc-radios label:has(input:focus-visible) { outline: 2px solid var(--egw-primary); outline-offset: 2px; }
.datascout-radio-row input[type="radio"], .dc-radios input[type="radio"] { margin: 0; accent-color: var(--egw-primary); }
/* EG-0170 (#511-1, stelsel §10): in Data-analyse is gewone tekst minimaal 14 px. Alleen secundaire informatie
   (kleine stat-labels boven de kop-cijfers, statuspillen/-tags, kaartlegenda en hulptelling) blijft 12–13 px. */
.egw-werkplek-stappen li, .egw-context-meta, .egw-werkplek-daarna, .egw-werkplek .da-secondary-action, .da-secondary-action,
.egw-werkplek-kern .da-card-summary, .egw-werkplek-kern .da-open-tasks, .egw-werkplek-meer summary, .da-card-summary,
.datascout-facts dt, .da-facts dt, .datascout-inline-research, .datascout-radio-row, .datascout-parcel-bulk > strong, .datascout-parcel-bulk > [data-external-selected],
.da-insight-grid ul, .da-insight-grid li button, .da-insight-grid article:last-child li a, .datascout-commercial-nuance, .datascout-commercial-source,
.da-contact-card dl, .da-popover dl, .da-sources a, .da-potential-outcome dt, .da-next-step aside, .datascout-kvk-preview > summary span,
.da-sticky-identity p, .da-analysis-model span, .da-commercial-overview > a, .da-research-activity-context li > span:not(.datascout-commercial-tag),
.da-research-activity-context li > a, .datascout-progress-grid span { font-size: 14px; }
.datascout-counter-help { font-size: 12px; }

/* EG-0170 (#511, stelsel §10): Bedrijfsdossier — gewone tekst minimaal 14 px; tijdstempels en de KvK-veldactie blijven secundair.
   Het tabblad Sectorprofiel (branche/bedrijfsactiviteiten) is bewust uitgezonderd tot de beoordeling van EG-0169. */
.egw-dossier .egw-dossier-kop .detail-header-meta, .egw-dossier .egw-koppeling-meta, .egw-dossier .dossier-card-heading a,
.egw-dossier .activity-row .activity-vestiging, .egw-dossier .activity-row .activity-campagne,
.egw-dossier [data-dossier-tab]:not([data-dossier-tab="sectorprofiel"]) .status-list dt, .egw-dossier .dossier-overview .status-list dt { font-size: 14px; }

/* EG-0170 (#511-2): zichtbare opslagstatus van een autosave-onderdeel. */
.egw-autosave-status { margin: 0; font-size: 14px; color: var(--egw-text-subtle, #5b6576); }
.egw-autosave-status[data-state="saving"] { color: var(--egw-blue-700); }
.egw-autosave-status[data-state="error"] { color: #b42318; font-weight: var(--egw-fw-semibold, 600); }

/* EG-0170: de werkplek-tabbalk heeft een zichtbare focusrand voor toetsenbordgebruik. */
.egw-werkplek-tabs [role="tab"]:focus-visible { outline: 2px solid var(--egw-primary); outline-offset: -2px; }

/* EG-0027 (#479): zoekveld in Campagnes uitgelijnd met de filtervelden (label boven het veld, zelfde onderlijn). */
.campaigns-controls .campaigns-search { grid-template-columns: 1fr; gap: .18rem; align-self: end; padding: .4rem 0; font-weight: inherit; }

/* EG-0170 schermronde (stelsel §10, #505-4): Dashboard — tegeltekst, segmentkeuzes, kaartlinks en tabelkoppen minimaal 14 px;
   datumlabel in de lijst Vandaag (maand) is secundair en minimaal 12 px. */
.egw-dashboard .dashboard-tile-title, .egw-dashboard .dashboard-tile-description, .egw-dashboard .dashboard-tile-context, .egw-dashboard .dashboard-tile-link,
.egw-dashboard .egw-segment > span, .egw-dashboard .egw-card-header .egw-btn--sm, .egw-dashboard .egw-table th, .egw-dashboard .dashboard-portfolio-kop { font-size: 14px; }
.egw-date small { font-size: 12px; }/* EG-0170 schermronde: kleine knoppen en de tabelvoet bevatten gewone tekst; overal minimaal 14 px. */
.egw-btn--sm, .egw-table-footer, .egw-table-footer a { font-size: 14px; }/* EG-0170 schermronde (stelsel §10): veldlabels, keuzepillen, terugknop en tabelkoppen zijn gewone tekst; overal minimaal 14 px. */
.egw-back, .egw-label, .egw-field .egw-label, label.egw-label, .egw-relaties-kolommen .egw-label, .egw-check, .egw-formulier > label,
.egw-table th, .egw-th-sort, .data-table th, .relation-table th, .relation-filter-form label > span, .relation-filter-static > span { font-size: 14px; }/* EG-0170 schermronde: segmentkeuzes (filters/weergave) en formulierlabels van het inlog-/wachtwoordscherm minimaal 14 px. */
.egw-segmented .egw-segment span, .egw-segmented a, .egw-segmented button, .auth-panel label { font-size: 14px; }/* EG-0170 schermronde: bronknoppen in het dossier (Website, KvK, Google) 14 px. */
.research-quick-source-links .btn { font-size: 14px; }/* EG-0170 schermronde: bedieningslabel adviseursdossier 14 px (printvoettekst blijft secundair). */
.advisor-dossier-controls label { font-size: 14px; }
/* EG-0170 schermronde: veldlabels in klassieke formulieren en de terugknop in de paginakop 14 px. */
main .form-grid > label, main .entity-form > label, main .egw-page-header .egw-back, main .egw-page-header-main .egw-back, main a.egw-back { font-size: 14px; }
/* EG-0170 schermronde: Taken en algemene keuzes — bedrijfsregel van een taak, belknoptekst, filterchips en segmentkeuzes 14 px; datum, 'Voor ...' en actie-uitleg blijven secundair. */
main .taak-context, main .taak-context a, main .taak-context span, main .belactie-call span, main .egw-chips .egw-chip, main .egw-segmented a, main .egw-segmented .egw-segment span { font-size: 14px; }
.egw-takenscherm .egw-segmented a, .egw-takenscherm .taak-belactie .belactie-call, .egw-takenscherm .taak-belactie .belactie-call span { font-size: 14px; }
/* EG-0170 schermronde: Campagnes — fasetellers, filterlabels, contextregel in de kop, actieomschrijving en (klassieke) knoppen 14 px; datums in cellen en de legenda blijven secundair. */
main .campaign-funnel a, main .filter-toolbar label, main .campaigns-controls label.campaigns-search, main .egw-page-header-main .campaign-meta, main .campaign-actions-list .muted, main .btn { font-size: 14px; }
/* EG-0170 schermronde: Campagnebelscript — zoeklabel en inleiding 14 px. */
main .script-collection-search label, main .egw-section-heading > p { font-size: 14px; }
main .egw-section-heading p { font-size: 14px; }
/* EG-0170 schermronde: Bulk-data-analyse — label Aantal 14 px. */
main .datascout-bulk-form label { font-size: 14px; }
/* EG-0170 schermronde: Omgevingsanalyse — veld- en kaartlabels 14 px. */
main .omgeving-context-form label, main .omgeving-map-toolbar label { font-size: 14px; }
/* EG-0170 schermronde: definitielabels (egw-kv) en stappenbalken zijn gewone tekst; 14 px. Hulpregels (egw-help) blijven secundair. */
main .egw-kv dt, main .egw-steps li { font-size: 14px; }
/* EG-0170 schermronde: Leren — stappen, meta-regels, antwoordopties en vraaglabel 14 px; pijlerlabel en sprekerlabel blijven secundair. */
main .leerroute-stappenlijst li, main .leerroute-meta, main .leermodule-optie span, main .leermodule-opties legend.leermodule-label { font-size: 14px; }
/* EG-0170 schermronde: ingevoerde tekst in tekstvakken 14 px. */
main .egw-textarea { font-size: 14px; }
/* EG-0170 schermronde: Importwerkblad — tabeltekst, analyse-uitklapper en campagnelabel 14 px; tellerlabels boven de kerncijfers blijven secundair. */
main .import-workbench-table th, main .import-workbench-table td, main .import-workbench-table td span, main .import-workbench-table td strong, main .import-row-details > summary, main .actions > label { font-size: 14px; }
/* EG-0170 schermronde: lange statuslabels in het importwerkblad breken af binnen hun kolom i.p.v. over de volgende kolom te lopen. */
main .import-workbench-table .badge { white-space: normal; max-width: 100%; }
/* EG-0193: in de mobiele kaartweergave geldt de minimale tabelbreedte (48rem, egwcrm.css) niet; anders schuift de hele pagina horizontaal. */
/* De paginakolom groeit niet mee met de tabel; tussen 641 en 800 px scrolt alleen de tabel binnen haar kader. */
main .import-workbench { grid-template-columns: minmax(0, 1fr); }
@media (max-width: 640px) { main .egw-table-wrap--cards .import-workbench-table { min-width: 0; } }
/* EG-0170 schermronde: Setup privacy en AVG — grensregels 14 px. */
main .avg-grens li { font-size: 14px; }
/* EG-0170 (#595, V-20): interne regelnummers in het campagnebelscript niet zichtbaar; ze blijven in de pagina (verwijzingen/scripts) en staan als tooltip op de titel. */
.script-section-ids, .script-rule-id { display: none !important; }
/* EG-0170 (#596): gebruikerslijst — lange e-mailadressen breken binnen de cel af; acties blijven binnen de kaart. */
.egw-gebruiker-login .egw-cell-sub { overflow-wrap: anywhere; }
.egw-gebruikers-kaart .egw-row-actions { flex-wrap: wrap; }

/* EG-0170 (#601): Taken, één primaire actie plus menu Meer acties; geopend menu op eigen regel onder de acties. */
.egw-takenscherm .taak-meer[open] { flex-basis: 100%; }
.egw-takenscherm .taak-meer[open] > summary { margin-left: auto; display: table; }
.egw-takenscherm .taak-meer-links { display: flex; gap: 6px; flex-wrap: wrap; }

/* EG-0170 (#602): Campagnedetail, Analysemodel wijzigen in uitklapblok. */
.campaign-detail .campaign-wijzig > summary { list-style: none; cursor: pointer; display: inline-block; }
.campaign-detail .campaign-wijzig > summary::-webkit-details-marker { display: none; }
.campaign-detail .campaign-wijzig[open] > summary { margin-bottom: .4rem; }