:root{--yellow:#2e86ff;--yellow-dim:#2e86ff26;--yellow-hover:#5aa4ff;--btn-bg:#2e86ff;--btn-hover:#5aa4ff;--navy:#1a1e7a;--cyan:#1aabff;--grad-accent:linear-gradient(135deg, #35a6ff 0%, #1e6bff 100%);--black:#070d1e;--black-mid:#0c1428;--black-card:#101c3a;--black-input:#132042;--white:#eef1f8;--white-dim:#eef1f88c;--white-faint:#eef1f81c;--border:#2e86ff38;--border-dim:#eef1f814;--red:#e05252;--green:#4caf80;--orange:#f0a040;--on-accent:#fff;--scrim:#000000bf;--header-bg:#070d1eeb;--card-hover-bg:#152248;--font-display:"Barlow", sans-serif;--font-body:"Barlow", sans-serif;--radius-sm:4px;--radius-md:8px;--radius-lg:12px;--nav-height:60px;--sidebar-w:220px}:root[data-theme=light]{--yellow:#1668d6;--yellow-dim:#1668d61f;--yellow-hover:#2e86ff;--btn-bg:#1f74e6;--btn-hover:#2e86ff;--black:#f0f4ff;--black-mid:#e8eeff;--black-card:#fff;--black-input:#fff;--white:#14161e;--white-dim:#14161e99;--white-faint:#14161e1a;--border:#1668d638;--border-dim:#00000017;--red:#d23b3b;--green:#2e9e6b;--orange:#cf8326;--on-accent:#fff;--scrim:#00000080;--header-bg:#f0f4fff0;--card-hover-bg:#e8eeff}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;-webkit-tap-highlight-color:transparent;max-width:100%;overflow-x:hidden}.main-content{margin-left:var(--sidebar-w)}@media (width<=768px){.main-content{margin-left:0}input,select,textarea{font-size:16px!important}}body{background:var(--black);color:var(--white);font-family:var(--font-body);touch-action:manipulation;max-width:100%;font-size:15px;font-weight:400;line-height:1.6;overflow-x:hidden}h1,h2,h3,h4{font-family:var(--font-display);text-transform:uppercase;letter-spacing:.03em;font-weight:900;line-height:1}h1{font-size:clamp(36px,6vw,56px)}h2{font-size:clamp(24px,4vw,36px)}h3{font-size:20px}h4{letter-spacing:.08em;font-size:15px}.btn{font-family:var(--font-display);letter-spacing:.1em;text-transform:uppercase;cursor:pointer;clip-path:polygon(8px 0%,100% 0%,calc(100% - 8px) 100%,0% 100%);border:none;align-items:center;gap:8px;padding:10px 22px;font-size:14px;font-weight:700;text-decoration:none;transition:all .18s;display:inline-flex}.btn-primary{background:var(--btn-bg);color:var(--on-accent)}.btn-primary:hover{background:var(--btn-hover);transform:translateY(-1px)}.btn-primary:active{transform:translateY(0)}.btn-secondary{color:var(--white);border:1px solid var(--border-dim);clip-path:polygon(8px 0%,100% 0%,calc(100% - 8px) 100%,0% 100%);background:0 0}.btn-secondary:hover{border-color:var(--yellow);color:var(--yellow);transform:translateY(-1px)}.btn-ghost{color:var(--white-dim);clip-path:none;background:0 0;padding:8px 12px;font-size:12px}.btn-ghost:hover{color:var(--yellow)}.btn-danger{background:var(--red);color:#fff}.btn-danger:hover{background:#c04040;transform:translateY(-1px)}input,textarea,select{background:var(--black-input);border:1px solid var(--border-dim);color:var(--white);font-family:var(--font-body);border-radius:var(--radius-sm);-webkit-appearance:none;outline:none;width:100%;padding:10px 14px;font-size:14px;transition:border-color .18s}input:focus,textarea:focus,select:focus{border-color:var(--yellow)}input::placeholder,textarea::placeholder{color:var(--white-dim)}select option{background:var(--black-card)}label{letter-spacing:.08em;text-transform:uppercase;color:var(--white-dim);margin-bottom:6px;font-size:12px;font-weight:500;display:block}.card{background:var(--black-card);border:1px solid var(--border-dim);border-radius:var(--radius-md);padding:20px}.card-hover{transition:border-color .2s,background .2s,transform .2s,box-shadow .2s}.card-hover:hover{border-color:var(--border);background:var(--card-hover-bg);transform:translateY(-1px)}.card-hover:active{transform:translateY(0)}.rij-acties{opacity:0;pointer-events:none;flex-shrink:0;gap:6px;margin-left:auto;transition:opacity .15s;display:flex}.card-hover:hover .rij-acties{opacity:1;pointer-events:auto}@media (width<=768px){.rij-acties{display:none!important}}.badge{letter-spacing:.06em;text-transform:uppercase;border-radius:2px;align-items:center;gap:5px;padding:3px 10px;font-size:11px;font-weight:500;display:inline-flex}.badge-yellow{background:var(--yellow-dim);color:var(--yellow)}.badge-green{color:var(--green);background:#4caf8026}.badge-orange{color:var(--orange);background:#f0a04026}.badge-red{color:var(--red);background:#e0525226}.badge-gray{background:var(--white-faint);color:var(--white-dim)}.lijst-rij{border-bottom:1px solid var(--border-dim);cursor:pointer;align-items:center;gap:16px;padding:16px 8px;transition:background .15s;display:flex}.lijst-rij:hover,.lijst-rij:active{background:var(--black-card)}.lijst-rij-titel{color:var(--white);white-space:nowrap;text-overflow:ellipsis;margin-bottom:3px;font-size:15px;font-weight:600;overflow:hidden}.lijst-rij-meta{color:var(--white-dim);white-space:nowrap;text-overflow:ellipsis;font-size:12.5px;overflow:hidden}.lijst-rij-rechts{flex-direction:column;flex-shrink:0;align-items:flex-end;gap:5px;display:flex}.lijst-rij-bedrag{font-family:var(--font-display);color:var(--white);white-space:nowrap;font-size:15.5px;font-weight:700}.lijst-chev{color:var(--white-faint);flex-shrink:0;display:flex}.filter-chip{cursor:pointer;font-family:var(--font-display);letter-spacing:.01em;color:var(--white-dim);background:0 0;border:none;border-radius:999px;align-items:center;gap:7px;padding:7px 13px;font-size:12.5px;font-weight:600;transition:background .15s,color .15s;display:inline-flex}.filter-chip:hover{color:var(--white)}.filter-chip.actief{background:var(--yellow-dim);color:var(--yellow)}.filter-chip .telling{opacity:.55;font-size:11.5px;font-weight:700}.section-label{font-family:var(--font-display);letter-spacing:.28em;text-transform:uppercase;color:var(--yellow);align-items:center;gap:10px;margin-bottom:12px;font-size:11px;font-weight:600;display:flex}.section-label:before{content:"";background:linear-gradient(90deg,#35a6ff 0%,#1e6bff 100%);border-radius:2px;width:24px;height:2px;display:block}.divider{border:none;border-top:1px solid var(--border-dim);margin:20px 0}::-webkit-scrollbar{width:4px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px}.text-yellow{color:var(--yellow)}.text-dim{color:var(--white-dim)}.text-small{font-size:12px}.mt-4{margin-top:4px}.mt-8{margin-top:8px}.mt-12{margin-top:12px}.mt-20{margin-top:20px}.mt-24{margin-top:24px}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.gap-8{gap:8px}.gap-12{gap:12px}.gap-16{gap:16px}.w-full{width:100%}@keyframes fadeUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes pop{0%{opacity:0;transform:scale(.6)}70%{transform:scale(1.06)}to{opacity:1;transform:scale(1)}}.animate-fadeUp{animation:.5s both fadeUp}.animate-fadeIn{animation:.3s both fadeIn}.animate-pop{animation:.28s cubic-bezier(.34,1.56,.64,1) both pop}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}.grid-2{grid-template-columns:1fr 1fr;gap:12px;display:grid}.grid-3{grid-template-columns:1fr 1fr 1fr;gap:12px;display:grid}.grid-postcode{grid-template-columns:1fr 2fr;gap:12px;display:grid}.regel-header{grid-template-columns:1fr 80px 90px 90px 36px;gap:8px;margin-bottom:8px;padding:0 4px;display:grid}.regel-rij{grid-template-columns:1fr 80px 90px 90px 36px;align-items:start;gap:8px;margin-bottom:8px;display:grid}.regel-rij .regel-num-prijs{display:contents}.regel-cel-totaal{text-align:right;font-size:14px;font-weight:500}@media (width<=640px){.grid-2,.grid-3{grid-template-columns:1fr}.regel-header{display:none}.regel-rij{background:var(--black);border:1px solid var(--border-dim);border-radius:var(--radius-md);margin-bottom:10px;padding:12px;display:block;position:relative}.regel-rij .regel-cel-hoofd{padding-right:38px}.regel-rij .regel-num-prijs{grid-template-columns:1fr 1fr;gap:8px;margin-top:8px;display:grid}.regel-rij .regel-cel-totaal{text-align:left;border-top:1px solid var(--border-dim);margin-top:8px;padding-top:8px;font-size:13px}.regel-rij .regel-cel-delete{padding:4px 8px!important;position:absolute!important;top:8px!important;right:8px!important}.regel-toevoeg-knoppen{flex-wrap:wrap!important}}
