/* /Components/AddressLines.razor.rz.scp.css */
.line[b-vaq12oslm7] {
    display: block;
}

.strong[b-vaq12oslm7] {
    font-weight: 600;
    color: var(--color-text-headings);
}

.contact[b-vaq12oslm7] {
    font-weight: 400;
    color: var(--color-text-body);
}
/* /Components/CaliButton.razor.rz.scp.css */
/* =============================================================================
   CaliButton — Buttonsystem des CaliHub-Design-Systems

   Aufbau:
     1) Basis        – Reset, Layout, Typografie (liest --cali-btn-*)
     2) Varianten    – belegen --cali-btn-* mit Farbtokens
     3) Größen       – belegen --cali-btn-* mit Maß- und Schrifttokens
     4) Zustände     – hover/focus/pressed als State-Layer, disabled
     5) Icon         – Größe der CSS-Maske aus Components/CaliIcons.cs

   Der Reset in Abschnitt 1 ist vollständig ausgeschrieben statt sich auf die
   globalen button-Regeln von MudBlazor oder Bootstrap zu verlassen: beide
   liegen als Typselektoren im Dokument, und welche davon gewinnt, hängt an der
   Ladereihenfolge in index.html. Die Isolationsattribute dieser Datei
   (.cali-btn[b-…]) schlagen jeden Typselektor sicher.

   Hinweis Dark Mode: die State-Layer- und Container-Tokens sind in
   calihub-tokens.css für [data-theme="dark"] noch mit dem Figma-Platzhalter
   #FF00A1 belegt. Der Button folgt den Tokens; sobald die Dark-Werte im
   Design-File stehen, stimmt er ohne Änderung hier.
   ============================================================================= */


/* -----------------------------------------------------------------------------
   1) BASIS
   -------------------------------------------------------------------------- */
.cali-btn[b-kez056h6p6] {
    /* Farbe des Fokusrings; einzelne Varianten überschreiben sie. */
    --cali-btn-ring: var(--calids-color-primary);

    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--cali-btn-gap);

    box-sizing: border-box;
    margin: 0;
    padding: var(--cali-btn-padding-block) var(--cali-btn-padding-inline);

    border: var(--calids-border-width-2xs) solid var(--cali-btn-border);
    border-radius: var(--calids-border-radius-lg);

    font-family: var(--calids-type-body), system-ui, Arial, sans-serif;
    font-size: var(--cali-btn-font-size);
    line-height: var(--cali-btn-line-height);
    /* Bewusst als Zahl: die Gewichts-Tokens (--calids-type-semibold) enthalten
       den Figma-Namen "semibold", das ist kein gültiger font-weight-Wert. */
    font-weight: 500;
    text-align: center;
    text-decoration: none;
    text-transform: none;
    white-space: nowrap;
    vertical-align: middle;

    color: var(--cali-btn-fg);
    background-color: var(--cali-btn-bg);
    background-image: none;
    box-shadow: none;

    appearance: none;
    cursor: pointer;
    user-select: none;

    transition: background-color 150ms ease, border-color 150ms ease, color 150ms ease;
}

.cali-btn--full[b-kez056h6p6] {
    width: 100%;
}


/* -----------------------------------------------------------------------------
   2) VARIANTEN
   Der State-Layer ist jeweils die Deckfarbe der Schrift mit 8/12/16 % Deckung —
   genau dafür liefert das Design-System die *-opacity-08/12/16-Tokens.
   -------------------------------------------------------------------------- */
.cali-btn--filled[b-kez056h6p6] {
    --cali-btn-bg: var(--calids-color-primary);
    --cali-btn-fg: var(--calids-color-on-primary);
    --cali-btn-border: transparent;
    --cali-btn-layer-hover: var(--calids-color-on-primary-opacity-08);
    --cali-btn-layer-focus: var(--calids-color-on-primary-opacity-12);
    --cali-btn-layer-pressed: var(--calids-color-on-primary-opacity-16);
    --cali-btn-disabled-bg: var(--calids-color-surface-container);
    --cali-btn-disabled-border: transparent;
}

.cali-btn--outlined[b-kez056h6p6] {
    --cali-btn-bg: transparent;
    --cali-btn-fg: var(--calids-color-on-primary-container);
    --cali-btn-border: var(--calids-color-outline);
    --cali-btn-layer-hover: var(--calids-color-on-primary-container-opacity-08);
    --cali-btn-layer-focus: var(--calids-color-on-primary-container-opacity-12);
    --cali-btn-layer-pressed: var(--calids-color-on-primary-container-opacity-16);
    --cali-btn-disabled-bg: transparent;
    --cali-btn-disabled-border: var(--calids-color-outline-variant);
}

.cali-btn--text[b-kez056h6p6] {
    --cali-btn-bg: transparent;
    --cali-btn-fg: var(--calids-color-on-primary-container);
    --cali-btn-border: transparent;
    --cali-btn-layer-hover: var(--calids-color-on-primary-container-opacity-08);
    --cali-btn-layer-focus: var(--calids-color-on-primary-container-opacity-12);
    --cali-btn-layer-pressed: var(--calids-color-on-primary-container-opacity-16);
    --cali-btn-disabled-bg: transparent;
    --cali-btn-disabled-border: transparent;
}

.cali-btn--secondary[b-kez056h6p6] {
    --cali-btn-bg: var(--calids-color-primary-container);
    --cali-btn-fg: var(--calids-color-on-primary-container);
    --cali-btn-border: transparent;
    --cali-btn-layer-hover: var(--calids-color-on-primary-container-opacity-08);
    --cali-btn-layer-focus: var(--calids-color-on-primary-container-opacity-12);
    --cali-btn-layer-pressed: var(--calids-color-on-primary-container-opacity-16);
    --cali-btn-disabled-bg: var(--calids-color-surface-container);
    --cali-btn-disabled-border: transparent;
}


/* Zerstörende Aktionen. Aufbau wie .cali-btn--outlined, nur mit den
   Error-Tokens — dieselbe Wirkung wie die bisherigen .danger-Regeln der
   Anbieterseiten (roter Text, roter Rahmen, transparente Fläche). */
.cali-btn--danger[b-kez056h6p6] {
    --cali-btn-bg: transparent;
    --cali-btn-fg: var(--calids-color-error);
    --cali-btn-border: var(--calids-color-error);
    --cali-btn-layer-hover: var(--calids-color-error-opacity-08);
    --cali-btn-layer-focus: var(--calids-color-error-opacity-12);
    --cali-btn-layer-pressed: var(--calids-color-error-opacity-16);
    --cali-btn-disabled-bg: transparent;
    --cali-btn-disabled-border: var(--calids-color-outline-variant);
    /* Der Fokusring folgt der Variante: sonst läge ein violetter Ring um einen
       roten Button. */
    --cali-btn-ring: var(--calids-color-error);
}


/* -----------------------------------------------------------------------------
   3) GRÖSSEN
   Schrift aus der Label-Skala (14/16/20 px), Maße aus der Scale — das ergibt
   die Höhen 34/42/46 px des Mockups.
   -------------------------------------------------------------------------- */
.cali-btn--sm[b-kez056h6p6] {
    --cali-btn-font-size: var(--font-label-label-small-size);
    --cali-btn-line-height: var(--font-label-label-small-line-height);
    --cali-btn-padding-block: var(--calids-scale-200);
    --cali-btn-padding-inline: var(--calids-scale-200);
    --cali-btn-gap: var(--calids-scale-200);
    --cali-btn-icon-size: var(--calids-scale-400);
}

.cali-btn--md[b-kez056h6p6] {
    --cali-btn-font-size: var(--font-label-label-medium-size);
    --cali-btn-line-height: var(--font-label-label-medium-line-height);
    --cali-btn-padding-block: var(--calids-scale-200);
    --cali-btn-padding-inline: var(--calids-scale-500);
    --cali-btn-gap: var(--calids-scale-200);
    --cali-btn-icon-size: var(--calids-scale-500);
}

.cali-btn--lg[b-kez056h6p6] {
    --cali-btn-font-size: var(--font-label-label-large-size);
    --cali-btn-line-height: var(--font-label-label-large-line-height);
    --cali-btn-padding-block: var(--calids-scale-400);
    --cali-btn-padding-inline: var(--calids-scale-400);
    --cali-btn-gap: var(--calids-scale-200);
    --cali-btn-icon-size: var(--calids-scale-600);
}


/* -----------------------------------------------------------------------------
   4) ZUSTÄNDE
   Der State-Layer liegt als Verlauf aus einer einzigen halbtransparenten Farbe
   über background-color. Ein Pseudo-Element wäre die Alternative, läge aber
   über der Beschriftung. Reihenfolge: focus → hover → pressed, damit der
   jeweils stärkere Zustand gewinnt.
   -------------------------------------------------------------------------- */
.cali-btn:focus-visible[b-kez056h6p6] {
    background-image: linear-gradient(var(--cali-btn-layer-focus), var(--cali-btn-layer-focus));
    outline: var(--focus-calids-focus-indicator-thickness) solid var(--cali-btn-ring);
    outline-offset: var(--calids-focus-indicator-outer-offset);
}

@media (hover: hover) and (pointer: fine) {
    .cali-btn:hover[b-kez056h6p6] {
        background-image: linear-gradient(var(--cali-btn-layer-hover), var(--cali-btn-layer-hover));
    }
}

.cali-btn:active[b-kez056h6p6] {
    background-image: linear-gradient(var(--cali-btn-layer-pressed), var(--cali-btn-layer-pressed));
}

/* aria-disabled deckt den Link-Fall ab: ein <a> kennt kein disabled-Attribut. */
.cali-btn:disabled[b-kez056h6p6],
.cali-btn[aria-disabled="true"][b-kez056h6p6] {
    color: var(--color-text-disabled);
    background-color: var(--cali-btn-disabled-bg);
    background-image: none;
    border-color: var(--cali-btn-disabled-border);
    box-shadow: none;
    cursor: default;
    pointer-events: none;
}


/* -----------------------------------------------------------------------------
   5) ICON
   Markup und Maske kommen aus Components/CaliIcons.cs: .material-icons rechnet
   die Kantenlänge aus font-size (1em) und färbt über currentColor.
   -------------------------------------------------------------------------- */
.cali-btn__icon[b-kez056h6p6] {
    font-size: var(--cali-btn-icon-size);
    /* Im Flex-Kontext richtet align-items aus; der Grundlinien-Versatz aus
       app.css würde das Icon sonst nach unten ziehen. */
    vertical-align: middle;
}
/* /Components/LegalLinks.razor.rz.scp.css */
.legal-links[b-m5128r4n97] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px 24px;
    width: 100%;
    max-width: 1440px;
    margin: 0 auto;
    padding: 16px 32px 20px;
    box-sizing: border-box;
}

    .legal-links a[b-m5128r4n97] {
        color: var(--calids-color-neutral-700);
        text-decoration: none;
    }

        .legal-links a:hover[b-m5128r4n97] {
            color: var(--calids-color-primary-500);
            text-decoration: underline;
        }
/* /Components/ListPager.razor.rz.scp.css */
.list-pager[b-m0m42hky5g] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 8px 20px;
    padding: 10px 16px;
    font-size: 12.5px;
    color: var(--color-text-body);
}

    /* In der Listenkarte trennt eine Linie die Fußzeile von der Tabelle; unter
       Karten (Aufträge des Kunden) steht sie frei. */
    .list-card .list-pager[b-m0m42hky5g] {
        border-top: 1px solid var(--calids-palette-grey-400);
    }

.size[b-m0m42hky5g] {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 0;
}

    .size select[b-m0m42hky5g] {
        padding: 4px 6px;
        font-size: 12.5px;
        color: var(--color-text-headings);
        background: var(--calids-color-surface);
        border: 1px solid var(--calids-palette-grey-400);
        border-radius: var(--calids-border-radius-sm, 6px);
        cursor: pointer;
    }

.range[b-m0m42hky5g] {
    white-space: nowrap;
}

.nav[b-m0m42hky5g] {
    display: flex;
    align-items: center;
    gap: 2px;
}

    .nav button[b-m0m42hky5g] {
        padding: 4px;
        color: var(--color-text-headings);
        border-radius: var(--calids-border-radius-full);
    }

        .nav button:hover:not(:disabled)[b-m0m42hky5g] {
            background: var(--calids-color-surface-container-lowest);
        }

        .nav button:disabled[b-m0m42hky5g] {
            color: var(--color-text-disabled);
            cursor: default;
        }

        .nav button .material-icons[b-m0m42hky5g] {
            font-size: 20px;
        }
/* /Components/ListSearch.razor.rz.scp.css */
.list-search[b-y4cmm71q4c] {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 320px;
    padding: 0 6px 0 14px;
    background: var(--calids-color-surface);
    border: 1px solid var(--calids-palette-grey-400);
    border-radius: var(--calids-border-radius-full);
}

    /* Der Rahmen zeigt den Fokus – das Eingabefeld selbst hat keinen eigenen. */
    .list-search:focus-within[b-y4cmm71q4c] {
        border-color: var(--calids-color-primary-500);
    }

    .list-search > .material-icons[b-y4cmm71q4c] {
        font-size: 18px;
        color: var(--color-text-body);
    }

    .list-search input[b-y4cmm71q4c] {
        flex: 1;
        min-width: 0;
        padding: 8px 0;
        font-size: 13px;
        color: var(--color-text-headings);
        background: none;
        border: none;
        outline: none;
        appearance: none;
    }

        /* Das eigene Kreuz unten ersetzt das des Browsers – sonst stünden zwei da. */
        .list-search input[b-y4cmm71q4c]::-webkit-search-cancel-button {
            display: none;
        }

    .list-search .clear[b-y4cmm71q4c] {
        padding: 4px;
        color: var(--color-text-body);
        border-radius: var(--calids-border-radius-full);
    }

        .list-search .clear:hover[b-y4cmm71q4c] {
            color: var(--color-text-headings);
        }

        .list-search .clear .material-icons[b-y4cmm71q4c] {
            font-size: 16px;
        }

@media (max-width: 900px) {
    .list-search[b-y4cmm71q4c] {
        min-width: 0;
        width: 100%;
    }
}
/* /Components/PasswordInput.razor.rz.scp.css */
/* Trägt den Außenabstand statt des Felds, damit das Auge an der Feldkante
   ausgerichtet bleibt und nicht am Abstand darunter. */
.password-input[b-2blqk2l48z] {
    position: relative;
    display: block;
    margin-bottom: 16px;
}

/* Dasselbe Feld wie die übrigen Eingaben auf /login und /reset-password – deren
   Regeln sind seitenbezogen und erreichen dieses input nicht. Rechts Platz für
   das Auge, damit lange Passwörter nicht darunter laufen. */
input[b-2blqk2l48z] {
    width: 100%;
    margin: 0;
    padding: 10px 40px 10px 12px;
    font-size: 14px;
    color: var(--color-text-headings);
    background: var(--calids-color-surface);
    border: 1px solid var(--calids-palette-grey-400);
    border-radius: var(--calids-border-radius-md);
    outline: none;
}

    input:focus[b-2blqk2l48z] {
        border-color: var(--calids-color-primary-500);
    }

    /* Edge blendet sonst ein eigenes Auge daneben ein. */
    input[b-2blqk2l48z]::-ms-reveal {
        display: none;
    }

/* Vollständiger Reset: MudBlazor und Bootstrap legen globale button-Regeln an
   (siehe CaliButton.razor.css). */
.reveal[b-2blqk2l48z] {
    position: absolute;
    top: 1px;
    right: 1px;
    bottom: 1px;
    width: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0;
    padding: 0;
    font-size: 20px;
    line-height: 1;
    color: var(--color-text-body);
    background: none;
    border: none;
    border-radius: 0 var(--calids-border-radius-md) var(--calids-border-radius-md) 0;
    box-shadow: none;
    cursor: pointer;
}

    .reveal:hover[b-2blqk2l48z] {
        color: var(--color-text-headings);
    }

    .reveal:focus-visible[b-2blqk2l48z] {
        outline: 2px solid var(--calids-color-primary-500);
        outline-offset: -2px;
    }
/* /Components/Quotes/QuoteApprovalPanel.razor.rz.scp.css */
.qa-card[b-d8r6d84p72] {
    margin-bottom: 16px;
    padding: 20px;
    background: var(--calids-color-surface);
    border: 1px solid var(--calids-palette-grey-400);
    border-radius: var(--calids-border-radius-lg, 10px);
}

    .qa-card h2[b-d8r6d84p72] {
        margin: 0 0 12px;
        font-size: 16px;
    }

.qa-sub[b-d8r6d84p72] {
    margin: -6px 0 12px;
    font-size: 13px;
    color: var(--color-text-body);
}

.qa-muted[b-d8r6d84p72] {
    margin: 0;
    font-size: 13px;
    color: var(--color-text-body);
}

.small[b-d8r6d84p72] {
    font-size: 12.5px;
}

.qa-list[b-d8r6d84p72] {
    margin: 0 0 12px;
    padding: 0;
    list-style: none;
}

.qa-row[b-d8r6d84p72] {
    display: grid;
    grid-template-columns: 1fr auto auto;
    gap: 4px 12px;
    align-items: start;
    padding: 10px 0;
    border-top: 1px solid var(--calids-palette-grey-300, #e0e0e0);
}

    .qa-row:first-child[b-d8r6d84p72] {
        border-top: none;
    }

.qa-name[b-d8r6d84p72] {
    margin: 0;
    font-size: 14px;
    font-weight: 600;
    color: var(--color-text-headings);
}

.qa-step[b-d8r6d84p72] {
    margin-right: 4px;
    color: var(--color-text-body);
    font-weight: 400;
}

.qa-tag[b-d8r6d84p72] {
    margin-left: 6px;
    padding: 1px 6px;
    font-size: 11px;
    font-weight: 400;
    color: var(--color-text-body);
    background: var(--calids-palette-grey-300, #e0e0e0);
    border-radius: var(--calids-border-radius-full, 999px);
}

.qa-meta[b-d8r6d84p72] {
    margin: 2px 0 0;
    font-size: 12.5px;
    color: var(--color-text-body);
}

.qa-comment[b-d8r6d84p72] {
    margin: 4px 0 0;
    font-size: 13px;
    font-style: italic;
    color: var(--color-text-headings);
    white-space: pre-wrap;
}

.qa-status[b-d8r6d84p72] {
    padding: 2px 10px;
    font-size: 12px;
    white-space: nowrap;
    color: var(--color-text-body);
    background: var(--calids-palette-grey-300, #e0e0e0);
    border-radius: var(--calids-border-radius-full, 999px);
}

    .qa-status.good[b-d8r6d84p72] {
        color: var(--calids-palette-green-900, #0E5814);
        background: var(--calids-palette-green-100, #e3f9e5);
    }

    .qa-status.bad[b-d8r6d84p72] {
        color: var(--calids-palette-red-vivid-900, #a61b1b);
        background: var(--calids-palette-red-vivid-100, #fde2e2);
    }

    .qa-status.open[b-d8r6d84p72] {
        color: var(--calids-color-primary-500);
        background: var(--calids-color-primary-100);
    }

.qa-actions[b-d8r6d84p72] {
    display: flex;
    gap: 10px;
}

.qa-link[b-d8r6d84p72] {
    padding: 0;
    font-size: 13px;
    color: var(--calids-color-primary-500);
    background: none;
    border: none;
    cursor: pointer;
}

    .qa-link:disabled[b-d8r6d84p72] {
        opacity: 0.5;
        cursor: default;
    }

.qa-decide[b-d8r6d84p72],
.qa-compose[b-d8r6d84p72] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: 4px 0 12px;
    padding: 14px 16px;
    background: var(--calids-color-primary-opacity-08);
    border: 1px solid var(--calids-color-primary-300);
    border-radius: var(--calids-border-radius-md, 8px);
}

.qa-label[b-d8r6d84p72] {
    margin: 0;
    font-size: 14px;
    font-weight: 600;
    color: var(--color-text-headings);
}

    .qa-label.small[b-d8r6d84p72] {
        margin-top: 4px;
        font-size: 13px;
    }

.qa-field[b-d8r6d84p72] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    font-size: 13px;
}

.qa-compose textarea[b-d8r6d84p72],
.qa-decide textarea[b-d8r6d84p72],
.qa-field input[b-d8r6d84p72],
.qa-external input[b-d8r6d84p72] {
    width: 100%;
    box-sizing: border-box;
}

.qa-colleagues[b-d8r6d84p72] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.qa-check[b-d8r6d84p72] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13.5px;
}

.qa-external[b-d8r6d84p72] {
    display: grid;
    grid-template-columns: 1.4fr 1fr auto;
    gap: 6px;
    align-items: center;
}

.qa-buttons[b-d8r6d84p72] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.qa-ok[b-d8r6d84p72] {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 0 0 12px;
    font-size: 13.5px;
    color: var(--calids-palette-green-900, #0E5814);
}

.qa-error[b-d8r6d84p72] {
    margin: 10px 0 0;
    font-size: 13px;
    color: var(--calids-palette-red-vivid-900, #a61b1b);
}

@media (max-width: 600px) {
    .qa-external[b-d8r6d84p72] {
        grid-template-columns: 1fr auto;
    }

        .qa-external input[type="text"][b-d8r6d84p72] {
            grid-column: 1;
        }
}
/* /Components/SiteFooter.razor.rz.scp.css */
.site-footer[b-tfttjejdh6] {
    width: 100%;
    margin-top: auto;
    background: var(--calids-color-background);
    border-top: 1px solid var(--calids-palette-grey-400);
}

@media (max-width: 600px) {
    .site-footer[b-tfttjejdh6] {
        padding: 16px;
    }
}
/* /Components/SortHeader.razor.rz.scp.css */
/* Der Knopf übernimmt Schrift und Farbe des Spaltenkopfs (css/lists.css). */
.sort[b-4949zfhryh] {
    gap: 4px;
    font: inherit;
    letter-spacing: inherit;
    text-transform: inherit;
    white-space: nowrap;
    color: inherit;
}

    .sort .material-icons[b-4949zfhryh] {
        font-size: 14px;
        opacity: 0;
        transition: opacity .12s;
    }

    .sort:hover .material-icons[b-4949zfhryh],
    .sort:focus-visible .material-icons[b-4949zfhryh] {
        opacity: .5;
    }

    .sort.active[b-4949zfhryh] {
        color: var(--calids-color-primary-500);
    }

        .sort.active .material-icons[b-4949zfhryh] {
            opacity: 1;
        }
/* /Components/TestPointEditor.razor.rz.scp.css */
/* Gleiche Optik wie die Messpunkte im Anfrageformular (NewInquiry.razor.css). */

.empty[b-v2j5c4db7y] {
    margin: 6px 0 4px;
    font-size: 13px;
    color: var(--color-text-body);
}

/* Eine Zeile je Messgröße: links die Größe, rechts ihre Punkte. */
.point-rows[b-v2j5c4db7y] {
    margin: 6px 0 4px;
}

.point-row[b-v2j5c4db7y] {
    display: grid;
    grid-template-columns: 150px minmax(0, 1fr);
    align-items: center;
    gap: 12px;
    padding: 10px 0;
    border-top: 1px solid var(--calids-palette-grey-400);
}

    .point-row:first-child[b-v2j5c4db7y] {
        border-top: none;
    }

.point-group[b-v2j5c4db7y] {
    font-size: 13px;
    font-weight: 600;
    color: var(--color-text-headings);
    overflow-wrap: anywhere;
}

.point-chips[b-v2j5c4db7y] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.point-chip[b-v2j5c4db7y] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 12px;
    font-family: inherit;
    font-size: 12px;
    color: var(--color-text-body);
    background: var(--calids-color-surface);
    border: 1px solid var(--calids-palette-grey-400);
    border-radius: var(--calids-border-radius-full, 999px);
    cursor: pointer;
}

    /* Vom Kunden gewünscht: getönt, mit Personen-Symbol – wer ihn entfernt, weicht ab. */
    .point-chip.requested[b-v2j5c4db7y] {
        color: var(--calids-color-primary-700);
        background: var(--calids-color-primary-opacity-08);
        border-color: var(--calids-color-primary-300);
    }

    .point-chip .material-icons[b-v2j5c4db7y] {
        font-size: 13px;
    }

    /* Entfernen zeigt sich erst beim Zeigen – die Liste bleibt ruhig. Auf
       Touch-Geräten gibt es kein Zeigen, dort steht das × immer da. */
    .point-chip .remove[b-v2j5c4db7y] {
        display: none;
        font-size: 13px;
        line-height: 1;
        color: var(--calids-color-primary-700);
    }

    .point-chip:hover[b-v2j5c4db7y],
    .point-chip:focus-visible[b-v2j5c4db7y] {
        border-color: var(--calids-color-primary-500);
    }

        .point-chip:hover .remove[b-v2j5c4db7y],
        .point-chip:focus-visible .remove[b-v2j5c4db7y] {
            display: inline;
        }

@media (hover: none) {
    .point-chip .remove[b-v2j5c4db7y] {
        display: inline;
    }
}

.legend[b-v2j5c4db7y] {
    display: flex;
    align-items: center;
    gap: 4px;
    margin: 4px 0 8px;
    font-size: 12px;
    color: var(--color-text-body);
}

    .legend .material-icons[b-v2j5c4db7y] {
        font-size: 14px;
        color: var(--calids-color-primary-700);
    }

.add-point[b-v2j5c4db7y] {
    display: grid;
    grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    margin-top: 8px;
}

    .add-point.with-frequency[b-v2j5c4db7y] {
        grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) minmax(0, 1fr) auto;
    }

    .add-point input[b-v2j5c4db7y],
    .add-point select[b-v2j5c4db7y] {
        box-sizing: border-box;
        width: 100%;
        min-height: 38px;
        padding: 8px 10px;
        font-family: inherit;
        font-size: 13.5px;
        color: var(--color-text-headings);
        background: var(--calids-color-surface);
        border: 1px solid var(--calids-palette-grey-400);
        border-radius: var(--calids-border-radius-sm, 6px);
    }

        .add-point input:focus[b-v2j5c4db7y],
        .add-point select:focus[b-v2j5c4db7y] {
            outline: none;
            border-color: var(--calids-color-primary-500);
        }

/* Zahl und Einheit als ein Feld: links der Wert, rechts die Einheit. */
.point-value[b-v2j5c4db7y] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 72px;
}

    .point-value input[b-v2j5c4db7y] {
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
    }

    .point-value select[b-v2j5c4db7y] {
        border-left: 0;
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
    }

/* Keine Pfeiltasten im Zahlenfeld – sie verleiten zu 1er-Schritten. */
input[type="number"][b-v2j5c4db7y] {
    -moz-appearance: textfield;
    appearance: textfield;
}

    input[type="number"][b-v2j5c4db7y]::-webkit-inner-spin-button,
    input[type="number"][b-v2j5c4db7y]::-webkit-outer-spin-button {
        -webkit-appearance: none;
        margin: 0;
    }

.point-hint[b-v2j5c4db7y] {
    margin: 6px 0 0;
    font-size: 12px;
    color: var(--color-text-body);
}

    .point-hint.error[b-v2j5c4db7y] {
        color: var(--calids-palette-red-vivid-900, #a61b1b);
    }

@media (max-width: 600px) {
    .add-point[b-v2j5c4db7y],
    .add-point.with-frequency[b-v2j5c4db7y] {
        grid-template-columns: minmax(0, 1fr);
    }

    .point-row[b-v2j5c4db7y] {
        grid-template-columns: minmax(0, 1fr);
        gap: 6px;
    }
}
/* /Layout/CustomerLayout.razor.rz.scp.css */
/* Platzhalter, solange /me noch läuft: hält die Fläche, damit der Rahmen beim
   Wechsel von Kopfzeile zu Seitenleiste nicht springt. */
.boot[b-xl36pvpsb7] {
    min-height: 100vh;
    background: var(--calids-color-surface-container-lowest);
}

/* ---------- Schlanke Kopfzeile (Sitzung über einen Zugangslink) ---------- */

/* Feste Höhe (vorher ergab sie sich genauso): Der Seitenkopf darunter dockt
   genau hier an, siehe unten. */
header.slim[b-xl36pvpsb7] {
    position: sticky;
    top: 0;
    z-index: 10;
    display: flex;
    align-items: center;
    gap: 16px;
    height: 54px;
    padding: 16px 32px;
    background: var(--calids-color-surface);
    border-bottom: 1px solid var(--calids-palette-grey-400);
}

/* Der Seitenkopf der Anfrage bleibt beim Scrollen direkt unter der schlanken
   Kopfzeile stehen. */
header.slim[b-xl36pvpsb7] ~  .page-head {
    position: sticky;
    top: 54px;
    z-index: 5;
}

.area[b-xl36pvpsb7] {
    margin-left: auto;
    font-size: 14px;
    color: var(--color-text-body);
}

/* Das Angebot, ein Konto anzulegen. */
.nav-link[b-xl36pvpsb7] {
    font-size: 14px;
    font-weight: 600;
    white-space: nowrap;
}

/* ---------- Seitenleiste (vollwertiges Konto) ---------- */

.shell[b-xl36pvpsb7] {
    flex: 1;
    display: flex;
    min-height: 100vh;
    background: var(--calids-color-surface-container-lowest);
}

.sidebar[b-xl36pvpsb7] {
    position: sticky;
    top: 0;
    display: flex;
    flex-direction: column;
    width: 240px;
    height: 100vh;
    flex-shrink: 0;
    overflow-y: auto;
    padding: 20px 16px;
    background: var(--calids-color-surface);
    border-right: 1px solid var(--calids-palette-grey-400);
}

.brand[b-xl36pvpsb7] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 28px;
}

.logo[b-xl36pvpsb7] {
    display: flex;
    align-items: center;
    text-decoration: none;
}

    .logo img[b-xl36pvpsb7] {
        height: 20px;
    }

.sidebar .logo img[b-xl36pvpsb7] {
    height: 18px;
}

.nav-section[b-xl36pvpsb7] {
    margin: 20px 0 8px;
    padding: 0 10px;
    font-size: 10.5px;
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--color-text-body);
}

    nav .nav-section:first-child[b-xl36pvpsb7] {
        margin-top: 0;
    }

/* ::deep, weil NavLink das <a> ohne Scope-Attribut rendert. */
nav[b-xl36pvpsb7]  a {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    margin-bottom: 2px;
    font-size: 14px;
    font-weight: 500;
    color: var(--color-text-headings);
    text-decoration: none;
    border-radius: var(--calids-border-radius-md);
}

    nav[b-xl36pvpsb7]  a .material-icons {
        font-size: 20px;
        color: var(--color-text-body);
    }

    nav[b-xl36pvpsb7]  a:hover {
        background: var(--calids-color-surface-container-lowest);
        color: var(--color-text-headings);
    }

    nav[b-xl36pvpsb7]  a.active {
        color: #fff;
        background: var(--calids-color-primary-500);
    }

        nav[b-xl36pvpsb7]  a.active .material-icons {
            color: #fff;
        }

/* Nur Einbettung – Aussehen und Zustände kommen aus CaliButton (Variante Text).
   ::deep ist nötig, weil CaliButton eine Kindkomponente ist; der Typselektor
   button davor hebt die Spezifität über die der Komponente. */
[b-xl36pvpsb7] button.sign-out {
    justify-content: flex-start;
    width: calc(100% - 32px);
    margin: auto 16px 16px;
    border-radius: 0;
    border-top: 1px solid var(--calids-palette-grey-400);
}

/* Impressum und Datenschutz unter dem Abmelden-Button, bündig mit dessen
   Symbol und kleiner als die Menüpunkte – erreichbar, aber ohne mit ihnen zu
   konkurrieren. ::deep, weil LegalLinks eine Kindkomponente ist. */
.sidebar[b-xl36pvpsb7]  .sidebar-legal {
    padding: 0 24px;
    font-size: 12.5px;
}

.content[b-xl36pvpsb7] {
    flex: 1;
    min-width: 0;
}

/* Der Seitenkopf (Zurück, Titel, Status, Aktionen) bleibt beim Scrollen oben
   stehen – hier statt in jeder Seite, damit es überall gleich ist. Nur direkte
   Kinder: Seiten mit eigenem Aufbau (neue Anfrage: Kopf im Formular, daneben
   die mitlaufende Zusammenfassung) bleiben unberührt. */
.content[b-xl36pvpsb7] >  .page-head {
    position: sticky;
    top: 0;
    z-index: 5;
}

/* ---------- Responsive ---------- */

@media (max-width: 900px) {
    .shell[b-xl36pvpsb7] {
        flex-direction: column;
    }

    .sidebar[b-xl36pvpsb7] {
        position: static;
        width: auto;
        height: auto;
        border-right: none;
        border-bottom: 1px solid var(--calids-palette-grey-400);
    }

    header.slim[b-xl36pvpsb7] {
        padding: 16px;
    }
}
/* /Layout/LandingLayout.razor.rz.scp.css */
nav[b-d72x9yq2wh] {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    padding: 16px 24px;
}

    nav a[b-d72x9yq2wh] {
        display: flex;
        align-items: center;
        gap: 6px;
        font-size: 16px;
        color: var(--color-text-body);
        text-decoration: none;
    }

        nav a:hover[b-d72x9yq2wh] {
            color: var(--calids-color-primary-500);
        }

    nav div[b-d72x9yq2wh] {
        display: flex;
        align-content: center;
        flex-wrap: wrap;
        gap: 24px;
        align-items: center;
        min-width: 140px;
    }

.right[b-d72x9yq2wh] {
    justify-content: flex-end;
}

/* Flex-Spalte, damit die Seite (.content) die volle Höhe übernehmen und ihren
   Inhalt darin mittig setzen kann. */
.page[b-d72x9yq2wh] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    min-height: 100dvh;
}
/* /Layout/MainLayout.razor.rz.scp.css */
/* Flex-Spalte wie #app, damit Seiten weiter die Resthöhe unter der Kopfzeile
   belegen können (Vergleich: fester Kopfbereich, intern scrollende Liste). */
.page[b-spjl5gnmsz] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    min-height: 100dvh;
}

