/* AX Enterprise: Billing (tax invoices, credit notes, bills, expenses and VAT; js/ent-bill.js).
   Every rule starts with .bl or a bl- class. Sides are logical, so Arabic mirrors by itself. */
.bl{--bl-blue:#3A6EA5;--bl-blue-soft:#EAF0F6}
.bl-blue{background:var(--bl-blue-soft);color:var(--bl-blue)}
.bl .h1{line-height:1.2}

/* amounts: AED small, figures tabular, written left to right in both languages */
.bl-amt{display:inline-flex;align-items:baseline;gap:4px;font-size:16px;line-height:22px;font-weight:700;color:var(--ink);white-space:nowrap;font-variant-numeric:tabular-nums;direction:ltr}
.bl-amt i{font-style:normal;font-size:11.5px;font-weight:700;color:var(--sub);letter-spacing:.02em}
.bl-amt.red{color:var(--red)} .bl-amt.red i{color:var(--red);opacity:.8}
.bl-amt.muted{color:var(--ph);font-weight:600} .bl-amt.muted i{color:var(--ph)}
.bl-amt.cr{color:var(--green)}
.bl-chip{display:inline-flex;align-items:center;gap:4px;height:22px;padding:0 9px;border-radius:11px;font-size:12px;font-weight:700;white-space:nowrap}
.bl-chip > span{white-space:nowrap}
.bl-chip svg{flex:none}
.bl-vat{display:inline-flex;align-items:center;justify-content:center;min-width:42px;height:22px;padding:0 8px;border-radius:11px;font-size:12px;font-weight:700;background:var(--green-soft);color:var(--green);white-space:nowrap}
.bl-vat.zero{background:var(--gold-soft);color:var(--gold-ink)}
.bl-vat.ex{background:#E9E9E9;color:var(--sub)}
.bl-unit{font-size:12.5px;line-height:16px;font-weight:600;color:var(--sub);white-space:nowrap}
.bl-av{flex:none;display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--green-soft);color:var(--green);font-size:13px;font-weight:700;letter-spacing:.02em}
.bl-av.lg{width:46px;height:46px;border-radius:15px}
.bl-av.xl{width:68px;height:68px;font-size:23px;margin:0 auto 12px;background:linear-gradient(150deg,#1C6A43,#0F462B);color:#fff;box-shadow:0 0 0 3px #fff,0 0 0 5px #E4BE3F}

/* section heading with See all, as on the AX Enterprise home */
.bl-sec{display:flex;align-items:center;justify-content:space-between;margin:26px 0 8px;margin-inline-start:18.667px}
.bl-sec span{font-size:17px;line-height:24px;color:var(--ph)}
.bl-sec button{min-height:36px;padding:0 6px;font-size:15px;font-weight:600;color:var(--green)}

/* a row with an amount and a chip at its end */
.row.bl-mr{padding-inline-end:16px}
.bl-mr .tx{padding-inline-end:4px}
.bl-mr .t{font-size:16px;line-height:22px;font-weight:600}
.bl-mr .s{font-size:13.5px;line-height:19px}
.bl-end{flex:none;display:flex;flex-direction:column;align-items:flex-end;gap:4px;margin-inline-start:10px;text-align:end}

/* friendly empty states and the start card (before billing is set up) */
.ent-empty.bl-empty{margin-top:14px}
.bl-start{display:flex;flex-direction:column;align-items:center;gap:6px;margin-top:18px;padding:22px 18px 18px;border-radius:24px;background:linear-gradient(160deg,#F3F8F4,#E7F1EA);box-shadow:inset 0 0 0 1.5px rgba(19,83,51,.12);text-align:center}
.bl-sti{display:grid;place-items:center;width:54px;height:54px;margin-bottom:6px;border-radius:18px;background:#fff;box-shadow:0 1px 3px rgba(12,12,12,.06)}
.bl-start > b{font-size:17px;line-height:23px;font-weight:700;color:var(--ink)}
.bl-start > span:not(.bl-sti){font-size:14px;line-height:20px;color:var(--sub)}
.bl-start .bp{margin-top:10px}

/* home */
.bl-mon{margin-block:18px 10px;margin-inline:.667px 0;font-size:13px;line-height:18px;font-weight:700;text-transform:none;color:var(--ph)}
.bl-kpis{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.bl-kpi,.bl-sum{display:flex;flex-direction:column;align-items:flex-start;gap:5px;min-width:0;padding:14px 14px 13px;border-radius:22px;background:var(--row);text-align:start}
.bl-kpi:active{transform:scale(.98)}
.bl-kl{display:flex;align-items:center;gap:7px;max-width:100%;font-size:13.5px;line-height:18px;font-weight:600;color:var(--sub)}
.bl-kl > span{min-width:0;overflow-wrap:anywhere}
.bl-dot{flex:none;width:8px;height:8px;border-radius:50%;background:var(--green)}
.bl-dot.gold{background:var(--gold)} .bl-dot.red{background:var(--red)} .bl-dot.amber{background:#C98A12}
.bl-kn{display:flex;align-items:baseline;gap:4px;font-size:clamp(17px,4.9vw,20px);line-height:26px;font-weight:700;letter-spacing:-.01em;white-space:nowrap;font-variant-numeric:tabular-nums}
.bl-kn i{font-style:normal;font-size:11.5px;font-weight:700;color:var(--sub);letter-spacing:.02em}
.bl-kn.sm{font-size:17px;line-height:23px}
.bl-kn.muted{color:var(--ph)}
.bl-kn.red{color:var(--red)} .bl-kn.red i{color:var(--red);opacity:.8}
.bl-ks{display:flex;align-items:center;gap:6px;width:100%;min-height:18px;font-size:12.5px;line-height:17px;color:var(--sub);font-weight:500}
.bl-ks em{font-style:normal;white-space:nowrap}
.bl-mbar{flex:1;max-width:58px;height:5px;border-radius:3px;background:#E0E0E0;overflow:hidden}
.bl-mbar i{display:block;height:100%;border-radius:3px;background:var(--green)}
.bl-kpi.over{background:var(--red-soft)}
.bl-kpi.over .bl-kn{color:var(--red)} .bl-kpi.over .bl-kn i{color:var(--red);opacity:.8}
.bl-kpi.over .bl-ks{color:var(--red);font-weight:600}
.bl-vatc{display:flex;flex-direction:column;width:100%;margin-top:12px;padding-block:16px 15px;padding-inline:18px 16px;border-radius:24px;background:linear-gradient(160deg,#F3F8F4,#E7F1EA);box-shadow:inset 0 0 0 1.5px rgba(19,83,51,.12);text-align:start}
.bl-vatc:active{transform:scale(.99)}
.bl-vk{display:flex;align-items:center;gap:7px;font-size:14px;line-height:19px;font-weight:600;color:var(--green)}
.bl-vrow{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:8px}
.bl-vt{display:flex;flex-direction:column;min-width:0}
.bl-vl{font-size:13.5px;line-height:18px;color:var(--sub);font-weight:600}
.bl-vbig{display:flex;align-items:baseline;gap:5px;font-size:28px;line-height:34px;font-weight:700;letter-spacing:-.015em;color:var(--ink);font-variant-numeric:tabular-nums;white-space:nowrap}
.bl-vbig i{font-style:normal;font-size:14px;font-weight:700;color:var(--sub)}
.bl-vf{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:6px 10px;margin-top:10px}
.bl-vf > span:last-child{font-size:13px;color:var(--sub);font-weight:600;white-space:nowrap}
.bl-qa{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:12px}
.bl-q{display:flex;flex-direction:column;align-items:center;gap:8px;min-width:0;padding:13px 2px 12px;border-radius:20px;background:var(--row)}
.bl-q:active{transform:scale(.96)}
.bl-qi{display:grid;place-items:center;width:44px;height:44px;border-radius:15px;background:#fff;box-shadow:0 1px 3px rgba(12,12,12,.06)}
.bl-qt{font-size:12.5px;line-height:16px;font-weight:600;text-align:center;color:var(--ink);padding:0 2px}
.grp.bl-more{margin-top:14px}

/* forms */
.bl .dock.bl-dock{z-index:6}
.bl-form .dock.two{grid-template-columns:1fr 1.5fr}
.bl-form .dock .bs{height:52px;border-radius:26px;font-size:16.5px;background:#fff;box-shadow:inset 0 0 0 1.5px #E1E3E1}
.bl-fl{display:block;font-size:13px;line-height:18px;font-weight:600;color:var(--sub)}
.bl-fs{display:flex;flex-direction:column;gap:14px}
.bl-fld{display:block}
.bl-fld > .bl-fl{margin:0 0 6px;margin-inline-start:6px}
.bl-in{font-variant-numeric:tabular-nums;font-weight:600;letter-spacing:.01em}
.bl-ff{display:flex;margin-top:8px;margin-inline-start:6px}
.bl-fhint{font-size:13px;line-height:18px;color:var(--sub)}
.bl-rv{font-size:15px;font-weight:600;color:var(--green);white-space:nowrap}
.bl-rv.dark{color:var(--ink)}
.bl-g2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:10px}
.bl-g2.bl-g2f{margin-top:0}
.bl-g2.bl-g2f > label{display:block;min-width:0}
.bl-g2.bl-g2f .eo-in{width:100%}
.bl-ft{position:relative;display:flex;flex-direction:column;align-items:flex-start;min-width:0;padding-block:12px;padding-inline:16px 14px;border-radius:20px;background:var(--row);text-align:start}
.bl-ft b{margin-top:2px;font-size:16px;line-height:22px;font-weight:600;white-space:nowrap}
.bl-fs2{margin-top:1px;font-size:12.5px;line-height:17px;color:var(--ph);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
/* a date tile: the phone's own date picker opens over the whole tile */
.bl-date input[type=date]{position:absolute;inset:0;width:100%;height:100%;margin:0;padding:0;border:0;opacity:0;cursor:pointer;-webkit-appearance:none;appearance:none;background:transparent;font-size:16px}
.bl-date input[type=date]::-webkit-calendar-picker-indicator{position:absolute;inset:0;width:auto;height:auto;opacity:0;cursor:pointer}
.bl-fin{width:100%;margin-top:2px;padding:0;border:0;outline:none;background:transparent;font-size:16px;line-height:22px;font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums}
.bl-fin::placeholder{color:var(--ph);font-weight:500}
.bl-cust{display:flex;align-items:center;gap:13px;width:100%;margin-top:16px;padding-block:13px;padding-inline:14px 16px;border-radius:22px;background:var(--row);text-align:start}
.bl-ct{flex:1;min-width:0;display:flex;flex-direction:column}
.bl-ct b{font-size:16.5px;line-height:22px;font-weight:700;overflow-wrap:anywhere}
.bl-ct > span:last-child{font-size:13.5px;line-height:19px;color:var(--sub);font-variant-numeric:tabular-nums}
.bl-chg{flex:none;font-size:15px;font-weight:600;color:var(--green)}
.bl-type{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:12px}
.bl-pill{display:inline-flex;align-items:center;gap:7px;height:38px;padding-inline:11px 14px;border-radius:19px;background:var(--green-soft);color:var(--green);box-shadow:inset 0 0 0 1.5px rgba(19,83,51,.28)}
.bl-pill b{font-size:15px;font-weight:700}
.bl-ar{font-family:"TJ","PJS",sans-serif;font-weight:700;font-size:15.5px;line-height:1;padding-top:3px}
.bl-ar.big{display:block;margin-top:4px;font-size:17px;color:var(--green);font-weight:700}
.bl-pill .bl-ar{padding-top:5px}
.bl-tnote{font-size:13px;line-height:18px;color:var(--sub)}
.bl-lines{display:flex;flex-direction:column;gap:8px}
.bl-line{display:block;width:100%;padding:13px 16px 12px;border-radius:20px;background:var(--row);text-align:start}
.bl-lh{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.bl-lh b{font-size:16px;line-height:22px;font-weight:600;min-width:0;overflow-wrap:anywhere}
.bl-ld{display:block;margin-top:2px;font-size:13px;line-height:18px;color:var(--sub);overflow-wrap:anywhere}
.bl-lm{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:6px;font-size:13.5px;line-height:19px;color:var(--sub);font-variant-numeric:tabular-nums}
.bl-lm > span:first-child{display:flex;align-items:center;flex-wrap:wrap;gap:4px 9px;min-width:0}
.bl-lm > span:last-child{display:flex;align-items:center;gap:8px;white-space:nowrap}
.bl-lm em,.bl-lm > em{font-style:normal;font-size:12.5px;white-space:nowrap}
.bl-addl{display:flex;align-items:center;justify-content:center;gap:6px;width:100%;height:46px;border-radius:18px;border:1.5px solid #E1E5E1;background:#fff;color:var(--green);font-size:15px;font-weight:600}
.bl-tot{margin-top:12px;padding:6px 16px;border-radius:22px;background:#fff;box-shadow:inset 0 0 0 1.5px #E7E9E7}
.bl-tr{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:44px;font-size:15px;color:var(--sub)}
.bl-tr + .bl-tr{border-top:1px solid #EEF0EE}
.bl-tr .bl-amt{font-size:15.5px}
.bl-tr.strong span:first-child{color:var(--ink);font-weight:600}
.bl-tr.big{min-height:52px}
.bl-tr.big span:first-child{font-size:16.5px;font-weight:700;color:var(--ink)}
.bl-tr.big .bl-amt{font-size:20px} .bl-tr.big .bl-amt i{font-size:12.5px}
.bl-tr .bl-amt.cr{color:var(--green)}
.bl-ta{min-height:56px;height:56px;padding-top:16px;padding-bottom:16px;font-weight:500}
.bl-miss{font-style:normal;font-weight:600;color:var(--green)}
.bl-type2{width:100%;margin-top:10px}

/* sheets */
.bl-sh h3,.bl-sh .sh-sub{text-align:start}
.bl-sh textarea.eo-in.bl-ta2{height:auto;min-height:78px;padding-block:13px;line-height:24px;resize:none}
.bl-nw{white-space:nowrap}
.bl-sh .ent-kv b{overflow-wrap:anywhere}
.bl-vopts{display:flex;flex-direction:column;gap:8px}
.bl-vopts .opt{justify-content:flex-start;align-items:center;gap:12px;width:100%;height:auto;min-height:56px;padding:9px 14px;border-radius:16px;font-weight:600;white-space:normal;text-align:start}
.bl-vopts .opt.on{box-shadow:inset 0 0 0 1.5px rgba(19,83,51,.35)}
.bl-vopts .opt .bl-vat{flex:none;min-width:58px}
.bl-vopts .opt > span:last-child{display:flex;flex-direction:column;min-width:0}
.bl-vopts .opt b{font-size:15px;line-height:20px;font-weight:600;color:var(--ink)}
.bl-vopts .opt small{font-size:12.5px;line-height:17px;font-weight:500;color:var(--sub)}
/* choice sheets: a long line takes a second line */
.sheet.bl-chs .row .t{white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:anywhere;line-height:22px}
.sheet.bl-chs .row .s{line-height:19px;margin-top:2px}
.sheet.bl-chs .row{padding-block:10px}

/* set up from the trade licence */
.bl-lic{margin-top:18px;padding:14px 16px 6px;border-radius:24px;background:var(--row)}
.bl-lic.bl-pick{padding-bottom:16px}
.bl-lic.bl-pick .bp{margin-top:14px}
.bl-lich{display:flex;align-items:center;gap:12px;padding-bottom:12px;border-bottom:1px solid #E4E6E4}
.bl-lic.bl-pick .bl-lich{border-bottom:0;padding-bottom:0}
.bl-licdoc{flex:none;display:flex;flex-direction:column;gap:4px;width:38px;height:48px;padding:9px 7px;border-radius:6px;background:#fff;box-shadow:0 1px 2px rgba(12,12,12,.08),0 4px 10px rgba(12,12,12,.06)}
.bl-licdoc i{display:block;height:3px;border-radius:2px;background:#D9DEDA}
.bl-licdoc i:first-child{height:5px;width:70%;background:var(--green)}
.bl-licdoc i:nth-child(3){width:80%}
.bl-lict{flex:1;min-width:0;display:flex;flex-direction:column}
.bl-lict b{font-size:16px;line-height:21px}
.bl-lict span{font-size:13px;line-height:18px;color:var(--sub);overflow-wrap:anywhere}
.bl-mini{flex:none;display:inline-flex;align-items:center;gap:5px;height:30px;padding:0 11px;border-radius:15px;background:#fff;color:var(--green);font-size:13px;font-weight:600;box-shadow:inset 0 0 0 1.5px #DCE6DF;white-space:nowrap}
.bl-reading{display:flex;flex-direction:column;align-items:center;gap:6px;width:100%;padding:18px 8px 16px;text-align:center}
.bl-reading .spin{margin-bottom:6px}
.bl-reading b{font-size:16px;line-height:21px;color:var(--ink)}
.bl-reading span:not(.spin){font-size:13.5px;line-height:19px;color:var(--sub)}
.bl-kvs{display:flex;flex-direction:column}
.bl-kv{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:42px;font-size:14.5px}
.bl-kv + .bl-kv{border-top:1px solid #E9EBE9}
.bl-kv span{color:var(--sub)}
.bl-kv b{font-weight:600;text-align:end;overflow-wrap:anywhere}
.bl-acts{display:flex;flex-direction:column;gap:8px}
.bl-act{display:flex;align-items:center;gap:12px;width:100%;min-height:58px;padding-block:9px;padding-inline:12px 14px;border-radius:18px;background:var(--green-soft);box-shadow:inset 0 0 0 1.5px rgba(19,83,51,.2);text-align:start}
.bl-ai{flex:none;display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:#fff}
.bl-act b{flex:1;min-width:0;font-size:15.5px;line-height:21px;font-weight:600;color:var(--ink);overflow-wrap:anywhere}
.bl-tick{flex:none;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--green)}
.bl-act.off{background:var(--row);box-shadow:inset 0 0 0 1.5px #E4E6E4}
.bl-act.off b{color:var(--sub)}
.bl-act.off .bl-tick{background:#fff;box-shadow:inset 0 0 0 1.5px #CDD3CF}

/* an invoice */
.bl-ih{display:flex;flex-direction:column}
.bl-ih .h1{margin-top:4px;font-variant-numeric:tabular-nums}
.bl-ist{margin-top:12px}
.bl-ist .bl-chip{height:30px;padding:0 12px;border-radius:15px;font-size:13.5px;gap:6px}
.bl-big{display:flex;flex-direction:column;align-items:center;margin-top:18px;padding:18px 16px 16px;border-radius:24px;background:var(--row);text-align:center}
.bl-bl{font-size:13.5px;line-height:18px;font-weight:600;color:var(--sub)}
.bl-bn{display:flex;align-items:baseline;gap:6px;margin-top:4px;font-size:34px;line-height:40px;font-weight:700;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.bl-bn i{font-style:normal;font-size:16px;font-weight:700;color:var(--sub);letter-spacing:0}
.bl-bs{margin-top:2px;font-size:13.5px;line-height:18px;color:var(--sub)}
.bl-pv{display:block;width:100%;margin-top:12px;border-radius:24px;overflow:hidden;background:#E9ECEA;text-align:start}
/* the A4 page itself never mirrors: it is the same paper in both languages */
.bl-pvp{position:relative;display:block;height:212px;overflow:hidden;margin:14px 22px 0;border-radius:8px 8px 0 0;background:#fff;box-shadow:0 1px 2px rgba(12,12,12,.06),0 8px 22px rgba(12,12,12,.10);direction:ltr}
.bl-pvp iframe{position:absolute;left:0;top:0;width:794px;height:1123px;border:0;transform-origin:0 0;pointer-events:none;background:#fff}
.bl-pvw{position:absolute;inset:0;display:grid;place-items:center}
.bl-pvf{position:relative;display:flex;align-items:center;gap:12px;padding-block:12px 13px;padding-inline:14px 18px;background:var(--row)}
.bl-pdf{flex:none;height:22px;padding:0 8px;border-radius:11px;background:#C2362B;color:#fff;font-size:11.5px;line-height:22px;font-weight:700;letter-spacing:.02em}
.bl-pvt{flex:1;min-width:0;display:flex;flex-direction:column}
.bl-pvt b{font-size:15px;line-height:20px;overflow-wrap:anywhere}
.bl-pvt span{font-size:13px;line-height:18px;color:var(--sub)}
.bl-pay{margin-top:12px}
.bl-paid{display:flex;align-items:center;gap:10px;margin-top:12px;padding:13px 16px;border-radius:20px;background:var(--green-soft);color:#24402F;font-size:14.5px;line-height:20px;font-weight:600}
.bl-paid svg{flex:none}
.bl-acts4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:10px}
.bl-acts4 button{display:flex;flex-direction:column;align-items:center;gap:7px;min-width:0;padding:12px 2px 11px;border-radius:20px;background:var(--row);font-size:12.5px;line-height:16px;font-weight:600;color:var(--ink);text-align:center}
.bl-acts4 button:active{transform:scale(.96)}
.bl-ai2{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(12,12,12,.06)}
.bl-einv,.bl-after{display:flex;align-items:flex-start;gap:10px;margin-top:12px;padding:12px 14px;border-radius:18px;background:#F5F5F5;font-size:13.5px;line-height:19px;color:var(--sub)}
.bl-einv svg,.bl-after svg{flex:none;margin-top:0}
.bl-einv b,.bl-after b{font-weight:700;color:#3A3A3A}
.bl-tl{position:relative;display:flex;flex-direction:column;gap:2px;padding:4px 0 0}
.bl-te{position:relative;display:flex;gap:14px;padding-block:0 18px;padding-inline:6px 4px}
.bl-te:not(:last-child)::before{content:"";position:absolute;inset-inline-start:21px;top:32px;bottom:2px;width:2px;border-radius:1px;background:#E3E8E4}
.bl-td{flex:none;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--green-soft)}
.bl-te.now .bl-td{background:var(--green);box-shadow:0 0 0 4px #E7F1EA}
.bl-tx{display:flex;flex-direction:column;padding-top:5px;min-width:0}
.bl-tx b{font-size:15.5px;line-height:21px;font-weight:600}
.bl-tx span{font-size:13.5px;line-height:19px;color:var(--sub);overflow-wrap:anywhere}

/* send and payment sheets */
.bl-inw{display:flex;align-items:center;gap:10px;height:52px;padding:0 16px;border-radius:18px;background:var(--row)}
.bl-in2{flex:1;min-width:0;border:0;background:transparent;outline:none;font-size:16.5px;font-weight:500;color:var(--ink)}
.bl-or{display:flex;align-items:center;gap:12px;margin:18px 0 12px;color:var(--ph);font-size:13px;font-weight:600}
.bl-or::before,.bl-or::after{content:"";flex:1;height:1px;background:#E8EAE8}
.bl-tg{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.bl-tg .fst{width:auto}
.bl-shnote{display:flex;align-items:flex-start;gap:10px;margin-top:16px;padding:12px 14px;border-radius:18px;background:var(--green-soft);color:#24402F;font-size:14px;line-height:20px}
.bl-shnote svg{flex:none;margin-top:1px}
.bl-pam{padding:14px 16px 12px;border-radius:22px;background:var(--row)}
.bl-pamr{display:flex;align-items:baseline;gap:8px;margin-top:2px;direction:ltr}
.bl-pamr i{font-style:normal;font-size:16px;font-weight:700;color:var(--sub)}
.bl-pin{flex:1;min-width:0;border:0;background:transparent;outline:none;font-size:30px;line-height:40px;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums;letter-spacing:-.01em;padding:0}
.bl-pq{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px 10px;margin-top:8px;padding-top:10px;border-top:1px solid #E5E7E5}
.bl-pq .opt{height:32px;padding:0 13px;font-size:14px;background:#fff;box-shadow:inset 0 0 0 1.5px #E1E3E1;color:var(--green)}
.bl-left{font-size:13.5px;color:var(--gold-ink);font-weight:600}
.bl-left.ok{color:var(--green)}
.bl-g2.sheet2{margin-top:10px}
.bl-meth{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.bl-meth .opt{justify-content:center;height:44px;border-radius:22px;font-size:15px}
.bl-meth .opt.on{box-shadow:inset 0 0 0 1.5px rgba(19,83,51,.35)}

/* credit note */
.bl-ref{display:flex;align-items:center;gap:13px;margin-top:16px;padding-block:14px;padding-inline:14px 16px;border-radius:22px;background:var(--gold-soft);box-shadow:inset 0 0 0 1.5px #EDE3BF}
.bl-refi{flex:none;display:grid;place-items:center;width:44px;height:44px;border-radius:14px;background:#fff}
.bl-reft{display:flex;flex-direction:column;min-width:0}
.bl-reft .bl-fl{color:var(--gold-ink)}
.bl-reft b{font-size:17px;line-height:23px;font-variant-numeric:tabular-nums}
.bl-reft > span:last-child{font-size:13.5px;line-height:19px;color:#6B5E1A;overflow-wrap:anywhere}

/* scan a bill */
.bl-scan{display:flex;gap:14px;margin-top:16px;padding:12px;border-radius:24px;background:var(--row)}
.bl-photo{flex:none;display:block;width:112px;height:142px;border-radius:16px;overflow:hidden;box-shadow:0 1px 3px rgba(12,12,12,.12);background:#fff}
.bl-photo img{display:block;width:100%;height:100%;object-fit:cover}
.bl-photo.empty{display:grid;place-items:center;box-shadow:inset 0 0 0 1.5px #E1E5E2}
.bl-photo > svg{display:block;margin:auto;height:100%}
.bl-scan.bl-pick .bl-reading{padding:24px 8px}
.bl-sct{flex:1;min-width:0;display:flex;flex-direction:column;align-items:flex-start;padding-block:4px 2px;padding-inline:0 2px}
.bl-ax{display:inline-flex;align-items:center;gap:5px;height:24px;padding:0 9px;border-radius:12px;background:var(--gold-soft);color:var(--gold-ink);font-size:12.5px;font-weight:700}
.bl-sct b{margin-top:10px;font-size:15.5px;line-height:21px;font-weight:700;overflow-wrap:anywhere}
.bl-scan.bl-pick .bl-sct b{margin-top:2px}
.bl-scn{display:flex;align-items:baseline;gap:4px;margin-top:4px;font-size:21px;line-height:27px;font-weight:700;font-variant-numeric:tabular-nums}
.bl-scn i{font-style:normal;font-size:12px;color:var(--sub)}
.bl-scs{font-size:12.5px;line-height:17px;color:var(--sub)}
.bl-retake{display:inline-flex;align-items:center;gap:6px;margin-top:12px;height:32px;padding:0 12px;border-radius:16px;background:#fff;font-size:13.5px;font-weight:600;color:var(--green)}
.bl-ed .row.bl-er{min-height:58px;padding-block:8px;padding-inline:18px 16px}
.bl-er .s{margin:0 0 1px;font-size:13px;line-height:18px}
.bl-er .t{font-size:16px;line-height:22px;font-variant-numeric:tabular-nums}
.bl-er .t.strong{font-weight:700}
.bl-fwd{display:flex;align-items:center;gap:12px;margin-top:12px;padding-block:12px;padding-inline:16px 14px;border-radius:20px;background:#fff;box-shadow:inset 0 0 0 1.5px #E7E9E7}
.bl-fwd svg{flex:none}
.bl-fwd > span:nth-child(2){flex:1;min-width:0;display:flex;flex-direction:column}
.bl-fwdt{font-size:13px;line-height:18px;color:var(--sub)}
.bl-fwd b{font-size:14.5px;line-height:20px;font-weight:600;overflow-wrap:break-word}
/* a supplier bill or a staff receipt, opened in its sheet */
.bl-shot{display:grid;place-items:center;width:100%;height:190px;margin-top:14px;border-radius:18px;overflow:hidden;background:var(--row)}
.bl-shot a{display:block;width:100%;height:100%}
.bl-shot img{display:block;width:100%;height:100%;object-fit:contain;background:#F2F3F2}
.bl-shot .bs{width:auto;padding:0 18px}
.bl-shots{display:flex;gap:10px;margin-top:14px;overflow-x:auto;scrollbar-width:none;padding-bottom:2px}
.bl-shots::-webkit-scrollbar{display:none}
.bl-shots .bl-shot{flex:none;width:142px;height:186px;margin-top:0}
.bl-shots .bl-shot img{object-fit:cover}
.bl-shots .bl-shot a{display:grid;place-items:center;width:100%;height:100%}

/* bills and expenses */
.bl-seg button{gap:6px}
.bl-cnt{font-style:normal;min-width:20px;height:20px;padding:0 6px;border-radius:10px;background:var(--gold);color:#fff;font-size:12px;line-height:20px;font-weight:700}
.bl-g2.sum{margin-top:14px}
.bl-claims{display:flex;flex-direction:column;gap:8px}
.bl-claim{padding-block:13px;padding-inline:12px 14px;border-radius:22px;background:var(--row)}
.bl-clh{display:flex;align-items:flex-start;gap:12px}
.bl-clh > .bl-av{margin-top:2px}
.bl-clt{flex:1;min-width:0;display:flex;flex-direction:column}
.bl-clt b{font-size:16px;line-height:21px}
.bl-clt > span{font-size:14px;line-height:19px;color:var(--ink);overflow-wrap:anywhere}
.bl-clt .bl-cls{font-size:12.5px;line-height:17px;color:var(--sub)}
.bl-clb{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px;padding-inline-start:48px}
.bl-clb button{display:flex;align-items:center;justify-content:center;gap:6px;height:42px;border-radius:21px;font-size:15px;font-weight:600}
.bl-rej{background:#fff;color:var(--red);box-shadow:inset 0 0 0 1.5px #EBD3D1}
.bl-app{background:var(--green);color:#fff}

/* VAT */
.bl-per{display:flex;align-items:center;gap:8px;margin-top:16px;padding:6px;border-radius:24px;background:var(--row)}
.bl-per button{flex:none;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(12,12,12,.07)}
.bl-per button:disabled{opacity:.4}
.bl-per > span{flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;text-align:center}
.bl-per b{font-size:16.5px;line-height:22px}
.bl-per > span > span{font-size:12.5px;line-height:17px;color:var(--sub)}
.bl-vsum{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}
.bl-vs2{display:flex;flex-direction:column;gap:4px;min-width:0;padding:14px;border-radius:20px;background:var(--row)}
.bl-vpay{grid-column:1/-1;display:flex;flex-direction:column;align-items:center;gap:4px;padding:18px 16px 16px;border-radius:24px;background:linear-gradient(160deg,#F3F8F4,#E7F1EA);box-shadow:inset 0 0 0 1.5px rgba(19,83,51,.12);text-align:center}
.bl-vpay .bl-vbig{font-size:32px;line-height:40px}
.bl-vpay .bl-chip{margin-top:4px}
.bl-tbl{border-radius:22px;background:var(--row);padding:4px 14px}
.bl-thd,.bl-trw{display:grid;grid-template-columns:minmax(0,1fr) 88px 72px;align-items:center;gap:6px}
.bl-thd{min-height:36px;font-size:12px;line-height:16px;font-weight:700;text-transform:none;color:var(--ph);border-bottom:1px solid #E3E5E3}
.bl-thd span:not(:first-child),.bl-num{text-align:end}
.bl-trw{min-height:44px;padding:8px 0;font-size:14px}
.bl-trw + .bl-trw{border-top:1px solid #EAECEA}
.bl-tbx{display:flex;align-items:center;gap:8px;min-width:0}
.bl-tbx span{min-width:0;line-height:19px;overflow-wrap:anywhere}
.bl-tbx em{flex:none;display:grid;place-items:center;min-width:26px;height:22px;padding:0 5px;border-radius:7px;background:#fff;font-style:normal;font-size:12px;font-weight:700;color:var(--green);box-shadow:inset 0 0 0 1px #E1E6E2}
.bl-num{font-size:14px;letter-spacing:-.01em;font-variant-numeric:tabular-nums;font-weight:600;white-space:nowrap;direction:ltr;unicode-bidi:isolate}
.bl-trw.nil{color:var(--ph)} .bl-trw.nil .bl-num{font-weight:500} .bl-trw.nil em{color:var(--ph)}
.bl-trw.tot{border-top:1.5px solid #D8DCD9;font-weight:700} .bl-trw.tot .bl-num{font-weight:700;font-size:14.5px}
.bl-xl{margin-top:18px;height:52px;border-radius:26px;background:#fff;box-shadow:inset 0 0 0 1.5px #DCE6DF}

/* customers */
.bl-lh2{display:flex;justify-content:space-between;gap:12px;margin:20px 18px 8px;font-size:13px;line-height:18px;font-weight:600;color:var(--ph)}
.bl-notrn{color:var(--ph)}
.bl-od{display:inline-flex;align-items:center;gap:4px;font-size:12.5px;font-weight:700;color:var(--red);white-space:nowrap}
.bl-addb{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;height:52px;margin-top:12px;border-radius:26px;background:var(--green-soft);color:var(--green);font-size:16.5px;font-weight:600}
.bl-ch{display:flex;flex-direction:column;align-items:center;margin-top:10px;text-align:center}
.bl-ch .h1{margin:0;font-size:24px;line-height:30px;overflow-wrap:anywhere}
.bl-chips{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:8px;margin-top:8px}
.bl-trn{font-size:13.5px;font-weight:600;color:var(--sub);font-variant-numeric:tabular-nums}
.bl-bal{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:18px}
.bl-bal > div{display:flex;flex-direction:column;gap:4px;min-width:0;padding:13px 14px;border-radius:20px;background:var(--row)}
.bl-bal > div:first-child{grid-column:1/-1;align-items:center;padding:16px;background:linear-gradient(160deg,#F3F8F4,#E7F1EA);box-shadow:inset 0 0 0 1.5px rgba(19,83,51,.12)}
.bl-bal > div:first-child .bl-kn{font-size:28px;line-height:34px}
.bl-bal .bl-kn{font-size:18px;line-height:24px}

/* products and services */
.bl-sugg{display:flex;align-items:center;gap:9px;margin-top:16px;padding:11px 14px;border-radius:16px;background:var(--gold-soft);color:var(--gold-ink);font-size:14px;line-height:19px;font-weight:600}
.bl-sugg svg{flex:none}
.bl-key{display:flex;justify-content:center;flex-wrap:wrap;gap:8px 16px;margin-top:16px;font-size:13px;color:var(--sub)}
.bl-key > span{display:inline-flex;align-items:center;gap:7px}

/* settings */
.bl-logo{display:grid;place-items:center;width:32px;height:32px;border-radius:10px;background:linear-gradient(150deg,#1C6A43,#0F462B);color:#fff;font-size:12px;font-weight:700;box-shadow:inset 0 0 0 1.5px rgba(228,190,63,.7);overflow:hidden}
.bl-logo.img{background:#fff;box-shadow:inset 0 0 0 1.5px #E3E7E4}
.bl-logo img{display:block;width:100%;height:100%;object-fit:contain;padding:3px}
.bl-ein{padding:16px 16px 14px;border-radius:24px;background:#fff;box-shadow:inset 0 0 0 1.5px #E3E7E4,0 4px 16px rgba(12,12,12,.04)}
.bl-einh{display:flex;align-items:center;gap:12px}
.bl-eii{flex:none;display:grid;place-items:center;width:46px;height:46px;border-radius:15px;background:var(--green-soft)}
.bl-eit{flex:1;min-width:0;display:flex;flex-direction:column}
.bl-eit b{font-size:16.5px;line-height:22px}
.bl-eit span{font-size:13px;line-height:18px;color:var(--sub)}
.bl-band{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:4px 10px;width:100%;margin-top:14px;padding:11px 14px;border-radius:16px;background:var(--row);font-size:14px;text-align:start}
.bl-band span{color:var(--sub)}
.bl-band b{font-weight:700}
.bl-steps{display:flex;flex-direction:column;gap:12px;margin:14px 2px 16px}
.bl-step{display:flex;gap:12px;align-items:flex-start}
.bl-sd{flex:none;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--gold-soft)}
.bl-step > span:last-child{display:flex;flex-direction:column;min-width:0;padding-top:1px}
.bl-step b{font-size:15px;line-height:20px}
.bl-step > span:last-child > span{font-size:13.5px;line-height:19px;color:var(--sub)}
.bl-einn{margin:12px 2px 0;font-size:13px;line-height:18px;color:var(--ph)}

/* the customer's own page (the ?invoice= link) */
.bl-pubh{display:flex;align-items:center;gap:12px;margin:6px 0 18px;padding:12px 14px;border-radius:20px;background:var(--row)}
.bl-pubh > span:last-child{display:flex;flex-direction:column;min-width:0}
.bl-pubh b{font-size:16px;line-height:21px;overflow-wrap:anywhere}
.bl-pubh small{font-size:13px;line-height:18px;color:var(--sub);font-variant-numeric:tabular-nums}
.bl-pubv .h1{margin-top:4px;font-variant-numeric:tabular-nums}
.dc-fine.bl-pubf{justify-content:flex-start;margin:18px 6px 0;text-align:start}

/* My company: the employee's expense claims */
.dc-todo.bl-myc{align-items:flex-start}
.bl-myc .dc-ft{flex:1;min-width:0}
.bl-myc .dc-ft b{overflow-wrap:anywhere}
.bl-myc .bl-end .bl-amt{font-size:15px}
.bl-rcs{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.bl-rc{position:relative;flex:none;display:grid;place-items:center;width:76px;height:96px;border-radius:14px;overflow:hidden;background:var(--row)}
.bl-rc img{display:block;width:100%;height:100%;object-fit:cover}
.bl-rc .spin{position:absolute;inset:0;margin:auto}
.bl-rc button{position:absolute;top:5px;inset-inline-end:5px;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:rgba(12,12,12,.55)}
.bl-rc.add{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:0 4px;background:var(--green-soft);color:var(--green);font-size:12px;line-height:15px;font-weight:600;text-align:center;box-shadow:inset 0 0 0 1.5px rgba(19,83,51,.2)}

/* long names and lines take a second line rather than being cut short (on the pages and in the sheets) */
.bl .row .t,.bl .row .s,.bl-sh .row .t,.bl-sh .row .s{white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:anywhere;text-wrap:pretty}
/* a customer's TRN stays whole: on a narrow phone it moves under the word TRN, never breaks inside its digits */
.bl-tn{font-size:12.5px}
.bl-tn b{font-weight:inherit;white-space:nowrap;overflow-wrap:normal}
.bl .row .t,.bl-sh .row .t{line-height:22px}
.bl .row .s,.bl-sh .row .s{line-height:19px;margin-top:2px}
.bl .row,.bl-sh .row{padding-block:11px}
.bl .row .rt{max-width:62%;justify-content:flex-end;text-align:end}
.bl .row .rt .bl-rv{white-space:nowrap}

@media (max-width:370px){
  .bl-qt,.bl-acts4 button{font-size:11.5px}
  .bl-thd,.bl-trw{grid-template-columns:minmax(0,1fr) 84px 66px;gap:5px}
  .bl-trw,.bl-num{font-size:13.5px}
  .bl-photo{width:96px;height:124px}
  .bl-kpi,.bl-sum{padding-inline:12px}
  .bl-bn{font-size:31px}
  .bl-rc{width:70px;height:90px}
}