/* Ailex — boekhoudkaartjes (30-10-2026, klus "Ailex boekhouding", Osvaldo; boekkaart.js). Zelfde candy-vorm als de werkkaarten
   (werkkaart.css .wkk): gekleurde kop met twee oortjes, wit lijf, harde schaduw in de donkere tint. Witte koptekst op --a is overal
   minstens 4,5:1 (in #17805C 5,0; uit #C2334D 5,3; kasboek #4F5FF0 4,6; btw #6D3FD6 6,3; factuur #A8540A 5,4; export #137483 5,4). */
html .vb.bk { --a: #4F5FF0; --b: #3341B8; position: relative; margin-top: 12px; padding: 0; background: #fff; border: 0; border-radius: 26px; overflow: visible;
  color: #262A4D; font-family: var(--ax-letter, system-ui, sans-serif); box-shadow: 0 6px 0 var(--b), 0 18px 28px -14px var(--b); }
.bk.bk-in { --a: #17805C; --b: #0F5A40; } .bk.bk-uit { --a: #C2334D; --b: #8C2033; } .bk.bk-kas { --a: #4F5FF0; --b: #3341B8; }
.bk.bk-btw { --a: #6D3FD6; --b: #4C2A99; } .bk.bk-fac { --a: #A8540A; --b: #7A3D07; } .bk.bk-exp { --a: #137483; --b: #0C525D; }
.bk-kop { position: relative; display: flex; align-items: center; gap: 10px; padding: 12px 14px 14px; background: var(--a); border-radius: 26px 26px 0 0; color: #fff;
  box-shadow: inset 0 -5px 0 rgba(0, 0, 0, .13); }
.bk-kop::before, .bk-kop::after { content: ""; position: absolute; top: -9px; width: 34px; height: 18px; border-radius: 18px 18px 0 0; background: var(--a); filter: brightness(1.12); }
.bk-kop::before { left: 36px; } .bk-kop::after { right: 36px; }
.bk-ic { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 50%; background: rgba(255, 255, 255, .22); font-size: 24px; }
.bk-kt { display: flex; flex-direction: column; min-width: 0; }
.bk-kt b { font-size: 18px; font-weight: 900; line-height: 1.15; overflow-wrap: anywhere; }
.bk-kt small { font-size: 13px; font-weight: 700; opacity: .92; }
.bk-lijf { padding: 12px 14px 14px; display: flex; flex-direction: column; gap: 10px; }
.bk-groot { font-size: 32px; font-weight: 900; line-height: 1.1; letter-spacing: -.5px; color: #262A4D; }
.bk-groot small { display: block; font-size: 13px; font-weight: 800; letter-spacing: 0; color: #5A5F8C; }
.bk .plus { color: #11704F; } .bk .min { color: #A8233B; }
.bk-wat { font-size: 17px; font-weight: 800; overflow-wrap: anywhere; }
.bk-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.bk-chip { background: #E8ECFF; color: #2B3399; font-size: 13px; font-weight: 800; padding: 4px 10px; border-radius: 12px; }
.bk-chip.g { background: #DFF7EC; color: #0F6644; } .bk-chip.o { background: #FFF1D6; color: #7A4A00; }
.bk-rij { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; padding: 6px 0; border-bottom: 2px dashed #ECEEFA; font-size: 15px; }
.bk-rij:last-child { border-bottom: 0; }
.bk-rij span { min-width: 0; overflow-wrap: anywhere; } .bk-rij small { display: block; font-size: 13px; color: #5A5F8C; font-weight: 700; }
.bk-rij b { flex: none; font-variant-numeric: tabular-nums; }
.bk-rij.groot { font-size: 18px; font-weight: 900; }
.bk-tot { background: #F5F6FF; border-radius: 16px; padding: 4px 12px; }
.bk-maanden { display: flex; flex-direction: column; font-size: 14px; }
.bk-mrij { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1fr; gap: 6px; align-items: center; padding: 6px 0; border-bottom: 2px dashed #ECEEFA; font-variant-numeric: tabular-nums; }
.bk-mrij > span:not(:first-child) { text-align: right; font-weight: 800; }
.bk-mkop { font-size: 12px; font-weight: 900; color: #5A5F8C; text-transform: uppercase; letter-spacing: .4px; }
.bk-staaf { display: flex; flex-direction: column; gap: 2px; margin-top: 3px; }
.bk-staaf em { display: block; height: 5px; min-width: 2px; border-radius: 3px; }
.bk-staaf em.in { background: #2BB585; } .bk-staaf em.uit { background: #F0546A; }
.bk-rub { display: flex; flex-direction: column; gap: 6px; }
.bk-rrij { display: flex; align-items: center; gap: 10px; font-size: 15px; }
.bk-rrij i { flex: none; width: 38px; height: 30px; display: inline-flex; align-items: center; justify-content: center; border-radius: 10px; background: #EFE8FF; color: #4C2A99;
  font-style: normal; font-weight: 900; font-size: 14px; }
.bk-rrij span { flex: 1; min-width: 0; font-weight: 800; } .bk-rrij small { display: block; font-size: 13px; color: #5A5F8C; font-weight: 700; }
.bk-rrij b { flex: none; font-variant-numeric: tabular-nums; }
.bk-fkop { display: flex; justify-content: space-between; gap: 12px; }
.bk-fkop span { display: flex; flex-direction: column; min-width: 0; } .bk-fkop span:last-child { text-align: right; }
.bk-fkop small { font-size: 12px; font-weight: 900; color: #5A5F8C; text-transform: uppercase; letter-spacing: .4px; }
.bk-fkop b { font-size: 17px; overflow-wrap: anywhere; }
.bk-let { margin: 0; font-size: 13px; font-weight: 700; color: #5A5F8C; }
.bk-leeg { margin: 0; font-size: 15px; color: #5A5F8C; }
