/* Portal auth: detect WebKit autofill so JS can sync MudTextField bindings. */
@keyframes portalAutofillStart {
    from { opacity: 1; }
    to { opacity: 1; }
}

.portal-auth-field:-webkit-autofill {
    animation-name: portalAutofillStart;
    animation-duration: 0.01s;
}

/* Invoice preview dialog: scroll inside dialog on short viewports (phones). */
.invoice-preview-dialog .mud-dialog-content {
    max-height: min(88dvh, calc(100dvh - 7rem));
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
}

.invoice-preview-dialog-container {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    padding-left: max(4px, env(safe-area-inset-left));
    padding-right: max(4px, env(safe-area-inset-right));
}

.invoice-preview-dialog-container .mud-grid {
    align-items: stretch;
}

/* Preview column: stretch with the dialog row so the gray card can grow on desktop. */
.invoice-preview-column {
    display: flex;
    flex-direction: column;
    align-self: stretch;
    min-width: 0;
}

/* Keep preview visible while editing — left column scrolls instead of pushing iframe off-screen. */
.invoice-preview-details-column.is-editing {
    max-height: min(72dvh, calc(100dvh - 10rem));
    overflow-y: auto;
    overscroll-behavior: contain;
    align-self: start;
}

/* Grid so the iframe can height:100% and grow with the dialog row (taller left column). */
.invoice-preview-frame-shell {
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    overflow: hidden;
    min-width: 0;
    background-color: #e0e0e0;
    padding: clamp(8px, 2.5vw, 20px);
    border-radius: 8px;
    flex: 1 1 auto;
    min-height: clamp(300px, 50dvh, 440px);
    display: grid;
    grid-template-rows: minmax(0, 1fr);
    align-self: stretch;
}

.invoice-preview-frame-shell--fullscreen {
    min-height: clamp(340px, 54dvh, 500px);
}

.invoice-preview-frame-shell--easy {
    overflow: auto;
    justify-items: center;
}

.invoice-preview-frame-placeholder {
    width: 100%;
    height: 100%;
    min-height: clamp(280px, 48dvh, 520px);
}

.invoice-preview-iframe {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    display: block;
    border: none;
    background: #e2e8f0;
    border-radius: 4px;
    transition: min-height 0.3s ease, height 0.3s ease;
    align-self: stretch;
    box-sizing: border-box;
    /* Single-column layout: parent has no definite height, so use a concrete viewport-based height. */
    height: clamp(320px, 58dvh, 680px);
    min-height: clamp(320px, 58dvh, 680px);
}

.invoice-preview-iframe--fullscreen {
    height: clamp(400px, 76dvh, 820px);
    min-height: clamp(400px, 76dvh, 820px);
}

.invoice-preview-mf-host {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    display: block;
    border: none;
    background: white;
    border-radius: 4px;
    box-sizing: border-box;
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    align-self: stretch;
    height: clamp(320px, 58dvh, 680px);
    min-height: clamp(320px, 58dvh, 680px);
}

.invoice-preview-mf-host--fullscreen {
    height: clamp(400px, 76dvh, 820px);
    min-height: clamp(400px, 76dvh, 820px);
}

.invoice-preview-mf-page {
    display: flex;
    justify-content: center;
    padding-bottom: clamp(8px, 1.5vw, 12px);
}

.invoice-preview-mf-page:last-child {
    padding-bottom: 0;
}

.invoice-preview-mf-canvas {
    display: block;
    max-width: 100%;
    height: auto;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12);
}

.invoice-preview-nav {
    width: 100%;
    row-gap: 0.5rem;
}

.invoice-preview-nav-counter {
    min-width: 4.5rem;
    justify-content: center;
}

.invoice-preview-title-nav {
    min-width: 0;
}

.invoice-preview-title-nav-counter {
    flex: 1 1 auto;
    text-align: center;
    white-space: nowrap;
}

.invoice-preview-title-nav-btn {
    flex: 0 0 auto;
}

.invoice-preview-dialog-content-focus:focus {
    outline: none;
}

/* Desktop / tablet: tall preview area; shell min-height tracks viewport so the card fills space. */
@media (min-width: 960px) {
    .invoice-preview-dialog .mud-dialog-content {
        max-height: min(92dvh, calc(100dvh - 3.5rem));
    }

    .invoice-preview-frame-shell {
        min-height: min(560px, calc(100dvh - 14rem));
    }

    .invoice-preview-frame-shell--fullscreen {
        min-height: min(620px, calc(100dvh - 11rem));
    }

    .invoice-preview-frame-shell--easy .invoice-preview-iframe:not(.invoice-preview-iframe--fullscreen) {
        width: min(230mm, 100%);
        justify-self: center;
    }

    .invoice-preview-frame-shell--easy .invoice-preview-iframe--fullscreen {
        width: min(230mm, 100%);
        justify-self: center;
    }

    .invoice-preview-frame-placeholder {
        min-height: min(520px, calc(100dvh - 15rem));
    }

    /* Split layout: row height comes from the taller column — iframe fills the gray shell. */
    .invoice-preview-iframe:not(.invoice-preview-iframe--fullscreen) {
        height: 100%;
        min-height: min(560px, calc(100dvh - 14rem));
    }

    /* Fullscreen hides the left column, so there is no row stretch — use viewport-based height. */
    .invoice-preview-iframe--fullscreen {
        height: min(780px, calc(100dvh - 10rem));
        min-height: min(640px, calc(100dvh - 11rem));
    }
}

@media (max-width: 600px) {
    .invoice-preview-dialog .mud-dialog-content {
        max-height: calc(100dvh - 5.5rem);
    }

    .invoice-preview-nav-btn {
        flex: 1 1 auto;
        min-width: 0;
    }
}

