.dnz-documents{margin:24px 0;border-top:1px solid #dedee2;padding-top:18px}
.dnz-documents h3{font-size:16px;margin:0 0 8px;font-weight:600}
.dnz-document-row{display:grid;grid-template-columns:24px minmax(0,1fr);gap:10px;padding:16px 0;border-bottom:1px solid #e5e5e8}
.dnz-document-row>svg{margin-top:3px;color:#62666a}
.dnz-document-info{display:flex;flex-direction:column;gap:5px;min-width:0}
.dnz-document-info strong{font-size:14px}.dnz-document-info span{font-size:13px;overflow-wrap:anywhere}.dnz-document-info small{font-size:12px;color:#65696e}
.dnz-document-actions{display:flex;gap:8px;flex-wrap:wrap;grid-column:2;margin-top:6px}
.dnz-document-actions button{display:inline-flex;align-items:center;justify-content:center;gap:5px;min-height:38px;border:1px solid #d3d6da;border-radius:6px;padding:8px 11px;background:#fff;color:#24262a;cursor:pointer;font:inherit;font-size:13px}
.dnz-document-actions button.primary{background:#21684c;color:white;border-color:#21684c}.dnz-document-actions button:disabled{opacity:.45;cursor:default}
.dnz-document-actions button:focus-visible{outline:3px solid #ce9d2d;outline-offset:2px}
.dnz-document-note{grid-column:2;font-size:12px;color:#686a70;line-height:1.5;margin:4px 0;overflow-wrap:anywhere}
.dnz-document-preview{background:#eeeef0;min-height:240px;border:1px solid #dedee2}
.dnz-document-preview iframe{display:block;width:100%;height:360px;border:0}
.dnz-document-filename{display:flex;gap:7px;align-items:center;font-size:12px;margin:12px 0;overflow-wrap:anywhere}
.dnz-document-compose{display:flex;flex-direction:column;gap:12px}.dnz-document-compose label{display:flex;flex-direction:column;gap:5px;font-size:13px}
.dnz-document-compose input,.dnz-document-compose textarea{font:inherit;box-sizing:border-box;width:100%;border:1px solid #d3d6da;border-radius:6px;padding:10px;background:#fff;color:#25272b;min-width:0}
.dnz-document-compose textarea{min-height:180px;resize:vertical}.dnz-document-compose input[readonly]{background:#f4f4f5}
@media(max-width:600px){.dnz-document-actions{grid-column:1/-1;gap:6px}.dnz-document-actions button{flex:1;padding:9px 8px;font-size:12px}.dnz-document-preview iframe{height:240px}.dnz-document-compose input,.dnz-document-compose textarea{font-size:16px}}

.office .dnz-confirmed,.dnz-confirmed{background:#21684c!important;border-color:#21684c!important;color:#fff!important;opacity:1!important;cursor:default}
.dnz-document-open{display:block;margin:10px 0;padding:10px;border:1px solid #d3d6da;border-radius:6px}
/* Eén lettertype voor de hele app: Inter uit de map fonts, met een systeemletter als terugval. */
@font-face{font-family:Inter;src:url('fonts/Inter-Regular.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:Inter;src:url('fonts/Inter-Bold.ttf') format('truetype');font-weight:600 900;font-style:normal;font-display:swap}
:root{--dnz-letter:Inter,-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;--dnz-tekst:14px;--dnz-klein:13px}
body,button,input,textarea,select,.printScreen,.dnz-popup{font-family:var(--dnz-letter)!important}
.printScreen .pPhotos{display:flex;flex-direction:column;align-items:center;gap:18px}
.printScreen .pPhotos>img,.printScreen .pPhotos>div{width:100%}
.dnz-preview-pages{width:min(100%,850px);margin:0 auto;padding:8px;background:#f4f4f4;border-radius:16px}
/* Alleen documentknoppen zwart; overige knoppen in popups houden hun eigen opmaak (stappen, tabbladen, icoonknoppen). */
.dnz-workorder-access button,.dnz-popup-head button,.dnz-document-actions button,.printToolbar button,.dnz-document-card button,.dnz-rapport-editor>button{border:0!important;border-radius:999px!important;background:#111!important;color:#fff!important;padding:12px 20px!important;font-weight:600;min-height:44px}
.dnz-popup-head button:disabled,.dnz-document-actions button:disabled,.dnz-rapport-editor>button:disabled{opacity:.45;cursor:default}
button.dnz-confirmed{background:#17743c!important;color:white!important;border-radius:999px!important}
body *{font-family:var(--dnz-letter)!important}

/* Eén tekstgrootte in de hele app; alleen titels wijken af en vet blijft vet. */
body,button,input,textarea,select,td,th,label,p,li,span,div,small,a{font-size:var(--dnz-tekst)}
h1{font-size:28px;line-height:1.25}
h2{font-size:20px;line-height:1.3}
h3,h4,h5,legend{font-size:16px;line-height:1.35}
small,.muted,.dnz-document-note,.dnz-plan-hint{font-size:var(--dnz-klein)}
@media(max-width:860px){:root{--dnz-tekst:15px;--dnz-klein:13px}h1{font-size:22px}h2{font-size:18px}}

/* Tabellen in de stijl van de app: geen rasterlijnen, rustige kopregel, ruimere regels. */
.office-table-wrap{border:1px solid #E6E4DE!important;border-radius:16px!important;background:#fff}
.office-table{font-size:var(--dnz-klein)!important}
.office-table th{background:#fff!important;border-bottom:1px solid #E6E4DE!important;color:#6B6E73;font-weight:600}
.office-table th:first-child{background:#fff!important}
.office-table th button{font-size:var(--dnz-klein)!important;font-weight:600;color:#6B6E73;padding:11px 12px!important}
.office-table td{padding:9px 12px!important;line-height:1.4!important;border-right:0!important;border-bottom:1px solid #F0EFEB!important;color:#1D1D1F}
.office-table tbody tr:nth-child(even){background:#fff}
.office-table tbody tr:hover{background:#FAF9F6}
.office-table tbody tr.selected{background:#F6F2EA;box-shadow:inset 3px 0 0 #15171A}
.office-table tbody tr:last-child td{border-bottom:0!important}
.office-table td button{border-radius:999px!important;border:1px solid #D6D4CF!important;background:#fff!important;color:#15171A!important;min-height:30px!important;padding:4px 11px!important;font-size:12px!important;line-height:1.2!important}
.office-table td button.primary,.office-table td button.dnz-knop.donker{background:#15171A!important;color:#fff!important;border-color:#15171A!important}

/* Knoppen in kaarten (o.a. vervolgwerk) gelijk aan de rest van de app. */
.office-card .office-actions button{border:1px solid #D6D4CF!important;border-radius:999px!important;background:#fff!important;color:#15171A!important;min-height:42px;padding:10px 18px!important;font-weight:600;font-size:var(--dnz-klein)!important;cursor:pointer}
.office-card .office-actions button.primary{background:#15171A!important;color:#fff!important;border-color:#15171A!important}
.office-card .office-actions button:disabled{opacity:.45;cursor:default}

/* Foto: keuze tussen camera en galerij, en bewaren in de galerij. */
.dnz-fotokeuze-laag{position:fixed;inset:0;z-index:100000;background:rgba(0,0,0,.38);display:flex;align-items:flex-end;justify-content:center;padding:14px 14px calc(14px + env(safe-area-inset-bottom))}
.dnz-fotokeuze{background:#fff;color:#111;border-radius:20px;padding:18px;width:min(420px,100%);display:flex;flex-direction:column;gap:10px;box-shadow:0 12px 40px rgba(0,0,0,.25)}
.dnz-fotokeuze strong{font-size:15px;text-align:center;margin-bottom:4px}
.dnz-fotokeuze button,.dnz-fotobewaar button{min-height:48px;border-radius:999px!important;border:1px solid #d3d6da!important;background:#fff!important;color:#111!important;font-weight:600;font-size:15px;padding:10px 16px!important;cursor:pointer}
.dnz-fotokeuze button.primary,.dnz-fotobewaar button.primary{background:#111!important;color:#fff!important;border-color:#111!important}
.dnz-fotokeuze .dnz-fotokeuze-annuleer{border-color:transparent!important;color:#6e6e73!important}
.dnz-fotobewaar{position:fixed;left:14px;right:14px;bottom:calc(14px + env(safe-area-inset-bottom));z-index:100000;margin:0 auto;max-width:420px;background:#fff;color:#111;border-radius:18px;padding:14px;box-shadow:0 12px 40px rgba(0,0,0,.25);display:flex;flex-wrap:wrap;gap:8px}
.dnz-fotobewaar span{flex:1 1 100%;font-size:14px;line-height:1.4}
.dnz-fotobewaar button{flex:1 1 120px}

/* Rapportversies en rapport wijzigen. */
.dnz-rapportversies{margin:14px 0 4px;padding-top:12px;border-top:1px solid #e5e5e8}
.dnz-rapportversies .dnz-document-actions{margin:8px 0}
.dnz-versiehistorie{margin-top:10px;font-size:13px}
.dnz-versiehistorie summary{cursor:pointer;padding:6px 0}
.dnz-versie-rij{display:flex;gap:10px;justify-content:space-between;align-items:center;padding:8px 0;border-bottom:1px solid #eee;overflow-wrap:anywhere}
.dnz-versie-rij button{border:0;border-radius:999px;background:#111;color:#fff;padding:8px 14px;min-height:36px;cursor:pointer;flex:none}
.dnz-rapport-editor{padding:16px;max-width:820px;margin:0 auto}
.dnz-editor-blok{display:flex;flex-direction:column;gap:8px}
.dnz-editor-voorblad{display:block;max-width:100%;max-height:240px;object-fit:contain;border-radius:10px;background:#f4f4f5}
.dnz-editor-bevinding{border:1px solid #e5e5e8;border-radius:14px;padding:14px;margin:0;display:flex;flex-direction:column;gap:10px;min-width:0}
.dnz-editor-bevinding legend{font-weight:700;padding:0 6px}
.dnz-editor-fotos{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:8px}
.dnz-editor-foto{position:relative}
.dnz-editor-foto img{display:block;width:100%;aspect-ratio:1;object-fit:cover;border-radius:10px;background:#f4f4f5}
.dnz-popup .dnz-editor-foto button{position:absolute;top:5px;right:5px;width:30px;height:30px;min-height:0!important;padding:0!important;font-size:18px;line-height:1;border:0;border-radius:50%;background:#111;color:#fff;cursor:pointer}
.dnz-popup .dnz-editor-weg{padding:10px 16px;border-radius:999px;min-height:40px;cursor:pointer;font-weight:600}
.dnz-editor-tegel{display:flex;align-items:center;justify-content:center;aspect-ratio:1;border:1.5px dashed #b9bcc2;border-radius:10px;cursor:pointer;font-size:13px;color:#48484a;background:#fafafa;text-align:center;padding:6px}
.dnz-editor-tegel.sleep{border-color:#111;background:#f0f0f0}
.dnz-editor-tegel-breed{aspect-ratio:auto;min-height:48px;border-radius:999px}
.dnz-popup .dnz-editor-weg{align-self:flex-start;background:#fff!important;color:#a53d32!important;border:1px solid #e5c9c5!important}

/* Rustige uitlijning: inhoud krijgt overal dezelfde marges en loopt niet meer tot de schermrand. */
.dnz-popup-body>.detailBody,.dnz-popup-body>.paneBody:not(.dnz-plan):not(.dnz-plandag){max-width:860px;margin:0 auto;padding-left:20px;padding-right:20px;box-sizing:border-box}
.dnz-popup .dnz-document-compose{max-width:720px;margin:0 auto;padding:18px 20px 24px;box-sizing:border-box}
.dnz-popup .dnz-documents,.dnz-popup .dnz-preview-pages{max-width:860px;margin-left:auto;margin-right:auto}
.dnz-popup .dnz-document-compose label{gap:6px}
.dnz-popup .dnz-document-compose input,.dnz-popup .dnz-document-compose textarea{min-height:44px;padding:12px 13px;border-radius:10px;border-color:#E2E0DA}
.dnz-popup .dnz-document-compose textarea{min-height:220px;line-height:1.6}
.dnz-popup .dnz-document-actions{justify-content:flex-end;gap:10px;margin-top:4px}

/* Invoervelden gelijk, maar vinkjes, keuzerondjes en schuifjes houden hun eigen maat. */
.dnz-popup input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]):not([type=file]),
.dnz-popup select,.dnz-popup textarea{box-sizing:border-box;min-height:42px;border-radius:10px;padding:10px 12px;line-height:1.4}
.dnz-popup textarea{line-height:1.6}
.dnz-popup input[type=checkbox],.dnz-popup input[type=radio]{width:18px;height:18px;min-height:0;flex:none;margin:0;accent-color:#15171A}
.dnz-popup label:has(>input[type=checkbox]),.dnz-popup label:has(>input[type=radio]){display:flex;align-items:center;gap:9px;min-width:0;overflow-wrap:anywhere}

/* Vaste knoppenbalk onderin een popup op één lijn met de inhoud. */
.dnz-popup .stepNav,.dnz-popup .detailFoot,.dnz-popup .dnz-voetbalk{max-width:860px;margin-left:auto;margin-right:auto;padding-left:20px;padding-right:20px;box-sizing:border-box}
@media(max-width:860px){
.dnz-popup-body>.detailBody,.dnz-popup-body>.paneBody:not(.dnz-plan):not(.dnz-plandag),.dnz-popup .dnz-document-compose,.dnz-popup .stepNav,.dnz-popup .detailFoot{padding-left:14px;padding-right:14px}
.dnz-mailvenster-blad{max-height:92dvh}
}

/* Verzonden: de mailknop wordt groen met een vinkje en blijft klikbaar om opnieuw te mailen. */
.dnz-document-actions button.dnz-verzonden,.dnz-popup .dnz-document-actions button.dnz-verzonden{background:#17743c!important;color:#fff!important;border-color:#17743c!important}

/* Spoedrapport: rode knop als de opdracht echt spoed was. */
.card button.dnz-knop-spoed,button.dnz-knop-spoed{background:#C8102E!important;color:#fff!important;border-color:#C8102E!important}

/* Startscherm: spoedopdracht met onverzonden rapport in rode letters. */
.dnz-acties button.dnz-actie-rood .dnz-actie-t,.dnz-acties button.dnz-actie-rood .dnz-actie-t small{color:#C8102E!important}
.dnz-acties button.dnz-actie-rood .dnz-actie-t{font-weight:600}

/* Kantoorcontrole met stipjes. */
.dnz-controle-lijst{list-style:none;margin:6px 0 14px;padding:0}
.dnz-controle-lijst li{display:grid;grid-template-columns:12px minmax(0,1fr) auto;gap:12px;align-items:start;padding:11px 0;border-bottom:1px solid #F0EFEB}
.dnz-controle-lijst li:last-child{border-bottom:0}
.dnz-controle-lijst strong{display:block}
.dnz-controle-lijst small{display:block;color:#6E6E73;margin-top:2px;overflow-wrap:anywhere}
.dnz-controle-stip{width:11px;height:11px;border-radius:50%;margin-top:4px;background:#B7B7AE}
.dnz-controle-stip.ok{background:#17743c}.dnz-controle-stip.open{background:#C8102E}.dnz-controle-stip.nvt{background:#C7C7CC}
.dnz-controle-status{font-weight:600;color:#6E6E73}
.dnz-controle-vraag{margin:0 0 4px;padding-left:20px;line-height:1.6}
.dnz-controle .dnz-document-actions{justify-content:flex-end}
.dnz-controle-gereed{margin:12px 0}

/* Klant niet thuis. */
.dnz-nietthuis-tijden{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.dnz-nietthuis-vinkjes{border:1px solid #E5E5EA;border-radius:12px;padding:10px 14px 12px;margin:0;display:flex;flex-direction:column;gap:10px}
.dnz-nietthuis-vinkjes legend{font-weight:600;padding:0 4px}
.dnz-nietthuis-gegevens dl{display:grid;grid-template-columns:auto 1fr;gap:6px 16px;margin:8px 0 0}
.dnz-nietthuis-gegevens dt{color:#6E6E73}.dnz-nietthuis-gegevens dd{margin:0;font-weight:600}
.dnz-bijlage-kop{margin:14px 12px 6px}
@media(max-width:600px){.dnz-nietthuis-tijden{grid-template-columns:1fr}}

/* Uitklapblok (Voortgang en opvolging). */
.dnz-uitklap{padding:0!important}
.dnz-uitklap>summary{list-style:none;cursor:pointer;display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 12px;padding:16px 18px}
.dnz-uitklap>summary::-webkit-details-marker{display:none}
.dnz-uitklap>summary::after{content:'';margin-left:auto;width:8px;height:8px;border-right:2px solid #6E6E73;border-bottom:2px solid #6E6E73;transform:rotate(45deg);align-self:center}
.dnz-uitklap[open]>summary::after{transform:rotate(-135deg)}
.dnz-uitklap-titel{font-size:16px;font-weight:600}
.dnz-uitklap>summary small{color:#6E6E73}
.dnz-uitklap>summary small.dnz-uitklap-let{color:#A65F00;font-weight:600}
.dnz-uitklap-inhoud{padding:0 18px 18px}

/* Mobiel menu (Meer): egaal zoals de zijbalk op de desktop, geen losse ronde knoppen. */
.paneBody.dnz-meer>div>.rowBtn,.paneBody.dnz-meer>.rowBtn{margin:0 8px!important;width:auto;background:transparent!important;border:0!important;border-radius:10px!important;padding:11px 12px!important;box-shadow:none!important;min-height:0}
.paneBody.dnz-meer>div>.rowBtn:active,.paneBody.dnz-meer>.rowBtn:active{background:#EBEBEF!important}
.paneBody.dnz-meer .rowName{font-size:15px;color:#1D1D1F;font-weight:400}
.paneBody.dnz-meer .secLabel{margin:18px 20px 4px!important;font-size:12px!important;letter-spacing:.08em!important;text-transform:uppercase!important;color:#A6A69E!important}

/* Vrije regels op de werkbon. */
.dnz-vrije-regel{display:grid;grid-template-columns:minmax(0,1fr) 170px auto;gap:10px;align-items:end;padding:10px 0;border-bottom:1px solid #F0EFEB}
.dnz-vrije-regel label{display:flex;flex-direction:column;gap:5px;font-size:13px;min-width:0}
.dnz-vrije-regel input{box-sizing:border-box;width:100%;min-height:42px;border:1px solid #D6D4CF;border-radius:10px;padding:10px 12px;font:inherit}
.dnz-vrije-regels button.dnz-vrije-weg{min-height:42px;border-radius:999px;border:1px solid #e5c9c5;background:#fff;color:#a53d32;padding:8px 14px;cursor:pointer}
.dnz-vrije-regels button.dnz-vrije-nieuw{margin-top:12px;min-height:44px;border-radius:999px;border:1.5px dashed #b9bcc2;background:#fafafa;color:#15171A;padding:10px 18px;font-weight:600;cursor:pointer}
@media(max-width:600px){.dnz-vrije-regel{grid-template-columns:1fr}.dnz-vrije-regels button.dnz-vrije-weg{justify-self:start}.dnz-vrije-regel input{font-size:16px}}

/* Afspraakbevestiging: verzonden maar nog niet door de klant bevestigd. */
button.dnz-wacht-bevestiging{background:#FFF4E0!important;color:#7A4B00!important;border:1px solid #F0D5A6!important;border-radius:999px!important;padding:12px 20px!important;font-weight:600;opacity:1!important;cursor:default}
.dnz-tekstknop{background:none!important;border:0!important;padding:0!important;min-height:0!important;color:#15171A!important;text-decoration:underline;cursor:pointer;font:inherit;font-weight:600}

/* Planning: weekkeuze zonder zwarte balk; huidige week als slanke pil. */
.dnz-plan-weken{background:transparent!important;padding:0!important;gap:2px!important}
.dnz-plan-weken button{color:#6E6E73!important;min-height:30px!important;padding:0 12px!important}
.dnz-plan-weken button.actief{background:#15171A!important;color:#fff!important;min-height:28px!important;padding:0 12px!important}
.dnz-plan-weken button[aria-label]{color:#15171A!important;padding:0 8px!important}
.dnz-plan-weken button:not(.actief):not([aria-label]):hover{background:#EFEEE9!important}

/* Standaardmails in Instellingen. */
.dnz-standaardmails{margin-top:24px}
.dnz-mailsjabloon textarea{width:100%;box-sizing:border-box;min-height:240px;border:1px solid #E2E0DA;border-radius:10px;padding:12px 13px;font:inherit;line-height:1.6;resize:vertical}
.dnz-mailsjabloon code{background:#F4F3F0;border-radius:6px;padding:1px 5px;font-size:12px}
.dnz-mailsjabloon .dnz-knop{margin-top:6px}

/* Afhandeling: stappenbalk in een afgeronde bon. */
.dnz-stappenbalk{list-style:none;display:flex;gap:6px;margin:6px 0 16px;padding:0;flex-wrap:wrap}
.dnz-stappenbalk li{display:flex;align-items:center;gap:8px;flex:1 1 120px;padding:10px 12px;border-radius:12px;background:#F4F3F0;color:#6E6E73;font-weight:600}
.dnz-stappenbalk li.klaar{background:#EAF4EE;color:#17743c}
.dnz-stappenbalk li.nu{background:#15171A;color:#fff}
.dnz-stap-bol{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;background:rgba(0,0,0,.08);font-size:12px;flex:none}
.dnz-stappenbalk li.nu .dnz-stap-bol{background:rgba(255,255,255,.2)}
.dnz-stappenbalk li.klaar .dnz-stap-bol{background:#17743c;color:#fff}
.dnz-stap-uitleg{margin:0 0 10px;font-weight:600}
.dnz-terug-mijndag{justify-content:flex-start!important;margin:8px 0 14px!important}

/* Mijn dag. */
.dnz-mijndag-datum{margin:-4px 16px 12px;color:#6E6E73;text-transform:capitalize}
.dnz-mijndag-blok{margin:0 16px 22px}
.dnz-mijndag-blok h3{margin:0 0 8px}
.dnz-mijndag .secLabel{margin:10px 0 4px!important}
.dnz-mijndag-lijst{list-style:none;margin:0;padding:0;border:1px solid #E6E4DE;border-radius:14px;background:#fff;overflow:hidden}
.dnz-mijndag-lijst li+li{border-top:1px solid #F0EFEB}
.dnz-mijndag-rij{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:12px;align-items:center;width:100%;text-align:left;padding:13px 14px;background:transparent;border:0;cursor:pointer;font:inherit;color:inherit}
.dnz-mijndag-rij:hover{background:#FAF9F6}
.dnz-mijndag-info{display:flex;flex-direction:column;gap:3px;min-width:0}
.dnz-mijndag-info small{color:#6E6E73;overflow-wrap:anywhere}
.dnz-mijndag-rechts{color:#6E6E73;font-weight:600;white-space:nowrap}
.dnz-mijndag-knop{border-radius:999px;background:#15171A;color:#fff;padding:8px 14px;font-weight:600;white-space:nowrap}
@media(max-width:600px){.dnz-mijndag-rij{grid-template-columns:minmax(0,1fr) auto}.dnz-mijndag-knop{grid-column:1/-1;text-align:center}}

/* ===== Eén lijn voor alle pagina's: kop en tabellen ===== */
.dnz-paginakop{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:20px 20px 12px;box-sizing:border-box}
.dnz-paginakop h2{margin:0;font-size:22px}
.dnz-paginakop small{display:block;color:#6E6E73;margin-top:4px}
.dnz-paginakop-knoppen{display:flex;gap:8px;flex-wrap:wrap}
.dnz-tabel{padding:0 20px 24px;box-sizing:border-box}
.dnz-tabel-balk{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 12px}
.dnz-tabel-zoek{flex:1 1 240px;max-width:420px;min-height:40px;border:1px solid #D6D4CF;border-radius:999px;padding:8px 16px;font:inherit;box-sizing:border-box}
.dnz-tabel-balk select{min-height:40px;border:1px solid #D6D4CF;border-radius:999px;padding:6px 12px;font:inherit;background:#fff}
.dnz-tabel-telling{color:#6E6E73;font-size:var(--dnz-klein)}
.dnz-tabel-balk-rechts{margin-left:auto;display:flex;gap:8px;flex-wrap:wrap}
.dnz-knop{min-height:38px;border-radius:999px;border:1px solid #D6D4CF;background:#fff;color:#15171A;padding:8px 16px;font:inherit;font-weight:600;cursor:pointer}
.dnz-knop.donker{background:#15171A;color:#fff;border-color:#15171A}
.dnz-tabel-wrap{overflow-x:auto;border:1px solid #E6E4DE;border-radius:16px;background:#fff}
.dnz-tabel-tabel{border-collapse:separate;border-spacing:0;table-layout:fixed;width:max-content;min-width:100%;font-size:var(--dnz-klein)}
.dnz-tabel-tabel th{position:sticky;top:0;background:#fff;border-bottom:1px solid #E6E4DE;text-align:left;padding:0;z-index:1;user-select:none}
.dnz-tabel-tabel th>button{display:block;width:100%;text-align:inherit;border:0;background:transparent;padding:11px 14px;font:inherit;font-weight:600;color:#6B6E73;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dnz-tabel-tabel th{position:sticky}
.dnz-kolomgreep{position:absolute;top:0;right:-4px;width:9px;height:100%;cursor:col-resize;z-index:2;touch-action:none}
.dnz-kolomgreep::after{content:'';position:absolute;top:25%;bottom:25%;left:4px;width:1px;background:#E6E4DE}
.dnz-kolomgreep:hover::after{background:#15171A;width:2px}
.dnz-tabel-tabel td{padding:10px 14px;border-bottom:1px solid #F0EFEB;color:#1D1D1F;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;vertical-align:middle}
.dnz-tabel-tabel .rechts{text-align:right}
.dnz-tabel-tabel tbody tr:last-child td{border-bottom:0}
.dnz-tabel-tabel tbody tr[tabindex]{cursor:pointer}
.dnz-tabel-tabel tbody tr:hover{background:#FAF9F6}
.dnz-tabel-tabel tbody tr.dnz-rij-rood td{color:#C8102E}
.dnz-tabel-tabel td button{border-radius:999px;border:1px solid #D6D4CF;background:#fff;min-height:30px;padding:4px 11px;font-size:12px;cursor:pointer}
.dnz-tabel-regels{list-style:none;margin:0;padding:0;border:1px solid #E6E4DE;border-radius:14px;background:#fff;overflow:hidden}
.dnz-tabel-regels li+li{border-top:1px solid #F0EFEB}
.dnz-tabel-regel{display:flex;justify-content:space-between;align-items:center;gap:12px;width:100%;text-align:left;padding:12px 14px;background:transparent;border:0;font:inherit;color:inherit}
.dnz-tabel-regel span:first-child{display:flex;flex-direction:column;gap:3px;min-width:0}
.dnz-tabel-regel small{color:#6E6E73;overflow-wrap:anywhere}
.dnz-tabel-regel-rechts{font-weight:600;white-space:nowrap}
.dnz-tabel-regel.dnz-rij-rood strong{color:#C8102E}
@media(max-width:760px){.dnz-paginakop{padding:16px 14px 10px}.dnz-tabel{padding:0 14px 20px}}
/* Kolombreedte in de opdrachtentabel. */
.office-table th{position:sticky}
.office-table{table-layout:fixed}
.office-table{width:max-content!important;min-width:100%}
.office-table td{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dnz-segment{display:inline-flex;background:#F0EFEB;border-radius:999px;padding:3px}
.dnz-segment button{border:0;background:transparent;border-radius:999px;padding:7px 14px;font:inherit;font-weight:600;color:#6E6E73;cursor:pointer}
.dnz-segment button.aan{background:#15171A;color:#fff}
.dnz-lijstpagina{padding:0!important}

/* ===== Uitlijning: alle pagina's op dezelfde linker- en rechterlijn ===== */
.paneBody.dnz-lijstpagina{max-width:none!important;padding:0!important;margin:0!important}
/* Pagina's met een smalle kolom (formulieren): kop zonder eigen zijmarge, want de pagina heeft die al. */
.paneBody:not(.dnz-lijstpagina):not(.dnz-plan):not(.dnz-plandag) .dnz-paginakop{padding-left:0;padding-right:0}
.paneBody:not(.dnz-lijstpagina):not(.dnz-plan):not(.dnz-plandag) .dnz-tabel{padding-left:0;padding-right:0}
.paneBody:not(.dnz-lijstpagina):not(.dnz-plan):not(.dnz-plandag)>div>.rowBtn,
.paneBody:not(.dnz-lijstpagina):not(.dnz-plan):not(.dnz-plandag)>section>.rowBtn,
.paneBody:not(.dnz-lijstpagina):not(.dnz-plan):not(.dnz-plandag)>.rowBtn{margin-left:0!important;margin-right:0!important}
.paneBody:not(.dnz-lijstpagina):not(.dnz-plan):not(.dnz-plandag)>input:not([type=checkbox]){margin-left:0!important;margin-right:0!important;width:100%!important}
.paneBody:not(.dnz-lijstpagina):not(.dnz-plan):not(.dnz-plandag)>.filterRow,
.paneBody:not(.dnz-lijstpagina):not(.dnz-plan):not(.dnz-plandag)>.searchWrap{padding-left:0!important;padding-right:0!important;margin-left:0!important;margin-right:0!important}
.paneBody:not(.dnz-lijstpagina):not(.dnz-plan):not(.dnz-plandag)>.infoBar{margin-left:0!important;margin-right:0!important}
/* Planning: titel en blokken niet tegen de schermrand. */
.dnz-plan{padding:20px 20px 30px!important}
.dnz-plandag-kop{padding:16px 14px 10px!important}
.dnz-plandag-inhoud{padding:0 14px 14px!important}
.dnz-popup .dnz-plan-lijsten{margin:0 14px}
.dnz-cel-acties{display:inline-flex;gap:6px;align-items:center;flex-wrap:nowrap}
.dnz-cel-fotos{display:inline-flex;gap:4px}
.dnz-cel-fotos img{width:30px;height:30px;object-fit:cover;border-radius:6px;display:block}
.dnz-mobiel-acties{display:none}
@media(max-width:760px){.dnz-mobiel-acties{display:flex;flex-direction:column;gap:8px;margin-top:12px}.dnz-mobiel-actie{background:#fff;border:1px solid #E6E4DE;border-radius:14px;padding:12px;display:flex;flex-direction:column;gap:8px}.dnz-mobiel-actie .dnz-cel-acties{flex-wrap:wrap}}

/* Pagina's met een tabel mogen breder zijn dan formulierpagina's. */
.paneBody:not(.dnz-lijstpagina):not(.dnz-plan):not(.dnz-plandag):has(.dnz-tabel){max-width:1280px!important}
/* Overzichten (omzet, btw-aangifte): tussenkoppen en blokken op dezelfde lijn als de paginakop. */
.paneBody:not(.dnz-lijstpagina):not(.dnz-plan):not(.dnz-plandag) .secLabel{margin-left:0!important;margin-right:0!important}
.paneBody:not(.dnz-lijstpagina):not(.dnz-plan):not(.dnz-plandag)>div[style*="padding: 0px 16px"]{padding-left:0!important;padding-right:0!important}
.paneBody:not(.dnz-lijstpagina):not(.dnz-plan):not(.dnz-plandag)>.moneyRow{padding-left:0!important;padding-right:0!important;margin-left:0!important;margin-right:0!important}
.dnz-log-content .dnz-tabel,.dnz-kost-venster{padding-left:0;padding-right:0}
.dnz-kost-venster{padding:14px 16px}
.dnz-kost-venster .rowBtn{margin:0!important;border:0!important}

/* Vensters staan bovenaan het scherm, niet in het midden. */
dialog.dnz-popup{margin-top:max(2vh,env(safe-area-inset-top));margin-bottom:auto}
@media(max-width:860px){dialog.dnz-popup{margin-top:0}}

/* ===== Pagina's gelijk aan het Dashboard: Mijn dag, Facturen, Serviceopdrachten,
   Vervolgopdrachten en Klanten/adressen krijgen dezelfde titelgrootte, dezelfde
   padding en dezelfde knoppenvorm als het Dashboard. Knoppen worden vierkanter met
   een duidelijke ronde afwerking (niet de scherpe hoek van Serviceopdrachten, niet
   de volledige ovaal van de pil-knoppen). De zwarte ovale documentknoppen (rapport/
   factuur bekijken, downloaden, mailen) blijven bewust ongemoeid, net als de kleine
   knopjes in tabelrijen. */
:root{--dnz-knop-rond:12px}

.listHead{font-size:20px!important;padding:18px 16px 10px!important}
.office h2{font-size:20px!important;margin:0!important}
@media(min-width:900px){
  .listHead{font-size:22px!important}
  .office h2{font-size:22px!important}
}

.office{padding:18px 16px 28px!important}
@media(min-width:900px){.office{padding:26px 28px 36px!important}}

.dnz-knop,.headBtn,
.office-actions button,.office-card .office-actions button,
.office-views button,.office-querybar button,.office-querybar input,
.filterOn,.filterOff,
.dnz-segment,.dnz-segment button,
.dnz-mijndag-knop,
.dnz-tabel-zoek,.dnz-tabel-balk select{border-radius:var(--dnz-knop-rond)!important}

/* Zoekvelden op de pagina's zelf: dezelfde hoogte, rand en afronding overal. Bij
   Klanten en adressen stond het zoekveld kaal (geen rand, geen hoogte) en bij
   Serviceopdrachten idem; de andere zoekvelden (met vergrootglaasje) hadden al wel
   die opmaak. De zoekbalk in de bovenbalk zoekt zelf al breed — op rapportnummer,
   factuurnummer, adres, e-mailadres, klantnaam, postcode — en hoort bij die smalle
   balk, dus die laten we op zijn eigen maat. */
.dnz-customer-filters .searchInput,.office-querybar input{
  min-height:40px!important;
  padding:8px 16px!important;
  border:1px solid #D6D4CF!important;
  border-radius:var(--dnz-knop-rond)!important;
  background:#fff!important;
  box-sizing:border-box!important;
}
.dnz-customer-filters .searchInput{font-size:15px!important}
.office-querybar input{font-size:14px!important}

/* Knoppen: gevoel/feedback. Geen enkele knop had een transition of een
   indruk-gevoel bij :active — een hover kleurde in één keer om en op mobiel
   (waar hover niet bestaat) gebeurde er helemaal niets tot de actie klaar was:
   vandaar "klik en boem". Dit voegt een zachte overgang toe en een lichte
   "indruk" (klein beetje kleiner) zodra je een knop indrukt of aanraakt, bij
   elke knop in de app in één regel. Puur visueel, verandert niets aan wat een
   knop doet en voegt geen vertraging toe aan de actie zelf; respecteert de
   systeeminstelling "minder beweging".

   Bij twee acties die een grote, directe sprong maken (de knop "Gereedmelden
   & factuur klaarzetten" op de werkbon, en "Verstuurd"/"Afronden" bij
   retourzendingen) is in index.html een kort bevestigingsmoment toegevoegd:
   de knop kleurt heel even groen (bestaande .dnz-confirmed-stijl hieronder,
   hergebruikt) voordat het scherm/de rij daadwerkelijk verandert. De opslag
   zelf gebeurt op hetzelfde moment als voorheen, alleen het zichtbare gevolg
   is met ~260ms vertraagd zodat het bevestigd voelt in plaats van dat het
   gewoon weg is. */
button:not(:disabled){
  transition:transform .12s ease,background-color .15s ease,border-color .15s ease,box-shadow .15s ease,opacity .15s ease;
}
button:not(:disabled):active{
  transform:scale(.96);
}
@media(prefers-reduced-motion:reduce){
  button{transition:none!important}
  button:not(:disabled):active{transform:none!important}
}

/* Mijn dag: tabjes (Openstaand/Afgerond) + vakjes-vormgeving zoals de Planning,
   maar vast — geen slepen, geen dropzones, alleen de kaartjes-look hergebruikt
   (zelfde kleuren als .dnz-plan-klus/.dnz-plan-status) zodat het bij de rest van
   de app past. */
.dnz-mijndag-tabs{margin:0 16px 16px}
.dnz-mijndag-vak{margin:0 16px 22px}
.dnz-mijndag-vak>.secLabel{margin:0 0 8px!important}
.dnz-mijndag-vak-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px}
.dnz-mijndag-kaart{text-align:left;border-radius:10px;background:#f6f2ea;border:1px solid #e6d8bf;padding:10px 12px;display:flex;flex-direction:column;gap:4px;min-width:0;font:inherit;color:inherit}
.dnz-mijndag-kaart.klaar{background:#eef4f0;border-color:#c9ded1}
.dnz-mijndag-kaart-titel{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dnz-mijndag-kaart-sub{font-size:12.5px;color:#6E6E73;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dnz-mijndag-kaart-status{font-size:10px;font-weight:700;letter-spacing:.3px;color:#a85b0b;margin-top:2px}
.dnz-mijndag-kaart-status.groen{color:#146133}
.dnz-mijndag-vak-leeg{color:#6E6E73;font-size:13px;margin:0}

/* Planning: zelfgemaakte afspraken/blokkades zijn nu ook sleepbaar (net als echte
   opdrachten) en hebben een "Verkorten"-knop om de duur in te korten. */
.dnz-plan-eigen{cursor:grab}