/* ============================================================================
   Købsbilag line rows — variant B (#5784, owner-approved mockup 2026-09-17)
   Header: photo stack (bilag-photos.css) · description + price on one
   line · draft chips · chevron. Fold-out (.bilag-line-details): the gallery
   strip, the "Produktudkast" fields and a footer (Lås pris · Slet linje ·
   Opret produkt). Overrides the .salgsbilag-v2 grid row above for the
   købsbilag form only (.sbv2-kobs-form). Mobile-first.
   ========================================================================== */
.salgsbilag-v2.sbv2-kobs-form .bilag-line-row {
    display: block;
    padding: 0;
    border: 1px solid var(--sbv2-line);
    border-radius: 10px;
    background: var(--sbv2-paper);
    transition: box-shadow .15s, border-color .15s;
}
.salgsbilag-v2.sbv2-kobs-form .bilag-line-row.open {
    border-color: var(--sbv2-line-strong);
    box-shadow: 0 8px 24px -12px rgba(14,14,12,.25);
}
.sbv2-kobs-form .bilag-line-head {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 10px 6px 10px 10px;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
}
.sbv2-kobs-form .bilag-line-main { flex: 1 1 auto; min-width: 0; }
.sbv2-kobs-form .bilag-line-desc-wrap { min-width: 0; }
/* Search / DBA preview dropdown spans the whole line row, not just the
   description field (owner 2026-09-26: at 412px it was 186px wide and the
   title broke one word per line). The row is the containing block; top:auto
   keeps it right under the field. */