h1:focus {
    outline: none;
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid #e50000;
}

.validation-message {
    color: #e50000;
}

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

    .blazor-error-boundary::after {
        content: "An error has occurred."
    }

.darker-border-checkbox.form-check-input {
    border-color: #929292;
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
    color: var(--bs-secondary-color);
    text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
    text-align: start;
}

/* Short fixed "Typ" (VAT, etc.): never wrap; column also gets min-width on MudTd/MudTh */
.easyksef-table-cell-type {
    white-space: nowrap;
}

.easyksef-table-header-label--sortable {
    cursor: pointer;
    user-select: none;
}

.easyksef-table-cell--preview-dblclick {
    cursor: pointer;
}

.easyksef-empty-pin-btn {
    border: 0;
    background: transparent;
    color: #9e9e9e;
    cursor: pointer;
    padding: 0 0.25rem;
    font: inherit;
    line-height: 1.2;
    text-decoration: none;
}

.easyksef-empty-pin-btn:hover,
.easyksef-empty-pin-btn:focus-visible {
    color: var(--mud-palette-primary);
    text-decoration: underline;
    outline: none;
}

.easyksef-empty-pin-placeholder {
    color: #ccc;
}

.easyksef-pin-assign-hit {
    display: block;
    width: 100%;
    min-height: 1.5rem;
    margin: -16px -16px;
    padding: 16px 16px;
    box-sizing: content-box;
    cursor: pointer;
    border-radius: 4px;
}
.mud-table-dense .easyksef-pin-assign-hit {
    margin-block: -6px;
    padding-block: 6px;
}
.easyksef-pin-assign-hit:focus-visible {
    outline: 2px solid var(--mud-palette-primary);
    outline-offset: 2px;
}
.easyksef-pin-assign-hit .easyksef-empty-pin-btn {
    cursor: pointer;
}

/* --- Invoice table cell clamp (global): scoped CSS cannot target ClampedCellText/MudTooltip DOM reliably --- */
.mud-table-cell > .easyksef-table-cell-clamp-root {
    flex: 1 1 auto;
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
}

.easyksef-table-cell-clamp-root {
    display: block;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
}

