/* betterSALES — Anbauplatz des Moduls (CLAUDE.md „Sammeldateien haben einen Anbauplatz je Modul").
   Nur Layout und Zustände der Belegstrecke; Farben, Abstände und Radien ausschließlich aus tokens.css,
   Kacheln/Karten/Tabellen/Chips aus bp-components.css. Keine eigenen Hex-Werte. */

/* ---------- Grundlagen ---------- */

.sales-h1 {
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--bp-text);
    margin: 0;
}

.sales-lead {
    margin: var(--bp-space-1) 0 0;
    font-size: 0.88rem;
}

.sales-muted { color: var(--bp-text-muted); }

.sales-strong { font-weight: 600; }

.sales-num,
.sales-mono,
.sales-pos td,
.sales-sum dd {
    font-variant-numeric: tabular-nums;
}

.sales-num { text-align: right; white-space: nowrap; }

.sales-mono { letter-spacing: 0.01em; white-space: nowrap; }

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.sales-kpi-grid { --bp-stat-cols: 4; }

.sales-tile-link {
    color: inherit;
    text-decoration: none;
    transition: border-color 160ms ease-out;
}

.sales-tile-link:hover { border-color: var(--bp-text-muted); }

.sales-tile-link:focus-visible {
    outline: 2px solid var(--bp-yellow);
    outline-offset: 2px;
}

/* ---------- Überblick: Karteireiter je Belegfamilie ---------- */

/* Kacheln so breit, wie der Reiter Platz hat — Angebote tragen fünf, Rücksendungen zwei; feste Spalten ließen Lücken. */
.sales-ov__tiles {
    grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr));
    margin-bottom: var(--bp-space-4);
}

.sales-ov__tiles a.bp-stat-tile {
    color: inherit;
    text-decoration: none;
}

/* Kennzahlenleiste über den Reitern: die Lage auf den ersten Blick. Hierarchie über Größe, nicht über Schmuck —
   die Werte stehen eine Stufe größer als die Kacheln der Reiter, damit klar ist, was zuerst gelesen wird. */
.sales-ov__keys {
    --bp-stat-cols: 5;
    margin-bottom: var(--bp-space-5);
}

.sales-ov__keys .bp-stat-tile {
    padding-block: var(--bp-space-3);
}

.sales-ov__keys .bp-stat-tile__value {
    font-size: 2.125rem;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

.sales-ov__keys a.bp-stat-tile {
    color: inherit;
    text-decoration: none;
}

.sales-ov__keys a.bp-stat-tile:focus-visible {
    outline: 2px solid var(--bp-yellow);
    outline-offset: 2px;
}

/* Bei schmaler Arbeitsfläche lieber drei plus zwei als fünf gequetschte Beträge. */
@media (max-width: 1500px) {
    .sales-ov__keys .bp-stat-tile__value { font-size: 1.75rem; }
}

.sales-ov__docs {
    margin-bottom: var(--bp-space-3);
}

.sales-ov__listhead {
    display: flex;
    align-items: baseline;
    gap: var(--bp-space-3);
    margin-bottom: var(--bp-space-2);
}

.sales-ov__listhead .sales-ov__mask {
    margin-left: auto;
    font-size: 0.8125rem;
}

/* ---------- Belegseite: Raster + Detailspalte ---------- */

.sales-doc__head { align-items: center; }

.sales-doc__title h1 {
    font-size: 1.5rem;
    font-weight: 600;
    margin: var(--bp-space-1) 0 var(--bp-space-2);
    color: var(--bp-text);
}

.sales-doc__crumb {
    display: flex;
    align-items: center;
    gap: var(--bp-space-2);
    font-size: 0.8rem;
    color: var(--bp-text-muted);
}

.sales-doc__head-actions {
    display: flex;
    align-items: center;
    gap: var(--bp-space-2);
    flex-shrink: 0;
}

.sales-doc__legacy { padding: var(--bp-space-3) 2rem 0; }

/* Einspaltig (Nutzerentscheid 01.10.2026): Neben Hauptmenü und Aktions-Dock blieb für eine dritte Spalte
   zu wenig Platz — die Positionstabelle bekommt die volle Breite, alles Übrige steht darunter. */
.sales-doc__body {
    display: flex;
    flex-direction: column;
    gap: var(--bp-space-4);
    padding: var(--bp-space-4) 2rem 2rem;
}

.sales-doc__main {
    display: flex;
    flex-direction: column;
    gap: var(--bp-space-3);
    min-width: 0;
}

/* Band unter der Tabelle: Positionsdetails über die volle Breite (direkt unter den Zeilen, wo der Blick
   ist), darunter Summen und Belegkette — auf breiten Bildschirmen nebeneinander, sonst untereinander. */
.sales-doc__side {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(22rem, 1fr));
    gap: var(--bp-space-3);
    align-items: start;
    min-width: 0;
}

.sales-doc__side > .sales-detail { grid-column: 1 / -1; }

/* ---------- Kopf ---------- */

.sales-kv {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    min-width: 0;
    font-size: 0.88rem;
    color: var(--bp-text);
}

.sales-kv__label {
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--bp-text-muted);
}

.sales-head__note {
    margin: var(--bp-space-3) 0 0;
    font-size: 0.85rem;
    color: var(--bp-text);
}


/* ---------- Positionsraster ---------- */

.sales-positions__scroll {
    overflow-x: auto;
    margin-top: var(--bp-space-2);
}

.sales-pos { font-size: 0.85rem; }

.sales-pos th,
.sales-pos td { padding: 0.45rem 0.5rem; }

/* Die Zeile selbst wählt nicht mehr (17.10.2026): die Positionsnummer öffnet die Details, Zellen bearbeiten. */
.sales-pos__row { transition: background-color 120ms ease-out; }

.sales-pos__row:hover td { background: color-mix(in srgb, var(--bp-text) 4%, transparent); }


.sales-pos__row--selected td { background: color-mix(in srgb, var(--bp-yellow) 9%, transparent); }

.sales-pos__row--child td {
    color: var(--bp-text-muted);
    font-size: 0.8rem;
}

.sales-pos__row--child td:nth-child(4) { padding-left: 1.4rem; }

.sales-pos__row--text .sales-pos__textcell { font-style: italic; }

.sales-pos__state { width: 1.2rem; }

.sales-pos__empty {
    padding: var(--bp-space-4) var(--bp-space-2);
    text-align: center;
    color: var(--bp-text-muted);
}

/* Zeilenzustand (E-07): ok · manuell abweichend · unvollständig. */
.sales-state {
    display: inline-block;
    width: 0.55rem;
    height: 0.55rem;
    border-radius: 50%;
    vertical-align: middle;
}

.sales-state--ok { background: var(--bp-success); }

.sales-state--manual { background: var(--bp-warn); }

.sales-state--incomplete {
    background: transparent;
    box-shadow: inset 0 0 0 2px var(--bp-debit);
}

/* Schnellerfassung: Menge · Artikel · Preis · Enter. */
.sales-entry {
    display: grid;
    grid-template-columns: 6rem minmax(0, 1fr) 9rem auto;
    gap: var(--bp-space-2);
    align-items: center;
    margin-top: var(--bp-space-3);
    padding-top: var(--bp-space-3);
    border-top: 1px dashed var(--bp-panel-border);
}

.sales-entry__input {
    width: 100%;
    height: 2.25rem;
    padding: 0 0.65rem;
    font: inherit;
    font-size: 0.88rem;
    color: var(--bp-text);
    background: color-mix(in srgb, var(--bp-text) 3%, transparent);
    border: 1px solid var(--bp-panel-border);
    border-radius: var(--bp-radius-ctl);
    caret-color: var(--bp-yellow);
    transition: border-color 140ms ease-out;
}

.sales-entry__input::placeholder { color: var(--bp-text-muted); }

.sales-entry__input:focus {
    outline: none;
    border-color: var(--bp-yellow);
}

/* ---------- Detailspalte ---------- */

.sales-detail__name {
    margin: var(--bp-space-2) 0 var(--bp-space-3);
    font-weight: 600;
    color: var(--bp-text);
}

.sales-detail__name-field {
    margin: var(--bp-space-2) 0 var(--bp-space-3);
}

/* Langtext: unter der Bezeichnung, eine Stufe leiser — er ergänzt den Titel, er konkurriert nicht mit ihm. */
.sales-detail__longtext-field {
    margin: 0 0 var(--bp-space-3);
}