.salgsbilag-v2.sbv2-kobs-form .bilag-line-row { position: relative; }
.salgsbilag-v2.sbv2-kobs-form .bilag-line-desc-wrap { position: static; }
.salgsbilag-v2.sbv2-kobs-form .bilag-line-search-dropdown { top: auto; left: -1px; right: -1px; margin-top: 4px; }
.salgsbilag-v2.sbv2-kobs-form .bilag-line-dba-card { gap: 10px; padding: 12px; }
.salgsbilag-v2.sbv2-kobs-form .bilag-dba-card-main { gap: 12px; }
.salgsbilag-v2.sbv2-kobs-form .bilag-dba-card-hero img,
.salgsbilag-v2.sbv2-kobs-form .bilag-dba-card-hero .bilag-line-thumb-empty { width: 72px; height: 72px; }
.salgsbilag-v2.sbv2-kobs-form .bilag-dba-card-info { gap: 3px; }
.salgsbilag-v2.sbv2-kobs-form .bilag-dba-card-title {
    font-size: 14px; line-height: 1.3; overflow-wrap: anywhere;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.salgsbilag-v2.sbv2-kobs-form .bilag-dba-card-price { font-size: 15px; }
.salgsbilag-v2.sbv2-kobs-form .bilag-dba-card-desc { -webkit-line-clamp: 3; }
@media (min-width: 768px) {
    .salgsbilag-v2.sbv2-kobs-form .bilag-dba-card-hero img,
    .salgsbilag-v2.sbv2-kobs-form .bilag-dba-card-hero .bilag-line-thumb-empty { width: 96px; height: 96px; }
}
.salgsbilag-v2.sbv2-kobs-form .bilag-line-desc {
    padding: 6px 4px;
    border-color: transparent;
    background: transparent;
    font-size: 14px; font-weight: 500;
    text-overflow: ellipsis;
}
.salgsbilag-v2.sbv2-kobs-form .bilag-line-desc:focus {
    border-color: var(--sbv2-ink);
    background: var(--sbv2-paper);
}
.salgsbilag-v2.sbv2-kobs-form .bilag-line-desc::placeholder { color: var(--sbv2-muted-2); font-weight: 400; }
/* line 2: price (plain mono text, border only on focus; locked = ink-3 +
   lock glyph, same size) leads the chip row */
.sbv2-kobs-form .bilag-line-meta {
    display: flex; flex-wrap: wrap; align-items: center; gap: 6px;
    margin-top: 2px;
    padding-left: 4px;
}
.sbv2-kobs-form .bilag-line-meta .bilag-line-chips { display: contents; }
.sbv2-kobs-form .bilag-line-price-wrap { display: inline-flex; align-items: center; gap: 2px; }
.sbv2-kobs-form .bilag-line-price-lock { display: none; color: #8a867c; flex: 0 0 auto; }
.sbv2-kobs-form .bilag-line-locked .bilag-line-price-lock { display: block; }
.salgsbilag-v2.sbv2-kobs-form .bilag-line-price {
    width: 84px;
    padding: 3px 4px;
    border-color: transparent;
    background: transparent;
    box-shadow: none;
    font-size: 14px;
    text-align: left;
}
.salgsbilag-v2.sbv2-kobs-form .bilag-line-price:focus { border-color: var(--sbv2-ink); background: var(--sbv2-paper); }
.salgsbilag-v2.sbv2-kobs-form .bilag-line-locked .bilag-line-price {
    color: #8a867c;
    border-color: transparent;
    background: transparent;
}
.salgsbilag-v2.sbv2-kobs-form .bilag-line-price.bilag-line-dirty,
.salgsbilag-v2.sbv2-kobs-form .bilag-line-locked .bilag-line-price.bilag-line-dirty {
    color: var(--sbv2-amber);
    background: var(--sbv2-amber-soft);
    border-color: transparent;
    box-shadow: none;
}
.salgsbilag-v2.sbv2-kobs-form .bilag-line-price.bilag-line-dirty:focus,
.salgsbilag-v2.sbv2-kobs-form .bilag-line-locked .bilag-line-price:focus { border-color: var(--sbv2-ink); }
/* DBA badge leads the chip row (amber, .bilag-line-dba-badge above) —
   never over the description text. */
.salgsbilag-v2 .bilag-line-chips .bilag-line-dba-badge { margin: 0; align-self: center; line-height: 1.5; }
.sbv2-kobs-form .bilag-line-sub {
    display: flex; align-items: center; justify-content: flex-end; gap: 8px;
    margin-top: 2px;
    font-size: 11px;
}
.sbv2-kobs-form .bilag-line-brugt {
    display: inline-flex; align-items: center;
    padding: 2px 7px;
    border: 1px solid #e2a857; border-radius: 4px;
    background: #fef3c7; color: #92400e;
    font-size: 11px; font-weight: 700;
    cursor: pointer; user-select: none;
}
.sbv2-kobs-form .bilag-line-brugt input { position: absolute; opacity: 0; width: 0; height: 0; }

/* chips: filled = the draft value, hollow "+ …" = missing (opens the
   fold-out on that field). Wrap, never scroll. Shared with the read-only
   view page (spans there, .sbv2-kobs-view). */
.salgsbilag-v2 .bilag-line-chips {
    display: flex; flex-wrap: wrap; gap: 6px;
}
.salgsbilag-v2 .bilag-line-chips:empty { display: none; }
.salgsbilag-v2 .bilag-line-chip {
    display: inline-flex; align-items: center;
    max-width: 100%;
    padding: 3px 9px;
    border: 1px solid transparent;
    border-radius: 999px;
    background: #e3ecdf;
    color: #2f5d3e;
    font: inherit; font-size: 12px; line-height: 1.4;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
}
.salgsbilag-v2 .bilag-line-chip.is-missing {
    background: transparent;
    border-color: var(--sbv2-line-strong);
    color: #8a867c;
}
.salgsbilag-v2 button.bilag-line-chip:hover { border-color: var(--sbv2-ink); }
.salgsbilag-v2 button.bilag-line-chip:focus-visible { outline: 2px solid var(--sbv2-moss); outline-offset: 1px; }
.salgsbilag-v2 span.bilag-line-chip { cursor: default; }
/* #5815: the line's stock state leads the chip row, same colours as the
   Varer bar — sold green, reserved amber, på lager sand, no product hollow. */
.salgsbilag-v2 .bilag-line-status { cursor: default; font-weight: 500; text-decoration: none; }
.salgsbilag-v2 .bilag-line-status.is-sold { background: #e3ecdf; color: #2f5d3e; }
.salgsbilag-v2 .bilag-line-status.is-reserved { background: #fef3c7; color: #92400e; }
.salgsbilag-v2 .bilag-line-status.is-stock { background: #e1dccf; color: var(--sbv2-ink-2); }
.salgsbilag-v2 .bilag-line-status.is-none { background: transparent; border-color: var(--sbv2-line-strong); color: var(--sbv2-muted); }
.salgsbilag-v2 a.bilag-line-status { cursor: pointer; }
.salgsbilag-v2 a.bilag-line-status:hover { border-color: var(--sbv2-moss); }
/* view page: chips under the line name, "+ Opret" after them as a small dark button */
.sbv2-kobs-view .sbv2-li-meta .bilag-line-chips { margin-top: 4px; }
.sbv2-kobs-view .sbv2-li-meta .bilag-line-create { align-self: flex-start; margin-top: 6px; text-decoration: none; }

.sbv2-kobs-form .bilag-line-chevron {
    flex: 0 0 36px;
    width: 36px; height: 36px;
    margin-top: 6px;
    padding: 0;
    border: 0; border-radius: 8px;
    background: transparent;
    color: var(--sbv2-muted);
    cursor: pointer;
    display: inline-grid; place-items: center;
}
.sbv2-kobs-form .bilag-line-chevron svg { transition: transform .2s ease; }
/* Hover tint only where hover is real: on Android a tapped chevron kept
   :hover and read as a filled grey button next to its neighbours. */
@media (hover: hover) {
    .sbv2-kobs-form .bilag-line-chevron:hover { color: var(--sbv2-ink); background: var(--sbv2-tint); }
}
.sbv2-kobs-form .bilag-line-chevron:active { background: transparent; }
.sbv2-kobs-form .bilag-line-chevron:focus-visible { outline: 2px solid var(--sbv2-moss); outline-offset: 1px; }
.sbv2-kobs-form .bilag-line-row.open .bilag-line-chevron svg { transform: rotate(180deg); }

/* fold-out */
.sbv2-kobs-form .bilag-line-row .bilag-line-details {
    margin: 0;
    padding: 12px;
    border: 0; border-top: 1px solid var(--sbv2-line);
    border-radius: 0 0 10px 10px;
    background: var(--sbv2-bg);
}
.sbv2-kobs-form .bilag-line-row .bilag-line-details[hidden] { display: none; }
.sbv2-kobs-form .bilag-line-draft-label {
    display: block;
    margin-bottom: 6px;
    font-size: 11px; font-weight: 600;
    color: var(--sbv2-muted);
    text-transform: uppercase; letter-spacing: .03em;
}
.sbv2-kobs-form .bilag-line-foot {
    display: flex; flex-wrap: wrap; align-items: center; gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px dashed var(--sbv2-line-strong);
}
.sbv2-kobs-form .bilag-line-foot .bilag-line-lock,
.sbv2-kobs-form .bilag-line-foot .bilag-line-remove {
    display: inline-flex; align-items: center; gap: 6px;
    width: auto; height: auto; min-height: 36px;
    padding: 0 12px;
    border: 1px solid var(--sbv2-line-strong); border-radius: 7px;
    background: var(--sbv2-paper);
    color: var(--sbv2-ink-2);
    font: inherit; font-size: 12px; font-weight: 500; line-height: 1;
    cursor: pointer; user-select: none;
    transition: .15s;
}
.sbv2-kobs-form .bilag-line-foot .bilag-line-lock:hover { background: var(--sbv2-tint); }
.sbv2-kobs-form .bilag-line-locked .bilag-line-foot .bilag-line-lock {
    background: var(--sbv2-ink); color: #FBFAF5; border-color: var(--sbv2-ink);
}
.sbv2-kobs-form .bilag-line-foot .bilag-line-remove:hover {
    background: var(--sbv2-rust-soft); color: var(--sbv2-rust);
    border-color: color-mix(in srgb, var(--sbv2-rust) 22%, var(--sbv2-line-strong));
}
.sbv2-kobs-form .bilag-line-foot .bilag-line-create,
.sbv2-kobs-form .bilag-line-foot .bilag-line-edit-product {
    margin-left: auto;
    min-height: 36px;
    text-decoration: none;
}

/* ── Købsbilag view: segmented "Varer" bar (#5809, step 1) ──────────────────
   inc/bilag/kobsbilag-bar-render.php. One segment per line, width = purchase
   price share; green = solgt, sand = på lager, striped 3 px hairline = 0 kr.
   Mobile-first: 28 px tall, 2 px gaps, 10 px radius; only segments ≥ 18 %
   (data-w="wide") carry their amount. Click → smooth-scroll + .is-flash on the
   LINJER row (#line-{idx}); the anchor href alone covers keyboard users. */
.salgsbilag-v2 .sbv2-varer-card { margin-bottom: 18px; }
.salgsbilag-v2 .sbv2-varer { padding: 16px 18px 14px; }
.salgsbilag-v2 .sbv2-varer-head {
    display: flex; align-items: baseline; justify-content: space-between; gap: 12px;
    margin-bottom: 10px;
}
.salgsbilag-v2 .sbv2-varer-title {
    font-family: 'Hanken Grotesk', system-ui, sans-serif;
    font-size: 11px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase;
    color: var(--sbv2-muted);
}
.salgsbilag-v2 .sbv2-varer-sum { font-size: 13px; font-weight: 500; color: var(--sbv2-ink-2); white-space: nowrap; }
/* Step 2 (#5811): "Solgt for …" under the purchase sum, right-aligned; green once
   sold revenue ≥ purchase total. Pill under the legend: pill-ok (moss-soft) when
   tjent hjem, sand (.is-short) with the missing amount otherwise. */
.salgsbilag-v2 .sbv2-varer-sums { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; }
.salgsbilag-v2 .sbv2-varer-earn { font-size: 12px; font-weight: 500; color: var(--sbv2-muted); white-space: nowrap; }
.salgsbilag-v2 .sbv2-varer-earn.is-ok { color: var(--sbv2-moss); }
.salgsbilag-v2 .sbv2-varer-foot { margin-top: 10px; }
.salgsbilag-v2 .sbv2-varer-pill.is-short { background: #EFECDF; color: var(--sbv2-ink-2); border: 1px solid var(--sbv2-line-strong); }
.salgsbilag-v2 .sbv2-varer-bar {
    display: flex; align-items: stretch; gap: 2px;
    height: 28px; border-radius: 10px; overflow: hidden;
}
.salgsbilag-v2 .sbv2-varer-seg {
    display: flex; align-items: center; justify-content: center;
    min-width: 0; height: 100%;
    background: #e1dccf;
    color: var(--sbv2-ink-2);
    text-decoration: none; overflow: hidden;
    transition: filter .15s;
}
.salgsbilag-v2 .sbv2-varer-seg.is-sold { background: #2f5d3e; color: #FBFAF5; }
.salgsbilag-v2 .sbv2-varer-seg.is-reserved { background: #fef3c7; color: #92400e; }
.salgsbilag-v2 .sbv2-varer-seg.is-gift { background: repeating-linear-gradient(135deg, #e1dccf 0 4px, #d6d0c1 4px 8px); }
.salgsbilag-v2 .sbv2-varer-seg:hover,
.salgsbilag-v2 .sbv2-varer-seg:focus-visible { filter: brightness(.92); outline: none; }
.salgsbilag-v2 .sbv2-varer-seg:focus-visible { box-shadow: inset 0 0 0 2px var(--sbv2-ink); }
.salgsbilag-v2 .sbv2-varer-seg-amt {
    display: none;
    font-family: 'JetBrains Mono', ui-monospace, monospace; font-feature-settings: "tnum";
    font-size: 11px; line-height: 1; white-space: nowrap;
    padding: 0 6px; overflow: hidden; text-overflow: ellipsis;
}
.salgsbilag-v2 .sbv2-varer-seg[data-w="wide"] .sbv2-varer-seg-amt { display: block; }
.salgsbilag-v2 .sbv2-varer-legend {
    display: flex; flex-wrap: wrap; gap: 6px 16px;
    margin-top: 10px;
    font-size: 12px; color: var(--sbv2-muted);
}
.salgsbilag-v2 .sbv2-varer-key { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.salgsbilag-v2 .sbv2-varer-key i {
    display: inline-block; width: 10px; height: 10px; border-radius: 50%;
    background: #e1dccf;
}
.salgsbilag-v2 .sbv2-varer-key.is-sold i { background: #2f5d3e; }
.salgsbilag-v2 .sbv2-varer-key.is-reserved i { background: #fef3c7; box-shadow: inset 0 0 0 1px #e2a857; }
.salgsbilag-v2 .sbv2-varer-key.is-gift i { border-radius: 2px; background: repeating-linear-gradient(135deg, #e1dccf 0 2px, #d6d0c1 2px 4px); }
.salgsbilag-v2 .sbv2-lines tr.is-flash { animation: sbv2-line-flash .8s ease-out 1; }
@keyframes sbv2-line-flash {
    0% { background: #e3ecdf; }
    60% { background: #e3ecdf; }
    100% { background: transparent; }
}
@media (prefers-reduced-motion: reduce) {
    .salgsbilag-v2 .sbv2-lines tr.is-flash { animation: none; background: #e3ecdf; }
}

/* #5829: MobilePay fee — fee line under a payment row (Betalinger card) and
   the "Betalt med MobilePay?" block in the "+ betaling" drawer. */
.salgsbilag-v2 .sbv2-dr.sbv2-pay-row.sbv2-pay-mp-row {
    grid-template-columns: 88px 1fr auto;
    padding-top: 0; margin-top: -6px;
    font-size: 12px; color: var(--sbv2-muted);
}
.salgsbilag-v2 .sbv2-pay-mp-label { min-width: 0; }
.salgsbilag-v2 .sbv2-pay-mp-hint { display: block; font-size: 11px; color: var(--sbv2-muted-2); }
.salgsbilag-v2 .sbv2-pay-mp-amount { color: var(--sbv2-ink-2); justify-self: end; white-space: nowrap; }
.salgsbilag-v2 .sbv2-mp-ask {
    display: flex; flex-direction: column; gap: 8px;
    margin-bottom: 10px; padding: 10px 12px;
    border: 1px dashed var(--sbv2-line-strong); border-radius: 8px;
    background: var(--sbv2-tint);
    font-size: 13px;
}
.salgsbilag-v2 .sbv2-mp-ask[hidden] { display: none; }
.salgsbilag-v2 .sbv2-mp-q { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; }
.salgsbilag-v2 .sbv2-mp-q-label { font-weight: 600; color: var(--sbv2-ink-2); }
.salgsbilag-v2 .sbv2-mp-q label { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; }
.salgsbilag-v2 .sbv2-mp-fee-field { display: flex; flex-direction: column; gap: 4px; }
.salgsbilag-v2 .sbv2-mp-fee-field[hidden] { display: none; }
.salgsbilag-v2 .sbv2-mp-fee-hint { color: var(--sbv2-muted); }
.salgsbilag-v2 .sbv2-mp-error { margin: 0; font-size: 12px; color: var(--sbv2-rust); }
.salgsbilag-v2 .sbv2-mp-error[hidden] { display: none; }
/* #5830 follow-up: the drawer confirms the "Ja" with a moss chip + live
   "Betaling + gebyr = total" line; the decided-but-unpaid fee gets its own row
   in the Betalinger card. */
.salgsbilag-v2 .sbv2-chip.sbv2-chip-ok { background: var(--sbv2-moss-soft); color: var(--sbv2-moss); font-weight: 600; }
.salgsbilag-v2 .sbv2-mp-sum { margin: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; font-size: 13px; color: var(--sbv2-ink-2); }
.salgsbilag-v2 .sbv2-mp-sum[hidden] { display: none; }
.salgsbilag-v2 .sbv2-mp-sum strong { color: var(--sbv2-ink); font-weight: 600; }
.salgsbilag-v2 .sbv2-dr.sbv2-pay-row.sbv2-pay-mp-decision { margin-top: 0; padding-top: 8px; border-top: 1px dashed var(--sbv2-line); }
.salgsbilag-v2 .sbv2-dr-list:first-child > .sbv2-pay-mp-decision:first-child { border-top: 0; padding-top: 0; }
@media (max-width: 640px) {
    .salgsbilag-v2 .sbv2-dr.sbv2-pay-row.sbv2-pay-mp-row { display: grid; grid-template-columns: 1fr auto; }
    .salgsbilag-v2 .sbv2-dr.sbv2-pay-row.sbv2-pay-mp-row .sbv2-pay-date { display: none; }
}

/* ── Brugtmoms lock / Frigiv / Registrér manuelt (tresser-woo-opus#28) ──
   Chips reuse .bm-status; modals reuse .sbv2-modal (MobilePay fee gate). */
.bm-status-frigivet { background: #EFF6FF; color: #1D4ED8; }
.sbv2-brugtmoms-page .bm-status-frigivet { background: #EFF6FF; color: #1D4ED8; }
.bm-status-manuel, .sbv2-brugtmoms-page .bm-status-manuel { background: var(--sbv2-tint, #EFECDF); color: var(--sbv2-muted, #696860); }
.sbv2-brugtmoms-page .bm-col-action { white-space: nowrap; }
.sbv2-brugtmoms-page .bm-btn-release, .sbv2-brugtmoms-page .bm-btn-manual { margin-left: 4px; }
.salgsbilag-v2 .bm-line-sub { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 6px; }
.salgsbilag-v2 .bm-line-sub .bm-status { font-size: 11px; }
.salgsbilag-selected-product.bm-line-locked .salgsbilag-product-price,
.salgsbilag-selected-product.bm-line-locked .salgsbilag-product-discount { background: var(--sbv2-tint, #EFECDF); color: var(--sbv2-muted, #696860); cursor: not-allowed; }
.salgsbilag-selected-product.bm-line-locked .sb-remove-product { opacity: 0.35; pointer-events: none; }
.salgsbilag-selected-product .bm-line-lock-note { flex-basis: 100%; font-size: 11px; color: var(--sbv2-amber, #7A4A00); margin: 2px 0 0; }
input[data-bm-locked="1"] { background: var(--sbv2-tint, #EFECDF); color: var(--sbv2-muted, #696860); cursor: not-allowed; }
.bm-modal[hidden] { display: none !important; }
.bm-modal .bm-modal-body { display: flex; flex-direction: column; gap: 12px; padding: 20px 22px; font-size: 14px; }
.bm-modal .bm-modal-body p { margin: 0; }
.bm-modal .bm-modal-warn { color: var(--sbv2-rust); font-weight: 600; }
.bm-modal .bm-modal-error { color: var(--sbv2-rust); font-size: 13px; }
.bm-modal .bm-modal-error[hidden] { display: none; }
.bm-modal .bm-modal-actions { display: flex; flex-direction: column-reverse; gap: 8px; margin-top: 4px; }
.bm-modal .bm-modal-actions .sbv2-btn { width: 100%; justify-content: center; }
@media (min-width: 480px) {
    .bm-modal .bm-modal-actions { flex-direction: row; justify-content: flex-end; }
    .bm-modal .bm-modal-actions .sbv2-btn { width: auto; }
}

/* ── Bilag view header: pill + actions stay on the title line ────────────
   .sbv2-head wraps by default (and .sbv2-head-left carries min-width:280px),
   so on the single view the pill + Rediger + Send til Dinero dropped onto
   their own row under the title and left the left half of that row empty.
   .sbv2-head-tight opts the single view into: never wrap, title truncates
   first; below 600px the pill moves up beside the eyebrow and the buttons
   become a compact sticky bottom bar. */
.salgsbilag-v2 .sbv2-head-tight { flex-wrap: nowrap; align-items: flex-start; }
.salgsbilag-v2 .sbv2-head-tight .sbv2-head-left { flex: 1 1 auto; min-width: 0; }
.salgsbilag-v2 .sbv2-head-tight .sbv2-title { min-width: 0; }
.salgsbilag-v2 .sbv2-head-tight .sbv2-head-actions { flex: 0 0 auto; flex-wrap: nowrap; }
.salgsbilag-v2 .sbv2-head-tight .sbv2-head-btns { display: flex; align-items: center; gap: 8px; flex-wrap: nowrap; }
.salgsbilag-v2 .sbv2-head-tight .sbv2-pill { white-space: nowrap; }
/* In the account-v2 shell the topbar owns the title, so every child of
   .sbv2-head-left is display:none (account-v2.css "hide inline page titles")
   and the column renders as an empty 280px+ block that pushes the actions onto
   a band of their own. Drop it there and let the row be what it actually is. */
body.account-v2 .salgsbilag-v2 .sbv2-head-tight { justify-content: flex-end; margin-bottom: 16px; }
body.account-v2 .salgsbilag-v2 .sbv2-head-tight .sbv2-head-left { display: none; }

@media (max-width: 600px) {
    /* min-height keeps room for the absolutely positioned pill in the
       account-v2 shell, where .sbv2-head-left is hidden and the section would
       otherwise collapse to 0 and let the pill overlap the chain strip. */
    .salgsbilag-v2 .sbv2-head-tight { display: block; position: relative; padding-right: 96px; min-height: 34px; }
    .salgsbilag-v2 .sbv2-head-tight .sbv2-head-actions { display: contents; }
    .salgsbilag-v2 .sbv2-head-tight .sbv2-pill { position: absolute; top: 0; right: 0; margin: 0; }
    .salgsbilag-v2 .sbv2-head-tight .sbv2-head-btns {
        position: fixed; left: 0; right: 0; bottom: 0; z-index: 8900;
        padding: 10px 14px calc(10px + env(safe-area-inset-bottom, 0px));
        background: var(--sbv2-paper); border-top: 1px solid var(--sbv2-line);
        box-shadow: 0 -4px 14px rgba(0, 0, 0, 0.06);
    }
    /* Sit on top of the merchant bottom nav (.mbn, 60px tall at z-index 9000)
       rather than under it — see assets/css/merchant-nav.css. */
    body:has(.mbn) .salgsbilag-v2 .sbv2-head-tight .sbv2-head-btns {
        bottom: calc(60px + env(safe-area-inset-bottom, 0px));
        padding-bottom: 10px;
    }
    .salgsbilag-v2 .sbv2-head-tight .sbv2-head-btns > * { flex: 1 1 0; min-width: 0; }
    .salgsbilag-v2 .sbv2-head-tight .sbv2-head-btns .sbv2-btn { width: 100%; justify-content: center; }
    /* Room for the sticky bar so it never covers the last card. */
    .salgsbilag-v2 .sbv2-shell { padding-bottom: 132px; }
    body:has(.mbn) .salgsbilag-v2 .sbv2-shell { padding-bottom: 150px; }
}

/* Line meta strip on the salgsbilag edit form: "SKU · Købt · Brugtmoms" is
   longer than the bare SKU it replaced, so let it wrap inside the line's info
   column instead of being clipped — the product name above keeps its own
   single-line ellipsis. */
.salgsbilag-v2 .salgsbilag-product-sku { white-space: normal; line-height: 1.35; }

/* "Afslut uden Dinero" (inc/bilag/kobsbilag-afslut-uden-dinero.php): beside "Send til Dinero"; the inline confirm takes the whole row when open. */
.sbv2-kobs-view .sbv2-afslut-uden-dinero { flex: 1 1 0; min-width: 110px; }
.sbv2-kobs-view .sbv2-afslut-uden-dinero[open] { flex-basis: 100%; }
.sbv2-kobs-view .sbv2-afslut-uden-dinero > summary { list-style: none; display: flex; width: 100%; justify-content: center; cursor: pointer; }
.sbv2-kobs-view .sbv2-afslut-uden-dinero > summary::-webkit-details-marker { display: none; }

/* Krediteret købsbilag (inc/bilag/kobsbilag-credit.php): rust like the salgsbilag "Krediteret" pill. */
.bilag-dinero-status.bilag-dinero-credited, .salgsbilag-v2 .bilag-dinero-status.bilag-dinero-credited { background: var(--sbv2-rust-soft); color: var(--sbv2-rust); border-color: color-mix(in srgb, var(--sbv2-rust) 22%, transparent); }
.salgsbilag-v2 .bilag-line-status.is-credited { background: var(--sbv2-rust-soft); color: var(--sbv2-rust); }
.sbv2-kobs-view .sbv2-varer-card.is-credited .sbv2-varer-sum s { color: var(--sbv2-muted); }
.sbv2-kobs-view .sbv2-kobs-credit-form > summary { list-style: none; cursor: pointer; }
.sbv2-kobs-view .sbv2-kobs-credit-form > summary::-webkit-details-marker { display: none; }
.sbv2-kobs-view .sbv2-kobs-credit-form .sbv2-field { display: flex; flex-direction: column; gap: 4px; font-size: 12px; }
.sbv2-kobs-view .sbv2-kobs-credit-form .sbv2-field input { font: inherit; font-size: 14px; padding: 8px 10px; border: 1px solid var(--sbv2-line, #d9d4c7); border-radius: 8px; }
.sbv2-kobs-view .sbv2-credit-confirm > summary { list-style: none; cursor: pointer; justify-content: center; }
.sbv2-kobs-view .sbv2-credit-confirm > summary::-webkit-details-marker { display: none; }

/* Salgsbilag view (owner 2026-09-26): no status pill and no disabled "Låst"
   button any more — the lock is a small "Låst" chip in the topbar (status) —
   so on phones the head section holds only the fixed bottom bar; don't
   reserve the pill's 34px + right gutter for it. */
@media (max-width: 600px) {
    .salgsbilag-v2 .sbv2-head-tight:not(:has(.sbv2-pill)) { min-height: 0; padding-right: 0; margin-bottom: 0; }
}

/* Compact "Betaling" card (owner 2026-09-27) — bilag/payment-card.php, on both
   the salgsbilag and købsbilag views: "Betaling" + one status pill, the amount
   paid large with tabular figures, one muted "dato · konto (nr.)" line, or one
   row per payment + a total. */
.salgsbilag-v2 .sbv2-paycard-head { flex-wrap: nowrap; }
.salgsbilag-v2 .sbv2-paycard-head-r { display: flex; align-items: center; gap: 8px; margin-left: auto; min-width: 0; }
.salgsbilag-v2 .sbv2-paycard-head-r form { margin: 0; }
.salgsbilag-v2 .sbv2-paycard-head .sbv2-pill { white-space: nowrap; }
.salgsbilag-v2 .sbv2-paycard-amt { font-size: 28px; font-weight: 600; line-height: 1.15; letter-spacing: -0.01em; color: var(--sbv2-ink); font-variant-numeric: tabular-nums; }
.salgsbilag-v2 .sbv2-paycard-of { font-size: 15px; font-weight: 500; letter-spacing: 0; color: var(--sbv2-muted); }
.salgsbilag-v2 .sbv2-paycard-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 8px; margin-top: 4px; font-size: 13px; color: var(--sbv2-muted); }
.salgsbilag-v2 .sbv2-paycard-meta-txt { flex: 1 1 auto; min-width: 0; }
.salgsbilag-v2 .sbv2-paycard-rows { display: flex; flex-direction: column; gap: 8px; }
.salgsbilag-v2 .sbv2-paycard-row { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 10px; font-size: 13px; }
.salgsbilag-v2 .sbv2-paycard-row-amt { flex: 0 0 auto; min-width: 84px; font-weight: 600; color: var(--sbv2-ink-2); font-variant-numeric: tabular-nums; }
.salgsbilag-v2 .sbv2-paycard-row-det { flex: 1 1 0; min-width: 0; color: var(--sbv2-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.salgsbilag-v2 .sbv2-paycard-total { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin-top: 2px; padding-top: 10px; border-top: 1px solid var(--sbv2-line); }
.salgsbilag-v2 .sbv2-paycard-total .lbl { font-size: 12px; font-weight: 600; letter-spacing: 0.05em; text-transform: uppercase; color: var(--sbv2-muted); }
.salgsbilag-v2 .sbv2-paycard-total .sbv2-paycard-amt { font-size: 22px; }
.salgsbilag-v2 .sbv2-paycard .sbv2-pay-actions { flex: 0 0 auto; margin-left: auto; display: inline-flex; align-items: center; gap: 6px; }
.salgsbilag-v2 #sbv2-bilag-payments .sbv2-dr.sbv2-pay-row.sbv2-pay-mp-row { display: grid; grid-template-columns: 1fr auto; column-gap: 12px; margin: 6px 0 0; padding: 0; border: 0; }
.salgsbilag-v2 #sbv2-bilag-payments .sbv2-dr.sbv2-pay-row.sbv2-pay-mp-decision { margin-top: 10px; padding-top: 10px; border-top: 1px dashed var(--sbv2-line); }
.salgsbilag-v2 #sbv2-bilag-payments .sbv2-pay-mp-row .sbv2-pay-date { display: none; }
.salgsbilag-v2 #sbv2-bilag-payments .sbv2-pay-mp-amount { font-family: inherit; font-variant-numeric: tabular-nums; }
.salgsbilag-v2 .sbv2-paycard-actions { margin-top: 12px; }
.salgsbilag-v2 .sbv2-paycard + .sbv2-paycard-form { margin-top: 16px; padding-top: 14px; border-top: 1px dashed var(--sbv2-line); }
.salgsbilag-v2 .sbv2-paycard-form + .sbv2-paycard-actions { margin-top: 10px; }
@media (max-width: 600px) {
    .salgsbilag-v2 .sbv2-paycard-amt { font-size: 26px; }
}

/* ── Købsbilag line rows, calmer header (owner 2026-09-28) ───────────────────
   inc/bilag/line-row-render.php + assets/js/bilag-line-row.js / bilag-line-dba.js.
   Title on up to 2 lines (a clamped view while the input is not focused),
   price in the UI font with a "kr" suffix, the DBA badge + stock state as one
   muted line (the draft chips live in the fold-out), an amber hint for a
   half-filled line, a trash button next to the chevron. */
.salgsbilag-v2.sbv2-kobs-form .bilag-line-desc-view {
    margin: 6px 4px; /* margin, not padding: a clamped 3rd line must not peek into the padding */
    font-size: 14px; font-weight: 500; line-height: 1.35;
    color: var(--sbv2-ink);
    overflow-wrap: anywhere;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
    cursor: text;
}
.salgsbilag-v2.sbv2-kobs-form .bilag-line-desc-wrap:not(.has-text) .bilag-line-desc-view,
.salgsbilag-v2.sbv2-kobs-form .bilag-line-desc-wrap:focus-within .bilag-line-desc-view { display: none; }
/* Not focused + has text: the input steps aside (still focusable, still
   submitted); a tap on the view focuses it again (bilag-line-row.js). */
.salgsbilag-v2.sbv2-kobs-form .bilag-line-desc-wrap.has-text:not(:focus-within) .bilag-line-desc {
    position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); border: 0; white-space: nowrap;
}
/* Money in the form: Hanken with tabular figures, not the mono face. */
.salgsbilag-v2.sbv2-kobs-form .bilag-line-price,
.salgsbilag-v2.sbv2-kobs-form .bilag-fordel .mono,
.salgsbilag-v2.sbv2-kobs-form .bilag-target-input,
.salgsbilag-v2.sbv2-kobs-form #bilag-stat-total {
    font-family: 'Hanken Grotesk', system-ui, sans-serif;
    font-variant-numeric: tabular-nums;
}
.salgsbilag-v2.sbv2-kobs-form .bilag-line-price { width: 76px; font-weight: 500; }
@supports (field-sizing: content) {
    /* "kr" hugs the number; an empty field keeps room for "Pris". */
    .salgsbilag-v2.sbv2-kobs-form .bilag-line-price { field-sizing: content; width: auto; min-width: 2ch; max-width: 110px; }
}
.sbv2-kobs-form .bilag-line-price-kr { font-size: 13px; color: var(--sbv2-muted); margin-left: -2px; }
.sbv2-kobs-form .bilag-line-price-wrap { margin-right: 4px; }
/* DBA badge + stock state: one quiet line after the price. */
.salgsbilag-v2.sbv2-kobs-form .bilag-line-meta .bilag-line-status {
    padding: 0; border: 0; border-radius: 0; background: none;
    font-size: 12px; font-weight: 400; color: var(--sbv2-muted);
}
.salgsbilag-v2.sbv2-kobs-form .bilag-line-meta .bilag-line-status.is-sold { color: #2f5d3e; }
.salgsbilag-v2.sbv2-kobs-form .bilag-line-meta .bilag-line-status.is-reserved { color: #92400e; }
/* Half-filled line: amber hint (+ re-fetch on DBA lines). */
.sbv2-kobs-form .bilag-line-warn {
    display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px;
    margin-top: 6px; padding-left: 4px;
}
.sbv2-kobs-form .bilag-line-warn[hidden] { display: none; }
.sbv2-kobs-form .bilag-line-warn-text {
    padding: 2px 8px; border-radius: 999px;
    background: var(--sbv2-amber-soft, #fef3c7); color: var(--sbv2-amber, #92400e);
    font-size: 12px; font-weight: 600;
}
.sbv2-kobs-form .bilag-line-row:not(.bilag-line-dba) .bilag-line-refetch,
.sbv2-kobs-form .bilag-line-row.has-product .bilag-line-refetch { display: none; }
.salgsbilag-v2.sbv2-kobs-form .bilag-line-refetch { display: inline-flex; align-items: center; gap: 6px; }
.salgsbilag-v2.sbv2-kobs-form .bilag-line-foot .bilag-line-refetch { min-height: 36px; font-size: 12px; }
.salgsbilag-v2.sbv2-kobs-form .bilag-line-refetch .sbv2-btn-spin {
    width: 12px; height: 12px; box-sizing: border-box;
    border: 2px solid currentColor; border-top-color: transparent; border-radius: 50%;
    animation: sbv2-btn-spin .7s linear infinite;
}
.sbv2-kobs-form .bilag-line-refetch-msg { font-size: 12px; color: var(--sbv2-muted); }
.sbv2-kobs-form .bilag-line-foot .bilag-line-refetch-msg { flex: 1 0 100%; order: 9; }
.sbv2-kobs-form .bilag-line-refetch-msg.is-err { color: var(--sbv2-rust); }
.sbv2-kobs-form .bilag-line-refetch-msg.is-ok { color: var(--sbv2-moss); }
.sbv2-kobs-form .bilag-line-refetch-msg.is-ask { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; color: var(--sbv2-ink); font-weight: 500; }
.sbv2-kobs-form .bilag-det-dba-dims { display: block; margin: -2px 0 4px; font-size: 11px; color: var(--sbv2-muted); }
.sbv2-kobs-form .bilag-det-dba-dims[hidden] { display: none; }
/* Trash: next to the chevron; first tap arms ("Slet linje?"), second deletes. */
.sbv2-kobs-form .bilag-line-del {
    flex: 0 0 auto;
    min-width: 32px; height: 36px;
    margin-top: 6px; margin-right: -6px;
    padding: 0 6px;
    border: 0; border-radius: 8px;
    background: transparent;
    color: var(--sbv2-muted-2, #a8a397);
    font: inherit; font-size: 12px; font-weight: 600;
    cursor: pointer;
    display: inline-flex; align-items: center; justify-content: center; gap: 4px;
    -webkit-tap-highlight-color: transparent;
}
.sbv2-kobs-form .bilag-line-del-ask { display: none; white-space: nowrap; }
.sbv2-kobs-form .bilag-line-del.is-armed { background: var(--sbv2-rust-soft); color: var(--sbv2-rust); margin-right: 0; }
.sbv2-kobs-form .bilag-line-del.is-armed .bilag-line-del-ask { display: inline; }
.sbv2-kobs-form .bilag-line-del:focus-visible { outline: 2px solid var(--sbv2-moss); outline-offset: 1px; }
@media (hover: hover) {
    .sbv2-kobs-form .bilag-line-del:hover { color: var(--sbv2-rust); }
}