/* ==========================================================================
   CraftX — Job Details V2 (Auftrag Polished)
   Reusable utility classes consumed by JobDetailsV2.razor + sub-components.
   ========================================================================== */

/* ── Header card ────────────────────────────────────────────────── */
.job-v2-header {
    background: var(--cx-card-bg, #fff);
    /* padding-bottom carries the spacing previously on .job-v2-header__row's
       margin-bottom — keeping it as margin caused the 14px to collapse out
       of the parent and reveal .erp-main's sand bg as a phantom hairline. */
    padding: 14px 32px;
}

.job-v2-header__row {
    display: flex;
    align-items: flex-start;
    gap: 14px;
}

.job-v2-header__icon {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: var(--copper, #B8601F);
    color: #fff;
    display: grid;
    place-items: center;
    box-shadow: var(--sh-copper, 0 6px 16px rgba(184, 96, 31, 0.24));
    flex-shrink: 0;
    font-size: 16px;
}

.job-v2-header__main { flex: 1; min-width: 0; }

.job-v2-header__crumbs {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 2px;
    font-size: 12px;
    color: var(--cx-text-secondary, #4A443C);
}

.job-v2-header__crumbs .sep {
    color: var(--hairline-strong, rgba(28, 25, 21, 0.14));
}

.job-v2-header__crumbs a {
    color: var(--cx-text-secondary, #4A443C);
    text-decoration: none;
}

.job-v2-header__crumbs a:hover { color: var(--copper, #B8601F); }

.job-v2-header__title {
    font-family: var(--font-display, 'Bricolage Grotesque', sans-serif);
    font-size: 22px;
    font-weight: 800;
    letter-spacing: -0.02em;
    margin: 2px 0 4px;
    color: var(--ink, #1C1915);
    line-height: 1.15;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.job-v2-header__meta {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 12px;
    color: var(--cx-text-secondary, #4A443C);
    flex-wrap: wrap;
}

.job-v2-header__meta .av {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    color: #fff;
    display: inline-grid;
    place-items: center;
    font-size: 7.5px;
    font-weight: 700;
    background: var(--blue, #1F4A82);
}

.job-v2-header__customer {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: inherit;
    text-decoration: none;
    border-radius: 4px;
    transition: color 0.12s ease;
}

.job-v2-header__customer:hover,
.job-v2-header__customer:focus-visible {
    color: var(--blue, #1F4A82);
    text-decoration: underline;
    text-underline-offset: 2px;
}

.job-v2-header__meta .meta-mono {
    font-family: var(--font-mono, ui-monospace, monospace);
    color: var(--stone, #8E8679);
}

.job-v2-header__meta .sep {
    color: var(--hairline-strong, rgba(28, 25, 21, 0.14));
}

.job-v2-header__meta i { color: var(--stone, #8E8679); }

.job-v2-header__actions {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
}

.job-v2-header__actions .btn {
    height: 32px;
    padding: 0 12px;
    font-size: 12.5px;
}

.job-v2-header__actions .icon-button {
    width: 32px;
    height: 32px;
}

/* Auto-saved pill */
.job-v2-pill {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 2px 9px;
    border-radius: 999px;
    font-size: 10.5px;
    font-weight: 600;
    background: var(--patina-50, #EAF3EE);
    color: var(--patina, #3F7D5B);
}

.job-v2-pill .dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
}

.job-v2-pill.tone-neutral {
    background: var(--sand, #F0ECE4);
    color: var(--cx-text-secondary, #4A443C);
}

/* ── Stage tracker (phase chip cards) ───────────────────────────── */
.job-v2-stage-tracker {
    /* No outer margin — the parent wrapper provides vertical spacing as
       padding so the tracker's gutter can't margin-collapse through the
       wrapper and reveal .erp-main's sand background as a phantom hairline. */
    padding: 6px;
    background: #fff;
    border: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    border-radius: var(--cx-card-radius, 12px);
    box-shadow: var(--shadow-xs, 0 1px 2px rgba(28, 25, 21, 0.04));
}

.job-v2-stage-tracker__rail {
    display: grid;
    gap: 4px;
}

.job-v2-stage-tracker__chip {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 10px;
    text-align: left;
    font-family: inherit;
    transition: background 0.15s ease, border-color 0.15s ease, transform 0.15s ease;
    min-width: 0;
}

.job-v2-stage-tracker__chip.is-clickable { cursor: pointer; }
.job-v2-stage-tracker__chip:not(.is-clickable) { cursor: default; }

.job-v2-stage-tracker__chip.is-clickable:hover {
    background: var(--sand, #F4F0E8);
    border-color: var(--hairline, rgba(28, 25, 21, 0.08));
}

.job-v2-stage-tracker__chip.is-current {
    background: rgba(184, 96, 31, 0.08);
    border-color: rgba(184, 96, 31, 0.22);
    box-shadow: 0 0 0 1px rgba(184, 96, 31, 0.06) inset;
}

.job-v2-stage-tracker__circle {
    flex: 0 0 auto;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: #fff;
    border: 1.5px solid var(--hairline-strong, rgba(28, 25, 21, 0.14));
    color: var(--stone, #8E8679);
    font-weight: 600;
    font-size: 12px;
    line-height: 1;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.job-v2-stage-tracker__circle .bi { font-size: 14px; }

.job-v2-stage-tracker__chip.is-done .job-v2-stage-tracker__circle {
    background: var(--patina, #3F7D5B);
    border-color: var(--patina, #3F7D5B);
    color: #fff;
}

.job-v2-stage-tracker__chip.is-current .job-v2-stage-tracker__circle {
    background: var(--copper, #B8601F);
    border-color: var(--copper, #B8601F);
    color: #fff;
    box-shadow: 0 0 0 3px rgba(184, 96, 31, 0.16);
}

.job-v2-stage-tracker__num { font-variant-numeric: tabular-nums; }

.job-v2-stage-tracker__text {
    display: flex;
    flex-direction: column;
    gap: 1px;
    min-width: 0;
}

.job-v2-stage-tracker__phase {
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--stone, #8E8679);
    line-height: 1.2;
}

.job-v2-stage-tracker__chip.is-current .job-v2-stage-tracker__phase {
    color: var(--copper, #B8601F);
}

.job-v2-stage-tracker__chip.is-done .job-v2-stage-tracker__phase {
    color: var(--cx-text-secondary, #4A443C);
}

.job-v2-stage-tracker__label {
    font-size: 14px;
    font-weight: 600;
    line-height: 1.2;
    color: var(--ink, #1C1915);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.job-v2-stage-tracker__chip.is-future .job-v2-stage-tracker__label {
    color: var(--cx-text-muted, #8E8679);
    font-weight: 500;
}

.job-v2-stage-tracker__hint {
    font-size: 10.5px;
    color: var(--stone, #8E8679);
    font-family: var(--font-mono, ui-monospace, monospace);
    line-height: 1.2;
    margin-top: 1px;
}

/* Current-cell hint reads as forward-looking copy, not a date — drop the
   monospace styling so it doesn't masquerade as data the user can act on
   like a click target. */
.job-v2-stage-tracker__chip.is-current .job-v2-stage-tracker__hint {
    font-family: inherit;
    color: var(--copper-dark, #8A4514);
    font-style: italic;
}

/* Storno badge surfaced on the Rechnung phase when a CorrectionInvoice
   exists for the job. Sits inline with the phase eyebrow so it reads as
   a metadata flag, not a separate stage. */
.job-v2-stage-tracker__storno-badge {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    margin-left: 6px;
    padding: 1px 5px 1px 4px;
    border-radius: 999px;
    background: rgba(154, 59, 51, 0.12);
    color: var(--cx-danger, #9A3B33);
    font-size: 8.5px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    line-height: 1.3;
    vertical-align: 1px;
}

.job-v2-stage-tracker__storno-badge .bi {
    font-size: 9px;
}

/* Partial billing: Abschlagsrechnungen are out but the Schlussrechnung is still
   open. The stage isn't "done" (no green check) and isn't merely pending either —
   a copper ring plus the "x % abgerechnet" hint shows the money track running
   alongside the work track instead of forcing the job status to jump. */
.job-v2-stage-tracker__chip.is-billing-partial:not(.is-current) .job-v2-stage-tracker__circle {
    border-color: var(--copper, #B8601F);
    border-style: dashed;
    color: var(--copper-dark, #8A4514);
    background: rgba(184, 96, 31, 0.06);
}

.job-v2-stage-tracker__chip.is-billing-partial .job-v2-stage-tracker__hint {
    font-family: inherit;
    color: var(--copper-dark, #8A4514);
    font-weight: 600;
}

.job-v2-stage-tracker__chip.is-billing-partial.is-future .job-v2-stage-tracker__label {
    color: var(--ink, #1C1915);
    font-weight: 600;
}

/* Just-completed flash: when the active index advances, the cell that
   transitioned from current → done gets a brief scale + glow so the user
   notices the milestone passed instead of seeing the rail jump silently. */
@keyframes cx-stage-just-done {
    0%   { transform: scale(1); box-shadow: 0 0 0 0 rgba(63, 125, 91, 0.55); }
    35%  { transform: scale(1.08); box-shadow: 0 0 0 6px rgba(63, 125, 91, 0); }
    100% { transform: scale(1); box-shadow: 0 0 0 0 rgba(63, 125, 91, 0); }
}

.job-v2-stage-tracker__chip.is-just-done .job-v2-stage-tracker__circle {
    animation: cx-stage-just-done 0.85s ease-out;
}

@media (max-width: 1100px) {
    .job-v2-stage-tracker__chip { padding: 10px; gap: 10px; }
    .job-v2-stage-tracker__label { font-size: 13px; }
    .job-v2-stage-tracker__phase { font-size: 9px; }
}

/* ── Tab bar (custom strip — not SfTab) ─────────────────────────── */
.job-v2-tabbar {
    background: #fff;
    border-bottom: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    padding: 0 24px;
    display: flex;
    align-items: center;
    gap: 0;
    flex-shrink: 0;
}

.job-v2-tabbar__tab {
    background: transparent;
    border: none;
    padding: 12px 16px;
    cursor: pointer;
    font-size: 13.5px;
    font-weight: 600;
    font-family: inherit;
    color: var(--stone, #8E8679);
    border-bottom: 2px solid transparent;
    margin-bottom: -1px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    transition: color 0.15s ease, border-color 0.15s ease, background 0.15s ease;
}

.job-v2-tabbar__tab > i {
    font-size: 15px;
    color: inherit;
}

.job-v2-tabbar__tab:hover {
    color: var(--cx-text-secondary, #4A443C);
    background: rgba(28, 25, 21, 0.03);
}

.job-v2-tabbar__tab.is-active {
    color: var(--ink, #1C1915);
    border-bottom-color: var(--copper, #B8601F);
}

.job-v2-tabbar__tab.is-active > i {
    color: var(--copper, #B8601F);
}

.job-v2-tab-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-left: 7px;
    padding: 1px 6px;
    border-radius: 999px;
    font-size: 10px;
    font-family: var(--font-mono, ui-monospace, monospace);
    font-weight: 700;
    background: var(--sand, #F0ECE4);
    color: var(--cx-text-secondary, #4A443C);
}

.job-v2-tab-badge.is-copper { background: var(--copper, #B8601F); color: #fff; }
.job-v2-tab-badge.is-danger { background: var(--brick, #9A3B33); color: #fff; }

/* ── Übersicht ──────────────────────────────────────────────────── */
.job-v2-overview {
    padding: 24px 32px 40px;
    max-width: 1280px;
}

.job-v2-overview__quick {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
    margin-bottom: 22px;
}

.job-v2-quick-action {
    background: #fff;
    border: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    border-radius: 10px;
    padding: 12px 14px;
    display: flex;
    align-items: center;
    gap: 12px;
    cursor: pointer;
    text-align: left;
    font-family: inherit;
    box-shadow: var(--sh-xs, 0 1px 2px rgba(28, 25, 21, 0.06));
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.job-v2-quick-action:hover {
    transform: translateY(-1px);
    box-shadow: var(--sh-sm, 0 2px 6px rgba(28, 25, 21, 0.08));
}

.job-v2-quick-action:disabled {
    opacity: 0.55;
    cursor: not-allowed;
    transform: none;
}

.job-v2-quick-action__ico {
    width: 34px;
    height: 34px;
    border-radius: 8px;
    background: var(--copper-50, #FBEFE5);
    color: var(--copper, #B8601F);
    display: grid;
    place-items: center;
    flex-shrink: 0;
    font-size: 16px;
}

.job-v2-quick-action__body { flex: 1; min-width: 0; }

.job-v2-quick-action__label {
    font-size: 13px;
    font-weight: 700;
    color: var(--ink, #1C1915);
    margin-bottom: 1px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.job-v2-quick-action__hint {
    font-size: 11px;
    color: var(--stone, #8E8679);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.job-v2-quick-action.is-copper {
    background: var(--copper, #B8601F);
    border-color: var(--copper, #B8601F);
    box-shadow: var(--sh-copper, 0 6px 16px rgba(184, 96, 31, 0.24));
}

.job-v2-quick-action.is-copper .job-v2-quick-action__ico {
    background: rgba(255, 255, 255, 0.18);
    color: #fff;
}

.job-v2-quick-action.is-copper .job-v2-quick-action__label { color: #fff; }
.job-v2-quick-action.is-copper .job-v2-quick-action__hint { color: rgba(255, 255, 255, 0.78); }

/* Card (overview-flavored variant of .card) */
.job-v2-card {
    background: #fff;
    border: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    border-radius: 12px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.job-v2-card__head {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    border-bottom: 1px solid var(--hairline-soft, rgba(28, 25, 21, 0.05));
    background: var(--paper-2, #F5F1E8);
}

.job-v2-card__head i { font-size: 14px; color: var(--copper, #B8601F); }

.job-v2-card__title {
    font-size: 11px;
    font-family: var(--font-mono, ui-monospace, monospace);
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--ink, #1C1915);
    margin: 0;
    flex: 1;
}

.job-v2-card__action {
    background: transparent;
    border: none;
    padding: 0;
    font-size: 11.5px;
    font-weight: 600;
    color: var(--copper, #B8601F);
    cursor: pointer;
    font-family: inherit;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.job-v2-card__action:hover { color: var(--copper-dark, #8A4514); }

.job-v2-card__body { padding: 14px; flex: 1; }

/* Row 1 grid */
.job-v2-overview__row-1 {
    display: grid;
    grid-template-columns: 1.2fr 1fr 1fr;
    gap: 16px;
    margin-bottom: 22px;
}

.job-v2-overview__row-2 {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 16px;
    margin-bottom: 22px;
}

.job-v2-followup-card {
    margin-bottom: 22px;
    border-color: rgba(184, 96, 31, 0.22);
    box-shadow: 0 6px 18px rgba(28, 25, 21, 0.05);
}

.job-v2-followup-card .job-v2-card__head {
    background: rgba(184, 96, 31, 0.08);
}

.job-v2-followup-card__grid {
    display: grid;
    grid-template-columns: minmax(220px, 0.55fr) minmax(0, 1fr);
    gap: 16px;
    align-items: start;
}

.job-v2-followup-card__main {
    min-width: 0;
}

.job-v2-followup-card__outcome {
    font-size: 16px;
    font-weight: 800;
    color: var(--ink, #1C1915);
    line-height: 1.25;
}

.job-v2-followup-card__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 5px;
    color: var(--stone, #8E8679);
    font-size: 12.5px;
    line-height: 1.35;
}

.job-v2-followup-card__sep {
    color: rgba(142, 134, 121, 0.65);
}

.job-v2-followup-card__note {
    min-width: 0;
    padding: 10px 12px;
    border: 1px solid var(--hairline-soft, rgba(28, 25, 21, 0.05));
    border-radius: 8px;
    background: var(--paper-2, #F5F1E8);
    color: var(--ink, #1C1915);
    font-size: 13px;
    line-height: 1.4;
    overflow-wrap: anywhere;
}

.job-v2-followup-card__note.is-empty {
    color: var(--stone, #8E8679);
    font-style: italic;
}

/* Customer message (note sent on online quote acceptance) */
.job-v2-customer-message {
    margin-bottom: 22px;
    border-color: rgba(30, 58, 95, 0.22);
    box-shadow: 0 6px 18px rgba(28, 25, 21, 0.05);
}

.job-v2-customer-message .job-v2-card__head {
    background: rgba(30, 58, 95, 0.07);
}

.job-v2-customer-message .job-v2-card__head > i {
    color: var(--cx-primary, #1E3A5F);
}

.job-v2-customer-message__text {
    margin: 0;
    padding: 12px 14px;
    border-left: 3px solid rgba(30, 58, 95, 0.45);
    border-radius: 4px;
    background: var(--paper-2, #F5F1E8);
    color: var(--ink, #1C1915);
    font-size: 14px;
    line-height: 1.5;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

.job-v2-customer-message__meta {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 8px;
    color: var(--stone, #8E8679);
    font-size: 12.5px;
}

.job-v2-customer-message__meta > i {
    color: var(--cx-success, #2e7d32);
}

@media (max-width: 1100px) {
    .job-v2-overview__row-1,
    .job-v2-overview__row-2 {
        grid-template-columns: 1fr;
    }
    .job-v2-overview__quick { grid-template-columns: repeat(2, 1fr); }
    .job-v2-followup-card__grid { grid-template-columns: 1fr; }
}

/* Finanzen rows */
.job-v2-fin-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 6px;
}

.job-v2-fin-row__label {
    font-size: 12.5px;
    color: var(--cx-text-secondary, #4A443C);
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.job-v2-fin-row__label .dot {
    width: 8px;
    height: 8px;
    border-radius: 2px;
    flex-shrink: 0;
}

.job-v2-fin-row__label .dot.is-copper { background: var(--copper, #B8601F); }
.job-v2-fin-row__label .dot.is-blue { background: var(--blue, #1F4A82); }

.job-v2-fin-row__value {
    font-family: var(--font-mono, ui-monospace, monospace);
    font-size: 13.5px;
    font-weight: 600;
    color: var(--ink, #1C1915);
}

.job-v2-fin-row.is-small .job-v2-fin-row__label { font-size: 11.5px; }
.job-v2-fin-row.is-small .job-v2-fin-row__value { font-size: 12px; }

.job-v2-fin-row.is-muted .job-v2-fin-row__label,
.job-v2-fin-row.is-muted .job-v2-fin-row__value { color: var(--stone, #8E8679); }

.job-v2-fin-row.is-big .job-v2-fin-row__value {
    font-family: var(--font-display, 'Bricolage Grotesque', sans-serif);
    font-size: 20px;
    font-weight: 800;
    letter-spacing: -0.015em;
    color: var(--copper, #B8601F);
}

.job-v2-fin-divider {
    height: 1px;
    background: var(--hairline-soft, rgba(28, 25, 21, 0.05));
    margin: 6px 0;
}

/* Progress ring */
.job-v2-progress-ring {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 130px;
    position: relative;
}

.job-v2-progress-ring__overlay {
    position: absolute;
    text-align: center;
    color: var(--ink, #1C1915);
    font-family: var(--font-display, 'Bricolage Grotesque', sans-serif);
}

.job-v2-progress-ring__pct {
    font-size: 26px;
    font-weight: 800;
    letter-spacing: -0.02em;
    line-height: 1;
}

.job-v2-progress-ring__caption {
    font-size: 10.5px;
    color: var(--stone, #8E8679);
    font-family: var(--font-mono, ui-monospace, monospace);
    text-transform: uppercase;
    letter-spacing: 0.14em;
    font-weight: 700;
    margin-top: 4px;
}

.job-v2-microstats {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
    margin-top: 8px;
}

.job-v2-microstats__item { text-align: center; padding: 6px 4px; }

.job-v2-microstats__value {
    font-family: var(--font-display, 'Bricolage Grotesque', sans-serif);
    font-size: 18px;
    font-weight: 800;
    color: var(--ink, #1C1915);
    letter-spacing: -0.015em;
}

.job-v2-microstats__label {
    font-size: 9.5px;
    font-family: var(--font-mono, ui-monospace, monospace);
    font-weight: 700;
    color: var(--stone, #8E8679);
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

/* Zugewiesen list */
.job-v2-assignee {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 6px 0;
}

.job-v2-assignee__avatar {
    border-radius: 50%;
    color: #fff;
    display: grid;
    place-items: center;
    font-weight: 700;
    flex-shrink: 0;
    background: var(--blue, #1F4A82);
}

.job-v2-assignee__avatar.size-lg { width: 36px; height: 36px; font-size: 13px; }
.job-v2-assignee__avatar.size-md { width: 30px; height: 30px; font-size: 11px; }

.job-v2-assignee__name {
    font-size: 13px;
    font-weight: 700;
    color: var(--ink, #1C1915);
    line-height: 1.2;
}

.job-v2-assignee__role {
    font-size: 11px;
    color: var(--stone, #8E8679);
}

.job-v2-assignee-divider {
    height: 1px;
    background: var(--hairline-soft, rgba(28, 25, 21, 0.05));
    margin: 6px 0;
}

/* Quiet hint under the roster: this job-site is a valid clock-in geofence for
   the people assigned above. Only shown when the work location has coordinates. */
.job-v2-assignee-note {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 8px;
    font-size: 11px;
    line-height: 1.4;
    color: var(--stone, #8E8679);
}

.job-v2-assignee-note > i {
    flex-shrink: 0;
    color: var(--success, #528464);
}

.job-v2-assign-btn {
    margin-top: 8px;
    width: 100%;
    background: transparent;
    border: 1px dashed var(--hairline-strong, rgba(28, 25, 21, 0.14));
    border-radius: 8px;
    padding: 6px 10px;
    font-size: 12px;
    color: var(--stone, #8E8679);
    cursor: pointer;
    font-family: inherit;
}

.job-v2-assign-btn:hover {
    background: var(--paper-2, #F5F1E8);
    color: var(--cx-text-secondary, #4A443C);
}

/* Material/Lohn split */
.job-v2-split {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 12px;
}

.job-v2-split__bar {
    flex: 1;
    height: 14px;
    border-radius: 6px;
    overflow: hidden;
    display: flex;
    background: var(--sand, #F0ECE4);
}

.job-v2-split__bar > .seg-material { background: var(--copper, #B8601F); }
.job-v2-split__bar > .seg-labor { background: var(--blue, #1F4A82); }

.job-v2-split__pct {
    font-family: var(--font-mono, ui-monospace, monospace);
    font-size: 12px;
    font-weight: 600;
    color: var(--cx-text-secondary, #4A443C);
}

.job-v2-split-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
}

.job-v2-split-tile {
    padding: 12px;
    border-radius: 8px;
}

.job-v2-split-tile.is-material { background: var(--copper-50, #FBEFE5); }
.job-v2-split-tile.is-labor { background: var(--blue-50, #EEF3FB); }

.job-v2-split-tile__label {
    font-size: 10px;
    font-family: var(--font-mono, ui-monospace, monospace);
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    margin-bottom: 4px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.job-v2-split-tile.is-material .job-v2-split-tile__label { color: var(--copper, #B8601F); }
.job-v2-split-tile.is-labor .job-v2-split-tile__label { color: var(--blue, #1F4A82); }

.job-v2-split-tile__label .dot {
    width: 8px;
    height: 8px;
    border-radius: 2px;
    background: currentColor;
}

.job-v2-split-tile__value {
    font-family: var(--font-display, 'Bricolage Grotesque', sans-serif);
    font-size: 22px;
    font-weight: 800;
    color: var(--ink, #1C1915);
    letter-spacing: -0.015em;
}

.job-v2-split-tile__hint {
    font-size: 11px;
    color: var(--stone, #8E8679);
    margin-top: 2px;
}

/* Schnellinfo rows */
.job-v2-info-row {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    padding: 6px 0;
    border-bottom: 1px solid var(--hairline-soft, rgba(28, 25, 21, 0.05));
    font-size: 12.5px;
}

.job-v2-info-row:last-child { border-bottom: none; }

.job-v2-info-row__label { color: var(--stone, #8E8679); }

.job-v2-info-row__value {
    font-weight: 600;
    color: var(--ink, #1C1915);
}

.job-v2-info-row__value.is-mono { font-family: var(--font-mono, ui-monospace, monospace); }
.job-v2-info-row__value.is-highlight { color: var(--copper, #B8601F); }

/* Activity feed — denser timeline with a vertical connector line on the left.
   The dot/avatar sits inside a 28-px gutter so consecutive rows share an
   uninterrupted spine; the body holds a single header line (actor · title · time)
   plus an optional row of change pills. */
.job-v2-activity-row {
    position: relative;
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 6px 0;
}

.job-v2-activity-row.is-compact { padding: 4px 0; }

.job-v2-activity-row::before {
    content: "";
    position: absolute;
    left: 13px;
    top: 0;
    bottom: 0;
    width: 1px;
    background: var(--hairline-soft, rgba(28, 25, 21, 0.06));
}

.job-v2-activity-row:first-child::before { top: 14px; }
.job-v2-activity-row:last-child::before  { bottom: calc(100% - 14px); }

.job-v2-activity-row__avatar {
    position: relative;
    z-index: 1;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    color: #fff;
    display: grid;
    place-items: center;
    flex-shrink: 0;
    font-size: 10px;
    font-weight: 700;
    background: var(--blue, #1F4A82);
    box-shadow: 0 0 0 3px var(--card-bg, #fff);
}

.job-v2-activity-row__avatar.is-icon { font-size: 11px; }

.job-v2-activity-row__body { flex: 1; min-width: 0; padding-top: 2px; }

.job-v2-activity-row__head {
    display: flex;
    align-items: baseline;
    gap: 10px;
    min-width: 0;
}

.job-v2-activity__event-icon {
    width: 26px;
    height: 26px;
    border-radius: 10px;
    display: inline-grid;
    place-items: center;
    flex-shrink: 0;
    color: var(--copper, #B8601F);
    background: rgba(184, 96, 31, 0.08);
    border: 1px solid rgba(184, 96, 31, 0.14);
    font-size: 13px;
    transform: translateY(-3px);
}

.job-v2-activity-row.is-status .job-v2-activity__event-icon {
    color: var(--cx-success, #3F7D5B);
    background: rgba(63, 125, 91, 0.09);
    border-color: rgba(63, 125, 91, 0.18);
}

.job-v2-activity-row.is-documents .job-v2-activity__event-icon {
    color: var(--copper, #B8601F);
    background: rgba(184, 96, 31, 0.09);
    border-color: rgba(184, 96, 31, 0.18);
}

.job-v2-activity-row.is-finance .job-v2-activity__event-icon {
    color: #31548A;
    background: rgba(49, 84, 138, 0.09);
    border-color: rgba(49, 84, 138, 0.16);
}

.job-v2-activity-row.is-details .job-v2-activity__event-icon {
    color: var(--stone, #8E8679);
    background: rgba(142, 134, 121, 0.09);
    border-color: rgba(142, 134, 121, 0.16);
}

.job-v2-activity-row__text {
    flex: 1;
    min-width: 0;
    font-size: 13px;
    color: var(--ink, #1C1915);
    line-height: 1.4;
    overflow: hidden;
    text-overflow: ellipsis;
}

.job-v2-activity-row__when {
    flex-shrink: 0;
    font-size: 11px;
    font-family: var(--font-mono, ui-monospace, monospace);
    color: var(--stone, #8E8679);
    white-space: nowrap;
}

/* Empty placeholders for cards that need to communicate "no data yet" */
.job-v2-empty {
    text-align: center;
    color: var(--stone, #8E8679);
    font-size: 12px;
    padding: 14px 6px;
    line-height: 1.5;
}

/* ==========================================================================
   Positionen (V2 master/detail)
   ========================================================================== */

.job-v2-positions {
    display: flex;
    height: calc(var(--cx-app-h) - var(--cx-topbar-h, 60px) - 280px);
    min-height: 580px;
    background: var(--paper, #FAF7F2);
    overflow: hidden;
}

/* Prevent text selection while dragging the divider */
.job-v2-positions.is-resizing {
    user-select: none;
    cursor: col-resize;
}

/* ── Resizable divider ────────────────────────────────────────── */
.job-v2-pos-divider {
    flex: 0 0 1px;
    width: 1px;
    cursor: col-resize;
    background: transparent;
    position: relative;
    z-index: 5;
    transition: opacity 0.2s ease;
}

.job-v2-pos-divider::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: -10px;
    right: -10px;
    background: rgba(255, 255, 255, 0.001);
}

.job-v2-pos-divider::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 1px;
    background: var(--hairline, rgba(28,25,21,0.10));
    transition: background 0.15s ease;
}

.job-v2-pos-divider:hover::after,
.job-v2-positions.is-resizing .job-v2-pos-divider::after {
    background: rgba(184, 96, 31, 0.55);
}

.job-v2-pos-divider__grip {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 2;
    width: 14px;
    height: 28px;
    transform: translate(-50%, -50%);
    border-radius: 999px;
    border: 1px solid var(--hairline, rgba(28,25,21,0.08));
    color: var(--stone, #8E8679);
    background:
        radial-gradient(circle at 4px 6px, currentColor 1.1px, transparent 1.3px),
        radial-gradient(circle at 10px 6px, currentColor 1.1px, transparent 1.3px),
        radial-gradient(circle at 4px 11px, currentColor 1.1px, transparent 1.3px),
        radial-gradient(circle at 10px 11px, currentColor 1.1px, transparent 1.3px),
        radial-gradient(circle at 4px 16px, currentColor 1.1px, transparent 1.3px),
        radial-gradient(circle at 10px 16px, currentColor 1.1px, transparent 1.3px),
        radial-gradient(circle at 4px 21px, currentColor 1.1px, transparent 1.3px),
        radial-gradient(circle at 10px 21px, currentColor 1.1px, transparent 1.3px),
        var(--paper-2, #F5F1E8);
    box-shadow: 0 1px 3px rgba(28, 25, 21, 0.08);
    opacity: 0.68;
    transition: opacity 0.2s ease, border-color 0.15s ease, background-color 0.15s ease, box-shadow 0.15s ease;
    pointer-events: none;
}

.job-v2-pos-divider:hover .job-v2-pos-divider__grip,
.job-v2-positions.is-resizing .job-v2-pos-divider__grip {
    border-color: rgba(184, 96, 31, 0.35);
    color: var(--copper, #B8601F);
    background-color: var(--copper-50, #FBEFE5);
    box-shadow: 0 2px 8px rgba(184, 96, 31, 0.14);
    opacity: 1;
}

/* ── Left pane: position list ─────────────────────────────────── */
.job-v2-poslist {
    flex: 0 0 380px;
    width: 380px;   /* default; overridden by JS from localStorage */
    border-right: none; /* visual separation is now the divider */
    display: flex;
    flex-direction: column;
    background: #fff;
    min-height: 0;
    min-width: 240px;
    /* Drawer-Übergang (Bibliothek): nur grow/shrink animieren — die
       Splitter-Breite bleibt als flex-basis stehen, Drag bleibt instant. */
    transition: flex-grow 0.25s ease, flex-shrink 0.25s ease;
}

.job-v2-poslist__head {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 16px;
    border-bottom: 1px solid var(--hairline-soft, rgba(28, 25, 21, 0.05));
    flex-shrink: 0;
}

.job-v2-poslist__head-title {
    font-weight: 700;
    font-size: 13px;
    color: var(--ink, #1C1915);
}

.job-v2-poslist__head-count {
    font-size: 11px;
    font-family: var(--font-mono, ui-monospace, monospace);
    font-weight: 700;
    background: var(--sand, #F0ECE4);
    color: var(--cx-text-secondary, #4A443C);
    padding: 2px 7px;
    border-radius: 999px;
}

.job-v2-poslist__head-spacer { flex: 1; }

/* Bibliothek opener — deliberately a labelled (not icon-only) button:
   catalog/template reuse is the workflow we promote. */
.job-v2-poslist__library-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    border: 1px solid var(--copper, #B8601F);
    border-radius: 999px;
    background: transparent;
    color: var(--copper, #B8601F);
    font-size: 11.5px;
    font-weight: 600;
    font-family: inherit;
    cursor: pointer;
    transition: background 0.12s ease, color 0.12s ease;
}

.job-v2-poslist__library-btn:hover {
    background: var(--copper-50, #FBEFE5);
}

.job-v2-poslist__head .icon-button {
    width: 26px;
    height: 26px;
    font-size: 11px;
}

.job-v2-poslist__shortcut {
    font-size: 10.5px;
    font-family: var(--font-mono, ui-monospace, monospace);
    color: var(--stone, #8E8679);
    font-weight: 600;
}

.job-v2-poslist__scroll {
    flex: 1;
    overflow: auto;
    padding: 8px 10px;
}

.job-v2-poslist__grid-head {
    display: none;
}

.job-v2-poslist__row {
    width: 100%;
    text-align: left;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 8px;
    padding: 10px 12px;
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 10px;
    cursor: pointer;
    margin-bottom: 3px;
    font-family: inherit;
    transition:
        background 0.12s ease,
        border-color 0.12s ease,
        border-radius 0.16s ease,
        box-shadow 0.16s ease,
        margin 0.16s ease,
        padding 0.16s ease,
        transform 0.16s ease,
        opacity 0.16s ease;
}

.job-v2-poslist__row:hover {
    background: var(--paper-2, #F5F1E8);
}

.job-v2-poslist__row.is-active {
    background: var(--copper-50, #FBEFE5);
    border-color: rgba(184, 96, 31, 0.35);
}

.job-v2-poslist__row.is-optional {
    background: rgba(31, 74, 130, 0.035);
    border-color: rgba(31, 74, 130, 0.16);
}

.job-v2-poslist__row.is-optional:hover {
    background: rgba(31, 74, 130, 0.06);
}

.job-v2-poslist__row.is-optional.is-active {
    background: var(--copper-50, #FBEFE5);
    border-color: rgba(184, 96, 31, 0.35);
    box-shadow: inset 3px 0 0 var(--blue, #1F4A82);
}

.job-v2-poslist__row.is-dragging {
    opacity: 0.58;
}

.job-v2-poslist__row.is-drag-over {
    border-color: rgba(184, 96, 31, 0.48);
    box-shadow: inset 0 0 0 1px rgba(184, 96, 31, 0.22);
}

/* Ausgeblendet: the row must read as "not on the document" at a glance —
   dashed frame, washed-out content, struck title. The number column keeps
   full contrast so the eye-slash marker and the row actions stay findable. */
.job-v2-poslist__row.is-hidden {
    background: rgba(142, 134, 121, 0.07);
    border: 1px dashed rgba(142, 134, 121, 0.55);
}

.job-v2-poslist__row.is-hidden.is-active {
    background: rgba(184, 96, 31, 0.08);
    border-color: rgba(184, 96, 31, 0.45);
}

.job-v2-poslist__row.is-hidden .job-v2-poslist__body,
.job-v2-poslist__row.is-hidden .job-v2-poslist__grid-cell,
.job-v2-poslist__row.is-hidden .job-v2-poslist__total,
.job-v2-poslist__row.is-hidden .job-v2-poslist__split {
    opacity: 0.55;
    filter: saturate(0.4);
}

.job-v2-poslist__row.is-hidden .job-v2-poslist__num {
    color: var(--stone, #8E8679);
}

.job-v2-poslist__row.is-hidden .job-v2-poslist__num .bi-eye-slash {
    font-size: 13px;
}

.job-v2-poslist__row.is-textblock {
    border-color: var(--hairline, rgba(28, 25, 21, 0.08));
    border-left: 3px solid var(--patina, #3F7D5B);
    background: rgba(63, 125, 91, 0.04);
}

.job-v2-poslist__row.is-textblock:hover {
    background: rgba(63, 125, 91, 0.07);
}

.job-v2-poslist__row.is-textblock.is-active {
    background: rgba(63, 125, 91, 0.10);
    border-color: rgba(63, 125, 91, 0.35);
    border-left-color: var(--patina, #3F7D5B);
}

.job-v2-poslist__num {
    position: relative;
    font-family: var(--font-mono, ui-monospace, monospace);
    font-size: 10.5px;
    font-weight: 700;
    color: var(--stone, #8E8679);
    align-self: flex-start;
    padding-top: 1px;
    min-width: 34px;
}

.job-v2-poslist__drag-handle {
    position: absolute;
    left: -18px;
    top: -3px;
    width: 18px;
    height: 22px;
    padding: 0;
    border: 0;
    border-radius: 4px;
    background: transparent;
    color: var(--stone, #8E8679);
    cursor: grab;
    font-size: 14px;
    opacity: 0;
    transition: opacity 0.12s ease, color 0.12s ease, background 0.12s ease;
}

.job-v2-poslist__drag-handle:active {
    cursor: grabbing;
}

.job-v2-poslist__row:hover .job-v2-poslist__drag-handle,
.job-v2-poslist__drag-handle:focus-visible,
.job-v2-poslist__drag-handle.cx-guide-target {
    /* cx-guide-target: the feature guide is pointing at this handle — show it. */
    opacity: 1;
}

.job-v2-poslist__drag-handle:hover,
.job-v2-poslist__drag-handle:focus-visible {
    background: rgba(184, 96, 31, 0.08);
    color: var(--copper, #B8601F);
}

.job-v2-poslist__row.is-active .job-v2-poslist__num {
    color: var(--copper, #B8601F);
}

.job-v2-poslist__body { min-width: 0; }

.job-v2-poslist__title-row {
    display: flex;
    align-items: flex-start;
    gap: 6px;
    min-width: 0;
    margin-bottom: 3px;
}

.job-v2-poslist__title {
    flex: 1 1 auto;
    min-width: 0;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--ink, #1C1915);
    line-height: 1.3;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Fallback rendering when Description is empty and we're showing a
   stripped preview of DetailedDescription. Dim the weight + tone so
   the user can tell the row is unnamed without losing information. */
.job-v2-poslist__title.is-fallback {
    font-weight: 500;
    font-style: italic;
    color: var(--cx-text-secondary, #4A443C);
}

/* ── Inline Bezeichnung + Katalog-Typeahead ─────────────────────────────── */

.job-v2-poslist__title-edit {
    position: relative;
    flex: 1 1 auto;
    min-width: 0;
}

.job-v2-poslist__title-input {
    width: 100%;
    border: 1px solid transparent;
    border-radius: 6px;
    background: transparent;
    padding: 1px 6px;
    margin-left: -7px; /* aligns the text with the static title */
    font-size: 12.5px;
    font-weight: 600;
    font-family: inherit;
    color: var(--ink, #1C1915);
    line-height: 1.3;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.job-v2-poslist__title-input::placeholder {
    font-weight: 500;
    font-style: italic;
    color: var(--cx-text-secondary, #4A443C);
    opacity: 0.8;
}

.job-v2-poslist__title-input:hover:not(:disabled):not(:focus) {
    border-color: var(--hairline, rgba(28, 25, 21, 0.08));
    background: #fff;
}

.job-v2-poslist__title-input:focus {
    outline: none;
    border-color: var(--copper, #B8601F);
    background: #fff;
}

.job-v2-poslist__title-input:disabled {
    background: transparent;
    color: var(--cx-text-secondary, #4A443C);
    cursor: not-allowed;
}

.job-v2-poslist__typeahead {
    position: absolute;
    top: calc(100% + 4px);
    left: -7px;
    right: -40px;
    max-width: 420px;
    min-width: 260px;
    z-index: 90;
    background: #fff;
    border: 1px solid var(--hairline-strong, rgba(28, 25, 21, 0.14));
    border-radius: 10px;
    box-shadow: 0 12px 32px rgba(28, 25, 21, 0.18);
    padding: 4px;
    overflow: hidden;
}

/* Rows near the bottom of the list open upward so the scroll container
   does not clip the dropdown. */
.job-v2-poslist__typeahead.opens-up {
    top: auto;
    bottom: calc(100% + 4px);
}

.job-v2-poslist__typeahead-row {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 8px;
    border-radius: 7px;
    cursor: pointer;
}

.job-v2-poslist__typeahead-row:hover,
.job-v2-poslist__typeahead-row.is-highlighted {
    background: var(--copper-50, #FBEFE5);
}

.job-v2-poslist__typeahead-icon {
    width: 22px;
    height: 22px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    background: var(--copper-50, #FBEFE5);
    color: var(--copper, #B8601F);
    font-size: 11px;
}

.job-v2-poslist__typeahead-row:hover .job-v2-poslist__typeahead-icon,
.job-v2-poslist__typeahead-row.is-highlighted .job-v2-poslist__typeahead-icon {
    background: #fff;
}

.job-v2-poslist__typeahead-main {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.job-v2-poslist__typeahead-name {
    min-width: 0;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--ink, #1C1915);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.job-v2-poslist__typeahead-path {
    font-size: 10.5px;
    color: var(--stone, #8E8679);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.job-v2-poslist__typeahead-price {
    flex-shrink: 0;
    font-size: 11.5px;
    color: var(--cx-text-secondary, #4A443C);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.job-v2-poslist__typeahead-hint {
    padding: 5px 8px 3px;
    border-top: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    margin-top: 3px;
    font-size: 10.5px;
    color: var(--stone, #8E8679);
}

.job-v2-poslist__optional-badge {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    max-width: 68px;
    padding: 2px 6px;
    border-radius: 999px;
    background: rgba(31, 74, 130, 0.10);
    color: var(--blue, #1F4A82);
    border: 1px solid rgba(31, 74, 130, 0.16);
    font-family: var(--font-sans, inherit);
    font-size: 9.5px;
    font-weight: 800;
    line-height: 1.15;
    white-space: nowrap;
    text-transform: uppercase;
}

.job-v2-poslist__row.is-hidden .job-v2-poslist__title,
.job-v2-poslist__row.is-hidden .job-v2-poslist__total {
    color: var(--stone, #8E8679);
    text-decoration: line-through;
    text-decoration-color: rgba(142, 134, 121, 0.9);
    font-style: italic;
}

.job-v2-poslist__meta {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 10.5px;
    color: var(--stone, #8E8679);
    font-family: var(--font-mono, ui-monospace, monospace);
}

.job-v2-poslist__meta .sep { color: var(--hairline-strong, rgba(28, 25, 21, 0.14)); }

.job-v2-poslist__meta .calc-count {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    color: var(--cx-text-secondary, #4A443C);
}

.job-v2-poslist__image-badge {
    display: inline-flex;
    align-items: center;
    color: var(--blue, #1F4A82);
    font-size: 11px;
    line-height: 1;
}

.job-v2-poslist__hidden-badge {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    color: var(--cx-warning, #FFC107);
    font-family: var(--font-sans, inherit);
    font-weight: 700;
}

.job-v2-poslist__textblock-meta {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: var(--patina, #3F7D5B);
    font-weight: 700;
    font-family: var(--font-sans, inherit);
}

.job-v2-poslist__split {
    margin-top: 6px;
    height: 3px;
    border-radius: 2px;
    display: flex;
    overflow: hidden;
    background: var(--sand, #F0ECE4);
    transition: margin-right 0.12s ease;
}

.job-v2-poslist__row:hover .job-v2-poslist__split,
.job-v2-poslist__row.has-open-menu .job-v2-poslist__split,
.job-v2-poslist__row:focus-within .job-v2-poslist__split {
    margin-right: 92px;
}

.job-v2-poslist__split > .seg-material { background: var(--copper, #B8601F); }
.job-v2-poslist__split > .seg-labor { background: var(--blue, #1F4A82); }

/* No calculation rows yet — render the bar as a flat neutral track so the
   row keeps its rhythm without misrepresenting a 100% Material split. */
.job-v2-poslist__split.is-empty {
    background: var(--sand-2, #E9E3D6);
    opacity: 0.6;
}

.job-v2-poslist__total {
    text-align: right;
    font-family: var(--font-mono, ui-monospace, monospace);
    font-size: 13px;
    font-weight: 700;
    color: var(--ink, #1C1915);
}

.job-v2-poslist__textblock-kind {
    align-self: flex-start;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 7px;
    border-radius: 999px;
    border: 1px solid rgba(63, 125, 91, 0.22);
    background: rgba(63, 125, 91, 0.08);
    color: var(--patina, #3F7D5B);
    font-size: 10.5px;
    font-weight: 700;
    white-space: nowrap;
}

.job-v2-poslist__grid-cell {
    display: none;
}

@keyframes job-v2-grid-mode-in {
    from {
        opacity: 0.72;
        transform: translateY(4px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes job-v2-grid-cell-in {
    from {
        opacity: 0;
        transform: translateY(2px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.job-v2-poslist__grid-split {
    width: 100%;
    height: 6px;
    border-radius: 999px;
    display: flex;
    overflow: hidden;
    background: var(--sand, #F0ECE4);
}

.job-v2-poslist__grid-split > .seg-material { background: var(--copper, #B8601F); }
.job-v2-poslist__grid-split > .seg-labor { background: var(--blue, #1F4A82); }

.job-v2-poslist__grid-empty {
    color: var(--stone, #8E8679);
}

.job-v2-poslist__grid-input {
    width: 100%;
    min-width: 0;
    border: 1px solid transparent;
    border-radius: 5px;
    background: transparent;
    color: inherit;
    font: inherit;
    font-variant-numeric: tabular-nums;
    padding: 3px 5px;
    text-align: right;
    outline: none;
}

.job-v2-poslist__grid-input.is-unit {
    text-align: center;
}

.job-v2-poslist__grid-input.is-markup {
    color: var(--copper, #B8601F);
}

.job-v2-poslist__grid-input:hover:not(:disabled) {
    background: rgba(255, 255, 255, 0.55);
    border-color: var(--hairline, rgba(28, 25, 21, 0.08));
}

.job-v2-poslist__grid-input:focus {
    background: #fff;
    border-color: var(--copper, #B8601F);
    box-shadow: 0 0 0 2px rgba(184, 96, 31, 0.12);
}

.job-v2-poslist__grid-input:disabled {
    opacity: 1;
    color: inherit;
    -webkit-text-fill-color: currentColor;
    cursor: default;
}

.job-v2-poslist__grid-static {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

.job-v2-poslist__grid-static.is-markup {
    color: var(--copper, #B8601F);
}

/* ── Add split button: main segment adds a normal position directly,
   the chevron segment opens a popover with the further insert intents
   (Vorlagen & Katalog, Freitext, KI). ─────────────────────────────── */

.job-v2-poslist__add-wrap {
    position: relative;
    display: flex;
    align-items: stretch;
    margin-top: 6px;
}

.job-v2-poslist__add {
    flex: 1;
    min-width: 0;
    padding: 10px 12px;
    background: transparent;
    border: 1.5px dashed var(--hairline-strong, rgba(28, 25, 21, 0.14));
    border-right: none;
    border-radius: 8px 0 0 8px;
    color: var(--cx-text-secondary, #4A443C);
    font-size: 12.5px;
    font-weight: 600;
    font-family: inherit;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    cursor: pointer;
    transition: border-color 0.15s ease, color 0.15s ease;
}

.job-v2-poslist__add-arrow {
    width: 34px;
    flex-shrink: 0;
    padding: 0;
    background: transparent;
    border: 1.5px dashed var(--hairline-strong, rgba(28, 25, 21, 0.14));
    border-left: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    border-radius: 0 8px 8px 0;
    color: var(--cx-text-secondary, #4A443C);
    font-size: 11px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: border-color 0.15s ease, color 0.15s ease, background 0.15s ease;
}

.job-v2-poslist__add:hover,
.job-v2-poslist__add-arrow:hover {
    border-color: var(--copper, #B8601F);
    color: var(--copper, #B8601F);
}

.job-v2-poslist__add-arrow.is-active {
    border-color: var(--copper, #B8601F);
    color: var(--copper, #B8601F);
    background: var(--copper-50, #FBEFE5);
}

/* Transparent full-screen click-away layer under the popover. */
.job-v2-poslist__menu-backdrop {
    position: fixed;
    inset: 0;
    z-index: 79;
    background: transparent;
}

.job-v2-poslist__add-menu {
    position: absolute;
    bottom: calc(100% + 6px);
    right: 0;
    width: min(248px, 100%);
    background: #fff;
    border: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    border-radius: 8px;
    box-shadow: 0 6px 20px rgba(28, 25, 21, 0.12);
    padding: 4px;
    z-index: 80;
}

/* Short lists sit near the top of the tall viewport — open downward there. */
.job-v2-poslist__add-menu.opens-down {
    bottom: auto;
    top: calc(100% + 6px);
}

.job-v2-poslist__action-menu-item.is-ai {
    color: var(--ai, #5B4B8A);
}

.job-v2-poslist__foot {
    border-top: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    padding: 10px 16px;
    background: var(--paper-2, #F5F1E8);
    flex-shrink: 0;
}

.job-v2-poslist__foot-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 6px;
}

.job-v2-poslist__foot-label {
    font-size: 9.5px;
    font-family: var(--font-mono, ui-monospace, monospace);
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--stone, #8E8679);
}

.job-v2-poslist__foot-value {
    font-family: var(--font-display, 'Bricolage Grotesque', sans-serif);
    font-size: 17px;
    font-weight: 800;
    color: var(--ink, #1C1915);
    letter-spacing: -0.01em;
}

.job-v2-poslist__foot-meta {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 10.5px;
    color: var(--cx-text-secondary, #4A443C);
}

.job-v2-poslist__foot-meta .sep { color: var(--hairline-strong, rgba(28, 25, 21, 0.14)); }

.job-v2-poslist__foot-meta .dot-bar {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 2px;
}
.job-v2-poslist__foot-meta .dot-bar.is-copper { background: var(--copper, #B8601F); }
.job-v2-poslist__foot-meta .dot-bar.is-blue { background: var(--blue, #1F4A82); }

.job-v2-poslist__foot-meta strong {
    color: var(--ink, #1C1915);
    font-family: var(--font-mono, ui-monospace, monospace);
    font-weight: 700;
}

.job-v2-poslist__foot-hidden {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: var(--stone, #8E8679);
}

.job-v2-poslist__foot-optional {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: var(--blue, #1F4A82);
    font-weight: 700;
}

/* ── Adaptive spreadsheet view: enabled once the position pane is wide enough ── */
.job-v2-positions.is-position-grid .job-v2-poslist,
.job-v2-positions.is-editor-collapsed .job-v2-poslist {
    min-width: 0;
}

.job-v2-positions.is-position-grid .job-v2-poslist__head,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__head {
    background: var(--paper-2, #F5F1E8);
    border-bottom-color: var(--hairline, rgba(28, 25, 21, 0.08));
}

.job-v2-positions.is-position-grid .job-v2-poslist__scroll,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__scroll {
    padding: 0;
}

.job-v2-positions.is-position-grid .job-v2-poslist__grid-head,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__grid-head,
.job-v2-positions.is-position-grid .job-v2-poslist__row,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__row {
    display: grid;
    grid-template-columns: 36px minmax(180px, 1fr) 64px 64px 86px 68px 94px 78px;
    min-width: 698px;
}

.job-v2-positions.is-position-grid-wide .job-v2-poslist__grid-head,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__grid-head,
.job-v2-positions.is-position-grid-wide .job-v2-poslist__row,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__row {
    grid-template-columns: 42px minmax(220px, 1fr) 72px 66px 88px 76px 96px 108px 96px;
    min-width: 916px;
}

.job-v2-positions.is-position-grid .job-v2-poslist__grid-head,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__grid-head {
    position: sticky;
    top: 0;
    z-index: 5;
    align-items: center;
    background: var(--paper-2, #F5F1E8);
    border-bottom: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    animation: job-v2-grid-mode-in 0.18s ease both;
}

.job-v2-positions.is-position-grid .job-v2-poslist__grid-head > span,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__grid-head > span {
    min-width: 0;
    padding: 8px 10px;
    border-right: 1px solid var(--hairline-soft, rgba(28, 25, 21, 0.05));
    color: var(--stone, #8E8679);
    font-family: var(--font-mono, ui-monospace, monospace);
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    white-space: nowrap;
}

.job-v2-positions.is-position-grid .job-v2-poslist__grid-head .is-pos,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__grid-head .is-pos,
.job-v2-positions.is-position-grid .job-v2-poslist__grid-head .is-qty,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__grid-head .is-qty,
.job-v2-positions.is-position-grid .job-v2-poslist__grid-head .is-price,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__grid-head .is-price,
.job-v2-positions.is-position-grid .job-v2-poslist__grid-head .is-markup,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__grid-head .is-markup,
.job-v2-positions.is-position-grid .job-v2-poslist__grid-head .is-split,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__grid-head .is-split,
.job-v2-positions.is-position-grid .job-v2-poslist__grid-head .is-total,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__grid-head .is-total {
    text-align: right;
}

.job-v2-positions.is-position-grid .job-v2-poslist__grid-head .is-split,
.job-v2-positions.is-position-grid .job-v2-poslist__grid-cell.is-split {
    display: none;
}

.job-v2-positions.is-position-grid-wide .job-v2-poslist__grid-head .is-split,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__grid-head .is-split {
    display: block;
}

.job-v2-positions.is-position-grid .job-v2-poslist__row,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__row {
    align-items: stretch;
    gap: 0;
    margin: 0;
    padding: 0;
    border: 0;
    border-bottom: 1px solid var(--hairline-soft, rgba(28, 25, 21, 0.05));
    border-left: 3px solid transparent;
    border-radius: 0;
    background: #fff;
    animation: job-v2-grid-mode-in 0.18s ease both;
}

.job-v2-positions.is-position-grid .job-v2-poslist__row:hover,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__row:hover {
    background: var(--paper-2, #F5F1E8);
}

.job-v2-positions.is-position-grid .job-v2-poslist__row.is-optional,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__row.is-optional {
    border-left-color: var(--blue, #1F4A82);
    background: rgba(31, 74, 130, 0.035);
}

.job-v2-positions.is-position-grid .job-v2-poslist__row.is-optional:hover,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__row.is-optional:hover {
    background: rgba(31, 74, 130, 0.06);
}

.job-v2-positions.is-position-grid .job-v2-poslist__row.is-active,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__row.is-active {
    background: var(--copper-50, #FBEFE5);
    border-left-color: var(--copper, #B8601F);
}

.job-v2-positions.is-position-grid .job-v2-poslist__row.is-textblock,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__row.is-textblock {
    border-left-color: var(--patina, #3F7D5B);
}

/* Table mode has no frame per row, so the hidden state moves to the left edge
   and a hatched ground; the cells stay dimmed via the shared .is-hidden rules. */
.job-v2-positions.is-position-grid .job-v2-poslist__row.is-hidden,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__row.is-hidden {
    border: 0;
    border-bottom: 1px solid var(--hairline-soft, rgba(28, 25, 21, 0.05));
    border-left: 3px dashed rgba(142, 134, 121, 0.7);
    background: repeating-linear-gradient(
        -45deg,
        rgba(142, 134, 121, 0.05) 0 8px,
        rgba(142, 134, 121, 0.11) 8px 16px);
}

.job-v2-positions.is-position-grid .job-v2-poslist__row.is-hidden:hover,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__row.is-hidden:hover {
    background: rgba(142, 134, 121, 0.12);
}

.job-v2-positions.is-position-grid .job-v2-poslist__row.is-hidden.is-active,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__row.is-hidden.is-active {
    background: var(--copper-50, #FBEFE5);
    border-left-color: var(--copper, #B8601F);
}

.job-v2-positions.is-position-grid .job-v2-poslist__num,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__num,
.job-v2-positions.is-position-grid .job-v2-poslist__body,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__body,
.job-v2-positions.is-position-grid .job-v2-poslist__grid-cell,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__grid-cell,
.job-v2-positions.is-position-grid .job-v2-poslist__total,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__total,
.job-v2-positions.is-position-grid .job-v2-poslist__textblock-kind,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__textblock-kind {
    display: flex;
    align-items: center;
    min-width: 0;
    padding: 9px 10px;
    border-right: 1px solid var(--hairline-soft, rgba(28, 25, 21, 0.05));
}

.job-v2-positions.is-position-grid .job-v2-poslist__num,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__num {
    justify-content: flex-end;
    align-self: stretch;
    min-width: 0;
    padding-top: 9px;
}

.job-v2-positions.is-position-grid .job-v2-poslist__drag-handle,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__drag-handle {
    left: 4px;
    top: 50%;
    transform: translateY(-50%);
}

.job-v2-positions.is-position-grid .job-v2-poslist__body,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__body {
    flex-direction: column;
    align-items: stretch;
    justify-content: center;
}

.job-v2-positions.is-position-grid .job-v2-poslist__title-row,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__title-row {
    align-items: center;
    margin-bottom: 2px;
}

.job-v2-positions.is-position-grid .job-v2-poslist__title,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__title {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: unset;
}

.job-v2-positions.is-position-grid .job-v2-poslist__optional-badge,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__optional-badge {
    max-width: 54px;
    padding-inline: 5px;
    font-size: 9px;
}

.job-v2-positions.is-position-grid .job-v2-poslist__meta,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__meta,
.job-v2-positions.is-position-grid .job-v2-poslist__split,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__split {
    display: none;
}

.job-v2-positions.is-position-grid .job-v2-poslist__grid-cell,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__grid-cell {
    justify-content: flex-end;
    color: var(--ink, #1C1915);
    font-family: var(--font-mono, ui-monospace, monospace);
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
    animation: job-v2-grid-cell-in 0.18s ease both;
}

.job-v2-positions.is-position-grid .job-v2-poslist__grid-cell.is-unit,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__grid-cell.is-unit,
.job-v2-positions.is-position-grid-wide .job-v2-poslist__grid-cell.is-split,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__grid-cell.is-split {
    justify-content: center;
}

.job-v2-positions.is-position-grid-wide .job-v2-poslist__grid-cell.is-split,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__grid-cell.is-split {
    display: flex;
}

.job-v2-positions.is-position-grid .job-v2-poslist__grid-cell.is-markup,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__grid-cell.is-markup {
    color: var(--copper, #B8601F);
}

.job-v2-positions.is-position-grid .job-v2-poslist__total,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__total {
    justify-content: flex-end;
    align-self: stretch;
    font-size: 12.5px;
}

.job-v2-positions.is-position-grid .job-v2-poslist__textblock-kind,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__textblock-kind {
    grid-column: 3 / 8;
    align-self: stretch;
    justify-content: flex-start;
    border-radius: 0;
    border-top: 0;
    border-bottom: 0;
    border-left: 0;
    background: transparent;
}

.job-v2-positions.is-position-grid-wide .job-v2-poslist__textblock-kind,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__textblock-kind {
    grid-column: 3 / 9;
}

.job-v2-positions.is-position-grid .job-v2-poslist__row-actions,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__row-actions {
    position: static;
    transform: none;
    opacity: 1;
    pointer-events: auto;
    align-self: stretch;
    justify-content: center;
    gap: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    border-left: 0;
    border-right: 1px solid var(--hairline-soft, rgba(28, 25, 21, 0.05));
    background: transparent;
    backdrop-filter: none;
    box-shadow: none;
}

.job-v2-positions.is-position-grid .job-v2-poslist__row-action,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__row-action {
    width: 24px;
    height: 100%;
    min-height: 38px;
    border-radius: 0;
    color: var(--stone, #8E8679);
}

.job-v2-positions.is-position-grid .job-v2-poslist__row-action:hover:not(:disabled),
.job-v2-positions.is-editor-collapsed .job-v2-poslist__row-action:hover:not(:disabled),
.job-v2-positions.is-position-grid .job-v2-poslist__row-action.is-active,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__row-action.is-active {
    background: rgba(184, 96, 31, 0.08);
    color: var(--copper, #B8601F);
}

.job-v2-positions.is-position-grid .job-v2-poslist__row:hover .job-v2-poslist__split,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__row:hover .job-v2-poslist__split,
.job-v2-positions.is-position-grid .job-v2-poslist__row.has-open-menu .job-v2-poslist__split,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__row.has-open-menu .job-v2-poslist__split,
.job-v2-positions.is-position-grid .job-v2-poslist__row:focus-within .job-v2-poslist__split,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__row:focus-within .job-v2-poslist__split {
    margin-right: 0;
}

.job-v2-positions.is-position-grid .job-v2-poslist__add-wrap,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__add-wrap {
    min-width: 698px;
    margin: 0;
}

.job-v2-positions.is-position-grid .job-v2-poslist__add,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__add {
    border-radius: 0;
    border-left: 0;
}

.job-v2-positions.is-position-grid .job-v2-poslist__add-arrow,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__add-arrow {
    border-radius: 0;
    border-right: 0;
}

.job-v2-positions.is-position-grid-wide .job-v2-poslist__add-wrap,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__add-wrap {
    min-width: 916px;
}

.job-v2-positions.is-position-grid .job-v2-poslist__foot,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__foot {
    border-top: 2px solid var(--ink, #1C1915);
}

/* ── Right pane: editor with sub-tabs ─────────────────────────── */
.job-v2-poseditor-wrap {
    flex: 1 1 0;
    min-width: 520px;
    min-height: 0;
    display: flex;
    overflow: hidden;
    transition: flex-basis 0.25s ease, flex-grow 0.25s ease, width 0.2s ease, min-width 0.2s ease;
}

.job-v2-positions.is-editor-collapsed .job-v2-poslist {
    flex: 1 1 auto !important;
    width: auto !important;
}

.job-v2-positions.is-editor-collapsed .job-v2-pos-divider {
    display: none;
}

.job-v2-positions.is-editor-collapsed .job-v2-poseditor-wrap {
    flex: 0 0 0;
    width: 0;
    min-width: 0;
    border-left: 0;
}

/* ── Bibliothek als Drawer: Liste bekommt den ganzen Restplatz,
     das Panel sitzt fix an der rechten Kante (Splitter pausiert;
     JS überspringt applyPanelWidth via suspendClass).
     Animierbar gehalten: die Liste behält ihre Splitter-Breite als
     flex-basis und wächst nur über flex-grow; das Panel animiert
     flex-basis 0 → 560px. Kein Breiten-Snap in beide Richtungen. ── */
.job-v2-positions.is-library-open .job-v2-poslist {
    flex-grow: 1 !important;
    flex-shrink: 1 !important;
}

.job-v2-positions.is-library-open .job-v2-pos-divider {
    opacity: 0;
    pointer-events: none;
}

.job-v2-positions.is-library-open .job-v2-poseditor-wrap {
    flex: 0 1 560px;
    min-width: 360px;
}

.job-v2-poseditor {
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background: var(--paper, #FAF7F2);
    min-height: 0;
    min-width: 0;
}

.job-v2-poseditor__head {
    display: flex;
    align-items: center;
    background: #fff;
    border-bottom: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    padding-right: 16px;
    flex-shrink: 0;
    min-width: 0;
}

.job-v2-poseditor__pos-tag {
    flex: 0 0 auto;
    font-family: var(--font-mono, ui-monospace, monospace);
    font-size: 10.5px;
    font-weight: 700;
    color: var(--copper, #B8601F);
    letter-spacing: 0.14em;
    padding: 0 18px;
    border-right: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    align-self: stretch;
    display: flex;
    align-items: center;
    gap: 8px;
}

.job-v2-poseditor__type-chip,
.job-v2-posdesc__type-chip {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 8px;
    border-radius: 999px;
    border: 1px solid rgba(63, 125, 91, 0.22);
    background: rgba(63, 125, 91, 0.08);
    color: var(--patina, #3F7D5B);
    font-family: var(--font-sans, inherit);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0;
    text-transform: none;
    white-space: nowrap;
}

.job-v2-poseditor__tab-strip {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    align-self: stretch;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
}

.job-v2-poseditor__tab-strip::-webkit-scrollbar {
    display: none;
}

.job-v2-poseditor__sub-tab {
    flex: 0 0 auto;
    background: transparent;
    border: none;
    padding: 14px 14px;
    font-size: 13px;
    font-weight: 600;
    font-family: inherit;
    color: var(--stone, #8E8679);
    border-bottom: 2px solid transparent;
    margin-bottom: -1px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    transition: color 0.15s ease, background 0.15s ease;
}

.job-v2-poseditor__sub-tab:hover { background: rgba(28, 25, 21, 0.03); }
.job-v2-poseditor__sub-tab.is-active {
    color: var(--ink, #1C1915);
    border-bottom-color: var(--copper, #B8601F);
}

.job-v2-poseditor__sub-tab > i { font-size: 14px; }

.job-v2-poseditor__head-spacer { flex: 0 0 8px; }

.job-v2-poseditor__drawer-close {
    flex: 0 0 auto;
    width: 28px;
    height: 28px;
    margin-right: 8px;
    color: var(--stone, #8E8679);
}

.job-v2-poseditor__drawer-close:hover {
    color: var(--ink, #1C1915);
    background: var(--paper-2, #F5F1E8);
}

.job-v2-poseditor__saved {
    flex: 0 0 auto;
    width: 28px;
    height: 28px;
    color: var(--patina, #3F7D5B);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
}

.job-v2-poseditor__saved > i {
    font-size: 14px;
}

.job-v2-poseditor__body {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 18px 22px 28px;
}

.job-v2-poseditor__empty {
    text-align: center;
    color: var(--stone, #8E8679);
    font-size: 13px;
    padding: 60px 20px;
    line-height: 1.5;
}

/* ── Description sub-tab ──────────────────────────────────────── */
.job-v2-posdesc__title-row {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-bottom: 16px;
}

.job-v2-posdesc__title-row .job-v2-posdesc__type-chip {
    align-self: flex-start;
    margin-top: 2px;
}

.job-v2-posdesc__eyebrow {
    font-size: 10px;
    font-family: var(--font-mono, ui-monospace, monospace);
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--stone, #8E8679);
}

.job-v2-posdesc__title-input {
    font-family: var(--font-display, 'Bricolage Grotesque', sans-serif);
    font-size: 16px;
    font-weight: 600;
    color: var(--ink, #1C1915);
    letter-spacing: -0.015em;
    border: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    border-radius: 8px;
    outline: none;
    background: rgba(255, 255, 255, 0.72);
    width: 100%;
    padding: 8px 12px;
    cursor: text;
    transition: background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}

.job-v2-posdesc__title-input:hover:not(:disabled) {
    background: #fff;
    border-color: var(--hairline-strong, rgba(28, 25, 21, 0.14));
}

.job-v2-posdesc__title-input:focus {
    background: #fff;
    border-color: var(--copper, #B8601F);
    box-shadow: 0 0 0 3px rgba(184, 96, 31, 0.10);
}

.job-v2-posdesc__title-input:disabled {
    cursor: not-allowed;
    opacity: 0.72;
}

.job-v2-posdesc__body-eyebrow {
    font-size: 10px;
    font-family: var(--font-mono, ui-monospace, monospace);
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--stone, #8E8679);
    margin: 18px 0 6px;
}

.job-v2-posdesc__body-eyebrow.is-internal {
    margin-top: 20px;
}

.job-v2-posdesc__body {
    width: 100%;
    min-height: 220px;
    border: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    border-radius: 8px;
    padding: 12px 14px;
    font-family: inherit;
    font-size: 13.5px;
    line-height: 1.5;
    color: var(--ink, #1C1915);
    background: #fff;
    resize: vertical;
    outline: none;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.job-v2-posdesc__body:focus {
    border-color: var(--copper, #B8601F);
    box-shadow: 0 0 0 3px rgba(184, 96, 31, 0.12);
}

.job-v2-posdesc__counter {
    text-align: right;
    font-size: 11px;
    font-family: var(--font-mono, ui-monospace, monospace);
    color: var(--stone, #8E8679);
    margin-top: 4px;
}

.job-v2-posdesc__notes {
    width: 100%;
    min-height: 116px;
    border: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    border-radius: 8px;
    padding: 12px 14px;
    font-family: inherit;
    font-size: 13.5px;
    line-height: 1.5;
    color: var(--ink, #1C1915);
    background: rgba(245, 241, 232, 0.46);
    resize: vertical;
    outline: none;
    transition: background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}

.job-v2-posdesc__notes:focus {
    background: #fff;
    border-color: var(--copper, #B8601F);
    box-shadow: 0 0 0 3px rgba(184, 96, 31, 0.12);
}

.job-v2-posdesc__notes:disabled {
    cursor: not-allowed;
    opacity: 0.72;
}

.job-v2-posdesc__metrics {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin: 16px 0;
}

.job-v2-posdesc__metrics.is-calc {
    grid-template-columns: repeat(3, 1fr);
}

.job-v2-posdesc__metric {
    background: #fff;
    border: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    border-radius: 10px;
    padding: 11px 14px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    transition: border-color 0.15s ease;
}

.job-v2-posdesc__metric:focus-within {
    border-color: var(--copper, #B8601F);
    box-shadow: 0 0 0 3px rgba(184, 96, 31, 0.10);
}

.job-v2-posdesc__metric-label {
    font-size: 9.5px;
    font-family: var(--font-mono, ui-monospace, monospace);
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--stone, #8E8679);
    margin-bottom: 4px;
}

.job-v2-posdesc__metric-value {
    display: flex;
    align-items: center;
    gap: 6px;
    font-family: var(--font-mono, ui-monospace, monospace);
    font-size: 14px;
    font-weight: 700;
    color: var(--ink, #1C1915);
}

.job-v2-posdesc__metric-value input,
.job-v2-posdesc__metric-value select {
    border: none;
    outline: none;
    background: transparent;
    font: inherit;
    color: inherit;
    width: 100%;
    padding: 0;
    min-width: 0;
}

.job-v2-posdesc__metric-value .unit {
    font-family: var(--font-sans, 'Inter', sans-serif);
    font-weight: 500;
    font-size: 13px;
    color: var(--cx-text-secondary, #4A443C);
}

.job-v2-posdesc__metric.is-aufschlag .job-v2-posdesc__metric-value {
    color: var(--copper, #B8601F);
}

.job-v2-posdesc__metric.is-total .job-v2-posdesc__metric-value {
    color: var(--ink, #1C1915);
    font-size: 16px;
}

.job-v2-posdesc__metric.is-total .unit {
    color: var(--cx-text-secondary, #4A443C);
}

/* Editor toolbar (visual fidelity row above the body) */
.job-v2-posdesc__editor-bar {
    display: flex;
    align-items: center;
    gap: 4px;
    border: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    border-bottom: none;
    border-radius: 10px 10px 0 0;
    background: #fff;
    padding: 6px 10px;
}

.job-v2-posdesc__editor-bar > .toolbtn {
    width: 28px;
    height: 28px;
    border-radius: 6px;
    border: none;
    background: transparent;
    color: var(--cx-text-secondary, #4A443C);
    display: grid;
    place-items: center;
    cursor: not-allowed;
    font-size: 13px;
}

.job-v2-posdesc__editor-bar > .toolbtn:disabled {
    opacity: 0.55;
}

.job-v2-posdesc__editor-bar > .divider {
    width: 1px;
    height: 18px;
    background: var(--hairline, rgba(28, 25, 21, 0.08));
    margin: 0 4px;
}

.job-v2-posdesc__bob-btn {
    margin-left: auto;
    background: transparent;
    border: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    color: var(--ai, #5B4B8A);
    border-radius: 999px;
    padding: 4px 10px 4px 8px;
    font-size: 11.5px;
    font-weight: 600;
    font-family: inherit;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease;
}

.job-v2-posdesc__bob-btn:hover {
    background: var(--ai-50, #EEEBF5);
    border-color: var(--ai, #5B4B8A);
}

.job-v2-posdesc__bob-btn:disabled {
    cursor: not-allowed;
    opacity: 0.6;
}

.job-v2-posdesc__bob-btn i {
    color: var(--ai, #5B4B8A);
    font-size: 12px;
}

.job-v2-posdesc__snippet-btn {
    background: transparent;
    border: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    color: var(--copper, #B8601F);
    border-radius: 999px;
    padding: 4px 10px 4px 8px;
    font-size: 11.5px;
    font-weight: 600;
    font-family: inherit;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease;
}

.job-v2-posdesc__snippet-btn:hover {
    background: rgba(184, 96, 31, 0.08);
    border-color: var(--copper, #B8601F);
}

.job-v2-posdesc__snippet-btn:disabled {
    cursor: not-allowed;
    opacity: 0.6;
}

.job-v2-posdesc__template-sync {
    margin-top: 10px;
    border: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    border-radius: 8px;
    background: var(--paper-2, #F7F4EE);
    padding: 10px 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.job-v2-posdesc__template-sync-copy {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    min-width: 0;
    color: var(--cx-text-secondary, #4A443C);
    font-size: 12px;
    line-height: 1.4;
}

.job-v2-posdesc__template-sync-copy i {
    color: var(--copper, #B8601F);
    margin-top: 1px;
}

.job-v2-posdesc__template-sync-actions {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

.job-v2-posdesc__template-sync-link,
.job-v2-posdesc__template-sync-primary {
    border: none;
    background: transparent;
    font-family: inherit;
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
}

.job-v2-posdesc__template-sync-link {
    color: var(--cx-text-muted, #8E8679);
}

.job-v2-posdesc__template-sync-primary {
    border: 1px solid var(--copper, #B8601F);
    border-radius: 999px;
    color: var(--copper, #B8601F);
    padding: 5px 10px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.job-v2-posdesc__template-sync-primary:hover {
    background: rgba(184, 96, 31, 0.08);
}

.job-v2-posdesc__template-sync-link:disabled,
.job-v2-posdesc__template-sync-primary:disabled {
    cursor: not-allowed;
    opacity: 0.55;
}

/* Body radius adjusts when the toolbar is above */
.job-v2-posdesc__body.with-toolbar {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

/* Bob umformulieren — preview-and-confirm panel before applying changes. */
.job-v2-posdesc__bob-preview {
    margin: 8px 0 12px;
    border: 1px solid var(--ai, #5B4B8A);
    border-radius: 10px;
    background: linear-gradient(180deg, var(--ai-50, #F2EFF8) 0%, var(--paper, #ffffff) 100%);
    padding: 12px 14px;
    box-shadow: 0 1px 3px rgba(91, 75, 138, 0.10);
}

.job-v2-posdesc__bob-preview-head {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--ai, #5B4B8A);
    margin-bottom: 8px;
}

.job-v2-posdesc__bob-preview-head i {
    font-size: 14px;
}

.job-v2-posdesc__bob-preview-body {
    margin: 0 0 10px;
    padding: 10px 12px;
    background: var(--paper, #ffffff);
    border: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    border-radius: 8px;
    font-family: inherit;
    font-size: 13px;
    line-height: 1.55;
    color: var(--cx-text-primary, #1C1915);
    white-space: pre-wrap;
    word-break: break-word;
    max-height: 240px;
    overflow: auto;
}

.job-v2-posdesc__bob-preview-actions {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
}

.job-v2-posdesc__bob-preview-actions .toolbtn {
    background: transparent;
    border: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    border-radius: 999px;
    padding: 4px 10px;
    font-size: 11.5px;
    color: var(--cx-text-secondary, #4A443C);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.job-v2-posdesc__bob-preview-actions .toolbtn:hover {
    background: var(--sand, #F5EFE6);
    border-color: var(--cx-text-secondary, #4A443C);
    color: var(--cx-text-primary, #1C1915);
}

/* Inline image grid below the body, on the Beschreibung tab */
.job-v2-posdesc__images {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
    margin-top: 14px;
}

.job-v2-posdesc__images-tile {
    aspect-ratio: 4 / 3;
    border-radius: 10px;
    border: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    background: #fff;
    overflow: hidden;
    display: grid;
    place-items: center;
    color: var(--stone, #8E8679);
    font-size: 12px;
    text-align: center;
    padding: 10px;
    position: relative;
}

.job-v2-posdesc__images-tile img {
    width: 100%; height: 100%; object-fit: cover;
}

.job-v2-posdesc__images-tile.is-add {
    border-style: dashed;
    cursor: pointer;
    background: var(--paper-2, #F5F1E8);
}

.job-v2-posdesc__images-tile.is-add:hover {
    border-color: var(--copper, #B8601F);
    color: var(--copper, #B8601F);
}

.job-v2-posdesc__images-tile-label {
    position: absolute;
    bottom: 6px;
    left: 8px;
    font-size: 10.5px;
    font-family: var(--font-mono, ui-monospace, monospace);
    color: var(--stone, #8E8679);
    background: rgba(255,255,255,0.85);
    padding: 1px 6px;
    border-radius: 4px;
}

/* ── Calc sub-tab ─────────────────────────────────────────────── */
.job-v2-poscalc {
    container-type: inline-size;
    min-width: 0;
    max-width: 100%;
    overflow-x: clip;
}

.job-v2-poscalc,
.job-v2-poscalc * {
    box-sizing: border-box;
}

.job-v2-poscalc__head {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 14px;
}

.job-v2-poscalc__head-title {
    font-family: var(--font-display, 'Bricolage Grotesque', sans-serif);
    font-size: 17px;
    font-weight: 800;
    color: var(--ink, #1C1915);
    letter-spacing: -0.015em;
    margin: 0;
    flex: 1;
}

.job-v2-poscalc__quick {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 18px;
    background: var(--paper-2, #F5F1E8);
    border: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    border-radius: 8px;
    padding: 10px 14px;
}

.job-v2-poscalc__quick i { color: var(--copper, #B8601F); font-size: 14px; }

.job-v2-poscalc__quick input {
    flex: 1;
    border: none;
    background: transparent;
    outline: none;
    font: inherit;
    font-size: 13px;
    color: var(--ink, #1C1915);
}

.job-v2-poscalc__quick input::placeholder {
    color: var(--stone, #8E8679);
}

.job-v2-poscalc__quick .kbd {
    font-family: var(--font-mono, ui-monospace, monospace);
    font-size: 10.5px;
    color: var(--stone, #8E8679);
    background: rgba(28, 25, 21, 0.05);
    padding: 2px 6px;
    border-radius: 4px;
}

.job-v2-poscalc__group {
    background: #fff;
    border: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    border-radius: 10px;
    overflow: hidden;
    margin-bottom: 14px;
}

.job-v2-poscalc__group-head {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    border-bottom: 1px solid var(--hairline-soft, rgba(28, 25, 21, 0.05));
    background: var(--paper-2, #F5F1E8);
}

.job-v2-poscalc__group-icon {
    width: 26px;
    height: 26px;
    border-radius: 7px;
    display: grid;
    place-items: center;
    font-size: 13px;
}

.job-v2-poscalc__group.is-material .job-v2-poscalc__group-icon {
    background: var(--copper-50, #FBEFE5);
    color: var(--copper, #B8601F);
}

.job-v2-poscalc__group.is-labor .job-v2-poscalc__group-icon {
    background: var(--blue-50, #EEF3FB);
    color: var(--blue, #1F4A82);
}

.job-v2-poscalc__group.is-fixed .job-v2-poscalc__group-icon {
    background: rgba(82, 132, 100, 0.12);
    color: var(--success, #528464);
}

.job-v2-poscalc__group-title {
    font-size: 12.5px;
    font-weight: 700;
    font-family: var(--font-mono, ui-monospace, monospace);
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: var(--ink, #1C1915);
}

.job-v2-poscalc__group-meta {
    font-size: 11px;
    color: var(--stone, #8E8679);
}

.job-v2-poscalc__group-spacer { flex: 1; }

.job-v2-poscalc__group-total {
    font-family: var(--font-mono, ui-monospace, monospace);
    font-size: 14px;
    font-weight: 700;
    color: var(--ink, #1C1915);
}

.job-v2-poscalc__table {
    width: 100%;
    max-width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
    font-size: 12.5px;
}

.job-v2-poscalc__table th {
    text-align: left;
    padding: 8px 14px;
    font-size: 10px;
    font-family: var(--font-mono, ui-monospace, monospace);
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--stone, #8E8679);
    border-bottom: 1px solid var(--hairline-soft, rgba(28, 25, 21, 0.05));
    background: #fff;
}

.job-v2-poscalc__table th.num,
.job-v2-poscalc__table td.num {
    text-align: right;
    font-family: var(--font-mono, ui-monospace, monospace);
    font-variant-numeric: tabular-nums;
}

.job-v2-poscalc__table tr {
    border-bottom: 1px solid var(--hairline-soft, rgba(28, 25, 21, 0.05));
}

.job-v2-poscalc__table tr:last-child { border-bottom: none; }

.job-v2-poscalc__table td {
    padding: 10px 14px;
    color: var(--ink, #1C1915);
    vertical-align: middle;
}

.job-v2-poscalc__table .sku {
    font-family: var(--font-mono, ui-monospace, monospace);
    font-size: 11px;
    color: var(--cx-text-secondary, #4A443C);
}

.job-v2-poscalc__table .total {
    font-weight: 700;
}

.job-v2-poscalc__empty {
    padding: 18px;
    color: var(--stone, #8E8679);
    text-align: center;
    font-size: 12.5px;
}

/* ── Images / Notes sub-tabs ──────────────────────────────────── */
.job-v2-posimages {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
}

.job-v2-posimages__tile {
    aspect-ratio: 4 / 3;
    border-radius: 10px;
    border: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    background: #fff;
    overflow: hidden;
    position: relative;
    display: grid;
    place-items: center;
}

.job-v2-posimages__tile img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.job-v2-posimages__tile.is-add {
    border-style: dashed;
    color: var(--stone, #8E8679);
    cursor: pointer;
    background: var(--paper-2, #F5F1E8);
}

.job-v2-posimages__tile.is-add:hover {
    border-color: var(--copper, #B8601F);
    color: var(--copper, #B8601F);
}

/* ─── Wave 1 (W1A) — JobV2 Positions: add-position chooser, row actions, saving pill ─── */

/* Anchor for absolute-positioned row actions */
.job-v2-poslist__row { position: relative; }
.job-v2-poslist__row.has-open-menu { z-index: 60; }

/* Inline row action overlay (up / down / delete) */
.job-v2-poslist__row-actions {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    display: inline-flex;
    align-items: center;
    gap: 2px;
    padding: 2px;
    border-radius: 6px;
    background: rgba(255, 255, 255, 0.94);
    backdrop-filter: blur(2px);
    border: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    box-shadow: 0 1px 3px rgba(28, 25, 21, 0.06);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.12s ease;
}

.job-v2-poslist__row:hover .job-v2-poslist__row-actions,
.job-v2-poslist__row.has-open-menu .job-v2-poslist__row-actions,
.job-v2-poslist__row-actions:focus-within {
    opacity: 1;
    pointer-events: auto;
}

.job-v2-poslist__row-action {
    width: 22px;
    height: 22px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 4px;
    background: transparent;
    color: var(--cx-text-secondary, #4A443C);
    font-size: 11px;
    cursor: pointer;
    transition: background 0.1s ease, color 0.1s ease;
}

.job-v2-poslist__row-action:hover:not(:disabled) {
    background: var(--copper-50, #FBEFE5);
    color: var(--copper, #B8601F);
}

.job-v2-poslist__row-action.is-danger:hover:not(:disabled) {
    background: rgba(154, 59, 51, 0.10);
    color: var(--danger, #9A3B33);
}

.job-v2-poslist__row-action.is-confirming {
    background: rgba(154, 59, 51, 0.14);
    color: var(--danger, #9A3B33);
    box-shadow: 0 0 0 1px rgba(154, 59, 51, 0.4);
}

.job-v2-poslist__row-action:disabled {
    opacity: 0.3;
    cursor: not-allowed;
}

/* ── Alternative row styling ──────────────────────────────────── */

.job-v2-poslist__row.is-alternative {
    border-left: 3px solid var(--cx-warning, #FFC107);
}

.job-v2-poslist__alt-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--cx-warning, #FFC107);
    color: #000;
    font-size: 0.58rem;
    font-weight: 700;
    padding: 0.08rem 0.22rem;
    border-radius: 3px;
    margin-left: 3px;
    text-transform: uppercase;
    font-family: var(--font-mono, ui-monospace, monospace);
    line-height: 1.3;
    vertical-align: middle;
}

/* ── Row action: three-dot active state ───────────────────────── */

.job-v2-poslist__row-action.is-active {
    background: var(--copper-50, #FBEFE5);
    color: var(--copper, #B8601F);
}

/* ── Action dropdown menu ─────────────────────────────────────── */

.job-v2-poslist__action-menu {
    position: absolute;
    top: calc(50% + 18px);
    right: 12px;
    width: min(248px, calc(100% - 24px));
    background: #fff;
    border: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    border-radius: 8px;
    box-shadow: 0 6px 20px rgba(28, 25, 21, 0.12);
    padding: 4px;
    z-index: 80;
}

.job-v2-poslist__action-menu-item {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    padding: 7px 10px;
    border: none;
    border-radius: 5px;
    background: transparent;
    color: var(--ink, #1C1915);
    font-size: 12.5px;
    font-family: inherit;
    text-align: left;
    white-space: nowrap;
    cursor: pointer;
    transition: background 0.12s ease;
}

.job-v2-poslist__action-menu-item span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

.job-v2-poslist__action-menu-item:hover {
    background: var(--paper-2, #F5F1E8);
}

.job-v2-poslist__action-menu-item.is-checked {
    background: rgba(13, 110, 253, 0.07);
}

.job-v2-poslist__action-menu-item.is-danger {
    color: var(--danger, #9A3B33);
}

.job-v2-poslist__action-menu-item.is-danger:hover {
    background: rgba(154, 59, 51, 0.08);
}

.job-v2-poslist__action-menu-item i {
    font-size: 13px;
    width: 18px;
    text-align: center;
    flex-shrink: 0;
}

.job-v2-poslist__action-menu-divider {
    height: 1px;
    background: var(--hairline, rgba(28, 25, 21, 0.08));
    margin: 4px 0;
}

/* Keep row actions as real grid cells in adaptive spreadsheet mode. These
   overrides live after the compact hover-menu rules so they win the cascade. */
.job-v2-positions.is-position-grid .job-v2-poslist__row-actions,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__row-actions {
    position: static;
    transform: none;
    opacity: 1;
    pointer-events: auto;
    align-self: stretch;
    justify-content: center;
    gap: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    border-left: 0;
    border-right: 1px solid var(--hairline-soft, rgba(28, 25, 21, 0.05));
    background: transparent;
    backdrop-filter: none;
    box-shadow: none;
}

.job-v2-positions.is-position-grid .job-v2-poslist__row-action,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__row-action {
    width: 24px;
    height: 100%;
    min-height: 38px;
    border-radius: 0;
    color: var(--stone, #8E8679);
}

.job-v2-positions.is-position-grid .job-v2-poslist__row-action:hover:not(:disabled),
.job-v2-positions.is-editor-collapsed .job-v2-poslist__row-action:hover:not(:disabled),
.job-v2-positions.is-position-grid .job-v2-poslist__row-action.is-active,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__row-action.is-active {
    background: rgba(184, 96, 31, 0.08);
    color: var(--copper, #B8601F);
}

.job-v2-positions.is-position-grid .job-v2-poslist__action-menu,
.job-v2-positions.is-editor-collapsed .job-v2-poslist__action-menu {
    top: calc(100% - 4px);
    right: 8px;
}

/* ── Alternative group dialog ─────────────────────────────────── */

.job-v2-alt-dialog .e-dlg-content {
    padding: 18px 20px !important;
}

.job-v2-move-dialog .e-dlg-content {
    padding: 18px 20px !important;
}

.job-v2-move-content {
    display: grid;
    gap: 8px;
}

.job-v2-move-label {
    font-size: 12px;
    font-weight: 700;
    color: var(--ink, #1C1915);
}

.job-v2-move-input {
    width: 100%;
    height: 36px;
    border: 1px solid var(--hairline-strong, rgba(28, 25, 21, 0.16));
    border-radius: 6px;
    padding: 0 10px;
    font: inherit;
    color: var(--ink, #1C1915);
    background: #fff;
}

.job-v2-move-input:focus {
    outline: none;
    border-color: rgba(184, 96, 31, 0.55);
    box-shadow: 0 0 0 3px rgba(184, 96, 31, 0.12);
}

.job-v2-move-hint {
    font-size: 11px;
    color: var(--stone, #8E8679);
}

.job-v2-move-actions {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 8px;
}

.job-v2-alt-content {
    display: flex;
    flex-direction: column;
}

.job-v2-alt-options {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.job-v2-alt-option {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 14px;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-radius: 8px;
    background: #fff;
    cursor: pointer;
    transition: all 0.15s ease;
    text-align: left;
    font-family: inherit;
    font-size: 13px;
    color: var(--ink, #1C1915);
}

.job-v2-alt-option:hover {
    background: var(--paper-2, #F5F1E8);
    border-color: rgba(0, 0, 0, 0.14);
}

.job-v2-alt-option.selected {
    background: rgba(255, 193, 7, 0.1);
    border-color: var(--cx-warning, #FFC107);
}

.job-v2-alt-letter {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    background: var(--cx-warning, #FFC107);
    color: #000;
    font-weight: 700;
    border-radius: 5px;
    font-size: 0.9rem;
    flex-shrink: 0;
}

.job-v2-alt-option.remove-alt {
    color: var(--cx-text-secondary, #4A443C);
}

.job-v2-alt-option.remove-alt:hover {
    background: rgba(108, 117, 125, 0.06);
}

.job-v2-alt-option.remove-alt i {
    font-size: 1.15rem;
    color: var(--cx-text-secondary, #4A443C);
}

.job-v2-alt-divider {
    height: 1px;
    background: var(--hairline, rgba(28, 25, 21, 0.08));
    margin: 4px 0;
}

/* Image tile wrap + removal affordance (Bilder sub-tab) */
.job-v2-posimages__tile-wrap {
    display: flex;
    flex-direction: column;
    gap: 6px;
    align-items: stretch;
}

.job-v2-posimages__remove {
    align-self: flex-start;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 8px;
    border: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    border-radius: 6px;
    background: #fff;
    color: var(--cx-text-secondary, #4A443C);
    font-size: 11.5px;
    cursor: pointer;
    transition: background 0.1s ease, color 0.1s ease, border-color 0.1s ease;
}

.job-v2-posimages__remove:hover:not(:disabled) {
    background: rgba(154, 59, 51, 0.08);
    color: var(--danger, #9A3B33);
    border-color: rgba(154, 59, 51, 0.25);
}

.job-v2-posimages__remove:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Saving pill — neutral indicator while a positions write is in flight */
.job-v2-saving-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 3px 10px;
    border-radius: 999px;
    background: var(--paper-2, #F5F1E8);
    border: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    color: var(--cx-text-secondary, #4A443C);
    font-size: 11px;
    font-weight: 500;
    line-height: 1;
}

.job-v2-saving-pill .spinner {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    border: 1.5px solid var(--hairline-strong, rgba(28, 25, 21, 0.14));
    border-top-color: var(--copper, #B8601F);
    animation: jobv2-saving-spin 0.7s linear infinite;
}

@keyframes jobv2-saving-spin {
    to { transform: rotate(360deg); }
}

/* ============================================================
 * JobV2 Description tab — Rich-text editor (W2A wave)
 * Interactive toolbar + contenteditable replaces the disabled
 * mockup toolbar + textarea. Visual fidelity matches the prior
 * textarea so layout shifts are zero.
 * ============================================================ */

.job-v2-posdesc__editor-bar > .toolbtn:not(:disabled) {
    cursor: pointer;
    transition: background 0.12s ease, color 0.12s ease, border-color 0.12s ease;
}

.job-v2-posdesc__editor-bar > .toolbtn:not(:disabled):hover {
    background: rgba(184, 96, 31, 0.08); /* copper tint */
    color: var(--copper, #B8601F);
}

.job-v2-posdesc__editor-bar > .toolbtn:not(:disabled):active {
    background: rgba(184, 96, 31, 0.16);
}

.job-v2-posdesc__editor-bar > .toolbtn.is-active {
    background: rgba(184, 96, 31, 0.14);
    color: var(--copper, #B8601F);
    box-shadow: inset 0 0 0 1px rgba(184, 96, 31, 0.35);
}

.job-v2-posdesc__editor-bar.is-readonly > .toolbtn,
.job-v2-posdesc__editor-bar.is-readonly > .job-v2-posdesc__bob-btn,
.job-v2-posdesc__editor-bar.is-readonly > .job-v2-posdesc__snippet-btn {
    opacity: 0.45;
    cursor: not-allowed;
    pointer-events: none;
}

/* Contenteditable RTE — visually identical to the prior textarea. */
.job-v2-posdesc__rte {
    width: 100%;
    min-height: 220px;
    border: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    border-radius: 8px;
    padding: 12px 14px;
    font-family: inherit;
    font-size: 13.5px;
    line-height: 1.5;
    color: var(--ink, #1C1915);
    background: #fff;
    outline: none;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
    overflow-y: auto;
    word-wrap: break-word;
    white-space: pre-wrap;
}

.job-v2-posdesc__rte.with-toolbar {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

.job-v2-posdesc__rte:focus {
    border-color: var(--copper, #B8601F);
    box-shadow: 0 0 0 3px rgba(184, 96, 31, 0.12);
}

/* Empty-state placeholder — only shows when truly empty */
.job-v2-posdesc__rte:empty::before {
    content: attr(data-placeholder);
    color: var(--cx-text-muted, #8E8679);
    pointer-events: none;
}

.job-v2-posdesc__rte[contenteditable="false"] {
    color: var(--cx-text-secondary, #4A443C);
    background: var(--paper-2, #F7F4EE);
    cursor: not-allowed;
}

.job-v2-posdesc__rte ul,
.job-v2-posdesc__rte ol {
    margin: 0.25em 0 0.5em 0;
    padding-left: 1.5em;
}

.job-v2-posdesc__rte p {
    margin: 0 0 0.5em 0;
}

.job-v2-posdesc__rte p:last-child {
    margin-bottom: 0;
}


/* ─── Wave 2 (W2B) — Bilder sub-tab: upload affordance + hover overlay ─── */

/* Hidden native file input — the entire .is-add tile is the click target */
.job-v2-posimages__input {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
}

/* Add-tile content stack (icon + title + hint) */
.job-v2-posimages__addcontent {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    pointer-events: none;
}

.job-v2-posimages__addcontent > i {
    font-size: 26px;
    color: var(--copper, #B8601F);
}

.job-v2-posimages__addtitle {
    font-size: 13px;
    font-weight: 600;
    color: var(--ink, #1C1915);
}

.job-v2-posimages__addhint {
    font-size: 11px;
    color: var(--cx-text-muted, #8E8679);
}

/* Hover overlay revealed on tile hover (Vergrößern, etc.) */
.job-v2-posimages__hover {
    position: absolute;
    inset: 0;
    background: rgba(28, 25, 21, 0.36);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.15s ease;
}

.job-v2-posimages__tile:hover .job-v2-posimages__hover,
.job-v2-posimages__tile:focus-within .job-v2-posimages__hover {
    opacity: 1;
    pointer-events: auto;
}

.job-v2-posimages__hover-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border-radius: 6px;
    background: rgba(255, 255, 255, 0.95);
    color: var(--ink, #1C1915);
    font-size: 12.5px;
    font-weight: 600;
    text-decoration: none;
    border: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    transition: background 0.1s ease, color 0.1s ease;
}

.job-v2-posimages__hover-btn:hover {
    background: var(--copper-50, #FBEFE5);
    color: var(--copper, #B8601F);
}

/* Spinner overlay during upload */
.job-v2-posimages__spinner {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.72);
    color: var(--copper, #B8601F);
}

/* Busy state (during upload) — soft fade + cursor */
.job-v2-posimages__tile.is-busy {
    opacity: 0.85;
    cursor: progress;
}

/* ── Calc sub-tab: editable rows (Wave 3 — JobV2PositionCalcTab) ─── */
.job-v2-poscalc__table.is-editable td {
    padding: 6px 10px;
}

.job-v2-poscalc__input {
    width: 100%;
    min-width: 0;
    border: 1px solid transparent;
    background: transparent;
    border-radius: 6px;
    padding: 5px 8px;
    font: inherit;
    font-size: 12.5px;
    color: var(--ink, #1C1915);
    transition: border-color 120ms ease, background-color 120ms ease;
}

.job-v2-poscalc__input.num {
    text-align: right;
    font-family: var(--font-mono, ui-monospace, monospace);
    font-variant-numeric: tabular-nums;
}

.job-v2-poscalc__input:hover:not(:disabled) {
    border-color: var(--hairline, rgba(28, 25, 21, 0.08));
}

.job-v2-poscalc__input:focus {
    outline: none;
    border-color: var(--copper, #B8601F);
    background: #fff;
    box-shadow: 0 0 0 3px rgba(184, 96, 31, 0.12);
}

.job-v2-poscalc__input:disabled {
    color: var(--stone, #8E8679);
    cursor: not-allowed;
}

.job-v2-poscalc__row-del {
    background: transparent;
    border: none;
    padding: 4px 6px;
    border-radius: 6px;
    color: var(--stone, #8E8679);
    cursor: pointer;
    transition: background-color 120ms ease, color 120ms ease;
}

.job-v2-poscalc__row-del:hover:not(:disabled) {
    background: rgba(204, 51, 51, 0.08);
    color: #C33;
}

.job-v2-poscalc__row-del:disabled {
    opacity: 0.4;
    cursor: not-allowed;
}

.job-v2-poscalc__group-foot {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    border-top: 1px solid var(--hairline-soft, rgba(28, 25, 21, 0.05));
    background: rgba(245, 241, 232, 0.4);
}

.job-v2-poscalc__pricing {
    margin-bottom: 14px;
    max-height: 96px;
    opacity: 1;
    overflow: hidden;
    transform: translateY(0);
    visibility: visible;
    transition:
        max-height 0.2s ease,
        opacity 0.16s ease,
        margin-bottom 0.2s ease,
        transform 0.2s ease,
        visibility 0s linear 0s;
}

.job-v2-positions.is-position-grid .job-v2-poscalc__pricing,
.job-v2-positions.is-editor-collapsed .job-v2-poscalc__pricing {
    margin-bottom: 0;
    max-height: 0;
    opacity: 0;
    pointer-events: none;
    transform: translateY(-6px);
    visibility: hidden;
    transition:
        max-height 0.2s ease,
        opacity 0.14s ease,
        margin-bottom 0.2s ease,
        transform 0.2s ease,
        visibility 0s linear 0.2s;
}

@media (prefers-reduced-motion: reduce) {
    .job-v2-positions.is-position-grid .job-v2-poslist__grid-head,
    .job-v2-positions.is-editor-collapsed .job-v2-poslist__grid-head,
    .job-v2-positions.is-position-grid .job-v2-poslist__row,
    .job-v2-positions.is-editor-collapsed .job-v2-poslist__row,
    .job-v2-positions.is-position-grid .job-v2-poslist__grid-cell,
    .job-v2-positions.is-editor-collapsed .job-v2-poslist__grid-cell {
        animation: none;
    }

    .job-v2-poscalc__pricing,
    .job-v2-positions.is-position-grid .job-v2-poscalc__pricing,
    .job-v2-positions.is-editor-collapsed .job-v2-poscalc__pricing {
        transition: none;
    }
}


.job-v2-poscalc__mode {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px;
    border-radius: 999px;
    background: var(--paper-2, #F5F1E8);
    border: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    flex-wrap: wrap;
    justify-content: flex-end;
}

.job-v2-poscalc__mode-btn,
.job-v2-poscalc__mode-chip {
    border: 0;
    border-radius: 999px;
    padding: 6px 10px;
    background: transparent;
    color: var(--cx-text-secondary, #4A443C);
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
}

.job-v2-poscalc__mode-btn {
    cursor: pointer;
}

.job-v2-poscalc__mode-btn:disabled {
    cursor: not-allowed;
    opacity: 0.58;
}

.job-v2-poscalc__mode-btn.is-active,
.job-v2-poscalc__mode-chip.is-active {
    background: #fff;
    color: var(--copper, #B8601F);
    box-shadow: 0 1px 2px rgba(28, 25, 21, 0.08);
}

.job-v2-poscalc__pricing-grid {
    display: grid;
    grid-template-columns: minmax(90px, 0.7fr) minmax(84px, 0.6fr);
    gap: 10px;
    min-width: 0;
}

.job-v2-poscalc__field {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 10px 11px;
    border: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    border-radius: 8px;
    background: #fff;
}

.job-v2-poscalc__field:focus-within {
    border-color: var(--copper, #B8601F);
    box-shadow: 0 0 0 3px rgba(184, 96, 31, 0.10);
}

.job-v2-poscalc__field > span {
    font-size: 9.5px;
    font-family: var(--font-mono, ui-monospace, monospace);
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--stone, #8E8679);
}

.job-v2-poscalc__field input {
    width: 100%;
    border: 0;
    outline: none;
    background: transparent;
    color: var(--ink, #1C1915);
    font-family: var(--font-mono, ui-monospace, monospace);
    font-size: 16px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    min-width: 0;
}

.job-v2-poscalc__field input:disabled {
    cursor: not-allowed;
    opacity: 0.7;
}

.job-v2-poscalc__field-affix {
    display: flex;
    align-items: baseline;
    gap: 6px;
}

.job-v2-poscalc__field-affix span {
    color: var(--stone, #8E8679);
    font-weight: 700;
}

.job-v2-poscalc__field.is-readonly {
    background: var(--paper-2, #F5F1E8);
}

.job-v2-poscalc__field.is-readonly strong {
    color: var(--ink, #1C1915);
    font-family: var(--font-mono, ui-monospace, monospace);
    font-size: 16px;
    font-variant-numeric: tabular-nums;
}

.job-v2-poscalc__field.is-total strong {
    color: var(--copper, #B8601F);
}

@media (max-width: 980px) {
    .job-v2-poscalc__mode {
        justify-content: flex-start;
    }
}

.job-v2-poscalc__quick-actions {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin: 12px 0 16px;
}

.job-v2-poscalc__quick-action {
    justify-content: center;
    height: 38px;
    border-radius: 8px;
    font-weight: 800;
}

.job-v2-poscalc__quick-action.is-material {
    color: var(--copper, #B8601F);
    background: var(--copper-50, #FBEFE5);
    border-color: rgba(184, 96, 31, 0.20);
}

.job-v2-poscalc__quick-action.is-labor {
    color: var(--blue, #1F4A82);
    background: var(--blue-50, #EEF3FB);
    border-color: rgba(31, 74, 130, 0.18);
}

.job-v2-poscalc__quick-action.is-fixed {
    color: var(--success, #528464);
    background: rgba(82, 132, 100, 0.12);
    border-color: rgba(82, 132, 100, 0.18);
}

.job-v2-poscalc__section-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin: 18px 2px 9px;
    color: var(--stone, #8E8679);
    font-family: var(--font-mono, ui-monospace, monospace);
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
}

.job-v2-poscalc__rows {
    max-width: 100%;
    overflow-x: hidden;
    overflow-y: visible;
    background: #fff;
    border: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    border-radius: 10px;
}

.job-v2-poscalc__table--components .is-type {
    width: 52px;
}

.job-v2-poscalc__table--components .is-qty {
    width: 76px;
}

.job-v2-poscalc__table--components .is-unit {
    width: 64px;
}

.job-v2-poscalc__table--components .is-rate {
    width: 112px;
}

.job-v2-poscalc__table--components .is-markup {
    width: 72px;
}

.job-v2-poscalc__table--components .is-total {
    width: 116px;
}

.job-v2-poscalc__table--components .is-delete {
    width: 36px;
}

.job-v2-poscalc__table--components th {
    background: var(--paper-2, #F5F1E8);
    white-space: nowrap;
}

.job-v2-poscalc__table--components td,
.job-v2-poscalc__table--components th {
    border-right: 1px solid var(--hairline-soft, rgba(28, 25, 21, 0.05));
}

.job-v2-poscalc__table--components td:last-child,
.job-v2-poscalc__table--components th:last-child {
    border-right: 0;
}

.job-v2-poscalc__table--components tr.is-material:focus-within,
.job-v2-poscalc__table--components tr.is-material:hover {
    background: rgba(251, 239, 229, 0.62);
}

.job-v2-poscalc__table--components tr.is-labor:focus-within,
.job-v2-poscalc__table--components tr.is-labor:hover {
    background: rgba(238, 243, 251, 0.62);
}

.job-v2-poscalc__table--components tr.is-fixed:focus-within,
.job-v2-poscalc__table--components tr.is-fixed:hover {
    background: rgba(82, 132, 100, 0.08);
}

.job-v2-poscalc__type {
    width: 30px;
    height: 30px;
    border-radius: 8px;
    display: inline-grid;
    place-items: center;
    font-family: var(--font-mono, ui-monospace, monospace);
    font-weight: 900;
}

.job-v2-poscalc__type.is-material {
    color: var(--copper, #B8601F);
    background: var(--copper-50, #FBEFE5);
}

.job-v2-poscalc__type.is-labor {
    color: var(--blue, #1F4A82);
    background: var(--blue-50, #EEF3FB);
}

.job-v2-poscalc__type.is-fixed {
    color: var(--success, #528464);
    background: rgba(82, 132, 100, 0.12);
}

.job-v2-poscalc__row-meta {
    display: block;
    margin-top: 4px;
    overflow: hidden;
    color: var(--stone, #8E8679);
    font-family: var(--font-mono, ui-monospace, monospace);
    font-size: 11px;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.job-v2-poscalc__input.is-markup {
    color: var(--copper, #B8601F);
}

.job-v2-poscalc__dash {
    color: var(--stone, #8E8679);
    font-weight: 700;
}

.job-v2-poscalc__totals {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(100px, auto) minmax(130px, auto);
    align-items: end;
    gap: 10px;
    padding: 11px 14px;
    margin-top: 14px;
    background: #171512;
    border: 1px solid rgba(28, 25, 21, 0.18);
    border-radius: 10px;
    font-family: var(--font-mono, ui-monospace, monospace);
    font-variant-numeric: tabular-nums;
}

.job-v2-poscalc__totals.is-single-total {
    grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(160px, auto);
}

@container (max-width: 720px) {
    .job-v2-poscalc__table.is-editable td {
        padding: 5px 6px;
    }

    .job-v2-poscalc__table th {
        padding: 7px 6px;
    }

    .job-v2-poscalc__table--components .is-unit {
        display: none;
    }

    .job-v2-poscalc__table--components .is-type {
        width: 46px;
    }

    .job-v2-poscalc__table--components .is-qty {
        width: 66px;
    }

    .job-v2-poscalc__table--components .is-rate {
        width: 92px;
    }

    .job-v2-poscalc__table--components .is-markup {
        width: 62px;
    }

    .job-v2-poscalc__table--components .is-total {
        width: 96px;
    }

    .job-v2-poscalc__table--components .is-delete {
        width: 32px;
    }

    .job-v2-poscalc__input {
        padding: 4px 5px;
        font-size: 12px;
    }
}

@container (max-width: 560px) {
    .job-v2-poscalc__quickadd {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: center;
        gap: 7px;
        padding: 8px;
    }

    .job-v2-poscalc__quickadd > i {
        display: none;
    }

    .job-v2-poscalc__quickadd-input {
        grid-column: 1 / -1;
        width: 100%;
        padding: 2px 4px 5px;
    }

    .job-v2-poscalc__quickadd .btn {
        min-width: 0;
        justify-content: center;
        height: 34px;
        padding-inline: 10px;
        white-space: nowrap;
    }

    .job-v2-poscalc__quickadd-submit {
        grid-column: 1;
    }

    .job-v2-poscalc__quickadd-catalog {
        grid-column: 2;
    }

    .job-v2-poscalc__totals {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .job-v2-poscalc__totals-cell.is-ep,
    .job-v2-poscalc__totals-cell.is-total {
        grid-column: 1 / -1;
        margin-left: 0;
        text-align: left;
    }
}

@container (max-width: 430px) {
    .job-v2-poscalc__quick-actions {
        grid-template-columns: 1fr;
    }
}

@container (max-width: 380px) {
    .job-v2-poscalc__quickadd {
        grid-template-columns: 1fr;
    }

    .job-v2-poscalc__quickadd-submit,
    .job-v2-poscalc__quickadd-catalog {
        grid-column: 1;
    }

    .job-v2-poscalc__totals {
        grid-template-columns: 1fr;
    }

    .job-v2-poscalc__totals-cell.is-total .job-v2-poscalc__totals-value {
        font-size: 19px;
    }
}

.job-v2-poscalc__totals-cell {
    display: flex;
    flex-direction: column;
    gap: 5px;
    min-width: 0;
}

.job-v2-poscalc__totals-label {
    font-size: 9px;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: rgba(255, 255, 255, 0.62);
    font-weight: 700;
}

.job-v2-poscalc__totals-value {
    font-size: 13px;
    font-weight: 700;
    color: rgba(255, 255, 255, 0.74);
}

.job-v2-poscalc__totals-cell.is-ep {
    text-align: right;
}

.job-v2-poscalc__totals-cell.is-ep .job-v2-poscalc__totals-value {
    font-size: 15px;
    color: rgba(255, 255, 255, 0.82);
}

.job-v2-poscalc__totals-cell.is-total {
    padding: 0;
    border-radius: 0;
    background: transparent;
    border: 0;
    text-align: right;
}

.job-v2-poscalc__totals-cell.is-total .job-v2-poscalc__totals-value {
    color: #fff;
    font-size: 22px;
    line-height: 1;
}

.job-v2-poscalc__totals-op {
    font-size: 18px;
    font-weight: 600;
    color: var(--stone, #8E8679);
}

.job-v2-poscalc__totals-markup {
    display: flex;
    align-items: center;
    gap: 4px;
}

/* Dedicated markup % input — wider, visually distinct from ambient text */
.job-v2-poscalc__markup-input {
    width: 5rem;
    padding: 4px 8px;
    font-size: 14px;
    font-weight: 700;
    color: var(--ink, #1C1915);
    background: #fff;
    border-color: var(--hairline, rgba(28, 25, 21, 0.12)) !important;
}

/* Hide browser spinners — user types the value or uses keyboard */
.job-v2-poscalc__markup-input::-webkit-outer-spin-button,
.job-v2-poscalc__markup-input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
.job-v2-poscalc__markup-input[type=number] {
    -moz-appearance: textfield;
}

.job-v2-poscalc__totals-unit {
    font-size: 13px;
    font-weight: 700;
    color: var(--ink, #1C1915);
    font-family: var(--font-mono, ui-monospace, monospace);
    user-select: none;
}

.job-v2-poscalc__table tr.is-legacy td {
    background: rgba(245, 241, 232, 0.55);
    color: var(--cx-text-secondary, #4A443C);
}

.job-v2-poscalc__legacy-tag {
    display: inline-block;
    font-size: 9.5px;
    font-family: var(--font-mono, ui-monospace, monospace);
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    padding: 2px 6px;
    margin-right: 8px;
    border-radius: 4px;
    background: rgba(28, 25, 21, 0.08);
    color: var(--stone, #8E8679);
    vertical-align: middle;
}

/* ─── Kalkulation: Schnell hinzufügen (regex quick-add) ─── */
.job-v2-poscalc__quickadd {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    margin: 0 0 14px 0;
    background: #fff;
    border: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    border-radius: 10px;
    transition: border-color 0.12s ease, box-shadow 0.12s ease;
}

.job-v2-poscalc__quickadd:focus-within {
    border-color: var(--copper, #B8601F);
    box-shadow: 0 0 0 3px rgba(184, 96, 31, 0.12);
}

.job-v2-poscalc__quickadd.is-invalid {
    border-color: var(--danger, #9A3B33);
    box-shadow: 0 0 0 3px rgba(154, 59, 51, 0.12);
}

.job-v2-poscalc__quickadd > i {
    color: var(--copper, #B8601F);
    font-size: 14px;
    flex-shrink: 0;
}

.job-v2-poscalc__quickadd-input {
    flex: 1;
    border: 0;
    outline: none;
    background: transparent;
    font-family: inherit;
    font-size: 13.5px;
    color: var(--ink, #1C1915);
    padding: 4px 0;
    min-width: 0;
}

.job-v2-poscalc__quickadd-input::placeholder {
    color: var(--cx-text-muted, #8E8679);
}

.job-v2-poscalc__quickadd-submit,
.job-v2-poscalc__quickadd-catalog {
    flex: 0 0 auto;
}

.job-v2-poscalc__quickadd-hint {
    margin: -8px 0 14px 0;
    font-size: 12px;
    color: var(--danger, #9A3B33);
    padding-left: 12px;
}

@container (max-width: 620px) {
    .job-v2-poscalc__totals .job-v2-poscalc__totals-cell.is-ep,
    .job-v2-poscalc__totals .job-v2-poscalc__totals-cell.is-total {
        grid-column: 1 / -1;
        margin-left: 0;
        text-align: left;
    }
}

@container (max-width: 460px) {
    .job-v2-poscalc__totals .job-v2-poscalc__totals-cell.is-total .job-v2-poscalc__totals-value {
        font-size: 20px;
    }
}

/* ─── Kalkulation: selling-price strip (Verkaufspreis vs Kalkulation) ─── */
.job-v2-poscalc__price {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-top: 10px;
    padding: 10px 14px;
    border: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    border-radius: 10px;
    background: var(--paper-2, #F5F1E8);
}

.job-v2-poscalc__price.is-divergent {
    border-color: rgba(184, 96, 31, 0.32);
    background: var(--copper-50, #FBEFE5);
}

.job-v2-poscalc__price-row {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.job-v2-poscalc__price-label {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--cx-text-secondary, #4A443C);
}

.job-v2-poscalc__price-value {
    font-size: 14px;
    font-weight: 600;
    color: var(--ink, #1C1915);
    font-variant-numeric: tabular-nums;
}

.job-v2-poscalc__price-value.is-strong {
    font-size: 16px;
    color: var(--copper, #B8601F);
}

.job-v2-poscalc__price-value .dim {
    color: var(--cx-text-muted, #8E8679);
    font-weight: 400;
    font-size: 11.5px;
}

.job-v2-poscalc__price-spacer {
    flex: 1;
}

.job-v2-poscalc__price-action {
    display: flex;
    align-items: center;
    gap: 12px;
    padding-top: 6px;
    border-top: 1px dashed rgba(28, 25, 21, 0.10);
}

.job-v2-poscalc__price-hint {
    flex: 1;
    font-size: 12px;
    color: var(--cx-text-secondary, #4A443C);
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.job-v2-poscalc__price-hint i {
    color: var(--copper, #B8601F);
}

.job-v2-poscalc__price-hint strong {
    color: var(--ink, #1C1915);
    font-variant-numeric: tabular-nums;
}

/* ==========================================================================
   Details sub-tab — port of polished mockup V7Details (240px rail + form)
   ========================================================================== */

.job-v2-details {
    display: grid;
    grid-template-columns: 240px 1fr;
    height: 100%;
    min-height: 480px;
    background: var(--paper, #ffffff);
}

.job-v2-details__rail {
    border-right: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    background: var(--paper, #ffffff);
    padding: 14px 8px;
    display: flex;
    flex-direction: column;
    gap: 1px;
    overflow-y: auto;
}

.job-v2-details__pill {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    text-align: left;
    background: transparent;
    border: none;
    border-radius: 8px;
    padding: 9px 12px;
    font-size: 13px;
    font-family: inherit;
    font-weight: 500;
    color: var(--walnut, #4A443C);
    cursor: pointer;
    transition: background 0.12s ease, color 0.12s ease;
}

.job-v2-details__pill:hover {
    background: var(--sand, #F5EFE6);
}

.job-v2-details__pill.is-active {
    background: var(--copper-50, rgba(184, 96, 31, 0.10));
    color: var(--copper, #B8601F);
    font-weight: 700;
}

.job-v2-details__pill > i {
    font-size: 14px;
    width: 16px;
    text-align: center;
}

.job-v2-details__pane {
    overflow-y: auto;
    padding: 24px 32px 48px;
    max-width: 920px;
}

.job-v2-details__head {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 18px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--hairline-soft, rgba(28, 25, 21, 0.05));
}

.job-v2-details__head > i {
    font-size: 16px;
    color: var(--copper, #B8601F);
}

.job-v2-details__head h2 {
    margin: 0;
    font-family: var(--font-display, "Bricolage Grotesque", sans-serif);
    font-size: 20px;
    font-weight: 800;
    letter-spacing: -0.02em;
    color: var(--ink, #1C1915);
}

.job-v2-details__grid-2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
}

.job-v2-details__field {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.job-v2-details__field.is-full {
    grid-column: 1 / -1;
}

.job-v2-details__field > label {
    font-family: var(--font-mono, "JetBrains Mono", monospace);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--stone, #8E8679);
}

.job-v2-details__field > input,
.job-v2-details__field > select,
.job-v2-details__field > textarea {
    width: 100%;
    background: #ffffff;
    border: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    border-radius: 6px;
    padding: 8px 11px;
    font-size: 13px;
    font-family: inherit;
    color: var(--ink, #1C1915);
    outline: none;
    transition: border-color 0.12s ease, box-shadow 0.12s ease;
}

.job-v2-details__field > textarea {
    line-height: 1.5;
    resize: vertical;
    padding: 10px 12px;
}

.job-v2-details__field > input:focus,
.job-v2-details__field > select:focus,
.job-v2-details__field > textarea:focus {
    border-color: var(--copper, #B8601F);
    box-shadow: 0 0 0 2px rgba(184, 96, 31, 0.15);
}

.job-v2-details__field > input:disabled,
.job-v2-details__field > select:disabled,
.job-v2-details__field > textarea:disabled {
    background: var(--paper-2, #FAF7F2);
    color: var(--walnut, #4A443C);
    cursor: not-allowed;
}

.job-v2-details__hint {
    font-size: 11px;
    color: var(--stone, #8E8679);
    margin-top: 2px;
}

/* Document address preview — mirrors the recipient block as it prints on
   quotes/order confirmations/invoices (name in bold, address lines below). */
.job-v2-details__doc-preview {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-height: 92px;
    background: var(--paper-2, #FAF7F2);
    border: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    border-left: 3px solid var(--copper, #B8601F);
    border-radius: 6px;
    padding: 12px 14px;
    font-size: 13px;
    line-height: 1.5;
    color: var(--walnut, #4A443C);
}

.job-v2-details__doc-preview-name {
    font-weight: 700;
    color: var(--ink, #1C1915);
}

.job-v2-details__doc-preview-empty {
    color: var(--stone, #8E8679);
    font-style: italic;
}

/* Shared AddressInputGroup (Arbeitsort + Rechnungsadresse) needs breathing room
   against the preceding field grid — its own root carries no outer margin. */
.job-v2-details .address-input-group {
    margin-top: 14px;
}

.job-v2-details__notice {
    margin-top: 14px;
    padding: 12px 14px;
    background: var(--paper-2, #FAF7F2);
    border: 1px dashed var(--hairline-strong, rgba(28, 25, 21, 0.18));
    border-radius: 10px;
    font-size: 12px;
    color: var(--walnut, #4A443C);
    display: flex;
    align-items: center;
    gap: 8px;
}

.job-v2-details__notice > i {
    color: var(--info, #1F4A82);
}

/* Valid clock-in-location badge on the Objekt & Arbeitsort section: tells the
   office whether an assigned job-site can act as a Zeiterfassung-v2 geofence. */
.job-v2-details__geobadge {
    margin-top: 14px;
    padding: 12px 14px;
    border: 1px solid transparent;
    border-radius: 10px;
    font-size: 12px;
    line-height: 1.45;
    display: flex;
    align-items: center;
    gap: 8px;
}

.job-v2-details__geobadge > i {
    flex-shrink: 0;
    font-size: 14px;
}

.job-v2-details__geobadge.is-valid {
    background: color-mix(in srgb, var(--success, #528464) 9%, transparent);
    border-color: color-mix(in srgb, var(--success, #528464) 28%, transparent);
    color: var(--success, #528464);
}

.job-v2-details__geobadge.is-warn {
    background: color-mix(in srgb, var(--warning, #A97514) 9%, transparent);
    border-color: color-mix(in srgb, var(--warning, #A97514) 28%, transparent);
    color: var(--warning, #A97514);
}

/* Customer card on the Kunde section */
.job-v2-details__card {
    background: #ffffff;
    border: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    border-radius: 12px;
    padding: 18px;
    margin-bottom: 18px;
}

.job-v2-details__customer-row {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 16px;
}

.job-v2-details__customer-avatar {
    width: 48px;
    height: 48px;
    border-radius: 10px;
    background: var(--info, #1F4A82);
    color: #ffffff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 16px;
    letter-spacing: 0.02em;
    flex-shrink: 0;
}

.job-v2-details__customer-meta {
    flex: 1;
    min-width: 0;
}

.job-v2-details__customer-name {
    font-family: var(--font-display, "Bricolage Grotesque", sans-serif);
    font-size: 18px;
    font-weight: 800;
    color: var(--ink, #1C1915);
    letter-spacing: -0.015em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.job-v2-details__customer-sub {
    font-size: 12px;
    color: var(--stone, #8E8679);
    margin-top: 2px;
}

.job-v2-details__btn-outline {
    background: #ffffff;
    border: 1px solid var(--hairline-strong, rgba(28, 25, 21, 0.18));
    border-radius: 999px;
    padding: 6px 14px;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--ink, #1C1915);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-family: inherit;
    transition: background 0.12s ease, border-color 0.12s ease;
}

.job-v2-details__btn-outline:hover:not(:disabled) {
    background: var(--sand, #F5EFE6);
    border-color: var(--copper, #B8601F);
}

.job-v2-details__btn-outline:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Service-Optionen toggles */
.job-v2-details__toggles {
    display: grid;
    gap: 10px;
    max-width: 640px;
}

.job-v2-details__toggle {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    background: #ffffff;
    border: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    border-radius: 10px;
    cursor: pointer;
    font-family: inherit;
    text-align: left;
    transition: border-color 0.12s ease, box-shadow 0.12s ease;
}

.job-v2-details__toggle:hover:not(:disabled) {
    border-color: var(--hairline-strong, rgba(28, 25, 21, 0.18));
}

.job-v2-details__toggle:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

.job-v2-details__toggle-track {
    width: 36px;
    height: 20px;
    border-radius: 999px;
    background: var(--sand, #F5EFE6);
    position: relative;
    flex-shrink: 0;
    transition: background 0.15s ease;
}

.job-v2-details__toggle.is-on .job-v2-details__toggle-track {
    background: var(--copper, #B8601F);
}

.job-v2-details__toggle-thumb {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: #ffffff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
    transition: left 0.15s ease;
}

.job-v2-details__toggle.is-on .job-v2-details__toggle-thumb {
    left: 18px;
}

.job-v2-details__toggle-body {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.job-v2-details__toggle-label {
    font-size: 13.5px;
    font-weight: 600;
    color: var(--ink, #1C1915);
}

.job-v2-details__toggle-desc {
    font-size: 11.5px;
    color: var(--stone, #8E8679);
    margin-top: 1px;
}

@media (max-width: 960px) {
    .job-v2-details {
        grid-template-columns: 1fr;
    }
    .job-v2-details__rail {
        flex-direction: row;
        overflow-x: auto;
        border-right: none;
        border-bottom: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
        padding: 8px;
    }
    .job-v2-details__pill {
        flex: 0 0 auto;
        white-space: nowrap;
    }
    .job-v2-details__grid-2 {
        grid-template-columns: 1fr;
    }
}

/* ── Geplante Termine card on Zeitplanung section ───────────────────── */

.job-v2-details__termine {
    margin-top: 24px;
    background: #ffffff;
    border: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    border-radius: 12px;
    padding: 16px 18px;
}

.job-v2-details__termine-head {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
}

.job-v2-details__termine-eyebrow {
    font-family: var(--font-mono, "JetBrains Mono", monospace);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--stone, #8E8679);
}

.job-v2-details__termine-count {
    font-size: 11px;
    color: var(--walnut, #4A443C);
    background: var(--sand, #F5EFE6);
    padding: 1px 7px;
    border-radius: 999px;
    font-weight: 600;
}

.job-v2-details__termine-row {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 0;
    border-bottom: 1px solid var(--hairline-soft, rgba(28, 25, 21, 0.05));
}

.job-v2-details__termine-row:last-child {
    border-bottom: none;
}

.job-v2-details__termine-date {
    width: 64px;
    text-align: center;
    font-family: var(--font-mono, "JetBrains Mono", monospace);
    font-size: 11px;
    font-weight: 700;
    color: var(--walnut, #4A443C);
}

.job-v2-details__termine-date.is-current {
    color: var(--copper, #B8601F);
}

.job-v2-details__termine-body {
    flex: 1;
    min-width: 0;
}

.job-v2-details__termine-label {
    font-size: 13px;
    font-weight: 600;
    color: var(--ink, #1C1915);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.job-v2-details__termine-time {
    font-size: 11px;
    color: var(--stone, #8E8679);
    margin-top: 1px;
}

.job-v2-details__termine-avatar {
    width: 26px;
    height: 26px;
    border-radius: 6px;
    color: #ffffff;
    font-size: 10.5px;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    letter-spacing: 0.02em;
    flex-shrink: 0;
}

.job-v2-details__termine-pill {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 3px 8px;
    border-radius: 999px;
    background: var(--copper-50, rgba(184, 96, 31, 0.10));
    color: var(--copper, #B8601F);
    font-size: 11px;
    font-weight: 600;
    flex-shrink: 0;
}

.job-v2-details__termine-pill .dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--copper, #B8601F);
    box-shadow: 0 0 0 3px rgba(184, 96, 31, 0.15);
}

.job-v2-details__termine-empty {
    font-size: 12.5px;
    color: var(--stone, #8E8679);
    padding: 6px 0;
}

.job-v2-details__termine-empty a {
    color: var(--copper, #B8601F);
    text-decoration: none;
}

.job-v2-details__termine-empty a:hover {
    text-decoration: underline;
}

/* "Termin hinzufügen" action, pushed to the right of the section header. */
.job-v2-details__termine-add {
    margin-left: auto;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 10px;
    border: 1px solid var(--copper, #B8601F);
    border-radius: 8px;
    background: transparent;
    color: var(--copper, #B8601F);
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.12s ease, color 0.12s ease;
}

.job-v2-details__termine-add:hover {
    background: var(--copper, #B8601F);
    color: #ffffff;
}

/* Editable rows get a pointer + hover wash and a trailing chevron. */
.job-v2-details__termine-row.is-clickable {
    cursor: pointer;
    border-radius: 8px;
    margin: 0 -8px;
    padding-left: 8px;
    padding-right: 8px;
    transition: background 0.12s ease;
}

.job-v2-details__termine-row.is-clickable:hover {
    background: var(--paper-2, #FAF7F2);
}

.job-v2-details__termine-chevron {
    color: var(--stone, #8E8679);
    font-size: 13px;
    flex-shrink: 0;
}

.job-v2-details__termine-foot {
    margin-top: 12px;
    padding-top: 10px;
    border-top: 1px solid var(--hairline-soft, rgba(28, 25, 21, 0.05));
    font-size: 12px;
    color: var(--stone, #8E8679);
}

.job-v2-details__termine-foot a {
    color: var(--copper, #B8601F);
    text-decoration: none;
}

.job-v2-details__termine-foot a:hover {
    text-decoration: underline;
}

/* "In Vorbereitung" notice for not-yet-wired metadata fields. */
.job-v2-details__pending {
    margin-bottom: 14px;
    padding: 10px 12px;
    background: var(--paper-2, #FAF7F2);
    border: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    border-left: 3px solid var(--warning, #A97514);
    border-radius: 8px;
    font-size: 12px;
    color: var(--walnut, #4A443C);
    line-height: 1.5;
    display: flex;
    align-items: flex-start;
    gap: 8px;
}

.job-v2-details__pending > i {
    color: var(--warning, #A97514);
    margin-top: 2px;
    flex-shrink: 0;
}

/* Inline employee picker on the Übersicht > Zugewiesen card. */
.job-v2-assignee__avatar.size-sm { width: 24px; height: 24px; font-size: 10px; }

.job-v2-assignee__remove {
    background: transparent;
    border: none;
    border-radius: 6px;
    width: 26px;
    height: 26px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--cx-text-muted, #8E8679);
    cursor: pointer;
    flex-shrink: 0;
    transition: background 0.12s ease, color 0.12s ease;
}

.job-v2-assignee__remove:hover:not(:disabled) {
    background: var(--sand, #F5EFE6);
    color: var(--danger, #9A3B33);
}

.job-v2-assignee__remove:disabled { opacity: 0.4; cursor: not-allowed; }

.job-v2-assignee-picker {
    margin-top: 10px;
    background: #ffffff;
    border: 1px solid var(--hairline-strong, rgba(28, 25, 21, 0.18));
    border-radius: 10px;
    box-shadow: 0 8px 24px rgba(28, 25, 21, 0.12);
    overflow: hidden;
}

.job-v2-assignee-picker__head {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    border-bottom: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    background: var(--paper-2, #FAF7F2);
}

.job-v2-assignee-picker__head > i {
    color: var(--cx-text-muted, #8E8679);
    font-size: 13px;
}

.job-v2-assignee-picker__head > input {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 13px;
    font-family: inherit;
    color: var(--ink, #1C1915);
}

.job-v2-assignee-picker__list {
    max-height: 240px;
    overflow-y: auto;
}

.job-v2-assignee-picker__row {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 8px 12px;
    background: transparent;
    border: none;
    border-bottom: 1px solid var(--hairline-soft, rgba(28, 25, 21, 0.05));
    text-align: left;
    cursor: pointer;
    font-family: inherit;
    transition: background 0.1s ease;
}

.job-v2-assignee-picker__row:last-child {
    border-bottom: none;
}

.job-v2-assignee-picker__row:hover:not(:disabled) {
    background: var(--copper-50, rgba(184, 96, 31, 0.10));
}

.job-v2-assignee-picker__row.is-selected {
    background: var(--copper-50, rgba(184, 96, 31, 0.10));
    cursor: default;
}

.job-v2-assignee-picker__row:disabled:not(.is-selected) {
    opacity: 0.5;
    cursor: not-allowed;
}

.job-v2-assignee-picker__name {
    flex: 1;
    font-size: 13px;
    color: var(--ink, #1C1915);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.job-v2-assignee-picker__empty {
    padding: 16px 12px;
    text-align: center;
    font-size: 12px;
    color: var(--cx-text-muted, #8E8679);
}

/* Small lock icon next to the Positionen count when editing is disabled.
   Hover reveals the full status-specific reason via the title attribute. */
.job-v2-poslist__lock {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    color: var(--copper, #B8601F);
    cursor: help;
}

.job-v2-poslist__lock > i {
    font-size: 12px;
}

/* "+ Position hinzufügen" disabled-but-clickable styling so the parent
   surfaces a toast explaining why, instead of an unresponsive button. */
.job-v2-poslist__add-wrap.is-locked .job-v2-poslist__add,
.job-v2-poslist__add-wrap.is-locked .job-v2-poslist__add-arrow {
    cursor: not-allowed;
    opacity: 0.55;
    color: var(--cx-text-muted, #8E8679);
}

.job-v2-poslist__add-wrap.is-locked .job-v2-poslist__add:hover,
.job-v2-poslist__add-wrap.is-locked .job-v2-poslist__add-arrow:hover {
    background: transparent;
    border-color: var(--hairline-strong, rgba(28, 25, 21, 0.14));
}

/* Position editor lock affordances — small lock icon on the POS tag,
   each sub-tab, and a 'Gesperrt' pill in place of the saved indicator. */

.job-v2-poseditor__pos-tag.is-locked {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    opacity: 0.85;
}

.job-v2-poseditor__pos-tag.is-locked > i.bi-lock-fill {
    font-size: 10px;
    color: var(--copper, #B8601F);
}

.job-v2-poseditor__sub-tab.is-locked {
    opacity: 0.65;
    cursor: pointer; /* still clickable to switch tabs, just visually muted */
}

.job-v2-poseditor__sub-tab-lock {
    font-size: 9px;
    margin-left: 4px;
    color: var(--copper, #B8601F);
    opacity: 0.8;
}

.job-v2-poseditor__locked-pill {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 3px 9px;
    border-radius: 999px;
    background: var(--copper-50, rgba(184, 96, 31, 0.10));
    color: var(--copper, #B8601F);
    font-size: 11.5px;
    font-weight: 600;
    cursor: help;
}

.job-v2-poseditor__locked-pill > i {
    font-size: 11px;
}

/* Multi-employee Zugewiesen card — promote-to-primary star + count badge. */
.job-v2-card__count {
    margin-left: auto;
    font-size: 11px;
    color: var(--walnut, #4A443C);
    background: var(--sand, #F5EFE6);
    padding: 1px 8px;
    border-radius: 999px;
    font-weight: 600;
}

.job-v2-assignee__star {
    background: transparent;
    border: none;
    border-radius: 6px;
    width: 26px;
    height: 26px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--cx-text-muted, #8E8679);
    cursor: pointer;
    flex-shrink: 0;
    transition: background 0.12s ease, color 0.12s ease;
}

.job-v2-assignee__star:hover:not(:disabled) {
    background: var(--copper-50, rgba(184, 96, 31, 0.10));
    color: var(--copper, #B8601F);
}

.job-v2-assignee__star:disabled { opacity: 0.4; cursor: not-allowed; }

/* ==========================================================================
   Document-generation overlay — full-screen block shown while a PDF /
   Angebot / Rechnung is being rendered. Mirrors the V1 'Drucken' overlay
   but uses the warm carpenter palette + a copper spinner.
   ========================================================================== */

.cx-doc-overlay {
    position: fixed;
    inset: 0;
    z-index: 1090;
    background: rgba(28, 25, 21, 0.45);
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
    display: flex;
    align-items: center;
    justify-content: center;
    animation: cx-doc-overlay-in 160ms ease-out;
}

@keyframes cx-doc-overlay-in {
    from { opacity: 0; }
    to   { opacity: 1; }
}

.cx-doc-overlay__card {
    background: var(--paper, #ffffff);
    border-radius: 16px;
    padding: 32px 40px;
    text-align: center;
    box-shadow:
        0 1px 2px rgba(28, 25, 21, 0.04),
        0 24px 64px rgba(28, 25, 21, 0.25);
    border: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    min-width: 280px;
    max-width: 420px;
}

.cx-doc-overlay__spinner {
    width: 48px;
    height: 48px;
    margin: 0 auto 14px;
    border: 4px solid var(--sand, #F5EFE6);
    border-top-color: var(--copper, #B8601F);
    border-radius: 50%;
    animation: cx-doc-overlay-spin 900ms linear infinite;
    box-sizing: border-box;
    flex-shrink: 0;
}

/* When the spinner ships inside a button or compact inline label,
   strip the block-style margins/auto-centering meant for the overlay
   variant so it aligns flush with adjacent text. */
.btn .cx-doc-overlay__spinner,
.cx-versenden__preview-empty .cx-doc-overlay__spinner {
    margin: 0;
    border-width: 2px;
    display: inline-block;
    vertical-align: middle;
}

@keyframes cx-doc-overlay-spin {
    to { transform: rotate(360deg); }
}

.cx-doc-overlay__title {
    font-family: var(--font-display, "Bricolage Grotesque", sans-serif);
    font-size: 16px;
    font-weight: 700;
    color: var(--ink, #1C1915);
    letter-spacing: -0.01em;
}

.cx-doc-overlay__hint {
    font-size: 12.5px;
    color: var(--walnut, #4A443C);
    margin-top: 4px;
}

@media (prefers-reduced-motion: reduce) {
    .cx-doc-overlay__spinner { animation-duration: 2400ms; }
    .cx-doc-overlay { animation: none; }
}

/* ==========================================================================
   Document send — unified document send dialog (custom modal, no SfDialog)
   ========================================================================== */

.cx-modal-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1100;
    background: rgba(28, 25, 21, 0.45);
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
    animation: cx-modal-backdrop-in 160ms ease-out;
}

@keyframes cx-modal-backdrop-in {
    from { opacity: 0; }
    to   { opacity: 1; }
}

.cx-modal {
    position: fixed;
    z-index: 1101;
    top: 3vh;
    left: 50%;
    transform: translateX(-50%);
    width: min(1380px, 96vw);
    height: 94vh;
    background: var(--paper, #FAF7F2);
    border-radius: 16px;
    box-shadow:
        0 1px 2px rgba(28, 25, 21, 0.06),
        0 32px 80px rgba(28, 25, 21, 0.32);
    border: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    display: flex;
    flex-direction: column;
    overflow: hidden;
    animation: cx-modal-in 220ms cubic-bezier(0.34, 1.36, 0.45, 1);
}

@keyframes cx-modal-in {
    from { opacity: 0; transform: translateX(-50%) translateY(8px) scale(0.98); }
    to   { opacity: 1; transform: translateX(-50%) translateY(0) scale(1); }
}

@media (prefers-reduced-motion: reduce) {
    .cx-modal { animation: none; }
    .cx-modal-backdrop { animation: none; }
}

/* ── Document send — header strip ─────────────────────────────────────── */
.cx-versenden__header {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 20px 24px 18px;
    background: #fff;
    border-bottom: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    flex-shrink: 0;
}

.cx-versenden__header-icon {
    width: 44px; height: 44px;
    border-radius: 10px;
    display: grid; place-items: center;
    background: var(--copper, #B8601F);
    color: #fff;
    flex-shrink: 0;
}
.cx-versenden__header-icon .bi { font-size: 20px; }

.cx-versenden__header-text { flex: 1 1 auto; min-width: 0; }

.cx-versenden__crumbs {
    display: flex; align-items: center; gap: 6px;
    font-size: 12px;
    color: var(--cx-text-secondary, #4A443C);
    margin-bottom: 2px;
}
.cx-versenden__crumbs .sep { color: var(--stone, #8E8679); }
.cx-versenden__crumbs .num {
    font-family: var(--font-mono, ui-monospace, monospace);
    color: var(--stone, #8E8679);
}

.cx-versenden__title {
    font-family: var(--font-display, "Bricolage Grotesque", sans-serif);
    font-size: 22px;
    font-weight: 700;
    line-height: 1.15;
    color: var(--ink, #1C1915);
    letter-spacing: -0.01em;
    margin: 0 0 4px;
}

.cx-versenden__meta {
    display: flex; align-items: center; gap: 8px;
    font-size: 12.5px;
    color: var(--cx-text-secondary, #4A443C);
    flex-wrap: wrap;
}
.cx-versenden__meta .sep { color: var(--stone, #8E8679); }

.cx-versenden__close {
    flex-shrink: 0;
    width: 36px; height: 36px;
    background: transparent;
    border: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    border-radius: 8px;
    color: var(--ink, #1C1915);
    cursor: pointer;
    display: grid; place-items: center;
    transition: background 0.15s ease, border-color 0.15s ease;
}
.cx-versenden__close:hover { background: var(--sand, #F4F0E8); border-color: var(--hairline-strong, rgba(28, 25, 21, 0.14)); }

/* ── Document send — timeline strip (sits inline in the header) ─────── */
.cx-versenden__timeline {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 1;
    flex-wrap: wrap;
    justify-content: flex-end;
    max-width: 55%;
    overflow-x: auto;
}

.cx-versenden__pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    background: #fff;
    border: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    border-radius: 999px;
    font-size: 11.5px;
    color: var(--ink, #1C1915);
    cursor: pointer;
    flex-shrink: 0;
    transition: background 0.15s ease, border-color 0.15s ease, transform 0.15s ease;
    font-family: inherit;
}
.cx-versenden__pill:hover { background: var(--sand, #F4F0E8); border-color: var(--hairline-strong, rgba(28, 25, 21, 0.14)); }

.cx-versenden__pill.is-active {
    background: rgba(184, 96, 31, 0.08);
    border-color: rgba(184, 96, 31, 0.22);
    box-shadow: 0 0 0 2px rgba(184, 96, 31, 0.12);
}

.cx-versenden__pill.is-superseded { opacity: 0.5; }

.cx-versenden__pill-type { font-weight: 600; }
.cx-versenden__pill-num {
    font-family: var(--font-mono, ui-monospace, monospace);
    color: var(--stone, #8E8679);
    font-size: 11px;
}
.cx-versenden__pill-status {
    font-size: 10.5px;
    color: var(--cx-text-secondary, #4A443C);
    padding: 2px 6px;
    border-radius: 999px;
    background: var(--sand, #F4F0E8);
}
.cx-versenden__pill.tone-success .cx-versenden__pill-status { background: rgba(63, 125, 91, 0.12); color: var(--patina, #3F7D5B); }
.cx-versenden__pill.tone-warning .cx-versenden__pill-status { background: rgba(169, 117, 20, 0.12); color: var(--ochre, #A97514); }
.cx-versenden__pill.tone-danger  .cx-versenden__pill-status { background: rgba(154, 59, 51, 0.12); color: var(--rust, #9A3B33); }

/* ── Document send — readiness alert ──────────────────────────────────── */
.cx-versenden__alert {
    display: flex; gap: 10px;
    padding: 12px 16px;
    margin: 12px 24px 0;
    border-radius: 10px;
    border: 1px solid;
}
.cx-versenden__alert.tone-danger {
    background: rgba(154, 59, 51, 0.06);
    border-color: rgba(154, 59, 51, 0.22);
    color: var(--rust, #9A3B33);
}
.cx-versenden__alert .bi { font-size: 18px; flex-shrink: 0; margin-top: 1px; }
.cx-versenden__alert strong { display: block; font-size: 13px; margin-bottom: 2px; }
.cx-versenden__alert ul { margin: 0; padding-left: 18px; font-size: 12.5px; }

/* ── Document send — body (preview + sidebar) ─────────────────────────── */
.cx-versenden__body {
    flex: 1 1 auto;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 400px;
    gap: 0;
    overflow: hidden;
    min-height: 0;
    background: var(--paper, #FAF7F2);
}

.cx-versenden__preview {
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
    background: #fff;
    border-right: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
}

.cx-versenden__preview-context {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    border-bottom: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    background: linear-gradient(180deg, #fff 0%, var(--paper, #FAF7F2) 100%);
    color: var(--cx-text-secondary, #4A443C);
    min-width: 0;
    z-index: 1;
}

.cx-versenden__preview-context-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 10px;
    background: var(--sand, #F4F0E8);
    color: var(--stone, #8E8679);
    flex-shrink: 0;
}

.cx-versenden__preview-context-copy {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.cx-versenden__preview-context-copy strong {
    color: var(--ink, #1C1915);
    font-size: 13px;
    line-height: 1.15;
}

.cx-versenden__preview-context-copy span {
    font-size: 11.5px;
    line-height: 1.25;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.cx-versenden__preview-context-doc {
    justify-self: end;
    max-width: 260px;
    padding: 5px 9px;
    border-radius: 999px;
    border: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    background: #fff;
    color: var(--ink, #1C1915);
    font-family: var(--font-mono, ui-monospace, monospace);
    font-size: 11px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.cx-versenden__preview-context.is-pdf {
    background: linear-gradient(180deg, rgba(63, 125, 91, 0.08) 0%, #fff 100%);
}

.cx-versenden__preview-context.is-pdf .cx-versenden__preview-context-icon {
    background: rgba(63, 125, 91, 0.12);
    color: var(--patina, #3F7D5B);
}

.cx-versenden__preview-context.is-live {
    background: linear-gradient(180deg, rgba(184, 96, 31, 0.08) 0%, #fff 100%);
}

.cx-versenden__preview-context.is-live .cx-versenden__preview-context-icon {
    background: rgba(184, 96, 31, 0.12);
    color: var(--copper, #B8601F);
}

.cx-versenden__preview-context.is-error .cx-versenden__preview-context-icon {
    background: rgba(154, 59, 51, 0.12);
    color: var(--rust, #9A3B33);
}

.cx-versenden__preview-frame {
    display: block;
    flex: 1 1 0;
    min-height: 0;
    width: 100%;
    height: auto;
    background: #fff;
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

.cx-versenden__preview-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: #fff;
    border: 0;
    border-radius: 0;
    color: var(--cx-text-secondary, #4A443C);
    text-align: center;
    padding: 40px 24px;
    gap: 12px;
}
.cx-versenden__preview-empty .bi { font-size: 28px; color: var(--stone, #8E8679); }
.cx-versenden__preview-empty p { margin: 0; font-size: 13px; }
.cx-versenden__preview-empty.tone-danger { color: var(--rust, #9A3B33); border-color: rgba(154, 59, 51, 0.22); }

.cx-versenden__preview-totals {
    display: flex;
    gap: 16px;
    padding: 10px 14px;
    background: #fff;
    border: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    border-radius: 10px;
    font-size: 12px;
    color: var(--cx-text-secondary, #4A443C);
    flex-shrink: 0;
}
.cx-versenden__preview-totals strong {
    color: var(--ink, #1C1915);
    margin-left: 4px;
    font-family: var(--font-mono, ui-monospace, monospace);
}
.cx-versenden__preview-totals .brutto strong { color: var(--copper, #B8601F); }

/* ── Document send — sidebar ──────────────────────────────────────────── */
.cx-versenden__sidebar {
    background: #fff;
    border-left: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    overflow-y: auto;
    display: flex;
    flex-direction: column;
}

.cx-versenden__section {
    padding: 16px 20px;
    border-bottom: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
}
.cx-versenden__section:last-child { border-bottom: none; }

.cx-versenden__section-title {
    font-size: 10.5px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--stone, #8E8679);
    margin-bottom: 10px;
}

.cx-versenden__chooser {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.cx-versenden__card {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    background: #fff;
    border: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    border-radius: 10px;
    cursor: pointer;
    text-align: left;
    font-family: inherit;
    transition: background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
    width: 100%;
}
.cx-versenden__card:hover { background: var(--sand, #F4F0E8); border-color: var(--hairline-strong, rgba(28, 25, 21, 0.14)); }
.cx-versenden__card.is-selected {
    background: rgba(184, 96, 31, 0.08);
    border-color: rgba(184, 96, 31, 0.30);
    box-shadow: inset 3px 0 0 var(--copper, #B8601F);
}
.cx-versenden__card.is-disabled {
    opacity: 0.55;
    cursor: not-allowed;
    background: #fff;
}

.cx-versenden__card-radio {
    width: 16px; height: 16px;
    border-radius: 50%;
    border: 1.5px solid var(--hairline-strong, rgba(28, 25, 21, 0.14));
    background: #fff;
    flex-shrink: 0;
    display: grid; place-items: center;
    transition: border-color 0.15s ease, background 0.15s ease;
}
.cx-versenden__card.is-selected .cx-versenden__card-radio {
    border-color: var(--copper, #B8601F);
    background: var(--copper, #B8601F);
    box-shadow: inset 0 0 0 3px #fff;
}

.cx-versenden__card-text { flex: 1 1 auto; min-width: 0; }

.cx-versenden__card-label {
    display: flex; align-items: center; gap: 6px;
    font-size: 13px;
    font-weight: 600;
    color: var(--ink, #1C1915);
    line-height: 1.2;
}
.cx-versenden__card-lock {
    font-size: 11px;
    color: var(--stone, #8E8679);
}

.cx-versenden__card-caption {
    display: block;
    font-size: 11.5px;
    color: var(--cx-text-secondary, #4A443C);
    margin-top: 2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.cx-versenden__card-count {
    flex-shrink: 0;
    font-size: 11px;
    font-weight: 600;
    padding: 2px 8px;
    border-radius: 999px;
    background: var(--sand, #F4F0E8);
    color: var(--cx-text-secondary, #4A443C);
}

/* Collapsed chooser: single summary row of the selected kind; the whole row
   is the "Ändern" hit target that re-expands the full card list. */
.cx-versenden__card--collapsed:hover {
    background: rgba(184, 96, 31, 0.12);
}
.cx-versenden__card-change {
    flex-shrink: 0;
    font-size: 11.5px;
    font-weight: 600;
    padding: 3px 10px;
    border-radius: 999px;
    border: 1px solid rgba(184, 96, 31, 0.30);
    color: var(--copper, #B8601F);
    background: #fff;
    transition: background 0.15s ease;
}
.cx-versenden__card--collapsed:hover .cx-versenden__card-change {
    background: var(--copper, #B8601F);
    color: #fff;
}

/* ── Document send — form rows ────────────────────────────────────────── */
.cx-versenden__form-row {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-bottom: 10px;
}
.cx-versenden__form-row:last-child { margin-bottom: 0; }
.cx-versenden__form-row--inline { flex-direction: row; align-items: center; gap: 8px; }

.cx-versenden__label {
    font-size: 11px;
    font-weight: 600;
    color: var(--cx-text-secondary, #4A443C);
}

.cx-versenden__input {
    padding: 8px 10px;
    font-size: 13px;
    border: 1px solid var(--hairline-strong, rgba(28, 25, 21, 0.14));
    border-radius: 8px;
    background: #fff;
    color: var(--ink, #1C1915);
    font-family: inherit;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.cx-versenden__input:focus {
    outline: none;
    border-color: var(--copper, #B8601F);
    box-shadow: 0 0 0 3px rgba(184, 96, 31, 0.18);
}
.cx-versenden__input:disabled {
    background: var(--sand, #F4F0E8);
    color: var(--stone, #8E8679);
    cursor: not-allowed;
}
.cx-versenden__input.is-invalid {
    border-color: var(--cx-danger, #9A3B33);
    background: rgba(154, 59, 51, 0.04);
}
.cx-versenden__input.is-invalid:focus {
    border-color: var(--cx-danger, #9A3B33);
    box-shadow: 0 0 0 3px rgba(154, 59, 51, 0.18);
}

.cx-versenden__hint {
    display: flex; align-items: center; gap: 6px;
    font-size: 11.5px;
    color: var(--stone, #8E8679);
    background: var(--sand, #F4F0E8);
    padding: 8px 10px;
    border-radius: 8px;
    border: 1px dashed var(--hairline-strong, rgba(28, 25, 21, 0.14));
}

/* ── Document send — §14 Leistungszeitraum ────────────────────────────── */
.cx-versenden__service-period {
    border: 1px solid var(--hairline-strong, rgba(28, 25, 21, 0.14));
    border-radius: 10px;
    padding: 10px 12px;
    background: #fff;
    transition: border-color 0.15s ease, background 0.15s ease;
}
.cx-versenden__service-period.is-required {
    border-color: var(--cx-danger, #9A3B33);
    background: rgba(154, 59, 51, 0.04);
}
.cx-versenden__service-period-hint {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin: 0 0 12px;
    font-size: 12px;
    line-height: 1.5;
    color: var(--cx-text-secondary, #4A443C);
}
.cx-versenden__service-period-hint i {
    margin-top: 2px;
    flex: 0 0 auto;
    color: var(--copper, #B8601F);
}
.cx-versenden__service-period-hint span {
    flex: 1 1 auto;
    min-width: 0;
}
.cx-versenden__service-period-hint strong {
    font-weight: 600;
    color: var(--cx-text-primary, #1C1915);
}
.cx-versenden__service-period-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}
.cx-versenden__service-period-grid .cx-versenden__form-row {
    margin-bottom: 0;
}
.cx-versenden__service-period .cx-versenden__field-error {
    margin-top: 8px;
}

/* ── Document send — footer / action bar ──────────────────────────────── */
.cx-versenden__footer {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 14px 20px;
    background: #fff;
    border-top: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    flex-shrink: 0;
}
.cx-versenden__footer-spacer { flex: 1 1 auto; }

/* Hover wrapper so a disabled button's title tooltip stays visible — disabled
   elements don't emit pointer events, so the tooltip is read from this span. */
.cx-btn-tip { display: inline-flex; }
.cx-btn-tip > button:disabled { pointer-events: none; }

@media (max-width: 1100px) {
    .cx-versenden__body { grid-template-columns: 1fr; }
    .cx-versenden__sidebar { border-left: none; border-top: 1px solid var(--hairline, rgba(28, 25, 21, 0.08)); }
}

/* ── Document send — chooser card "Nur Vorschau" pill ─────────────────── */
.cx-versenden__card-tag {
    display: inline-flex;
    align-items: center;
    margin-left: 6px;
    padding: 1px 6px;
    font-size: 10.5px;
    font-weight: 600;
    letter-spacing: 0.02em;
    color: var(--cx-text-secondary, #4A443C);
    background: var(--sand, #F4F0E8);
    border: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    border-radius: 999px;
    text-transform: uppercase;
    line-height: 1.4;
    white-space: nowrap;
}

/* ── Document send — sidebar notice (preview-only kinds) ──────────────── */
.cx-versenden__notice {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 10px 12px;
    background: var(--sand, #F4F0E8);
    border: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    border-radius: 8px;
    color: var(--cx-text-secondary, #4A443C);
    font-size: 12.5px;
    line-height: 1.45;
}
.cx-versenden__notice > i {
    color: var(--copper, #B8601F);
    font-size: 15px;
    flex-shrink: 0;
    margin-top: 1px;
}
.cx-versenden__notice.is-danger {
    background: rgba(154, 59, 51, 0.07);
    border-color: rgba(154, 59, 51, 0.22);
    color: var(--cx-danger, #9A3B33);
}
.cx-versenden__notice.is-danger > i {
    color: var(--cx-danger, #9A3B33);
}
.cx-versenden__notice ul {
    margin: 4px 0 0;
    padding-left: 18px;
}

/* ── Document send — email form sub-component ─────────────────────────── */
.cx-versenden__email {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.cx-versenden__label .muted {
    color: var(--stone, #8E8679);
    font-weight: 400;
}
.cx-versenden__label-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 4px;
}
.cx-versenden__chip-btn {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 8px;
    background: var(--sand, #F4F0E8);
    border: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    border-radius: 6px;
    font-size: 11.5px;
    color: var(--ink, #1C1915);
    cursor: pointer;
    transition: background-color 0.12s ease, border-color 0.12s ease;
}
.cx-versenden__chip-btn:hover:not(:disabled) {
    background: rgba(184, 96, 31, 0.08);
    border-color: var(--copper, #B8601F);
    color: var(--copper, #B8601F);
}
.cx-versenden__chip-btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}
.cx-versenden__check {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 12.5px;
    color: var(--cx-text-secondary, #4A443C);
    cursor: pointer;
    user-select: none;
}
.cx-versenden__check input[type="checkbox"] {
    accent-color: var(--copper, #B8601F);
}
.cx-versenden__field-error {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 11.5px;
    color: var(--cx-danger, #9A3B33);
    margin-top: 4px;
}
.cx-versenden__field-hint {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 11.5px;
    color: var(--stone, #8E8679);
    margin-top: 4px;
}
.cx-versenden__save-recipient {
    margin-top: 6px;
}
.cx-versenden__checkbox {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 12.5px;
    color: var(--stone-dark, #5E574C);
    cursor: pointer;
    user-select: none;
}
.cx-versenden__checkbox input {
    width: 15px;
    height: 15px;
    accent-color: var(--cx-copper, #B06A3B);
    cursor: pointer;
    margin: 0;
}
.cx-versenden__footer-error {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    color: var(--cx-danger, #9A3B33);
    margin-right: 8px;
}
.cx-versenden__footer-blocker {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    max-width: min(480px, 45vw);
    padding: 8px 10px;
    border-radius: 10px;
    background: rgba(154, 59, 51, 0.07);
    border: 1px solid rgba(154, 59, 51, 0.2);
    color: var(--cx-danger, #9A3B33);
    font-size: 12px;
    line-height: 1.25;
}

/* ── JobDetailsV2 — proactive document readiness dialog ───────────── */
.job-v2-readiness {
    position: fixed;
    inset: 0;
    z-index: 1085;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    background: rgba(28, 25, 21, 0.42);
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
}
.job-v2-readiness__panel {
    position: relative;
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 18px;
    width: min(680px, 100%);
    max-height: min(760px, calc(var(--cx-app-h) - 48px));
    overflow: auto;
    padding: 28px;
    background: var(--paper, #fff);
    border: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    border-radius: 22px;
    box-shadow: 0 24px 70px rgba(28, 25, 21, 0.28);
}
.job-v2-readiness__close {
    position: absolute;
    top: 14px;
    right: 14px;
    width: 36px;
    height: 36px;
    border: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    border-radius: 12px;
    background: #fff;
    color: var(--walnut, #4A443C);
}
.job-v2-readiness__icon {
    width: 52px;
    height: 52px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 16px;
    background: rgba(184, 96, 31, 0.1);
    color: var(--copper, #B8601F);
    font-size: 23px;
}
.job-v2-readiness__icon.is-error {
    background: rgba(154, 59, 51, 0.09);
    color: var(--cx-danger, #9A3B33);
}
.job-v2-readiness__eyebrow {
    margin: 0 0 6px;
    color: var(--copper, #B8601F);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}
.job-v2-readiness__body h2 {
    margin: 0;
    padding-right: 34px;
    font-family: var(--font-display, "Bricolage Grotesque", sans-serif);
    font-size: 24px;
    line-height: 1.15;
    color: var(--ink, #1C1915);
}
.job-v2-readiness__text {
    margin: 8px 0 18px;
    color: var(--walnut, #4A443C);
}
.job-v2-readiness__section {
    padding: 14px 16px;
    margin-top: 12px;
    border: 1px solid rgba(154, 59, 51, 0.18);
    border-radius: 14px;
    background: rgba(154, 59, 51, 0.055);
}
.job-v2-readiness__section.is-warning {
    border-color: rgba(184, 96, 31, 0.2);
    background: rgba(184, 96, 31, 0.07);
}
.job-v2-readiness__section > strong {
    display: block;
    margin-bottom: 8px;
    color: var(--ink, #1C1915);
}
.job-v2-readiness__group {
    margin-top: 8px;
}
.job-v2-readiness__group span {
    display: block;
    margin-bottom: 4px;
    color: var(--stone, #8E8679);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}
.job-v2-readiness__group ul {
    margin: 0;
    padding-left: 18px;
    color: var(--walnut, #4A443C);
}
.job-v2-readiness__actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 20px;
}

/* ── JobV2 Header — ⋮ menu ────────────────────────────────────────── */
.job-v2-menu {
    position: relative;
    display: inline-flex;
}

.job-v2-menu__backdrop {
    position: fixed;
    inset: 0;
    background: transparent;
    z-index: 60;
}

.job-v2-menu__panel {
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    min-width: 232px;
    background: #fff;
    border: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    border-radius: 12px;
    box-shadow: 0 10px 30px rgba(28, 25, 21, 0.16), 0 2px 8px rgba(28, 25, 21, 0.06);
    padding: 6px;
    z-index: 70;
    animation: jobV2MenuIn 120ms ease-out;
}

@keyframes jobV2MenuIn {
    from { opacity: 0; transform: translateY(-4px); }
    to   { opacity: 1; transform: translateY(0); }
}

.job-v2-menu__item {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 9px 10px;
    background: transparent;
    border: 0;
    border-radius: 8px;
    font-size: 13.5px;
    color: var(--ink, #1C1915);
    text-align: left;
    cursor: pointer;
    transition: background-color 0.12s ease, color 0.12s ease;
}
.job-v2-menu__item:hover:not(:disabled) {
    background: var(--sand, #F4F0E8);
}
.job-v2-menu__item:focus-visible {
    outline: 2px solid var(--copper, #B8601F);
    outline-offset: -2px;
}
.job-v2-menu__item:disabled {
    color: var(--stone, #8E8679);
    cursor: not-allowed;
    opacity: 0.6;
}
.job-v2-menu__item i {
    font-size: 15px;
    width: 18px;
    text-align: center;
    color: var(--stone, #8E8679);
}
.job-v2-menu__item:hover:not(:disabled) i {
    color: var(--copper, #B8601F);
}
.job-v2-menu__item.tone-danger {
    color: var(--cx-danger, #9A3B33);
}
.job-v2-menu__item.tone-danger i {
    color: var(--cx-danger, #9A3B33);
}
.job-v2-menu__item.tone-danger:hover:not(:disabled) {
    background: rgba(154, 59, 51, 0.08);
}
.job-v2-menu__item.is-muted {
    color: var(--stone, #8E8679);
}

.job-v2-menu__sep {
    height: 1px;
    background: var(--hairline, rgba(28, 25, 21, 0.08));
    margin: 4px 6px;
}

/* ==========================================================================
   Aktivität tab (JobV2ActivityTab)
   Single-column timeline that reuses .job-v2-activity-row from above.
   The rules below cover only the *tab-specific* container: toolbar, body
   padding, footer button area, skeleton/error states.
   ========================================================================== */

.job-v2-activity {
    max-width: 1040px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.job-v2-activity__toolbar {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 12px;
    padding: 0 4px;
    flex-wrap: wrap;
}

.job-v2-activity__eyebrow {
    display: block;
    font-size: 11px;
    font-weight: 700;
    color: var(--copper, #B8601F);
    text-transform: uppercase;
    letter-spacing: 0.11em;
    margin-bottom: 2px;
}

.job-v2-activity__count {
    display: block;
    font-size: 12px;
    font-weight: 600;
    color: var(--cx-text-muted, #6B6157);
}

.job-v2-activity__filters {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 6px;
}

.job-v2-activity__filter {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 32px;
    padding: 0 10px;
    border-radius: 999px;
    border: 1px solid var(--hairline, rgba(28, 25, 21, 0.10));
    background: #fff;
    color: var(--stone, #8E8679);
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
    transition: background 160ms ease, border-color 160ms ease, color 160ms ease, transform 160ms ease;
}

.job-v2-activity__filter:hover:not(:disabled) {
    color: var(--ink, #1C1915);
    border-color: rgba(184, 96, 31, 0.24);
    background: rgba(184, 96, 31, 0.05);
    transform: translateY(-1px);
}

.job-v2-activity__filter.is-active {
    color: var(--copper-dark, #8A4514);
    border-color: rgba(184, 96, 31, 0.28);
    background: linear-gradient(180deg, rgba(184, 96, 31, 0.13), rgba(184, 96, 31, 0.07));
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.60);
}

.job-v2-activity__filter:disabled {
    opacity: 0.42;
    cursor: not-allowed;
}

.job-v2-activity__filter em {
    min-width: 19px;
    height: 19px;
    border-radius: 999px;
    display: inline-grid;
    place-items: center;
    padding: 0 5px;
    font-style: normal;
    font-family: var(--font-mono, ui-monospace, monospace);
    font-size: 10px;
    background: rgba(28, 25, 21, 0.06);
    color: inherit;
}

.job-v2-activity__card {
    overflow: hidden;
    border-radius: 18px;
}

.job-v2-activity__body {
    padding: 12px 18px 10px;
}

.job-v2-activity__sep {
    color: var(--stone, #8E8679);
    margin: 0 4px;
}

.job-v2-activity__desc {
    color: var(--cx-text-muted, #6B6157);
}

.job-v2-activity__more {
    color: var(--stone, #8E8679);
    font-style: italic;
    font-size: 11.5px;
}

/* Inline diff pills — single horizontal row of "Field: old → new" pills
   under the timeline header. Wrap freely on narrow widths. */
.job-v2-activity-row__changes {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 6px;
    margin-top: 4px;
    font-size: 11.5px;
    color: var(--cx-text-secondary, #4A443C);
}

.job-v2-activity__change {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: transparent;
    border: 1px solid var(--hairline-soft, rgba(28, 25, 21, 0.07));
    border-radius: 6px;
    padding: 1px 7px;
    line-height: 1.55;
    white-space: nowrap;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
}

.job-v2-activity__change.is-set {
    background: rgba(63, 125, 91, 0.06);
    border-color: rgba(63, 125, 91, 0.18);
}

.job-v2-activity__change.is-cleared {
    background: rgba(154, 59, 51, 0.05);
    border-color: rgba(154, 59, 51, 0.18);
}

.job-v2-activity__field {
    font-weight: 600;
    color: var(--cx-text-secondary, #4A443C);
}

.job-v2-activity__old {
    color: var(--cx-text-muted, #8E8679);
    text-decoration: line-through;
    text-decoration-color: rgba(142, 134, 121, 0.45);
}

.job-v2-activity__arrow {
    font-size: 10px;
    color: var(--stone, #8E8679);
}

.job-v2-activity__new {
    color: var(--copper-dark, #8A4514);
    font-weight: 500;
}

.job-v2-activity__cleared-label {
    color: var(--cx-danger, #9A3B33);
    font-style: italic;
}

.job-v2-activity__footer {
    display: flex;
    justify-content: center;
    padding: 14px 16px 16px;
    border-top: 1px solid var(--hairline-soft, rgba(28, 25, 21, 0.05));
}

.job-v2-activity__inline-error {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    border-top: 1px solid var(--hairline-soft, rgba(28, 25, 21, 0.05));
    font-size: 12.5px;
    color: var(--cx-danger, #9A3B33);
}

.job-v2-activity__error {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 18px 16px;
    color: var(--cx-danger, #9A3B33);
    font-size: 13px;
}

.job-v2-activity__error i { font-size: 16px; }

/* Skeleton placeholders shown during the very first page load. */
.job-v2-activity__skeleton {
    pointer-events: none;
}

.job-v2-activity__skeleton-avatar {
    background: linear-gradient(90deg,
        rgba(28, 25, 21, 0.06) 0%,
        rgba(28, 25, 21, 0.10) 50%,
        rgba(28, 25, 21, 0.06) 100%);
    background-size: 200% 100%;
    animation: jobV2ActivityShimmer 1.4s ease-in-out infinite;
}

.job-v2-activity__skeleton-line {
    height: 10px;
    border-radius: 4px;
    background: linear-gradient(90deg,
        rgba(28, 25, 21, 0.06) 0%,
        rgba(28, 25, 21, 0.10) 50%,
        rgba(28, 25, 21, 0.06) 100%);
    background-size: 200% 100%;
    animation: jobV2ActivityShimmer 1.4s ease-in-out infinite;
    margin-bottom: 6px;
    width: 70%;
}

.job-v2-activity__skeleton-line.is-short {
    width: 35%;
    height: 8px;
    margin-bottom: 0;
}

.job-v2-activity__spin {
    display: inline-block;
    animation: jobV2ActivitySpin 0.9s linear infinite;
}

@keyframes jobV2ActivityShimmer {
    0%   { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

@keyframes jobV2ActivitySpin {
    from { transform: rotate(0deg); }
    to   { transform: rotate(360deg); }
}

/* ── "In Katalog übernehmen": Ähnliche-Einträge-Zwischendialog ──────────── */
.job-v2-dup__backdrop {
    position: fixed;
    inset: 0;
    z-index: 5200; /* über dem Dialog-Sockel 5000, unter Toasts */
    background: rgba(28, 25, 21, 0.32);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
}

.job-v2-dup {
    width: min(480px, 100%);
    background: #fff;
    border-radius: 14px;
    border: 1px solid var(--hairline, rgba(28, 25, 21, 0.08));
    box-shadow: 0 18px 48px rgba(28, 25, 21, 0.22);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.job-v2-dup__head {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 16px 10px;
}

.job-v2-dup__head > i {
    color: var(--copper, #B8601F);
    font-size: 15px;
}

.job-v2-dup__title {
    flex: 1;
    font-weight: 700;
    font-size: 14px;
    color: var(--ink, #1C1915);
}

.job-v2-dup__hint {
    padding: 0 16px 12px;
    font-size: 12.5px;
    line-height: 1.45;
    color: var(--stone, #8E8679);
}

.job-v2-dup__list {
    border-top: 1px solid var(--hairline-soft, rgba(28, 25, 21, 0.05));
    max-height: 260px;
    overflow-y: auto;
}

.job-v2-dup__row {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 10px 16px;
    border: none;
    border-bottom: 1px solid var(--hairline-soft, rgba(28, 25, 21, 0.05));
    background: transparent;
    font-family: inherit;
    font-size: 13px;
    color: var(--ink, #1C1915);
    text-align: left;
    cursor: pointer;
}

.job-v2-dup__row:hover {
    background: var(--copper-50, #FBEFE5);
}

.job-v2-dup__row > i {
    color: var(--copper, #B8601F);
    font-size: 13px;
}

.job-v2-dup__main {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.job-v2-dup__name {
    font-weight: 600;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.job-v2-dup__path {
    font-size: 10.5px;
    color: var(--stone, #8E8679);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.job-v2-dup__price {
    font-variant-numeric: tabular-nums;
    font-size: 12px;
    color: var(--stone, #8E8679);
    white-space: nowrap;
}

.job-v2-dup__link {
    font-size: 11.5px;
    font-weight: 600;
    color: var(--copper, #B8601F);
    opacity: 0;
    transition: opacity 0.12s ease;
    white-space: nowrap;
}

.job-v2-dup__row:hover .job-v2-dup__link {
    opacity: 1;
}

.job-v2-dup__foot {
    display: flex;
    justify-content: flex-end;
    padding: 12px 16px;
}

.job-v2-dup__create {
    padding: 6px 14px;
    border: 1px solid var(--hairline, rgba(28, 25, 21, 0.12));
    border-radius: 999px;
    background: transparent;
    font-family: inherit;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--ink, #1C1915);
    cursor: pointer;
}

.job-v2-dup__create:hover {
    border-color: var(--copper, #B8601F);
    color: var(--copper, #B8601F);
    background: var(--copper-50, #FBEFE5);
}