.sales-detail__longtext-field textarea {
    min-height: 6.5rem;
    line-height: 1.45;
    resize: vertical;
}

.sales-detail__longtext {
    margin: 0 0 var(--bp-space-3);
    color: var(--bp-text-muted);
    font-size: 0.85rem;
    line-height: 1.45;
    white-space: pre-line;
}

.sales-detail__sub {
    margin: var(--bp-space-4) 0 var(--bp-space-2);
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--bp-text-muted);
}

.sales-detail__actions {
    display: flex;
    align-items: center;
    gap: var(--bp-space-2);
    margin-top: var(--bp-space-3);
}

.sales-formula {
    margin: var(--bp-space-3) 0 0;
    padding: var(--bp-space-2);
    font-size: 0.75rem;
    line-height: 1.5;
    font-variant-numeric: tabular-nums;
    color: var(--bp-text);
    background: color-mix(in srgb, var(--bp-saldo) 10%, transparent);
    border-radius: var(--bp-radius-ctl);
}

.sales-facts {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.3rem var(--bp-space-3);
    margin: var(--bp-space-3) 0 0;
    font-size: 0.8rem;
}

.sales-facts dt { color: var(--bp-text-muted); }

.sales-facts dd {
    margin: 0;
    color: var(--bp-text);
}

/* Preisherkunft (E-03): verwendet · verworfen · Hinweis. */
.sales-trail {
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: 0.8rem;
}

.sales-trail__item {
    display: grid;
    grid-template-columns: 1rem minmax(0, 1fr);
    gap: var(--bp-space-2);
    padding: 0.35rem 0;
    border-bottom: 1px dashed var(--bp-panel-border);
    color: var(--bp-text);
}

.sales-trail__item:last-child { border-bottom: none; }

.sales-trail__item .e-icons { font-size: 0.85rem; line-height: 1.3; }

.sales-trail__item--used .e-icons { color: var(--bp-success); }

.sales-trail__item--skipped { color: var(--bp-text-muted); }

.sales-trail__item--info .e-icons { color: var(--bp-saldo); }

/* ---------- Summen und Belegkette ---------- */

.sales-sum {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.35rem var(--bp-space-3);
    margin: var(--bp-space-3) 0 0;
    font-size: 0.88rem;
}

.sales-sum dt { color: var(--bp-text-muted); }

.sales-sum dd {
    margin: 0;
    text-align: right;
    color: var(--bp-text);
}

.sales-sum .sales-sum__total {
    padding-top: var(--bp-space-2);
    border-top: 1px solid var(--bp-text-muted);
    font-weight: 700;
    color: var(--bp-text);
}

.sales-note {
    margin: var(--bp-space-2) 0 0;
    padding: var(--bp-space-2);
    font-size: 0.78rem;
    color: var(--bp-text);
    background: color-mix(in srgb, var(--bp-saldo) 10%, transparent);
    border-radius: var(--bp-radius-ctl);
}

/* Belegkette als Reiter: Glieder untereinander, durch eine Linie verbunden — die Reihenfolge ist die Kette. */
.sales-chain__list {
    display: flex;
    flex-direction: column;
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: 0.85rem;
}

.sales-chain__list li {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 0 0 var(--bp-space-3) 1.5rem;
}

.sales-chain__list li:last-child { padding-bottom: 0; }

.sales-chain__list li::before {
    content: "";
    position: absolute;
    left: 0.25rem;
    top: 0.35rem;
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 50%;
    border: 2px solid var(--bp-panel-border);
    background: var(--bp-panel-solid);
}

.sales-chain__list li:not(:last-child)::after {
    content: "";
    position: absolute;
    left: calc(0.5rem - 1px);
    top: 1.1rem;
    bottom: 0.1rem;
    width: 2px;
    background: var(--bp-panel-border);
}

.sales-chain__list li.sales-chain__item--current::before {
    border-color: var(--bp-ci-yellow);
    background: var(--bp-ci-yellow);
}

.sales-chain__item--current .sales-mono {
    color: var(--bp-black);
    background: var(--bp-yellow);
    padding: 0 0.35rem;
    align-self: flex-start;
}

/* ---------- Cockpit ---------- */

.sales-todo tbody tr { cursor: pointer; }

.sales-todo--urgent td { color: var(--bp-text); }

.sales-todo .bp-dot { margin-right: var(--bp-space-1); }

/* ---------- Dialoge ---------- */

.sales-dialog .e-dlg-content {
    display: flex;
    flex-direction: column;
    gap: var(--bp-space-3);
}

.sales-dialog__hint {
    margin: 0;
    font-size: 0.82rem;
    color: var(--bp-text-muted);
}

.sales-dialog__warn,
.sales-dialog__blocked {
    margin: 0;
    padding: var(--bp-space-2);
    font-size: 0.82rem;
    border-radius: var(--bp-radius-ctl);
    color: var(--bp-text);
}

.sales-dialog__warn { background: color-mix(in srgb, var(--bp-warn) 16%, transparent); }

.sales-dialog__blocked { background: color-mix(in srgb, var(--bp-debit) 16%, transparent); }

/* Berichtigung: Positionstexte als ruhige Liste — die Kennzeile (Pos., Artikel, Menge, Betrag) sagt, welche Position
   gemeint ist; die Beträge selbst sind nicht änderbar und stehen deshalb nur als Text da. */
.sales-amend-lines {
    display: flex;
    flex-direction: column;
    gap: var(--bp-space-2);
    padding-top: var(--bp-space-2);
    border-top: 1px solid var(--bp-border);
}

.sales-amend-lines__title {
    margin: 0;
    font-size: 0.82rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--bp-text-muted);
}

.sales-amend-line {
    display: flex;
    flex-direction: column;
    gap: var(--bp-space-2);
    padding: var(--bp-space-2) 0;
}

.sales-amend-line + .sales-amend-line {
    border-top: 1px dashed var(--bp-border);
}

.sales-amend-line__head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--bp-space-2);
}

.sales-amend-line__pos {
    font-weight: 600;
    color: var(--bp-text);
}

/* Leistungszeitraum im Belegkopf: zwei Datumsfelder in der Breite eines Feldes, der Strich als stilles Bindeglied. */
.sales-period {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    align-items: center;
    gap: var(--bp-space-1, 4px);
    width: 100%;
}

.sales-period__sep {
    color: var(--bp-text-faint);
}

.sales-field {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    font-size: 0.8rem;
    color: var(--bp-text-muted);
}

.sales-field--inline {
    flex-direction: row;
    align-items: center;
    gap: var(--bp-space-3);
}

.sales-grid { display: grid; gap: var(--bp-space-3); }

.sales-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }

/* Positionsdetails stehen jetzt in voller Breite unter der Tabelle: die Felder in eine Zeile, statt zu zweit. */
.sales-detail .sales-grid--2 { grid-template-columns: repeat(auto-fill, minmax(10rem, 1fr)); }

/* Artikeländerung seit dem Erfassen: alt → neu je geändertem Feld, darunter die Übernahme. */
.sales-article-change {
    display: flex;
    flex-direction: column;
    gap: var(--bp-space-2);
    margin-top: var(--bp-space-3);
    padding: var(--bp-space-3);
    border: 1px solid color-mix(in srgb, var(--bp-warn) 38%, transparent);
    background: color-mix(in srgb, var(--bp-warn) 9%, transparent);
    border-radius: var(--bp-radius-ctl);
}

.sales-article-change__title {
    margin: 0;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--bp-warn);
}

.sales-article-change__list {
    display: grid;
    grid-template-columns: max-content minmax(0, 1fr);
    gap: 0.25rem var(--bp-space-3);
    margin: 0;
    font-size: 0.85rem;
}

.sales-article-change__list dt { color: var(--bp-text-muted); }

.sales-article-change__list dd { margin: 0; }

.sales-article-change__old {
    color: var(--bp-text-muted);
    text-decoration: line-through;
    text-decoration-color: color-mix(in srgb, var(--bp-text-muted) 60%, transparent);
}

.sales-checks {
    display: flex;
    flex-direction: column;
    gap: var(--bp-space-2);
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: 0.85rem;
}

.sales-checks__item {
    display: grid;
    grid-template-columns: 6rem minmax(0, 1fr);
    gap: var(--bp-space-2);
    align-items: baseline;
    color: var(--bp-text);
}