header[b-spjl5gnmsz] {
    position: sticky;
    top: 0;
    z-index: 10;
    width: 100%;
    background: var(--calids-color-surface);
    border-bottom: 1px solid var(--calids-palette-grey-400);

}

.header-content[b-spjl5gnmsz] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    width: 100%;
    max-width: 1440px;
    margin: 0 auto;
    padding: 12px 32px;
    box-sizing: border-box;
}

.logo[b-spjl5gnmsz] {
    display: flex;
    align-items: center;
    text-decoration: none;
}

    .logo img[b-spjl5gnmsz] {
        height: 20px;
    }

nav[b-spjl5gnmsz] {
    display: flex;
    gap: 24px;
    margin-left: auto;
}

    /* ::deep, weil die <a> von der NavLink-Komponente gerendert werden und
       sonst kein Scope-Attribut tragen (Styles griffen nicht → Unterstreichung
       aus dem globalen a-Style, active blieb wirkungslos). */
    nav[b-spjl5gnmsz]  a {
        font-size: 16px;
        color: var(--color-text-body);
        text-decoration: none;
    }

        nav[b-spjl5gnmsz]  a:hover {
            color: var(--calids-color-primary-500);
        }

        /* NavLink markiert die Seite, auf der man sich gerade befindet */
        nav[b-spjl5gnmsz]  a.active {
            color: var(--calids-color-primary-500);
            font-weight: 600;
        }
/* /Layout/ProviderLayout.razor.rz.scp.css */
.shell[b-8pywat3ajs] {
    flex: 1;
    display: flex;
    min-height: 100vh;
    background: var(--calids-color-surface-container-lowest);
}

/* ---------- Sidebar ---------- */

.sidebar[b-8pywat3ajs] {
    position: sticky;
    top: 0;
    display: flex;
    flex-direction: column;
    width: 240px;
    height: 100vh;
    flex-shrink: 0;
    overflow-y: auto;
    padding: 20px 16px;
    background: var(--calids-color-surface);
    border-right: 1px solid var(--calids-palette-grey-400);
}

/* Logo und Bereichs-Chip passen zusammen nicht in die 208px Innenbreite der
   Seitenleiste (Logo allein ~171px). Ohne Umbruch schob der Chip die Leiste
   auf und erzeugte eine waagerechte Bildlaufleiste (overflow-y: auto macht
   die x-Achse ebenfalls scrollbar). Deshalb umbrechen statt überlaufen: der
   Chip rutscht unter das Logo, sobald die Breite nicht reicht. */
.brand[b-8pywat3ajs] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 10px;
    margin-bottom: 20px;
}

.logo[b-8pywat3ajs] {
    display: flex;
    align-items: center;
    min-width: 0;
    text-decoration: none;
}

    .logo img[b-8pywat3ajs] {
        height: 18px;
        max-width: 100%;
    }

.area-chip[b-8pywat3ajs] {
    flex: none;
    padding: 3px 10px;
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
    color: var(--calids-color-primary-500);
    background: var(--calids-color-primary-100);
    border-radius: var(--calids-border-radius-full);
}

/* ---------- Firmen-Karte ---------- */

.company-card[b-8pywat3ajs] {
    padding: 12px 14px;
    margin-bottom: 24px;
    background: var(--calids-color-surface);
    border: 1px solid var(--calids-palette-grey-400);
    border-radius: var(--calids-border-radius-lg);
}

    /* Laborname und Benutzername kommen aus den Daten: ein langes Wort (etwa
       eine Mailadresse) hat keine Umbruchstelle und würde die Leiste sonst
       genauso aufschieben wie zuvor der Chip. */
    .company-card h4[b-8pywat3ajs] {
        margin: 0 0 4px;
        font-size: 13.5px;
        overflow-wrap: anywhere;
    }

    .company-card .meta[b-8pywat3ajs] {
        margin: 0 0 12px;
        font-size: 11.5px;
        color: var(--color-text-body);
        overflow-wrap: anywhere;
    }

.progress-row[b-8pywat3ajs] {
    display: flex;
    justify-content: space-between;
    margin-bottom: 6px;
    font-size: 11px;
    font-weight: 600;
    color: var(--calids-color-primary-500);
}

.progress[b-8pywat3ajs] {
    height: 4px;
    background: var(--calids-color-primary-100);
    border-radius: var(--calids-border-radius-full);
    overflow: hidden;
}

.progress-fill[b-8pywat3ajs] {
    height: 100%;
    background: var(--calids-color-primary-500);
    border-radius: var(--calids-border-radius-full);
}

/* ---------- Navigation ---------- */

/* Nur noch Einbettung: Aussehen und Zustände kommen aus CaliButton
   (Variante Text). Die Trennlinie schließt die Seitenleiste nach unten ab,
   margin-top: auto schiebt den Abmelden-Button dorthin.

   ::deep ist nötig, weil CaliButton eine Kindkomponente ist — das
   Isolationsattribut dieser Datei sitzt am <aside>, nicht am Button. Der
   Typselektor button davor hebt die Spezifität über die der Komponente. */
[b-8pywat3ajs] button.sign-out {
    justify-content: flex-start;
    width: calc(100% - 32px);
    margin: auto 16px 16px;
    border-radius: 0;
    border-top: 1px solid var(--calids-palette-grey-400);
}

.nav-section[b-8pywat3ajs] {
    margin: 20px 0 8px;
    padding: 0 10px;
    font-size: 10.5px;
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--color-text-body);
}

    nav .nav-section:first-child[b-8pywat3ajs] {
        margin-top: 0;
    }

/* ::deep, weil NavLink die <a> ohne Scope-Attribut rendert */
nav[b-8pywat3ajs]  a {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    margin-bottom: 2px;
    font-size: 14px;
    font-weight: 500;
    color: var(--color-text-headings);
    text-decoration: none;
    border-radius: var(--calids-border-radius-md);
}

    nav[b-8pywat3ajs]  a .material-icons {
        font-size: 20px;
        color: var(--color-text-body);
    }

    nav[b-8pywat3ajs]  a:hover {
        background: var(--calids-color-surface-container-lowest);
        color: var(--color-text-headings);
    }

    nav[b-8pywat3ajs]  a.active {
        color: #fff;
        background: var(--calids-color-primary-500);
    }

        nav[b-8pywat3ajs]  a.active .material-icons {
            color: #fff;
        }

/* Impressum und Datenschutz unter dem Abmelden-Button, bündig mit dessen
   Symbol und kleiner als die Menüpunkte – erreichbar, aber ohne mit ihnen zu
   konkurrieren. ::deep, weil LegalLinks eine Kindkomponente ist. */
.sidebar[b-8pywat3ajs]  .sidebar-legal {
    padding: 0 24px;
    font-size: 12.5px;
}

/* ---------- Inhaltsbereich ---------- */

.content[b-8pywat3ajs] {
    flex: 1;
    min-width: 0;
}

/* Der Seitenkopf (Zurück, Titel, Status, Aktionen) bleibt beim Scrollen oben
   stehen – hier statt in jeder Seite, damit es überall gleich ist. Nur direkte
   Kinder: Seiten mit eigenem Aufbau (Standorte: fensterhoch, der Kopf steht
   dort ohnehin) bleiben unberührt. */
.content[b-8pywat3ajs] >  .page-head {
    position: sticky;
    top: 0;
    z-index: 5;
}

/* ---------- Responsive ---------- */

@media (max-width: 900px) {
    .shell[b-8pywat3ajs] {
        flex-direction: column;
    }

    .sidebar[b-8pywat3ajs] {
        position: static;
        width: auto;
        height: auto;
        border-right: none;
        border-bottom: 1px solid var(--calids-palette-grey-400);
    }
}
/* /Pages/ButtonStyleguide.razor.rz.scp.css */
/* Präfix sg-: "row" wäre eine Bootstrap-Klasse, und deren `.row > *`-Regel
   setzt width: 100% auf jedes Kind — die Buttons liefen damit über die
   volle Breite. */
.styleguide[b-rg13esi8jy] {
    max-width: 1100px;
    margin: 0 auto;
    padding: var(--calids-spacing-2xl) var(--calids-spacing-lg);
}

section[b-rg13esi8jy] {
    margin-top: var(--calids-spacing-2xl);
    padding: var(--calids-spacing-lg);
    border: var(--calids-border-width-2xs) dashed var(--calids-color-primary-300);
    border-radius: var(--calids-border-radius-xl);
}

h2[b-rg13esi8jy] {
    margin: 0 0 var(--calids-spacing-lg);
    font-size: var(--calids-fontsize-h3);
}

.sg-row[b-rg13esi8jy] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--calids-spacing-lg);
    padding: var(--calids-spacing-sm) 0;
}

.sg-row-label[b-rg13esi8jy] {
    flex: 0 0 150px;
    font-size: var(--calids-fontsize-body-xs);
    color: var(--color-text-body);
}

.sg-row--full[b-rg13esi8jy] {
    display: block;
}
/* /Pages/CertificateCheck.razor.rz.scp.css */
/* Handy zuerst: Wer den QR-Code scannt, steht mit dem Telefon vor dem Gerät. */
.check-page[b-5qpmrtqhm5] {
    flex: 1;
    padding: 32px 16px 48px;
    background: var(--calids-color-neutral-100);
}

.card[b-5qpmrtqhm5] {
    max-width: 520px;
    margin: 0 auto;
    padding: 24px;
    border: 1px solid var(--calids-color-neutral-200);
    border-radius: 16px;
    background: var(--calids-color-surface);
    color: var(--color-text-body);
}

    .card h1[b-5qpmrtqhm5] {
        margin: 0;
        font-size: var(--calids-fontsize-h3);
        line-height: 1.3;
    }

    .card > p[b-5qpmrtqhm5] {
        margin: 8px 0 0;
    }

.state[b-5qpmrtqhm5] {
    text-align: center;
    color: var(--calids-color-neutral-700);
}

/* ---------- Status: die eigentliche Antwort ---------- */

.status[b-5qpmrtqhm5] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 20px;
    padding: 12px 14px;
    border-radius: 10px;
    font-weight: 600;
    line-height: 1.3;
}

    .status .material-icons[b-5qpmrtqhm5] {
        font-size: 22px;
    }

.status--valid[b-5qpmrtqhm5] {
    background: var(--calids-color-success-100);
    color: var(--calids-color-success-900);
}

.status--expired[b-5qpmrtqhm5] {
    background: var(--calids-color-warning-100);
    color: var(--calids-color-warning-900);
}

.status--open[b-5qpmrtqhm5] {
    background: var(--calids-color-info-100);
    color: var(--calids-color-info-900);
}

.status--unknown[b-5qpmrtqhm5] {
    background: var(--calids-color-error-100);
    color: var(--calids-color-error-900);
}

/* ---------- Angaben ---------- */

.eyebrow[b-5qpmrtqhm5] {
    margin: 0 0 4px !important;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--calids-color-neutral-600);
}

.serial[b-5qpmrtqhm5] {
    font-size: 15px;
    color: var(--calids-color-neutral-700);
}

.facts[b-5qpmrtqhm5] {
    display: grid;
    grid-template-columns: max-content 1fr;
    gap: 8px 16px;
    margin: 20px 0 24px;
    padding-top: 16px;
    border-top: 1px solid var(--calids-color-neutral-200);
    font-size: 15px;
}

    .facts dt[b-5qpmrtqhm5] {
        color: var(--calids-color-neutral-700);
    }

    .facts dd[b-5qpmrtqhm5] {
        margin: 0;
        overflow-wrap: anywhere;
    }

.note[b-5qpmrtqhm5] {
    margin-top: 16px !important;
    font-size: 13px;
    color: var(--calids-color-neutral-700);
}
/* /Pages/CertificateLabel.razor.rz.scp.css */
/* ---------- Bildschirm: Werkzeugleiste + vergrößerte Vorschau ---------- */

.label-page[b-cpugrp6fd8] {
    max-width: 720px;
    margin: 0 auto;
    padding: 32px 24px 48px;
    color: var(--color-text-body);
}

.toolbar[b-cpugrp6fd8] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 32px;
}

    .toolbar h1[b-cpugrp6fd8] {
        margin: 0 0 4px;
        font-size: var(--calids-fontsize-h2);
    }

.hint[b-cpugrp6fd8],
.note[b-cpugrp6fd8],
.state[b-cpugrp6fd8] {
    margin: 0;
    font-size: 14px;
    color: var(--calids-color-neutral-700);
}

.preview[b-cpugrp6fd8] {
    display: flex;
    justify-content: center;
    padding: 32px 0;
    border-radius: 12px;
    background: var(--calids-color-neutral-100);
}

.details[b-cpugrp6fd8] {
    display: grid;
    grid-template-columns: max-content 1fr;
    gap: 6px 16px;
    margin: 24px 0 8px;
    font-size: 14px;
}

    .details dt[b-cpugrp6fd8] {
        color: var(--calids-color-neutral-700);
    }

    .details dd[b-cpugrp6fd8] {
        margin: 0;
        overflow-wrap: anywhere;
    }

/* ---------- Das Etikett: echte Maße, im Druck 1:1 ---------- */

.label[b-cpugrp6fd8] {
    display: flex;
    align-items: center;
    gap: 2mm;
    box-sizing: border-box;
    width: 50mm;
    height: 30mm;
    padding: 1.5mm 1.5mm 1.5mm 2mm;
    overflow: hidden;
    /* Etikettendrucker sind einfarbig: reines Schwarz auf Weiß. */
    background: #fff;
    color: #000;
    font-family: var(--calids-type-body), Arial, sans-serif;
    line-height: 1.15;
}

    /* 23 mm bei 37 Modulen (Version 5) sind gut 0,6 mm je Modul – für jede
       Handykamera genug. Rundum mindestens 2 mm Weiß, also gut drei Module
       Ruhezone; die restlichen gut 21 mm Breite gehören dem Text. */
    .label[b-cpugrp6fd8]  .qr {
        flex: none;
        width: 23mm;
        height: 23mm;
        color: #000;
    }

.facts[b-cpugrp6fd8] {
    flex: 1;
    min-width: 0;
}

    .facts p[b-cpugrp6fd8] {
        margin: 0;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

.status[b-cpugrp6fd8] {
    font-family: var(--calids-type-heading), Arial, sans-serif;
    font-size: 7.5pt;
    font-weight: 700;
    letter-spacing: 0.02em;
}

.date[b-cpugrp6fd8] {
    font-size: 7.5pt;
    font-weight: 500;
}

.due[b-cpugrp6fd8] {
    margin-bottom: 0.8mm !important;
    font-size: 6.5pt;
    font-weight: 500;
}

.small[b-cpugrp6fd8] {
    font-size: 5.5pt;
}

    /* Labornamen sind lang („… Kalibrierlabor GmbH“) – zwei Zeilen statt
       abgeschnitten nach einer. */
    .facts p.lab[b-cpugrp6fd8] {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        line-clamp: 2;
        white-space: normal;
    }

@media screen {
    /* Vorschau größer als das Original, sonst ist auf dem Bildschirm nichts zu
       erkennen; die Kanten des Etiketts deutet ein Rahmen an. */
    .label[b-cpugrp6fd8] {
        zoom: 2.2;
        outline: 0.2mm dashed var(--calids-color-neutral-400);
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12);
    }
}

@media print {
    .label-page[b-cpugrp6fd8] {
        max-width: none;
        margin: 0;
        padding: 0;
    }

    .preview[b-cpugrp6fd8] {
        display: block;
        padding: 0;
        background: none;
    }
}

/* Nur Bildschirm: Im Druck ist die Seite 50 mm breit und fiele sonst ebenfalls
   unter diese Grenze – das Etikett würde gezoomt gedruckt. */
@media screen and (max-width: 600px) {
    .label-page[b-cpugrp6fd8] {
        padding: 24px 16px 40px;
    }

    .toolbar[b-cpugrp6fd8] {
        flex-direction: column;
    }

    .label[b-cpugrp6fd8] {
        zoom: 1.4;
    }
}
/* /Pages/CompareLabs.razor.rz.scp.css */
/* Füllt die Resthöhe unter der Navbar (.page im MainLayout ist eine Flex-Spalte
   von Bildschirmhöhe, der Seitenfuß liegt darunter). Kopfbereich,
   Filterleiste und Spaltenüberschriften bleiben stehen, nur die Anbieterliste
   scrollt intern. */
main[b-gdmzlzfk5q] {
    flex: 1 1 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 1440px;
    margin: 0 auto;
    box-sizing: border-box;
    background: var(--calids-color-background);
    padding: 24px 32px 8px;
}

/* main ist eine Flex-Spalte, deren Kinder sonst auf volle Breite gestreckt
   werden — für den Wiederholen-Button im Fehlerzustand nicht gewollt.
   ::deep, weil CaliButton eine Kindkomponente ist. */
[b-gdmzlzfk5q] button.retry {
    align-self: flex-start;
}

/* ---------- Kopfbereich (Top Row) ---------- */

.header-row[b-gdmzlzfk5q] {
    display: flex;
    align-items: flex-start;
    gap: 24px;
}

.header-text[b-gdmzlzfk5q] {
    flex: 1;
    min-width: 0;
}

.media[b-gdmzlzfk5q] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 192px;
    height: 192px;
    flex-shrink: 0;
    overflow: hidden;
    border-radius: var(--calids-border-radius-lg);
    border: 2px solid var(--calids-color-outline-variant);
}

    .media img[b-gdmzlzfk5q] {
        width: 100%;
        height: 100%;
        object-fit: contain;
    }

    .media .initials[b-gdmzlzfk5q] {
        font-size: 32px;
        font-weight: 700;
        color: var(--color-text-headings);
    }

.eyebrow[b-gdmzlzfk5q] {
    margin-bottom: 8px;
    font-weight: 500;
    font-size: 20px;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--color-text-body);
}

h1[b-gdmzlzfk5q] {
    margin-bottom: 8px;
}

.specs[b-gdmzlzfk5q] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 8px;
    padding: 0;
    list-style: none;
}

    .specs li[b-gdmzlzfk5q] {
        padding: 2px 10px;
        font-size: 14px;
        color: var(--color-text-body);
        background: var(--calids-color-surface-container-low);
        border-radius: var(--calids-border-radius-full);
    }

.count[b-gdmzlzfk5q] {
    font-size: 20px;
    margin-bottom: 8px;
    color: var(--color-text-body);
    line-height: 28px;
}

/* ---------- Aktive-Filter-Zeile (in der Textspalte, wie im Mockup) ---------- */

.active-filters-row[b-gdmzlzfk5q] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 16px;
}

    .active-filters-row .label[b-gdmzlzfk5q] {
        font-size: 14px;
        font-weight: 500;
        color: var(--color-text-body);
        margin-right: 4px;
    }

        .active-filters-row .v-divider[b-gdmzlzfk5q]{
            margin: 0px 8px;
        }

        .v-divider[b-gdmzlzfk5q] {
            width: 1px;
            align-self: stretch;
            min-height: 20px;
            background: var(--calids-palette-grey-400);
        }

.active-filter-chip[b-gdmzlzfk5q] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px 4px 12px;
    font-size: 14px;
    color: var(--calids-color-primary-500);
    background: var(--calids-color-primary-opacity-08);
    border: 1px solid var(--calids-color-primary-500);
    border-radius: var(--calids-border-radius-lg);
    cursor: pointer;
}


/* ---------- Filterleiste (eigene Karte, immer verfügbar) ---------- */

.filter-bar[b-gdmzlzfk5q] {
    display: flex;
    align-items: stretch;
    gap: 24px;
    margin-top: 24px;
    padding: 16px 24px;
    background: var(--calids-color-surface);
    border: 1px solid var(--calids-palette-grey-400);
    border-radius: var(--calids-border-radius-lg);
}

.filter-group[b-gdmzlzfk5q] {
    flex: 1;
    min-width: 0;
    padding-right: 24px;
    border-right: 1px solid var(--calids-palette-grey-400);
}

    .filter-group:last-child[b-gdmzlzfk5q] {
        padding-right: 0;
        border-right: none;
    }

    .filter-group h3[b-gdmzlzfk5q] {
        display: flex;
        align-items: center;
        gap: 6px;
        margin: 0 0 12px;
        font-size: 16px;
        font-weight: 500;
        line-height: 24px;
        color: var(--color-text-body);
    }

.filter-group-sort[b-gdmzlzfk5q] {
    flex: 0 0 200px;
}

.info-icon[b-gdmzlzfk5q] {
    font-size: 16px;
    color: var(--color-text-body);
    cursor: help;
}

.chip-list[b-gdmzlzfk5q] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.filter-chip[b-gdmzlzfk5q] {
    padding: 6px 14px;
    font-size: 14px;
    color: var(--color-text-body);
    border: 1px solid var(--calids-color-outline-variant);
    border-radius: var(--calids-border-radius-lg);
    cursor: pointer;
}

    .filter-chip:hover[b-gdmzlzfk5q] {
        background: var(--calids-color-surface-container-low);
    }

    .filter-chip.active[b-gdmzlzfk5q] {
        font-weight: 500;
        background: var(--calids-color-primary-opacity-08);
        color: var(--calids-color-primary);
        border-color: var(--calids-color-primary);
    }

.sort-select[b-gdmzlzfk5q] {
    width: 100%;
    padding: 10px 12px;
    font-size: 14px;
    font-weight: 500;
    color: var(--color-text-headings);
    background: var(--calids-color-surface);
    border: 1px solid var(--calids-palette-grey-400);
    border-radius: var(--calids-border-radius-md);
    cursor: pointer;
}

/* ---------- Anbieter-Vergleichsliste ---------- */

/* Kopfzeile und Karten teilen sich dasselbe Grid; unterhalb der Mindestbreite
   scrollt die Liste horizontal, statt dass Spalten umbrechen/verrutschen.
   Vertikal scrollt nur dieser Container – alles darüber bleibt stehen. */
.results-scroll[b-gdmzlzfk5q] {
    flex: 1;
    /* Untergrenze, damit die Liste bei niedrigen Viewports bedienbar bleibt
       (dann scrollt die Seite ausnahmsweise minimal). */
    min-height: 160px;
    overflow: auto;
}

.lab-grid[b-gdmzlzfk5q] {
    display: grid;
    grid-template-columns: minmax(280px, 2.3fr) minmax(180px, 1.25fr) minmax(140px, 1fr) minmax(140px, 1fr) minmax(190px, 1.15fr) minmax(200px, max-content);
    align-items: center;
    min-width: 1130px;
}

.results-head[b-gdmzlzfk5q] {
    /* bleibt beim vertikalen Scrollen oben stehen, scrollt horizontal aber
       mit den Karten mit (Spalten-Alignment bleibt erhalten) */
    position: sticky;
    top: 0;
    z-index: 5;
    background: var(--calids-color-surface);
    padding: 16px 24px 12px;
    /* gleiche Rahmenmetrik wie .lab-card, damit die Spalten exakt fluchten */
    box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0%), 0 1px 3px 1px rgb(0 0 0 / 15%);
    margin-bottom: 12px;
}

.head-label[b-gdmzlzfk5q] {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 14px;
    font-weight: 500;
    line-height: 16px;
    color: var(--color-text-body);
    font-family: var(--calids-type-heading, Montserrat);
}

.results-head .head-label:not(:first-child)[b-gdmzlzfk5q] {
    padding-left: 20px;
}

.no-results[b-gdmzlzfk5q] {
    margin: 0 0 16px;
    padding: 24px;
    text-align: center;
    color: var(--color-text-body);
    background: var(--calids-color-surface);
    border: 1px dashed var(--calids-palette-grey-400);
    border-radius: var(--calids-border-radius-lg);
}

.lab-card[b-gdmzlzfk5q] {
    padding: 16px 24px;
    margin-bottom: 8px;
    background: var(--calids-color-surface);
    border: 1px solid var(--calids-palette-grey-400);
    border-radius: var(--calids-border-radius-lg);
}

    /* Platz 1 wird zusätzlich über eine leichte Elevation hervorgehoben */
    .lab-card.top-match[b-gdmzlzfk5q] {
    }

    .lab-card .cell[b-gdmzlzfk5q] {
        align-self: stretch;
        display: flex;
        flex-direction: column;
        justify-content: center;
        min-width: 0;
    }

        .lab-card .cell:not(.provider)[b-gdmzlzfk5q] {
            padding-left: 24px;
            padding-right: 16px;
            border-left: 1px solid var(--calids-palette-grey-400);
        }

/* --- Spalte 1: Anbieter --- */

.cell.provider[b-gdmzlzfk5q] {
    flex-direction: row;
    align-items: center;
    gap: 24px;
    padding-right: 16px;
    justify-content: flex-start;
}

/* Bildmarke des Anbieters; die Platzziffer sitzt als Badge in der Ecke. */
.brand[b-gdmzlzfk5q] {
    position: relative;
    width: 64px;
    height: 64px;
    flex-shrink: 0;
}

.brand-logo[b-gdmzlzfk5q] {
    display: block;
    width: 64px;
    height: 64px;
    object-fit: contain;
    border-radius: var(--calids-border-radius-lg);
    background: var(--calids-color-surface-container-lowest, #fff);
}

.brand-fallback[b-gdmzlzfk5q] {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    font-weight: 700;
    letter-spacing: 0.5px;
    color: var(--calids-color-primary-500);
    background: var(--calids-color-primary-opacity-08);
}

.rank-badge[b-gdmzlzfk5q] {
    position: absolute;
    top: -7px;
    left: -7px;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 24px;
    height: 24px;
    padding: 0 6px;
    font-size: 13px;
    font-weight: 700;
    line-height: 1;
    color: #fff;
    background: var(--calids-color-primary-500);
    border: 2px solid var(--calids-color-surface-container-lowest, #fff);
    border-radius: 999px;
}

.provider-info[b-gdmzlzfk5q] {
    min-width: 0;
}

    .provider-info h4[b-gdmzlzfk5q] {
        margin: 0 0 4px;
        font-size: 16px;
        color: var(--color-text-headings);
        font-family: var(--calids-type-body);
        line-height: 24px;
        font-weight: 500;
    }

.loc[b-gdmzlzfk5q] {
    display: flex;
    align-items: center;
    gap: 4px;
    margin: 0 0 8px;
    font-size: 12px;
    color: var(--color-text-body);
    line-height: 16px;
    font-weight: 500;
}

    .loc .material-icons[b-gdmzlzfk5q] {
        font-size: 20px;
    }

.ro-chips[b-gdmzlzfk5q] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.ro-chip[b-gdmzlzfk5q] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 8px;
    font-size: 12px;
    color: var(--color-text-on-surface-variant);
    background: var(--calids-color-surface-container-low);
    border: 1px solid var(--calids-palette-grey-400);
    border-radius: var(--calids-border-radius-lg);
}

    .ro-chip .material-icons[b-gdmzlzfk5q] {
        font-size: 16px;
    }

    .ro-chip.missing[b-gdmzlzfk5q] {
        border-style: dashed;
        color: var(--color-text-disabled);
    }

/* --- Wertespalten --- */

.cell-main[b-gdmzlzfk5q] {
    display: flex;
    align-items: center;
    gap: 4px;
    margin: 0 0 2px;
    font-size: 14px;
    font-weight: 500;
    color: var(--color-text-headings);
    line-height: 20px;
}

    .cell-main .material-icons[b-gdmzlzfk5q] {
        font-size: 20px;
        color: var(--calids-color-primary);
    }

    .cell-main.missing[b-gdmzlzfk5q] {
        color: var(--color-text-disabled);
    }

.cell-sub[b-gdmzlzfk5q] {
    margin: 0;
    font-size: 12px;
    color: var(--color-text-body);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    line-height: 16px;
    font-weight: 500;
}

.stars .star[b-gdmzlzfk5q] {
    font-size: 24px;
}

.stars.no-rating .star[b-gdmzlzfk5q] {
    color: var(--calids-palette-grey-400);
}

.stars strong[b-gdmzlzfk5q] {
    margin-left: 4px;
}

/* --- Aktionsspalte --- */

.cell.action[b-gdmzlzfk5q] {
    align-items: flex-end;
    gap: 8px;
}

.best-badge[b-gdmzlzfk5q] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 8px;
    font-size: 12.5px;
    font-weight: 500;
    white-space: nowrap;
    color: var(--calids-color-on-primary-container);
    background: var(--calids-color-primary-opacity-08);
    border-radius: var(--calids-border-radius-lg);
}

    .best-badge .material-icons[b-gdmzlzfk5q] {
        font-size: 20px;
    }

/* ---------- Custom-Anfrage (letztes Listenelement) ---------- */

.cta-card[b-gdmzlzfk5q] {
    display: flex;
    align-items: center;
    gap: 16px;
    /* gleiche Mindestbreite wie .lab-grid, damit die Karte beim
       Querscrollen bündig mit den Anbieterkarten bleibt */
    min-width: 1130px;
    padding: 14px 20px;
    margin-bottom: 16px;
    background: var(--calids-color-surface);
    border: 1px solid var(--calids-color-primary-500);
    border-radius: var(--calids-border-radius-lg);
}

.cta-icon[b-gdmzlzfk5q] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    flex-shrink: 0;
    color: #fff;
    background: var(--calids-color-primary-500);
    border-radius: var(--calids-border-radius-full);
}

    .cta-icon .material-icons[b-gdmzlzfk5q] {
        font-size: 22px;
    }

.cta-text[b-gdmzlzfk5q] {
    flex: 1;
    min-width: 0;
}

    .cta-text h4[b-gdmzlzfk5q] {
        margin: 0 0 2px;
        font-size: 16px;
        color: var(--color-text-headings);
    }

    .cta-text p[b-gdmzlzfk5q] {
        margin: 0;
        font-size: 14px;
        color: var(--color-text-body);
    }

/* ---------- Vertrauens-Leiste (fixiert unter der Liste) ---------- */

.trust-bar[b-gdmzlzfk5q] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 24px;
    padding: 14px 16px 10px;
    background: var(--calids-color-surface);
    border-top: 1px solid var(--calids-palette-grey-400);
}

.trust-item[b-gdmzlzfk5q] {
    display: inline-flex;
    gap: 8px;
    font-size: 14px;
    font-weight: 500;
    color: var(--color-text-headings);
}

    .trust-item .material-icons[b-gdmzlzfk5q] {
        font-size: 20px;
    }

.trust-bar .v-divider[b-gdmzlzfk5q] {
    align-self: center;
    height: 18px;
    min-height: 18px;
}

/* ---------- Responsive ---------- */

@media (max-width: 900px) {
    /* Auf kleinen Screens frisst der gestapelte Kopfbereich zu viel Höhe →
       zurück zum normalen Seiten-Scrollen ohne fixierten Kopf. */
    main[b-gdmzlzfk5q] {
        flex: 0 0 auto;
        display: block;
        min-height: 100vh;
        padding-bottom: 32px;
    }

    .results-scroll[b-gdmzlzfk5q] {
        overflow: visible;
        overflow-x: auto;
    }

    /* Seite scrollt hier normal → Leiste am unteren Viewport-Rand anpinnen */
    .trust-bar[b-gdmzlzfk5q] {
        position: sticky;
        bottom: 0;
        z-index: 5;
    }

    .filter-bar[b-gdmzlzfk5q] {
        flex-direction: column;
        gap: 16px;
    }

    .filter-group[b-gdmzlzfk5q] {
        padding-right: 0;
        border-right: none;
        padding-bottom: 16px;
        border-bottom: 1px solid var(--calids-palette-grey-400);
    }

        .filter-group:last-child[b-gdmzlzfk5q] {
            padding-bottom: 0;
            border-bottom: none;
        }

    .filter-group-sort[b-gdmzlzfk5q] {
        flex: none;
    }
}

@media (max-width: 700px) {
    main[b-gdmzlzfk5q] {
        padding: 20px 16px;
    }

    .header-row[b-gdmzlzfk5q] {
        flex-direction: column;
    }
}

/* ---------- Anbieter-Detail-Dialog ---------- */

/* Als Seitenpanel: fährt rechts herein, die Ergebnisliste bleibt sichtbar.
   Der Hintergrund fängt nur Klicks ab und dunkelt bewusst nicht ab. */