.mud-tooltip-root.easyksef-table-cell-clamp-tooltip {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

.easyksef-table-cell-clamp-empty {
    color: #ccc;
    font-style: italic;
}

.easyksef-table-cell-clamp-text {
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: var(--easyksef-table-line-clamp, 2) !important;
    line-clamp: var(--easyksef-table-line-clamp, 2) !important;
    overflow: hidden !important;
    word-break: break-word;
    overflow-wrap: anywhere;
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
    line-height: 1.43;
    max-height: calc(var(--easyksef-table-line-clamp, 2) * 1.43em);
    max-height: calc(var(--easyksef-table-line-clamp, 2) * 1lh);
    text-overflow: ellipsis;
}

/* Portal instruction page (/instrukcja-portalu) */
.portal-instruction-page {
    --instruction-accent: var(--mud-palette-primary, #594ae2);
    --instruction-surface: var(--mud-palette-surface, #fff);
    --instruction-muted: var(--mud-palette-text-secondary, #64748b);
    --instruction-border: var(--mud-palette-lines-default, #e2e8f0);
}

.portal-instruction-surface {
    background: var(--instruction-surface);
    border: 1px solid var(--instruction-border);
    border-radius: 12px;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
    overflow: hidden;
}

.instruction-doc {
    color: var(--mud-palette-text-primary, #1e293b);
    font-size: 1rem;
    line-height: 1.65;
}

.instruction-hero {
    padding: 2rem 2.25rem 1.5rem;
    background: linear-gradient(
        135deg,
        color-mix(in srgb, var(--instruction-accent) 12%, transparent),
        color-mix(in srgb, var(--instruction-accent) 4%, transparent)
    );
    border-bottom: 1px solid var(--instruction-border);
}

.instruction-eyebrow {
    margin: 0 0 0.35rem;
    font-size: 0.8125rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--instruction-accent);
}

.instruction-doc .instruction-title {
    margin: 0 0 0.75rem;
    font-size: clamp(1.5rem, 2.5vw, 2rem);
    font-weight: 700;
    line-height: 1.2;
}

.instruction-lead {
    margin: 0;
    max-width: 42rem;
    font-size: 1.0625rem;
    color: var(--instruction-muted);
}

.instruction-meta {
    margin: 1rem 0 0;
    font-size: 0.875rem;
    color: var(--instruction-muted);
}

.instruction-layout {
    display: grid;
    grid-template-columns: minmax(200px, 240px) 1fr;
    gap: 0;
    align-items: start;
}

@media (max-width: 960px) {
    .instruction-layout {
        grid-template-columns: 1fr;
    }
}

.instruction-toc {
    position: sticky;
    top: 1rem;
    max-height: calc(100vh - 2rem);
    overflow-y: auto;
    padding: 1.25rem 1rem 1.25rem 1.25rem;
    border-right: 1px solid var(--instruction-border);
    background: color-mix(in srgb, var(--instruction-surface) 96%, var(--instruction-accent));
}

@media (max-width: 960px) {
    .instruction-toc {
        position: static;
        max-height: none;
        border-right: none;
        border-bottom: 1px solid var(--instruction-border);
    }
}

.instruction-toc-title {
    margin: 0 0 0.75rem;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--instruction-muted);
}

.instruction-toc-list {
    margin: 0;
    padding-left: 1.35rem;
    font-size: 0.8125rem;
    line-height: 1.5;
    list-style-position: outside;
}

.instruction-toc-list li::marker {
    font-weight: 600;
    color: var(--instruction-accent);
}

.instruction-toc-list a {
    color: var(--mud-palette-text-primary, #334155);
    text-decoration: none;
}

.instruction-toc-list a:hover {
    color: var(--instruction-accent);
    text-decoration: underline;
}

.instruction-main {
    min-width: 0;
}

.instruction-body {
    padding: 1.75rem 2.25rem 2rem;
}

.instruction-section {
    margin-bottom: 2.5rem;
    padding-bottom: 2rem;
    border-bottom: 1px solid var(--instruction-border);
}

.instruction-section:last-child {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
}

.instruction-body h2 {
    margin: 0 0 1rem;
    font-size: 1.375rem;
    font-weight: 700;
    line-height: 1.3;
    scroll-margin-top: 1rem;
}

.instruction-body h3 {
    margin: 1.5rem 0 0.75rem;
    font-size: 1.0625rem;
    font-weight: 600;
    scroll-margin-top: 1rem;
}

.instruction-body p,
.instruction-body ul,
.instruction-body ol,
.instruction-body dl {
    margin: 0 0 1rem;
}

.instruction-body li + li {
    margin-top: 0.35rem;
}

/* Shared prose list alignment (instruction + Aktualności markdown) */
:is(.instruction-body, .aktualnosci-body) ul {
    list-style-type: disc;
}

:is(.instruction-body, .aktualnosci-body) ol {
    list-style-type: decimal;
}

:is(.instruction-body, .aktualnosci-body) :is(ul, ol) {
    margin-left: 0;
    padding-left: 1.5rem;
    list-style-position: outside;
}

:is(.instruction-body, .aktualnosci-body) li > :last-child {
    margin-bottom: 0;
}

.instruction-body code {
    padding: 0.1em 0.35em;
    border-radius: 4px;
    font-size: 0.9em;
    background: color-mix(in srgb, var(--instruction-border) 60%, transparent);
}

.instruction-glossary {
    display: grid;
    gap: 0;
    margin: 0;
}

.instruction-glossary dt {
    margin-top: 1rem;
    font-weight: 700;
    color: var(--mud-palette-text-primary, #0f172a);
}

.instruction-glossary dt:first-child {
    margin-top: 0;
}

.instruction-glossary dd {
    margin: 0.25rem 0 0;
    padding-left: 0;
    color: var(--instruction-muted);
}

.instruction-table {
    border-collapse: collapse;
    width: 100%;
    margin: 1rem 0 1.25rem;
    font-size: 0.9375rem;
}

.instruction-table th,
.instruction-table td {
    border: 1px solid var(--instruction-border);
    padding: 0.6rem 0.75rem;
    text-align: left;
    vertical-align: top;
}

.instruction-table th {
    background: color-mix(in srgb, var(--instruction-accent) 8%, transparent);
    font-weight: 600;
}

.instruction-faq {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.instruction-faq-item {
    border: 1px solid var(--instruction-border);
    border-radius: 8px;
    overflow: hidden;
    background: color-mix(in srgb, var(--instruction-surface) 98%, var(--instruction-accent));
}

.instruction-faq-item summary {
    padding: 0.75rem 1rem;
    font-weight: 600;
    cursor: pointer;
    list-style: none;
}

.instruction-faq-item summary::-webkit-details-marker {
    display: none;
}

.instruction-faq-item[open] summary {
    border-bottom: 1px solid var(--instruction-border);
    background: color-mix(in srgb, var(--instruction-accent) 6%, transparent);
}

.instruction-faq-item p {
    margin: 0;
    padding: 0.75rem 1rem 1rem;
}

.instruction-footer {
    margin: 0;
    padding: 1rem 2.25rem 1.5rem;
    font-size: 0.875rem;
    color: var(--instruction-muted);
    border-top: 1px solid var(--instruction-border);
}

a.portal-instruction-link {
    color: var(--instruction-accent);
    font-weight: 600;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 2px;
}

a.portal-instruction-link:hover {
    text-decoration-thickness: 2px;
}

a.portal-instruction-link[href^="/"] {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 0.9em;
    font-weight: 500;
}

/* --- Main portal app bar (Direction C, option A) --- */
.portal-app-bar {
    padding-inline: 16px;
    gap: 0;
    min-height: var(--mud-appbar-height, 64px);
    background-color: #212940;
    background-image: linear-gradient(
        90deg,
        #161b2b 0%,
        #1e2438 12%,
        #2a3350 50%,
        #1e2438 88%,
        #161b2b 100%
    );
    color: #fff;
    box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.06);
}

.portal-app-bar .mud-toolbar {
    align-items: stretch;
    min-height: var(--mud-appbar-height, 64px);
    padding-inline: 0;
}

.portal-app-bar-start {
    display: flex;
    align-items: stretch;
    flex-shrink: 1;
    min-width: 0;
}

.portal-app-bar-brand {
    display: flex;
    align-items: center;
    flex-shrink: 0;
    color: #fff;
    min-width: 0;
    padding-right: 4px;
}

.portal-app-bar-brand-logo,
.portal-app-bar-brand-logo img {
    height: 28px;
    width: auto;
    display: block;
}

.portal-app-bar-wordmark {
    display: inline-flex;
    align-items: baseline;
    line-height: 1;
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    white-space: nowrap;
}

.portal-app-bar-wordmark-text {
    color: #fff;
}

.portal-app-bar-wordmark-accent {
    color: #e5c464;
}

.portal-app-bar-nav--desktop {
    display: flex;
    align-items: stretch;
    flex-wrap: nowrap;
    gap: 0;
    margin-left: 16px;
    min-width: 0;
}

.portal-app-bar-tab {
    position: relative;
    align-self: stretch;
    display: inline-flex;
    align-items: center;
    padding: 0 14px;
    font-size: 0.875rem;
    font-weight: 500;
    line-height: 1.2;
    color: rgba(255, 255, 255, 0.7);
    text-decoration: none;
    text-transform: none;
    white-space: nowrap;
    border: none;
    border-radius: 0;
    background: transparent;
}

.portal-app-bar-tab:hover {
    color: #fff;
    background: rgba(255, 255, 255, 0.06);
}

.portal-app-bar-tab--active,
.portal-app-bar-tab[aria-current="page"] {
    font-weight: 600;
    color: #fff;
    background: rgba(255, 255, 255, 0.06);
}

.portal-app-bar-tab--active::after,
.portal-app-bar-tab[aria-current="page"]::after {
    content: "";
    position: absolute;
    left: 10px;
    right: 10px;
    bottom: 0;
    height: 3px;
    background: #e5c464;
    border-radius: 2px 2px 0 0;
}

.portal-app-bar-tab-badge {
    align-self: stretch;
    display: inline-flex;
}

.portal-app-bar-dropdown {
    position: relative;
    align-self: stretch;
    display: inline-flex;
}

.portal-app-bar-dropdown > .portal-app-bar-tab {
    cursor: pointer;
    gap: 4px;
}

.portal-app-bar-dropdown-caret {
    font-size: 0.7rem;
    opacity: 0.75;
}

.portal-app-bar-dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1300;
    min-width: 13.5rem;
    padding: 0.35rem 0;
    background: var(--mud-palette-appbar-background, #1b2430);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 0 0 6px 6px;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.28);
}

.portal-app-bar-dropdown-menu[hidden] {
    display: none !important;
}

.portal-app-bar-dropdown-item {
    display: block;
    padding: 0.55rem 0.9rem;
    color: rgba(255, 255, 255, 0.82);
    text-decoration: none;
    font-size: 0.875rem;
    white-space: nowrap;
}

.portal-app-bar-dropdown-item:hover,
.portal-app-bar-dropdown-item--active {
    color: #fff;
    background: rgba(255, 255, 255, 0.08);
}

.portal-app-bar-utilities {
    display: flex;
    align-items: center;
    gap: 0;
    flex-shrink: 0;
    margin-left: auto;
}

.portal-app-bar-utility-icon {
    color: rgba(255, 255, 255, 0.72) !important;
}

.portal-app-bar-utility-icon:hover {
    color: #fff !important;
    background: rgba(255, 255, 255, 0.08) !important;
}

/* Firm switcher: keep it visually consistent with the utility icons and set it apart from them. */
.client-account-switcher {
    margin-left: 12px;
}

.client-account-switcher-button {
    color: rgba(255, 255, 255, 0.72) !important;
    text-transform: none;
}

.client-account-switcher-button:hover {
    color: #fff !important;
    background: rgba(255, 255, 255, 0.08) !important;
}

.portal-app-bar-mobile-menu {
    display: none;
}

@media (max-width: 768px) {
    .portal-app-bar {
        padding-inline: 12px;
    }

    .portal-app-bar-wordmark {
        display: none;
    }

    .portal-app-bar-nav--desktop {
        display: none;
    }

    .portal-app-bar-utility-icon {
        display: none !important;
    }

    .portal-app-bar-mobile-menu {
        display: inline-flex;
    }
}

@media (min-width: 769px) and (max-width: 960px) {
    .portal-app-bar-tab {
        padding-inline: 10px;
        font-size: 0.8125rem;
    }

    .portal-app-bar-nav--desktop {
        margin-left: 12px;
    }
}

/* --- Admin layout & pages --- */
.admin-layout-main {
    padding: 1.5rem 1.75rem 2rem;
    background: var(--mud-palette-background, #f8f9fa);
    min-height: calc(100vh - var(--mud-appbar-height, 64px));
}

.admin-layout-drawer {
    border-right: 1px solid var(--mud-palette-lines-default, #e0e3e7);
    background: var(--mud-palette-surface, #fff) !important;
}

.admin-layout-drawer-header {
    /* Keep wrapped title above the border (Mud drawer content is a flex column). */
    flex: 0 0 auto;
    height: auto !important;
    min-height: var(--mud-appbar-height, 64px);
    padding: 1.25rem 1rem 1rem;
    border-bottom: 1px solid var(--mud-palette-lines-default, #e0e3e7);
    align-items: flex-start;
}

.admin-layout-drawer-title {
    font-weight: 600;
    letter-spacing: -0.01em;
    line-height: 1.3;
    white-space: normal;
}

.admin-layout-nav {
    padding: 0.75rem 0.5rem 1rem;
}

.admin-layout-nav .mud-nav-link {
    border-radius: 8px;
    margin: 0.1rem 0;
    font-weight: 500;
    align-items: center;
}

.admin-layout-nav .mud-nav-link.active {
    background: color-mix(in srgb, var(--mud-palette-primary, #212940) 10%, transparent);
}

.admin-page {
    --dashboard-accent: var(--mud-palette-primary, #212940);
    --dashboard-surface: var(--mud-palette-surface, #fff);
    --dashboard-muted: var(--mud-palette-text-secondary, #525b65);
    --dashboard-border: var(--mud-palette-lines-default, #e0e3e7);
    --dashboard-tint: color-mix(in srgb, var(--dashboard-accent) 6%, transparent);
}

.admin-page-card {
    background: var(--dashboard-surface);
    border: 1px solid var(--dashboard-border);
    border-radius: 12px;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.05);
}

.admin-page-header {
    margin-bottom: 1.25rem;
}

.admin-filters-panel {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem 1.25rem;
    margin-bottom: 1.25rem;
    border-radius: 10px;
    border: 1px solid var(--dashboard-border);
    background: color-mix(in srgb, var(--dashboard-accent) 3%, var(--dashboard-surface));
}

.admin-filters-panel .admin-filters-grid {
    width: 100%;
    max-width: 72rem;
    margin-inline: auto;
    align-items: flex-end;
}

.admin-filters-panel .admin-filters-grid-item {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}

.admin-filters-panel .admin-filters-firma-label {
    margin-bottom: 0.25rem;
    padding-left: 2px;
    font-size: 0.75rem;
    font-weight: 400;
    line-height: 1.43;
    letter-spacing: 0.00938em;
    color: var(--mud-palette-text-secondary, var(--dashboard-muted));
}

.admin-filters-panel .admin-filters-grid-item--select {
    padding-top: 1.125rem;
}

.admin-form-card {
    padding: 1.25rem 1.5rem;
    margin-bottom: 1.25rem;
    border-radius: 10px;
    border: 1px solid var(--dashboard-border);
    background: var(--dashboard-surface);
}

.admin-info-panel {
    border-radius: 10px;
}

.admin-muted-text {
    color: var(--dashboard-muted);
}

.admin-footnote {
    margin-top: 0.75rem;
    font-size: 0.8125rem;
    color: var(--dashboard-muted);
}

.admin-data-table.mud-table-root,
.admin-page-card .mud-table-root {
    border: 1px solid var(--dashboard-border);
    border-radius: 10px;
    overflow: hidden;
}

.admin-data-table .mud-table-head .mud-table-cell,
.admin-page-card .mud-table-root .mud-table-head .mud-table-cell {
    background: color-mix(in srgb, var(--dashboard-accent) 5%, var(--dashboard-surface));
    font-weight: 600;
    font-size: 0.8125rem;
    letter-spacing: 0.01em;
    color: var(--dashboard-muted);
    border-bottom: 1px solid var(--dashboard-border);
}

.admin-data-table .mud-table-toolbar,
.admin-page-card .mud-table-root .mud-table-toolbar {
    padding: 0 0 1rem;
    background: transparent;
}

.admin-data-table .mud-table-toolbar .mud-typography-h6,
.admin-page-card .mud-table-root .mud-table-toolbar .mud-typography-h6 {
    font-weight: 600;
    letter-spacing: -0.015em;
}

.admin-section-title {
    margin: 0 0 0.75rem;
    font-weight: 600;
}

.admin-sticky-action-bar {
    position: sticky;
    bottom: 0;
    z-index: 100;
    margin-top: 1rem;
    background-color: var(--mud-palette-surface);
    border: 1px solid var(--mud-palette-lines-default);
    border-radius: 10px;
    box-shadow: 0 -2px 12px rgba(15, 23, 42, 0.06);
}

.admin-sticky-action-bar__selection {
    font-weight: 500;
}

/* --- Dashboard pages (office / client) --- */
.dashboard-page {
    --dashboard-accent: var(--mud-palette-primary, #212940);
    --dashboard-surface: var(--mud-palette-surface, #fff);
    --dashboard-muted: var(--mud-palette-text-secondary, #525b65);
    --dashboard-border: var(--mud-palette-lines-default, #e0e3e7);
    --dashboard-tint: color-mix(in srgb, var(--dashboard-accent) 6%, transparent);
}

.dashboard-sidebar,
.dashboard-main {
    background: var(--dashboard-surface);
    border: 1px solid var(--dashboard-border);
    border-radius: 12px;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.05);
}

@media (min-width: 960px) {
    .dashboard-sidebar {
        position: sticky;
        top: 1.25rem;
        align-self: flex-start;
        max-height: calc(100vh - 6rem);
        overflow-y: auto;
    }
}

.dashboard-sidebar-title {
    margin: 0;
    font-weight: 600;
    letter-spacing: -0.01em;
}

.dashboard-section-eyebrow {
    display: block;
    margin: 0 0 0.5rem;
    font-size: 0.6875rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--dashboard-muted) !important;
}

.dashboard-section-divider {
    margin: 1.25rem 0 !important;
    opacity: 0.7;
}

.dashboard-stat-card {
    display: flex;
    align-items: center;
    gap: 0.875rem;
    padding: 0.875rem 1rem;
    border-radius: 10px;
    border: 1px solid var(--dashboard-border);
    background: linear-gradient(
        135deg,
        color-mix(in srgb, var(--dashboard-accent) 10%, transparent),
        var(--dashboard-tint)
    );
}

.dashboard-stat-card .mud-icon-root {
    color: var(--dashboard-accent);
    opacity: 0.85;
}

.dashboard-stat-value {
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1.1;
    color: var(--mud-palette-text-primary);
}

.dashboard-stat-label {
    margin-top: 0.15rem;
    font-size: 0.8125rem;
    color: var(--dashboard-muted);
}

.dashboard-nav-btn.mud-button-root {
    justify-content: flex-start;
    text-transform: none;
    font-weight: 500;
    border-radius: 8px;
    padding-left: 0.75rem;
    padding-right: 0.75rem;
}

.dashboard-nav-btn.mud-button-root:hover {
    background: var(--dashboard-tint);
}

.dashboard-client-picker .mud-button-root {
    border-radius: 10px;
    border-color: color-mix(in srgb, var(--dashboard-accent) 25%, var(--dashboard-border));
    background: color-mix(in srgb, var(--dashboard-accent) 4%, var(--dashboard-surface));
}

.dashboard-main-title {
    margin: 0;
    font-weight: 600;
    letter-spacing: -0.015em;
}

.dashboard-main-subtitle {
    margin: 0.2rem 0 0;
    color: var(--dashboard-muted);
}

.dashboard-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem 1.5rem;
}

.dashboard-toolbar-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem 0.75rem;
}

.dashboard-toolbar-group {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
}

.dashboard-toolbar-group--primary {
    padding-left: 0.75rem;
    border-left: 1px solid var(--dashboard-border);
}

@media (max-width: 960px) {
    .dashboard-toolbar-group--primary {
        padding-left: 0;
        border-left: none;
        width: 100%;
    }
}

.dashboard-filters-bar {
    padding: 0.75rem 1rem;
    margin-bottom: 1rem;
    border-radius: 10px;
    border: 1px solid var(--dashboard-border);
    background: color-mix(in srgb, var(--dashboard-accent) 3%, var(--dashboard-surface));
}

.dashboard-invoice-table.mud-table-root {
    border: 1px solid var(--dashboard-border);
    border-radius: 10px;
    overflow: hidden;
}

.dashboard-invoice-table {
    --easyksef-table-line-clamp: 2;
    --easyksef-table-cell-font-size: 0.875rem;
    --easyksef-table-head-font-size: 0.8125rem;
    --easyksef-table-cell-padding-y: 0.5rem;
    --easyksef-table-cell-padding-x: 1rem;
}

.dashboard-invoice-table .mud-table-body .mud-table-cell {
    font-size: var(--easyksef-table-cell-font-size, 0.875rem);
    padding-top: var(--easyksef-table-cell-padding-y, 0.5rem);
    padding-bottom: var(--easyksef-table-cell-padding-y, 0.5rem);
    padding-left: var(--easyksef-table-cell-padding-x, 1rem);
    padding-right: var(--easyksef-table-cell-padding-x, 1rem);
}

.dashboard-invoice-table .mud-table-head .mud-table-cell {
    background: color-mix(in srgb, var(--dashboard-accent) 5%, var(--dashboard-surface));
    font-weight: 600;
    font-size: var(--easyksef-table-head-font-size, 0.8125rem);
    letter-spacing: 0.01em;
    color: var(--dashboard-muted);
    border-bottom: 1px solid var(--dashboard-border);
}

.dashboard-invoice-table.dashboard-invoice-table--compact {
    --easyksef-table-line-clamp: 1;
    --easyksef-table-cell-padding-y: 1px;
    --easyksef-table-cell-padding-x: 2px;
}

.dashboard-invoice-table.dashboard-invoice-table--compact .mud-table-head .mud-table-cell {
    padding-top: 1px;
    padding-bottom: 1px;
    padding-left: 4px;
    padding-right: 4px;
}

/* Row height is set by tallest control in the cell (menu ~48px, checkbox ~32px), not padding alone. */
.dashboard-invoice-table.dashboard-invoice-table--compact .mud-table-body .mud-table-cell {
    line-height: 1.25;
}

.dashboard-invoice-table.dashboard-invoice-table--compact .mud-table-cell .mud-checkbox > .mud-icon-button,
.dashboard-invoice-table.dashboard-invoice-table--compact .mud-table-cell .mud-menu > .mud-icon-button {
    width: 24px;
    height: 24px;
    min-width: 24px;
    min-height: 24px;
    padding: 0;
}

.dashboard-invoice-table.dashboard-invoice-table--compact .mud-table-cell .mud-checkbox > .mud-icon-button .mud-icon-root,
.dashboard-invoice-table.dashboard-invoice-table--compact .mud-table-cell .mud-menu > .mud-icon-button .mud-icon-root {
    font-size: 1.125rem;
}

.dashboard-invoice-table .mud-table-body .mud-table-row:not(.easyksef-formatted-row):hover {
    background: var(--mud-palette-table-hover, rgba(33, 41, 64, 0.04));
}

/* Conditional row formatting — MudBlazor paints text on cells, not the row. */
.mud-table-row.easyksef-formatted-row {
    background-color: var(--easyksef-cf-bg) !important;
    color: var(--easyksef-cf-fg) !important;
}

.mud-table-row.easyksef-formatted-row .mud-table-cell {
    background-color: var(--easyksef-cf-bg) !important;
    color: var(--easyksef-cf-fg) !important;
}

.mud-table-row.easyksef-formatted-row .easyksef-table-cell-clamp-text,
.mud-table-row.easyksef-formatted-row .easyksef-table-cell-type {
    color: inherit;
}

.mud-table-row.easyksef-formatted-row .easyksef-table-cell-clamp-empty {
    color: color-mix(in srgb, var(--easyksef-cf-fg) 55%, transparent);
}

.mud-table-row.easyksef-formatted-row--bold .mud-table-cell,
.mud-table-row.easyksef-formatted-row--bold .easyksef-table-cell-clamp-text,
.mud-table-row.easyksef-formatted-row--bold .easyksef-table-cell-type {
    font-weight: var(--easyksef-cf-weight, bold);
}

.mud-table-row.easyksef-formatted-row:hover,
.mud-table-row.easyksef-formatted-row:hover .mud-table-cell {
    background-color: var(--easyksef-cf-bg) !important;
    filter: brightness(0.97);
}

/* Last-entered cue — soft accent for side-by-side GT work; CF fill wins when both apply. */
.mud-table-row.easyksef-last-entered-row {
    box-shadow: inset 3px 0 0 0 var(--easyksef-last-entered-accent, #7aa2c4);
}

.mud-table-row.easyksef-last-entered-row:not(.easyksef-formatted-row),
.mud-table-row.easyksef-last-entered-row:not(.easyksef-formatted-row) .mud-table-cell {
    background-color: var(--easyksef-last-entered-bg, rgba(122, 162, 196, 0.14)) !important;
}

.mud-table-row.easyksef-last-entered-row:not(.easyksef-formatted-row):hover,
.mud-table-row.easyksef-last-entered-row:not(.easyksef-formatted-row):hover .mud-table-cell {
    background-color: var(--easyksef-last-entered-bg-hover, rgba(122, 162, 196, 0.20)) !important;
}

.conditional-format-preview-bar {
    min-height: 2.5rem;
    border: 1px solid var(--dashboard-border, #d7d7d7);
    border-radius: 6px;
    display: flex;
    align-items: center;
    padding: 0.5rem 0.75rem;
}

.dashboard-sync-banner {
    border-radius: 10px;
    border: 1px solid var(--dashboard-border);
    background: color-mix(in srgb, var(--dashboard-accent) 4%, var(--dashboard-surface));
}

/* Dashboard sidebar — center date range values as a compact group */
.dashboard-date-range-picker .mud-input-slot {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.35rem;
}

.dashboard-date-range-picker .mud-input-slot input {
    flex: 0 0 auto;
    width: auto !important;
    min-width: 6.25rem;
    text-align: center;
}

.dashboard-date-range-picker .mud-input-slot .mud-icon-root {
    flex: 0 0 auto;
}

.dashboard-global-search {
    min-width: 280px;
    max-width: 420px;
}

.dashboard-global-search__field {
    width: 100%;
}

.dashboard-global-search__toggles {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem 1rem;
    margin-top: 0.25rem;
}

/* Full-viewport busy overlay — global (not scoped) so fixed positioning covers the app chrome. */
.viewport-busy-overlay {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    background: rgba(0, 0, 0, 0.6);
    pointer-events: all;
}

/* Aktualności markdown body (reader + admin preview) */
.aktualnosci-body :is(p, ul, ol, h1, h2, h3, blockquote, pre) {
    margin: 0 0 0.75rem;
}

.aktualnosci-body :is(h1, h2, h3) {
    font-weight: 600;
    line-height: 1.35;
}

.aktualnosci-body li + li {
    margin-top: 0.25rem;
}
/* Dokument fizyczny detail: side-by-side metadane + skan, fit to viewport on desktop. */
.df-detail-shell {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    height: calc(100dvh - 6.5rem);
    max-height: calc(100dvh - 6.5rem);
    min-height: 0;
}

.df-detail-chrome {
    flex: 0 0 auto;
}

.df-detail-body {
    flex: 1 1 auto;
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
    gap: 1.5rem;
    align-items: stretch;
}

.df-detail-side,
.df-detail-scan-col {
    min-height: 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    height: 100%;
}

.df-panel {
    display: flex !important;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
}

.df-panel-fill {
    flex: 1 1 auto;
}

.df-panel-meta {
    flex: 0 0 auto;
    max-height: 40%;
}

.df-panel-ocr {
    flex: 1 1 auto;
}

.df-panel-header {
    flex: 0 0 auto;
}

.df-scan-preview-host {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
}

.df-panel-scroll {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
}

.df-scan-preview {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: stretch;
    overflow: hidden;
    background: var(--mud-palette-background-gray);
    border-radius: 4px;
}

.df-scan-preview img {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
    margin: auto;
}

.df-scan-preview iframe {
    display: block;
    flex: 1 1 auto;
    width: 100%;
    height: 100%;
    min-height: 0;
    border: 1px solid var(--mud-palette-lines-default);
    border-radius: 4px;
    background: #fff;
}

@media (max-width: 959.95px) {
    .df-detail-shell {
        height: auto;
        max-height: none;
        gap: 0.5rem;
    }

    .df-detail-body {
        display: flex;
        flex-direction: column;
        height: auto;
        gap: 0.75rem;
    }

    .df-detail-side,
    .df-detail-scan-col {
        height: auto;
        gap: 0.75rem;
    }

    /* Scan first on phone — document is the primary content. */
    .df-detail-scan-col {
        order: -1;
    }

    .df-panel {
        overflow: visible;
    }

    .df-panel.pa-4 {
        padding: 0.75rem !important;
    }

    .df-panel-fill,
    .df-panel-meta,
    .df-panel-ocr {
        flex: 0 0 auto;
        max-height: none;
    }

    .df-panel-scroll {
        overflow: visible;
    }

    .df-scan-preview {
        /* Explicit height so the iframe can fill (%, flex alone is unreliable). */
        height: min(62dvh, 28rem);
        min-height: 14rem;
        max-height: 70dvh;
        flex: 0 0 auto;
    }

    .df-scan-preview iframe {
        height: 100%;
        min-height: 14rem;
    }
}

@media (max-width: 599.95px) {
    .df-scan-preview {
        height: min(55dvh, 22rem);
        min-height: 12rem;
    }
}

/* Lista kontrolna DF preview: same Metadane + Skan layout as DF detail, A4-tall scan. */
.df-preview-dialog {
    width: min(96vw, 86rem) !important;
    max-width: 96vw !important;
    height: min(94dvh, 64rem);
    max-height: 94dvh;
    display: flex;
    flex-direction: column;
}

.df-preview-dialog .mud-dialog-content {
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.df-preview-dialog-container {
    flex: 1 1 auto;
    min-height: 0;
    height: 100%;
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

.df-preview-dialog-chrome {
    flex: 0 0 auto;
}

.df-preview-dialog-body {
    flex: 1 1 auto;
    min-height: 0;
    height: 100%;
}

.df-preview-a4 {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.df-preview-a4 .df-scan-preview {
    /* ISO A4 portrait (210mm × 297mm). */
    aspect-ratio: 210 / 297;
    width: auto;
    height: 100%;
    max-width: 100%;
    max-height: 100%;
    min-height: 28rem;
    flex: 1 1 auto;
    align-self: center;
}

@media (max-width: 959.95px) {
    .df-preview-dialog {
        height: auto;
        max-height: 96dvh;
    }

    .df-preview-dialog .mud-dialog-content {
        overflow-y: auto;
        max-height: 88dvh;
    }

    .df-preview-a4 .df-scan-preview {
        height: min(70dvh, 36rem);
        min-height: 18rem;
        width: auto;
        max-width: 100%;
        flex: 0 0 auto;
    }
}

/* Hub bulk date: full width inside „Więcej działań”; never Style width on MudDatePicker
   root (Dialog inherits inline Style; MudBlazor #9314). */
.df-hub-bulk-date {
    width: 100%;
    max-width: 100%;
    align-self: stretch;
    box-sizing: border-box;
}

.df-hub-bulk-date .mud-input-control,
.df-hub-bulk-date .mud-picker,
.df-hub-bulk-date .mud-input,
.df-hub-bulk-date .mud-input > .mud-input-outlined {
    width: 100% !important;
    max-width: 100%;
    margin-top: 0;
    box-sizing: border-box;
}

.df-hub-more-actions .mud-input-control,
.df-hub-more-actions .mud-select,
.df-hub-more-actions .mud-picker,
.df-hub-more-actions .mud-button-root {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

.df-hub-sticky-bulk {
    position: sticky;
    bottom: 0;
    z-index: 100;
    margin-top: 1rem;
    background-color: var(--mud-palette-surface);
    border: 1px solid var(--mud-palette-lines-default);
    border-radius: 10px;
    box-shadow: 0 -2px 12px rgba(15, 23, 42, 0.06);
}

.df-hub-more-actions-host {
    position: relative;
    display: inline-flex;
}

.df-hub-more-actions {
    min-width: min(28rem, 92vw);
    max-width: 36rem;
}

.df-hub-more-actions .mud-stack {
    align-items: stretch;
}

/* Dokumenty fizyczne hub — card rows ONLY on real phone viewports (CSS media),
   not MudBlazor JS breakpoints (those can misfire and break desktop). */
@media (max-width: 599.95px) {
    .df-hub-table .mud-table-root,
    .df-hub-table .mud-table-root > .mud-table-container,
    .df-hub-table table,
    .df-hub-table .mud-table-head,
    .df-hub-table .mud-table-body {
        display: block;
        width: 100%;
    }

    .df-hub-table .mud-table-head {
        display: none;
    }

    .df-hub-table .mud-table-body {
        border-top: none;
        padding: 0.35rem 0 0.5rem;
        background: transparent;
    }

    .df-hub-table .mud-table-row {
        display: block;
        width: 100%;
        box-sizing: border-box;
        margin: 0 0 0.75rem;
        padding: 0.55rem 0.85rem 0.7rem;
        border: 1px solid var(--mud-palette-lines-default);
        border-radius: 10px;
        background-color: var(--mud-palette-surface);
        box-shadow: 0 1px 0 color-mix(in srgb, var(--mud-palette-black) 10%, transparent);
    }

    .df-hub-table .mud-table-row:last-child {
        margin-bottom: 0;
    }

    .df-hub-table .mud-table-cell {
        display: flex !important;
        justify-content: space-between;
        align-items: flex-start;
        gap: 0.75rem;
        width: 100%;
        border-bottom: none !important;
        padding: 0.28rem 0 !important;
        text-align: start !important;
    }

    .df-hub-table .mud-table-cell[data-label]:not([data-label=" "]):before {
        content: attr(data-label);
        flex: 0 0 auto;
        font-weight: 500;
        opacity: 0.85;
        padding-right: 0.5rem;
    }

    .df-hub-table .mud-table-cell.df-hub-table-select {
        justify-content: flex-end;
        padding-top: 0 !important;
        padding-bottom: 0.1rem !important;
    }

    .df-hub-table .mud-table-cell.df-hub-table-select:before {
        content: none !important;
        display: none;
    }

    .df-hub-table .mud-table-cell.df-hub-table-sygnatura {
        font-weight: 600;
        font-size: 1rem;
        padding-top: 0 !important;
    }

    .df-hub-table .mud-table-cell.df-hub-table-sygnatura:before {
        font-weight: 500;
        font-size: 0.75rem;
    }

    .df-hub-table .mud-table-cell.df-hub-table-plik {
        word-break: break-word;
        overflow-wrap: anywhere;
    }

    .df-hub-table .mud-table-cell.df-hub-table-plik .mud-link {
        display: inline-block;
        max-width: 100%;
        text-align: end;
    }
}

.df-hub-opis-link,
.invoice-table-opis-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: inherit;
    text-decoration: none;
    background: none;
    border: 0;
    padding: 0;
    margin: 0;
    cursor: pointer;
}
.df-hub-opis-link:focus-visible,
.invoice-table-opis-link:focus-visible {
    outline: 2px solid var(--mud-palette-primary);
    outline-offset: 2px;
}

/* Turnstile: keep vertical rhythm with form fields (no extra CF wrapper margins). */
.turnstile-host {
    margin-top: 0 !important;
}
.turnstile-host > div {
    line-height: 0;
    margin: 0 !important;
}
.turnstile-host iframe {
    display: block;
    margin: 0 !important;
}