.sales-checks__item .bp-chip { justify-self: start; }
/* „Nachtragen“ steht in der Textspalte unter der Meldung — die Abhilfe gehört sichtbar zur Sperre. */
.sales-checks__fix { grid-column: 2; justify-self: start; }

/* Nachtrag-Dialog: je betroffene Position bzw. Einheit eine Zeile, Eingabe rechts. */
.sales-fix__row {
    display: grid;
    grid-template-columns: 3.5rem minmax(0, 1fr) 11rem;
    gap: var(--bp-space-2);
    align-items: center;
    padding: var(--bp-space-2) 0;
    border-top: 1px solid var(--bp-panel-border);
}
.sales-fix__row:first-of-type { border-top: 0; }
.sales-fix__label { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sales-fix__all { display: flex; gap: var(--bp-space-2); align-items: center; margin-bottom: var(--bp-space-2); }

.sales-qty td { vertical-align: middle; }

/* Entnahmedialog: je Artikel ein Block, Summe rechts — grün erst, wenn sie genau passt. */
.sales-pick + .sales-pick { margin-top: var(--bp-space-3); }

.sales-pick__head {
    display: flex;
    justify-content: space-between;
    gap: var(--bp-space-2);
    margin-bottom: var(--bp-space-1);
    font-weight: 600;
    color: var(--bp-text);
}

.sales-pick__sum {
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
    color: var(--bp-warn);
}

.sales-pick__sum--ok { color: var(--bp-success); }

/* Rückstand im Seitenpanel: die eine Zahl, die handeln lässt. */
.sales-stock--short { color: var(--bp-warn); font-weight: 600; }

/* Entnommene Bestände im Seitenpanel der Lieferung. */
.sales-issued { list-style: none; margin: 0; padding: 0; }

.sales-issued__item {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: var(--bp-space-2);
    padding: 0.3rem 0;
    font-size: 0.85rem;
    border-bottom: 1px solid var(--bp-panel-border);
}

.sales-issued__item:last-child { border-bottom: none; }

/* Rechnungsart als wählbare Zeilen statt nackter Radio-Knöpfe. */
.sales-kinds {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--bp-space-2);
}

.sales-kind {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.15rem var(--bp-space-2);
    padding: var(--bp-space-2) var(--bp-space-3);
    border: 1px solid var(--bp-panel-border);
    border-radius: var(--bp-radius-ctl);
    cursor: pointer;
    transition: border-color 140ms ease-out;
}

.sales-kind input { accent-color: var(--bp-yellow); grid-row: span 2; }

.sales-kind--on { border-color: var(--bp-yellow); }

.sales-kind__label { font-weight: 600; color: var(--bp-text); }

.sales-kind__hint { font-size: 0.75rem; color: var(--bp-text-muted); }

/* Segment-Umschalter Angebot | Auftrag. */
.sales-segment {
    display: inline-flex;
    border: 1px solid var(--bp-panel-border);
    align-self: flex-start;
}

.sales-segment__item {
    appearance: none;
    padding: 0.4rem 1rem;
    font: inherit;
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--bp-text-muted);
    background: none;
    border: none;
    cursor: pointer;
}

.sales-segment__item--on {
    color: var(--bp-black);
    background: var(--bp-yellow);
}

.sales-segment__item:focus-visible {
    outline: 2px solid var(--bp-yellow);
    outline-offset: 2px;
}

.sales-manual-mark {
    margin-left: 0.25rem;
    font-size: 0.7rem;
    color: var(--bp-warn);
}

/* ---------- Stammdatenmasken: Liste links, Bearbeitung rechts (wie die Belegseite, breitere Spalte) ---------- */
.sales-md { grid-template-columns: minmax(0, 1fr) 26rem; }

@media (max-width: 1100px) {
    .sales-md { grid-template-columns: minmax(0, 1fr); }
}

.sales-md__toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--bp-space-3);
    margin-bottom: var(--bp-space-3);
}

.sales-md__search { max-width: 18rem; }

/* Belegliste: Suche rechts, auch wenn keine Reiter davorstehen; der Abstand zur Tabelle kommt vom Seitenraster. */
.sales-doclist__toolbar { margin-bottom: 0; }
.sales-doclist__search { margin-left: auto; }

/* Abweichender Rechnungsempfänger als leise Zusatzzeile unter dem Kunden — eine Aussage, keine zweite Hauptzeile. */
.sales-doclist__customer,
.sales-doclist__recipient {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sales-doclist__recipient {
    font-size: 0.75rem;
    line-height: 1.4;
    color: var(--bp-text-muted);
}

.sales-md__row {
    cursor: pointer;
    transition: background-color 120ms ease-out;
}

.sales-md__row:hover td { background: color-mix(in srgb, var(--bp-text) 4%, transparent); }

.sales-md__row:focus-visible {
    outline: 2px solid var(--bp-yellow);
    outline-offset: -2px;
}

.sales-md__row--selected td { background: color-mix(in srgb, var(--bp-yellow) 9%, transparent); }

.sales-md__flags { white-space: nowrap; }

.sales-md__flags .bp-chip + .bp-chip { margin-left: 0.25rem; }

.sales-md__more {
    margin: var(--bp-space-3) 0 0;
    font-size: 0.8rem;
}

/* Das fieldset trägt nur das „disabled" für Leser ohne Bearbeitungsrecht — optisch keine eigene Box. */
.sales-md__form {
    margin: 0;
    padding: 0;
    border: 0;
    min-width: 0;
}

.sales-md__hint {
    margin: var(--bp-space-2) 0 0;
    font-size: 0.78rem;
}

/* Rahmenvertrag: Unterschrift und Änderungsschutz als ruhige Statuszeile unter dem Kopf — Chip trägt das Signal,
   der Satz daneben die Folge. Keine eigene Karte: es ist ein Zustand des Vertrags, kein weiterer Bereich. */
.sales-fw-sign {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--bp-space-2) var(--bp-space-3);
    margin: var(--bp-space-3) 0 0;
    font-size: 0.82rem;
    color: var(--bp-text);
}

.sales-fw-sign .bp-chip + span {
    color: var(--bp-text-muted);
}

.sales-md__discount {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 6rem auto;
    gap: var(--bp-space-2);
    align-items: center;
    margin-bottom: var(--bp-space-2);
}

.sales-md__checks {
    display: flex;
    flex-direction: column;
    gap: var(--bp-space-2);
    margin-bottom: var(--bp-space-3);
}

/* Kopf einer Preisliste: drei Spalten, der Name über zwei. */
.sales-md__head { grid-template-columns: repeat(3, minmax(0, 1fr)); }

.sales-md__span2 { grid-column: span 2; }

@media (max-width: 800px) {
    .sales-md__head { grid-template-columns: minmax(0, 1fr); }
    .sales-md__span2 { grid-column: auto; }
}

.sales-md__stack { margin-top: var(--bp-space-3); }

/* Ergebnis eines Regeltests: Schlüssel groß, Satz und Hinweise daneben. */
.sales-md__result {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: var(--bp-space-2) var(--bp-space-3);
    margin-top: var(--bp-space-3);
    padding: var(--bp-space-2) var(--bp-space-3);
    border: 1px solid color-mix(in srgb, var(--bp-success) 45%, transparent);
    border-radius: var(--bp-radius-ctl);
    background: color-mix(in srgb, var(--bp-success) 8%, transparent);
}

/* Auswahlspalte der Laufseiten. */
.sales-md__check { width: 2.5rem; text-align: center; }

/* Sondersatz-Zeile: Art, Bezug, Satz, Entfernen. */
.sales-md__rate {
    display: grid;
    grid-template-columns: 8rem minmax(0, 1fr) 5.5rem auto;
    gap: var(--bp-space-2);
    align-items: center;
    margin-bottom: var(--bp-space-2);
}

