:root{font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:#172033;background:#f4f6fa}*{box-sizing:border-box}body{margin:0}.app{max-width:980px;margin:auto;padding:24px}header{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;margin-bottom:20px}h1{margin:0 0 5px;font-size:32px}header p,.hint{color:#667085;margin:0}.version{background:#e9e5ff;color:#53389e;padding:6px 10px;border-radius:999px;font-weight:700}.card{background:#fff;border:1px solid #e4e7ec;border-radius:16px;padding:20px;margin:14px 0;box-shadow:0 2px 8px #1018280a}h2{font-size:18px;margin:0 0 8px}.drop{margin-top:14px;min-height:125px;border:2px dashed #b9c0cc;border-radius:14px;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;background:#fafbfc;gap:4px}.drop.drag{border-color:#6941c6;background:#f9f5ff}.drop input{display:none}.drop strong{color:#53389e}.drop span{color:#667085;font-size:14px}.previews{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:10px;margin-top:12px}.preview{position:relative;border:1px solid #e4e7ec;border-radius:10px;overflow:hidden;background:#fff}.preview img{width:100%;height:100px;object-fit:cover;display:block}.preview small{display:block;padding:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.preview button{position:absolute;right:5px;top:5px;border:0;border-radius:50%;width:26px;height:26px;background:#fff;cursor:pointer;box-shadow:0 1px 4px #0003}textarea{width:100%;border:1px solid #d0d5dd;border-radius:10px;padding:12px;font:inherit;resize:vertical;line-height:1.45}textarea:focus{outline:2px solid #d6bbfb;border-color:#7f56d9}details summary{cursor:pointer;font-weight:700}.settings textarea{margin-top:12px;font-size:14px}.actions{display:flex;align-items:center;gap:14px;margin:18px 0}button{font:inherit}#generate{border:0;background:#6941c6;color:#fff;font-weight:700;padding:13px 20px;border-radius:10px;cursor:pointer}#generate:disabled{opacity:.55;cursor:wait}.secondary{border:1px solid #d0d5dd;background:#fff;padding:9px 12px;border-radius:9px;cursor:pointer}.result-head{display:flex;align-items:center;justify-content:space-between;gap:12px}#status{color:#667085}.error{color:#b42318!important}footer{text-align:center;color:#98a2b3;font-size:13px;padding:15px}@media(max-width:600px){.app{padding:14px}header{align-items:center}h1{font-size:26px}.actions{align-items:flex-start;flex-direction:column}#generate{width:100%}}
.settings-actions{display:flex;align-items:center;gap:12px;margin-top:10px}.settings-actions .secondary:disabled{opacity:.55;cursor:wait}#settingsStatus{color:#667085;font-size:14px}
.text-input{width:100%;box-sizing:border-box;padding:12px;border:1px solid #ccd2dc;border-radius:10px;font:inherit}.drafts{display:grid;gap:10px}.draft-item{display:flex;gap:12px;align-items:center;justify-content:space-between;padding:12px;border:1px solid #e1e5eb;border-radius:10px;cursor:pointer}.draft-item:hover{background:#f7f8fa}.draft-info strong{display:block}.draft-info small{opacity:.7}.badge{display:inline-block;padding:4px 8px;border-radius:999px;font-size:12px}.badge.open{background:#fff0cc}.badge.done{background:#dff5e5}@media(max-width:640px){.actions{flex-wrap:wrap}.actions button{flex:1 1 45%}.draft-item{align-items:flex-start}}
.admin-login{max-width:520px;margin:40px auto}.admin-login form{display:grid;gap:12px;margin-top:16px}.link-button{text-decoration:none;color:inherit;display:inline-block}footer a{color:#667085;text-decoration:none}
.success{color:#067647;font-weight:700}.secret-box{margin:16px 0;padding:14px;border:1px solid #d0d5dd;border-radius:10px;background:#f9fafb}.secret-box span{display:block;color:#667085;font-size:13px;margin-bottom:6px}.secret-box code{display:block;font-size:16px;letter-spacing:1px;word-break:break-all;user-select:all}.recovery-codes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:12px}.recovery-codes code{padding:10px;border:1px solid #d0d5dd;border-radius:8px;background:#f9fafb;text-align:center;user-select:all}@media(max-width:600px){.recovery-codes{grid-template-columns:1fr}}
.header-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.active-nav{background:#f4ebff;border-color:#b692f6;color:#53389e}.home-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.home-tile{text-decoration:none;color:inherit;display:flex;flex-direction:column;gap:6px;transition:.15s ease}.home-tile:hover{transform:translateY(-1px);border-color:#b692f6}.home-count{font-size:34px;font-weight:800;color:#6941c6}.home-tile>span:last-child,.home-text{color:#667085;line-height:1.55}.primary-link{display:inline-block;text-decoration:none;border:0;background:#6941c6;color:#fff;font-weight:700;padding:13px 20px;border-radius:10px}@media(max-width:640px){header{flex-direction:column;align-items:flex-start}.header-actions{width:100%}.home-grid{grid-template-columns:1fr}}
.header-actions{display:flex;gap:8px;flex-wrap:wrap}.header-actions .link-button,.primary-action,.primary-link{background:#6941c6!important;color:#fff!important;border:1px solid #6941c6!important;font-weight:700;text-decoration:none;padding:10px 14px;border-radius:9px;cursor:pointer;display:inline-block}.header-actions .active-nav{box-shadow:0 0 0 3px #d6bbfb}.admin-user-form{display:grid;grid-template-columns:1fr 1fr auto auto auto;gap:10px;align-items:center;margin-top:14px}.user-list{display:grid;gap:12px;margin-top:14px}.user-row{border:1px solid #e4e7ec;border-radius:12px;padding:14px;display:grid;gap:12px}.user-row small{display:block;color:#667085;margin-top:3px}.user-rights,.user-tools,.user-tools form{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.compact{max-width:240px}.totp-qr{margin:18px auto;max-width:220px}.admin-login .primary-action{width:100%}@media(max-width:700px){header{flex-direction:column;align-items:stretch}.header-actions{display:grid;grid-template-columns:repeat(3,1fr)}.header-actions .link-button{text-align:center}.admin-user-form{grid-template-columns:1fr}.user-rights,.user-tools,.user-tools form{align-items:stretch;flex-direction:column}.compact{max-width:none}.user-tools button,.user-rights button{width:100%}}
/* v1.4.1 gebruikersbeheer */
.users-card{max-width:900px;margin-left:auto;margin-right:auto}.admin-user-form,.user-edit-form{display:flex;flex-direction:column;gap:16px;margin-top:16px}.user-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.user-fields.three{grid-template-columns:repeat(3,minmax(0,1fr))}.user-fields label{display:flex;flex-direction:column;gap:6px;font-weight:600;color:#344054}.rights-line{display:flex;justify-content:center;align-items:center;gap:24px;flex-wrap:wrap;padding:4px 0}.centered-action{align-self:center;min-width:180px}.user-row{max-width:820px;width:100%;margin:0 auto;padding:20px}.user-title{text-align:center}.user-title strong{font-size:18px}.account-tools{border-top:1px solid #e4e7ec;padding-top:16px;display:flex;justify-content:center;align-items:center;gap:12px;flex-wrap:wrap}.password-form{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.password-form .text-input{width:280px}.account-tools .secondary{min-height:42px}@media(max-width:700px){.user-fields,.user-fields.three{grid-template-columns:1fr}.rights-line{justify-content:flex-start;gap:12px}.centered-action{width:100%}.account-tools,.password-form{display:grid;width:100%;grid-template-columns:1fr}.password-form .text-input,.account-tools .secondary{width:100%}.user-row{padding:16px}}
/* v1.4.3 monteur verplicht en filters */
.filter-row{display:flex;align-items:center;gap:12px;margin:14px 0}.filter-row label{font-weight:700;white-space:nowrap}.filter-row .text-input{max-width:320px}.draft-info small{display:block;margin-top:5px}.header-actions a[href*="logout"]{background:#6941c6!important;color:#fff!important}@media(max-width:640px){.filter-row{align-items:stretch;flex-direction:column}.filter-row .text-input{max-width:none;width:100%}}

/* v1.4.4 overzichtelijk gebruikersbeheer */
.users-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:16px}.users-heading h2{margin-bottom:4px}.user-summary-list{display:grid;gap:10px}.user-summary{width:100%;border:1px solid #e4e7ec;background:#fff;border-radius:12px;padding:15px 16px;display:flex;align-items:center;justify-content:space-between;gap:16px;text-align:left;cursor:pointer;color:#172033}.user-summary:hover{border-color:#b692f6;background:#faf8ff}.user-summary-main{display:flex;flex-direction:column;gap:4px}.user-summary-main strong{font-size:17px}.user-summary-main small,.editor-heading small{color:#667085}.user-summary-right{display:flex;align-items:center;gap:12px}.access-badges{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}.access-badge{font-size:12px;font-weight:700;border-radius:999px;padding:5px 8px;background:#f2f4f7;color:#667085}.access-badge.on{background:#ecfdf3;color:#067647}.user-chevron{font-size:28px;line-height:1;color:#6941c6}.user-editor-panel{max-width:820px;margin:16px auto 0;padding:20px;border:1px solid #d6bbfb;background:#faf8ff;border-radius:14px}.user-editor-panel[hidden]{display:none!important}.editor-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}.editor-heading h3{margin:0;font-size:19px}.editor-heading>div{display:flex;flex-direction:column;gap:3px}@media(max-width:700px){.users-heading{align-items:stretch;flex-direction:column}.users-heading .primary-action{width:100%;text-align:center}.user-summary{align-items:flex-start}.user-summary-right{align-items:flex-end;flex-direction:column}.access-badges{display:none}.user-editor-panel{padding:15px}.editor-heading{align-items:flex-start}.close-editor{white-space:nowrap}}

/* v1.4.5 - Werkbon actieknoppen mobiel */
@media (max-width: 640px){
  .workbon-actions{
    display:grid;
    grid-template-columns:1fr;
    gap:12px;
    width:100%;
    margin:18px 0;
  }
  .workbon-actions button,
  .workbon-actions .primary-action,
  .workbon-actions #saveDraft,
  .workbon-actions #generate,
  .workbon-actions #finish{
    display:block;
    width:100%;
    max-width:none;
    min-width:0;
    margin:0;
    padding:15px 16px;
    text-align:center;
    font-size:17px;
    line-height:1.25;
  }
}

/* v1.5.0 - dashboard, zoeken en autosave */
.dashboard-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.list-tools{display:grid;grid-template-columns:minmax(220px,320px) minmax(280px,1fr);gap:14px;align-items:end;margin:14px 0}.list-tools .filter-row{display:grid;gap:6px;margin:0}.list-tools .filter-row label{font-weight:700}.list-tools .text-input{max-width:none;width:100%}.autosave-status{min-height:20px;margin:-8px 0 12px;text-align:center;color:#667085;font-size:13px}.autosave-status:not(:empty)::before{content:'● ';color:#12b76a}.search-row{min-width:0}
@media(max-width:800px){.dashboard-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.list-tools{grid-template-columns:1fr}}
@media(max-width:520px){.dashboard-grid{grid-template-columns:1fr}.list-tools{grid-template-columns:1fr}.draft-item{display:grid;grid-template-columns:1fr auto}.draft-info small{line-height:1.45}}

/* v1.5.1 - fotocategorieen en controle voor afronden */
.preview{display:flex;flex-direction:column}.preview .photo-category{margin:0 6px 7px;width:calc(100% - 12px);padding:7px;border:1px solid #d0d5dd;border-radius:7px;background:#fff;font:inherit;font-size:12px}.check-modal{position:fixed;inset:0;background:#10182899;z-index:1000;display:grid;place-items:center;padding:18px}.check-modal[hidden]{display:none}.check-dialog{width:min(560px,100%);max-height:90vh;overflow:auto;background:#fff;border-radius:16px;padding:22px;box-shadow:0 24px 48px #10182833}.check-list{display:grid;gap:9px;margin:18px 0}.check-line{padding:11px 12px;border-radius:10px;font-weight:650}.check-line.ok{background:#ecfdf3;color:#067647}.check-line.warn{background:#fffaeb;color:#b54708}.check-actions{display:flex;justify-content:flex-end;gap:10px}.check-actions .primary-action{min-width:170px}@media(max-width:600px){.check-dialog{padding:17px}.check-actions{display:grid;grid-template-columns:1fr}.check-actions button{width:100%}}

/* v1.5.2 - geschiedenis en opnieuw openen */
.history-list{display:grid;gap:0;border:1px solid #e4e7ec;border-radius:12px;overflow:hidden}.history-line{display:flex;justify-content:space-between;gap:16px;padding:11px 13px;background:#fff;border-bottom:1px solid #eaecf0}.history-line:last-child{border-bottom:0}.history-line strong{color:#344054}.history-line span{color:#667085;text-align:right;font-size:13px}@media(max-width:600px){.history-line{flex-direction:column;gap:3px}.history-line span{text-align:left}}
/* v1.6.1 PWA install button follows the same navigation layout */
.header-actions .pwa-install{font:inherit;line-height:normal}
@media(max-width:700px){.header-actions .pwa-install{width:100%;text-align:center}}

/* v1.7.0 - prullenbak */
.trash-list{display:grid;gap:12px}.trash-item{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px;border:1px solid #e4e7ec;border-radius:12px;background:#fff}.trash-item>div:first-child{display:grid;gap:4px}.trash-item small{color:#667085}.trash-actions{display:flex;gap:8px;align-items:center}.trash-actions form{margin:0}@media(max-width:650px){.trash-item{align-items:stretch;flex-direction:column}.trash-actions{display:grid;grid-template-columns:1fr}.trash-actions button{width:100%}}

/* v1.7.1 - overzicht, sortering en onthouden filters */
.list-tools{grid-template-columns:minmax(200px,280px) minmax(280px,1fr) minmax(180px,220px)}
.list-summary{margin:-4px 0 12px;color:#667085;font-size:13px;text-align:right}
.draft-item{transition:border-color .15s ease,background .15s ease,transform .15s ease}
.draft-item:hover{transform:translateY(-1px);border-color:#b692f6}
.badge.open{background:#fff7e0;color:#9a6700;font-weight:700}.badge.done{background:#ecfdf3;color:#067647;font-weight:700}
@media(max-width:850px){.list-tools{grid-template-columns:1fr 1fr}.search-row{grid-column:1/-1}.list-summary{text-align:left}}
@media(max-width:600px){.list-tools{display:grid;grid-template-columns:1fr;gap:10px}.search-row{grid-column:auto}.draft-item{grid-template-columns:1fr}.draft-item .badge{justify-self:start}.draft-info small{margin-top:7px}.list-summary{margin-top:0}}

/* v1.7.2 - werkbonstatus en foto's mobiel */
.preview .photo-replace{margin:0 6px 7px;padding:7px 9px;border:1px solid #d0d5dd;border-radius:7px;background:#fff;color:#344054;font-weight:700;cursor:pointer}.autosave-status{font-weight:600}.preview small{overflow-wrap:anywhere}@media(max-width:600px){.previews{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.preview img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover}.preview .photo-replace{font-size:14px;min-height:40px}}

/* v1.7.3 - actiebeveiliging en conflictmelding */
button:disabled{opacity:.55;cursor:not-allowed}.action-status.error,.autosave-status.error{color:#b42318;font-weight:700}

/* v1.7.5 - beheer en controle */
.draft-info small{color:#667085}.history-card h2{display:flex;align-items:center;gap:8px}.history-card h2:after{content:'Activiteitenlog';font-size:12px;font-weight:700;color:#6941c6;background:#f4f0ff;border-radius:999px;padding:4px 8px}

/* v1.7.6 - prullenbakknop gelijk aan overige werkbonacties */
.workbon-actions #trashDraft{background:#6941c6!important;color:#fff!important;border:1px solid #6941c6!important;font-weight:700;padding:13px 20px;border-radius:10px;cursor:pointer}
@media(max-width:640px){.workbon-actions #trashDraft{display:block;width:100%;max-width:none;min-width:0;margin:0;padding:15px 16px;text-align:center;font-size:17px;line-height:1.25}}

/* v1.7.7 - mobiele camera en directe upload */
.photo-actions{display:flex;gap:12px;align-items:center;justify-content:center;flex-wrap:wrap;margin:14px 0 8px}
.photo-actions .camera-button,.photo-actions .gallery-button{min-width:180px;text-align:center;justify-content:center}
.visually-hidden{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.photo-upload-status{text-align:center;min-height:1.4em}
@media(max-width:640px){.photo-actions{display:grid;grid-template-columns:1fr;gap:10px}.photo-actions .camera-button,.photo-actions .gallery-button{width:100%;min-width:0;box-sizing:border-box}}


/* v1.7.8 - duidelijke werkende fotoacties */
.preview{overflow:hidden}
.preview .photo-delete,.preview .photo-replace{position:static;right:auto;top:auto;width:auto;height:auto;border-radius:8px;box-shadow:none;margin:0 6px 7px;padding:8px 9px;font-size:13px;line-height:1.2;font-weight:700;cursor:pointer}
.preview .photo-delete{order:4;background:#fff;color:#b42318;border:1px solid #fda29b}
.preview .photo-replace{order:3;background:#fff;color:#344054;border:1px solid #d0d5dd}
.preview .photo-delete:hover{background:#fff1f0}
@media(max-width:600px){.preview .photo-delete,.preview .photo-replace{display:block;width:calc(100% - 12px);min-height:42px;margin-left:6px;margin-right:6px;font-size:14px}.preview small{font-size:12px}}

/* v1.8.0 */
.intake-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:14px 0}.intake-card form>label,.intake-grid label{display:grid;gap:7px}.warning{padding:12px;border-radius:10px;background:#fff7ed}.success{font-weight:700}.intake-card .centered-action{margin-top:14px}@media(max-width:650px){.intake-grid{grid-template-columns:1fr}}