.dlg-backdrop[b-gdmzlzfk5q] {
    position: fixed;
    inset: 0;
    z-index: 1400;
    display: flex;
    justify-content: flex-end;
    background: transparent;
}

.dlg[b-gdmzlzfk5q] {
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 515px;
    height: 100%;
    overflow-y: auto;
    padding: 24px;
    background: var(--calids-color-surface);
    border-top-left-radius: var(--calids-border-radius-xl);
    box-shadow: -12px 0 32px rgba(0, 0, 0, .16);
    animation: dlg-slide-in-b-gdmzlzfk5q 180ms ease-out;
}

@keyframes dlg-slide-in-b-gdmzlzfk5q {
    from {
        transform: translateX(24px);
        opacity: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .dlg[b-gdmzlzfk5q] {
        animation: none;
    }
}

    /* Der Dialog trägt tabindex nur für Escape – kein sichtbarer Fokusrahmen. */
    .dlg:focus[b-gdmzlzfk5q] {
        outline: none;
    }

/* --- Kopf --- */

.dlg-head[b-gdmzlzfk5q] {
    display: flex;
    align-items: flex-start;
    gap: 16px;
}

.dlg-avatar[b-gdmzlzfk5q] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 56px;
    height: 56px;
    color: var(--calids-color-on-primary);
    background: var(--calids-color-primary);
    border-radius: var(--calids-border-radius-lg);
}

    .dlg-avatar .material-icons[b-gdmzlzfk5q] {
        font-size: 28px;
    }

.dlg-headtext[b-gdmzlzfk5q] {
    flex: 1;
    min-width: 0;
}

    .dlg-headtext h2[b-gdmzlzfk5q] {
        margin: 0 0 4px;
        font-size: var(--calids-fontsize-h4);
        line-height: 1.2;
    }

    .dlg-headtext .loc[b-gdmzlzfk5q] {
        display: flex;
        align-items: center;
        gap: 4px;
        margin: 0;
        font-size: 13px;
        color: var(--color-text-body);
    }

        .dlg-headtext .loc .material-icons[b-gdmzlzfk5q] {
            font-size: 16px;
        }

.dlg-close[b-gdmzlzfk5q] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    padding: 0;
    color: var(--color-text-body);
    background: none;
    border: none;
    border-radius: var(--calids-border-radius-full);
    cursor: pointer;
}

    .dlg-close:hover[b-gdmzlzfk5q] {
        background: var(--calids-color-on-surface-opacity-08);
    }

/* --- Merkmal-Kacheln --- */

.dlg-tiles[b-gdmzlzfk5q] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px 16px;
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid var(--calids-color-outline-variant);
}

.dlg-tile[b-gdmzlzfk5q] {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

    .dlg-tile .material-icons[b-gdmzlzfk5q] {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        width: 32px;
        height: 32px;
        font-size: 18px;
        color: var(--calids-color-primary);
        background: var(--calids-color-primary-opacity-08);
        border-radius: var(--calids-border-radius-md);
    }

.tile-main[b-gdmzlzfk5q] {
    margin: 0;
    font-size: 13px;
    font-weight: 600;
    color: var(--color-text-headings);
}

.tile-sub[b-gdmzlzfk5q] {
    margin: 0;
    font-size: 12px;
    color: var(--color-text-body);
}

/* --- Zusammenfassung (Abdeckung) --- */

.dlg-summary[b-gdmzlzfk5q] {
    margin: 20px 0 0;
    padding-top: 20px;
    font-size: 13px;
    line-height: 1.5;
    color: var(--color-text-body);
    border-top: 1px solid var(--calids-color-outline-variant);
}

/* --- Faktenliste --- */

.dlg-facts[b-gdmzlzfk5q] {
    margin: 20px 0 0;
    padding-top: 20px;
    border-top: 1px solid var(--calids-color-outline-variant);
}

.fact[b-gdmzlzfk5q] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 16px;
    padding: 6px 0;
}

    .fact dt[b-gdmzlzfk5q] {
        font-size: 11px;
        font-weight: 500;
        letter-spacing: .04em;
        text-transform: uppercase;
        color: var(--color-text-body);
    }

    .fact dd[b-gdmzlzfk5q] {
        display: flex;
        flex-direction: column;
        align-items: flex-end;
        margin: 0;
        font-size: 14px;
        font-weight: 600;
        text-align: right;
        color: var(--color-text-headings);
    }

.fact-sub[b-gdmzlzfk5q] {
    font-size: 12px;
    font-weight: 400;
    color: var(--color-text-body);
}

.fact .stars[b-gdmzlzfk5q] {
    display: inline-flex;
    align-items: center;
    color: var(--calids-color-primary);
}

    .fact .stars .star[b-gdmzlzfk5q] {
        font-size: 18px;
    }

/* --- Hinweisbox --- */

.dlg-hint[b-gdmzlzfk5q] {
    display: flex;
    gap: 12px;
    margin-top: 20px;
    padding: 14px 16px;
    background: var(--calids-color-surface-container-low);
    border-radius: var(--calids-border-radius-lg);
}

    .dlg-hint > .material-icons[b-gdmzlzfk5q] {
        flex-shrink: 0;
        font-size: 20px;
        color: var(--calids-color-primary);
    }

    .dlg-hint h3[b-gdmzlzfk5q] {
        margin: 0 0 4px;
        font-size: 14px;
    }

    .dlg-hint p[b-gdmzlzfk5q] {
        margin: 0 0 8px;
        font-size: 13px;
        line-height: 1.45;
        color: var(--color-text-body);
    }

    .dlg-hint a[b-gdmzlzfk5q] {
        font-size: 13px;
        font-weight: 600;
    }

/* CaliButton ist eine Kindkomponente → ::deep. margin-top:auto schiebt die
   Hauptaktion bei kurzem Inhalt an den unteren Panelrand. */
.dlg[b-gdmzlzfk5q]  .cali-btn {
    margin-top: auto;
}

/* Mindestabstand zur Hauptaktion, wenn margin-top:auto auf 0 zusammenfaellt */
.dlg-hint[b-gdmzlzfk5q] {
    margin-bottom: 20px;
}

.dlg-foot[b-gdmzlzfk5q] {
    margin: 12px 0 0;
    font-size: 12px;
    line-height: 1.5;
    text-align: center;
    color: var(--color-text-body);
}