/* Fertigung an der Position (Fabric über IProductionContract): Terminanfrage und Fortschritt. */
.sales-prod { display: flex; flex-wrap: wrap; align-items: center; gap: var(--bp-space-2); margin-top: var(--bp-space-2); }
.sales-prod__meter { display: inline-block; width: 5rem; height: 0.3rem; margin-left: var(--bp-space-2); vertical-align: middle; border-radius: 2px; overflow: hidden; background: color-mix(in srgb, var(--bp-text) 8%, transparent); }
.sales-prod__meter span { display: block; height: 100%; background: var(--bp-petrol); transform-origin: left center; transform: scaleX(var(--sales-p, 0)); }
.sales-prod__warn { margin: var(--bp-space-2) 0 0; padding: var(--bp-space-2); font-size: 0.78rem; line-height: 1.45; color: var(--bp-text); background: color-mix(in srgb, var(--bp-warn) 16%, transparent); border-radius: var(--bp-radius-ctl); }
.sales-prod__result { display: flex; flex-wrap: wrap; align-items: center; gap: 0.4rem var(--bp-space-2); margin-top: var(--bp-space-2); padding: var(--bp-space-2); font-size: 0.8rem; border-radius: var(--bp-radius-ctl); background: color-mix(in srgb, var(--bp-text) 5%, transparent); }
.sales-prod__light { width: 0.65rem; height: 0.65rem; border-radius: 50%; background: var(--bp-text-faint); }
.sales-prod__result--green .sales-prod__light { background: var(--bp-credit); }
.sales-prod__result--yellow .sales-prod__light { background: var(--bp-warn); }
.sales-prod__result--red .sales-prod__light { background: var(--bp-debit); }
.sales-prod__reasons { margin: var(--bp-space-2) 0 0; padding-left: 1.1rem; display: flex; flex-direction: column; gap: 0.25rem; font-size: 0.76rem; line-height: 1.45; color: var(--bp-text); }
.sales-prod__more { margin-top: 0.25rem; font-size: 0.76rem; }
/* ---------- Elektronische Signatur: Verlauf am Beleg und Versanddialog ---------- */

.sig-timeline__facts {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
    gap: 0.75rem 1.5rem;
    margin: 0 0 1rem;
}

.sig-timeline__facts dt {
    font-size: 0.78rem;
    color: var(--bp-text-muted);
    margin-bottom: 0.15rem;
}

.sig-timeline__facts dd {
    margin: 0;
}

.sig-steps {
    list-style: none;
    margin: 0 0 1rem;
    padding: 0;
    display: flex;
    flex-direction: column;
}

.sig-steps__item {
    position: relative;
    display: grid;
    grid-template-columns: 1rem 1fr auto;
    align-items: baseline;
    gap: 0.75rem;
    padding: 0.4rem 0;
}

/* Verbindungslinie zwischen den Punkten – zeigt den Weg, nicht nur eine Liste. */
.sig-steps__item:not(:last-child)::after {
    content: "";
    position: absolute;
    left: calc(0.5rem - 0.5px);
    top: 1.15rem;
    bottom: -0.4rem;
    border-left: 1px solid var(--bp-panel-border);
}

.sig-steps__dot {
    width: 0.6rem;
    height: 0.6rem;
    border-radius: 50%;
    justify-self: center;
    align-self: center;
    background: var(--bp-text-muted);
}

.sig-steps__item--ok .sig-steps__dot { background: var(--bp-success); }
.sig-steps__item--bad .sig-steps__dot { background: var(--bp-debit); }
.sig-steps__item--warn .sig-steps__dot { background: var(--bp-warn); }

.sig-steps__time {
    color: var(--bp-text-muted);
    font-size: 0.82rem;
    font-variant-numeric: tabular-nums;
}

.sig-timeline__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.sig-timeline__older {
    margin-top: 1rem;
    border-top: 1px solid var(--bp-panel-border);
    padding-top: 0.75rem;
}

.sig-timeline__older summary {
    cursor: pointer;
    color: var(--bp-text-muted);
}

.sig-timeline__older ul {
    list-style: none;
    margin: 0.5rem 0 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.sig-timeline__older li {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
    align-items: baseline;
}

.sig-dialog__doc {
    font-family: var(--bp-font-head);
    font-weight: 600;
    font-size: 1.05rem;
    margin: 0 0 1rem;
}

.sig-list__filters {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem 1.5rem;
}

/* ---------- Beleganlagen (z.B. Leistungsnachweis aus betterPM an der Rechnung) ---------- */
.sales-attachments { list-style: none; margin: 0; padding: 0; }
.sales-attachments__item {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 0.75rem;
    padding: 0.5rem 0;
    border-top: 1px solid var(--bp-panel-border);
}
.sales-attachments__item:first-child { border-top: 0; }
.sales-attachments__name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--bp-text); }
/* „Datei anfügen“: das Dateifeld liegt unsichtbar über dem Knopf — der Knopf ist das Klickziel, Tastatur inklusive. */
.sales-attachments__add { position: relative; margin-left: auto; display: inline-flex; align-items: center; gap: 0.35rem; cursor: pointer; }
.sales-attachments__input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.sales-attachments__add:focus-within { outline: 2px solid var(--bp-focus, var(--bp-yellow)); outline-offset: 2px; }

/* ---------- Belegversand per E-Mail (Dialog + Versandprotokoll) ---------- */
/* Kopfzeilen wie im Mailprogramm: Schlüssel links in fester Spalte, Felder rechts – das Auge findet „An“ und
   „Betreff“ dort, wo es sie aus jedem Mailclient kennt. Anhänge als ruhige Liste, abgewählte treten zurück. */
.mail-dialog__doc {
    margin: 0;
    font-family: var(--bp-font-head);
    font-weight: 600;
    color: var(--bp-text);
}

.mail-dialog__rows {
    display: grid;
    gap: var(--bp-space-2);
}

.mail-dialog__row {
    display: grid;
    grid-template-columns: 6.5rem minmax(0, 1fr);
    align-items: center;
    gap: var(--bp-space-3);
}

.mail-dialog__key {
    font-size: 0.8rem;
    color: var(--bp-text-muted);
}

.mail-dialog__meta {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--bp-space-3);
}

.mail-dialog__link {
    border: 0;
    padding: 0;
    background: none;
    font-size: 0.82rem;
    color: var(--bp-text);
    text-decoration: underline;
    text-decoration-color: var(--bp-yellow);
    text-underline-offset: 0.2em;
    cursor: pointer;
}

.mail-dialog__link:focus-visible { outline: 2px solid var(--bp-yellow); outline-offset: 2px; }

.mail-dialog__chips {
    display: flex;
    flex-wrap: wrap;
    gap: var(--bp-space-1);
}

.mail-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.2rem 0.6rem;
    border: 1px solid var(--bp-panel-border);
    border-radius: 999px;
    background: transparent;
    color: var(--bp-text);
    font-size: 0.8rem;
    cursor: pointer;
    transition: border-color 120ms ease-out, background-color 120ms ease-out;
}

.mail-chip:hover { border-color: var(--bp-yellow); background: color-mix(in srgb, var(--bp-yellow) 8%, transparent); }
.mail-chip:focus-visible { outline: 2px solid var(--bp-yellow); outline-offset: 2px; }
.mail-chip .e-icons { font-size: 0.7rem; color: var(--bp-text-muted); }
.mail-chip__role { color: var(--bp-text-muted); }

.mail-dialog__body textarea { min-height: 11rem; line-height: 1.5; }

.mail-files {
    margin: 0;
    padding: 0;
    border: 0;
    display: grid;
    gap: var(--bp-space-2);
}

.mail-files__legend {
    padding: 0;
    margin-bottom: var(--bp-space-1);
    font-size: 0.8rem;
    color: var(--bp-text-muted);
}

.mail-files__list { list-style: none; margin: 0; padding: 0; }
.mail-files__add { margin: 0.5rem 0 0; }

.mail-files__item {
    display: grid;
    grid-template-columns: auto auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.6rem;
    padding: 0.45rem 0;
    border-top: 1px solid var(--bp-panel-border);
    transition: opacity 120ms ease-out;
}

.mail-files__item:first-child { border-top: 0; }
.mail-files__item--off { opacity: 0.55; }
.mail-files__icon { color: var(--bp-text-muted); }
.mail-files__text { display: grid; min-width: 0; }
.mail-files__name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--bp-text); }
.mail-files__desc { font-size: 0.78rem; color: var(--bp-text-muted); }
.mail-files__size { font-size: 0.8rem; color: var(--bp-text-muted); white-space: nowrap; }

.mail-files__total {
    margin: 0;
    font-size: 0.8rem;
    color: var(--bp-text-muted);
    font-variant-numeric: tabular-nums;
}

.mail-files__total--over { color: var(--bp-debit); }

.mail-log { list-style: none; margin: 0; padding: 0; }

.mail-log__item {
    padding: 0.6rem 0;
    border-top: 1px solid var(--bp-panel-border);
}

