@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Oswald:wght@500;600;700&display=swap";:root{--bg: #f5f6f7;--card: #ffffff;--text: #14191d;--muted: #5c6670;--border: rgba(20, 25, 29, .1);--border-strong: rgba(20, 25, 29, .2);--accent: #0b84c4;--accent-hover: #086a9e;--accent-soft: #e6eef2;--danger: #b91c1c;--radius: 4px;--shadow: 0 1px 2px rgba(20, 25, 29, .04), 0 1px 3px rgba(20, 25, 29, .07);--maxw: 1240px;--font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--font-display: "Oswald", var(--font-sans);font-family:var(--font-sans)}*{box-sizing:border-box}html,body,#root{margin:0;padding:0;min-height:100%}body{background:var(--bg);color:var(--text);font-size:14px;line-height:1.55;font-family:var(--font-sans);-webkit-font-smoothing:antialiased}h1,h2,h3{font-family:var(--font-display);text-transform:uppercase;letter-spacing:.005em;font-weight:600}h1{font-size:23px;margin:0;line-height:1.05}h2{font-size:15px;margin:0 0 14px;letter-spacing:.02em}h3{margin:0 0 8px}a{color:var(--accent)}::selection{background:var(--accent);color:#fff}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}code{background:#f1f1f2;padding:1px 5px;border-radius:4px;font-size:12px}.btn{font-family:var(--font-sans);font-size:13px;font-weight:600;text-transform:uppercase;letter-spacing:.03em;border:1px solid var(--border-strong);background:#fff;color:var(--text);padding:9px 16px;border-radius:var(--radius);cursor:pointer;white-space:nowrap;transition:background .12s,border-color .12s}.btn:hover{background:#f8f8f8}.btn:disabled{opacity:.55;cursor:not-allowed}.btn--primary{background:var(--accent);border-color:var(--accent);color:#fff}.btn--primary:hover{background:var(--accent-hover);border-color:var(--accent-hover)}.btn--ghost{background:transparent;border-color:transparent}.btn--ghost:hover{background:#ececed}.btn--danger{background:var(--danger);border-color:var(--danger);color:#fff}.btn--danger-ghost{color:var(--danger);border-color:transparent}.btn--danger-ghost:hover{background:#fdecec}.btn--small{padding:5px 10px;font-size:13px}.btn--block{width:100%}.linklike{background:none;border:none;color:var(--accent);font:inherit;font-weight:600;cursor:pointer;padding:0}.linklike:hover{text-decoration:underline}.fullscreen-center{min-height:100vh;display:grid;place-items:center}.topbar{background:#fff;border-bottom:1px solid var(--border);position:sticky;top:0;z-index:20}.topbar__inner{max-width:var(--maxw);margin:0 auto;padding:10px 20px;display:flex;align-items:center;gap:22px}.topbar__brand{display:flex;align-items:baseline;gap:.14em;cursor:pointer;font-family:var(--font-display);font-weight:600;text-transform:uppercase;letter-spacing:-.01em;font-size:19px;color:var(--text)}.topbar__brand-accent{color:var(--accent)}.topbar__brand-sub{color:var(--muted);font-weight:500;margin-left:.5em}.topbar__nav{display:flex;gap:4px}.topbar__link{padding:6px 10px;border-radius:var(--radius);text-decoration:none;color:var(--muted);font-weight:500;font-size:13px;text-transform:uppercase;letter-spacing:.03em}.topbar__link:hover{background:var(--bg);color:var(--text)}.topbar__link--active{color:var(--accent);background:var(--accent-soft)}.topbar__actions{margin-left:auto;display:flex;gap:8px}.banner{background:var(--accent-soft);border-bottom:1px solid rgba(11,132,196,.25);color:var(--accent-hover);padding:10px 20px;font-size:13px;text-align:center}.content{max-width:var(--maxw);margin:0 auto;padding:24px 20px 80px}.page__head{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px;gap:12px}.card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:20px;margin-bottom:18px}.card__actions{display:flex;align-items:center;gap:10px;margin-top:14px;flex-wrap:wrap}.field{display:flex;flex-direction:column;gap:4px;margin-bottom:12px}.field>span{font-size:12px;font-weight:600;color:var(--muted)}input,select,textarea{font:inherit;color:var(--text);background:#fff;border:1px solid var(--border-strong);border-radius:var(--radius);padding:8px 10px;width:100%}input:focus,select:focus,textarea:focus{outline:2px solid var(--accent);outline-offset:-1px;border-color:var(--accent)}.input--error{border-color:var(--danger)}textarea{resize:vertical}.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}.field--wide{grid-column:1 / -1}.date-picker{position:relative}.date-picker__button{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;font:inherit;color:var(--text);background:#fff;border:1px solid var(--border-strong);border-radius:var(--radius);padding:8px 10px;cursor:pointer;text-align:left}.date-picker__button:hover{background:#fafafa}.date-picker__placeholder{color:var(--muted)}.date-picker__icon{font-size:13px;line-height:1}.date-picker__panel{position:absolute;top:calc(100% + 4px);left:0;z-index:30;background:#fff;border:1px solid var(--border-strong);border-radius:var(--radius);box-shadow:0 8px 24px #14191d24;padding:10px;width:232px}.date-picker__header{display:flex;align-items:center;justify-content:space-between;font-size:12px;font-weight:600;text-transform:capitalize;margin-bottom:8px}.date-picker__header button{border:none;background:none;color:var(--muted);font-size:15px;line-height:1;cursor:pointer;padding:2px 6px;border-radius:var(--radius)}.date-picker__header button:hover{background:var(--bg);color:var(--text)}.date-picker__weekdays,.date-picker__grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}.date-picker__weekdays span{text-align:center;font-size:10px;color:var(--muted);padding-bottom:4px}.date-picker__day{border:none;background:none;border-radius:var(--radius);padding:5px 0;font-size:12px;cursor:pointer;color:var(--text)}.date-picker__day:hover{background:var(--accent-soft)}.date-picker__day.is-today{font-weight:700;color:var(--accent)}.date-picker__day.is-selected{background:var(--accent);color:#fff}.date-picker__today{display:block;width:100%;margin-top:8px;padding:6px;border:none;border-top:1px solid var(--border);background:none;color:var(--accent);font-size:12px;font-weight:600;text-align:center;cursor:pointer}.date-picker__today:hover{background:var(--accent-soft)}.customer-picker{position:relative}.customer-picker__input{cursor:text}.customer-picker__list{position:absolute;top:calc(100% + 4px);left:0;right:0;z-index:30;background:#fff;border:1px solid var(--border-strong);border-radius:var(--radius);box-shadow:0 8px 24px #14191d24;max-height:280px;overflow-y:auto;padding:4px}.customer-picker__option{display:flex;flex-direction:column;gap:1px;padding:7px 9px;border-radius:var(--radius);cursor:pointer;font-size:13px}.customer-picker__option:hover,.customer-picker__option.is-active{background:var(--accent-soft)}.customer-picker__option.is-selected .customer-picker__name{color:var(--accent-hover);font-weight:700}.customer-picker__option--new{color:var(--accent);font-weight:600;border-bottom:1px solid var(--border);border-radius:var(--radius) var(--radius) 0 0;margin-bottom:2px}.customer-picker__name{font-weight:600}.customer-picker__meta{font-size:11px;color:var(--muted)}.customer-picker__empty{padding:10px 9px;color:var(--muted);font-size:13px}.hint{font-size:11px;color:var(--muted)}.hint--error{color:var(--danger)}.alert{padding:9px 12px;border-radius:var(--radius);font-size:13px;margin-bottom:12px}.alert--error{background:#fdecec;color:var(--danger);border:1px solid #f3c8c8}.muted{color:var(--muted);font-size:13px}.empty{color:var(--muted);text-align:center;padding:24px 0}.table-wrap{overflow-x:auto;margin:0 -4px}.table{width:100%;border-collapse:collapse}.table--invoices{min-width:720px}.table th{text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);padding:8px 10px;border-bottom:1px solid var(--border)}.table td{padding:10px;border-bottom:1px solid var(--border);vertical-align:middle}.table tr:last-child td{border-bottom:none}.table .num,.num{text-align:right}.col-actions{text-align:right;white-space:nowrap}.col-actions .btn{margin-left:4px}.toolbar{display:flex;gap:12px;align-items:center;margin-bottom:14px;flex-wrap:wrap}.toolbar__search{max-width:280px}.chips{display:flex;gap:6px;flex-wrap:wrap}.chip{border:1px solid var(--border-strong);background:#fff;border-radius:999px;padding:5px 12px;font-size:12px;cursor:pointer}.chip--active{background:var(--text);color:#fff;border-color:var(--text)}.chip--danger{border-color:#b91c1c66;color:var(--danger)}.chip--danger.chip--active{background:var(--danger);border-color:var(--danger);color:#fff}.status-select{border-radius:999px;padding:4px 8px;font-size:12px;width:auto;min-width:100px}.status-select--verstuurd{background:#eff6ff;border-color:#bfdbfe}.status-select--betaald{background:#ecfdf5;border-color:#a7f3d0}.badge--overdue{display:inline-block;margin-left:6px;padding:2px 7px;border-radius:999px;background:#fdecec;color:var(--danger);font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.4px;vertical-align:middle}.table tr.tr--overdue td{background:#fdf6f6}.alert--overdue{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap}.alert--overdue ul{margin:6px 0 0;padding-left:18px}.alert--overdue button{background:none;border:none;color:inherit;text-decoration:underline;cursor:pointer;padding:0;font:inherit}.login{min-height:100vh;display:grid;place-items:center;padding:20px}.login__card{background:#fff;border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:28px;width:100%;max-width:360px}.login__brand{margin-bottom:18px}.login__brand .topbar__brand{font-size:21px}.login__card h1{margin-bottom:20px}.login__sub{color:var(--muted);font-size:13px;margin:4px 0 18px}.editor{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;align-items:start}.editor__preview{position:sticky;top:76px}.editor__preview-inner{background:#fff;border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}.editor__preview-label{padding:8px 12px;border-bottom:1px solid var(--border);font-size:12px;font-weight:600}.pdf-viewer{width:100%;height:calc(100vh - 160px);border:none;background:#e9e9ea}.lines{display:flex;flex-direction:column;gap:10px;margin-bottom:12px}.line{border:1px solid var(--border);border-radius:var(--radius);padding:10px;background:#fff}.line__top{display:flex;gap:8px;align-items:center}.line__desc{flex:1;min-width:0}.line__remove{flex:none;border:none;background:none;color:var(--muted);font-size:20px;line-height:1;cursor:pointer;width:auto;padding:0 4px}.line__remove:hover{color:var(--danger)}.line__bottom{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) minmax(90px,auto);gap:8px;align-items:end;margin-top:8px}.line__field{display:flex;flex-direction:column;gap:3px;margin:0}.line__field>span{font-size:11px;font-weight:600;color:var(--muted)}.line__field input,.line__field select{padding:6px 8px;width:100%}.line__total{display:flex;flex-direction:column;gap:3px;text-align:right;padding-bottom:7px}.line__total>span{font-size:11px;font-weight:600;color:var(--muted)}.line__total>strong{font-size:14px}@media (max-width: 520px){.line__bottom{grid-template-columns:1fr 1fr}.line__total{grid-column:1 / -1;text-align:left;padding-bottom:0}}.totals-box{margin-top:16px;margin-left:auto;max-width:320px}.totals-box__row{display:flex;justify-content:space-between;padding:3px 0;font-size:13px;color:var(--muted)}.totals-box__row--grand{margin-top:6px;padding-top:8px;border-top:2px solid var(--accent);color:var(--text);font-weight:700;font-size:15px}.sticky-actions{position:sticky;bottom:0;background:#f4f4f5eb;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);border-top:1px solid var(--border);padding:12px 0;display:flex;gap:8px;align-items:center;justify-content:flex-end;flex-wrap:wrap;margin-top:8px}.sticky-actions .muted{margin-right:auto}.logo-row{display:flex;gap:20px;align-items:center;flex-wrap:wrap}.logo-preview{width:180px;height:90px;border:1px dashed var(--border-strong);border-radius:var(--radius);display:grid;place-items:center;background:#fafafa;overflow:hidden}.logo-preview img{max-width:100%;max-height:100%;object-fit:contain}.logo-actions{display:flex;flex-direction:column;gap:8px}.spinner{display:flex;align-items:center;gap:10px;color:var(--muted);padding:30px 0;justify-content:center}.spinner__dot{width:16px;height:16px;border:2px solid var(--border-strong);border-top-color:var(--accent);border-radius:50%;animation:spin .7s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0006;display:grid;place-items:center;z-index:50;padding:20px}.modal{background:#fff;border-radius:var(--radius);padding:22px;max-width:440px;width:100%;box-shadow:0 10px 40px #0003}.modal__message{color:var(--muted);font-size:13px}.modal__actions{display:flex;justify-content:flex-end;gap:8px;margin-top:18px}.modal__actions--stack{flex-direction:column;align-items:stretch}.modal__actions--stack .btn{width:100%}.toast-stack{position:fixed;right:16px;bottom:16px;display:flex;flex-direction:column;gap:8px;z-index:60}.toast{background:var(--text);color:#fff;padding:10px 14px;border-radius:var(--radius);font-size:13px;max-width:320px;cursor:pointer;box-shadow:0 4px 16px #0003}.toast--success{background:#15803d}.toast--error{background:var(--danger)}@media (max-width: 1080px){.editor{grid-template-columns:1fr}.editor__preview{position:static}.pdf-viewer{height:70vh}}@media (max-width: 720px){.topbar__inner{flex-wrap:wrap;gap:10px}.topbar__actions{width:100%}.topbar__actions .btn{flex:1}.grid-2{grid-template-columns:1fr}.lines__head{display:none}.lines__row{grid-template-columns:1fr 1fr;gap:8px}.lines__desc{grid-column:1 / -1}.lines__total{grid-column:1 / -1;text-align:left}.content{padding:16px 14px 90px}.table--invoices .col-actions .btn{margin:2px}}