@media (max-width: 700px) {
    .dlg[b-gdmzlzfk5q] {
        max-width: none;
        border-top-left-radius: 0;
    }

    .dlg-tiles[b-gdmzlzfk5q] {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* ---------- Profil-Link, weitere Wege ---------- */

.profile-link[b-gdmzlzfk5q] {
    color: inherit;
    text-decoration: none;
}

    .profile-link:hover[b-gdmzlzfk5q] {
        text-decoration: underline;
    }

.ro-chips.extras[b-gdmzlzfk5q] {
    margin-top: 4px;
}

.ro-chip.warn[b-gdmzlzfk5q] {
    color: var(--calids-palette-yellow-vivid-900, #8d5a00);
}

.more-ways[b-gdmzlzfk5q] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 12px;
    margin: 16px 0 0;
    font-size: 13.5px;
}
/* /Pages/ConfirmEmail.razor.rz.scp.css */
/* Dieselbe Karte wie /login und /reset-password: aus der Mail kommend soll man
   sehen, dass man bei derselben Anwendung gelandet ist. */
main[b-ivf9q00ks2] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 48px 16px;
    background: var(--calids-color-surface-container-lowest);
}

.confirm-card[b-ivf9q00ks2] {
    width: 100%;
    max-width: 420px;
    padding: 32px;
    background: var(--calids-color-surface);
    border: 1px solid var(--calids-palette-grey-400);
    border-radius: var(--calids-border-radius-lg);
}

    .confirm-card h1[b-ivf9q00ks2] {
        margin: 0 0 6px;
        font-size: 22px;
    }

.sub[b-ivf9q00ks2] {
    margin: 0 0 20px;
    font-size: 14px;
    line-height: 1.5;
    color: var(--color-text-body);
}

.released[b-ivf9q00ks2] {
    margin: 0 0 20px;
    padding: 10px 12px;
    font-size: 13.5px;
    color: var(--calids-palette-green-900, #0E5814);
    background: var(--calids-palette-green-100, #e3f9e5);
    border-radius: 8px;
}
/* /Pages/Customer/Assets.razor.rz.scp.css */
/* ---------- Seitenkopf ---------- */

.page-head[b-aha8764ujw] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
    padding: 24px 32px 16px;
    background: var(--calids-color-surface);
    border-bottom: 1px solid var(--calids-palette-grey-400);
}

    .page-head h1[b-aha8764ujw] {
        margin: 0 0 4px;
        font-size: 24px;
    }

    .page-head p[b-aha8764ujw] {
        margin: 0;
        font-size: 13.5px;
        color: var(--color-text-body);
    }

.page-body[b-aha8764ujw] {
    padding: 32px;
}

/* ---------- Filter ---------- */

/* Warten Geräte in einem Zustand, ist sein Chip eingefärbt – dieselbe Farbe wie
   die Fälligkeit in der Zeile. Wer die Seite öffnet, sieht so ohne zu lesen, ob
   etwas zu tun ist. */
.list-chip.warn[b-aha8764ujw] {
    color: var(--calids-palette-yellow-vivid-900, #B44D12);
    background: var(--calids-palette-yellow-vivid-100, #FFFBEA);
    border-color: var(--calids-palette-yellow-vivid-200, #FFF3C4);
}

    .list-chip.warn:hover[b-aha8764ujw] {
        border-color: var(--calids-palette-yellow-vivid-900, #B44D12);
    }

/* ---------- Fälligkeit ---------- */

.due[b-aha8764ujw] {
    display: inline-block;
    padding: 4px 10px;
    font-size: 12.5px;
    font-weight: 600;
    white-space: nowrap;
    border-radius: var(--calids-border-radius-full);
    background: var(--calids-color-surface-container-lowest);
    color: var(--color-text-body);
}

    /* Überfällig und bald fällig teilen sich eine Farbe: Beides heißt „kümmern",
       und zwei Alarmstufen nebeneinander nehmen beiden die Wirkung. */
    .due.warn[b-aha8764ujw] {
        color: var(--calids-palette-yellow-vivid-900, #B44D12);
        background: var(--calids-palette-yellow-vivid-200, #FFF3C4);
    }

    .due.good[b-aha8764ujw] {
        color: var(--calids-palette-green-900, #0E5814);
        background: var(--calids-palette-green-100, #e3f9e5);
    }

/* ---------- Zertifikat und Aktionen ---------- */

.cert[b-aha8764ujw] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    color: var(--calids-color-primary-500);
}

    .cert .material-icons[b-aha8764ujw] {
        font-size: 16px;
    }

.link[b-aha8764ujw] {
    padding: 0;
    margin-left: 16px;
    font-family: inherit;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    color: var(--calids-color-primary-500);
    background: none;
    border: none;
    cursor: pointer;
}

    .link:first-child[b-aha8764ujw] {
        margin-left: 0;
    }

/* ---------- Dialog ---------- */

.overlay[b-aha8764ujw] {
    position: fixed;
    inset: 0;
    z-index: 50;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    background: rgba(0, 0, 0, .4);
}

.dialog[b-aha8764ujw] {
    width: 100%;
    max-width: 560px;
    max-height: 90vh;
    overflow-y: auto;
    padding: 24px;
    background: var(--calids-color-surface);
    border-radius: var(--calids-border-radius-lg, 10px);
}

    .dialog h2[b-aha8764ujw] {
        margin: 0 0 20px;
        font-size: 18px;
    }

    .dialog label[b-aha8764ujw] {
        display: block;
        margin-bottom: 14px;
    }

        .dialog label span[b-aha8764ujw] {
            display: block;
            margin-bottom: 4px;
            font-size: 12px;
            font-weight: 600;
            color: var(--color-text-body);
        }

    .dialog input[b-aha8764ujw],
    .dialog textarea[b-aha8764ujw] {
        width: 100%;
        padding: 8px 12px;
        font-family: inherit;
        font-size: 13.5px;
        color: var(--color-text-headings);
        background: var(--calids-color-surface);
        border: 1px solid var(--calids-palette-grey-400);
        border-radius: var(--calids-border-radius-md);
    }

.row[b-aha8764ujw] {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
}

    .row label[b-aha8764ujw] {
        flex: 1 1 160px;
    }

    .row label.narrow[b-aha8764ujw] {
        flex: 0 1 120px;
    }

.form-error[b-aha8764ujw] {
    margin: 0 0 12px;
    font-size: 13px;
    color: var(--calids-palette-red-vivid-900, #a61b1b);
}

.dialog-actions[b-aha8764ujw] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 8px;
}

.spacer[b-aha8764ujw] {
    flex: 1;
}

/* ---------- Responsive ---------- */

@media (max-width: 900px) {
    .page-head[b-aha8764ujw] {
        flex-direction: column;
        padding: 16px;
    }

    .page-body[b-aha8764ujw] {
        padding: 16px;
    }
}

/* ---------- Auswahl und Import ---------- */

.head-actions[b-aha8764ujw] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.select-col[b-aha8764ujw] {
    width: 32px;
}

tr.selected td[b-aha8764ujw] {
    background: var(--calids-color-primary-opacity-08);
}

.selection-bar[b-aha8764ujw] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 16px;
    margin: 0 0 12px;
    padding: 10px 14px;
    font-size: 13.5px;
    font-weight: 600;
    background: var(--calids-color-primary-opacity-08);
    border: 1px solid var(--calids-color-primary-300);
    border-radius: 10px;
}

    .selection-bar .link[b-aha8764ujw] {
        padding: 0;
        font: inherit;
        font-weight: 400;
        color: var(--calids-color-primary-500);
        background: none;
        border: none;
        cursor: pointer;
    }

.dialog.wide[b-aha8764ujw] {
    max-width: 820px;
}

.dialog-sub[b-aha8764ujw] {
    margin: -10px 0 14px;
    font-size: 13px;
    color: var(--color-text-body);
}

    .dialog-sub code[b-aha8764ujw] {
        font-size: 11.5px;
        word-break: break-all;
    }

.file-pick[b-aha8764ujw] {
    position: relative;
    display: inline-flex !important;
    align-items: center;
    padding: 8px 14px;
    font-size: 13.5px;
    font-weight: 600;
    color: var(--calids-color-primary-500);
    border: 1px dashed var(--calids-color-primary-500);
    border-radius: 8px;
    cursor: pointer;
}

    .file-pick[b-aha8764ujw]  input[type=file] {
        position: absolute;
        inset: 0;
        opacity: 0;
        cursor: pointer;
    }

.import-rows[b-aha8764ujw] {
    max-height: 260px;
    margin-bottom: 12px;
    overflow: auto;
    border: 1px solid var(--calids-palette-grey-400);
    border-radius: 8px;
}

    .import-rows tr.skipped td[b-aha8764ujw] {
        color: var(--color-text-body);
        text-decoration: line-through;
    }

.import-ok[b-aha8764ujw] {
    margin: 0 0 10px;
    font-size: 13.5px;
    color: var(--calids-palette-green-900, #0E5814);
}
/* /Pages/Customer/Certificates.razor.rz.scp.css */
/* ---------- Seitenkopf ---------- */

.page-head[b-vl06ki8p8l] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
    padding: 24px 32px 16px;
    background: var(--calids-color-surface);
    border-bottom: 1px solid var(--calids-palette-grey-400);
}

    .page-head h1[b-vl06ki8p8l] {
        margin: 0 0 4px;
        font-size: 24px;
    }

    .page-head p[b-vl06ki8p8l] {
        margin: 0;
        font-size: 13.5px;
        color: var(--color-text-body);
    }

.page-body[b-vl06ki8p8l] {
    padding: 32px;
}

/* ---------- Tabelle ---------- */

/* Jahreszeile zwischen den Scheinen, solange nach Ausstellung sortiert ist. */
.year-row td[b-vl06ki8p8l] {
    padding: 10px 20px;
    font-size: 13px;
    font-weight: 700;
    color: var(--color-text-headings);
    background: var(--calids-color-surface-container-lowest);
}

.icon-cell[b-vl06ki8p8l] {
    width: 1%;
    padding-right: 0;
}

/* Dateikachel statt Icon: Das Kürzel sagt mehr als ein generisches Dokument. */
.file[b-vl06ki8p8l] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .04em;
    color: var(--color-text-body);
    background: var(--calids-color-surface-container-lowest);
    border-radius: var(--calids-border-radius-md);
}

/* Abgelaufene Gültigkeit ist der Grund, warum jemand diese Liste öffnet. */
.plain.expired[b-vl06ki8p8l] {
    font-weight: 600;
    color: var(--calids-palette-red-vivid-900, #a61b1b);
}

.badge[b-vl06ki8p8l] {
    display: inline-block;
    padding: 3px 10px;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: .04em;
    border-radius: var(--calids-border-radius-full);
    background: var(--calids-color-surface-container-lowest);
    color: var(--color-text-body);
}

    .badge.accredited[b-vl06ki8p8l] {
        color: var(--calids-color-primary-500);
        background: var(--calids-color-primary-100);
    }

.open[b-vl06ki8p8l] {
    margin-left: 12px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    color: var(--calids-color-primary-500);
}

    .open .material-icons[b-vl06ki8p8l] {
        font-size: 16px;
    }

/* ---------- Responsive ---------- */

@media (max-width: 900px) {
    .page-head[b-vl06ki8p8l] {
        flex-direction: column;
        padding: 16px;
    }

    .page-body[b-vl06ki8p8l] {
        padding: 16px;
    }
}
/* /Pages/Customer/ComposeInquiry.razor.rz.scp.css */
/* Anfrage zusammenstellen – Karten, Felder und Tabellen kommen aus calibration.css
   (.cal-*), Vorschlagsliste und Hinweise aus marketplace.css (.mp-*). Hier nur,
   was die Seite selbst braucht. */

.compose[b-nd4o79q70e] {
    max-width: 1100px;
}

h2 .step[b-nd4o79q70e] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    margin-right: 10px;
    font-size: 11.5px;
    color: var(--calids-color-surface);
    background: var(--color-text-headings);
    border-radius: 4px;
    vertical-align: 2px;
}

.muted[b-nd4o79q70e] {
    color: var(--color-text-body);
}

.small[b-nd4o79q70e] {
    font-size: 12.5px;
}

p.muted[b-nd4o79q70e] {
    margin: 0;
    font-size: 13.5px;
}

/* ---------- Positionen ---------- */

.positions td[b-nd4o79q70e] {
    vertical-align: middle;
}

.pos-name[b-nd4o79q70e] {
    display: block;
    font-weight: 600;
    color: var(--color-text-headings);
}

.pos-kind[b-nd4o79q70e] {
    display: block;
    font-size: 12px;
    color: var(--color-text-body);
}

.positions .mp-link[b-nd4o79q70e] {
    margin-left: 0;
}

    .positions .mp-link.warn[b-nd4o79q70e] {
        color: var(--calids-palette-yellow-vivid-900, #8d5a00);
    }

.positions select.cal-input[b-nd4o79q70e] {
    min-width: 150px;
}

.positions input.qty[b-nd4o79q70e] {
    width: 72px;
    text-align: right;
}

.icon-btn[b-nd4o79q70e] {
    display: inline-flex;
    padding: 4px;
    color: var(--color-text-body);
    background: none;
    border: none;
    border-radius: 6px;
    cursor: pointer;
}

    .icon-btn:hover[b-nd4o79q70e] {
        background: var(--calids-palette-grey-100);
    }

    .icon-btn .material-icons[b-nd4o79q70e] {
        font-size: 18px;
    }

.add-row[b-nd4o79q70e] {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 10px;
    margin-top: 14px;
}

    .add-row .mp-suggest[b-nd4o79q70e] {
        flex: 1 1 320px;
    }

        .add-row .mp-suggest input[b-nd4o79q70e] {
            width: 100%;
            box-sizing: border-box;
        }

        .add-row .mp-suggest p[b-nd4o79q70e] {
            margin: 6px 0 0;
        }

/* ---------- Gerät beschreiben ---------- */

.describe[b-nd4o79q70e] {
    margin-top: 16px;
    padding: 16px;
    background: var(--calids-palette-grey-100, #f5f7fa);
    border-radius: 10px;
}

    .describe h3[b-nd4o79q70e] {
        margin: 0 0 2px;
        font-size: 14.5px;
    }

    .describe > p.small[b-nd4o79q70e] {
        margin: 0 0 12px;
    }

.fn-row[b-nd4o79q70e] {
    display: grid;
    grid-template-columns: minmax(140px, 1.4fr) repeat(2, minmax(80px, 1fr)) minmax(80px, .8fr) minmax(90px, 1fr) minmax(120px, 1.2fr) auto auto;
    gap: 8px 10px;
    align-items: end;
    margin-bottom: 10px;
}

    .fn-row .ac[b-nd4o79q70e] {
        padding-bottom: 8px;
        white-space: nowrap;
    }

.add-fn[b-nd4o79q70e] {
    margin: 0 0 6px;
}

/* ---------- Adresse ---------- */

.geo[b-nd4o79q70e] {
    margin: 10px 0 0;
}

/* ---------- Labore ---------- */

.lab-options[b-nd4o79q70e] {
    display: grid;
    gap: 8px;
}

.lab-option[b-nd4o79q70e] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    border: 1px solid var(--calids-palette-grey-400);
    border-radius: 8px;
    cursor: pointer;
}

    .lab-option.selected[b-nd4o79q70e] {
        border-color: var(--calids-color-primary-500);
        background: var(--calids-color-primary-opacity-08);
    }

    .lab-option.disabled[b-nd4o79q70e] {
        opacity: .55;
        cursor: default;
    }

    .lab-option input[b-nd4o79q70e] {
        margin: 0;
        flex-shrink: 0;
    }

.lab-text[b-nd4o79q70e] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.lab-name[b-nd4o79q70e] {
    font-size: 14px;
    font-weight: 600;
    color: var(--color-text-headings);
}

.lab-facts[b-nd4o79q70e] {
    font-size: 12.5px;
    color: var(--color-text-body);
}

.lab-profile[b-nd4o79q70e] {
    align-self: flex-start;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--calids-color-primary-500);
}

.coverage[b-nd4o79q70e] {
    margin-left: auto;
    flex-shrink: 0;
    padding: 2px 10px;
    font-size: 12px;
    font-weight: 600;
    border-radius: 999px;
}

    .coverage.full[b-nd4o79q70e] {
        color: var(--calids-palette-green-900, #0E5814);
        background: var(--calids-palette-green-100, #e3f9e5);
    }

    .coverage.partial[b-nd4o79q70e] {
        color: var(--calids-palette-yellow-vivid-900, #8d5a00);
        background: var(--calids-palette-yellow-vivid-100, #FFFBEA);
    }

.stale[b-nd4o79q70e] {
    margin: 0 0 10px;
    padding: 8px 12px;
    font-size: 13px;
    color: #7a4b00;
    background: #fff1d6;
    border-radius: 8px;
}

/* ---------- Absenden ---------- */

.cta[b-nd4o79q70e] {
    border-color: var(--calids-color-primary-300);
}

.terms[b-nd4o79q70e] {
    align-items: flex-start;
    margin-top: 12px;
}

    .terms input[b-nd4o79q70e] {
        margin-top: 3px;
    }

/* ---------- Bestätigung ---------- */

.done[b-nd4o79q70e] {
    max-width: 520px;
    margin: 64px auto;
    padding: 32px;
    text-align: center;
    background: var(--calids-color-surface);
    border: 1px solid var(--calids-palette-grey-400);
    border-radius: 10px;
}

    .done .material-icons[b-nd4o79q70e] {
        font-size: 40px;
        color: var(--calids-palette-green-900, #0e7a34);
    }

    .done h1[b-nd4o79q70e] {
        margin: 12px 0 8px;
        font-size: 22px;
    }

    .done p[b-nd4o79q70e] {
        margin: 0 0 6px;
        font-size: 14px;
        color: var(--color-text-body);
    }

    .done .deadline[b-nd4o79q70e] {
        font-weight: 600;
        color: var(--color-text-headings);
    }

    .done .mail-hint[b-nd4o79q70e] {
        margin-top: 14px;
        padding: 10px 12px;
        text-align: left;
        background: var(--calids-palette-grey-100, #f5f5f5);
        border-radius: 8px;
    }

    .done .primary-link[b-nd4o79q70e],
    .done .back-link[b-nd4o79q70e] {
        display: block;
        margin: 16px auto 0;
        font-size: 14px;
        font-weight: 600;
    }

    .done .back-link[b-nd4o79q70e] {
        font-weight: 400;
        color: var(--color-text-body);
    }

/* Falscher Termin – Meldung direkt unter dem Datumsfeld. */
.field-error[b-nd4o79q70e] {
    font-size: 12px;
    font-weight: 600;
    color: var(--calids-palette-red-vivid-900, #a61b1b);
}

.cal-field input[aria-invalid="true"][b-nd4o79q70e] {
    border-color: var(--calids-palette-red-vivid-800, #ab091e);
}

@media (max-width: 900px) {
    .fn-row[b-nd4o79q70e] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .lab-option[b-nd4o79q70e] {
        flex-wrap: wrap;
    }

    .coverage[b-nd4o79q70e] {
        margin-left: 26px;
    }
}
/* /Pages/Customer/Inquiries.razor.rz.scp.css */
/* Anfragenübersicht des Kunden. Werkzeugleiste, Tabelle und Blättern kommen
   aus css/lists.css – wie bei allen Übersichtslisten; hier steht nur, was
   diese Seite eigen hat. */

/* Kopfleiste wie auf den übrigen Seiten: Sie bleibt beim Scrollen stehen
   (CustomerLayout) und braucht dafür einen eigenen Hintergrund. */
.page-head[b-q8h5ofec66] {
    padding: 24px 32px 16px;
    background: var(--calids-color-surface);
    border-bottom: 1px solid var(--calids-palette-grey-400);
}

    .page-head h1[b-q8h5ofec66] {
        margin: 0 0 4px;
        font-size: 22px;
    }

    .page-head p[b-q8h5ofec66] {
        margin: 0;
        font-size: 14px;
        color: var(--color-text-body);
    }

.page-body[b-q8h5ofec66] {
    padding: 20px 32px 48px;
}

/* Erklärt eine über den Zugangslink begrenzte Sitzung – ohne sie wirkt die
   Liste mit genau einem Eintrag wie ein Fehler. */
.scope-note[b-q8h5ofec66] {
    display: flex;
    gap: 12px;
    align-items: center;
    margin-bottom: 16px;
    padding: 14px 16px;
    background: var(--calids-palette-grey-100, #f5f5f5);
    border: 1px solid var(--calids-palette-grey-400);
    border-radius: var(--calids-border-radius-md, 8px);
}

    .scope-note .main[b-q8h5ofec66] {
        margin: 0 0 2px;
        font-size: 14px;
        font-weight: 600;
        color: var(--color-text-headings);
    }

    .scope-note .sub[b-q8h5ofec66] {
        margin: 0;
        font-size: 13px;
        color: var(--color-text-body);
    }

    .scope-note .scope-action[b-q8h5ofec66] {
        margin-left: auto;
        flex-shrink: 0;
        font-size: 14px;
        font-weight: 600;
    }

.deadline[b-q8h5ofec66] {
    white-space: nowrap;
}

    .deadline.action[b-q8h5ofec66] {
        font-weight: 600;
        color: var(--calids-color-primary-500);
    }

.status[b-q8h5ofec66] {
    display: inline-block;
    padding: 3px 10px;
    font-size: 12px;
    font-weight: 600;
    border-radius: 999px;
    background: var(--calids-palette-grey-200, #eeeeee);
    color: var(--color-text-headings);
}

    .status.good[b-q8h5ofec66] {
        background: var(--calids-palette-green-100, #e3f5e9);
        color: var(--calids-palette-green-900, #0e7a34);
    }

    /* Angebot liegt vor – der Kunde ist am Zug. */
    .status.action[b-q8h5ofec66] {
        background: var(--calids-color-primary-100);
        color: var(--calids-color-primary-500);
    }

    .status.warn[b-q8h5ofec66] {
        background: var(--calids-palette-yellow-100, #fdf3d8);
        color: var(--calids-palette-yellow-900, #7a5b0e);
    }

    .status.muted[b-q8h5ofec66] {
        color: var(--color-text-body);
    }
/* /Pages/Customer/InquiryAccess.razor.rz.scp.css */
/* Zwischenstation beim Einlösen eines Zugangslinks: im Normalfall nur ein
   Wimpernschlag, sichtbar wird sie erst, wenn der Link nicht mehr gilt. */

main[b-ph779d8i70] {
    padding: 24px 32px 48px;
}

.state[b-ph779d8i70] {
    padding: 32px;
    font-size: 14px;
    color: var(--color-text-body);
}

.failed[b-ph779d8i70] {
    max-width: 520px;
    margin: 64px auto;
    padding: 32px;
    text-align: center;
    background: var(--calids-color-surface);
    border: 1px solid var(--calids-palette-grey-400);
    border-radius: var(--calids-border-radius-lg, 10px);
}

    .failed h1[b-ph779d8i70] {
        margin: 0 0 8px;
        font-size: 22px;
    }

    .failed p[b-ph779d8i70] {
        margin: 0 0 6px;
        font-size: 14px;
        color: var(--color-text-body);
    }

    .failed .hint[b-ph779d8i70] {
        margin-top: 12px;
        font-size: 13px;
    }

.primary-link[b-ph779d8i70] {
    display: block;
    margin: 20px auto 0;
    font-size: 14px;
    font-weight: 600;
}

.back-link[b-ph779d8i70] {
    display: block;
    margin: 12px auto 0;
    font-size: 14px;
    color: var(--color-text-body);
}
/* /Pages/Customer/NewInquiry.razor.rz.scp.css */
/* ---------- Zustände ---------- */

.state[b-47bplprnbr] {
    padding: 32px;
    font-size: 14px;
    color: var(--color-text-body);
}

    .state.error[b-47bplprnbr] {
        color: var(--calids-palette-red-vivid-900, #a61b1b);
    }

.back-link[b-47bplprnbr],
.primary-link[b-47bplprnbr] {
    display: inline-block;
    margin: 0 32px;
    font-size: 14px;
}

.done[b-47bplprnbr] {
    max-width: 520px;
    margin: 64px auto;
    padding: 32px;
    text-align: center;
    background: var(--calids-color-surface);
    border: 1px solid var(--calids-palette-grey-400);
    border-radius: var(--calids-border-radius-lg, 10px);
}

    .done .material-icons[b-47bplprnbr] {
        font-size: 40px;
        color: var(--calids-palette-green-900, #0e7a34);
    }

    .done h1[b-47bplprnbr] {
        margin: 12px 0 8px;
        font-size: 22px;
    }

    .done p[b-47bplprnbr] {
        margin: 0 0 6px;
        font-size: 14px;
        color: var(--color-text-body);
    }

    .done .deadline[b-47bplprnbr] {
        font-weight: 600;
        color: var(--color-text-headings);
    }

    .done .primary-link[b-47bplprnbr] {
        display: block;
        margin: 18px auto 0;
        font-weight: 600;
    }

    .done .back-link[b-47bplprnbr] {
        display: block;
        margin: 14px auto 0;
        color: var(--color-text-body);
    }

    /* Hinweis auf die verschickte Mail – die Sicherung des Zugangs. */
    .done .mail-hint[b-47bplprnbr] {
        margin-top: 14px;
        padding: 10px 12px;
        text-align: left;
        background: var(--calids-palette-grey-100, #f5f5f5);
        border-radius: var(--calids-border-radius-md, 8px);
    }

/* Angebot eines Kontos – bewusst NACH der Bestätigung, nicht davor. */
.account-cta[b-47bplprnbr] {
    margin-top: 22px;
    padding-top: 18px;
    border-top: 1px solid var(--calids-palette-grey-400);
}

    .account-cta p[b-47bplprnbr] {
        margin-bottom: 10px;
        font-size: 13px;
    }

    .account-cta a[b-47bplprnbr] {
        font-size: 14px;
        font-weight: 600;
    }

/* ---------- Grundgerüst ---------- */

main[b-47bplprnbr] {
    width: 100%;
    max-width: 1440px;
    margin: 0 auto;
    padding: 24px 32px 48px;
    box-sizing: border-box;
}

.page-head[b-47bplprnbr] {
    margin-bottom: 18px;
}

h1[b-47bplprnbr] {
    margin: 0 0 2px;
    font-size: 26px;
    letter-spacing: -0.01em;
}

.page-sub[b-47bplprnbr] {
    margin: 0;
    font-size: 13.5px;
    color: var(--color-text-body);
}

.target-banner[b-47bplprnbr] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 16px;
    padding: 11px 14px;
    font-size: 13px;
    color: var(--calids-color-primary-700);
    background: var(--calids-color-primary-container);
    border: 1px solid var(--calids-palette-purple-200, #cfbcf2);
    border-radius: var(--calids-border-radius-sm, 8px);
}

    .target-banner .material-icons[b-47bplprnbr] {
        flex: 0 0 auto;
        font-size: 17px;
    }

    .target-banner strong[b-47bplprnbr] {
        font-weight: 700;
    }

.banner.error[b-47bplprnbr] {
    margin: 0 0 16px;
    padding: 10px 14px;
    font-size: 13.5px;
    color: var(--calids-palette-red-vivid-900, #a61b1b);
    background: var(--calids-palette-red-vivid-200, #fde2e2);
    border-radius: var(--calids-border-radius-lg, 10px);
}

.columns[b-47bplprnbr] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 300px;
    gap: 20px;
    align-items: start;
}

.col-form[b-47bplprnbr] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.card[b-47bplprnbr] {
    padding: 16px 18px;
    background: var(--calids-color-surface);
    border: 1px solid var(--calids-palette-grey-400);
    border-radius: var(--calids-border-radius-lg, 10px);
}

/* Schritt-Titel in der Karte: Nummer + Versalien geben dem Formular eine
   erkennbare Reihenfolge. */
.card-title[b-47bplprnbr] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 14px;
    font-size: 12.5px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--color-text-headings);
}

    .card-title .step[b-47bplprnbr] {
        display: inline-flex;
        flex: 0 0 auto;
        align-items: center;
        justify-content: center;
        width: 20px;
        height: 20px;
        font-size: 11.5px;
        letter-spacing: 0;
        color: var(--calids-color-surface);
        background: var(--color-text-headings);
        border-radius: 4px;
    }

    /* „(optional)" gehört zum Titel, soll aber nicht mitschreien. */
    .card-title .optional[b-47bplprnbr] {
        margin-left: -4px;
        font-family: var(--calids-type-body), sans-serif;
        font-size: 13px;
        font-weight: 400;
        letter-spacing: 0;
        text-transform: none;
        color: var(--color-text-body);
    }

.card-head[b-47bplprnbr] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 6px;
}

    .card-head .card-title[b-47bplprnbr] {
        margin: 0;
    }

.card-sub[b-47bplprnbr] {
    margin: 8px 0 0;
    font-size: 12.5px;
    color: var(--color-text-body);
}

/* ---------- 1 Position ---------- */

/* Links Titel und Bild übereinander, rechts das Gerät – so steht der
   Gerätename auf Höhe des Titels statt eine eigene Zeile zu belegen. */
.position[b-47bplprnbr] {
    display: flex;
    flex-direction: row; /* Bootstrap-.card stellt sonst auf Spalte */
    gap: 22px;
}

.position-side[b-47bplprnbr] {
    flex: 0 0 auto;
}

.thumb[b-47bplprnbr] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 72px;
    height: 72px;
    margin-left: 8px;
    padding: 6px;
    box-sizing: border-box;
    background: var(--calids-color-surface);
    border: 1px solid var(--calids-palette-grey-400);
    border-radius: var(--calids-border-radius-sm, 8px);
}

    .thumb img[b-47bplprnbr] {
        max-width: 100%;
        max-height: 100%;
        object-fit: contain;
    }

    .thumb .material-icons[b-47bplprnbr] {
        font-size: 28px;
        color: var(--color-text-body);
    }

.position-text[b-47bplprnbr] {
    flex: 1;
    min-width: 0;
    padding-top: 10px;
}

    .position-text h3[b-47bplprnbr] {
        margin: 0 0 8px;
        font-size: 15px;
        font-weight: 700;
    }

.cal-type[b-47bplprnbr] {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 0 0 10px;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--calids-color-primary-900, #34126f);
}

    .cal-type .material-icons[b-47bplprnbr] {
        font-size: 16px;
    }

/* Einschränkung bei einer Nebenfunktion – Hinweis, keine Warnung. */
.scope-limit[b-47bplprnbr] {
    display: flex;
    align-items: flex-start;
    gap: 6px;
    margin: -4px 0 10px;
    font-size: 12px;
    line-height: 1.4;
    color: var(--calids-palette-yellow-vivid-900, #8d5a00);
}

    .scope-limit .material-icons[b-47bplprnbr] {
        flex: 0 0 auto;
        font-size: 15px;
        margin-top: 1px;
    }

.qty[b-47bplprnbr] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.qty-label[b-47bplprnbr] {
    font-size: 12.5px;
    color: var(--color-text-body);
}

/* Minus, Wert und Plus in einem Rahmen – ein Bedienelement, nicht drei. */
.stepper[b-47bplprnbr] {
    display: inline-flex;
    align-items: center;
    padding: 0 2px;
    border: 1px solid var(--calids-palette-grey-400);
    border-radius: var(--calids-border-radius-xs, 6px);
}

    .stepper button[b-47bplprnbr] {
        width: 22px;
        height: 24px;
        padding: 0;
        font-size: 14px;
        line-height: 1;
        color: var(--color-text-body);
        background: none;
        border: none;
        cursor: pointer;
    }

        .stepper button:disabled[b-47bplprnbr] {
            opacity: 0.35;
            cursor: default;
        }

.qty-value[b-47bplprnbr] {
    min-width: 14px;
    font-size: 13px;
    font-weight: 600;
    text-align: center;
    color: var(--color-text-headings);
}

/* ---------- Felder ---------- */

.field[b-47bplprnbr] {
    margin-bottom: 14px;
}

.field-label[b-47bplprnbr] {
    display: block;
    margin-bottom: 8px;
    font-size: 13px;
    font-weight: 600;
    color: var(--color-text-headings);
}

/* Info-Symbol neben einem Feldtitel – erklärt Fachbegriffe per Tooltip. */
.info-tip[b-47bplprnbr] {
    display: inline-flex;
    vertical-align: -3px;
    margin-left: 2px;
    padding: 0;
    border: 0;
    background: none;
    color: var(--color-text-body);
    cursor: help;
}

    .info-tip .material-icons[b-47bplprnbr] {
        font-size: 16px;
    }

.field-grid[b-47bplprnbr] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px 18px;
    margin-top: 12px;
}

    .field-grid .ffield.full[b-47bplprnbr] {
        grid-column: 1 / -1;
    }

    .field-grid.dates[b-47bplprnbr] {
        margin-top: 20px;
    }

/* Feld mit Beschriftung auf der Rahmenkante – hält die Karten ruhig,
   weil Label und Wert eine Einheit bilden statt zwei Zeilen zu belegen. */
.ffield[b-47bplprnbr] {
    position: relative;
}

    .ffield > label[b-47bplprnbr] {
        position: absolute;
        top: -6px;
        left: 10px;
        z-index: 1;
        padding: 0 5px;
        font-size: 10.5px;
        font-weight: 500;
        line-height: 1;
        white-space: nowrap;
        color: var(--color-text-headings);
        background: var(--calids-color-surface);
    }

input[type="text"][b-47bplprnbr],
input[type="email"][b-47bplprnbr],
input[type="date"][b-47bplprnbr],
input[type="number"][b-47bplprnbr],
select[b-47bplprnbr],
textarea[b-47bplprnbr] {
    box-sizing: border-box;
    width: 100%;
    min-height: 42px;
    padding: 10px 12px;
    font-family: inherit;
    font-size: 13.5px;
    color: var(--color-text-headings);
    background: var(--calids-color-surface);
    border: 1px solid var(--calids-palette-grey-900, #a7b3ba);
    border-radius: var(--calids-border-radius-xs, 6px);
}

    input:focus[b-47bplprnbr],
    select:focus[b-47bplprnbr],
    textarea:focus[b-47bplprnbr] {
        outline: none;
        border-color: var(--calids-color-primary-500);
    }

/* Ruhiger Pfeil statt des Browser-Standards, damit Auswahl und Textfeld
   gleich aussehen. */
select[b-47bplprnbr] {
    appearance: none;
    padding-right: 32px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%23787878' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 12px center;
    cursor: pointer;
}

textarea[b-47bplprnbr] {
    min-height: 0;
    resize: vertical;
}

/* Nur zur Kontrolle angezeigt (Konto-Adresse): sichtbar, aber erkennbar fest. */
input[readonly][b-47bplprnbr] {
    color: var(--color-text-body);
    background: var(--calids-palette-grey-100, #f4f7fb);
    cursor: default;
}

/* ---------- Segmentierte Auswahl ---------- */

/* Ein Raster aus gleich breiten Spalten. In den Rahmenbedingungen ist eine
   Spalte ein Drittel der Kartenbreite (--segs = Anzahl der Knöpfe), damit die
   Knöpfe untereinander bündig stehen, egal wie viele das Labor anbietet. */
.segmented[b-47bplprnbr] {
    display: grid;
    grid-auto-columns: minmax(0, 1fr);
    grid-auto-flow: column;
    border: 1px solid var(--calids-palette-grey-400);
    border-radius: var(--calids-border-radius-xs, 6px);
    overflow: hidden;
}

    .segmented.thirds[b-47bplprnbr] {
        width: calc(var(--segs, 3) * 100% / 3);
    }

.seg[b-47bplprnbr] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-width: 0;
    padding: 9px 12px;
    font-family: inherit;
    font-size: 13px;
    color: var(--color-text-body);
    background: var(--calids-color-surface);
    border: none;
    border-left: 1px solid var(--calids-palette-grey-400);
    cursor: pointer;
    white-space: nowrap;
}

    .seg:first-child[b-47bplprnbr] {
        border-left: none;
    }

    .seg .material-icons[b-47bplprnbr] {
        font-size: 16px;
    }

    .seg.active[b-47bplprnbr] {
        font-weight: 600;
        color: var(--calids-color-primary-900, #34126f);
        background: var(--calids-color-primary-container);
    }

    .seg:disabled[b-47bplprnbr] {
        opacity: 0.4;
        cursor: not-allowed;
    }

/* Logistik: drei längere Beschriftungen, deshalb eine Stufe kleiner. */
.segmented.compact .seg[b-47bplprnbr] {
    padding: 7px 10px;
    font-size: 12px;
}

/* ---------- 3 Messpunkte ---------- */

/* Eine Zeile je Messgröße: links die Größe, rechts ihre Punkte. */
.point-rows[b-47bplprnbr] {
    margin-top: 6px;
}

.point-row[b-47bplprnbr] {
    display: grid;
    grid-template-columns: 150px minmax(0, 1fr);
    align-items: center;
    gap: 12px;
    padding: 10px 0;
    border-top: 1px solid var(--calids-palette-grey-400);
}

    .point-row:first-child[b-47bplprnbr] {
        border-top: none;
    }

.point-group[b-47bplprnbr] {
    font-size: 13.5px;
    font-weight: 600;
    color: var(--color-text-headings);
}

.point-chips[b-47bplprnbr] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.point-chip[b-47bplprnbr] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 5px 14px;
    font-family: inherit;
    font-size: 12px;
    color: var(--color-text-body);
    background: var(--calids-color-surface);
    border: 1px solid var(--calids-palette-grey-400);
    border-radius: var(--calids-border-radius-full, 999px);
    cursor: pointer;
}

    /* Entfernen zeigt sich erst beim Zeigen – die Liste bleibt ruhig. Auf
       Touch-Geräten gibt es kein Zeigen, dort steht das × immer da. */
    .point-chip .remove[b-47bplprnbr] {
        display: none;
        font-size: 13px;
        line-height: 1;
        color: var(--calids-color-primary-700);
    }

    .point-chip:hover[b-47bplprnbr],
    .point-chip:focus-visible[b-47bplprnbr] {
        border-color: var(--calids-color-primary-500);
    }

        .point-chip:hover .remove[b-47bplprnbr],
        .point-chip:focus-visible .remove[b-47bplprnbr] {
            display: inline;
        }

@media (hover: none) {
    .point-chip .remove[b-47bplprnbr] {
        display: inline;
    }
}

.add-point[b-47bplprnbr] {
    display: grid;
    grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    margin-top: 12px;
}

    .add-point.with-frequency[b-47bplprnbr] {
        grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) minmax(0, 1fr) auto;
    }

/* Zahl und Einheit als ein Feld: links der Wert, rechts die Einheit. */
.point-value[b-47bplprnbr] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 78px;
}

    .point-value input[b-47bplprnbr] {
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
    }

    .point-value select[b-47bplprnbr] {
        border-left: 0;
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
    }

/* Keine Pfeiltasten im Zahlenfeld – sie verleiten zu 1er-Schritten. */
input[type="number"][b-47bplprnbr] {
    -moz-appearance: textfield;
    appearance: textfield;
}

    input[type="number"][b-47bplprnbr]::-webkit-inner-spin-button,
    input[type="number"][b-47bplprnbr]::-webkit-outer-spin-button {
        -webkit-appearance: none;
        margin: 0;
    }

.point-hint[b-47bplprnbr] {
    margin: 6px 0 0;
    font-size: 12px;
    color: var(--color-text-body);
}

    .point-hint.error[b-47bplprnbr] {
        color: var(--calids-palette-red-vivid-900, #a61b1b);
    }

/* Falsche oder fehlende Eingabe – Meldung direkt unter dem Feld. */
.field-error[b-47bplprnbr] {
    margin: 6px 0 0;
    font-size: 12px;
    font-weight: 600;
    color: var(--calids-palette-red-vivid-900, #a61b1b);
}

input[aria-invalid="true"][b-47bplprnbr] {
    border-color: var(--calids-palette-red-vivid-800, #ab091e);
}

/* ---------- 4 Logistik ---------- */

/* Abhol- und Rücksendeadresse nebeneinander; fertige Adressen stehen als
   Text da und werden nur auf Wunsch wieder zum Formular. */
.addr-cols[b-47bplprnbr] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    margin-top: 16px;
}

.addr-head[b-47bplprnbr] {
    margin: 0 0 8px;
    font-size: 14px;
    color: var(--color-text-headings);
}

.addr-text[b-47bplprnbr] {
    margin: 0 0 4px;
    font-size: 12px;
    line-height: 1.5;
    color: var(--color-text-body);
}

    .addr-text strong[b-47bplprnbr] {
        display: block;
        font-weight: 600;
        color: var(--color-text-headings);
    }

.required[b-47bplprnbr] {
    font-weight: 700;
    color: var(--calids-palette-red-vivid-800, #ab091e);
}

/* Textknopf, der wie ein Link aussieht (Ändern / Abweichende Adresse). */
.link[b-47bplprnbr] {
    padding: 0;
    font-family: inherit;
    font-size: 12px;
    font-weight: 500;
    color: var(--calids-color-primary-700);
    background: none;
    border: none;
    cursor: pointer;
}

    .link:hover[b-47bplprnbr] {
        text-decoration: underline;
    }

/* ---------- 6 Absenden ---------- */
/* Letzte Karte in der Markenfarbe: Der Abschluss soll sich vom Formular
   abheben, und die Kontaktadresse gehört zu ihm, nicht zwischen die Felder. */
.cta[b-47bplprnbr] {
    background: var(--calids-color-primary-container);
    border-color: var(--calids-palette-purple-200, #cfbcf2);
}

    .cta .card-title[b-47bplprnbr] {
        margin-bottom: 12px;
        font-size: 13.5px;
        letter-spacing: 0;
        text-transform: none;
        color: var(--calids-color-primary-900, #34126f);
    }

    .cta .ffield[b-47bplprnbr] {
        margin-top: 14px;
    }

        /* Label auf der Rahmenkante: Hintergrund wie das Feld, nicht wie die Karte. */
        .cta .ffield > label[b-47bplprnbr] {
            background: var(--calids-color-surface);
        }

.cta-sub[b-47bplprnbr] {
    margin: 0;
    font-size: 12px;
    color: var(--color-text-headings);
}

.cta-hint[b-47bplprnbr] {
    margin: 8px 0 14px;
    font-size: 11.5px;
    color: var(--color-text-headings);
}

.cta-points[b-47bplprnbr] {
    margin: 12px 0 14px;
    padding: 0;
    list-style: none;
}

    .cta-points li[b-47bplprnbr] {
        display: flex;
        align-items: center;
        gap: 6px;
        margin-bottom: 8px;
        font-size: 11.5px;
        line-height: 1.4;
        color: var(--color-text-headings);
    }

    .cta-points .material-icons[b-47bplprnbr] {
        flex: 0 0 auto;
        font-size: 16px;
        color: var(--calids-color-primary-900, #34126f);
    }

/* Knopf in Textbreite – die Bootstrap-.card würde ihn sonst strecken. */
.cta-action[b-47bplprnbr] {
    display: flex;
}

.cta-note[b-47bplprnbr] {
    margin: 12px 0 0;
    font-size: 11.5px;
    line-height: 1.4;
    color: var(--color-text-headings);
}

/* Kurzfassung nach dem Sendeversuch – jeder Punkt springt zu seinem Feld. */
.validation[b-47bplprnbr] {
    margin: 10px 0 0;
    font-size: 12px;
    color: var(--calids-palette-red-vivid-900, #a61b1b);
}

    .validation p[b-47bplprnbr] {
        margin: 0 0 4px;
        font-weight: 600;
    }

    .validation ul[b-47bplprnbr] {
        margin: 0;
        padding-left: 18px;
    }

    .validation .link[b-47bplprnbr] {
        font-size: 12px;
        text-align: left;
        color: inherit;
        text-decoration: underline;
    }

/* Zustimmung fehlt: Meldung unter dem Text, auf Höhe des Texts statt des Kästchens. */
.terms-check + .field-error[b-47bplprnbr] {
    padding-left: 21px;
}

.terms-check input[aria-invalid="true"][b-47bplprnbr] {
    outline: 2px solid var(--calids-palette-red-vivid-800, #ab091e);
    outline-offset: 1px;
}

/* ---------- Zusammenfassung ---------- */

.col-summary[b-47bplprnbr] {
    position: sticky;
    top: 84px;
}

.summary-label[b-47bplprnbr] {
    margin: 0 0 10px;
    font-family: var(--calids-type-heading), sans-serif;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--color-text-headings);
}

.summary h2[b-47bplprnbr] {
    margin: 0;
    padding-bottom: 8px;
    font-size: 15px;
    font-weight: 700;
}

.summary dl[b-47bplprnbr] {
    margin: 0 0 14px;
}

    .summary dl > div[b-47bplprnbr] {
        display: flex;
        justify-content: space-between;
        align-items: baseline;
        gap: 12px;
        padding: 8px 0;
        border-top: 1px solid var(--calids-palette-grey-400);
    }

.summary dt[b-47bplprnbr] {
    flex: 0 0 auto;
    font-size: 12.5px;
    color: var(--color-text-body);
}

.summary dd[b-47bplprnbr] {
    margin: 0;
    font-size: 12.5px;
    font-weight: 600;
    text-align: right;
    color: var(--color-text-headings);
}

/* ---------- Vertrauens-Kacheln ---------- */

.trust[b-47bplprnbr] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin: 0;
    padding: 12px;
    list-style: none;
    background: var(--calids-color-primary-container);
    border-radius: var(--calids-border-radius-sm, 8px);
}

    .trust .material-icons[b-47bplprnbr] {
        font-size: 18px;
        color: var(--calids-color-primary-700);
    }

.trust-title[b-47bplprnbr] {
    margin: 4px 0 2px;
    font-size: 10.5px;
    font-weight: 700;
    line-height: 1.25;
    color: var(--color-text-headings);
}

.trust-text[b-47bplprnbr] {
    margin: 0;
    font-size: 9.5px;
    line-height: 1.35;
    color: var(--color-text-body);
}

/* ---------- Schmale Fenster ---------- */

@media (max-width: 1000px) {
    .columns[b-47bplprnbr] {
        grid-template-columns: minmax(0, 1fr);
    }

    .col-summary[b-47bplprnbr] {
        position: static;
    }

    .addr-cols[b-47bplprnbr] {
        grid-template-columns: minmax(0, 1fr);
        gap: 18px;
    }
}

@media (max-width: 600px) {
    main[b-47bplprnbr] {
        padding: 20px 16px 40px;
    }

    .segmented.thirds[b-47bplprnbr] {
        width: 100%;
    }

    .field-grid[b-47bplprnbr],
    .add-point[b-47bplprnbr],
    .add-point.with-frequency[b-47bplprnbr] {
        grid-template-columns: minmax(0, 1fr);
    }

    .point-row[b-47bplprnbr] {
        grid-template-columns: minmax(0, 1fr);
        gap: 6px;
    }

    .seg[b-47bplprnbr] {
        white-space: normal;
    }
}

/* ---------- Weitere Geräte, Zustimmung (Gast), Hinweis Anhänge ---------- */

.more-devices[b-47bplprnbr] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-top: 12px;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--calids-color-primary-500);
}

    .more-devices .material-icons[b-47bplprnbr] {
        font-size: 16px;
    }

.terms-check[b-47bplprnbr] {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin: 14px 0 0;
    font-size: 13px;
    color: var(--color-text-headings);
}

    .terms-check input[b-47bplprnbr] {
        margin-top: 3px;
        flex-shrink: 0;
    }

.done .attach-hint[b-47bplprnbr] {
    margin-top: 6px;
    font-size: 12.5px;
}

/* „Ihre Referenz“ unter der Nachricht. */
input.reference[b-47bplprnbr] {
    margin-top: 8px;
}
/* /Pages/Customer/OrderDetail.razor.rz.scp.css */
/* Nur Seitenkopf und Ladezustände – der Seitenkörper und die Bausteine
   (Components/Orders) kommen aus wwwroot/css/orders.css, gemeinsam mit der
   Auftragsseite des Labors. */

/* ---------- Seitenkopf ---------- */

.page-head[b-84891w3o4o] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px 24px;
    padding: 24px 32px 16px;
    background: var(--calids-color-surface);
    border-bottom: 1px solid var(--calids-palette-grey-400);
}

    .page-head h1[b-84891w3o4o] {
        margin: 4px 0 2px;
        font-size: 22px;
    }

    .page-head p[b-84891w3o4o] {
        margin: 0;
        font-size: 13px;
        color: var(--color-text-body);
    }

/* Status und Aktionen rechts, umbrechend statt gequetscht. */
.head-side[b-84891w3o4o] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 8px 12px;
}

.back-link[b-84891w3o4o] {
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    color: var(--calids-color-primary-500);
}

.state[b-84891w3o4o] {
    padding: 32px;
    font-size: 14px;
    color: var(--color-text-body);
}

.missing[b-84891w3o4o] {
    padding: 48px 32px;
}

    .missing h1[b-84891w3o4o] {
        margin: 0 0 8px;
        font-size: 22px;
    }

    .missing p[b-84891w3o4o] {
        margin: 0 0 16px;
        font-size: 14px;
        color: var(--color-text-body);
    }

/* ---------- Status ---------- */

.status[b-84891w3o4o] {
    padding: 4px 12px;
    font-size: 11.5px;
    font-weight: 600;
    white-space: nowrap;
    border-radius: var(--calids-border-radius-full);
    color: var(--calids-color-primary-500);
    background: var(--calids-color-primary-100);
}

    .status.good[b-84891w3o4o] {
        color: var(--calids-palette-green-900, #0E5814);
        background: var(--calids-palette-green-100, #e3f9e5);
    }

    .status.muted[b-84891w3o4o] {
        color: var(--color-text-body);
        background: var(--calids-color-surface-container-lowest);
    }

/* ---------- Responsive ---------- */

@media (max-width: 1000px) {
    .page-head[b-84891w3o4o] {
        padding: 16px;
    }
}

@media (max-width: 600px) {
    .page-head[b-84891w3o4o] {
        flex-direction: column;
    }

    .head-side[b-84891w3o4o] {
        justify-content: flex-start;
    }
}
/* /Pages/Customer/Orders.razor.rz.scp.css */
/* ---------- Seitenkopf ---------- */

.page-head[b-nrncc2mcky] {
    padding: 24px 32px 16px;
    background: var(--calids-color-surface);
    border-bottom: 1px solid var(--calids-palette-grey-400);
}

    .page-head h1[b-nrncc2mcky] {
        margin: 0 0 4px;
        font-size: 24px;
    }

    .page-head p[b-nrncc2mcky] {
        margin: 0;
        font-size: 13.5px;
        color: var(--color-text-body);
    }

.page-body[b-nrncc2mcky] {
    padding: 32px;
}

/* ---------- Auftragskarte ---------- */

.order[b-nrncc2mcky] {
    padding: 20px 24px;
    background: var(--calids-color-surface);
    border: 1px solid var(--calids-palette-grey-400);
    border-radius: var(--calids-border-radius-lg, 10px);
}

    .order + .order[b-nrncc2mcky] {
        margin-top: 16px;
    }

    /* Die ganze Karte öffnet den Auftrag (css/lists.css, .link-card). */
    .order:hover[b-nrncc2mcky] {
        border-color: var(--calids-color-primary-500);
    }

.order-head[b-nrncc2mcky] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 16px;
}

    .order-head h2[b-nrncc2mcky] {
        margin: 0 0 2px;
        font-size: 16px;
    }

.meta[b-nrncc2mcky] {
    margin: 0;
    font-size: 12.5px;
    color: var(--color-text-body);
}

.status[b-nrncc2mcky] {
    padding: 4px 12px;
    font-size: 11.5px;
    font-weight: 600;
    white-space: nowrap;
    border-radius: var(--calids-border-radius-full);
    color: var(--calids-color-primary-500);
    background: var(--calids-color-primary-100);
}

    .status.good[b-nrncc2mcky] {
        color: var(--calids-palette-green-900, #0E5814);
        background: var(--calids-palette-green-100, #e3f9e5);
    }

    .status.muted[b-nrncc2mcky] {
        color: var(--color-text-body);
        background: var(--calids-color-surface-container-lowest);
    }

.cancelled[b-nrncc2mcky] {
    margin: 0 0 16px;
    font-size: 13px;
    color: var(--color-text-body);
}

/* ---------- Fortschrittskette ---------- */

.steps[b-nrncc2mcky] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 18px;
    padding: 0;
    list-style: none;
}

    .steps li[b-nrncc2mcky] {
        display: flex;
        align-items: center;
        gap: 8px;
    }

        /* Verbindungslinie zwischen den Stationen – als Pseudoelement, damit
           die Kette beim Umbrechen nicht auseinanderfällt. */
        .steps li + li[b-nrncc2mcky]::before {
            content: "";
            width: 28px;
            height: 1px;
            background: var(--calids-palette-grey-400);
        }

.marker[b-nrncc2mcky] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    font-size: 11px;
    font-weight: 700;
    border-radius: var(--calids-border-radius-full);
    color: var(--color-text-body);
    background: var(--calids-color-surface-container-lowest);
    border: 1px solid var(--calids-palette-grey-400);
}

.label[b-nrncc2mcky] {
    font-size: 12.5px;
    color: var(--color-text-body);
}

.steps .done .marker[b-nrncc2mcky] {
    color: #fff;
    background: var(--calids-palette-green-900, #0E5814);
    border-color: var(--calids-palette-green-900, #0E5814);
}

.steps .current .marker[b-nrncc2mcky] {
    color: #fff;
    background: var(--calids-color-primary-500);
    border-color: var(--calids-color-primary-500);
}

.steps .current .label[b-nrncc2mcky] {
    font-weight: 700;
    color: var(--color-text-headings);
}

/* ---------- Eckdaten ---------- */

.facts[b-nrncc2mcky] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}

.fact[b-nrncc2mcky] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 12px 14px;
    background: var(--calids-color-surface-container-lowest);
    border-radius: var(--calids-border-radius-md);
}

.key[b-nrncc2mcky] {
    font-size: 11.5px;
    color: var(--color-text-body);
}

.value[b-nrncc2mcky] {
    font-size: 13.5px;
    font-weight: 700;
    color: var(--color-text-headings);
}

.actions[b-nrncc2mcky] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

/* ---------- Responsive ---------- */

@media (max-width: 900px) {
    .page-head[b-nrncc2mcky] {
        padding: 16px;
    }

    .page-body[b-nrncc2mcky] {
        padding: 16px;
    }

    .order[b-nrncc2mcky] {
        padding: 16px;
    }
}
/* /Pages/Customer/RequestDetail.razor.rz.scp.css */
/* Anfrage-Detail aus Kundensicht: oben der Zustand des laufenden Versuchs,
   darunter die Daten – in dieser Reihenfolge, weil der Kunde mit einer Frage
   herkommt („Was ist draus geworden?"), nicht mit dem Wunsch nachzulesen. */

.state[b-g776ykhe5d] {
    padding: 32px;
    font-size: 14px;
    color: var(--color-text-body);
}

.missing[b-g776ykhe5d] {
    max-width: 520px;
    margin: 64px auto;
    padding: 32px;
    text-align: center;
    background: var(--calids-color-surface);
    border: 1px solid var(--calids-palette-grey-400);
    border-radius: var(--calids-border-radius-lg, 10px);
}

/* Kopfleiste wie auf den übrigen Seiten: Sie bleibt beim Scrollen stehen
   (CustomerLayout) und braucht dafür einen eigenen Hintergrund. */
.page-head[b-g776ykhe5d] {
    padding: 24px 32px 16px;
    background: var(--calids-color-surface);
    border-bottom: 1px solid var(--calids-palette-grey-400);
}

    .page-head h1[b-g776ykhe5d] {
        margin: 0 0 4px;
        font-size: 22px;
    }

    .page-head p[b-g776ykhe5d] {
        margin: 0;
        font-size: 14px;
        color: var(--color-text-body);
    }

.page-body[b-g776ykhe5d] {
    max-width: 760px;
    padding: 20px 32px 48px;
}

.scope-note[b-g776ykhe5d] {
    display: flex;
    gap: 12px;
    align-items: center;
    margin-bottom: 16px;
    padding: 14px 16px;
    background: var(--calids-palette-grey-100, #f5f5f5);
    border: 1px solid var(--calids-palette-grey-400);
    border-radius: var(--calids-border-radius-md, 8px);
}

    .scope-note .main[b-g776ykhe5d] {
        margin: 0 0 2px;
        font-size: 14px;
        font-weight: 600;
        color: var(--color-text-headings);
    }

    .scope-note .sub[b-g776ykhe5d] {
        margin: 0;
        font-size: 13px;
        color: var(--color-text-body);
    }

    .scope-note .scope-action[b-g776ykhe5d] {
        margin-left: auto;
        flex-shrink: 0;
        font-size: 14px;
        font-weight: 600;
    }

.card[b-g776ykhe5d] {
    margin-bottom: 16px;
    padding: 20px;
    background: var(--calids-color-surface);
    border: 1px solid var(--calids-palette-grey-400);
    border-radius: var(--calids-border-radius-lg, 10px);
}

    .card h2[b-g776ykhe5d] {
        margin: 0 0 12px;
        font-size: 16px;
    }

    .card h3[b-g776ykhe5d] {
        margin: 0 0 10px;
        font-size: 14px;
    }

.status-card .lab[b-g776ykhe5d] {
    margin: 0 0 2px;
    font-size: 18px;
    font-weight: 600;
    color: var(--color-text-headings);
}

.plain[b-g776ykhe5d] {
    margin: 0;
    font-size: 14px;
    color: var(--color-text-body);
}

.status-card .deadline[b-g776ykhe5d] {
    margin: 8px 0 0;
    font-size: 14px;
    font-weight: 600;
    color: var(--color-text-headings);
}

.status-card .reason[b-g776ykhe5d] {
    margin: 8px 0 0;
    font-size: 13px;
    color: var(--color-text-body);
}

/* ---------- Angebot ---------- */

.quote[b-g776ykhe5d] {
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid var(--calids-palette-grey-400);
}

    .quote dl[b-g776ykhe5d] {
        display: grid;
        grid-template-columns: minmax(140px, auto) 1fr;
        gap: 6px 16px;
        margin: 0;
        font-size: 14px;
    }

    .quote dt[b-g776ykhe5d] {
        color: var(--color-text-body);
    }

    .quote dd[b-g776ykhe5d] {
        margin: 0;
        color: var(--color-text-headings);
    }

    .quote .price[b-g776ykhe5d] {
        font-size: 17px;
        font-weight: 600;
    }

    .quote .notes[b-g776ykhe5d] {
        margin: 12px 0 0;
        font-size: 13px;
        color: var(--color-text-body);
    }

    .quote .hint[b-g776ykhe5d] {
        margin: 10px 0 0;
        font-size: 12px;
        color: var(--color-text-body);
    }

    .quote h3 .revision[b-g776ykhe5d] {
        margin-left: 6px;
        font-size: 12px;
        font-weight: 400;
        color: var(--color-text-body);
    }

    .quote h4[b-g776ykhe5d] {
        margin: 18px 0 8px;
        font-size: 13.5px;
        color: var(--color-text-headings);
    }

/* Zugesagte Messpunkte: gleiche Spalten wie die Angebotsdaten darüber. */
.quote-item + .quote-item[b-g776ykhe5d] {
    margin-top: 10px;
}

.quote-item .item-name[b-g776ykhe5d] {
    margin: 0 0 6px;
    font-size: 13px;
    font-weight: 600;
    color: var(--color-text-headings);
}

.quote .quote-points[b-g776ykhe5d] {
    font-size: 13.5px;
}

.small[b-g776ykhe5d] {
    margin: 0;
    font-size: 13px;
}

/* Ein Wunschpunkt fehlt im Angebot – das muss vor der Annahme auffallen. */
.points-missing[b-g776ykhe5d] {
    display: flex;
    align-items: flex-start;
    gap: 6px;
    margin: 8px 0 0;
    padding: 8px 10px;
    font-size: 13px;
    color: var(--color-text-headings);
    background: var(--calids-palette-yellow-vivid-100);
    border-radius: var(--calids-border-radius-sm, 6px);
}

    .points-missing .material-icons[b-g776ykhe5d] {
        font-size: 16px;
        color: var(--calids-palette-yellow-vivid-900);
    }

.deviations[b-g776ykhe5d] {
    margin-top: 12px;
    padding: 10px 12px;
    font-size: 13px;
    color: var(--color-text-headings);
    border-left: 3px solid var(--calids-palette-yellow-vivid-600);
    background: var(--calids-color-surface-container-lowest);
    border-radius: var(--calids-border-radius-sm, 6px);
}

    .deviations p[b-g776ykhe5d] {
        margin: 0;
    }

    .deviations .label[b-g776ykhe5d] {
        margin-bottom: 2px;
        font-weight: 600;
    }

/* ---------- Entscheidung ---------- */

.decision[b-g776ykhe5d] {
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid var(--calids-palette-grey-400);
}

.decision-actions[b-g776ykhe5d] {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.confirm[b-g776ykhe5d] {
    padding: 14px 16px;
    background: var(--calids-color-primary-opacity-08);
    border: 1px solid var(--calids-color-primary-300);
    border-radius: var(--calids-border-radius-md, 8px);
}

    .confirm.reject[b-g776ykhe5d] {
        background: var(--calids-palette-red-vivid-100);
        border-color: var(--calids-palette-red-vivid-300);
    }

.confirm-title[b-g776ykhe5d] {
    margin: 0 0 4px;
    font-size: 14px;
    font-weight: 600;
    color: var(--color-text-headings);
}

.confirm-body[b-g776ykhe5d] {
    margin: 0 0 12px;
    font-size: 13.5px;
    color: var(--color-text-body);
}

/* Ablehnungsgrund: Auswahl und Ergänzung über den Knöpfen. */
.reject-reason[b-g776ykhe5d] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin: 0 0 8px;
    font-size: 13px;
    color: var(--color-text-body);
}

    .reject-reason select[b-g776ykhe5d],
    .reject-text[b-g776ykhe5d] {
        width: 100%;
        padding: 6px 10px;
        font: inherit;
        font-size: 13.5px;
        border: 1px solid var(--calids-palette-grey-400);
        border-radius: var(--calids-border-radius-sm, 6px);
        background: var(--calids-color-surface);
        color: var(--color-text-headings);
    }

.reject-text[b-g776ykhe5d] {
    margin: 0 0 12px;
    resize: vertical;
}

.expired[b-g776ykhe5d] {
    margin: 0 0 12px;
    font-size: 13px;
    color: var(--calids-palette-red-vivid-900, #a61b1b);
}

.decision-error[b-g776ykhe5d] {
    margin: 10px 0 0;
    font-size: 13px;
    color: var(--calids-palette-red-vivid-900, #a61b1b);
}

.order-link[b-g776ykhe5d] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-top: 10px;
    font-size: 14px;
    font-weight: 600;
}

    .order-link .material-icons[b-g776ykhe5d] {
        font-size: 18px;
    }

/* ---------- Nächstes Labor ---------- */

.lab-options[b-g776ykhe5d] {
    display: grid;
    gap: 8px;
    margin-bottom: 14px;
}

.lab-option[b-g776ykhe5d] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    border: 1px solid var(--calids-palette-grey-400);
    border-radius: var(--calids-border-radius-md, 8px);
    cursor: pointer;
}

    .lab-option.selected[b-g776ykhe5d] {
        border-color: var(--calids-color-primary-500);
        background: var(--calids-color-primary-opacity-08);
    }

    .lab-option input[b-g776ykhe5d] {
        margin: 0;
        flex-shrink: 0;
    }

.lab-text[b-g776ykhe5d] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.lab-name[b-g776ykhe5d] {
    font-size: 14px;
    font-weight: 600;
    color: var(--color-text-headings);
}

.lab-facts[b-g776ykhe5d] {
    font-size: 12.5px;
    color: var(--color-text-body);
}

.coverage[b-g776ykhe5d] {
    margin-left: auto;
    flex-shrink: 0;
    padding: 2px 10px;
    font-size: 12px;
    border-radius: var(--calids-border-radius-full, 999px);
}

    .coverage.ok[b-g776ykhe5d] {
        color: var(--calids-palette-green-900);
        background: var(--calids-palette-green-100);
    }

    .coverage.partial[b-g776ykhe5d] {
        color: var(--calids-palette-yellow-vivid-900);
        background: var(--calids-palette-yellow-vivid-100);
    }

/* ---------- Verlauf ---------- */

.history[b-g776ykhe5d] {
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: 14px;
}

    .history li[b-g776ykhe5d] {
        display: flex;
        gap: 10px;
        padding: 8px 0;
        border-bottom: 1px solid var(--calids-palette-grey-300, #e0e0e0);
    }

    .history li:last-child[b-g776ykhe5d] {
        border-bottom: none;
    }

    .history .no[b-g776ykhe5d] {
        min-width: 76px;
        color: var(--color-text-body);
    }

    .history .who[b-g776ykhe5d] {
        font-weight: 600;
        color: var(--color-text-headings);
    }

    .history .what[b-g776ykhe5d] {
        margin-left: auto;
        color: var(--color-text-body);
    }

/* ---------- Anfragedaten ---------- */

/* Unterüberschriften der Anfragedaten – gleiche Gliederung wie im Formular. */
.card h3.section-head[b-g776ykhe5d] {
    margin: 20px 0 8px;
    padding-top: 16px;
    border-top: 1px solid var(--calids-palette-grey-300, #e0e0e0);
}

.item + .item[b-g776ykhe5d] {
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--calids-palette-grey-300, #e0e0e0);
}

.item-name[b-g776ykhe5d] {
    margin: 0 0 8px;
    font-size: 14px;
    font-weight: 600;
    color: var(--color-text-headings);
}

/* Beschriftung links, Wert rechts – eine Spalte breit genug für die längste
   Beschriftung („Gewünschter Kalibriertermin"). */
.facts[b-g776ykhe5d] {
    display: grid;
    grid-template-columns: minmax(180px, max-content) 1fr;
    gap: 6px 16px;
    margin: 0;
    font-size: 14px;
}

    .facts dt[b-g776ykhe5d] {
        font-weight: 400; /* Bootstrap setzt dt fett – die Werte sollen hervorstechen */
        color: var(--color-text-body);
    }

    .facts dd[b-g776ykhe5d] {
        margin: 0;
        color: var(--color-text-headings);
    }

.point-lines[b-g776ykhe5d] {
    margin: 0;
    padding: 0;
    list-style: none;
}

.muted[b-g776ykhe5d] {
    color: var(--color-text-body);
}

.message[b-g776ykhe5d] {
    margin: 0;
    padding: 12px;
    font-size: 14px;
    white-space: pre-wrap;
    background: var(--calids-palette-grey-100, #f5f5f5);
    border-radius: var(--calids-border-radius-md, 8px);
}

/* ---------- Rückfragen ---------- */

.card-sub[b-g776ykhe5d] {
    margin: -6px 0 12px;
    font-size: 13px;
    color: var(--color-text-body);
}

/* Offene Rückfrage: Der Kunde ist am Zug – die Karte hebt sich ab. */
.thread.open[b-g776ykhe5d] {
    border-color: var(--calids-color-primary-500);
    box-shadow: 0 0 0 1px var(--calids-color-primary-500);
}

.thread .messages[b-g776ykhe5d] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    max-height: 360px;
    margin-bottom: 12px;
    overflow-y: auto;
}

.msg[b-g776ykhe5d] {
    max-width: 85%;
    padding: 8px 10px;
    border-radius: var(--calids-border-radius-sm, 6px);
}

    /* surface-container-lowest wäre derselbe Grauton wie .theirs (grey-200). */
    .msg.mine[b-g776ykhe5d] {
        align-self: flex-end;
        background: var(--calids-color-primary-100);
    }

    .msg.theirs[b-g776ykhe5d] {
        align-self: flex-start;
        background: var(--calids-palette-grey-200, #f1f3f5);
    }

    .msg .meta[b-g776ykhe5d] {
        margin: 0 0 2px;
        font-size: 11.5px;
        color: var(--color-text-body);
    }

    .msg .body[b-g776ykhe5d] {
        margin: 0;
        font-size: 14px;
        white-space: pre-wrap;
        color: var(--color-text-headings);
    }

.thread textarea[b-g776ykhe5d] {
    display: block;
    width: 100%;
    padding: 8px 10px;
    font-family: inherit;
    font-size: 14px;
    color: var(--color-text-headings);
    background: var(--calids-color-surface);
    border: 1px solid var(--calids-palette-grey-400);
    border-radius: var(--calids-border-radius-sm, 6px);
    resize: vertical;
}

.reply-actions[b-g776ykhe5d] {
    display: flex;
    justify-content: flex-end;
    margin-top: 8px;
}

.reply-error[b-g776ykhe5d] {
    margin: 6px 0 0;
    font-size: 13px;
    color: var(--calids-palette-red-vivid-900, #a61b1b);
}

@media (max-width: 600px) {
    .facts[b-g776ykhe5d] {
        grid-template-columns: minmax(0, 1fr);
        gap: 0;
    }

        .facts dd[b-g776ykhe5d] {
            margin-bottom: 8px;
        }

    .msg[b-g776ykhe5d] {
        max-width: 100%;
    }

    /* Angebot und Messpunkte untereinander statt zweispaltig. */
    .quote dl[b-g776ykhe5d] {
        grid-template-columns: minmax(0, 1fr);
        gap: 0;
    }

        .quote dd[b-g776ykhe5d] {
            margin-bottom: 8px;
        }

    .lab-option[b-g776ykhe5d] {
        flex-wrap: wrap;
    }

    .coverage[b-g776ykhe5d] {
        margin-left: 26px;
    }
}

.back-link[b-g776ykhe5d] {
    display: inline-block;
    font-size: 14px;
    color: var(--color-text-body);
}

/* ---------- Laborname als Link zum Profil ---------- */

a.lab[b-g776ykhe5d] {
    display: block;
    text-decoration: none;
}

    a.lab:hover[b-g776ykhe5d] {
        text-decoration: underline;
    }

.lab-profile[b-g776ykhe5d] {
    align-self: flex-start;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--calids-color-primary-500);
}

/* ---------- Angebotsposten, PDF, AGB ---------- */

.quote-lines[b-g776ykhe5d] {
    width: 100%;
    margin: 12px 0 4px;
    border-collapse: collapse;
    font-size: 13.5px;
}

    .quote-lines th[b-g776ykhe5d] {
        padding: 6px 8px;
        font-size: 12px;
        font-weight: 600;
        text-align: left;
        color: var(--color-text-body);
        border-bottom: 1px solid var(--calids-palette-grey-400);
    }

    .quote-lines td[b-g776ykhe5d] {
        padding: 6px 8px;
        color: var(--color-text-headings);
        border-bottom: 1px solid var(--calids-palette-grey-300);
    }

    .quote-lines .num[b-g776ykhe5d] {
        text-align: right;
        white-space: nowrap;
    }

.quote-links[b-g776ykhe5d] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 18px;
    margin: 10px 0 0;
    font-size: 13.5px;
}

    .quote-links a[b-g776ykhe5d] {
        display: inline-flex;
        align-items: center;
        gap: 4px;
        font-weight: 600;
        color: var(--calids-color-primary-500);
    }

    .quote-links .material-icons[b-g776ykhe5d] {
        font-size: 18px;
    }

.terms-check[b-g776ykhe5d] {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin: 12px 0 0;
    font-size: 13.5px;
    color: var(--color-text-headings);
}

    .terms-check input[b-g776ykhe5d] {
        margin-top: 3px;
        flex-shrink: 0;
    }

/* ---------- Anhänge ---------- */

.attachment-list[b-g776ykhe5d] {
    display: grid;
    gap: 8px;
    margin: 0 0 12px;
    padding: 0;
    list-style: none;
}

    .attachment-list li[b-g776ykhe5d] {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 4px 12px;
        font-size: 14px;
    }

    .attachment-list a[b-g776ykhe5d] {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        color: var(--color-text-headings);
        font-weight: 600;
    }

    .attachment-list .material-icons[b-g776ykhe5d] {
        font-size: 18px;
        color: var(--color-text-body);
    }

button.link[b-g776ykhe5d] {
    padding: 0;
    font: inherit;
    font-size: 13px;
    font-weight: 600;
    color: var(--calids-color-primary-500);
    background: none;
    border: none;
    cursor: pointer;
}

.upload[b-g776ykhe5d] {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    font-size: 13.5px;
    font-weight: 600;
    color: var(--calids-color-primary-500);
    border: 1px solid var(--calids-color-primary-500);
    border-radius: var(--calids-border-radius-md, 8px);
    cursor: pointer;
}

    .upload[b-g776ykhe5d]  input[type=file] {
        position: absolute;
        inset: 0;
        opacity: 0;
        cursor: pointer;
    }

    .upload .material-icons[b-g776ykhe5d] {
        font-size: 18px;
    }

/* ---------- Angebotsprozess: Nummer, Brutto, Bedarfs- und Wahlposten ---------- */

.quote h3 .quote-number[b-g776ykhe5d] {
    margin-left: 8px;
    font-size: 13px;
    font-weight: 400;
    font-variant-numeric: tabular-nums;
    color: var(--color-text-body);
}

.quote .price .gross[b-g776ykhe5d] {
    display: block;
    font-size: 12.5px;
    font-weight: 400;
    color: var(--color-text-body);
}

.lines-heading[b-g776ykhe5d] {
    margin: 14px 0 4px;
    font-size: 13px;
    font-weight: 600;
    color: var(--color-text-headings);
}

.quote-lines.extra td[b-g776ykhe5d] {
    color: var(--color-text-body);
}

fieldset.options[b-g776ykhe5d] {
    margin: 0 0 12px;
    padding: 0;
    border: none;
}

    fieldset.options legend[b-g776ykhe5d] {
        margin-bottom: 6px;
        font-size: 13px;
        font-weight: 600;
        color: var(--color-text-headings);
    }

.evidence[b-g776ykhe5d] {
    margin: 10px 0;
}

    .evidence .small[b-g776ykhe5d] {
        margin-bottom: 6px;
        color: var(--color-text-body);
    }
/* /Pages/DeviceNotFound.razor.rz.scp.css */
/* Layout */
/* Die Navigation des LandingLayout liegt fixed über dem Inhalt,
   deshalb oben Platz lassen. Füllt die Bildschirmhöhe aus dem LandingLayout
   (.page), der Seitenfuß liegt darunter. */
.content[b-44ol5p76gy] {
    flex: 1 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 16px;
    padding: 88px 16px 32px;
    text-align: center;
}

/* Auf schmalen Schirmen bricht dieselbe Navigation mehrzeilig um und ist dann
   116 statt 56 Pixel hoch - mit den 88px oben schoebe sie sich ueber die
   Ueberschrift. */
@media (max-width: 767px) {
    .content[b-44ol5p76gy] {
        padding-top: 140px;
    }
}

.intro[b-44ol5p76gy] {
    max-width: 520px;
    margin: 0;
    color: var(--color-text-body);
}

/* Sucheingabe */
.query[b-44ol5p76gy] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    width: min(100%, 628px);
    padding: 16px 24px;
    box-sizing: border-box;
    border: 1px solid var( --color-outline---calids-color-outline, #646464 );
    border-radius: 16px;
    background: var( --color-surface---calids-color-surface, #FEFEFE );
}

.query__label[b-44ol5p76gy] {
    font-size: var( --font-title-title-2xsmall-size, 14px );
    color: var(--color-text-body);
}

.query__value[b-44ol5p76gy] {
    /* Eingabe unverändert zeigen: Leerzeichen bleiben erhalten, lange
       Bezeichnungen ohne Leerzeichen brechen um statt zu überlaufen. */
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    font-size: var( --font-title-title-medium-size, 24px );
    font-weight: 600;
    line-height: var( --font-title-title-medium-line-height, 32px );
    color: var(--color-text-headings);
}

.back[b-44ol5p76gy] {
    color: var(--color-text-link);
}

    .back:hover[b-44ol5p76gy] {
        color: var(--color-text-link-hover);
    }

/* Meldung ohne Rueckfrage */
.status[b-44ol5p76gy] {
    margin: 0;
    color: var(--color-text-body);
}

/* Rueckfrage zum besten Treffer */
.confirm[b-44ol5p76gy] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    width: min(100%, 628px);
    padding: 20px 24px;
    box-sizing: border-box;
    text-align: left;
    border: 1px solid var( --color-baseline-colors---calids-color-primary, #51279B );
    border-radius: 16px;
    background: var( --color-surface---calids-color-surface, #FEFEFE );
}

    .confirm h2[b-44ol5p76gy] {
        margin: 0;
        font-size: var( --font-title-title-xsmall-size, 16px );
        font-weight: 600;
        color: var(--color-text-headings);
    }

.candidate[b-44ol5p76gy] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.candidate__name[b-44ol5p76gy] {
    /* Der Geraetename ist die Aussage der Karte, deshalb die groesste Schrift. */
    overflow-wrap: anywhere;
    font-size: var( --font-title-title-xsmall-size, 16px );
    font-weight: 600;
    line-height: 24px;
    color: var(--color-text-headings);
}

.candidate__type[b-44ol5p76gy] {
    font-size: 13px;
    color: var(--color-text-body);
    opacity: 0.75;
}

.candidate__summary[b-44ol5p76gy] {
    margin: 4px 0 0;
    font-size: 14px;
    line-height: 20px;
    color: var(--color-text-body);
}

.candidate__link[b-44ol5p76gy] {
    margin-top: 4px;
    font-size: 13px;
    color: var(--color-text-link);
}

/* Freiwillige Adresse fuer die Benachrichtigung. Beschriftung auf der
   Rahmenkante wie im Anfrageformular - die Karte bleibt so ruhig. */
.notify[b-44ol5p76gy] {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-top: 6px;
}

    .notify label[b-44ol5p76gy] {
        position: absolute;
        top: -6px;
        left: 10px;
        padding: 0 5px;
        font-size: 11px;
        line-height: 1;
        white-space: nowrap;
        color: var(--color-text-body);
        background: var( --color-surface---calids-color-surface, #FEFEFE );
    }

    .notify input[b-44ol5p76gy] {
        box-sizing: border-box;
        width: 100%;
        padding: 10px 12px;
        font-family: inherit;
        font-size: 14px;
        color: var(--color-text-headings);
        background: var( --color-surface---calids-color-surface, #FEFEFE );
        border: 1px solid var(--calids-palette-grey-400, #BDBDBD);
        border-radius: var(--calids-border-radius-xs, 6px);
    }

        .notify input:focus[b-44ol5p76gy] {
            outline: none;
            border-color: var( --color-baseline-colors---calids-color-primary, #51279B );
        }

        .notify input[aria-invalid="true"][b-44ol5p76gy] {
            border-color: var(--color-text-error, #b3261e);
        }

        .notify input:disabled[b-44ol5p76gy] {
            opacity: 0.6;
        }

.notify__hint[b-44ol5p76gy],
.notify__error[b-44ol5p76gy] {
    font-size: 12.5px;
    line-height: 18px;
}

.notify__hint[b-44ol5p76gy] {
    color: var(--color-text-body);
}

.notify__error[b-44ol5p76gy] {
    color: var(--color-text-error, #b3261e);
}

.confirm__actions[b-44ol5p76gy] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.confirm__done[b-44ol5p76gy],
.confirm__failed[b-44ol5p76gy] {
    margin: 0;
    font-size: 15px;
    line-height: 22px;
}

.confirm__done[b-44ol5p76gy] {
    font-weight: 600;
    color: var(--color-text-headings);
}

.confirm__failed[b-44ol5p76gy] {
    color: var(--color-text-error, #b3261e);
}

.describe-cta[b-44ol5p76gy] {
    margin: 28px 0 0;
    padding: 18px 20px;
    background: var(--calids-color-primary-opacity-08);
    border: 1px solid var(--calids-color-primary-300);
    border-radius: 12px;
}

    .describe-cta h2[b-44ol5p76gy] {
        margin: 0 0 6px;
        font-size: 17px;
    }

    .describe-cta p[b-44ol5p76gy] {
        margin: 0 0 12px;
        font-size: 14px;
    }
/* /Pages/HowItWorks.razor.rz.scp.css */
main[b-84qcwlztpy] {
    background: var(--calids-color-surface);
}

section[b-84qcwlztpy] {
    padding: 48px 32px;
}


/* ---------- Hintergrundgrafik hinter Hero + Schritten (Top-Row bleibt weiss) ---------- */

.intro[b-84qcwlztpy] {
    position: relative;
    overflow: hidden;
}

    .intro[b-84qcwlztpy]::before {
        content: "";
        position: absolute;
        inset: 0;
        background: url('/images/holygeo.png') no-repeat right -350px top -550px;
        background-size: 70%;
        pointer-events: none;
    }

    .intro > section[b-84qcwlztpy] {
        position: relative;
    }

.hero-section-label[b-84qcwlztpy] {
    margin-bottom: 32px;
}

.section-label[b-84qcwlztpy] {
    margin-bottom: 32px;
    display: flex;
    align-items: center;
    flex-direction: column;
}

/* ---------- Buttons (Hero + Karten) ---------- */

button.search-button[b-84qcwlztpy]  {
    background-color: red;
}

#test[b-84qcwlztpy] {
    background: red;
}


.btn-primary[b-84qcwlztpy],
.btn-outline[b-84qcwlztpy] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 11px 20px;
    font-size: 14px;
    font-weight: 600;
    white-space: nowrap;
    text-decoration: none;
    border-radius: var(--calids-border-radius-lg);
    cursor: pointer;
}

.btn-primary[b-84qcwlztpy] {
    color: #fff;
    background: var(--calids-color-primary);
    border: 1px solid var(--calids-color-primary);
}

    .btn-primary:hover[b-84qcwlztpy] {
        color: #fff;
        background: var(--calids-color-primary-600, var(--calids-color-primary-500));
    }

.btn-outline[b-84qcwlztpy] {
    color: var(--color-text-headings);
    background: var(--calids-color-surface);
    border: 1px solid var(--calids-color-primary);
}

    .btn-outline .material-icons[b-84qcwlztpy] {
        color: var(--calids-color-primary);
    }

    .btn-outline:hover[b-84qcwlztpy] {
        background: var(--calids-color-primary-opacity-08);
    }

    .btn-primary .material-icons[b-84qcwlztpy],
    .btn-outline .material-icons[b-84qcwlztpy] {
        font-size: 18px;
    }

/* ---------- Hero ---------- */

.hero[b-84qcwlztpy] {
    padding: 48px 32px;
}

    .hero h1[b-84qcwlztpy] {
        margin: 0 0 8px;
        font-size: 48px;
        line-height: 1.2;
    }

        .hero h1 .accent[b-84qcwlztpy] {
            color: var(--calids-color-primary);
        }

.hero-sub[b-84qcwlztpy] {
    max-width: 480px;
    margin: 0;
    font-size: 16px;
    color: var(--color-text-body);
}

.hero-actions[b-84qcwlztpy] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 32px;
}

.trust-row[b-84qcwlztpy] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px 0;
    margin: 0;
    padding: 0;
    list-style: none;
}

    .trust-row li[b-84qcwlztpy] {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        font-size: 13.5px;
        font-weight: 500;
        color: var(--color-text-headings);
        padding: 0 20px;
        border-right: 1px solid var(--calids-palette-grey-400);
    }

        .trust-row li:first-child[b-84qcwlztpy] {
            padding-left: 0;
        }

        .trust-row li:last-child[b-84qcwlztpy] {
            border-right: none;
        }

        .trust-row li .material-icons[b-84qcwlztpy] {
            font-size: 18px;
            color: var(--calids-color-primary);
        }

/* ---------- Abschnitts-Überschriften ---------- */

h2[b-84qcwlztpy] {
    margin: 0 0 8px;
    font-size: 26px;
    text-align: center;
}

.section-sub[b-84qcwlztpy] {
    margin: 0;
    font-size: 14.5px;
    color: var(--color-text-body);
    text-align: center;
}

/* ---------- So funktioniert's (5 Schritte) ---------- */

.how[b-84qcwlztpy] {
    padding: 0px 32px 48px;
    display: flex;
    align-items: center;
    flex-direction: column;
    border-bottom: 1px solid var(--calids-palette-grey-400);
}

.steps[b-84qcwlztpy] {
    display: flex;
    gap: 16px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.step[b-84qcwlztpy] {
    position: relative;
    flex: 1;
    min-width: 0;
    text-align: center;
}

    /* Verbindungslinie zwischen den Schritt-Kreisen */
    .step:not(:last-child)[b-84qcwlztpy]::after {
        content: "";
        position: absolute;
        top: 32px;
        left: calc(50% + 44px);
        width: calc(100% - 72px);
        height: 2px;
        background: var(--calids-palette-grey-400);
    }

.step-icon[b-84qcwlztpy] {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    margin: 0 auto 8px;
    background: var(--calids-color-primary-container);
    border-radius: var(--calids-border-radius-full);
}

    .step-icon .material-icons[b-84qcwlztpy] {
        font-size: 26px;
        color: var(--calids-color-on-primary-container);
    }

.step-num[b-84qcwlztpy] {
    position: absolute;
    top: -3px;
    left: -3px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    font-size: 11px;
    font-weight: 700;
    color: #fff;
    background: var(--calids-color-primary-500);
    border-radius: var(--calids-border-radius-full);
}

/* Textspalte gemeinsam begrenzen, Zeilen gleichmaessig umbrechen lassen */
.step > div[b-84qcwlztpy] {
    max-width: 190px;
    margin: 0 auto;
}

.step h3[b-84qcwlztpy] {
    margin: 8px 0 2px;
    font-size: 14px;
    text-wrap: balance;
}

.step p[b-84qcwlztpy] {
    margin: 0;
    font-size: 12.5px;
    color: var(--color-text-body);
    text-wrap: balance;
}

/* ---------- Warum CaliHub? ---------- */

.why[b-84qcwlztpy] {
    padding: 48px 32px 32px;
}

/* Spaltenzahl richtet sich nach dem Platz: 3 -> 2 -> 1, nie schmaler als der Karteninhalt */
.why-cards[b-84qcwlztpy] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(340px, 100%), 1fr));
    gap: 24px;
}

.why-card[b-84qcwlztpy] {
    display: flex;
    padding: 32px 24px;
    justify-content: center;
    align-items: flex-start;
    gap: 8px;
    flex: 1 0 0;
    border-radius: var(--calids-border-radius-2xl);
    border: 1px solid var(--calids-color-outline-variant);
}

    /* Textspalte auf die Breite der (nicht umbrechenden) Ueberschrift begrenzen */
    .why-card > div[b-84qcwlztpy] {
        display: grid;
        grid-template-columns: min-content;
        max-width: 100%;
    }

    .why-card h3[b-84qcwlztpy] {
        margin: 0 0 4px;
        font-size: 14.5px;
        white-space: nowrap;
    }

    .why-card p[b-84qcwlztpy] {
        margin: 0;
        font-size: 13px;
        color: var(--color-text-body);
    }

.round-icon[b-84qcwlztpy] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    flex-shrink: 0;
    color: var(--calids-color-on-primary-container);
    background: var(--calids-color-primary-container);
    border-radius: var(--calids-border-radius-full);
}

    .round-icon .material-icons[b-84qcwlztpy] {
        font-size: 22px;
    }

    .round-icon.dark[b-84qcwlztpy] {
        color: #fff;
        background: var(--calids-color-inverse-surface);
    }

/* ---------- Zwei Wege ---------- */

.ways[b-84qcwlztpy] {
}

.way-cards[b-84qcwlztpy] {
    display: flex;
    align-items: stretch;
    justify-content: center;
    gap: 24px;
}

.way-card[b-84qcwlztpy] {
    flex: 1;
    max-width: 560px;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    gap: 16px;
    padding: 24px;
    background: var(--calids-color-surface);
    border: 1px solid var(--calids-palette-grey-400);
    border-radius: var(--calids-border-radius-lg);
}

    .way-card.highlight[b-84qcwlztpy] {
        background: var(--calids-color-primary-100);
        border-color: var(--calids-color-primary-500);
    }

        /* Icon-Kreis hebt sich vom lavendelfarbenen Kartenhintergrund ab */
        .way-card.highlight .round-icon[b-84qcwlztpy] {
            background: var(--calids-color-surface);
        }

.way-body h3[b-84qcwlztpy] {
    margin: 2px 0 12px;
    font-size: 16px;
}

.way-body ul[b-84qcwlztpy] {
    display: grid;
    gap: 6px;
    margin: 0 0 18px;
    padding: 0;
    list-style: none;
}

.way-body li[b-84qcwlztpy] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: var(--color-text-body);
}

    .way-body li .material-icons[b-84qcwlztpy] {
        font-size: 16px;
        color: var(--calids-color-primary);
    }

/* ---------- Responsive ---------- */

@media (max-width: 900px) {
    .hero h1[b-84qcwlztpy] {
        font-size: 32px;
    }

    .steps[b-84qcwlztpy] {
        flex-wrap: wrap;
        gap: 24px 16px;
    }

    .step[b-84qcwlztpy] {
        flex: 1 1 40%;
    }

        .step:not(:last-child)[b-84qcwlztpy]::after {
            display: none;
        }

    .way-cards[b-84qcwlztpy] {
        flex-direction: column;
    }

    .way-card[b-84qcwlztpy] {
        max-width: none;
    }
}

@media (max-width: 700px) {
    section[b-84qcwlztpy] {
        padding: 32px 16px;
    }

    .hero[b-84qcwlztpy] {
        padding: 40px 16px 32px;
    }

    .trust-row li[b-84qcwlztpy] {
        padding: 0 12px;
    }
}
/* /Pages/IconStyleguide.razor.rz.scp.css */
/* Gleicher Rahmen wie ButtonStyleguide.razor.css, nur Raster statt Zeilen. */
.styleguide[b-pkanjs52d6] {
    max-width: 1100px;
    margin: 0 auto;
    padding: var(--calids-spacing-2xl) var(--calids-spacing-lg);
}

.sg-intro[b-pkanjs52d6] {
    max-width: 70ch;
    color: var(--color-text-body);
}

code[b-pkanjs52d6] {
    font-size: var(--calids-fontsize-body-xs);
    color: var(--calids-color-primary-700);
}

.sg-toolbar[b-pkanjs52d6] {
    position: sticky;
    top: 0;
    z-index: 1;
    display: flex;
    align-items: center;
    gap: var(--calids-spacing-md);
    padding: var(--calids-spacing-md) 0;
    background: var(--calids-color-surface, #fefefe);
}

    .sg-toolbar input[b-pkanjs52d6] {
        flex: 0 1 320px;
        padding: 8px 14px;
        font-size: var(--calids-fontsize-body-sm);
        border: var(--calids-border-width-2xs, 1px) solid var(--calids-color-outline, #646464);
        border-radius: var(--calids-border-radius-full, 100px);
    }

        .sg-toolbar input:focus[b-pkanjs52d6] {
            outline: none;
            border-color: var(--calids-color-primary-500);
            box-shadow: 0 0 0 3px var(--calids-color-primary-opacity-08);
        }

.sg-count[b-pkanjs52d6] {
    font-size: var(--calids-fontsize-body-xs);
    color: var(--color-text-body);
}

.sg-copied[b-pkanjs52d6] {
    font-size: var(--calids-fontsize-body-xs);
    color: var(--calids-color-primary-600);
}

.sg-icons[b-pkanjs52d6] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    gap: var(--calids-spacing-sm);
    margin: 0;
    padding: 0;
    list-style: none;
}

    .sg-icons button[b-pkanjs52d6] {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: var(--calids-spacing-xs);
        width: 100%;
        padding: var(--calids-spacing-md) var(--calids-spacing-xs);
        background: none;
        border: var(--calids-border-width-2xs, 1px) solid transparent;
        border-radius: var(--calids-border-radius-lg, 12px);
        cursor: pointer;
    }

        .sg-icons button:hover[b-pkanjs52d6] {
            border-color: var(--calids-color-primary-300);
            background: var(--calids-color-primary-opacity-08);
        }

        /* Die Maske rechnet in em — hier bestimmt font-size die Kachelgröße. */
        .sg-icons .material-icons[b-pkanjs52d6] {
            font-size: 32px;
            color: var(--color-text-body);
        }

        .sg-icons code[b-pkanjs52d6] {
            overflow-wrap: anywhere;
            text-align: center;
            line-height: 1.3;
        }

.sg-empty[b-pkanjs52d6] {
    padding: var(--calids-spacing-2xl);
    text-align: center;
    color: var(--color-text-body);
}
/* /Pages/LandingSearch.razor.rz.scp.css */
/* Layout: füllt die Bildschirmhöhe aus dem LandingLayout (.page), der
   Seitenfuß liegt darunter. */
.content[b-w32mviczhi] {
    flex: 1 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 16px;
    padding: 16px;
    padding-top: 15vh;
}
    .content > :first-child[b-w32mviczhi] {
        margin-bottom: -8px;
    }

/* Logo */
.logo[b-w32mviczhi] {
    height: 140px;
}


/* Search bar */
/*.search {
    width: 628px;
    max-width: 100%;
    flex-shrink: 0;
}*/

/* ::deep, weil das Eingabefeld von MudTextField gerendert wird und
       deshalb kein Scope-Attribut trägt (Styles griffen sonst nicht). */
/*.search ::deep .mud-input.mud-input-outlined,
    .search ::deep .mud-input-outlined-border {
        border-radius: var(--calids-border-radius-full, 100px);
    }

    .search ::deep .mud-input.mud-input-outlined {
        background: var(--calids-color-surface, #FEFEFE);
    }*/

/* Pillform braucht innen mehr Luft, sonst klebt der Text am Rand. */
/*.search ::deep .mud-input.mud-input-outlined > input {
            padding-left: 20px;
        }*/


.cali-search[b-w32mviczhi] {
    display: flex;
    align-items: center;
    gap: 10px;
    width: min(100%, 628px);
    height: 56px;
    padding: 0 8px 0 20px;
    box-sizing: border-box;
    border-radius: var( --border-radius---calids-border-radius-full, 100px );
    border: 1px solid var( --color-outline---calids-color-outline, #646464 );
    background: var( --color-surface---calids-color-surface, #FEFEFE );
    transition: border-color 150ms ease, box-shadow 150ms ease;
}

    .cali-search:hover[b-w32mviczhi] {
        border-color: var( --color-baseline-colors---calids-color-primary, #51279B );
    }

    .cali-search:focus-within[b-w32mviczhi] {
        border-color: var( --color-baseline-colors---calids-color-primary, #51279B );
        box-shadow: 0 0 0 1px var( --color-baseline-colors---calids-color-primary, #51279B );
    }

.cali-search__input[b-w32mviczhi] {
    flex: 1 1 auto;
    min-width: 0;
    height: 100%;
    padding: 0;
    border: 0;
    outline: 0;
    background: transparent;
    color: var( --calihub-v1-sys-light-on-surface, var(--color-on---calids-color-on-surface, #102A43) );
    font-family: var(--font-label-label-medium-font, "Source Sans 3"), Arial, sans-serif;
    font-size: var( --font-label-label-medium-size, 16px );
    font-style: normal;
    font-weight: 500;
    line-height: var( --font-label-label-medium-line-height, 24px );
}

    .cali-search__input[b-w32mviczhi]::placeholder {
        color: #7C8797;
        opacity: 1;
        font-family: var(--font-label-label-medium-font, "Source Sans 3"), Arial, sans-serif;
        font-size: var( --font-label-label-medium-size, 16px );
        font-weight: 500;
        line-height: 24px;
    }

.cali-search__button[b-w32mviczhi] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    padding: 0;
    color: var( --color-baseline-colors---calids-color-primary, #51279B );
    border: 0;
    border-radius: 8px;
    background: transparent;
    cursor: pointer;
    transition: background-color 150ms ease;
}

    .cali-search__button:hover[b-w32mviczhi] {
        background: rgba(81, 39, 155, 0.08);
    }

    .cali-search__button:focus-visible[b-w32mviczhi] {
        outline: 2px solid var( --color-baseline-colors---calids-color-primary, #51279B );
        outline-offset: 1px;
    }

    .cali-search__button .mud-icon-root[b-w32mviczhi] {
        color: inherit;
        font-size: 26px;
    }
/* Advanced */
.advanced[b-w32mviczhi] {
    padding: 11px 22px;
    font-size: 16px;
    font-weight: 500;
    color: var(--calids-color-neutral-white);
    background: var(--calids-color-primary-500);
    border: none;
    border-radius: 10px;
    cursor: pointer;
}

    .advanced:hover[b-w32mviczhi] {
        background: var(--calids-color-primary-600);
    }

/* Vorschlagsliste hängt unter dem Suchfeld – gleiche Breite wie das Feld. */
.search-wrap[b-w32mviczhi] {
    width: min(100%, 628px);
}

    .search-wrap .cali-search[b-w32mviczhi] {
        width: 100%;
    }

.more-ways[b-w32mviczhi] {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 6px 12px;
    margin: 18px 0 0;
    font-size: 13.5px;
}
/* /Pages/Login.razor.rz.scp.css */
main[b-fw4r5mig5l] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 48px 16px;
    background: var(--calids-color-surface-container-lowest);
}

.login-card[b-fw4r5mig5l] {
    width: 100%;
    max-width: 380px;
    padding: 32px;
    background: var(--calids-color-surface);
    border: 1px solid var(--calids-palette-grey-400);
    border-radius: var(--calids-border-radius-lg);
}

    .login-card h1[b-fw4r5mig5l] {
        margin: 0 0 4px;
        font-size: 22px;
    }

.sub[b-fw4r5mig5l] {
    margin: 0 0 24px;
    font-size: 13.5px;
    color: var(--color-text-body);
}

label[b-fw4r5mig5l] {
    display: block;
    margin: 0 0 6px;
    font-size: 13px;
    font-weight: 600;
    color: var(--color-text-headings);
}

input[b-fw4r5mig5l] {
    width: 100%;
    margin-bottom: 16px;
    padding: 10px 12px;
    font-size: 14px;
    color: var(--color-text-headings);
    background: var(--calids-color-surface);
    border: 1px solid var(--calids-palette-grey-400);
    border-radius: var(--calids-border-radius-md);
    outline: none;
}

    input:focus[b-fw4r5mig5l] {
        border-color: var(--calids-color-primary-500);
    }

.error[b-fw4r5mig5l] {
    margin: 0 0 16px;
    font-size: 13px;
    color: var(--calids-palette-red-vivid-800);
}


/* „Passwort vergessen?“ steht direkt unter dem Passwortfeld: Dort fällt auf,
   dass man es nicht mehr weiß – nicht erst nach dem Fehlversuch. */
.forgot[b-fw4r5mig5l] {
    margin: -6px 0 16px;
    font-size: 13px;
    text-align: right;
}

/* Bestätigung nach dem Anfordern. Sie tritt an die Stelle des Formulars, damit
   niemand den Link ein zweites Mal anfordert, weil das Feld noch dasteht. */
.notice[b-fw4r5mig5l] {
    margin: 0 0 20px;
    font-size: 13.5px;
    line-height: 1.5;
    color: var(--color-text-body);
}

/* Umschalter zwischen Anmelden, Konto anlegen und Passwort vergessen – eine
   Seite für alle drei, weil Gäste oft selbst nicht wissen, ob ihre Adresse
   schon ein Konto hat. */
.switch[b-fw4r5mig5l] {
    margin: 16px 0 0;
    font-size: 13px;
    text-align: center;
    color: var(--color-text-body);
}

/* Textknopf, der wie ein Link aussieht – in beiden Zeilen derselbe. */
.link[b-fw4r5mig5l] {
    padding: 0;
    font: inherit;
    font-weight: 600;
    color: var(--calids-color-primary-500);
    background: none;
    border: none;
    cursor: pointer;
    text-decoration: underline;
}

.foot-note[b-fw4r5mig5l] {
    margin: 14px 0 0;
    padding-top: 14px;
    font-size: 12px;
    line-height: 1.5;
    color: var(--color-text-body);
    border-top: 1px solid var(--calids-palette-grey-400);
}

/* Zustimmung und „Gerät merken“: Kästchen und Text nebeneinander, nicht als Feldbeschriftung. */
label.check[b-fw4r5mig5l] {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin: 4px 0 12px;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.45;
}

    label.check input[b-fw4r5mig5l] {
        width: auto;
        margin: 2px 0 0;
        flex: none;
    }

    label.check a[b-fw4r5mig5l] {
        font-weight: 600;
        color: var(--calids-color-primary-500);
    }
/* /Pages/Privacy.razor.rz.scp.css */
/* Lesetypografie wie calihub.de/datenschutz.html (.legal): schmale Spalte,
   großzügiger Zeilenabstand – ein Rechtstext wird gelesen, nicht überflogen. */
main[b-rzsfdj4psx] {
    background: var(--calids-color-surface);
    padding: 0 24px;
}

.legal[b-rzsfdj4psx] {
    max-width: 760px;
    margin: 0 auto;
    padding: 44px 0 72px;
    line-height: 1.65;
    color: var(--color-text-body);
}

    .legal h1[b-rzsfdj4psx] {
        margin: 0 0 0.4em;
    }

    .legal h2[b-rzsfdj4psx] {
        font-size: 1.28rem;
        font-weight: 600;
        margin: 2em 0 0.5em;
    }

    .legal h3[b-rzsfdj4psx] {
        font-family: var(--calids-type-body), sans-serif;
        font-size: 1.05rem;
        font-weight: 500;
        margin: 1.5em 0 0.35em;
    }

    .legal p[b-rzsfdj4psx] {
        margin: 0.55em 0;
    }

    .legal .scope[b-rzsfdj4psx] {
        margin-bottom: 1.5em;
    }

    .legal ul[b-rzsfdj4psx] {
        padding-left: 1.25em;
        margin: 0.55em 0;
    }

    .legal li[b-rzsfdj4psx] {
        margin: 0.3em 0;
    }

    .legal address[b-rzsfdj4psx] {
        font-style: normal;
        margin: 0.4em 0 1em;
    }

    .legal code[b-rzsfdj4psx] {
        font-size: 0.92em;
        padding: 0 0.25em;
        border-radius: 4px;
        background: var(--calids-color-neutral-100);
        color: var(--calids-color-neutral-800);
    }

    .legal .note[b-rzsfdj4psx] {
        margin: 1.2em 0;
        padding: 14px 16px;
        border: 1px solid var(--calids-color-neutral-200);
        border-radius: 10px;
        background: var(--calids-color-neutral-100);
        font-size: 0.95rem;
    }

        .legal .note p[b-rzsfdj4psx] {
            margin: 0;
        }

    .legal .updated[b-rzsfdj4psx] {
        margin-top: 2.6em;
        font-size: 0.875rem;
        color: var(--calids-color-neutral-600);
    }

@media (max-width: 600px) {
    main[b-rzsfdj4psx] {
        padding: 0 16px;
    }

    .legal[b-rzsfdj4psx] {
        padding: 28px 0 48px;
    }
}
/* /Pages/Provider/Capabilities.razor.rz.scp.css */
/* ---------- Seitenkopf ---------- */

.page-head[b-8gq89p91gv] {
    padding: 24px 32px 16px;
    background: var(--calids-color-surface);
    border-bottom: 1px solid var(--calids-palette-grey-400);
}

    .page-head h1[b-8gq89p91gv] {
        margin: 0 0 4px;
        font-size: 24px;
    }

    .page-head p[b-8gq89p91gv] {
        margin: 0;
        font-size: 13.5px;
        color: var(--color-text-body);
    }

.page-body[b-8gq89p91gv] {
    padding: 32px;
}

.state[b-8gq89p91gv] {
    font-size: 14px;
    color: var(--color-text-body);
}

    .state.error[b-8gq89p91gv] {
        color: var(--calids-palette-red-vivid-900, #a61b1b);
    }

.banner[b-8gq89p91gv] {
    margin: 0 0 16px;
    padding: 10px 14px;
    font-size: 13.5px;
    border-radius: var(--calids-border-radius-lg, 10px);
}

    .banner.ok[b-8gq89p91gv] {
        color: var(--calids-palette-green-900);
        background: var(--calids-palette-green-200);
    }

    .banner.error[b-8gq89p91gv] {
        color: var(--calids-palette-red-vivid-900, #a61b1b);
        background: var(--calids-palette-red-vivid-200, #fde2e2);
    }

/* ---------- Kennzahlen ---------- */

.kpis[b-8gq89p91gv] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 16px;
    margin-bottom: 24px;
}

.kpi[b-8gq89p91gv] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 18px 20px;
    background: var(--calids-color-surface);
    border: 1px solid var(--calids-palette-grey-400);
    border-radius: var(--calids-border-radius-lg, 10px);
}

    .kpi .value[b-8gq89p91gv] {
        font-size: 28px;
        font-weight: 700;
        line-height: 1.1;
        color: var(--color-text-headings);
    }

    .kpi .label[b-8gq89p91gv] {
        font-size: 12.5px;
        color: var(--color-text-body);
    }

    .kpi.urgent .value[b-8gq89p91gv] {
        color: var(--calids-palette-red-vivid-900, #a61b1b);
    }

/* ---------- Karte ---------- */

.card[b-8gq89p91gv] {
    padding: 24px;
    background: var(--calids-color-surface);
    border: 1px solid var(--calids-palette-grey-400);
    border-radius: var(--calids-border-radius-lg, 10px);
}

    .card h2[b-8gq89p91gv] {
        margin: 0 0 12px;
        font-size: 17px;
    }

/* ---------- Quellen ---------- */

.source-grid[b-8gq89p91gv] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 16px;
    margin-bottom: 24px;
}

.source[b-8gq89p91gv] {
    padding: 14px 16px;
    background: var(--calids-color-surface);
    border: 1px solid var(--calids-palette-grey-400);
    border-radius: var(--calids-border-radius-sm, 8px);
}

    .source .annex[b-8gq89p91gv] {
        margin: 0 0 4px;
        font-size: 13px;
        font-weight: 700;
        color: var(--color-text-headings);
    }

    .source .sub[b-8gq89p91gv] {
        margin: 0;
        font-size: 12.5px;
        color: var(--color-text-body);
    }

/* Der Urkunden-Import läuft über den LabImporter – die Kachel erklärt das nur. */
.source.import[b-8gq89p91gv] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    text-align: center;
    border-style: dashed;
    color: var(--color-text-body);
}

    .source.import p[b-8gq89p91gv] {
        margin: 0;
        font-size: 13px;
        font-weight: 600;
        color: var(--calids-color-primary-500);
    }

    .source.import .sub[b-8gq89p91gv] {
        font-weight: 400;
    }

    .source.import .material-icons[b-8gq89p91gv] {
        font-size: 22px;
        color: var(--calids-color-primary-500);
    }

/* ---------- Werkzeugleiste ---------- */

.toolbar[b-8gq89p91gv] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 16px;
}

.search[b-8gq89p91gv] {
    position: relative;
    flex: 1 1 220px;
    max-width: 320px;
}

    .search input[b-8gq89p91gv] {
        width: 100%;
        padding: 9px 34px 9px 12px;
        font-size: 13.5px;
        font-family: inherit;
        color: var(--color-text-headings);
        background: var(--calids-color-surface);
        border: 1px solid var(--calids-palette-grey-400);
        border-radius: var(--calids-border-radius-sm, 6px);
    }

    .search .material-icons[b-8gq89p91gv] {
        position: absolute;
        top: 50%;
        right: 10px;
        transform: translateY(-50%);
        font-size: 18px;
        color: var(--color-text-body);
        pointer-events: none;
    }

.location-filter[b-8gq89p91gv] {
    padding: 8px 10px;
    font-size: 13.5px;
    font-family: inherit;
    color: var(--color-text-headings);
    background: var(--calids-color-surface);
    border: 1px solid var(--calids-palette-grey-400);
    border-radius: var(--calids-border-radius-sm, 6px);
}

.chips[b-8gq89p91gv] {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.chip[b-8gq89p91gv] {
    padding: 7px 14px;
    font-size: 12.5px;
    font-weight: 600;
    font-family: inherit;
    color: var(--color-text-body);
    background: var(--calids-color-surface-container-lowest);
    border: 1px solid var(--calids-palette-grey-400);
    border-radius: var(--calids-border-radius-full, 999px);
    cursor: pointer;
}

    .chip.active[b-8gq89p91gv] {
        color: #fff;
        background: var(--calids-color-primary-500);
        border-color: var(--calids-color-primary-500);
    }

/* Nur die Ausrichtung in der Kopfzeile; das Aussehen kommt aus CaliButton.
   ::deep, weil CaliButton eine Kindkomponente ist — das Isolationsattribut
   dieser Datei sitzt am Container, nicht am Button. */
[b-8gq89p91gv] button.add {
    margin-left: auto;
}

/* ---------- Liste + Detail ---------- */

.split[b-8gq89p91gv] {
    display: grid;
    grid-template-columns: minmax(240px, 300px) minmax(0, 1fr);
    gap: 20px;
    align-items: start;
}

.list[b-8gq89p91gv] {
    overflow: hidden;
    border: 1px solid var(--calids-palette-grey-400);
    border-radius: var(--calids-border-radius-sm, 8px);
}

.group-head[b-8gq89p91gv] {
    margin: 0;
    padding: 8px 14px;
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--color-text-body);
    background: var(--calids-color-surface-container-lowest);
    border-bottom: 1px solid var(--calids-palette-grey-400);
}

/* „.row" ist auch Bootstraps Rasterzeile (Umbruch, negative Ränder, Kinder
   100 % breit mit Rinne) – das hier ist eine Listenzeile, Punkt neben Text. */
.row[b-8gq89p91gv] {
    display: flex;
    flex-wrap: nowrap;
    justify-content: flex-start;   /* globale Button-Regel zentriert sonst */
    align-items: flex-start;
    gap: 8px;
    width: 100%;
    margin: 0;
    padding: 11px 14px;
    text-align: left;
    font-family: inherit;
    background: none;
    border: none;
    border-bottom: 1px solid var(--calids-palette-grey-400);
    cursor: pointer;
}

    .row:hover[b-8gq89p91gv] {
        background: var(--calids-color-surface-container-lowest);
    }

    /* Die aktive Zeile trägt den Statusstreifen – wie im Entwurf. */
    .row.active[b-8gq89p91gv] {
        background: var(--calids-color-surface-container-lowest);
        box-shadow: inset 3px 0 0 var(--calids-color-primary-500);
    }

.row > *[b-8gq89p91gv] {
    width: auto;
    max-width: none;
    margin-top: 0;
    padding: 0;
}

.row .dot[b-8gq89p91gv] {
    flex-shrink: 0;
    width: 7px;
    height: 7px;
    margin-top: 5px;
    border-radius: 50%;
    background: var(--calids-palette-grey-400);
}

.row.needs-review .dot[b-8gq89p91gv] {
    background: var(--calids-palette-red-vivid-900, #a61b1b);
}

.row.confirmed .dot[b-8gq89p91gv] {
    background: var(--calids-palette-green-900, #1e7a3c);
}

.row-text[b-8gq89p91gv] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

    .row-text .main[b-8gq89p91gv] {
        font-size: 13.5px;
        font-weight: 600;
        color: var(--color-text-headings);
    }

    .row-text .sub[b-8gq89p91gv] {
        font-size: 12px;
        color: var(--color-text-body);
    }

.row.needs-review .row-text .sub[b-8gq89p91gv] {
    color: var(--calids-palette-red-vivid-900, #a61b1b);
}

.more[b-8gq89p91gv],
.empty[b-8gq89p91gv] {
    margin: 0;
    padding: 10px 14px;
    font-size: 12.5px;
    color: var(--color-text-body);
}

/* ---------- Detail ---------- */

.detail[b-8gq89p91gv] {
    padding: 20px;
    border: 1px solid var(--calids-palette-grey-400);
    border-radius: var(--calids-border-radius-sm, 8px);
}

.detail-head[b-8gq89p91gv] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 16px;
}

    .detail-head h3[b-8gq89p91gv] {
        margin: 0;
        font-size: 17px;
        color: var(--color-text-headings);
    }

.badge[b-8gq89p91gv] {
    padding: 5px 10px;
    font-size: 11.5px;
    font-weight: 700;
    white-space: nowrap;
    border-radius: var(--calids-border-radius-sm, 6px);
}

    .badge.review[b-8gq89p91gv] {
        color: #7a5b00;
        background: #ffe9a8;
    }

    .badge.ok[b-8gq89p91gv] {
        color: var(--calids-palette-green-900);
        background: var(--calids-palette-green-200);
    }

    .badge.manual[b-8gq89p91gv] {
        color: var(--calids-color-primary-500);
        background: var(--calids-color-surface-container-lowest);
    }

    .badge.rejected[b-8gq89p91gv] {
        color: var(--color-text-body);
        background: var(--calids-color-surface-container-lowest);
    }

.field-grid[b-8gq89p91gv] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 16px;
}

.field[b-8gq89p91gv] {
    display: block;
    margin-bottom: 16px;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--color-text-headings);
}

    .field input[b-8gq89p91gv],
    .field select[b-8gq89p91gv] {
        display: block;
        width: 100%;
        margin-top: 6px;
        padding: 9px 10px;
        font-size: 14px;
        font-weight: 400;
        font-family: inherit;
        color: var(--color-text-headings);
        background: var(--calids-color-surface);
        border: 1px solid var(--calids-palette-grey-400);
        border-radius: var(--calids-border-radius-sm, 6px);
    }

.field-label[b-8gq89p91gv] {
    margin: 0 0 8px;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--color-text-headings);
}

.issue[b-8gq89p91gv] {
    margin: 0 0 16px;
    font-size: 12.5px;
    color: var(--calids-palette-red-vivid-900, #a61b1b);
}

.object[b-8gq89p91gv],
.hint[b-8gq89p91gv] {
    margin: 0 0 16px;
    font-size: 12.5px;
    color: var(--color-text-body);
}

.chips-static[b-8gq89p91gv] {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 16px;
}

.pill[b-8gq89p91gv] {
    padding: 5px 10px;
    font-size: 12px;
    color: var(--calids-color-primary-500);
    background: var(--calids-color-surface-container-lowest);
    border-radius: var(--calids-border-radius-full, 999px);
}

.source-line[b-8gq89p91gv] {
    margin: 0;
    padding: 10px 14px;
    font-size: 12.5px;
    color: var(--color-text-body);
    background: var(--calids-color-surface-container-lowest);
    border-radius: var(--calids-border-radius-sm, 6px);
}

.venue[b-8gq89p91gv] {
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
    margin-bottom: 16px;
}

/* Standortauswahl: Hinweis direkt unter der Überschrift, Pflichthinweis unter den Haken. */
.locations .hint[b-8gq89p91gv] {
    margin-bottom: 8px;
}

.locations .issue[b-8gq89p91gv] {
    margin-top: -8px;
}

.banner a[b-8gq89p91gv] {
    color: inherit;
    font-weight: 600;
}

.check[b-8gq89p91gv] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13.5px;
    font-weight: 400;
    color: var(--color-text-headings);
}

/* ---------- Aktionen ---------- */

.actions[b-8gq89p91gv] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 24px;
}

button:disabled[b-8gq89p91gv] {
    opacity: .5;
    cursor: default;
}

.key-hint[b-8gq89p91gv] {
    margin-left: auto;
    font-size: 12px;
    color: var(--color-text-body);
}

/* ---------- Fußnote ---------- */

.footer-note[b-8gq89p91gv] {
    margin: 16px 0 0;
    padding: 12px 16px;
    font-size: 12.5px;
    color: var(--color-text-body);
    background: var(--calids-color-surface-container-lowest);
    border-radius: var(--calids-border-radius-sm, 8px);
}

/* ---------- Responsive ---------- */

@media (max-width: 1000px) {
    .page-body[b-8gq89p91gv] {
        padding: 16px;
    }

    .split[b-8gq89p91gv] {
        grid-template-columns: minmax(0, 1fr);
    }

    .add[b-8gq89p91gv] {
        margin-left: 0;
    }
}
/* /Pages/Provider/Locations.razor.rz.scp.css */
/* ---------- Geteilte Ansicht ---------- */

/* Fensterhoch: Kopf, darunter Liste und Details. Die Seite selbst scrollt
   nicht, nur Liste und Formular in sich – der Kopf steht. */
.page[b-9pwojxybmq] {
    display: flex;
    flex-direction: column;
    height: 100vh;
}

/* ---------- Seitenkopf ---------- */

.page-head[b-9pwojxybmq] {
    flex: none;
    padding: 24px 32px 16px;
    background: var(--calids-color-surface);
    border-bottom: 1px solid var(--calids-palette-grey-400);
}

    .page-head h1[b-9pwojxybmq] {
        margin: 0 0 4px;
        font-size: 24px;
    }

    .page-head p[b-9pwojxybmq] {
        margin: 0;
        font-size: 13.5px;
        color: var(--color-text-body);
    }

.page-body[b-9pwojxybmq] {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 20px 32px;
    /* Rückfall für sehr niedrige Fenster, wenn selbst die Mindesthöhen nicht passen. */
    overflow-y: auto;
}

.state[b-9pwojxybmq] {
    margin: 0;
    font-size: 14px;
    color: var(--color-text-body);
}

    .state.error[b-9pwojxybmq] {
        color: var(--calids-palette-red-vivid-900, #a61b1b);
    }

.banner[b-9pwojxybmq] {
    margin: 0;
    padding: 10px 14px;
    font-size: 13.5px;
    border-radius: var(--calids-border-radius-lg, 10px);
}

    .banner.info[b-9pwojxybmq] {
        color: #7a5b00;
        background: #fff4d1;
    }

.card[b-9pwojxybmq] {
    padding: 24px;
    background: var(--calids-color-surface);
    border: 1px solid var(--calids-palette-grey-400);
    border-radius: var(--calids-border-radius-lg, 10px);
}

/* Ohne Auswahl so hoch wie nötig; ist die Liste länger als das Fenster,
   scrollt sie unter ihrem Kopf. */
.list[b-9pwojxybmq] {
    flex: 0 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

    /* Mit Details nimmt die Liste, was diese übrig lassen (Basis 0: sie
       verdrängt die Details nie) – mindestens aber Kopf und eine Zeile.
       Erst wenn sie dort steht, wird das Formular niedriger. */
    .list.split[b-9pwojxybmq] {
        flex: 1 1 0;
        min-height: 180px;
    }

.card-head[b-9pwojxybmq] {
    flex: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 16px;
}

    .card-head h2[b-9pwojxybmq] {
        margin: 0;
        font-size: 17px;
    }

.empty[b-9pwojxybmq] {
    margin: 0;
    font-size: 13.5px;
    color: var(--color-text-body);
}

.hint[b-9pwojxybmq] {
    margin: 2px 0 0;
    font-size: 11.5px;
    color: var(--color-text-body);
}

/* ---------- Standort-Liste ---------- */

.loc-list[b-9pwojxybmq] {
    flex: 0 1 auto;
    min-height: 0;
    overflow-y: auto;
    /* Platz für den Fokusrahmen der Zeilen, den das Scrollen sonst abschneidet. */
    margin: -4px;
    padding: 4px;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

    .loc-list > li[b-9pwojxybmq] {
        flex: none;
    }

/* Die ganze Zeile ist der Auswahl-Knopf. */
.loc[b-9pwojxybmq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
    padding: 12px 14px;
    font-family: inherit;
    text-align: left;
    background: var(--calids-color-surface);
    border: 1px solid var(--calids-palette-grey-400);
    border-radius: var(--calids-border-radius-sm, 8px);
    cursor: pointer;
    transition: border-color .15s, background .15s;
}

    .loc:hover[b-9pwojxybmq] {
        border-color: var(--calids-color-primary-300);
    }

    .loc:focus-visible[b-9pwojxybmq] {
        outline: 2px solid var(--calids-color-primary-500);
        outline-offset: 2px;
    }

    .loc.active[b-9pwojxybmq] {
        background: var(--calids-color-primary-100);
        border-color: var(--calids-color-primary-500);
    }

.loc-text[b-9pwojxybmq] {
    display: block;
    min-width: 0;
}

.loc-title[b-9pwojxybmq] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin-bottom: 4px;
    font-size: 14px;
    font-weight: 600;
    color: var(--color-text-headings);
}

.tag[b-9pwojxybmq] {
    padding: 3px 10px;
    font-size: 11.5px;
    font-weight: 500;
    color: var(--color-text-headings);
    background: var(--calids-color-surface);
    border: 1px solid var(--calids-palette-grey-400);
    border-radius: var(--calids-border-radius-full, 999px);
}

.loc-meta[b-9pwojxybmq] {
    display: block;
    font-size: 12px;
    color: var(--color-text-body);
}

.loc.active .loc-meta[b-9pwojxybmq] {
    color: var(--calids-color-primary-700);
}

.loc-action[b-9pwojxybmq] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
    font-size: 12.5px;
    font-weight: 500;
    white-space: nowrap;
    color: var(--color-text-headings);
}

    .loc-action .material-icons[b-9pwojxybmq] {
        font-size: 18px;
    }

.loc.active .loc-action[b-9pwojxybmq] {
    color: var(--calids-color-primary-500);
}

/* ---------- Detailbereich ---------- */

/* Unten angedockt, so hoch wie der Inhalt. Reicht das Fenster nicht, scrollt
   das Formular in sich; der Kopf mit Status und Schließen bleibt stehen. */
.detail[b-9pwojxybmq] {
    flex: 0 1 auto;
    min-height: min(360px, 46vh);
    display: flex;
    flex-direction: column;
    padding: 0;
    border-color: var(--calids-color-primary-300);
}

.detail-head[b-9pwojxybmq] {
    flex: none;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 18px 16px 8px 24px;
}

    .detail-head h2[b-9pwojxybmq] {
        flex: 1;
        margin: 0;
        font-size: 14px;
        font-weight: 500;
        color: var(--color-text-headings);
    }

/* Rückmeldung des automatischen Speicherns, leise neben dem Schließen-Knopf. */
.save-status[b-9pwojxybmq] {
    font-size: 12px;
    color: var(--calids-palette-green-900);
}

    .save-status.error[b-9pwojxybmq] {
        font-weight: 500;
        color: var(--calids-palette-red-vivid-900, #a61b1b);
    }

.close[b-9pwojxybmq] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    padding: 0;
    color: var(--color-text-body);
    background: none;
    border: none;
    border-radius: 50%;
    cursor: pointer;
}

    .close:hover[b-9pwojxybmq] {
        background: var(--calids-color-surface-container-lowest);
    }

    .close .material-icons[b-9pwojxybmq] {
        font-size: 20px;
    }

/* Oben 6px Luft: Die Beschriftungen der ersten Feldzeile ragen über die
   Rahmenkante und würden vom Scrollbereich sonst abgeschnitten. */
.detail-body[b-9pwojxybmq] {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    padding: 6px 24px 24px;
}

/* ---------- Formular ---------- */

.field-grid[b-9pwojxybmq] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px 24px;
    margin-bottom: 16px;
}

    .field-grid .full[b-9pwojxybmq] {
        grid-column: 1 / -1;
    }

/* Feld mit Beschriftung auf der Rahmenkante – wie im Anfrageformular. */
.ffield[b-9pwojxybmq] {
    position: relative;
}

    .ffield > label[b-9pwojxybmq] {
        position: absolute;
        top: -6px;
        left: 10px;
        z-index: 1;
        padding: 0 5px;
        font-size: 10.5px;
        font-weight: 500;
        line-height: 1;
        white-space: nowrap;
        color: var(--color-text-headings);
        background: var(--calids-color-surface);
    }

input[type="text"][b-9pwojxybmq],
input[type="number"][b-9pwojxybmq] {
    box-sizing: border-box;
    width: 100%;
    min-height: 42px;
    padding: 10px 12px;
    font-family: inherit;
    font-size: 13.5px;
    color: var(--color-text-headings);
    background: var(--calids-color-surface);
    border: 1px solid var(--calids-palette-grey-900, #a7b3ba);
    border-radius: var(--calids-border-radius-xs, 6px);
}

    input:focus[b-9pwojxybmq] {
        outline: none;
        border-color: var(--calids-color-primary-500);
    }

/* Einheit rechts im Feld; die Pfeile des Zahlenfelds würden sie überdecken. */
.suffixed input[b-9pwojxybmq] {
    padding-right: 84px;
    -moz-appearance: textfield;
    appearance: textfield;
}

    .suffixed input[b-9pwojxybmq]::-webkit-outer-spin-button,
    .suffixed input[b-9pwojxybmq]::-webkit-inner-spin-button {
        -webkit-appearance: none;
        margin: 0;
    }

.suffix[b-9pwojxybmq] {
    position: absolute;
    top: 50%;
    right: 12px;
    transform: translateY(-50%);
    font-size: 13px;
    color: var(--color-text-body);
    pointer-events: none;
}

/* ---------- Umschalter ---------- */

.switch-grid[b-9pwojxybmq] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px 18px;
    padding: 12px 0;
    border-top: 1px solid var(--calids-palette-grey-400);
}

    /* Trennlinien nur zwischen den Schalterzeilen, nicht unter den Feldern. */
    .field-grid + .switch-grid[b-9pwojxybmq] {
        border-top: none;
        padding-top: 0;
    }

    .switch-grid:last-child[b-9pwojxybmq] {
        padding-bottom: 0;
    }

    /* Ein einzelner Schalter steht über die ganze Breite, der Hinweis bricht nicht um. */
    .switch-grid.single[b-9pwojxybmq] {
        grid-template-columns: minmax(0, 1fr);
    }

.switch[b-9pwojxybmq] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.toggle-title[b-9pwojxybmq] {
    margin: 2px 0 0;
    font-size: 13.5px;
    font-weight: 500;
    color: var(--color-text-headings);
}

.toggle[b-9pwojxybmq] {
    position: relative;
    flex-shrink: 0;
    width: 46px;
    height: 26px;
    padding: 0;
    background: var(--calids-palette-grey-400, #c3ccd3);
    border: none;
    border-radius: var(--calids-border-radius-full, 999px);
    cursor: pointer;
    transition: background .15s;
}

    .toggle.on[b-9pwojxybmq] {
        background: var(--calids-color-primary-500);
    }

    .toggle:focus-visible[b-9pwojxybmq] {
        outline: 2px solid var(--calids-color-primary-500);
        outline-offset: 2px;
    }

    .toggle .knob[b-9pwojxybmq] {
        position: absolute;
        top: 3px;
        left: 3px;
        width: 20px;
        height: 20px;
        background: #fff;
        border-radius: 50%;
        transition: left .15s;
    }

    .toggle.on .knob[b-9pwojxybmq] {
        left: 23px;
    }

/* ---------- Responsive ---------- */

@media (max-width: 960px) {
    .page-head[b-9pwojxybmq] {
        padding: 20px 16px 14px;
    }

    .page-body[b-9pwojxybmq] {
        padding: 16px;
    }

    .card[b-9pwojxybmq] {
        padding: 18px 16px;
    }

    .detail[b-9pwojxybmq] {
        padding: 0;
    }

    .detail-head[b-9pwojxybmq] {
        padding: 12px 8px 8px 16px;
    }

    .detail-body[b-9pwojxybmq] {
        padding: 6px 16px 18px;
    }
}

/* Ab hier steht die Seitenleiste über dem Inhalt (ProviderLayout) – keine
   Teilung mehr: Die Seite scrollt als Ganzes, die Details stehen im Fluss
   unter der Liste. */
@media (max-width: 900px) {
    .page[b-9pwojxybmq] {
        height: auto;
    }

    /* Der Kopf bleibt trotzdem stehen – wie auf allen Seiten (ProviderLayout
       erreicht ihn hier nicht, er liegt in .page). */
    .page-head[b-9pwojxybmq] {
        position: sticky;
        top: 0;
        z-index: 5;
    }

    /* caliScroll.reveal holt Zeile und Details ins Bild – nicht unter den
       Kopf (gemessen 91px bei 375px Breite, 112px bei 320px). */
    .loc[b-9pwojxybmq],
    .detail[b-9pwojxybmq] {
        scroll-margin-top: 140px;
    }

    .page-body[b-9pwojxybmq],
    .loc-list[b-9pwojxybmq],
    .detail-body[b-9pwojxybmq] {
        overflow-y: visible;
    }

    .list[b-9pwojxybmq],
    .list.split[b-9pwojxybmq],
    .detail[b-9pwojxybmq] {
        flex: none;
        min-height: 0;
    }
}

@media (max-width: 720px) {
    .field-grid[b-9pwojxybmq],
    .switch-grid[b-9pwojxybmq] {
        grid-template-columns: minmax(0, 1fr);
    }
}
/* /Pages/Provider/OrderDetail.razor.rz.scp.css */
/* Nur Seitenkopf und Ladezustände – der Seitenkörper und die Bausteine
   (Components/Orders) kommen aus wwwroot/css/orders.css, gemeinsam mit der
   Auftragsseite des Kunden. */

/* ---------- Seitenkopf ---------- */

.page-head[b-mlesp6kxok] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px 24px;
    padding: 24px 32px 16px;
    background: var(--calids-color-surface);
    border-bottom: 1px solid var(--calids-palette-grey-400);
}

    .page-head h1[b-mlesp6kxok] {
        margin: 4px 0 2px;
        font-size: 22px;
    }

    .page-head p[b-mlesp6kxok] {
        margin: 0;
        font-size: 13px;
        color: var(--color-text-body);
    }

/* Status und Aktionen rechts, umbrechend statt gequetscht. */
.head-side[b-mlesp6kxok] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 8px 12px;
}

.back-link[b-mlesp6kxok] {
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    color: var(--calids-color-primary-500);
}

.state[b-mlesp6kxok] {
    padding: 32px;
    font-size: 14px;
    color: var(--color-text-body);
}

.missing[b-mlesp6kxok] {
    padding: 48px 32px;
}

    .missing h1[b-mlesp6kxok] {
        margin: 0 0 8px;
        font-size: 22px;
    }

    .missing p[b-mlesp6kxok] {
        margin: 0 0 16px;
        font-size: 14px;
        color: var(--color-text-body);
    }

/* ---------- Status ---------- */

.status[b-mlesp6kxok] {
    padding: 4px 12px;
    font-size: 11.5px;
    font-weight: 600;
    white-space: nowrap;
    border-radius: var(--calids-border-radius-full);
    color: var(--calids-color-primary-500);
    background: var(--calids-color-primary-100);
}

    .status.good[b-mlesp6kxok] {
        color: var(--calids-palette-green-900, #0E5814);
        background: var(--calids-palette-green-100, #e3f9e5);
    }

    .status.muted[b-mlesp6kxok] {
        color: var(--color-text-body);
        background: var(--calids-color-surface-container-lowest);
    }

/* ---------- Responsive ---------- */

@media (max-width: 1000px) {
    .page-head[b-mlesp6kxok] {
        padding: 16px;
    }
}

@media (max-width: 600px) {
    .page-head[b-mlesp6kxok] {
        flex-direction: column;
    }

    .head-side[b-mlesp6kxok] {
        justify-content: flex-start;
    }
}
/* /Pages/Provider/Orders.razor.rz.scp.css */
/* ---------- Seitenkopf ---------- */

.page-head[b-un1snc01w4] {
    padding: 24px 32px 16px;
    background: var(--calids-color-surface);
    border-bottom: 1px solid var(--calids-palette-grey-400);
}

    .page-head h1[b-un1snc01w4] {
        margin: 0 0 4px;
        font-size: 24px;
    }

    .page-head p[b-un1snc01w4] {
        margin: 0;
        font-size: 13.5px;
        color: var(--color-text-body);
    }

.page-body[b-un1snc01w4] {
    padding: 32px;
}

/* ---------- Zellen ---------- */

.status[b-un1snc01w4] {
    display: inline-block;
    padding: 4px 12px;
    font-size: 11.5px;
    font-weight: 600;
    white-space: nowrap;
    border-radius: var(--calids-border-radius-full);
    color: var(--calids-color-primary-500);
    background: var(--calids-color-primary-100);
}

    .status.good[b-un1snc01w4] {
        color: var(--calids-palette-green-900, #0E5814);
        background: var(--calids-palette-green-100, #e3f9e5);
    }

    .status.muted[b-un1snc01w4] {
        color: var(--color-text-body);
        background: var(--calids-color-surface-container-lowest);
    }

/* Der fehlende Schein ist die eigentliche Arbeitsanzeige dieser Liste. */
.certs[b-un1snc01w4] {
    font-size: 12.5px;
    font-weight: 600;
    white-space: nowrap;
}

    .certs.good[b-un1snc01w4] {
        color: var(--calids-palette-green-900, #0E5814);
    }

    .certs.open[b-un1snc01w4] {
        color: var(--calids-palette-red-vivid-900, #a61b1b);
    }

/* ---------- Responsive ---------- */

@media (max-width: 900px) {
    .page-head[b-un1snc01w4] {
        padding: 16px;
    }

    .page-body[b-un1snc01w4] {
        padding: 16px;
    }
}
/* /Pages/Provider/Overview.razor.rz.scp.css */
/* ---------- Seitenkopf ---------- */

.page-head[b-6eux5lxzbi] {
    padding: 24px 32px 16px;
    background: var(--calids-color-surface);
    border-bottom: 1px solid var(--calids-palette-grey-400);
}

    .page-head h1[b-6eux5lxzbi] {
        margin: 0 0 4px;
        font-size: 24px;
    }

    .page-head p[b-6eux5lxzbi] {
        margin: 0;
        font-size: 13.5px;
        color: var(--color-text-body);
    }

.page-body[b-6eux5lxzbi] {
    padding: 32px;
}

.state[b-6eux5lxzbi] {
    font-size: 14px;
    color: var(--color-text-body);
}

    .state.error[b-6eux5lxzbi] {
        color: var(--calids-palette-red-vivid-900, #a61b1b);
    }

/* ---------- Kennzahlen ---------- */

.kpis[b-6eux5lxzbi] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 16px;
    margin-bottom: 24px;
}

.kpi[b-6eux5lxzbi] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 18px 20px;
    text-align: left;
    font-family: inherit;
    background: var(--calids-color-surface);
    border: 1px solid var(--calids-palette-grey-400);
    border-radius: var(--calids-border-radius-lg, 10px);
}

/* Anklickbare Kacheln führen in den passenden Reiter des Eingangs. */
button.kpi[b-6eux5lxzbi] {
    cursor: pointer;
}

    button.kpi:hover[b-6eux5lxzbi] {
        border-color: var(--calids-color-primary-500);
    }

.kpi .value[b-6eux5lxzbi] {
    font-size: 28px;
    font-weight: 700;
    line-height: 1.1;
    color: var(--color-text-headings);
}

.kpi .label[b-6eux5lxzbi] {
    font-size: 12.5px;
    color: var(--color-text-body);
}

.kpi.accent .value[b-6eux5lxzbi] {
    color: var(--calids-color-primary-500);
}

.kpi.urgent[b-6eux5lxzbi] {
    border-color: var(--calids-palette-red-vivid-900, #a61b1b);
}

    .kpi.urgent .value[b-6eux5lxzbi] {
        color: var(--calids-palette-red-vivid-900, #a61b1b);
    }

/* ---------- Dringendste Anfragen ---------- */

.card[b-6eux5lxzbi] {
    padding: 20px;
    background: var(--calids-color-surface);
    border: 1px solid var(--calids-palette-grey-400);
    border-radius: var(--calids-border-radius-lg, 10px);
}

.card-head[b-6eux5lxzbi] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 8px;
}

    .card-head h2[b-6eux5lxzbi] {
        margin: 0;
        font-size: 16px;
    }

    .card-head a[b-6eux5lxzbi] {
        font-size: 13px;
        text-decoration: none;
        color: var(--calids-color-primary-500);
    }

.empty[b-6eux5lxzbi] {
    margin: 12px 0 0;
    font-size: 13.5px;
    color: var(--color-text-body);
}

.urgent-list[b-6eux5lxzbi] {
    margin: 0;
    padding: 0;
    list-style: none;
}

    .urgent-list li + li[b-6eux5lxzbi] {
        border-top: 1px solid var(--calids-palette-grey-400);
    }

    .urgent-list button[b-6eux5lxzbi] {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 16px;
        width: 100%;
        padding: 12px 0;
        text-align: left;
        font-family: inherit;
        background: none;
        border: none;
        cursor: pointer;
    }

.main[b-6eux5lxzbi] {
    margin: 0 0 2px;
    font-size: 14px;
    font-weight: 700;
    color: var(--color-text-headings);
}

.sub[b-6eux5lxzbi] {
    margin: 0;
    font-size: 12.5px;
    color: var(--color-text-body);
}

.due[b-6eux5lxzbi] {
    font-size: 13.5px;
    font-weight: 700;
    white-space: nowrap;
    color: var(--color-text-headings);
}

    .due.urgent[b-6eux5lxzbi] {
        color: var(--calids-palette-red-vivid-900, #a61b1b);
    }

/* ---------- Responsive ---------- */

@media (max-width: 900px) {
    .page-body[b-6eux5lxzbi] {
        padding: 16px;
    }
}
/* /Pages/Provider/Prices.razor.rz.scp.css */
/* Preisliste: mehrere Tabellen untereinander; Zahlen rechtsbündig, Felder füllen die Spalte. */
.price-table select.cal-input[b-9oefrte4kx],
.price-table input.cal-input[b-9oefrte4kx] {
    min-width: 0;
    width: 100%;
    box-sizing: border-box;
}

.price-table input.price[b-9oefrte4kx] {
    text-align: right;
}

.price-table.points td:nth-child(1)[b-9oefrte4kx] { width: 150px; }
.price-table.points td:nth-child(2)[b-9oefrte4kx] { width: 150px; }
.price-table.points td:nth-child(3)[b-9oefrte4kx] { width: 120px; }
.price-table.points td:nth-child(5)[b-9oefrte4kx] { width: 120px; }
.price-table.points td:nth-child(6)[b-9oefrte4kx] { width: 100px; }
.price-table.points td:nth-child(7)[b-9oefrte4kx] { width: 90px; }

.price-table.simple td:nth-child(1)[b-9oefrte4kx] { width: 200px; }
.price-table.simple td:nth-child(2)[b-9oefrte4kx] { width: 150px; }
.price-table.simple td:nth-child(4)[b-9oefrte4kx] { width: 110px; }
.price-table.simple td:nth-child(5)[b-9oefrte4kx] { width: 70px; }

.price-table.cmc td:nth-child(5)[b-9oefrte4kx] { width: 110px; }

.cmc-formula[b-9oefrte4kx] {
    font-size: 12.5px;
}

.block[b-9oefrte4kx] {
    display: block;
}

.source[b-9oefrte4kx] {
    display: block;
    margin-top: 2px;
}

.filter-row[b-9oefrte4kx] {
    margin: 0 0 8px;
    max-width: 320px;
}

.cmc-group[b-9oefrte4kx] {
    margin-top: 8px;
    padding: 8px 10px;
    border: 1px solid var(--calids-palette-grey-400);
    border-radius: var(--calids-border-radius-md, 8px);
}

    .cmc-group summary[b-9oefrte4kx] {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
        cursor: pointer;
    }

.cmc-title[b-9oefrte4kx] {
    font-weight: 600;
    color: var(--color-text-headings);
}

.cmc-bulk[b-9oefrte4kx] {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 8px;
    margin: 10px 0;
}

    .cmc-bulk label[b-9oefrte4kx] {
        display: flex;
        flex-direction: column;
        gap: 4px;
        font-size: 13px;
    }

.device-search[b-9oefrte4kx] {
    position: relative;
    max-width: 420px;
    margin-bottom: 10px;
}

.device-hits[b-9oefrte4kx] {
    margin: 4px 0 0;
    padding: 6px 0;
    list-style: none;
    border: 1px solid var(--calids-palette-grey-400);
    border-radius: var(--calids-border-radius-md, 8px);
    background: var(--calids-color-surface);
}

    .device-hits li[b-9oefrte4kx] {
        padding: 4px 10px;
    }

.head-buttons[b-9oefrte4kx] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.adjust-row[b-9oefrte4kx] {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 14px;
}

    .adjust-row label:first-child[b-9oefrte4kx] {
        display: flex;
        flex-direction: column;
        gap: 4px;
        font-size: 13px;
        max-width: 160px;
    }

.import-card[b-9oefrte4kx] {
    border-color: var(--calids-color-primary-300);
}

.import-steps[b-9oefrte4kx] {
    display: flex;
    gap: 18px;
    margin: 0 0 12px;
    padding-left: 18px;
    font-size: 13px;
    color: var(--color-text-body);
}

    .import-steps li.active[b-9oefrte4kx] {
        font-weight: 600;
        color: var(--calids-color-primary-500);
    }

.upload-btn[b-9oefrte4kx] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    font-weight: 600;
    color: var(--calids-color-primary-500);
    border: 1px dashed var(--calids-color-primary-300);
    border-radius: var(--calids-border-radius-md, 8px);
    cursor: pointer;
}

    .upload-btn[b-9oefrte4kx]  input[type=file] {
        display: none;
    }

.map-table th[b-9oefrte4kx] {
    vertical-align: bottom;
    min-width: 140px;
}

.col-name[b-9oefrte4kx] {
    display: block;
    margin-bottom: 4px;
    font-weight: 600;
}

.map-table td[b-9oefrte4kx] {
    font-size: 12.5px;
    white-space: nowrap;
}

.import-actions[b-9oefrte4kx] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 12px;
}

.review-chips[b-9oefrte4kx] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 10px;
}

.review-table tr.row-unsure td[b-9oefrte4kx] {
    background: var(--calids-palette-yellow-vivid-100, #fff8e1);
}

.review-table tr.row-error td[b-9oefrte4kx] {
    background: var(--calids-palette-red-vivid-100, #fde2e2);
}

.hint[b-9oefrte4kx] {
    margin: 12px 0 0;
}
/* /Pages/Provider/Profile.razor.rz.scp.css */
/* ---------- Seitenkopf ---------- */

.page-head[b-65fkg0225z] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 24px 32px 16px;
    background: var(--calids-color-surface);
    border-bottom: 1px solid var(--calids-palette-grey-400);
}

    .page-head h1[b-65fkg0225z] {
        margin: 0 0 4px;
        font-size: 24px;
    }

    .page-head p[b-65fkg0225z] {
        margin: 0;
        font-size: 13.5px;
        color: var(--color-text-body);
    }

/* Sichtbarkeit fürs Listing: Entwurf (gelb) oder aktiviert (grün). */
.status[b-65fkg0225z] {
    flex-shrink: 0;
    padding: 6px 12px;
    font-size: 12px;
    font-weight: 700;
    white-space: nowrap;
    border-radius: var(--calids-border-radius-sm, 6px);
}

    .status.draft[b-65fkg0225z] {
        color: #7a5b00;
        background: #ffe9a8;
    }

    .status.live[b-65fkg0225z] {
        color: var(--calids-palette-green-900);
        background: var(--calids-palette-green-200);
    }

.page-body[b-65fkg0225z] {
    padding: 32px;
}

.state[b-65fkg0225z] {
    font-size: 14px;
    color: var(--color-text-body);
}

    .state.error[b-65fkg0225z] {
        color: var(--calids-palette-red-vivid-900, #a61b1b);
    }

.card[b-65fkg0225z] {
    padding: 24px;
    background: var(--calids-color-surface);
    border: 1px solid var(--calids-palette-grey-400);
    border-radius: var(--calids-border-radius-lg, 10px);
}

.banner[b-65fkg0225z] {
    margin: 0 0 16px;
    padding: 10px 14px;
    font-size: 13.5px;
    border-radius: var(--calids-border-radius-lg, 10px);
}

    .banner.ok[b-65fkg0225z] {
        color: var(--calids-palette-green-900);
        background: var(--calids-palette-green-200);
    }

    .banner.error[b-65fkg0225z] {
        color: var(--calids-palette-red-vivid-900, #a61b1b);
        background: var(--calids-palette-red-vivid-200, #fde2e2);
    }

.hint[b-65fkg0225z] {
    margin: 4px 0 0;
    font-size: 12px;
    color: var(--color-text-body);
}

    .hint a[b-65fkg0225z] {
        font-weight: 600;
        color: var(--calids-color-primary-500);
    }

/* ---------- Profilbild ---------- */

.logo-row[b-65fkg0225z] {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 24px;
}

.logo[b-65fkg0225z] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    flex-shrink: 0;
    overflow: hidden;
    background: var(--calids-color-surface-container-lowest);
    border: 1px solid var(--calids-palette-grey-400);
    border-radius: var(--calids-border-radius-sm, 8px);
}

    .logo img[b-65fkg0225z] {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .logo .material-icons[b-65fkg0225z] {
        font-size: 30px;
        color: var(--color-text-disabled, #98a4ad);
    }

.logo-name[b-65fkg0225z] {
    margin: 0 0 4px;
    font-size: 15px;
    font-weight: 700;
    color: var(--color-text-headings);
}

/* Textlink mit Kamera statt Rahmen-Button – das Bild ist Nebensache. */
.upload-btn[b-65fkg0225z] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    font-weight: 600;
    color: var(--calids-color-primary-500);
    cursor: pointer;
}

    .upload-btn .material-icons[b-65fkg0225z] {
        font-size: 18px;
    }

    /* Das native Datei-Feld verstecken – der Label-Text ist der Button. */
    .upload-btn[b-65fkg0225z]  input[type="file"] {
        display: none;
    }

/* ---------- Ansicht ---------- */

.section-head[b-65fkg0225z] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 4px;
}

    .section-head h2[b-65fkg0225z] {
        margin: 0;
        font-size: 17px;
    }

.facts[b-65fkg0225z] {
    margin: 0;
}

    .facts > div[b-65fkg0225z] {
        display: flex;
        justify-content: space-between;
        gap: 24px;
        padding: 11px 0;
        font-size: 13.5px;
        border-bottom: 1px solid var(--calids-palette-grey-400);
    }

        .facts > div:last-child[b-65fkg0225z] {
            border-bottom: none;
        }

    .facts dt[b-65fkg0225z] {
        flex-shrink: 0;
        font-weight: 400;
        color: var(--color-text-headings);
    }

    .facts dd[b-65fkg0225z] {
        margin: 0;
        text-align: right;
        color: var(--color-text-headings);
        overflow-wrap: anywhere;
    }

    /* Langtext steht linksbündig neben dem Begriff, statt rechts zu kleben. */
    .facts > div.long[b-65fkg0225z] {
        justify-content: flex-start;
    }

        .facts > div.long dt[b-65fkg0225z] {
            width: 120px;
        }

        .facts > div.long dd[b-65fkg0225z] {
            text-align: left;
            white-space: pre-line;
        }

/* ---------- Formular ---------- */

.field-grid[b-65fkg0225z] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px 18px;
}

    .field-grid .full[b-65fkg0225z] {
        grid-column: 1 / -1;
    }

    .field-grid .hint.full[b-65fkg0225z] {
        margin-top: -12px;
    }

/* PLZ schmal, Ort breit – als eigene Zeile über die volle Breite. */
.place[b-65fkg0225z] {
    display: grid;
    grid-template-columns: minmax(90px, 160px) 1fr;
    gap: 18px;
}

/* Feld mit Beschriftung auf der Rahmenkante – wie im Anfrageformular. */
.ffield[b-65fkg0225z] {
    position: relative;
}

    .ffield > label[b-65fkg0225z] {
        position: absolute;
        top: -6px;
        left: 10px;
        z-index: 1;
        padding: 0 5px;
        font-size: 10.5px;
        font-weight: 500;
        line-height: 1;
        white-space: nowrap;
        color: var(--color-text-headings);
        background: var(--calids-color-surface);
    }

input[type="text"][b-65fkg0225z],
input[type="email"][b-65fkg0225z],
input[type="tel"][b-65fkg0225z],
textarea[b-65fkg0225z] {
    box-sizing: border-box;
    width: 100%;
    min-height: 42px;
    padding: 10px 12px;
    font-family: inherit;
    font-size: 13.5px;
    color: var(--color-text-headings);
    background: var(--calids-color-surface);
    border: 1px solid var(--calids-palette-grey-900, #a7b3ba);
    border-radius: var(--calids-border-radius-xs, 6px);
}

    input:focus[b-65fkg0225z],
    textarea:focus[b-65fkg0225z] {
        outline: none;
        border-color: var(--calids-color-primary-500);
    }

textarea[b-65fkg0225z] {
    display: block;
    min-height: 0;
    resize: vertical;
}

.area-label[b-65fkg0225z] {
    display: block;
    margin: 20px 0 6px;
    font-size: 13.5px;
    font-weight: 500;
    color: var(--color-text-headings);
}

/* ---------- Umschalter ---------- */

.toggle-row[b-65fkg0225z] {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-top: 20px;
    padding-top: 16px;
    border-top: 1px solid var(--calids-palette-grey-400);
}

.toggle-title[b-65fkg0225z] {
    margin: 0 0 2px;
    font-size: 14px;
    font-weight: 600;
    color: var(--color-text-headings);
}

.toggle[b-65fkg0225z] {
    position: relative;
    flex-shrink: 0;
    width: 46px;
    height: 26px;
    padding: 0;
    background: var(--calids-palette-grey-400, #c3ccd3);
    border: none;
    border-radius: var(--calids-border-radius-full, 999px);
    cursor: pointer;
    transition: background .15s;
}

    .toggle.on[b-65fkg0225z] {
        background: var(--calids-color-primary-500);
    }

    .toggle:disabled[b-65fkg0225z] {
        opacity: 0.45;
        cursor: not-allowed;
    }

    .toggle .knob[b-65fkg0225z] {
        position: absolute;
        top: 3px;
        left: 3px;
        width: 20px;
        height: 20px;
        background: #fff;
        border-radius: 50%;
        transition: left .15s;
    }

    .toggle.on .knob[b-65fkg0225z] {
        left: 23px;
    }

/* ---------- Aktionen ---------- */

.actions[b-65fkg0225z] {
    display: flex;
    gap: 12px;
    margin-top: 24px;
    flex-wrap: wrap;
}

/* ---------- Responsive ---------- */

@media (max-width: 960px) {
    .page-head[b-65fkg0225z] {
        padding: 20px 16px 14px;
    }

    .page-body[b-65fkg0225z] {
        padding: 16px;
    }

    .card[b-65fkg0225z] {
        padding: 18px 16px;
    }
}

@media (max-width: 600px) {
    .field-grid[b-65fkg0225z] {
        grid-template-columns: minmax(0, 1fr);
    }

    .facts > div[b-65fkg0225z],
    .facts > div.long[b-65fkg0225z] {
        flex-direction: column;
        gap: 2px;
    }

        .facts dd[b-65fkg0225z],
        .facts > div.long dd[b-65fkg0225z] {
            text-align: left;
        }
}

/* ---------- Abwesenheit ---------- */

.card + .card[b-65fkg0225z] {
    margin-top: 16px;
}

.hint.lead[b-65fkg0225z] {
    margin: 0 0 12px;
    font-size: 13px;
}

.absence-current[b-65fkg0225z] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
    margin: 0 0 12px;
    padding: 8px 12px;
    font-size: 14px;
    font-weight: 600;
    color: var(--color-text-headings);
    background: var(--calids-color-primary-opacity-08);
    border-radius: var(--calids-border-radius-sm, 6px);
}

    .absence-current .material-icons[b-65fkg0225z] {
        font-size: 18px;
    }

.absence-note[b-65fkg0225z] {
    font-weight: 400;
}

/* ---------- Bedingungen und Provision ---------- */

.terms-check[b-65fkg0225z] {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin: 10px 0 0;
    font-size: 13px;
    color: var(--color-text-headings);
}

    .terms-check input[b-65fkg0225z] {
        margin-top: 3px;
        flex-shrink: 0;
    }

.terms-current[b-65fkg0225z] {
    margin: 0 0 12px;
    font-size: 14px;
}
/* /Pages/Provider/RequestDetail.razor.rz.scp.css */
/* ---------- Zustände ---------- */

.state[b-2uvemjfd2a] {
    padding: 32px;
    font-size: 14px;
    color: var(--color-text-body);
}

    .state.error[b-2uvemjfd2a] {
        color: var(--calids-palette-red-vivid-900, #a61b1b);
    }

/* ---------- Seitenkopf ---------- */

.page-head[b-2uvemjfd2a] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
    padding: 20px 32px 16px;
    background: var(--calids-color-surface);
    border-bottom: 1px solid var(--calids-palette-grey-400);
}

    .page-head h1[b-2uvemjfd2a] {
        margin: 0 0 4px;
        font-size: 24px;
    }

    .page-head p[b-2uvemjfd2a] {
        margin: 0;
        font-size: 13.5px;
        color: var(--color-text-body);
    }

/* Status des Versuchs rechts oben – Farben wie in der Liste (Requests.razor.css). */
.status[b-2uvemjfd2a] {
    padding: 4px 12px;
    font-size: 11.5px;
    font-weight: 600;
    white-space: nowrap;
    border-radius: var(--calids-border-radius-full);
    color: var(--calids-color-primary-500);
    background: var(--calids-color-primary-100);
}

    .status.new[b-2uvemjfd2a] {
        color: var(--calids-palette-yellow-vivid-950);
        background: var(--calids-palette-yellow-vivid-300);
    }

    .status.good[b-2uvemjfd2a] {
        color: var(--calids-palette-green-900, #0E5814);
        background: var(--calids-palette-green-100, #e3f9e5);
    }

    .status.muted[b-2uvemjfd2a] {
        color: var(--color-text-body);
        background: var(--calids-palette-grey-300);
    }

.back-link[b-2uvemjfd2a] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-bottom: 10px;
    font-size: 13px;
    text-decoration: none;
    color: var(--calids-color-primary-500);
}

    .back-link .material-icons[b-2uvemjfd2a] {
        font-size: 18px;
    }

/* ---------- Layout ---------- */

.page-body[b-2uvemjfd2a] {
    padding: 24px 32px 40px;
}

.columns[b-2uvemjfd2a] {
    display: grid;
    grid-template-columns: minmax(300px, 1fr) minmax(0, 1.15fr);
    gap: 24px;
    align-items: start;
}

.card[b-2uvemjfd2a] {
    margin-bottom: 20px;
    padding: 20px;
    background: var(--calids-color-surface);
    border: 1px solid var(--calids-palette-grey-400);
    border-radius: var(--calids-border-radius-lg, 10px);
}

    .card h2[b-2uvemjfd2a] {
        margin: 0 0 4px;
        font-size: 17px;
    }

.card-sub[b-2uvemjfd2a] {
    margin: 0 0 14px;
    font-size: 12.5px;
    color: var(--color-text-body);
}

.card-head[b-2uvemjfd2a] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
}

    .card-head h2[b-2uvemjfd2a] {
        margin: 0;
    }

.chip[b-2uvemjfd2a] {
    padding: 3px 10px;
    font-size: 12px;
    font-weight: 600;
    color: var(--calids-color-primary-500);
    background: var(--calids-color-surface-container-lowest);
    border-radius: var(--calids-border-radius-full, 999px);
}

.banner[b-2uvemjfd2a] {
    margin: 0 0 16px;
    padding: 10px 14px;
    font-size: 13.5px;
    border-radius: var(--calids-border-radius-lg, 10px);
}

    .banner.ok[b-2uvemjfd2a] {
        color: var(--calids-palette-green-900);
        background: var(--calids-palette-green-200);
    }

    .banner.error[b-2uvemjfd2a] {
        color: var(--calids-palette-red-vivid-900, #a61b1b);
        background: var(--calids-palette-red-vivid-200, #fde2e2);
    }

/* ---------- Passende Daten: Checks ---------- */

.check[b-2uvemjfd2a] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 10px 0;
    border-top: 1px solid var(--calids-palette-grey-400);
}

    .check:first-of-type[b-2uvemjfd2a] {
        border-top: none;
        padding-top: 0;
    }

    .check .material-icons[b-2uvemjfd2a] {
        font-size: 22px;
    }

    .check.ok .material-icons[b-2uvemjfd2a] {
        color: var(--calids-palette-green-900, #0e7a34);
    }

    .check.warn .material-icons[b-2uvemjfd2a] {
        color: var(--calids-palette-yellow-vivid-900, #a66b00);
    }

    .check .main[b-2uvemjfd2a] {
        margin: 0 0 2px;
        font-size: 14px;
        font-weight: 700;
        color: var(--color-text-headings);
    }

    .check .sub[b-2uvemjfd2a] {
        margin: 0;
        font-size: 12.5px;
        color: var(--color-text-body);
    }

/* ---------- Messpunkte ---------- */

.points[b-2uvemjfd2a] {
    margin: 0;
    display: grid;
    grid-template-columns: max-content 1fr;
    gap: 8px 16px;
}

    .points dt[b-2uvemjfd2a] {
        font-size: 13.5px;
        font-weight: 700;
        color: var(--color-text-headings);
    }

    .points dd[b-2uvemjfd2a] {
        margin: 0;
        font-size: 13.5px;
        color: var(--color-text-body);
    }

/* Zwischenüberschriften: erst die Punkte des Kunden, dann der Datenblatt-Vorschlag. */
.points-label[b-2uvemjfd2a] {
    margin: 14px 0 8px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: var(--color-text-headings);
}

    .card h2 + .points-label[b-2uvemjfd2a] {
        margin-top: 10px;
    }

.points-head[b-2uvemjfd2a] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 20px;
    padding-top: 16px;
    border-top: 1px solid var(--calids-palette-grey-400);
}

    .points-head .points-label[b-2uvemjfd2a] {
        margin: 0;
    }

.points-head + .card-sub[b-2uvemjfd2a] {
    margin-top: 4px;
}

.points-item[b-2uvemjfd2a] {
    margin: 10px 0 6px;
    font-size: 13px;
    font-weight: 600;
    color: var(--color-text-headings);
}

/* Die Wünsche des Kunden sind verbindlich – farbig abgesetzt vom Vorschlag. */
.points.custom[b-2uvemjfd2a] {
    padding: 10px 12px;
    background: var(--calids-color-surface-container-lowest);
    border-left: 3px solid var(--calids-color-primary-500);
    border-radius: var(--calids-border-radius-sm, 6px);
}

    .points.custom dd[b-2uvemjfd2a] {
        color: var(--color-text-headings);
    }

.scope-note[b-2uvemjfd2a] {
    margin: 8px 0 0;
    font-size: 12.5px;
    line-height: 1.5;
    color: var(--color-text-body);
}

.customer-message[b-2uvemjfd2a] {
    margin: 8px 0 0;
    font-size: 14px;
    line-height: 1.5;
    white-space: pre-wrap;
    color: var(--color-text-headings);
}

.scope-result[b-2uvemjfd2a] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 14px 0 0;
    padding: 10px 12px;
    font-size: 13px;
    border-radius: var(--calids-border-radius-sm, 6px);
}

    .scope-result .material-icons[b-2uvemjfd2a] {
        font-size: 18px;
    }

    .scope-result.ok[b-2uvemjfd2a] {
        color: var(--calids-palette-green-900);
        background: var(--calids-palette-green-200);
    }

    .scope-result.warn[b-2uvemjfd2a] {
        color: var(--calids-palette-yellow-vivid-900);
        background: var(--calids-palette-yellow-vivid-200);
    }

/* ---------- Gerätekopf ---------- */

.device-head[b-2uvemjfd2a] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 18px;
}

    .device-head h2[b-2uvemjfd2a] {
        margin: 0 0 4px;
    }

.device-meta[b-2uvemjfd2a] {
    margin: 0;
    font-size: 13px;
    color: var(--color-text-body);
}

.deadline-badge[b-2uvemjfd2a] {
    padding: 5px 12px;
    font-size: 12.5px;
    font-weight: 600;
    white-space: nowrap;
    color: var(--color-text-body);
    background: var(--calids-color-surface-container-lowest);
    border-radius: var(--calids-border-radius-full, 999px);
}

    .deadline-badge.urgent[b-2uvemjfd2a] {
        color: var(--calids-palette-red-vivid-900, #a61b1b);
        background: var(--calids-palette-red-vivid-200, #fde2e2);
    }

/* ---------- Formular ---------- */

.form-grid[b-2uvemjfd2a] {
    display: grid;
    gap: 16px;
}

    .form-grid.two[b-2uvemjfd2a] {
        grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    }

        /* Beschriftung, Feld und Fehler je in einer gemeinsamen Zeile (subgrid):
           Die Felder stehen bündig, auch wenn eine Beschriftung umbricht oder nur
           unter einem Feld ein Fehler steht. */
        .form-grid.two > label[b-2uvemjfd2a],
        .form-grid.two > .readout[b-2uvemjfd2a] {
            display: grid;
            grid-row: span 3;
            grid-template-rows: subgrid;
            row-gap: 0;
        }

            .form-grid.two > label .label-text[b-2uvemjfd2a],
            .form-grid.two > .readout .label-text[b-2uvemjfd2a] {
                align-self: end;
            }

label[b-2uvemjfd2a],
.readout[b-2uvemjfd2a] {
    display: block;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--color-text-headings);
}

/* Gesamtpreis aus den Posten: Anzeige statt Feld, gleiche Höhe wie die Eingabe daneben. */
.price-sum[b-2uvemjfd2a] {
    margin-top: 6px;
    padding: 9px 0;
    font-size: 16px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    border-bottom: 1px solid transparent;
}

.price-sum-hint[b-2uvemjfd2a] {
    font-size: 12px;
    font-weight: 400;
    color: var(--color-text-body);
}

    label.full[b-2uvemjfd2a] {
        margin-top: 16px;
    }

    label input[b-2uvemjfd2a],
    label select[b-2uvemjfd2a],
    label textarea[b-2uvemjfd2a] {
        display: block;
        width: 100%;
        margin-top: 6px;
        padding: 9px 10px;
        font-size: 14px;
        font-weight: 400;
        font-family: inherit;
        color: var(--color-text-headings);
        background: var(--calids-color-surface);
        border: 1px solid var(--calids-palette-grey-400);
        border-radius: var(--calids-border-radius-sm, 6px);
    }

/* Pflichtfeld-Kennzeichen wie im Anfrageformular (NewInquiry.razor.css). */
.required[b-2uvemjfd2a] {
    font-weight: 700;
    color: var(--calids-palette-red-vivid-800, #ab091e);
}

label input.invalid[b-2uvemjfd2a] {
    border-color: var(--calids-palette-red-vivid-800, #ab091e);
}

.field-error[b-2uvemjfd2a] {
    display: block;
    margin-top: 4px;
    font-size: 12px;
    font-weight: 600;
    color: var(--calids-palette-red-vivid-900, #a61b1b);
}

/* Warum nicht gesendet werden kann – direkt unter den Knöpfen. */
.validation[b-2uvemjfd2a] {
    margin: 10px 0 0;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--calids-palette-red-vivid-900, #a61b1b);
}

.with-suffix[b-2uvemjfd2a] {
    position: relative;
}

    .with-suffix span[b-2uvemjfd2a] {
        position: absolute;
        right: 10px;
        top: 22px;
        font-size: 13px;
        font-weight: 400;
        color: var(--color-text-body);
    }

h3.section[b-2uvemjfd2a] {
    margin: 24px 0 4px;
    font-size: 16px;
}

/* Messpunkte im Angebot: je Position ein Block, bei mehreren getrennt. */
.quote-points + .quote-points[b-2uvemjfd2a] {
    margin-top: 8px;
    padding-top: 4px;
    border-top: 1px solid var(--calids-palette-grey-400);
}

/* Vom Kunden festgelegte Konditionen – nur zur Ansicht, nicht wählbar. */
.fixed-terms[b-2uvemjfd2a] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: 13.5px;
    color: var(--color-text-headings);
}

    .fixed-terms li[b-2uvemjfd2a] {
        display: flex;
        align-items: center;
        gap: 8px;
    }

    .fixed-terms .material-icons[b-2uvemjfd2a] {
        font-size: 18px;
        color: var(--calids-palette-green-900, #0e7a34);
    }

/* ---------- Segmentierte Auswahl ---------- */

.segmented-field[b-2uvemjfd2a] {
    margin-top: 16px;
}

    /* Abstand zum folgenden Feldblock (Gültigkeit), sonst klebt dessen Beschriftung an den Knöpfen. */
    .segmented-field + .form-grid[b-2uvemjfd2a],
    .fixed-terms + .form-grid[b-2uvemjfd2a] {
        margin-top: 16px;
    }

.seg-label[b-2uvemjfd2a] {
    display: block;
    margin-bottom: 6px;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--color-text-headings);
}

.segmented[b-2uvemjfd2a] {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 8px;
}

.seg[b-2uvemjfd2a] {
    padding: 7px 14px;
    font-size: 13px;
    font-family: inherit;
    color: var(--color-text-body);
    background: var(--calids-color-surface);
    border: 1px solid var(--calids-palette-grey-400);
    border-radius: var(--calids-border-radius-sm, 6px);
    cursor: pointer;
}

    .seg.active[b-2uvemjfd2a] {
        color: var(--calids-color-primary-500);
        font-weight: 600;
        background: var(--calids-color-surface-container-lowest);
        border-color: var(--calids-color-primary-500);
    }

/* ---------- Aktionen ---------- */

.actions[b-2uvemjfd2a] {
    display: flex;
    gap: 12px;
    margin-top: 24px;
    flex-wrap: wrap;
}

button:disabled[b-2uvemjfd2a] {
    opacity: .5;
    cursor: default;
}

/* ---------- Absage (MudPopover) ---------- */

/* Anker des Popovers: genau so groß wie der Knopf. */
.decline-anchor[b-2uvemjfd2a] {
    display: inline-flex;
}

.decline-panel[b-2uvemjfd2a] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 16px;
}

    /* Felder wie im Angebotsformular (Regel „label select/textarea" oben). */
    .decline-panel textarea[b-2uvemjfd2a] {
        resize: vertical;
    }

.decline-title[b-2uvemjfd2a] {
    margin: 0;
    font-size: 15px;
    font-weight: 700;
    color: var(--color-text-headings);
}

.decline-sub[b-2uvemjfd2a] {
    margin: -8px 0 0;
    font-size: 12.5px;
    color: var(--color-text-body);
}

.decline-actions[b-2uvemjfd2a] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
}

.closed-note[b-2uvemjfd2a] {
    margin: 8px 0 0;
    font-size: 13.5px;
    color: var(--color-text-body);
}

/* Angenommen: weiter geht es am Auftrag. */
.order-link[b-2uvemjfd2a] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-top: 10px;
    font-size: 13.5px;
    font-weight: 600;
    text-decoration: none;
    color: var(--calids-color-primary-500);
}

    .order-link .material-icons[b-2uvemjfd2a] {
        font-size: 18px;
    }

/* ---------- Positionstabelle ---------- */

table.items[b-2uvemjfd2a] {
    width: 100%;
    border-collapse: collapse;
}

    table.items th[b-2uvemjfd2a] {
        padding: 8px 10px;
        font-size: 11.5px;
        font-weight: 600;
        letter-spacing: .05em;
        text-transform: uppercase;
        text-align: left;
        color: var(--color-text-headings);
        border-bottom: 1px solid var(--calids-palette-grey-400);
    }

    table.items td[b-2uvemjfd2a] {
        padding: 10px;
        font-size: 13.5px;
        vertical-align: top;
        border-bottom: 1px solid var(--calids-palette-grey-400);
    }

    table.items .num[b-2uvemjfd2a] {
        text-align: right;
    }

.main[b-2uvemjfd2a] {
    margin: 0 0 2px;
    font-weight: 700;
    color: var(--color-text-headings);
}

.sub[b-2uvemjfd2a] {
    margin: 0;
    font-size: 12.5px;
    color: var(--color-text-body);
}

.cov[b-2uvemjfd2a] {
    display: inline-block;
    padding: 3px 8px;
    font-size: 12px;
    font-weight: 600;
    border-radius: var(--calids-border-radius-sm, 6px);
}

    .cov.ok[b-2uvemjfd2a] {
        color: var(--calids-palette-green-900);
        background: var(--calids-palette-green-200);
    }

    .cov.gap[b-2uvemjfd2a] {
        color: var(--calids-palette-yellow-vivid-900);
        background: var(--calids-palette-yellow-vivid-200);
    }

    .cov.unknown[b-2uvemjfd2a] {
        color: var(--color-text-body);
        background: var(--calids-color-surface-container-lowest);
    }

    .cov.limited[b-2uvemjfd2a] {
        color: var(--calids-palette-green-900);
        background: var(--calids-palette-yellow-vivid-200);
    }

.cov-note[b-2uvemjfd2a] {
    margin: 4px 0 0;
    font-size: 11.5px;
    line-height: 1.4;
    color: var(--color-text-body);
}

/* ---------- Angebotshistorie ---------- */

.quote-row[b-2uvemjfd2a] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 12px 0;
    border-bottom: 1px solid var(--calids-palette-grey-400);
}

    .quote-row:last-child[b-2uvemjfd2a] {
        border-bottom: none;
    }

    .quote-row.old[b-2uvemjfd2a] {
        opacity: .6;
    }

/* ---------- Rückfragen-Thread ---------- */

.thread .messages[b-2uvemjfd2a] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    max-height: 300px;
    margin-bottom: 12px;
    overflow-y: auto;
}

/* Wie in einem Chat: eigene Nachrichten rechts, Antworten des Kunden links. */
.msg[b-2uvemjfd2a] {
    max-width: 85%;
    padding: 8px 10px;
    border-radius: var(--calids-border-radius-sm, 6px);
}

    .msg.mine[b-2uvemjfd2a] {
        align-self: flex-end;
        background: var(--calids-color-primary-100);
    }

    .msg.theirs[b-2uvemjfd2a] {
        align-self: flex-start;
        background: var(--calids-palette-grey-200, #f1f3f5);
    }

    .msg .meta[b-2uvemjfd2a] {
        margin: 0 0 2px;
        font-size: 11.5px;
        color: var(--color-text-body);
    }

    .msg .body[b-2uvemjfd2a] {
        margin: 0;
        font-size: 13.5px;
        white-space: pre-wrap;
        color: var(--color-text-headings);
    }

.thread textarea[b-2uvemjfd2a] {
    display: block;
    width: 100%;
    padding: 8px 10px;
    font-family: inherit;
    font-size: 13.5px;
    border: 1px solid var(--calids-palette-grey-400);
    border-radius: var(--calids-border-radius-sm, 6px);
}

/* ---------- Responsive ---------- */

@media (max-width: 1000px) {
    .columns[b-2uvemjfd2a] {
        grid-template-columns: minmax(0, 1fr);
    }

    .page-head[b-2uvemjfd2a],
    .page-body[b-2uvemjfd2a] {
        padding-left: 16px;
        padding-right: 16px;
    }
}

@media (max-width: 600px) {
    /* Status unter die Überschrift statt daneben gequetscht. */
    .page-head[b-2uvemjfd2a] {
        flex-direction: column;
        gap: 10px;
    }
}

/* ---------- Angebotsposten, Anhänge ---------- */

/* Posten als Blöcke: Bezeichnung oben, darunter Bezug, Art und Rechnung –
   die Zeile bricht um, wenn die Angebotsspalte schmal ist. */
.quote-lines[b-2uvemjfd2a] {
    margin-top: 4px;
    border-top: 1px solid var(--calids-palette-grey-400);
}

.qline[b-2uvemjfd2a] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 6px 4px;
    padding: 10px 0;
    border-bottom: 1px solid var(--calids-palette-grey-400);
}

    .qline input[b-2uvemjfd2a],
    .qline select[b-2uvemjfd2a] {
        min-width: 0;
        box-sizing: border-box;
        padding: 6px 8px;
        font-size: 13.5px;
        font-family: inherit;
        color: var(--color-text-headings);
        background: var(--calids-color-surface);
        border: 1px solid var(--calids-palette-grey-400);
        border-radius: var(--calids-border-radius-sm, 6px);
    }

    .qline .with-suffix input[b-2uvemjfd2a] {
        width: 100%;
        padding-right: 26px;
        text-align: right;
    }

    .qline .ql-label input[b-2uvemjfd2a] {
        width: 100%;
    }

    .qline.check .ql-label input[b-2uvemjfd2a] {
        border-color: var(--calids-palette-yellow-vivid-600, #e8a400);
    }

.ql-meta[b-2uvemjfd2a] {
    grid-column: 1 / -1;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 8px;
}

    .ql-meta .ql-target[b-2uvemjfd2a] {
        flex: 1 1 140px;
    }

    .ql-meta .ql-mode[b-2uvemjfd2a] {
        flex: 0 1 130px;
    }

    .ql-meta .ql-kind[b-2uvemjfd2a] {
        flex: 1 1 140px;
        font-size: 13px;
        color: var(--color-text-body);
    }

.ql-calc[b-2uvemjfd2a] {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-left: auto;
    font-size: 13px;
    color: var(--color-text-body);
    white-space: nowrap;
}

    .ql-calc input[b-2uvemjfd2a] {
        text-align: right;
    }

    .ql-calc .ql-qty[b-2uvemjfd2a] {
        width: 64px;
    }

    .ql-calc .ql-price[b-2uvemjfd2a] {
        width: 96px;
    }

.ql-price-fixed[b-2uvemjfd2a],
.ql-total[b-2uvemjfd2a] {
    min-width: 72px;
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.ql-total[b-2uvemjfd2a] {
    font-weight: 600;
    color: var(--color-text-headings);
}

/* Bedarfs- und Wahlposten zählen nicht zur Summe – grau und kursiv. */
.qline.not-in-sum .ql-total[b-2uvemjfd2a] {
    font-weight: 400;
    font-style: italic;
    color: var(--color-text-body);
}

.ql-sum[b-2uvemjfd2a] {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    padding: 10px 0 0;
    font-weight: 600;
    color: var(--color-text-headings);
}

.ql-note[b-2uvemjfd2a] {
    margin: 4px 0 0;
    font-size: 12px;
    color: var(--color-text-body);
}

.line-source[b-2uvemjfd2a] {
    display: flex;
    align-items: flex-start;
    gap: 4px;
    margin: 3px 0 0;
    font-size: 12px;
    line-height: 16px;
    color: var(--color-text-body);
}

    .line-source .material-icons[b-2uvemjfd2a] {
        font-size: 14px;
        color: var(--calids-palette-yellow-vivid-900, #a66b00);
    }

.line-breakdown[b-2uvemjfd2a] {
    margin-top: 2px;
    font-size: 12px;
    color: var(--color-text-body);
}

    .line-breakdown summary[b-2uvemjfd2a] {
        cursor: pointer;
        color: var(--calids-color-primary-500);
    }

    .line-breakdown ul[b-2uvemjfd2a] {
        margin: 4px 0 0;
        padding-left: 16px;
    }

.with-suffix.discount span[b-2uvemjfd2a] {
    top: 50%;
    transform: translateY(-50%);
}

.review-note[b-2uvemjfd2a] {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 0 0 12px;
    padding: 8px 12px;
    font-size: 13px;
    color: var(--calids-color-primary-500);
    background: var(--calids-color-primary-100);
    border-radius: var(--calids-border-radius-lg, 10px);
}

.document-section[b-2uvemjfd2a] {
    margin: 14px 0 6px;
    padding: 10px 12px;
    border: 1px solid var(--calids-palette-grey-400);
    border-radius: var(--calids-border-radius-lg, 10px);
}

    .document-section summary[b-2uvemjfd2a] {
        display: flex;
        align-items: center;
        gap: 6px;
        cursor: pointer;
        font-weight: 600;
        color: var(--color-text-headings);
    }

    .document-section textarea[b-2uvemjfd2a] {
        width: 100%;
        box-sizing: border-box;
    }

.quote-number[b-2uvemjfd2a] {
    font-variant-numeric: tabular-nums;
}

.line-actions[b-2uvemjfd2a] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 8px;
    margin: 6px 0 10px;
}

.line-remove[b-2uvemjfd2a] {
    padding: 0 6px;
    font-size: 18px;
    line-height: 1;
    color: var(--color-text-body);
    background: none;
    border: none;
    cursor: pointer;
}

.attachment-list[b-2uvemjfd2a] {
    display: grid;
    gap: 6px;
    margin: 0 0 12px;
    padding: 0;
    list-style: none;
}

    .attachment-list li[b-2uvemjfd2a] {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 4px 10px;
        font-size: 14px;
    }

.upload-btn[b-2uvemjfd2a] {
    position: relative;
    display: inline-flex;
    align-items: center;
    padding: 7px 14px;
    font-size: 13.5px;
    font-weight: 600;
    color: var(--calids-color-primary-500);
    border: 1px solid var(--calids-color-primary-500);
    border-radius: 8px;
    cursor: pointer;
}

    .upload-btn[b-2uvemjfd2a]  input[type=file] {
        position: absolute;
        inset: 0;
        opacity: 0;
        cursor: pointer;
    }
/* /Pages/Provider/Requests.razor.rz.scp.css */
/* ---------- Seitenkopf ---------- */

.page-head[b-o8lltnlw8s] {
    padding: 24px 32px 16px;
    background: var(--calids-color-surface);
    border-bottom: 1px solid var(--calids-palette-grey-400);
}

    .page-head h1[b-o8lltnlw8s] {
        margin: 0 0 4px;
        font-size: 24px;
    }

    .page-head p[b-o8lltnlw8s] {
        margin: 0;
        font-size: 13.5px;
        color: var(--color-text-body);
    }

.page-body[b-o8lltnlw8s] {
    padding: 32px;
}

/* ---------- Reiter + Suche ---------- */

/* Die Reiter stehen in der Karte (nicht als Chips darüber wie in den übrigen
   Listen) – sie sind der Posteingang des Labors. */
.inbox-toolbar[b-o8lltnlw8s] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 0 20px;
    border-bottom: 1px solid var(--calids-palette-grey-400);
}

.tabs[b-o8lltnlw8s] {
    display: flex;
    align-items: stretch;
    gap: 8px;
}

.tab[b-o8lltnlw8s] {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 16px 12px;
    font-size: 14px;
    font-weight: 500;
    color: var(--color-text-body);
    background: none;
    border: none;
    cursor: pointer;
}

    .tab.active[b-o8lltnlw8s] {
        color: var(--calids-color-primary-500);
        font-weight: 700;
    }

        .tab.active[b-o8lltnlw8s]::after {
            content: "";
            position: absolute;
            left: 8px;
            right: 8px;
            bottom: 0;
            height: 3px;
            background: var(--calids-color-primary-500);
            border-radius: var(--calids-border-radius-full) var(--calids-border-radius-full) 0 0;
        }

.tab-badge[b-o8lltnlw8s] {
    padding: 2px 8px;
    font-size: 11.5px;
    font-weight: 600;
    color: var(--calids-palette-yellow-vivid-950);
    background: var(--calids-palette-yellow-vivid-300);
    border-radius: var(--calids-border-radius-sm, 6px);
}

/* ---------- Tabelle ---------- */

/* Bis zu sechs Spalten brauchen Platz: lieber seitlich scrollen als quetschen. */
.list-table[b-o8lltnlw8s] {
    min-width: 860px;
}

.deadline[b-o8lltnlw8s] {
    font-size: 13.5px;
    font-weight: 700;
    white-space: nowrap;
    color: var(--color-text-headings);
}

    /* Unter sechs Stunden Restlaufzeit farblich hervorheben. */
    .deadline.urgent[b-o8lltnlw8s] {
        color: var(--calids-palette-red-vivid-900, #a61b1b);
    }

    /* Pausierte Frist ist nicht dringend – zurückgenommen darstellen. */
    .deadline.paused-row[b-o8lltnlw8s] {
        font-weight: 500;
        color: var(--color-text-body);
    }

.paused[b-o8lltnlw8s] {
    display: inline-block;
    margin-left: 6px;
    padding: 2px 8px;
    font-size: 11.5px;
    font-weight: 600;
    color: var(--color-text-body);
    background: var(--calids-color-surface-container-lowest);
    border: 1px solid var(--calids-palette-grey-400);
    border-radius: var(--calids-border-radius-full, 999px);
}

.match[b-o8lltnlw8s] {
    display: inline-block;
    padding: 4px 10px;
    font-size: 13px;
    font-weight: 700;
    border-radius: var(--calids-border-radius-sm, 6px);
}

    .match.high[b-o8lltnlw8s] {
        color: var(--calids-palette-green-900);
        background: var(--calids-palette-green-200);
    }

    .match.mid[b-o8lltnlw8s] {
        color: var(--calids-palette-yellow-vivid-900);
        background: var(--calids-palette-yellow-vivid-200);
    }

    .match.low[b-o8lltnlw8s] {
        color: var(--calids-palette-red-vivid-900);
        background: var(--calids-palette-red-vivid-200, #fde2e2);
    }

.status[b-o8lltnlw8s] {
    display: inline-block;
    padding: 4px 12px;
    font-size: 11.5px;
    font-weight: 600;
    white-space: nowrap;
    border-radius: var(--calids-border-radius-full);
    color: var(--calids-color-primary-500);
    background: var(--calids-color-primary-100);
}

    .status.new[b-o8lltnlw8s] {
        color: var(--calids-palette-yellow-vivid-950);
        background: var(--calids-palette-yellow-vivid-300);
    }

    .status.good[b-o8lltnlw8s] {
        color: var(--calids-palette-green-900, #0E5814);
        background: var(--calids-palette-green-100, #e3f9e5);
    }

    .status.muted[b-o8lltnlw8s] {
        color: var(--color-text-body);
        background: var(--calids-palette-grey-300);
    }

/* ---------- Responsive ---------- */

@media (max-width: 900px) {
    .page-body[b-o8lltnlw8s] {
        padding: 16px;
    }

    .inbox-toolbar[b-o8lltnlw8s] {
        flex-wrap: wrap;
        padding: 0 12px 8px;
    }
}
/* /Pages/QuoteApproval.razor.rz.scp.css */
.approval-page[b-qjwy34pgbx] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 32px 16px 48px;
    background: var(--calids-color-neutral-100);
}

.card[b-qjwy34pgbx] {
    width: 100%;
    max-width: 640px;
    margin: 0 auto;
    box-sizing: border-box;
    padding: 24px;
    border: 1px solid var(--calids-color-neutral-200);
    border-radius: 16px;
    background: var(--calids-color-surface);
    color: var(--color-text-body);
}

    .card h1[b-qjwy34pgbx] {
        margin: 0;
        font-size: var(--calids-fontsize-h3);
        line-height: 1.3;
    }

    .card h2[b-qjwy34pgbx] {
        margin: 20px 0 8px;
        font-size: 15px;
        color: var(--color-text-headings);
    }

.eyebrow[b-qjwy34pgbx] {
    margin: 0 0 4px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--calids-color-neutral-600);
}

.state[b-qjwy34pgbx] {
    text-align: center;
    color: var(--calids-color-neutral-700);
}

.message[b-qjwy34pgbx] {
    margin: 12px 0 0;
    padding: 10px 14px;
    white-space: pre-wrap;
    border-left: 3px solid var(--calids-color-primary-300);
    background: var(--calids-color-neutral-100);
}

.facts[b-qjwy34pgbx] {
    display: grid;
    grid-template-columns: max-content 1fr;
    gap: 6px 16px;
    margin: 20px 0 0;
    padding-top: 16px;
    border-top: 1px solid var(--calids-color-neutral-200);
    font-size: 14.5px;
}

    .facts dt[b-qjwy34pgbx] {
        color: var(--calids-color-neutral-700);
    }

    .facts dd[b-qjwy34pgbx] {
        margin: 0;
        overflow-wrap: anywhere;
    }

.total[b-qjwy34pgbx] {
    font-weight: 600;
    color: var(--color-text-headings);
}

.gross[b-qjwy34pgbx] {
    display: block;
    font-size: 13px;
    font-weight: 400;
    color: var(--color-text-body);
}

.lines[b-qjwy34pgbx] {
    width: 100%;
    table-layout: fixed;
    border-collapse: collapse;
    font-size: 14px;
}

    .lines col.calc[b-qjwy34pgbx] {
        width: 9.5em;
    }

    .lines col.sum[b-qjwy34pgbx] {
        width: 6.5em;
    }

    .lines .muted[b-qjwy34pgbx],
    .lines .calc-inline[b-qjwy34pgbx] {
        font-size: 13px;
        color: var(--color-text-body);
    }

    .lines .calc-inline[b-qjwy34pgbx] {
        display: none;
    }

/* Schmal: „Menge × Preis“ unter die Bezeichnung, die Spalte fällt weg. */
@media (max-width: 520px) {
    .lines col.calc[b-qjwy34pgbx] {
        width: 0;
    }

    .lines td.calc[b-qjwy34pgbx] {
        padding: 0;
        font-size: 0;
        overflow: hidden;
    }

    .lines .calc-inline[b-qjwy34pgbx] {
        display: block;
        font-size: 12px;
    }
}

    .lines td[b-qjwy34pgbx] {
        padding: 6px 4px;
        overflow-wrap: anywhere;
        border-bottom: 1px solid var(--calids-color-neutral-200);
    }

    .lines .num[b-qjwy34pgbx] {
        text-align: right;
        white-space: nowrap;
    }

.item-name[b-qjwy34pgbx] {
    margin: 10px 0 4px;
    font-weight: 600;
    color: var(--color-text-headings);
}

.points[b-qjwy34pgbx] {
    display: grid;
    grid-template-columns: max-content 1fr;
    gap: 4px 12px;
    margin: 0;
    font-size: 13.5px;
}

    .points dd[b-qjwy34pgbx] {
        margin: 0;
    }

.muted[b-qjwy34pgbx] {
    color: var(--calids-color-neutral-700);
    font-size: 13.5px;
}

.pdf-link[b-qjwy34pgbx] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 20px;
    font-weight: 600;
    color: var(--calids-color-primary-500);
    text-decoration: none;
}

.decision label[b-qjwy34pgbx] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-top: 12px;
    font-size: 14px;
}

.decision input[b-qjwy34pgbx],
.decision textarea[b-qjwy34pgbx] {
    width: 100%;
    box-sizing: border-box;
}

.buttons[b-qjwy34pgbx] {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 16px;
}

.status[b-qjwy34pgbx] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 16px 0 0;
    padding: 12px 14px;
    border-radius: 10px;
    font-weight: 600;
}

.status--valid[b-qjwy34pgbx] {
    background: var(--calids-color-success-100);
    color: var(--calids-color-success-900);
}

.status--closed[b-qjwy34pgbx] {
    background: var(--calids-color-warning-100);
    color: var(--calids-color-warning-900);
}

.error[b-qjwy34pgbx] {
    margin-top: 10px;
    font-size: 13px;
    color: var(--calids-color-error-900);
}
/* /Pages/QuoteCheck.razor.rz.scp.css */
/* Wie die Prüfseite der Kalibriermarke: Handy zuerst, oben die Antwort. */
.check-page[b-b1n54xpf9b] {
    flex: 1;
    padding: 32px 16px 48px;
    background: var(--calids-color-neutral-100);
}

.card[b-b1n54xpf9b] {
    max-width: 520px;
    margin: 0 auto;
    padding: 24px;
    border: 1px solid var(--calids-color-neutral-200);
    border-radius: 16px;
    background: var(--calids-color-surface);
    color: var(--color-text-body);
}

    .card h1[b-b1n54xpf9b] {
        margin: 0;
        font-size: var(--calids-fontsize-h3);
        line-height: 1.3;
    }

    .card > p[b-b1n54xpf9b] {
        margin: 8px 0 0;
    }

.state[b-b1n54xpf9b] {
    text-align: center;
    color: var(--calids-color-neutral-700);
}

.status[b-b1n54xpf9b] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 20px;
    padding: 12px 14px;
    border-radius: 10px;
    font-weight: 600;
    line-height: 1.3;
}

    .status .material-icons[b-b1n54xpf9b] {
        font-size: 22px;
    }

.status--valid[b-b1n54xpf9b] {
    background: var(--calids-color-success-100);
    color: var(--calids-color-success-900);
}

.status--expired[b-b1n54xpf9b] {
    background: var(--calids-color-warning-100);
    color: var(--calids-color-warning-900);
}

.status--unknown[b-b1n54xpf9b] {
    background: var(--calids-color-error-100);
    color: var(--calids-color-error-900);
}

.facts[b-b1n54xpf9b] {
    display: grid;
    grid-template-columns: max-content 1fr;
    gap: 8px 16px;
    margin: 20px 0 12px;
    padding-top: 16px;
    border-top: 1px solid var(--calids-color-neutral-200);
    font-size: 15px;
}

    .facts dt[b-b1n54xpf9b] {
        color: var(--calids-color-neutral-700);
    }

    .facts dd[b-b1n54xpf9b] {
        margin: 0;
        overflow-wrap: anywhere;
    }

.hash[b-b1n54xpf9b] {
    font-family: ui-monospace, Consolas, monospace;
    font-size: 13px;
}

.hint[b-b1n54xpf9b] {
    font-size: 13px;
    color: var(--calids-color-neutral-700);
}

.action[b-b1n54xpf9b] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 16px;
    font-weight: 600;
    color: var(--calids-color-primary-500);
    text-decoration: none;
}
/* /Pages/ResetPassword.razor.rz.scp.css */
/* Dieselbe Karte wie auf /login: Wer aus der Mail hierherkommt, soll sehen,
   dass er bei derselben Anwendung gelandet ist. */
main[b-u8pyw2e02p] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 48px 16px;
    background: var(--calids-color-surface-container-lowest);
}

.reset-card[b-u8pyw2e02p] {
    width: 100%;
    max-width: 380px;
    padding: 32px;
    background: var(--calids-color-surface);
    border: 1px solid var(--calids-palette-grey-400);
    border-radius: var(--calids-border-radius-lg);
}

    .reset-card h1[b-u8pyw2e02p] {
        margin: 0 0 4px;
        font-size: 22px;
    }

.sub[b-u8pyw2e02p] {
    margin: 0 0 24px;
    font-size: 13.5px;
    line-height: 1.5;
    color: var(--color-text-body);
}

label[b-u8pyw2e02p] {
    display: block;
    margin: 0 0 6px;
    font-size: 13px;
    font-weight: 600;
    color: var(--color-text-headings);
}

input[b-u8pyw2e02p] {
    width: 100%;
    margin-bottom: 16px;
    padding: 10px 12px;
    font-size: 14px;
    color: var(--color-text-headings);
    background: var(--calids-color-surface);
    border: 1px solid var(--calids-palette-grey-400);
    border-radius: var(--calids-border-radius-md);
    outline: none;
}

    input:focus[b-u8pyw2e02p] {
        border-color: var(--calids-color-primary-500);
    }

.error[b-u8pyw2e02p] {
    margin: 0 0 16px;
    font-size: 13px;
    color: var(--calids-palette-red-vivid-800);
}

/* Weg zu einem neuen Link – steht immer da, weil er gegen jeden Grund hilft,
   aus dem der mitgebrachte nicht mehr trägt. */
.switch[b-u8pyw2e02p] {
    margin: 16px 0 0;
    font-size: 13px;
    text-align: center;
    color: var(--color-text-body);
}

.link[b-u8pyw2e02p] {
    font-weight: 600;
    color: var(--calids-color-primary-500);
    text-decoration: underline;
}