.mail-log__item:first-child { border-top: 0; }

.mail-log__head {
    display: grid;
    grid-template-columns: auto auto minmax(0, 1fr) auto;
    align-items: baseline;
    gap: 0.6rem;
}

.mail-log__icon { color: var(--bp-text-muted); font-size: 0.8rem; }
.mail-log__when { color: var(--bp-text-muted); font-variant-numeric: tabular-nums; }
.mail-log__to { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--bp-text); }
.mail-log__from { font-size: 0.8rem; }

.mail-log__subject,
.mail-log__copy {
    margin: 0.2rem 0 0;
    padding-left: 1.4rem;
    font-size: 0.85rem;
}

.mail-log__subject { color: var(--bp-text); }
.mail-log__copy { display: flex; flex-wrap: wrap; gap: 0 var(--bp-space-3); }

.mail-log__details { margin: 0.3rem 0 0 1.4rem; font-size: 0.8rem; color: var(--bp-text-muted); }
.mail-log__details summary { cursor: pointer; width: fit-content; }
.mail-log__details summary:focus-visible { outline: 2px solid var(--bp-yellow); outline-offset: 2px; }
.mail-log__files { margin: 0.3rem 0 0; padding-left: 1rem; }
.mail-log__files li { white-space: normal; overflow-wrap: anywhere; }

/* Mailvorlagen in der Belegkonfiguration: genug Höhe, damit Anrede, Text und Gruß ohne Scrollen lesbar sind. */
.sales-config__multiline textarea { min-height: 9rem; line-height: 1.5; }

/* Angebotsfreigabe vor dem Versand: nächster Schritt als ein Satz, darunter der Verlauf im Takt des Versandprotokolls. */
.quote-approval__next {
    margin: 0 0 0.4rem;
    color: var(--bp-text);
    max-width: 70ch;
}

.quote-approval__log { list-style: none; margin: 0; padding: 0; }

.quote-approval__item {
    padding: 0.6rem 0;
    border-top: 1px solid var(--bp-panel-border);
}

.quote-approval__item:first-child { border-top: 0; }

.quote-approval__line {
    display: grid;
    grid-template-columns: 8.5rem minmax(0, 1fr);
    align-items: baseline;
    gap: 0.6rem;
    color: var(--bp-text);
}

.quote-approval__line + .quote-approval__line,
.quote-approval__note + .quote-approval__line { margin-top: 0.25rem; }

.quote-approval__when { color: var(--bp-text-muted); font-variant-numeric: tabular-nums; }

.quote-approval__note {
    margin: 0.2rem 0 0 9.1rem;
    max-width: 70ch;
    font-size: 0.85rem;
    color: var(--bp-text-muted);
    overflow-wrap: anywhere;
}

.quote-approval__result--freigegeben { color: var(--bp-success); }
.quote-approval__result--zurueckgewiesen { color: var(--bp-debit); }
.quote-approval__result--verfallen { color: var(--bp-text-muted); }

/* ---------- Kopf- und Fußtexte (TextSequenceEditor) ----------
   Eine Folge liest sich wie der Beleg selbst: oben nach unten, je Zeile Nummer + Name, darunter der Text.
   Der Griff links ist die einzige Ziehfläche — so bleibt Text markierbar, und Pfeiltasten auf dem Griff
   sortieren ohne Maus. */

.sales-seq {
    display: flex;
    flex-direction: column;
    gap: var(--bp-space-2);
    min-width: 0;
}

.sales-seq__head {
    display: flex;
    align-items: baseline;
    gap: var(--bp-space-2);
}

.sales-seq__title {
    margin: 0;
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--bp-text);
}

.sales-seq__count {
    font-size: 0.78rem;
    color: var(--bp-text-muted);
    font-variant-numeric: tabular-nums;
}

.sales-seq__empty {
    margin: 0;
    padding: var(--bp-space-3) 0;
    font-size: 0.85rem;
    color: var(--bp-text-muted);
    border-top: 1px solid var(--bp-panel-border);
    border-bottom: 1px solid var(--bp-panel-border);
}

.sales-seq__list {
    list-style: none;
    margin: 0;
    padding: 0;
    border-top: 1px solid var(--bp-panel-border);
}

.sales-seq__row {
    display: flex;
    align-items: flex-start;
    gap: var(--bp-space-2);
    padding: 0.65rem 0;
    border-bottom: 1px solid var(--bp-panel-border);
    transition: background 120ms ease-out, opacity 120ms ease-out;
}

.sales-seq__row:hover { background: color-mix(in srgb, var(--bp-text) 3%, transparent); }

.sales-seq__row--dragging { opacity: 0.45; }

.sales-seq__grip {
    flex: none;
    margin-top: 0.1rem;
    padding: 0.2rem;
    font-size: 0.9rem;
    color: var(--bp-text-faint);
    cursor: grab;
    border-radius: var(--bp-radius);
    transition: color 120ms ease-out, background 120ms ease-out;
}

.sales-seq__row:hover .sales-seq__grip { color: var(--bp-text-muted); }

.sales-seq__grip:hover { color: var(--bp-text); background: var(--bp-panel-hover); }

.sales-seq__grip:active { cursor: grabbing; }

.sales-seq__grip:focus-visible {
    outline: 2px solid var(--bp-yellow);
    outline-offset: 1px;
    color: var(--bp-text);
}

.sales-seq__main {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.sales-seq__meta {
    display: flex;
    align-items: baseline;
    gap: var(--bp-space-2);
    min-width: 0;
}

.sales-seq__nr {
    flex: none;
    font-size: 0.72rem;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    color: var(--bp-text-muted);
}

.sales-seq__nr--free { font-weight: 500; font-style: italic; }

.sales-seq__name {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.88rem;
    color: var(--bp-text);
}

.sales-seq__note {
    flex: none;
    font-size: 0.72rem;
    color: var(--bp-text-muted);
    padding: 0 0.4rem;
    border: 1px solid var(--bp-panel-border);
    border-radius: var(--bp-radius);
    white-space: nowrap;
}

.sales-seq__preview {
    margin: 0;
    font-size: 0.82rem;
    line-height: 1.45;
    color: var(--bp-text-muted);
    white-space: pre-line;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.sales-seq__body {
    width: 100%;
    padding: 0.45rem 0.6rem;
    border: 1px solid var(--bp-panel-border);
    border-radius: var(--bp-radius-ctl);
    background: var(--bp-panel-solid-2);
    color: var(--bp-text);
    font: inherit;
    font-size: 0.85rem;
    line-height: 1.45;
    resize: vertical;
}

.sales-seq__body:focus-visible {
    outline: none;
    border-color: color-mix(in srgb, var(--bp-yellow) 55%, transparent);
}

.sales-seq__remove {
    flex: none;
    display: grid;
    place-items: center;
    width: 1.75rem;
    height: 1.75rem;
    padding: 0;
    border: 0;
    border-radius: var(--bp-radius);
    background: none;
    color: var(--bp-text-faint);
    cursor: pointer;
    transition: color 120ms ease-out, background 120ms ease-out;
}

.sales-seq__remove .e-icons { font-size: 0.75rem; }

.sales-seq__remove:hover { color: var(--bp-danger); background: color-mix(in srgb, var(--bp-danger) 10%, transparent); }

.sales-seq__remove:focus-visible { outline: 2px solid var(--bp-yellow); outline-offset: 1px; }

.sales-seq__add {
    display: flex;
    align-items: center;
    gap: var(--bp-space-2);
    flex-wrap: wrap;
}

.sales-seq__add .sales-seq__picker,
.sales-seq__add .e-ddl.e-input-group { flex: 1 1 16rem; min-width: 12rem; }

/* Belegeinstellungen: Kopf und Fuß nebeneinander, ab schmaler Breite untereinander. */
.sales-seq-pair {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr));
    gap: var(--bp-space-4);
}

/* Platzhalter-Chip im Textbaustein-Dialog: Datenschlüssel in Monospace (Code, kein Kostüm); Klick hängt ihn an
   den Text an, der Tooltip zeigt die Schreibweise. */
.sales-ph {
    font-family: var(--bp-font-mono, ui-monospace, monospace);
    font-size: 0.72rem;
    color: var(--bp-text-muted);
    background: var(--bp-panel-hover);
    border: 1px solid var(--bp-panel-border);
    border-radius: var(--bp-radius);
    padding: 1px 6px;
    cursor: pointer;
    white-space: nowrap;
    transition: color 120ms ease-out, border-color 120ms ease-out;
}

