:root{--inkt: #1c2b33;--zacht: #5b6b73;--lijn: #d9e0e3;--vlak: #f5f7f8;--wit: #ffffff;--primair: #1f4e5f;--primair-licht: #e3eef2;--accent: #f2b134;--accent-licht: #fdf3dc;--rood: #b3261e;--rood-licht: #fbe9e7;--groen: #2e7d4f;--groen-licht: #e5f3ea;--grijs-dag: #f0f2f3;--radius: 8px;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-size:15px;color:var(--inkt);background:var(--vlak)}*{box-sizing:border-box}body{margin:0;background:var(--vlak)}h1,h2,h3{margin:0 0 .6em;font-weight:650;letter-spacing:-.01em}h1{font-size:1.45rem}h2{font-size:1.15rem}h3{font-size:1rem}a{color:var(--primair)}.num{font-variant-numeric:tabular-nums;text-align:right}.zacht{color:var(--zacht)}.klein{font-size:.85rem}.fout{background:var(--rood-licht);color:var(--rood);padding:.6rem .8rem;border-radius:var(--radius);margin:.6rem 0}.melding{background:var(--accent-licht);padding:.6rem .8rem;border-radius:var(--radius);margin:.6rem 0}.ok{background:var(--groen-licht);color:var(--groen);padding:.6rem .8rem;border-radius:var(--radius);margin:.6rem 0}.kop{display:flex;align-items:center;gap:1.5rem;padding:0 1.25rem;height:56px;background:var(--primair);color:#fff;position:sticky;top:0;z-index:10}.kop .merk{font-weight:700;display:flex;align-items:center;gap:.5rem}.kop nav{display:flex;gap:.25rem;flex:1;overflow-x:auto}.kop nav button{background:none;border:0;color:#cfe0e6;padding:.45rem .75rem;border-radius:6px;font:inherit;cursor:pointer;white-space:nowrap}.kop nav button:hover{background:#ffffff14;color:#fff}.kop nav button.actief{background:#ffffff29;color:#fff}.kop .rechts{display:flex;gap:.5rem;align-items:center;font-size:.85rem;color:#cfe0e6}main{max-width:1180px;margin:0 auto;padding:1.5rem 1.25rem 4rem}.voet{text-align:center;color:var(--zacht);font-size:.75rem;padding:1rem}.kaart{background:var(--wit);border:1px solid var(--lijn);border-radius:var(--radius);padding:1.1rem 1.25rem;margin-bottom:1rem}.balk{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem;margin-bottom:1rem}.balk .vul{flex:1}.raster2{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:.75rem 1rem}label.veld{display:flex;flex-direction:column;gap:.25rem;font-size:.85rem;color:var(--zacht)}input,select,textarea{font:inherit;color:var(--inkt);border:1px solid var(--lijn);border-radius:6px;padding:.45rem .6rem;background:var(--wit)}input:focus,select:focus,textarea:focus{outline:2px solid var(--primair-licht);border-color:var(--primair)}input:disabled{background:var(--vlak);color:var(--zacht)}button.knop,a.knop{font:inherit;border:1px solid var(--lijn);background:var(--wit);color:var(--inkt);padding:.45rem .85rem;border-radius:6px;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;gap:.35rem}button.knop:hover{border-color:var(--primair)}button.knop.primair{background:var(--primair);border-color:var(--primair);color:#fff}button.knop.primair:hover{background:#173d4a}button.knop.gevaar{color:var(--rood)}button.knop.klein{padding:.25rem .55rem;font-size:.85rem}button.knop:disabled{opacity:.5;cursor:default}.chk{display:inline-flex;align-items:center;gap:.35rem;font-size:.9rem;margin-right:.9rem}.tabs{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:1rem}.tab{border:1px solid var(--lijn);background:var(--wit);border-radius:999px;padding:.35rem .85rem;cursor:pointer;font:inherit;font-size:.9rem}.tab .klant{color:var(--zacht);margin-right:.3rem}.tab .tot{margin-left:.4rem;color:var(--zacht);font-variant-numeric:tabular-nums}.tab.actief{background:var(--primair);color:#fff;border-color:var(--primair)}.tab.actief .klant,.tab.actief .tot{color:#cfe0e6}.urenkop{position:sticky;top:56px;z-index:6;background:var(--vlak);padding-top:.75rem;margin-top:-.75rem}.urenkop .tabs{margin-bottom:.6rem}.contextregel{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;background:var(--wit);border:1px solid var(--lijn);border-radius:var(--radius);padding:.5rem .8rem;margin-bottom:.6rem;font-size:.92rem}.contextregel .vul{flex:1}table.raster td.urencel{width:5.6rem}table.raster td.urencel input{width:3.6rem}table.raster td.afwcel{width:4.2rem}table.raster td.afwcel input{width:3.4rem;text-align:right}table.raster td.vrijcel{background:var(--grijs-dag)}table.raster .celinhoud{display:flex;align-items:center;gap:.15rem}table.raster th.projectkop{white-space:normal;line-height:1.15;vertical-align:bottom;min-width:5.6rem}table.raster th.projectkop .klantnaam{display:block;font-weight:500;text-transform:none;letter-spacing:0;font-size:.72rem}table.raster th.projectkop .projectnaam{display:block;color:var(--inkt);text-transform:none;letter-spacing:0;font-size:.8rem}table.raster th.projectkop .kolomtotaal{display:block;color:var(--primair);font-variant-numeric:tabular-nums;text-transform:none}table.raster th.projectkop .schuif{display:flex;justify-content:flex-end;gap:2px;margin-top:2px}table.raster th.projectkop .schuif button{border:1px solid var(--lijn);background:transparent;color:var(--zacht);border-radius:4px;font-size:.62rem;line-height:1;padding:2px 4px;cursor:pointer}table.raster th.projectkop .schuif button:hover:not(:disabled){color:var(--primair);border-color:var(--primair)}table.raster th.projectkop .schuif button:disabled{opacity:.3;cursor:default}table.raster th.afwkop{color:#8a5a00}table.raster td.datum{white-space:nowrap}table.raster td.datum .label{display:block;margin:.1rem 0 0;width:fit-content}table.raster td.dagtotaal{width:3.5rem;color:var(--zacht)}.notitieknop{border:0;background:none;color:#b5c0c4;cursor:pointer;padding:0 .15rem;font-size:.95rem}.notitieknop:hover{color:var(--primair)}.notitieknop.gevuld{color:var(--primair);font-weight:700}tr.notitierij td{background:var(--primair-licht)}.notities{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:.5rem 1rem;align-items:end;padding:.4rem 0}.notities>.zacht{grid-column:1 / -1}.notities>button{justify-self:start}@media(max-width:900px){.rasterkaart{overflow-x:auto}}table.lijst.plakkop thead th{position:sticky;top:var(--kop-boven, 56px);z-index:4;background:var(--wit);box-shadow:inset 0 -2px 0 var(--lijn)}table.lijst{width:100%;border-collapse:collapse;background:var(--wit)}table.lijst th{text-align:left;font-size:.78rem;text-transform:uppercase;letter-spacing:.04em;color:var(--zacht);font-weight:600;padding:.5rem;border-bottom:2px solid var(--lijn)}table.lijst td{padding:.25rem .5rem;border-bottom:1px solid var(--lijn);vertical-align:middle}table.lijst tr.grijs td{background:var(--grijs-dag)}table.lijst tr.vandaag td:first-child{box-shadow:inset 3px 0 0 var(--accent)}table.lijst tr.weekeind td{border-bottom:2px solid #b9c4c8}table.lijst td.dag{width:2.4rem;color:var(--zacht)}table.lijst td.datum{width:6.5rem;font-variant-numeric:tabular-nums}table.lijst td.urencel{width:6.5rem}table.lijst td.urencel input{width:5rem;text-align:right;font-variant-numeric:tabular-nums}table.lijst td.urencel input::placeholder{color:#a6b3b8;font-style:italic}table.lijst td.urencel input.ongeldig{border-color:var(--rood);background:var(--rood-licht)}table.lijst td.bijz input{width:100%}table.lijst td.week{width:5.5rem;font-weight:650}table.lijst td.afw{width:9rem}table.lijst td.afw select{width:100%;font-size:.85rem;padding:.3rem}table.lijst tfoot td{font-weight:700;border-top:2px solid var(--lijn);border-bottom:0;padding:.6rem .5rem}.label{display:inline-block;font-size:.75rem;padding:.1rem .45rem;border-radius:999px;background:var(--primair-licht);color:var(--primair);margin-left:.35rem;white-space:nowrap}.label.feest{background:var(--accent-licht);color:#8a5a00}.label.slot{background:#eceff1;color:var(--zacht)}.status{display:inline-block;padding:.15rem .55rem;border-radius:999px;font-size:.8rem;font-weight:600}.status.open{background:#eceff1;color:var(--zacht)}.status.ingediend{background:var(--accent-licht);color:#8a5a00}.status.afgetekend{background:var(--groen-licht);color:var(--groen)}.opslag{font-size:.8rem;color:var(--zacht);min-width:6rem}.scherm{position:fixed;top:0;right:0;bottom:0;left:0;background:#141e2373;display:grid;place-items:center;z-index:50;padding:1rem}.dialoog{background:var(--wit);border-radius:10px;width:min(560px,100%);max-height:90vh;overflow:auto;padding:1.25rem 1.4rem;box-shadow:0 20px 50px #00000040}.dialoog .knoppen{display:flex;justify-content:flex-end;gap:.5rem;margin-top:1.2rem}fieldset{border:1px solid var(--lijn);border-radius:var(--radius);padding:.6rem .9rem .8rem;margin:.8rem 0}legend{font-size:.85rem;color:var(--zacht);padding:0 .3rem}.login{min-height:100vh;display:grid;place-items:center;padding:1rem;background:linear-gradient(160deg,#1f4e5f,#163a47)}.login .kaart{width:min(400px,100%);padding:1.8rem}.login form{display:flex;flex-direction:column;gap:.9rem}.login .code{font-family:ui-monospace,monospace;font-size:1.4rem;letter-spacing:.35em;text-align:center;text-transform:uppercase}table.overzicht{width:100%;border-collapse:collapse;font-size:.88rem;background:var(--wit)}table.overzicht th,table.overzicht td{padding:.4rem .45rem;border-bottom:1px solid var(--lijn)}table.overzicht th{font-size:.75rem;color:var(--zacht);text-align:right;font-weight:600}table.overzicht th:first-child{text-align:left}table.overzicht tr.klant td{font-weight:650;background:var(--primair-licht)}table.overzicht tr.totaal td{font-weight:700;border-top:2px solid var(--inkt)}.scroll-x{overflow-x:auto}@media(max-width:720px){.kop{gap:.6rem;padding:0 .6rem}.kop .rechts span{display:none}main{padding:1rem .6rem 3rem}table.lijst td.afw,table.lijst th.afw{display:none}table.lijst td{padding:.2rem .25rem}table.lijst td.datum{width:auto;white-space:nowrap}table.lijst td.urencel{width:4.2rem}table.lijst td.urencel input{width:3.8rem}table.lijst td.week{width:2.5rem}}.logovoorbeeld{display:block;width:auto;max-width:180px;object-fit:contain}.naammetlogo{display:inline-flex;align-items:center;gap:.45rem}