.sales-ph:hover { color: var(--bp-text); border-color: var(--bp-text-faint); }

.sales-ph:focus-visible { outline: 2px solid var(--bp-yellow); outline-offset: 1px; }

/* Sprachreiter ohne Fassung im Textbaustein-Dialog: eine gestrichelte Fläche an der Stelle des Textfelds sagt, was
   ohne Fassung passiert, und bietet die Anlage an — statt eines leeren Feldes, das wie „leerer Text" aussähe. */
.sales-variant-empty {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--bp-space-2);
    padding: var(--bp-space-4);
    border: 1px dashed var(--bp-panel-border);
    color: var(--bp-text-muted);
    font-size: 0.85rem;
}

.sales-variant-empty p { margin: 0; max-width: 60ch; }

.sales-variant-empty__title { color: var(--bp-text); font-weight: 600; }

/* Auswahlfelder (Geltung im Textbaustein-Dialog): Häkchen und Punkt in der Hausfarbe statt Browser-Blau. */
.sales-choice input[type="checkbox"],
.sales-choice input[type="radio"] { accent-color: var(--bp-yellow); }

/* ---------- Belegseite: Reiter, Bearbeiten in der Tabelle, Summenleiste (17.10.2026) ---------- */

/* Hinweise in Kartenköpfen sind Beiwerk, keine Überschrift — klein und gedämpft. */
.sales-cardhint {
    margin: 0;
    font-size: 0.72rem;
    line-height: 1.4;
    color: var(--bp-text-muted);
}

.sales-doc .bp-cardhead > .sales-muted { font-size: 0.72rem; }

.sales-doc__tabcount {
    padding: 0 0.4rem;
    border-radius: 999px;
    font-size: 0.68rem;
    font-variant-numeric: tabular-nums;
    color: var(--bp-text-muted);
    background: color-mix(in srgb, var(--bp-text) 8%, transparent);
}

.sales-doc__tabpanel {
    display: flex;
    flex-direction: column;
    gap: var(--bp-space-3);
}

/* Der Reiter IST die Fläche: Karten darin verlieren Rahmen und Grund, sonst stünde Karte in Karte. Die
   Positionsdetails trennt eine Linie vom Raster darüber. */
.sales-doc__tabpanel > .bp-card,
.sales-doc__tabpanel .sales-doc__side > .bp-card {
    padding: 0;
    border: 0;
    border-radius: 0;
    background: none;
}

.sales-doc__tabpanel .sales-doc__side > .sales-detail {
    padding-top: var(--bp-space-3);
    border-top: 1px solid var(--bp-panel-border);
}

.sales-doc__empty { padding: var(--bp-space-3) var(--bp-space-1); }

/* Positionsnummer: der einzige Weg in die Details — sieht aus wie ein Link, ist ein Knopf. */
.sales-pos__open {
    appearance: none;
    border: 0;
    padding: 0;
    background: none;
    font: inherit;
    color: var(--bp-text);
    text-decoration: underline;
    text-decoration-color: color-mix(in srgb, var(--bp-text) 35%, transparent);
    text-underline-offset: 3px;
    cursor: pointer;
}

.sales-pos__open:hover { text-decoration-color: var(--bp-yellow); }

.sales-pos__open:focus-visible,
.sales-pos__cell:focus-visible {
    outline: 2px solid var(--bp-yellow);
    outline-offset: 2px;
    border-radius: 2px;
}

/* Bearbeitbare Zelle: Text bleibt Text, erst beim Überfahren deutet ein Rahmen die Eingabe an. */
.sales-pos__cell {
    appearance: none;
    display: inline-block;
    max-width: 100%;
    margin: -0.15rem -0.3rem;
    padding: 0.15rem 0.3rem;
    border: 1px solid transparent;
    border-radius: var(--bp-radius-ctl);
    background: none;
    font: inherit;
    color: inherit;
    text-align: inherit;
    cursor: text;
}

.sales-pos__cell:hover { border-color: var(--bp-panel-border); background: var(--bp-panel-hover); }

.sales-pos__edit {
    width: 100%;
    min-width: 6rem;
    padding: 0.15rem 0.35rem;
    border: 1px solid var(--bp-yellow);
    border-radius: var(--bp-radius-ctl);
    background: var(--bp-surface);
    color: var(--bp-text);
    font: inherit;
}

.sales-pos__edit:focus { outline: none; }

.sales-pos__edit--wide { min-width: 16rem; }

.sales-pos__edit--num {
    width: 6.5rem;
    min-width: 0;
    text-align: right;
}

.sales-pos__edit--unit { width: 5.5rem; min-width: 0; }

/* Positionsdetails: welcher Artikel, und gegen welchen er getauscht werden kann. */
.sales-detail__article {
    display: grid;
    gap: var(--bp-space-1);
    margin: 0 0 var(--bp-space-3);
    padding: var(--bp-space-2) var(--bp-space-3);
    border: 1px solid var(--bp-panel-border);
    border-radius: var(--bp-radius);
}

.sales-detail__article-value {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: var(--bp-space-2);
}

.sales-detail__replace {
    display: flex;
    gap: var(--bp-space-2);
    align-items: center;
    margin-top: var(--bp-space-1);
}

.sales-detail__replace .sales-entry__input { flex: 1; min-width: 12rem; }

/* Netto zuerst und am deutlichsten, Steuer und Brutto daneben. */
.sales-detail__amounts {
    display: flex;
    flex-wrap: wrap;
    gap: var(--bp-space-4);
    margin: 0 0 var(--bp-space-3);
}

.sales-detail__amount dt {
    font-size: 0.72rem;
    color: var(--bp-text-muted);
}

.sales-detail__amount dd {
    margin: 0;
    font-variant-numeric: tabular-nums;
    color: var(--bp-text-muted);
}

.sales-detail__amount--net dd {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--bp-text);
}

/* Die Seite füllt den Scrollbereich mindestens ganz aus: so steht die Summenleiste auch bei kurzem Beleg am
   Bildschirmende (margin-top:auto), bei langem klebt sie dort (sticky) und der Inhalt darüber scrollt. */
.sales-doc {
    display: flex;
    flex-direction: column;
    min-height: 100%;
}

.sales-doc__body { flex: 1 0 auto; }

/* Ohne Abstand: Leiste und Fläche sind EINE Karteikarte. */
.sales-doc__tabarea {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.sales-pos__combo { min-width: 6rem; }

/* Summenleiste: klebt am unteren Rand, so breit wie die Karten darüber (gleiches Seitenpolster). Gelb mit
   schwarzer Schrift wie die Primäraktion (Nutzervorgabe 17.10.2026) — die Summe ist das, wonach man sucht. */
.sales-totalbar {
    position: sticky;
    bottom: 0;
    margin-top: auto;
    z-index: 5;
    margin-left: 2rem;
    margin-right: 2rem;
    padding: var(--bp-space-4) var(--bp-space-4);
    background: var(--bp-yellow);
    color: var(--bp-black);
    border: 0;
    border-radius: var(--bp-radius-lg) var(--bp-radius-lg) 0 0;
    box-shadow: var(--bp-float-shadow);
}

.sales-totalbar__line {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: var(--bp-space-2) var(--bp-space-5);
    margin: 0;
}

.sales-totalbar__item {
    display: flex;
    align-items: baseline;
    gap: var(--bp-space-2);
}

.sales-totalbar__label,
.sales-totalbar .bp-mask__label {
    font-size: 0.8rem;
    font-weight: 600;
    color: color-mix(in srgb, var(--bp-black) 70%, transparent);
}

.sales-totalbar__value {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    color: var(--bp-black);
}

.sales-totalbar__item--net .sales-totalbar__value {
    font-size: 1.25rem;
    font-weight: 800;
}

.sales-totalbar__item--gross { margin-left: auto; }

.sales-totalbar__item--gross .sales-totalbar__value { font-size: 1.15rem; font-weight: 700; }

.sales-totalbar .sales-muted { color: color-mix(in srgb, var(--bp-black) 70%, transparent); }

.sales-totalbar .sales-note,
.sales-totalbar .sales-dialog__blocked {
    margin: var(--bp-space-2) 0 0;
    font-size: 0.78rem;
}

.sales-totalbar .sales-note { color: var(--bp-black); }

@media (max-width: 640px) {
    .sales-totalbar { margin-left: 1rem; margin-right: 1rem; }
    .sales-totalbar__item--gross { margin-left: 0; }
}

/* Artikel und Bezeichnung in einer Spalte: oben der Artikel, darunter die Bezeichnung der Position. */
.sales-pos__artdesc { min-width: 16rem; }

.sales-pos__artline {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: var(--bp-space-2);
    font-size: 0.78rem;
}

.sales-pos__descline {
    margin-top: 0.15rem;
    color: var(--bp-text);
}

/* Anriss des Langtexts in der Tabelle: zwei Zeilen, ganzer Text im Tooltip und in der Detailspalte. */
.sales-pos__longtext {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    overflow: hidden;
    max-width: 62ch;
    margin: 0.2rem 0 0;
    color: var(--bp-text-muted);
    font-size: 0.78rem;
    line-height: 1.4;
    white-space: pre-line;
}

.sales-pos__kind { margin-right: var(--bp-space-2); }


/* ---------- Factoring (/sales/factoring): Einreicher an den Factor ---------- */

.fac-kpis { --bp-stat-cols: 3; }

/* Kacheln sind hier Knöpfe (Filter bzw. „neuer Einreicher") — Knopf-Vorgaben des Browsers zurücknehmen. */
.fac-tile {
    font: inherit;
    text-align: left;
    cursor: pointer;
}

.fac-tile:disabled { cursor: default; opacity: 0.6; }

.fac-filter-note {
    display: flex;
    align-items: center;
    gap: var(--bp-space-2);
    margin: 0 0 var(--bp-space-2);
}

.fac-link {
    background: none;
    border: 0;
    padding: 0;
    font: inherit;
    font-size: 0.82rem;
    color: var(--bp-text-muted);
    text-decoration: underline;
    text-underline-offset: 3px;
    cursor: pointer;
}

.fac-link:hover { color: var(--bp-text); }

/* Belege beim Factor (Reiter, aus der FiBu): Factor-Auswahl über der Liste, Verweis auf den Rest unter ihr. */
.fac-docs-partner {
    max-width: 18rem;
    margin-bottom: var(--bp-space-2);
}

.fac-docs-more {
    margin: var(--bp-space-2) 0 0;
    font-size: 0.85rem;
}

.fac-number {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: var(--bp-space-4);
    flex-wrap: wrap;
}

.fac-number__label { font-size: 0.75rem; }

.fac-number__value {
    font-family: var(--bp-font-head, inherit);
    font-size: 2rem;
    font-weight: 600;
    line-height: 1.1;
    color: var(--bp-text);
    font-variant-numeric: tabular-nums;
}

.fac-number__hint { font-size: 0.78rem; }

.fac-number__set {
    display: flex;
    align-items: flex-end;
    gap: var(--bp-space-2);
}

.fac-row--inactive td { color: var(--bp-text-muted); }

.fac-row-actions {
    width: 1%;
    white-space: nowrap;
    text-align: right;
}

.fac-standard { margin-left: var(--bp-space-2); }

.fac-head-chip {
    margin-left: var(--bp-space-2);
    vertical-align: middle;
    font-family: var(--bp-font-body, inherit);
}

/* Detailseite: Arbeitslisten links, Angaben und Texte rechts. */
.fac-split {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(18rem, 1fr);
    gap: var(--bp-space-3);
    align-items: start;
}

.fac-sum { font-size: 0.85rem; color: var(--bp-text-muted); }

.fac-sum strong { color: var(--bp-text); font-weight: 600; margin-left: var(--bp-space-1); }

.fac-empty-line {
    margin: 0;
    padding: var(--bp-space-2) 0;
    font-size: 0.85rem;
    color: var(--bp-text-muted);
}

/* Datum mit Hinweis-Chip (überfällig) in einer Tabellenzelle: linksbündig, auf einer Höhe, mit Luft dazwischen —
   vorher klebte der Chip am Datum und saß tiefer (Nutzerwunsch 23.10.2026). Lieferlauf und Factoring-Einreicher. */
.sales-datechip {
    display: inline-flex;
    align-items: center;
    gap: var(--bp-space-2);
    white-space: nowrap;
}

.fac-log {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--bp-space-2);
}

.fac-log__item {
    display: grid;
    grid-template-columns: 9rem minmax(0, 1fr);
    gap: 0 var(--bp-space-3);
    font-size: 0.85rem;
}

.fac-log__files {
    grid-column: 2;
    font-size: 0.75rem;
    white-space: pre-line;
    overflow-wrap: anywhere;
}

.fac-facts {
    display: grid;
    grid-template-columns: max-content minmax(0, 1fr);
    gap: var(--bp-space-1) var(--bp-space-3);
    margin: 0;
    font-size: 0.85rem;
}

.fac-facts dt { color: var(--bp-text-muted); }

.fac-facts dd { margin: 0; color: var(--bp-text); }

.fac-textarea textarea { min-height: 6rem; }

.fac-textarea--tall textarea { min-height: 12rem; }

.fac-text-hint { margin: 0; font-size: 0.85rem; max-width: 60ch; }

.fac-text-read p {
    margin: 0 0 var(--bp-space-3);
    font-size: 0.85rem;
    color: var(--bp-text);
    white-space: pre-line;
    max-width: 70ch;
}

.fac-fieldset {
    margin: 0;
    padding: var(--bp-space-3);
    border: 1px solid var(--bp-panel-border);
    border-radius: var(--bp-radius-ctl);
    display: flex;
    flex-direction: column;
    gap: var(--bp-space-2);
}

.fac-fieldset legend {
    padding: 0 var(--bp-space-1);
    font-size: 0.8rem;
    color: var(--bp-text-muted);
}

.fac-checks { display: flex; gap: var(--bp-space-4); }

/* Factoring-Einreicher: „Abrechnung einlesen“ — der Knopf ist ein <label>, über dem das Datei-Feld unsichtbar liegt. */
.sl-fac-settlement {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--bp-space-2);
    overflow: hidden;
    cursor: pointer;
}

.sl-fac-settlement input[type="file"] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
}

.sl-fac-settlement:focus-within {
    outline: 2px solid var(--bp-yellow);
    outline-offset: 2px;
}

/* ---------- Partnerwechsel ---------- */

/* Partnername und Stift auf einer Zeile; der Stift sitzt am Namen, nicht am Rand der Karte. */
.sales-head__partner {
    display: flex;
    align-items: center;
    gap: var(--bp-space-1);
    min-width: 0;
}

.sales-head__partner .bp-cell-link {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Vorher/nachher: Der neue Wert trägt die Aussage, der alte tritt zurück. */
.sales-partnerchange th[scope="row"] {
    font-weight: 600;
    color: var(--bp-text-muted);
    white-space: nowrap;
}

.sales-partnerchange__old {
    color: var(--bp-text-muted);
}

.sales-partnerchange__new {
    color: var(--bp-text);
    font-weight: 600;
}

.sales-partnerchange td {
    font-variant-numeric: tabular-nums;
}

/* Nummernkreise in den Belegeinstellungen: eine ruhige Tabelle je Kreis. Die nächste Nummer ist die Antwort auf
   die Frage der Zeile und trägt deshalb das Gewicht; Muster und Zählweise stehen gedämpft darunter. */
.num-seq__head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: var(--bp-space-3);
    flex-wrap: wrap;
}

.num-seq__years { border-bottom: none; }

.num-seq__years .bp-tabs__tab { font-variant-numeric: tabular-nums; }

.num-seq__years .bp-tabs__tab:disabled { cursor: default; opacity: 0.6; }

.num-seq { display: flex; flex-direction: column; }

.num-seq__row {
    display: grid;
    grid-template-columns: minmax(14rem, 1fr) 7rem minmax(9rem, 12rem) auto;
    align-items: center;
    gap: var(--bp-space-4);
    padding: 0.7rem 0;
    border-bottom: 1px solid var(--bp-panel-border);
}

.num-seq__row--head {
    padding: var(--bp-space-2) 0;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--bp-text-muted);
}

.num-seq__name {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    min-width: 0;
    color: var(--bp-text);
    font-size: 0.9rem;
}

.num-seq__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0 0.4rem;
    color: var(--bp-text-muted);
    font-size: 0.78rem;
}

.num-seq__last { color: var(--bp-text-muted); font-variant-numeric: tabular-nums; }

.num-seq__next {
    font-family: var(--bp-font-head);
    font-size: 1.05rem;
    font-weight: 600;
    color: var(--bp-text);
    overflow: hidden;
    text-overflow: ellipsis;
}

.num-seq__set {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: var(--bp-space-2);
}

/* ---------- Rechnungen nach dem Seitenprinzip (Datensatzleiste, 22.10.2026) ---------- */

/* Die Belegseite läuft randlos (Inset 0) — die Leiste hält denselben Seitenrand wie der Inhalt darunter. */
.sales-doc > .bp-recbar { margin: var(--bp-space-4) 2rem 0; }

/* Mittelteil der Leiste: Nummer als Anker, Art und Kunde leise daneben — wie Artikel- und Vertragsmaske. */
.sales-recbar__name {
    flex: 0 0 auto;
    font-family: var(--bp-font-head);
    font-size: 1.05rem;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    color: var(--bp-text);
    white-space: nowrap;
}

.sales-recbar__meta {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.85rem;
    color: var(--bp-text-muted);
}

/* Hinweise der Rechnung (gesperrt, Factoring, Vorlage) über dem Kopf, wo sonst die Überschrift stand. */
.sales-doc__chips {
    display: flex;
    flex-wrap: wrap;
    gap: var(--bp-space-2);
    padding: var(--bp-space-3) 2rem 0;
}

/* Status im Kopf: Auswahlfeld, nur lesbar — sieht aus wie die übrigen Felder, nicht wie ausgegraut. */
.sales-head__status.e-input-group.e-control-wrapper.e-readonly { opacity: 1; }

/* ---------- Rechnungsmaske (Standard-Stammdatenseite, 22.10.2026) ---------- */

/* Der Belegkopf ist eine Maske nach dem Seitenprinzip: Karte mit zwei Feldblöcken, Beschriftung links (bp-mask). */
.sales-head.bp-mask { padding: var(--bp-space-3) var(--bp-space-4); }

.sales-head__fields {
    display: flex;
    flex-direction: column;
    gap: var(--bp-space-2);
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
}

/* Suchmodus: die leere Maske hebt sich über den gelben Rahmen als Eingabefläche ab — wie die Leiste. */
.sales-head--search { border-color: var(--bp-ci-yellow); }

/* Netto und Brutto sind Felder der Maske: Beschriftung und Wert in einer Zeile, wie zuvor dt/dd. */
.sales-totalbar .bp-mask__row {
    display: flex;
    align-items: baseline;
    gap: var(--bp-space-2);
}

.sales-totalbar .bp-mask__label { overflow: visible; }

/* In der leeren Maske trägt die Summenleiste Eingaben — ohne Gelb, sonst stünden dunkle Felder auf CI-Gelb. */
.sales-totalbar--search {
    background: var(--bp-panel-solid);
    color: var(--bp-text);
    border: 1px solid var(--bp-panel-border);
}

.sales-totalbar--search .bp-mask__label { color: var(--bp-text-muted); }

.sales-totalbar--search .bp-mask__row > :last-child { width: 11rem; }

/* Eingaben statt Zahlen: an der Grundlinie ausgerichtet säße die Beschriftung unter dem leeren Feld — deshalb mittig.
   Ohne Steuerzeilen dazwischen stehen Netto und Brutto beieinander statt an beiden Rändern. */
.sales-totalbar--search .sales-totalbar__line,
.sales-totalbar--search .sales-totalbar__item,
.sales-totalbar--search .bp-mask__row {
    align-items: center;
}

.sales-totalbar--search .sales-totalbar__item--gross { margin-left: 0; }

/* Textknopf im Fließtext („Alle Rechnungen zeigen"). */
.sales-linkbutton {
    padding: 0;
    border: 0;
    background: none;
    font: inherit;
    cursor: pointer;
}

/* ---------- Wiedervorlage „Nachfassen" (Dock eines versendeten Angebots) ----------
   Eine ruhige Fläche unter den Dock-Aktionen: oben wann, darunter warum (gelernt oder Kenner), dann die Wege.
   Fällig = gelbe Kante links, kein Alarmrot — ein fälliges Nachfassen ist Arbeit, kein Fehler. */
.quote-followup {
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
    margin-top: 0.75rem;
    padding: 0.65rem 0.75rem;
    border: 1px solid var(--bp-panel-border);
    border-radius: var(--bp-radius-lg);
}

.quote-followup--due {
    border-left: 3px solid var(--bp-yellow);
}

.quote-followup__head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.5rem;
}

.quote-followup__title {
    margin: 0;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--bp-text-muted);
}

.quote-followup__when {
    font-size: 0.85rem;
    color: var(--bp-text);
    white-space: nowrap;
}

.quote-followup--due .quote-followup__when {
    color: var(--bp-yellow);
    font-weight: 600;
}

.quote-followup__basis {
    margin: 0;
    font-size: 0.8rem;
    color: var(--bp-text-muted);
}

.quote-followup__actions {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.quote-followup__row {
    display: flex;
    gap: 0.35rem;
}

.quote-followup__row > * {
    flex: 1 1 0;
    min-width: 0;
}

/* ---------- Mahnwesen (/sales/mahnwesen) ----------
   Die Stufe trägt die Dringlichkeit: Erinnerung ruhig, Mahnung gelb, letzte Stufe in der Soll-Farbe — immer mit
   Wort, nie nur Farbe. Ton-Auswahl und KI-Spalte schmal, damit Betrag und Kunde den Platz behalten. */
.dunning-table td {
    vertical-align: middle;
}

.dunning-level {
    font-weight: 600;
    white-space: nowrap;
}

.dunning-level--reminder { color: var(--bp-text); }
.dunning-level--dunning { color: var(--bp-yellow); }
.dunning-level--final { color: var(--bp-debit); }

.dunning-last {
    display: block;
    font-size: 0.78rem;
}

.dunning-table__tone { width: 10rem; }

.dunning-behavior {
    font-size: 0.85rem;
    color: var(--bp-text-muted);
}

.dunning-table__ai {
    width: 1%;
    white-space: nowrap;
}

.dunning-advice {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.85rem;
}

.dunning-output-hint {
    margin: 0.5rem 0 0;
    font-size: 0.85rem;
    max-width: 70ch;
}

/* ---------- Mahnschreiben einrichten (Mahnlauf) ----------
   Ein ruhiges Band über der Tabelle, keine Karte: Es meldet eine Lücke in der Einrichtung, keinen Fehler.
   Text links mit Lesebreite, der eine Knopf rechts; schmal untereinander. */
.dunning-setup {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--bp-space-3) var(--bp-space-4);
    padding: var(--bp-space-3) var(--bp-space-4);
    background: color-mix(in srgb, var(--bp-saldo) 10%, transparent);
    border-radius: var(--bp-radius-ctl);
}

.dunning-setup--done {
    background: color-mix(in srgb, var(--bp-credit) 10%, transparent);
}

.dunning-setup__body {
    display: flex;
    flex-direction: column;
    gap: var(--bp-space-1);
    flex: 1 1 32rem;
    max-width: 75ch;
}

.dunning-setup__title {
    margin: 0;
    font-size: 0.95rem;
    font-weight: 600;
}

.dunning-setup__text {
    margin: 0;
    font-size: 0.85rem;
    line-height: 1.5;
}

.dunning-setup__link {
    font-size: 0.85rem;
    text-underline-offset: 0.2em;
}

/* Kopf-/Schlusstext am Beleg selbst (über „Rechnung berichtigen" geändert) über den Bausteinen. */
.sales-texts__own {
    display: flex;
    flex-direction: column;
    gap: .25rem;
    margin-bottom: 1rem;
    padding: .75rem 1rem;
    border-left: 2px solid var(--bp-yellow);
    background: var(--bp-panel-solid-2);
    border-radius: var(--bp-radius-ctl, 8px);
}

.sales-texts__own-label {
    font-size: .75rem;
    color: var(--bp-text-muted);
}

.sales-texts__own-body {
    margin: 0;
    color: var(--bp-text);
    white-space: pre-line;
}

/* Angebotsmail: Häkchen „Mit Link zur Unterschrift" — eine Zeile mit Erklärung darunter, abgedunkelt mit Grund. */
.mail-signlink {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    padding: 0.6rem 0.75rem;
    border: 1px solid var(--bp-panel-border);
    border-radius: var(--bp-radius-ctl, 8px);
}

.mail-signlink--off {
    opacity: 0.6;
}