/* _content/InuniSphere.Web/Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-kotdxjpt4q] {
    position: relative;
    display: flex;
    flex-direction: column;
}

main[b-kotdxjpt4q] {
    flex: 1;
}

.sidebar[b-kotdxjpt4q] {
    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
}

.top-row[b-kotdxjpt4q] {
    background-color: #f7f7f7;
    border-bottom: 1px solid #d6d5d5;
    justify-content: flex-end;
    height: 3.5rem;
    display: flex;
    align-items: center;
}

    .top-row[b-kotdxjpt4q]  a, .top-row[b-kotdxjpt4q]  .btn-link {
        white-space: nowrap;
        margin-left: 1.5rem;
        text-decoration: none;
    }

    .top-row[b-kotdxjpt4q]  a:hover, .top-row[b-kotdxjpt4q]  .btn-link:hover {
        text-decoration: underline;
    }

    .top-row[b-kotdxjpt4q]  a:first-child {
        overflow: hidden;
        text-overflow: ellipsis;
    }

@media (max-width: 640.98px) {
    .top-row[b-kotdxjpt4q] {
        justify-content: space-between;
    }

    .top-row[b-kotdxjpt4q]  a, .top-row[b-kotdxjpt4q]  .btn-link {
        margin-left: 0;
    }
}

@media (min-width: 641px) {
    .page[b-kotdxjpt4q] {
        flex-direction: row;
    }

    .sidebar[b-kotdxjpt4q] {
        width: 250px;
        height: 100vh;
        position: sticky;
        top: 0;
    }

    .top-row[b-kotdxjpt4q] {
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .top-row.auth[b-kotdxjpt4q]  a:first-child {
        flex: 1;
        text-align: right;
        width: 0;
    }

    .top-row[b-kotdxjpt4q], article[b-kotdxjpt4q] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}
/* _content/InuniSphere.Web/Components/Layout/NavMenu.razor.rz.scp.css */
.navbar-toggler[b-nfcfh1nuz0] {
    appearance: none;
    cursor: pointer;
    width: 3.5rem;
    height: 2.5rem;
    color: white;
    position: absolute;
    top: 0.5rem;
    right: 1rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") no-repeat center/1.75rem rgba(255, 255, 255, 0.1);
}

.navbar-toggler:checked[b-nfcfh1nuz0] {
    background-color: rgba(255, 255, 255, 0.5);
}

.top-row[b-nfcfh1nuz0] {
    min-height: 3.5rem;
    background-color: rgba(0,0,0,0.4);
}

.navbar-brand[b-nfcfh1nuz0] {
    font-size: 1.1rem;
}

.bi[b-nfcfh1nuz0] {
    display: inline-block;
    position: relative;
    width: 1.25rem;
    height: 1.25rem;
    margin-right: 0.75rem;
    top: -1px;
    background-size: cover;
}

.bi-house-door-fill-nav-menu[b-nfcfh1nuz0] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-house-door-fill' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5Z'/%3E%3C/svg%3E");
}

.bi-plus-square-fill-nav-menu[b-nfcfh1nuz0] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-plus-square-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2zm6.5 4.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3a.5.5 0 0 1 1 0z'/%3E%3C/svg%3E");
}

.bi-list-nested-nav-menu[b-nfcfh1nuz0] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4.5 11.5A.5.5 0 0 1 5 11h10a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 3 7h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 1 3h10a.5.5 0 0 1 0 1H1a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E");
}

.nav-item[b-nfcfh1nuz0] {
    font-size: 0.9rem;
    padding-bottom: 0.5rem;
}

    .nav-item:first-of-type[b-nfcfh1nuz0] {
        padding-top: 1rem;
    }

    .nav-item:last-of-type[b-nfcfh1nuz0] {
        padding-bottom: 1rem;
    }

    .nav-item[b-nfcfh1nuz0]  .nav-link {
        color: #d7d7d7;
        background: none;
        border: none;
        border-radius: 4px;
        height: 3rem;
        display: flex;
        align-items: center;
        line-height: 3rem;
        width: 100%;
    }

.nav-item[b-nfcfh1nuz0]  a.active {
    background-color: rgba(255,255,255,0.37);
    color: white;
}

.nav-item[b-nfcfh1nuz0]  .nav-link:hover {
    background-color: rgba(255,255,255,0.1);
    color: white;
}

.nav-scrollable[b-nfcfh1nuz0] {
    display: none;
}

.navbar-toggler:checked ~ .nav-scrollable[b-nfcfh1nuz0] {
    display: block;
}

@media (min-width: 641px) {
    .navbar-toggler[b-nfcfh1nuz0] {
        display: none;
    }

    .nav-scrollable[b-nfcfh1nuz0] {
        /* Never collapse the sidebar for wide screens */
        display: block;

        /* Allow sidebar to scroll for tall menus */
        height: calc(100vh - 3.5rem);
        overflow-y: auto;
    }
}
/* _content/InuniSphere.Web/Components/Pages/Account/Account.razor.rz.scp.css */
/* Same design tokens/classes as Iam.razor.css and Admin.razor.css — Blazor CSS isolation
   scopes each page's stylesheet to its own markup, so the shared "iam-*" design system gets
   its selectors duplicated per page rather than shared via one global file. Keep in sync with
   Iam.razor.css if either changes. */
.iam-page[b-ulisy46m3b] {
    --iam-space-1: 0.5rem;
    --iam-space-2: 0.75rem;
    --iam-space-3: 1rem;
    --iam-space-4: 1.5rem;
    --iam-space-5: 2rem;
    --iam-radius: 0.75rem;
    --iam-radius-sm: 0.5rem;
    --iam-shadow: 0 1px 2px rgba(16, 24, 40, 0.06), 0 1px 3px rgba(16, 24, 40, 0.08);
    max-width: 72rem;
    margin: 0 auto;
    padding: 0 var(--iam-space-4) var(--iam-space-5);
}

.iam-breadcrumbs[b-ulisy46m3b] {
    max-width: 72rem;
    margin: 0 auto;
    padding: 0.9rem 1.5rem 0;
    font-size: 0.85rem;
    color: var(--brand-text-muted, #5d7a7a);
}

.iam-breadcrumbs a[b-ulisy46m3b],
.iam-breadcrumbs__link[b-ulisy46m3b] {
    color: inherit;
    text-decoration: none;
}

.iam-breadcrumbs a:hover[b-ulisy46m3b],
.iam-breadcrumbs__link:hover[b-ulisy46m3b] {
    text-decoration: underline;
}

.iam-breadcrumbs__link[b-ulisy46m3b] {
    appearance: none;
    background: none;
    border: none;
    padding: 0;
    font: inherit;
    cursor: pointer;
}

.iam-breadcrumbs__sep[b-ulisy46m3b] {
    margin: 0 0.4rem;
}

.iam-breadcrumbs [aria-current="page"][b-ulisy46m3b] {
    color: var(--brand-text-main, #232323);
    font-weight: 600;
}

.iam-header[b-ulisy46m3b] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--iam-space-3);
    padding-top: var(--iam-space-4);
    margin-bottom: var(--iam-space-4);
}

.iam-header h1[b-ulisy46m3b] {
    margin: 0 0 0.35rem;
    font-size: 1.75rem;
}

.iam-header__subtitle[b-ulisy46m3b] {
    margin: 0;
    color: var(--brand-text-muted, #5d7a7a);
}

.iam-tabs[b-ulisy46m3b] {
    display: flex;
    gap: var(--iam-space-1);
    border-bottom: 1px solid var(--brand-border, #d8e8e8);
    margin-bottom: var(--iam-space-4);
}

.iam-tabs__item[b-ulisy46m3b] {
    appearance: none;
    background: none;
    border: none;
    border-bottom: 2px solid transparent;
    padding: 0.75rem 0.25rem;
    margin-right: var(--iam-space-4);
    font-weight: 600;
    color: var(--brand-text-muted, #5d7a7a);
    cursor: pointer;
}

.iam-tabs__item:hover[b-ulisy46m3b] {
    color: var(--brand-text-main, #232323);
}

.iam-tabs__item.is-active[b-ulisy46m3b] {
    color: var(--brand-primary, #185354);
    border-bottom-color: var(--brand-primary, #185354);
}

.iam-card[b-ulisy46m3b] {
    background: #fff;
    border: 1px solid var(--brand-border, #d8e8e8);
    border-radius: var(--iam-radius);
    box-shadow: var(--iam-shadow);
    padding: var(--iam-space-4);
    margin-bottom: var(--iam-space-4);
}

.iam-card h2[b-ulisy46m3b] {
    font-size: 1.15rem;
    margin: 0 0 0.25rem;
}

.iam-card__header[b-ulisy46m3b] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--iam-space-3);
    margin-bottom: var(--iam-space-4);
}

.iam-detail-list[b-ulisy46m3b] {
    display: grid;
    grid-template-columns: max-content 1fr;
    column-gap: var(--iam-space-3);
    row-gap: 0.35rem;
    margin-bottom: var(--iam-space-3);
}

.iam-detail-list dt[b-ulisy46m3b] {
    color: var(--brand-muted, #5f7a7a);
    font-weight: 600;
}

.iam-detail-list dd[b-ulisy46m3b] {
    margin: 0;
}

.iam-banner[b-ulisy46m3b] {
    border-radius: var(--iam-radius-sm);
    padding: var(--iam-space-3) var(--iam-space-4);
    margin-bottom: var(--iam-space-4);
}

.iam-banner strong[b-ulisy46m3b] {
    display: block;
    margin-bottom: 0.25rem;
}

.iam-banner p[b-ulisy46m3b] {
    margin: 0;
}

.iam-banner--info[b-ulisy46m3b] {
    background: #eef6f6;
    border: 1px solid var(--brand-border, #d8e8e8);
    color: #123f40;
}

.iam-banner--error[b-ulisy46m3b] {
    background: #fff2f2;
    border: 1px solid #f3c9c9;
    color: #6d1e1e;
    max-width: 72rem;
    margin: var(--iam-space-4) auto;
}

@media (max-width: 640px) {
    .iam-header[b-ulisy46m3b] {
        flex-direction: column;
    }

    .iam-card__header[b-ulisy46m3b] {
        flex-direction: column;
        align-items: stretch;
    }
}
/* _content/InuniSphere.Web/Components/Pages/Account/ProfileWizard.razor.rz.scp.css */
/* Same visual language as /admin (see Admin.razor.css's own design-tokens comment) - kept as
   a separate copy rather than a shared stylesheet because Blazor CSS isolation scopes rules
   to the component that declares them; a class used in ProfileWizard.razor picks up nothing
   from Admin.razor.css. */
.iam-page[b-lq168conxt] {
    --iam-space-3: 1rem;
    --iam-space-4: 1.5rem;
    --iam-space-5: 2rem;
    --iam-radius: 0.75rem;
    --iam-shadow: 0 1px 2px rgba(16, 24, 40, 0.06), 0 1px 3px rgba(16, 24, 40, 0.08);
    max-width: 72rem;
    margin: 0 auto;
    padding: 0 var(--iam-space-4) var(--iam-space-5);
}

.iam-breadcrumbs[b-lq168conxt] {
    max-width: 72rem;
    margin: 0 auto;
    padding: 0.9rem 1.5rem 0;
    font-size: 0.85rem;
    color: var(--brand-text-muted, #5d7a7a);
}

.iam-breadcrumbs a[b-lq168conxt] {
    color: inherit;
    text-decoration: none;
}

.iam-breadcrumbs a:hover[b-lq168conxt] {
    text-decoration: underline;
}

.iam-breadcrumbs__sep[b-lq168conxt] {
    margin: 0 0.4rem;
}

.iam-breadcrumbs [aria-current="page"][b-lq168conxt] {
    color: var(--brand-text-main, #232323);
    font-weight: 600;
}

.iam-header[b-lq168conxt] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--iam-space-3);
    padding-top: var(--iam-space-4);
    margin-bottom: var(--iam-space-4);
}

.iam-header h1[b-lq168conxt] {
    margin: 0 0 0.35rem;
    font-size: 1.75rem;
}

.iam-header__subtitle[b-lq168conxt] {
    margin: 0;
    color: var(--brand-text-muted, #5d7a7a);
}

.iam-card[b-lq168conxt] {
    background: #fff;
    border: 1px solid var(--brand-border, #d8e8e8);
    border-radius: var(--iam-radius);
    box-shadow: var(--iam-shadow);
    padding: var(--iam-space-4);
    margin-bottom: var(--iam-space-4);
}

.iam-card h2[b-lq168conxt] {
    font-size: 1.15rem;
    margin: 0 0 0.25rem;
}

.iam-card__header[b-lq168conxt] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--iam-space-3);
    margin-bottom: var(--iam-space-4);
}

.iam-banner[b-lq168conxt] {
    border-radius: 0.5rem;
    padding: var(--iam-space-3) var(--iam-space-4);
    margin-bottom: var(--iam-space-4);
}

.iam-banner strong[b-lq168conxt] {
    display: block;
    margin-bottom: 0.25rem;
}

.iam-banner--error[b-lq168conxt] {
    background: #fff2f2;
    border: 1px solid #f3c9c9;
    color: #6d1e1e;
    max-width: 72rem;
    margin: var(--iam-space-4) auto;
}

@media (max-width: 640px) {
    .iam-header[b-lq168conxt] {
        flex-direction: column;
    }

    .iam-card__header[b-lq168conxt] {
        flex-direction: column;
        align-items: stretch;
    }
}

.profile-wizard__guardian-row[b-lq168conxt] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(8rem, 1fr)) auto;
    gap: 0.5rem;
    align-items: center;
    margin-bottom: 0.75rem;
}

/* Reached from an event's own themed Welcome page (see ProfileWizard.razor's own doc comment) -
   .iam-card/.iam-breadcrumbs/.iam-header above already reference --brand-* custom properties
   with light-theme fallbacks, so ThemedHead alone re-colors accents/borders automatically once
   this class is present; only the page/card backgrounds and body text need an explicit override
   here to avoid a mismatched card against the page background. */
.profile-wizard--themed[b-lq168conxt] {
    background: var(--brand-page-bg, transparent);
    color: var(--brand-text-main, inherit);
}

.profile-wizard--themed .iam-header__subtitle[b-lq168conxt] {
    color: var(--brand-text-muted, #5d7a7a);
}

.profile-wizard--themed .iam-card[b-lq168conxt] {
    background: var(--brand-surface, #fff);
    border-color: var(--brand-border, #d8e8e8);
}

/* Step progress - "Krok X z Y" plus a breadcrumb of section titles, so it's always clear how
   much of the wizard is left (see the redesign's own "onboarding wizard" requirement). */
.wizard-progress[b-lq168conxt] {
    margin-bottom: var(--iam-space-4);
}

.wizard-progress__label[b-lq168conxt] {
    margin: 0 0 0.5rem;
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--brand-text-muted, #475569);
}

.wizard-progress__steps[b-lq168conxt] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.wizard-progress__step[b-lq168conxt] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.9rem;
    color: var(--brand-text-muted, #475569);
}

.wizard-progress__step.is-current[b-lq168conxt] {
    color: var(--brand-primary, #2563eb);
    font-weight: 700;
}

.wizard-progress__step.is-done[b-lq168conxt] {
    color: var(--brand-text-main, #0f172a);
    font-weight: 600;
}

.wizard-progress__arrow[b-lq168conxt] {
    color: var(--brand-border, #cbd5e1);
}

/* Section titles/labels/helper text replace the old ALL-CAPS h6.text-muted headings used when
   this page was one-field-per-card - normal sentence case, with distinct roles for the section
   heading itself vs. a field's own label vs. explanatory helper copy under it. */
.profile-wizard__section-title[b-lq168conxt] {
    margin: 0 0 0.25rem;
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--brand-text-main, #0f172a);
}

.profile-wizard__section-subtitle[b-lq168conxt] {
    margin: 0 0 1rem;
    font-size: 0.95rem;
    color: var(--brand-text-muted, #475569);
}

.profile-wizard__field-grid[b-lq168conxt] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
    gap: 1rem 1.5rem;
}

.profile-wizard__field[b-lq168conxt] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.profile-wizard__field-label[b-lq168conxt] {
    font-size: 0.95rem;
    font-weight: 500;
    color: var(--brand-text-main, #0f172a);
}

.profile-wizard__field-help[b-lq168conxt] {
    margin: 0;
    font-size: 0.85rem;
    color: var(--brand-text-muted, #475569);
}

/* A required field that's still blank - the label turns red (same signal as the trailing "*"
   already gives, just louder) and its own input/select/textarea gets a red border, so a
   returning participant landing mid-wizard (see ProfileWizard's OnlyIncomplete) can spot what
   still needs filling in without reading every label. */
.profile-wizard__field--missing > .profile-wizard__field-label[b-lq168conxt] {
    color: #dc2626;
}

.profile-wizard__field--missing > .form-control[b-lq168conxt],
.profile-wizard__field--missing > .form-select[b-lq168conxt] {
    border-color: #dc2626;
}

.profile-wizard__summary[b-lq168conxt] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
    gap: 1rem 1.5rem;
    margin: 0;
}

.profile-wizard__summary dt[b-lq168conxt] {
    font-size: 0.85rem;
    color: var(--brand-text-muted, #475569);
}

.profile-wizard__summary dd[b-lq168conxt] {
    margin: 0.15rem 0 0;
    font-weight: 600;
    color: var(--brand-text-main, #0f172a);
}

.profile-wizard__nav[b-lq168conxt] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

/* Form control tokens for the redesign - taller, softer-radius inputs with a calm blue focus
   ring instead of Bootstrap's default. Scoped to .profile-wizard so it doesn't leak into other
   pages that happen to share Bootstrap's own classes. */
.profile-wizard .form-control[b-lq168conxt],
.profile-wizard .form-select[b-lq168conxt] {
    min-height: 3rem;
    border-radius: 0.75rem;
    border: 1px solid #cbd5e1;
}

.profile-wizard .form-control:focus[b-lq168conxt],
.profile-wizard .form-select:focus[b-lq168conxt] {
    border-color: var(--brand-primary, #2563eb);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand-primary, #2563eb) 20%, transparent);
}

/* Bootstrap's default .form-control is a light control (white background, dark text) - wrong
   on BOOST's dark surface. Same treatment Welcome.razor's own .welcome-form already uses. */
.profile-wizard--themed .form-control[b-lq168conxt],
.profile-wizard--themed .form-select[b-lq168conxt] {
    background-color: color-mix(in srgb, var(--brand-surface) 80%, black);
    border-color: var(--brand-border, #cbd5e1);
    color: var(--brand-text-main, inherit);
}

.profile-wizard--themed .form-control[b-lq168conxt]::placeholder,
.profile-wizard--themed textarea[b-lq168conxt]::placeholder {
    color: var(--brand-text-muted);
    opacity: 0.7;
}

.profile-wizard--themed .form-control:focus[b-lq168conxt],
.profile-wizard--themed .form-select:focus[b-lq168conxt] {
    background-color: color-mix(in srgb, var(--brand-surface) 80%, black);
    border-color: var(--brand-accent, #2563eb);
    color: var(--brand-text-main, inherit);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand-accent) 20%, transparent);
}

/* Native <select> option lists render via OS chrome regardless of the rules above - forcing a
   light background/dark text here at least keeps the closed dropdown legible. */
.profile-wizard--themed .form-select option[b-lq168conxt] {
    background-color: #fff;
    color: #212529;
}

/* A Multi-cardinality parameter's own checkbox options (e.g. dietary restrictions) - boxed and
   laid out in as many columns as fit, same as .form-control's own bordered/rounded treatment,
   rather than a single bare column that can run to 20+ full-width rows for a long option list. */
.profile-wizard__checkbox-group[b-lq168conxt] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(11rem, 1fr));
    gap: 0.5rem 1rem;
    border: 1px solid #cbd5e1;
    border-radius: 0.75rem;
    padding: 0.85rem 1rem;
}

.profile-wizard__checkbox-group .form-check[b-lq168conxt] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0;
    min-width: 0;
}

.profile-wizard__checkbox-group .form-check-input[b-lq168conxt] {
    flex-shrink: 0;
    margin-top: 0;
}

.profile-wizard__checkbox-group .form-check-label[b-lq168conxt] {
    overflow-wrap: anywhere;
}

.profile-wizard__checkbox-group .form-check-input:checked[b-lq168conxt] {
    background-color: var(--brand-primary, #2563eb);
    border-color: var(--brand-primary, #2563eb);
}

.profile-wizard--themed .profile-wizard__checkbox-group[b-lq168conxt] {
    background-color: color-mix(in srgb, var(--brand-surface) 80%, black);
    border-color: var(--brand-border, #cbd5e1);
}

.profile-wizard--themed .profile-wizard__checkbox-group .form-check-label[b-lq168conxt] {
    color: var(--brand-text-main, inherit);
}

.profile-wizard--themed .profile-wizard__checkbox-group .form-check-input:checked[b-lq168conxt] {
    background-color: var(--brand-accent, #2563eb);
    border-color: var(--brand-accent, #2563eb);
}
/* _content/InuniSphere.Web/Components/Pages/Activities/ActivitySelection.razor.rz.scp.css */
/* Same visual language as /admin and TransportWizard.razor's own copy of it - kept as a separate
   copy rather than a shared stylesheet because Blazor CSS isolation scopes rules to the
   component that declares them. */
.iam-page[b-c6ay4lpmzv] {
    --iam-space-3: 1rem;
    --iam-space-4: 1.5rem;
    --iam-space-5: 2rem;
    --iam-radius: 0.75rem;
    --iam-shadow: 0 1px 2px rgba(16, 24, 40, 0.06), 0 1px 3px rgba(16, 24, 40, 0.08);
    max-width: 72rem;
    margin: 0 auto;
    padding: 0 var(--iam-space-4) var(--iam-space-5);
}

.iam-breadcrumbs[b-c6ay4lpmzv] {
    max-width: 72rem;
    margin: 0 auto;
    padding: 0.9rem 1.5rem 0;
    font-size: 0.85rem;
    color: var(--brand-text-muted, #5d7a7a);
}

.iam-breadcrumbs a[b-c6ay4lpmzv] {
    color: inherit;
    text-decoration: none;
}

.iam-breadcrumbs a:hover[b-c6ay4lpmzv] {
    text-decoration: underline;
}

.iam-breadcrumbs__sep[b-c6ay4lpmzv] {
    margin: 0 0.4rem;
}

.iam-header[b-c6ay4lpmzv] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--iam-space-3);
    padding-top: var(--iam-space-4);
    margin-bottom: var(--iam-space-4);
}

.iam-header h1[b-c6ay4lpmzv] {
    margin: 0 0 0.35rem;
    font-size: 1.75rem;
}

.iam-header__subtitle[b-c6ay4lpmzv] {
    margin: 0;
    color: var(--brand-text-muted, #5d7a7a);
}

.iam-card[b-c6ay4lpmzv] {
    background: #fff;
    border: 1px solid var(--brand-border, #d8e8e8);
    border-radius: var(--iam-radius);
    box-shadow: var(--iam-shadow);
    padding: var(--iam-space-4);
    margin-bottom: var(--iam-space-4);
}

.iam-banner[b-c6ay4lpmzv] {
    border-radius: 0.5rem;
    padding: var(--iam-space-3) var(--iam-space-4);
    margin-bottom: var(--iam-space-4);
}

.iam-banner strong[b-c6ay4lpmzv] {
    display: block;
    margin-bottom: 0.25rem;
}

.iam-banner--error[b-c6ay4lpmzv] {
    background: #fff2f2;
    border: 1px solid #f3c9c9;
    color: #6d1e1e;
}

.iam-banner--success[b-c6ay4lpmzv] {
    background: #f0fdf4;
    border: 1px solid #bbf7d0;
    color: #14532d;
}

/* Same theming approach as TransportWizard.razor's own .transport-wizard--themed - ThemedHead
   already re-colors --brand-* custom properties globally once present, so only the page/card
   backgrounds and body text need an explicit override here. */
.activities-page--themed[b-c6ay4lpmzv] {
    background: var(--brand-page-bg, transparent);
    color: var(--brand-text-main, inherit);
}

.activities-page--themed .iam-header__subtitle[b-c6ay4lpmzv] {
    color: var(--brand-text-muted, #5d7a7a);
}

.activities-page--themed .iam-card[b-c6ay4lpmzv],
.activities-page--themed .activity-option[b-c6ay4lpmzv] {
    background: var(--brand-surface, #fff);
    border-color: var(--brand-border, #d8e8e8);
}

.activities-page--themed .text-muted[b-c6ay4lpmzv] {
    color: var(--brand-text-muted, #6c757d) !important;
}

.activity-option[b-c6ay4lpmzv] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    border: 1px solid var(--brand-border, #d8e8e8);
    border-radius: var(--brand-radius, 0.6rem);
    padding: 0.75rem 1rem;
    cursor: pointer;
    background: #fff;
}

.activity-option input[type="checkbox"][b-c6ay4lpmzv],
.activity-option input[type="radio"][b-c6ay4lpmzv] {
    margin-top: 0.2rem;
    flex-shrink: 0;
}

.activity-option.is-selected[b-c6ay4lpmzv] {
    border-color: var(--brand-accent, #185354);
    background: var(--brand-accent-soft, #eef6f6);
}

.activity-option--disabled[b-c6ay4lpmzv] {
    opacity: 0.55;
    cursor: not-allowed;
}

.activity-group__description[b-c6ay4lpmzv] {
    margin-top: 0.35rem;
}

.activity-group__description :first-child[b-c6ay4lpmzv] {
    margin-top: 0;
}

.activity-group__description :last-child[b-c6ay4lpmzv] {
    margin-bottom: 0;
}

.activity-companion-list[b-c6ay4lpmzv] {
    max-height: 16rem;
    overflow-y: auto;
    padding-right: 0.25rem;
}

/* Fixed on-screen box regardless of the uploaded image's own native size - width:auto/height:auto
   would size the map to whatever pixel dimensions the admin's screenshot happened to have (some
   uploads are enormous, dwarfing the rest of the page). object-fit:contain shows the whole map
   letterboxed rather than cropping any of the route out. */
.activity-route__map[b-c6ay4lpmzv] {
    display: block;
    width: 100%;
    height: 18rem;
    object-fit: contain;
    background: var(--brand-accent-soft, #f4fafa);
    border-radius: var(--brand-radius, 0.6rem);
    border: 1px solid var(--brand-border, #d8e8e8);
}

@media (max-width: 640px) {
    .iam-header[b-c6ay4lpmzv] {
        flex-direction: column;
    }

    .activity-route__map[b-c6ay4lpmzv] {
        height: 13rem;
    }
}
/* _content/InuniSphere.Web/Components/Pages/Admin/Activities.razor.rz.scp.css */
/* Same visual language as /admin (see Admin.razor.css's own design-tokens comment) - kept as
   a separate copy rather than a shared stylesheet because Blazor CSS isolation scopes rules
   to the component that declares them; a class used in Activities.razor picks up nothing
   from Admin.razor.css. */
.iam-page[b-hs8q3t1fy6] {
    --iam-space-1: 0.5rem;
    --iam-space-2: 0.75rem;
    --iam-space-3: 1rem;
    --iam-space-4: 1.5rem;
    --iam-space-5: 2rem;
    --iam-radius: 0.75rem;
    --iam-radius-sm: 0.5rem;
    --iam-shadow: 0 1px 2px rgba(16, 24, 40, 0.06), 0 1px 3px rgba(16, 24, 40, 0.08);
    max-width: 72rem;
    margin: 0 auto;
    padding: 0 var(--iam-space-4) var(--iam-space-5);
}

.iam-breadcrumbs[b-hs8q3t1fy6] {
    max-width: 72rem;
    margin: 0 auto;
    padding: 0.9rem 1.5rem 0;
    font-size: 0.85rem;
    color: var(--brand-text-muted, #5d7a7a);
}

.iam-breadcrumbs a[b-hs8q3t1fy6] {
    color: inherit;
    text-decoration: none;
}

.iam-breadcrumbs a:hover[b-hs8q3t1fy6] {
    text-decoration: underline;
}

.iam-breadcrumbs__sep[b-hs8q3t1fy6] {
    margin: 0 0.4rem;
}

.iam-breadcrumbs [aria-current="page"][b-hs8q3t1fy6] {
    color: var(--brand-text-main, #232323);
    font-weight: 600;
}

.iam-header[b-hs8q3t1fy6] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--iam-space-3);
    padding-top: var(--iam-space-4);
    margin-bottom: var(--iam-space-4);
}

.iam-header h1[b-hs8q3t1fy6] {
    margin: 0 0 0.35rem;
    font-size: 1.75rem;
}

.iam-header__subtitle[b-hs8q3t1fy6] {
    margin: 0;
    color: var(--brand-text-muted, #5d7a7a);
}

.iam-card[b-hs8q3t1fy6] {
    background: #fff;
    border: 1px solid var(--brand-border, #d8e8e8);
    border-radius: var(--iam-radius);
    box-shadow: var(--iam-shadow);
    padding: var(--iam-space-4);
    margin-bottom: var(--iam-space-4);
}

.iam-card h2[b-hs8q3t1fy6] {
    font-size: 1.15rem;
    margin: 0 0 0.25rem;
}

.iam-banner[b-hs8q3t1fy6] {
    border-radius: var(--iam-radius-sm);
    padding: var(--iam-space-3) var(--iam-space-4);
    margin-bottom: var(--iam-space-4);
}

.iam-banner strong[b-hs8q3t1fy6] {
    display: block;
    margin-bottom: 0.25rem;
}

.iam-banner p[b-hs8q3t1fy6] {
    margin: 0;
}

.iam-banner--error[b-hs8q3t1fy6] {
    background: #fff2f2;
    border: 1px solid #f3c9c9;
    color: #6d1e1e;
    max-width: 72rem;
    margin: var(--iam-space-4) auto;
}

.iam-table td[b-hs8q3t1fy6],
.iam-table th[b-hs8q3t1fy6] {
    padding: var(--iam-space-2) var(--iam-space-3);
}

.iam-table tbody tr:hover[b-hs8q3t1fy6] {
    background: var(--brand-accent-soft, #f4fafa);
}

.activity-route-card[b-hs8q3t1fy6] {
    background: #fbfcfc;
    border: 1px solid var(--brand-border, #d8e8e8);
    border-radius: var(--iam-radius-sm);
    padding: var(--iam-space-3);
}

.activity-route-card__map[b-hs8q3t1fy6] {
    max-width: 16rem;
    max-height: 10rem;
    display: block;
    border-radius: var(--iam-radius-sm);
    border: 1px solid var(--brand-border, #d8e8e8);
}

@media (max-width: 640px) {
    .iam-header[b-hs8q3t1fy6] {
        flex-direction: column;
    }
}
/* _content/InuniSphere.Web/Components/Pages/Admin/ActivitiesDashboard.razor.rz.scp.css */
/* Same visual language as Activities.razor.css's own copy - kept separate since Blazor CSS
   isolation scopes rules to the component that declares them. */
.iam-page[b-wf179hajic] {
    --iam-space-1: 0.5rem;
    --iam-space-2: 0.75rem;
    --iam-space-3: 1rem;
    --iam-space-4: 1.5rem;
    --iam-space-5: 2rem;
    --iam-radius: 0.75rem;
    --iam-radius-sm: 0.5rem;
    --iam-shadow: 0 1px 2px rgba(16, 24, 40, 0.06), 0 1px 3px rgba(16, 24, 40, 0.08);
    max-width: 72rem;
    margin: 0 auto;
    padding: 0 var(--iam-space-4) var(--iam-space-5);
}

.iam-breadcrumbs[b-wf179hajic] {
    max-width: 72rem;
    margin: 0 auto;
    padding: 0.9rem 1.5rem 0;
    font-size: 0.85rem;
    color: var(--brand-text-muted, #5d7a7a);
}

.iam-breadcrumbs a[b-wf179hajic] {
    color: inherit;
    text-decoration: none;
}

.iam-breadcrumbs a:hover[b-wf179hajic] {
    text-decoration: underline;
}

.iam-breadcrumbs__sep[b-wf179hajic] {
    margin: 0 0.4rem;
}

.iam-breadcrumbs [aria-current="page"][b-wf179hajic] {
    color: var(--brand-text-main, #232323);
    font-weight: 600;
}

.iam-header[b-wf179hajic] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--iam-space-3);
    padding-top: var(--iam-space-4);
    margin-bottom: var(--iam-space-4);
}

.iam-header h1[b-wf179hajic] {
    margin: 0 0 0.35rem;
    font-size: 1.75rem;
}

.iam-header__subtitle[b-wf179hajic] {
    margin: 0;
    color: var(--brand-text-muted, #5d7a7a);
}

.iam-card[b-wf179hajic] {
    background: #fff;
    border: 1px solid var(--brand-border, #d8e8e8);
    border-radius: var(--iam-radius);
    box-shadow: var(--iam-shadow);
    padding: var(--iam-space-4);
    margin-bottom: var(--iam-space-4);
}

.iam-card h2[b-wf179hajic] {
    font-size: 1.15rem;
    margin: 0 0 0.25rem;
}

.iam-banner[b-wf179hajic] {
    border-radius: var(--iam-radius-sm);
    padding: var(--iam-space-3) var(--iam-space-4);
    margin-bottom: var(--iam-space-4);
}

.iam-banner strong[b-wf179hajic] {
    display: block;
    margin-bottom: 0.25rem;
}

.iam-banner p[b-wf179hajic] {
    margin: 0;
}

.iam-banner--error[b-wf179hajic] {
    background: #fff2f2;
    border: 1px solid #f3c9c9;
    color: #6d1e1e;
    max-width: 72rem;
    margin: var(--iam-space-4) auto;
}

.iam-table td[b-wf179hajic],
.iam-table th[b-wf179hajic] {
    padding: var(--iam-space-2) var(--iam-space-3);
}

.iam-table tbody tr:hover[b-wf179hajic] {
    background: var(--brand-accent-soft, #f4fafa);
}

@media (max-width: 640px) {
    .iam-header[b-wf179hajic] {
        flex-direction: column;
    }
}
/* _content/InuniSphere.Web/Components/Pages/Admin/Admin.razor.rz.scp.css */
/* Same visual language as /iam (see Iam.razor.css's own design-tokens comment) — kept as
   a separate copy rather than a shared stylesheet because Blazor CSS isolation scopes rules
   to the component that declares them; a class used in Admin.razor picks up nothing from
   Iam.razor.css. */
.iam-page[b-ebn7kr2rvs] {
    --iam-space-1: 0.5rem;
    --iam-space-2: 0.75rem;
    --iam-space-3: 1rem;
    --iam-space-4: 1.5rem;
    --iam-space-5: 2rem;
    --iam-radius: 0.75rem;
    --iam-radius-sm: 0.5rem;
    --iam-shadow: 0 1px 2px rgba(16, 24, 40, 0.06), 0 1px 3px rgba(16, 24, 40, 0.08);
    max-width: 72rem;
    margin: 0 auto;
    padding: 0 var(--iam-space-4) var(--iam-space-5);
}

.iam-breadcrumbs[b-ebn7kr2rvs] {
    max-width: 72rem;
    margin: 0 auto;
    padding: 0.9rem 1.5rem 0;
    font-size: 0.85rem;
    color: var(--brand-text-muted, #5d7a7a);
}

.iam-breadcrumbs a[b-ebn7kr2rvs] {
    color: inherit;
    text-decoration: none;
}

.iam-breadcrumbs a:hover[b-ebn7kr2rvs] {
    text-decoration: underline;
}

.iam-breadcrumbs__sep[b-ebn7kr2rvs] {
    margin: 0 0.4rem;
}

.iam-breadcrumbs [aria-current="page"][b-ebn7kr2rvs] {
    color: var(--brand-text-main, #232323);
    font-weight: 600;
}

.iam-header[b-ebn7kr2rvs] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--iam-space-3);
    padding-top: var(--iam-space-4);
    margin-bottom: var(--iam-space-4);
}

.iam-header h1[b-ebn7kr2rvs] {
    margin: 0 0 0.35rem;
    font-size: 1.75rem;
}

.iam-header__subtitle[b-ebn7kr2rvs] {
    margin: 0;
    color: var(--brand-text-muted, #5d7a7a);
}


.iam-header__context[b-ebn7kr2rvs] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: center;
}

/* ============ Responsive category navigation ============
   Desktop (>=1200px): a sticky left sidebar, all 7 categories always visible at once.
   Mobile (<1200px): the sidebar becomes a fixed bottom nav with the 3 most-used categories
   plus a "Więcej" button opening a Modal listing the rest - kept as an existing Modal instance
   rather than a custom slide-up sheet, consistent with how every other overlay in this app
   already works. .admin-shell only becomes a two-column grid at the desktop breakpoint; below
   it it's just the page's own single column, with .admin-sidebar hidden entirely. */
.admin-shell[b-ebn7kr2rvs] {
    display: block;
}

.admin-sidebar[b-ebn7kr2rvs] {
    display: none;
}

@media (min-width: 1200px) {
    .admin-shell[b-ebn7kr2rvs] {
        display: grid;
        grid-template-columns: 14rem 1fr;
        gap: var(--iam-space-5);
        align-items: start;
    }

    .admin-sidebar[b-ebn7kr2rvs] {
        display: flex;
        flex-direction: column;
        gap: 0.15rem;
        position: sticky;
        top: 1rem;
    }
}

.admin-sidebar__item[b-ebn7kr2rvs] {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    padding: 0.6rem 0.75rem;
    border-radius: var(--iam-radius-sm);
    border: none;
    background: none;
    text-align: left;
    font-weight: 600;
    color: var(--brand-text-muted, #5d7a7a);
    cursor: pointer;
    min-height: 44px;
}

.admin-sidebar__item:hover[b-ebn7kr2rvs] {
    background: var(--brand-accent-soft, #eef6f6);
    color: var(--brand-text-main, #232323);
}

.admin-sidebar__item.is-active[b-ebn7kr2rvs] {
    background: var(--brand-accent-soft, #eef6f6);
    color: var(--brand-primary, #185354);
}

.admin-sidebar__icon[b-ebn7kr2rvs] {
    font-size: 1.15rem;
    width: 1.4rem;
    text-align: center;
    flex-shrink: 0;
}

.admin-sidebar__secondary[b-ebn7kr2rvs] {
    margin-top: 0.5rem;
    padding-top: 0.5rem;
    border-top: 1px solid var(--brand-border, #d8e8e8);
}

@media (max-width: 1199.98px) {
    .iam-page[b-ebn7kr2rvs] {
        padding-bottom: 5rem;
    }
}

.admin-bottom-nav[b-ebn7kr2rvs] {
    display: flex;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 40;
    background: #fff;
    border-top: 1px solid var(--brand-border, #d8e8e8);
    box-shadow: 0 -2px 8px rgba(16, 24, 40, 0.06);
}

@media (min-width: 1200px) {
    .admin-bottom-nav[b-ebn7kr2rvs] {
        display: none;
    }
}

.admin-bottom-nav__item[b-ebn7kr2rvs] {
    flex: 1 1 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.15rem;
    min-height: 3rem;
    min-width: 44px;
    padding: 0.4rem 0.2rem calc(0.4rem + env(safe-area-inset-bottom, 0px));
    background: none;
    border: none;
    font-size: 0.68rem;
    font-weight: 600;
    color: var(--brand-text-muted, #5d7a7a);
}

.admin-bottom-nav__item.is-active[b-ebn7kr2rvs] {
    color: var(--brand-primary, #185354);
}

.admin-bottom-nav__icon[b-ebn7kr2rvs] {
    font-size: 1.15rem;
}

.admin-more-sheet__item[b-ebn7kr2rvs] {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    width: 100%;
    padding: 0.75rem;
    border-radius: var(--iam-radius-sm);
    border: 1px solid var(--brand-border, #d8e8e8);
    background: #fff;
    text-align: left;
    font-weight: 600;
    margin-bottom: 0.5rem;
    min-height: 44px;
}

.iam-card[b-ebn7kr2rvs] {
    background: #fff;
    border: 1px solid var(--brand-border, #d8e8e8);
    border-radius: var(--iam-radius);
    box-shadow: var(--iam-shadow);
    padding: var(--iam-space-4);
    margin-bottom: var(--iam-space-4);
}

.iam-card h2[b-ebn7kr2rvs] {
    font-size: 1.15rem;
    margin: 0 0 0.25rem;
}

/* A card-styled block inside another .iam-card (e.g. Karta Kwalifikacyjna's Section I fields) -
   same bordered look, without stacking a second shadow/margin on top of the parent card's own. */
.iam-card--nested[b-ebn7kr2rvs] {
    box-shadow: none;
    margin-bottom: 0;
    background: var(--brand-accent-soft, #f4fafa);
}

.iam-card__header[b-ebn7kr2rvs] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--iam-space-3);
    margin-bottom: var(--iam-space-4);
}

.iam-card__actions[b-ebn7kr2rvs] {
    display: flex;
    align-items: center;
    gap: var(--iam-space-2);
    flex-wrap: wrap;
}

.iam-banner[b-ebn7kr2rvs] {
    border-radius: var(--iam-radius-sm);
    padding: var(--iam-space-3) var(--iam-space-4);
    margin-bottom: var(--iam-space-4);
}

.iam-banner strong[b-ebn7kr2rvs] {
    display: block;
    margin-bottom: 0.25rem;
}

.iam-banner p[b-ebn7kr2rvs] {
    margin: 0;
}

.iam-banner--error[b-ebn7kr2rvs] {
    background: #fff2f2;
    border: 1px solid #f3c9c9;
    color: #6d1e1e;
    max-width: 72rem;
    margin: var(--iam-space-4) auto;
}

.iam-table td[b-ebn7kr2rvs],
.iam-table th[b-ebn7kr2rvs] {
    padding: var(--iam-space-2) var(--iam-space-3);
}

.iam-table tbody tr:hover[b-ebn7kr2rvs] {
    background: var(--brand-accent-soft, #f4fafa);
}

.admin-series-group[b-ebn7kr2rvs] {
    margin-bottom: var(--iam-space-5);
}

.admin-series-header[b-ebn7kr2rvs] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--iam-space-3);
    background: var(--brand-accent-soft, #f4fafa);
    border: 1px solid var(--brand-border, #d8e8e8);
    border-radius: var(--iam-radius);
    padding: var(--iam-space-3) var(--iam-space-4);
    margin-bottom: var(--iam-space-3);
}

.admin-series-header h2[b-ebn7kr2rvs] {
    font-size: 1.15rem;
    margin: 0 0 0.25rem;
}

@media (max-width: 640px) {
    .iam-header[b-ebn7kr2rvs] {
        flex-direction: column;
    }

    .iam-card__header[b-ebn7kr2rvs] {
        flex-direction: column;
        align-items: stretch;
    }

    .admin-series-header[b-ebn7kr2rvs] {
        flex-direction: column;
        align-items: stretch;
    }
}

/* "Dodaj rozwiązania w imieniu uczestników" camera flow - the <video>/thumbnails elements
   themselves are plain empty Blazor-rendered containers that wwwroot/js/contest-scan.js owns
   directly (populates/mutates outside Blazor's own diffing), same convention as
   PdfAnnotationViewer.razor's own JS-owned canvas stack. */
.contest-scan__video[b-ebn7kr2rvs] {
    width: 100%;
    max-width: 28rem;
    border-radius: var(--brand-radius, 0.6rem);
    background: #000;
}

.contest-scan__thumbnails[b-ebn7kr2rvs] {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
    margin-top: 0.75rem;
}

.contest-scan__thumb[b-ebn7kr2rvs] {
    width: 4.5rem;
    height: 4.5rem;
    object-fit: cover;
    border-radius: var(--brand-radius, 0.6rem);
    border: 1px solid var(--brand-border, #d8e8e8);
}

/* ============ Dashboard KPI cards + "Wymaga uwagi" ============
   .iam-dashboard__stat (Iam.razor's own copy) was a plain non-interactive summary; these are
   real buttons (min 44px tap target) that jump to the relevant category, per admin-kpi-card's
   own "every card must be clickable" requirement. --warn is semantic (something needs
   attention), independent of the page's own --brand-primary accent. */
.admin-kpi-grid[b-ebn7kr2rvs] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
    gap: var(--iam-space-3);
}

.admin-kpi-card[b-ebn7kr2rvs] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    padding: var(--iam-space-3) var(--iam-space-4);
    border: 1px solid var(--brand-border, #d8e8e8);
    border-radius: var(--iam-radius-sm);
    background: var(--brand-accent-soft, #f4fafa);
    text-align: left;
    cursor: pointer;
    min-height: 44px;
}

.admin-kpi-card:hover[b-ebn7kr2rvs] {
    border-color: var(--brand-primary, #185354);
}

.admin-kpi-card__value[b-ebn7kr2rvs] {
    font-size: 1.75rem;
    font-weight: 600;
    line-height: 1.1;
    font-variant-numeric: tabular-nums;
}

.admin-kpi-card__label[b-ebn7kr2rvs] {
    font-size: 0.85rem;
    color: var(--brand-text-muted, #5d7a7a);
}

.admin-kpi-card--warn[b-ebn7kr2rvs] {
    background: #fff7ed;
    border-color: #fed7aa;
}

.admin-kpi-card--warn .admin-kpi-card__value[b-ebn7kr2rvs] {
    color: #b45309;
}

.admin-attention[b-ebn7kr2rvs] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.admin-attention__item[b-ebn7kr2rvs] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    width: 100%;
    padding: 0.65rem 0.9rem;
    border: 1px solid var(--brand-border, #d8e8e8);
    border-radius: var(--iam-radius-sm);
    background: #fff;
    min-height: 44px;
    text-align: left;
    font-weight: 600;
    cursor: pointer;
}

.admin-attention__item:hover[b-ebn7kr2rvs] {
    border-color: var(--brand-primary, #185354);
}

.admin-attention__item--empty[b-ebn7kr2rvs] {
    color: var(--brand-text-muted, #5d7a7a);
    font-weight: 400;
    cursor: default;
}

.admin-attention__count[b-ebn7kr2rvs] {
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    background: #fee2e2;
    color: #b91c1c;
    border-radius: 999px;
    padding: 0.1rem 0.6rem;
    min-width: 2rem;
    text-align: center;
}
/* _content/InuniSphere.Web/Components/Pages/Admin/Review/ContestReviewWorkspace.razor.rz.scp.css */
/* Admin-side page (InuniNav, not BoostNav) - light INUNI palette, same tokens as Admin.razor.css/
   Iam.razor.css rather than the dark BOOST palette Contest.razor.css uses for the
   participant-facing pages. Everything from "Layout" on is ::deep because it's rendered by the
   PdfAnnotationViewer/ReviewSidebar child components, not by this page directly - see
   Contest.razor.css's own comment for why Blazor CSS isolation requires that. */
.iam-page[b-qqsxoucc3w] {
    --iam-space-3: 1rem;
    --iam-space-4: 1.5rem;
    --iam-radius: 0.6rem;
    max-width: 100%;
    padding: 0 1.5rem 2rem;
}

.iam-breadcrumbs[b-qqsxoucc3w] {
    padding: 0.9rem 1.5rem 0;
    font-size: 0.85rem;
    color: var(--brand-text-muted, #5d7a7a);
}

.iam-breadcrumbs a[b-qqsxoucc3w] {
    color: inherit;
    text-decoration: none;
}

.iam-breadcrumbs a:hover[b-qqsxoucc3w] {
    text-decoration: underline;
}

.iam-breadcrumbs__sep[b-qqsxoucc3w] {
    margin: 0 0.4rem;
}

.iam-banner[b-qqsxoucc3w] {
    border-radius: 0.5rem;
    padding: 1rem 1.5rem;
    margin: 1rem 1.5rem;
}

.iam-banner--error[b-qqsxoucc3w] {
    background: #fff2f2;
    border: 1px solid #f3c9c9;
    color: #6d1e1e;
}

.review-workspace-page[b-qqsxoucc3w] {
    padding: 0 1.5rem 1.5rem;
}

.contest-title[b-qqsxoucc3w] {
    font-size: 24px;
    font-weight: 700;
    margin: 0 0 0.15rem;
}

.contest-meta[b-qqsxoucc3w] {
    font-size: 14px;
    font-weight: 500;
}

.contest-secondary[b-qqsxoucc3w] {
    font-size: 13px;
    color: var(--brand-text-muted, #5d7a7a);
    margin: 0;
}

.review-workspace__header[b-qqsxoucc3w] {
    padding: 1rem 0;
}

.review-workspace__body[b-qqsxoucc3w] {
    display: grid;
    grid-template-columns: minmax(0, 2.2fr) minmax(20rem, 1fr);
    gap: 1.25rem;
    align-items: start;
    height: calc(100vh - 220px);
}

.review-workspace__viewer[b-qqsxoucc3w],
.review-workspace__sidebar[b-qqsxoucc3w] {
    height: 100%;
    min-height: 0;
    border: 1px solid var(--brand-border, #d8e8e8);
    border-radius: var(--iam-radius);
    overflow: hidden;
    background: #fff;
}

@media (max-width: 1000px) {
    .review-workspace__body[b-qqsxoucc3w] {
        grid-template-columns: 1fr;
        height: auto;
    }

    .review-workspace__viewer[b-qqsxoucc3w] {
        height: 70vh;
    }
}

/* ============ PDF viewer ============ */

[b-qqsxoucc3w] .pdf-viewer {
    display: flex;
    flex-direction: column;
    height: 100%;
}

[b-qqsxoucc3w] .pdf-viewer__toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem;
    border-bottom: 1px solid var(--brand-border, #d8e8e8);
    flex: 0 0 auto;
    flex-wrap: wrap;
}

[b-qqsxoucc3w] .pdf-viewer__tool-group {
    display: flex;
    gap: 0.25rem;
}

[b-qqsxoucc3w] .pdf-viewer__tool {
    appearance: none;
    border: 1px solid var(--brand-border, #d8e8e8);
    background: #fff;
    border-radius: 0.4rem;
    min-width: 2.1rem;
    height: 2.1rem;
    cursor: pointer;
    font-size: 0.95rem;
}

[b-qqsxoucc3w] .pdf-viewer__tool:hover {
    border-color: var(--brand-primary, #185354);
}

[b-qqsxoucc3w] .pdf-viewer__tool.is-active {
    background: var(--brand-primary, #185354);
    color: #fff;
    border-color: var(--brand-primary, #185354);
}

[b-qqsxoucc3w] .pdf-viewer__viewport {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
    background: #525659;
    position: relative;
}

[b-qqsxoucc3w] .pdf-viewer__stack {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
    padding: 1rem;
    transform-origin: 0 0;
    width: max-content;
}

[b-qqsxoucc3w] .pdf-page {
    position: relative;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
    background: #fff;
}

[b-qqsxoucc3w] .pdf-page canvas {
    position: absolute;
    top: 0;
    left: 0;
}

[b-qqsxoucc3w] .pdf-page__marks-canvas {
    pointer-events: none;
}

[b-qqsxoucc3w] .pdf-page__pins {
    position: absolute;
    inset: 0;
}

[b-qqsxoucc3w] .pdf-pin {
    position: absolute;
    transform: translate(-50%, -100%);
    appearance: none;
    border: 2px solid #fff;
    border-radius: 999px;
    width: 1.75rem;
    height: 1.75rem;
    color: #fff;
    font-size: 0.85rem;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
}

[b-qqsxoucc3w] .pdf-pin--pulse {
    animation: pdf-pin-pulse-b-qqsxoucc3w 0.5s ease-in-out 2;
}

@keyframes pdf-pin-pulse-b-qqsxoucc3w {
    0%, 100% { transform: translate(-50%, -100%) scale(1); }
    50% { transform: translate(-50%, -100%) scale(1.4); }
}

/* ============ Review sidebar ============ */

[b-qqsxoucc3w] .review-sidebar {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    height: 100%;
    overflow-y: auto;
    padding: 1rem;
}

[b-qqsxoucc3w] .review-sidebar__header {
    padding-bottom: 0.75rem;
    border-bottom: 1px solid var(--brand-border, #d8e8e8);
}

[b-qqsxoucc3w] .review-sidebar__summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 1rem;
    border-radius: 0.5rem;
    background: var(--brand-accent-soft, #eef6f6);
}

[b-qqsxoucc3w] .review-sidebar__summary-score {
    font-size: 1.5rem;
    font-weight: 700;
}

[b-qqsxoucc3w] .review-sidebar__summary-counts {
    display: flex;
    gap: 0.6rem;
    font-size: 0.85rem;
}

[b-qqsxoucc3w] .review-sidebar__count--error { color: #ef4444; }
[b-qqsxoucc3w] .review-sidebar__count--suggestion { color: #3b82f6; }
[b-qqsxoucc3w] .review-sidebar__count--positive { color: #22c55e; }

[b-qqsxoucc3w] .review-sidebar__section {
    border-top: 1px solid var(--brand-border, #d8e8e8);
    padding-top: 0.75rem;
}

[b-qqsxoucc3w] .review-sidebar__section-title {
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--brand-text-muted, #5d7a7a);
    margin: 0 0 0.5rem;
}

[b-qqsxoucc3w] .review-sidebar__criterion {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
}

[b-qqsxoucc3w] .review-sidebar__criterion-input {
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

[b-qqsxoucc3w] .review-sidebar__criterion-input input {
    max-width: 5rem;
}

[b-qqsxoucc3w] .review-sidebar__composer {
    background: var(--brand-accent-soft, #eef6f6);
    border-radius: 0.5rem;
    padding: 0.75rem;
    border-top: none;
}

[b-qqsxoucc3w] .review-sidebar__category-picker {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

[b-qqsxoucc3w] .review-sidebar__category-btn {
    appearance: none;
    border: 1px solid var(--brand-border, #d8e8e8);
    background: #fff;
    border-radius: 999px;
    padding: 0.25rem 0.6rem;
    font-size: 0.8rem;
    cursor: pointer;
}

[b-qqsxoucc3w] .review-sidebar__category-btn.is-active {
    border-color: currentColor;
    font-weight: 700;
}

[b-qqsxoucc3w] .review-sidebar__category-btn--error { color: #ef4444; }
[b-qqsxoucc3w] .review-sidebar__category-btn--issue { color: #f59e0b; }
[b-qqsxoucc3w] .review-sidebar__category-btn--suggestion { color: #3b82f6; }
[b-qqsxoucc3w] .review-sidebar__category-btn--positive { color: #22c55e; }

[b-qqsxoucc3w] .review-sidebar__templates {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3rem;
    margin-top: 0.5rem;
}

[b-qqsxoucc3w] .review-sidebar__template-btn {
    appearance: none;
    border: 1px dashed var(--brand-border, #d8e8e8);
    background: #fff;
    border-radius: 0.4rem;
    padding: 0.2rem 0.5rem;
    font-size: 0.75rem;
    cursor: pointer;
}

[b-qqsxoucc3w] .review-sidebar__template-btn:hover {
    border-color: var(--brand-primary, #185354);
}

[b-qqsxoucc3w] .review-sidebar__comment-list {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

[b-qqsxoucc3w] .review-sidebar__comment {
    border-radius: 0.5rem;
    padding: 0.6rem 0.75rem;
    cursor: pointer;
    border-left: 4px solid #888;
    background: #f8f9fa;
}

[b-qqsxoucc3w] .review-sidebar__comment--error { border-left-color: #ef4444; }
[b-qqsxoucc3w] .review-sidebar__comment--issue { border-left-color: #f59e0b; }
[b-qqsxoucc3w] .review-sidebar__comment--suggestion { border-left-color: #3b82f6; }
[b-qqsxoucc3w] .review-sidebar__comment--positive { border-left-color: #22c55e; }

[b-qqsxoucc3w] .review-sidebar__comment-header {
    display: flex;
    justify-content: space-between;
    font-size: 0.8rem;
    font-weight: 700;
}

[b-qqsxoucc3w] .review-sidebar__comment-text {
    margin: 0.35rem 0;
    font-size: 0.9rem;
}

[b-qqsxoucc3w] .review-sidebar__comment-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

[b-qqsxoucc3w] .review-sidebar__comment-delete {
    appearance: none;
    border: none;
    background: none;
    color: #a12626;
    font-size: 0.75rem;
    cursor: pointer;
}

[b-qqsxoucc3w] .review-sidebar__audit-list {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    font-size: 0.8rem;
}

[b-qqsxoucc3w] .review-sidebar__audit-item {
    display: flex;
    flex-direction: column;
}

[b-qqsxoucc3w] .review-sidebar__nav {
    display: flex;
    justify-content: space-between;
    padding-top: 0.75rem;
    border-top: 1px solid var(--brand-border, #d8e8e8);
}
/* _content/InuniSphere.Web/Components/Pages/Admin/Shop.razor.rz.scp.css */
/* Same visual language as /admin (see Admin.razor.css's own design-tokens comment) - kept as
   a separate copy rather than a shared stylesheet because Blazor CSS isolation scopes rules
   to the component that declares them; a class used in Shop.razor picks up nothing from
   Admin.razor.css/Activities.razor.css. */
.iam-page[b-bqs1qfolug] {
    --iam-space-1: 0.5rem;
    --iam-space-2: 0.75rem;
    --iam-space-3: 1rem;
    --iam-space-4: 1.5rem;
    --iam-space-5: 2rem;
    --iam-radius: 0.75rem;
    --iam-radius-sm: 0.5rem;
    --iam-shadow: 0 1px 2px rgba(16, 24, 40, 0.06), 0 1px 3px rgba(16, 24, 40, 0.08);
    max-width: 72rem;
    margin: 0 auto;
    padding: 0 var(--iam-space-4) var(--iam-space-5);
}

.iam-breadcrumbs[b-bqs1qfolug] {
    max-width: 72rem;
    margin: 0 auto;
    padding: 0.9rem 1.5rem 0;
    font-size: 0.85rem;
    color: var(--brand-text-muted, #5d7a7a);
}

.iam-breadcrumbs a[b-bqs1qfolug] {
    color: inherit;
    text-decoration: none;
}

.iam-breadcrumbs a:hover[b-bqs1qfolug] {
    text-decoration: underline;
}

.iam-breadcrumbs__sep[b-bqs1qfolug] {
    margin: 0 0.4rem;
}

.iam-breadcrumbs [aria-current="page"][b-bqs1qfolug] {
    color: var(--brand-text-main, #232323);
    font-weight: 600;
}

.iam-header[b-bqs1qfolug] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--iam-space-3);
    padding-top: var(--iam-space-4);
    margin-bottom: var(--iam-space-4);
}

.iam-header h1[b-bqs1qfolug] {
    margin: 0 0 0.35rem;
    font-size: 1.75rem;
}

.iam-header__subtitle[b-bqs1qfolug] {
    margin: 0;
    color: var(--brand-text-muted, #5d7a7a);
}

.iam-card[b-bqs1qfolug] {
    background: #fff;
    border: 1px solid var(--brand-border, #d8e8e8);
    border-radius: var(--iam-radius);
    box-shadow: var(--iam-shadow);
    padding: var(--iam-space-4);
    margin-bottom: var(--iam-space-4);
}

.iam-card h2[b-bqs1qfolug] {
    font-size: 1.15rem;
    margin: 0 0 0.25rem;
}

.iam-banner[b-bqs1qfolug] {
    border-radius: var(--iam-radius-sm);
    padding: var(--iam-space-3) var(--iam-space-4);
    margin-bottom: var(--iam-space-4);
}

.iam-banner strong[b-bqs1qfolug] {
    display: block;
    margin-bottom: 0.25rem;
}

.iam-banner p[b-bqs1qfolug] {
    margin: 0;
}

.iam-banner--error[b-bqs1qfolug] {
    background: #fff2f2;
    border: 1px solid #f3c9c9;
    color: #6d1e1e;
    max-width: 72rem;
    margin: var(--iam-space-4) auto;
}

.iam-table td[b-bqs1qfolug],
.iam-table th[b-bqs1qfolug] {
    padding: var(--iam-space-2) var(--iam-space-3);
}

.iam-table tbody tr:hover[b-bqs1qfolug] {
    background: var(--brand-accent-soft, #f4fafa);
}

.shop-product-row[b-bqs1qfolug] {
    display: flex;
    align-items: flex-start;
    gap: var(--iam-space-3);
    background: #fbfcfc;
    border: 1px solid var(--brand-border, #d8e8e8);
    border-radius: var(--iam-radius-sm);
    padding: var(--iam-space-3);
}

.shop-product-row__image[b-bqs1qfolug] {
    width: 4.5rem;
    height: 4.5rem;
    object-fit: cover;
    border-radius: var(--iam-radius-sm);
    border: 1px solid var(--brand-border, #d8e8e8);
    flex-shrink: 0;
}

.shop-session-card[b-bqs1qfolug] {
    background: #fbfcfc;
    border: 1px solid var(--brand-border, #d8e8e8);
    border-radius: var(--iam-radius-sm);
    padding: var(--iam-space-3);
    margin-bottom: var(--iam-space-3);
}

@media (max-width: 640px) {
    .iam-header[b-bqs1qfolug] {
        flex-direction: column;
    }

    .shop-product-row[b-bqs1qfolug] {
        flex-direction: column;
    }
}
/* _content/InuniSphere.Web/Components/Pages/Admin/Transportation.razor.rz.scp.css */
/* Same visual language as /admin (see Admin.razor.css's own design-tokens comment) - kept as
   a separate copy rather than a shared stylesheet because Blazor CSS isolation scopes rules
   to the component that declares them; a class used in Transportation.razor picks up nothing
   from Admin.razor.css. */
.iam-page[b-giclt5f8rx] {
    --iam-space-1: 0.5rem;
    --iam-space-2: 0.75rem;
    --iam-space-3: 1rem;
    --iam-space-4: 1.5rem;
    --iam-space-5: 2rem;
    --iam-radius: 0.75rem;
    --iam-radius-sm: 0.5rem;
    --iam-shadow: 0 1px 2px rgba(16, 24, 40, 0.06), 0 1px 3px rgba(16, 24, 40, 0.08);
    max-width: 72rem;
    margin: 0 auto;
    padding: 0 var(--iam-space-4) var(--iam-space-5);
}

.iam-breadcrumbs[b-giclt5f8rx] {
    max-width: 72rem;
    margin: 0 auto;
    padding: 0.9rem 1.5rem 0;
    font-size: 0.85rem;
    color: var(--brand-text-muted, #5d7a7a);
}

.iam-breadcrumbs a[b-giclt5f8rx] {
    color: inherit;
    text-decoration: none;
}

.iam-breadcrumbs a:hover[b-giclt5f8rx] {
    text-decoration: underline;
}

.iam-breadcrumbs__sep[b-giclt5f8rx] {
    margin: 0 0.4rem;
}

.iam-breadcrumbs [aria-current="page"][b-giclt5f8rx] {
    color: var(--brand-text-main, #232323);
    font-weight: 600;
}

.iam-breadcrumbs__link[b-giclt5f8rx] {
    appearance: none;
    background: none;
    border: none;
    padding: 0;
    color: inherit;
    cursor: pointer;
}

.iam-breadcrumbs__link:hover[b-giclt5f8rx] {
    text-decoration: underline;
}

/* Horizontal tabs splitting the page into sections, matching /iam's own tab strip. */
.iam-tabs[b-giclt5f8rx] {
    display: flex;
    gap: var(--iam-space-1);
    border-bottom: 1px solid var(--brand-border, #d8e8e8);
    margin-bottom: var(--iam-space-4);
}

.iam-tabs__item[b-giclt5f8rx] {
    appearance: none;
    background: none;
    border: none;
    border-bottom: 2px solid transparent;
    padding: 0.75rem 0.25rem;
    margin-right: var(--iam-space-4);
    font-weight: 600;
    color: var(--brand-text-muted, #5d7a7a);
    cursor: pointer;
}

.iam-tabs__item:hover[b-giclt5f8rx] {
    color: var(--brand-text-main, #232323);
}

.iam-tabs__item.is-active[b-giclt5f8rx] {
    color: var(--brand-primary, #185354);
    border-bottom-color: var(--brand-primary, #185354);
}

.iam-header[b-giclt5f8rx] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--iam-space-3);
    padding-top: var(--iam-space-4);
    margin-bottom: var(--iam-space-4);
}

.iam-header h1[b-giclt5f8rx] {
    margin: 0 0 0.35rem;
    font-size: 1.75rem;
}

.iam-header__subtitle[b-giclt5f8rx] {
    margin: 0;
    color: var(--brand-text-muted, #5d7a7a);
}

.iam-header__context[b-giclt5f8rx] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: center;
}

.iam-card[b-giclt5f8rx] {
    background: #fff;
    border: 1px solid var(--brand-border, #d8e8e8);
    border-radius: var(--iam-radius);
    box-shadow: var(--iam-shadow);
    padding: var(--iam-space-4);
    margin-bottom: var(--iam-space-4);
}

.iam-card h2[b-giclt5f8rx] {
    font-size: 1.15rem;
    margin: 0 0 0.25rem;
}

.iam-card__header[b-giclt5f8rx] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--iam-space-3);
    margin-bottom: var(--iam-space-4);
}

.iam-card__actions[b-giclt5f8rx] {
    display: flex;
    align-items: center;
    gap: var(--iam-space-2);
    flex-wrap: wrap;
}

.iam-banner[b-giclt5f8rx] {
    border-radius: var(--iam-radius-sm);
    padding: var(--iam-space-3) var(--iam-space-4);
    margin-bottom: var(--iam-space-4);
}

.iam-banner strong[b-giclt5f8rx] {
    display: block;
    margin-bottom: 0.25rem;
}

.iam-banner p[b-giclt5f8rx] {
    margin: 0;
}

.iam-banner--error[b-giclt5f8rx] {
    background: #fff2f2;
    border: 1px solid #f3c9c9;
    color: #6d1e1e;
    max-width: 72rem;
    margin: var(--iam-space-4) auto;
}

.iam-table td[b-giclt5f8rx],
.iam-table th[b-giclt5f8rx] {
    padding: var(--iam-space-2) var(--iam-space-3);
}

.iam-table tbody tr:hover[b-giclt5f8rx] {
    background: var(--brand-accent-soft, #f4fafa);
}

@media (max-width: 640px) {
    .iam-header[b-giclt5f8rx] {
        flex-direction: column;
    }

    .iam-card__header[b-giclt5f8rx] {
        flex-direction: column;
        align-items: stretch;
    }
}

.capacity-bar[b-giclt5f8rx] {
    width: 100%;
    height: 0.6rem;
    background: var(--brand-accent-soft, #eef6f6);
    border: 1px solid var(--brand-border, #d8e8e8);
    border-radius: var(--brand-radius, 0.6rem);
    overflow: hidden;
    margin-top: 0.25rem;
}

.capacity-bar__fill[b-giclt5f8rx] {
    height: 100%;
    background: var(--brand-primary, #185354);
    border-radius: var(--brand-radius, 0.6rem) 0 0 var(--brand-radius, 0.6rem);
}

.transport-staff-photo[b-giclt5f8rx] {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
}

/* Per-row "..." actions menu (native <details>/<summary>, same zero-JS pattern as
   InuniNav.razor.css's own .inuni-nav__user - see wwwroot/js/nav-dropdown.js for the
   outside-click-closes behavior, shared across both via the .actions-menu class) - collapses a
   row of 3-4 buttons that was wrapping onto multiple lines in a busy table down to one trigger. */
.actions-menu[b-giclt5f8rx] {
    position: relative;
}

.actions-menu[open][b-giclt5f8rx] {
    z-index: 5;
}

.actions-menu__trigger[b-giclt5f8rx] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.25rem;
    height: 2.25rem;
    border: 1px solid var(--brand-border, #d8e8e8);
    border-radius: var(--brand-radius, 0.6rem);
    background: #fff;
    cursor: pointer;
    list-style: none;
    user-select: none;
    font-size: 1.1rem;
    line-height: 1;
    color: var(--brand-text-muted, #5d7a7a);
}

.actions-menu__trigger[b-giclt5f8rx]::-webkit-details-marker {
    display: none;
}

.actions-menu__trigger:hover[b-giclt5f8rx] {
    background: var(--brand-accent-soft, #f4fafa);
    border-color: #c5dddd;
}

.actions-menu__list[b-giclt5f8rx] {
    position: absolute;
    top: calc(100% + 0.35rem);
    right: 0;
    min-width: 13rem;
    padding: 0.35rem;
    border: 1px solid var(--brand-border, #d8e8e8);
    border-radius: 0.75rem;
    background: #fff;
    box-shadow: 0 12px 28px rgba(19, 63, 64, 0.16);
}

.actions-menu__item[b-giclt5f8rx] {
    display: block;
    width: 100%;
    text-align: left;
    padding: 0.55rem 0.7rem;
    border-radius: 0.5rem;
    color: var(--brand-text-main, #232323);
    font-size: 0.88rem;
    font-weight: 500;
    background: none;
    border: none;
    cursor: pointer;
    white-space: nowrap;
}

.actions-menu__item:hover[b-giclt5f8rx] {
    background: var(--brand-accent-soft, #eef6f6);
}

.actions-menu__item--warning[b-giclt5f8rx] {
    color: #8a6100;
}

.actions-menu__item--warning:hover[b-giclt5f8rx] {
    background: #fff8e6;
}

.actions-menu__item--danger[b-giclt5f8rx] {
    color: #8d2c2c;
}

.actions-menu__item--danger:hover[b-giclt5f8rx] {
    background: #fff2f2;
    color: #6d1e1e;
}

/* Same .actions-menu <details>/<summary> mechanics as the "..." row actions above, but the
   trigger is a normal-looking button (a filter's own label/count) rather than the fixed-size "⋮"
   icon - suppresses the native disclosure marker the same way .actions-menu__trigger does, since
   its own rule only targets that specific class. */
.actions-menu summary.btn[b-giclt5f8rx]::-webkit-details-marker {
    display: none;
}
/* _content/InuniSphere.Web/Components/Pages/Commodity/SectionColorField.razor.rz.scp.css */
.section-color-field[b-gyop19dt9q] {
    display: flex;
    align-items: center;
    gap: .5rem;
    margin-bottom: .5rem;
}

.section-color-field__picker[b-gyop19dt9q] {
    flex: 0 0 auto;
    width: 2.5rem;
    height: 2.5rem;
    padding: 2px;
    border: 1px solid var(--brand-border, rgba(11, 38, 32, .16));
    border-radius: var(--brand-radius, 2px);
    background: none;
    cursor: pointer;
}

.section-color-field__text[b-gyop19dt9q] {
    flex: 1 1 auto;
    min-width: 0;
}

.section-color-field__reset[b-gyop19dt9q] {
    flex: 0 0 auto;
    border: none;
    background: none;
    color: var(--brand-text-muted, #565B58);
    cursor: pointer;
}
/* _content/InuniSphere.Web/Components/Pages/ComponentLibrary/ComponentLibrary.razor.rz.scp.css */
/* Same content-management admin header as ZarzadzajStrona.razor.css (this page is now one of
   its sub-pages) - duplicated rather than shared, since Blazor's own CSS isolation scopes each
   .razor.css file to its own component tree and a two-page bar doesn't warrant a new shared
   component just to avoid four repeated rules. */
.content-management-header[b-p0d4747mh6] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: .85rem 1.25rem;
    background: var(--brand-page-bg, #fff);
    border-bottom: 1px solid var(--brand-border, #d8e8e8);
    font-family: var(--brand-font-family, 'Inter', sans-serif);
}

.content-management-header__badge[b-p0d4747mh6] {
    font-family: var(--brand-font-serif, 'Libre Baskerville', Georgia, serif);
    color: var(--brand-text-main, #0B2620);
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.content-management-header__back[b-p0d4747mh6] {
    color: var(--brand-text-muted, #5d7a7a);
    font-size: .82rem;
    text-decoration: none;
}

.content-management-header__back:hover[b-p0d4747mh6] {
    color: var(--brand-accent, #0F6E56);
    text-decoration: underline;
}

/* ==========================================================================
   Component Library's own visual identity - a distinct "editorial admin tool"
   palette (forest/ink/shell), deliberately its own local token set rather than
   this app's shared --brand-* tokens, so it reads as the same product as the
   page-builder editor (Zarządzaj stroną's own mockup) without overriding those
   globals for the rest of the app. Scoped entirely under .complib-page - never
   declared on :root - so nothing here leaks past this one page. Newsreader/
   Public Sans/JetBrains Mono are loaded once, globally, alongside this app's
   existing Inter/Libre Baskerville pair (see App.razor) - only this page
   actually references them.
   ========================================================================== */
.complib-page[b-p0d4747mh6] {
    --cl-forest: #0B5844;
    --cl-forest-dim: #0A4938;
    --cl-ink: #0C1F1A;
    --cl-shell: #F6F8F7;
    --cl-mist: #EEF2F0;
    --cl-line: #D5DEDA;
    --cl-line-soft: #E6ECEA;
    --cl-muted: #4C5F59;
    --cl-faint: #7B8C87;
    --cl-gold: #8A6210;
    --cl-gold-soft: #F6EDDA;
    --cl-red: #8C2F22;
    --cl-red-soft: #F7E7E4;
    --cl-blue: #1E4C6B;
    --cl-blue-soft: #E4EDF3;
    --cl-serif: "Newsreader", Georgia, serif;
    --cl-sans: "Public Sans", -apple-system, "Segoe UI", Arial, sans-serif;
    --cl-mono: "JetBrains Mono", Consolas, monospace;

    width: 100%;
    margin: 0;
    padding: 1.75rem 1.5rem 3rem;
    background: var(--cl-shell);
    color: var(--cl-ink);
    font-family: var(--cl-sans);
    font-size: 14.5px;
    line-height: 1.55;
}

.complib-page h1[b-p0d4747mh6],
.complib-page h2[b-p0d4747mh6],
.complib-page h3[b-p0d4747mh6] {
    font-family: var(--cl-serif);
    font-weight: 400;
    letter-spacing: -.01em;
    text-wrap: balance;
}

/* Bootstrap's own checked/switch color is its default blue - swap it for this page's own forest
   accent so every checkbox/switch reads as part of this design, not a generic Bootstrap demo. */
.complib-page .form-check-input:checked[b-p0d4747mh6] {
    background-color: var(--cl-forest);
    border-color: var(--cl-forest);
}

.complib-page .form-check-input:focus[b-p0d4747mh6] {
    border-color: var(--cl-forest);
    box-shadow: 0 0 0 0.2rem color-mix(in srgb, var(--cl-forest) 20%, transparent);
}

.complib-page .text-muted[b-p0d4747mh6] {
    color: var(--cl-faint) !important;
}

/* Bootstrap's default .form-control/.form-select is themed here to the page's own quiet
   surface/line tokens rather than the ambient --brand-* ones - this page's controls should look
   like part of this editorial tool regardless of which event theme happens to be selected in
   the preview picker below (only the LIVE COMPONENT PREVIEW itself should visibly change when a
   theme is picked - the surrounding editor chrome stays constant, same reasoning ZarzadzajStrona
   never re-themes its own editor shell to match a page's content). */
.complib-page .form-control[b-p0d4747mh6],
.complib-page .form-select[b-p0d4747mh6] {
    background-color: #fff;
    border: 1px solid var(--cl-line);
    border-radius: 2px;
    color: var(--cl-ink);
    padding: .5rem .65rem;
}

.complib-page .form-control[b-p0d4747mh6]::placeholder {
    color: var(--cl-faint);
    opacity: .8;
}

.complib-page .form-control:focus[b-p0d4747mh6],
.complib-page .form-select:focus[b-p0d4747mh6] {
    background-color: #fff;
    border-color: var(--cl-forest);
    color: var(--cl-ink);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--cl-forest) 16%, transparent);
}

.complib-page .form-label[b-p0d4747mh6] {
    font-size: .82rem;
    font-weight: 600;
    color: var(--cl-muted);
}

.complib-header[b-p0d4747mh6] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 1.5rem;
    margin-bottom: 1.5rem;
}

.complib-header h1[b-p0d4747mh6] {
    font-size: 1.9rem;
    color: var(--cl-ink);
}

.complib-header p[b-p0d4747mh6] {
    font-size: .88rem;
    color: var(--cl-muted);
    max-width: 56ch;
}

.complib-theme-picker[b-p0d4747mh6] {
    flex: none;
    width: 17rem;
    display: flex;
    flex-direction: column;
    gap: .5rem;
}

@media (max-width: 640px) {
    .complib-theme-picker[b-p0d4747mh6] {
        width: 100%;
    }
}

.complib-shell[b-p0d4747mh6] {
    display: flex;
    align-items: flex-start;
    gap: 1.25rem;
}

/* Matches the page-builder mockup's own .side/.tree sidebar exactly - a sticky, bordered,
   scrollable component tree with uppercase section labels and a left-accent "current" state. */
.complib-nav[b-p0d4747mh6] {
    flex: none;
    width: 15rem;
    position: sticky;
    top: 1rem;
    max-height: calc(100vh - 2rem);
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: .1rem;
    background: #fff;
    border: 1px solid var(--cl-line);
    border-radius: 3px;
    padding: .5rem;
}

.complib-nav__item[b-p0d4747mh6] {
    border: none;
    background: none;
    text-align: left;
    padding: .5rem .65rem;
    border-radius: 2px;
    border-left: 3px solid transparent;
    font-family: var(--cl-sans);
    font-size: .88rem;
    font-weight: 400;
    color: var(--cl-ink);
    transition: background-color .12s ease, color .12s ease;
}

.complib-nav__item:hover[b-p0d4747mh6] {
    background: var(--cl-shell);
}

.complib-nav__item.is-active[b-p0d4747mh6] {
    background: var(--cl-mist);
    color: var(--cl-forest);
    border-left-color: var(--cl-forest);
    font-weight: 600;
}

.complib-nav__section-label[b-p0d4747mh6] {
    margin: .85rem .3rem .3rem;
    padding: 0 0 .3rem;
    font-size: .66rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .1em;
    color: var(--cl-faint);
    border-bottom: 1px solid var(--cl-line-soft);
}

.complib-nav__section-label:first-child[b-p0d4747mh6] {
    margin-top: 0;
}

.complib-nav__item--planned[b-p0d4747mh6] {
    font-style: italic;
    color: var(--cl-faint);
}

.complib-main[b-p0d4747mh6] {
    flex: 1;
    min-width: 0;
    background: #fff;
    border: 1px solid var(--cl-line);
    border-radius: 3px;
    padding: 1.5rem 1.5rem .5rem;
}

.complib-columns[b-p0d4747mh6] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr);
    gap: 1.75rem;
    align-items: start;
}

.complib-controls[b-p0d4747mh6],
.complib-preview[b-p0d4747mh6] {
    background: var(--cl-shell);
    border: 1px solid var(--cl-line-soft);
    border-radius: 3px;
    padding: 1.1rem 1.2rem;
}

.complib-controls h2[b-p0d4747mh6],
.complib-preview h2[b-p0d4747mh6] {
    font-size: .82rem;
    font-weight: 700;
    letter-spacing: .08em;
    color: var(--cl-faint) !important;
}

.complib-panel-actions[b-p0d4747mh6] {
    display: flex;
    gap: .5rem;
    margin-top: 1.25rem;
    padding-top: 1rem;
    border-top: 1px dashed var(--cl-line);
}

.complib-code-panel[b-p0d4747mh6] {
    margin-top: 1.5rem;
}

/* Matches the mockup's own .codepanel/.codehead/.codetab/pre.code exactly - a light chrome bar
   over a dark ink code surface, JetBrains Mono throughout. */
.complib-code-block[b-p0d4747mh6] {
    margin-top: .75rem;
    border: 1px solid var(--cl-line-soft);
    border-radius: 3px;
    overflow: hidden;
}

.complib-code-block__head[b-p0d4747mh6] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: .35rem;
    background: var(--cl-shell);
    border-bottom: 1px solid var(--cl-line-soft);
}

.complib-code-tabs[b-p0d4747mh6] {
    display: flex;
    gap: .1rem;
}

.complib-code-tab[b-p0d4747mh6] {
    border: none;
    background: none;
    color: var(--cl-faint);
    font-family: var(--cl-sans);
    font-size: .78rem;
    font-weight: 600;
    padding: .45rem .8rem;
    border-radius: 2px;
    cursor: pointer;
}

.complib-code-tab:hover[b-p0d4747mh6] {
    background: var(--cl-line-soft);
}

.complib-code-tab.is-active[b-p0d4747mh6] {
    background: #fff;
    color: var(--cl-ink);
}

.complib-code[b-p0d4747mh6] {
    margin: 0;
    padding: 1rem 1.15rem;
    overflow-x: auto;
    background: var(--cl-ink);
    font-family: var(--cl-mono);
    font-size: .8rem;
    line-height: 1.6;
    color: #D7E4DE;
}

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

    .complib-nav[b-p0d4747mh6] {
        width: 100%;
        flex-direction: row;
        flex-wrap: wrap;
        max-height: none;
        position: static;
    }

    .complib-columns[b-p0d4747mh6] {
        grid-template-columns: 1fr;
    }
}

/* Bootstrap's default .form-control/.form-select is a light control (white background, dark
   text) - fine under the general (light) theme, wrong once an event theme with a dark surface is
   picked. Same treatment ProfileWizard.razor.css's own .profile-wizard--themed already uses -
   gated the same way (a --themed modifier, not unconditional) so the default "Ogólny" preview
   isn't tinted grey by a color-mix against a white surface it was never meant to apply to. This
   ONLY affects the live component preview's own controls under .complib-preview - the editor's
   own chrome (.complib-controls, sidebar, etc.) keeps its constant forest/shell look regardless
   of which theme is being previewed, per this file's own top comment. */
.complib-page--themed .complib-preview .form-control[b-p0d4747mh6],
.complib-page--themed .complib-preview .form-select[b-p0d4747mh6] {
    background-color: color-mix(in srgb, var(--brand-surface, #fff) 80%, black);
    border-color: var(--brand-border, #cbd5e1);
    color: var(--brand-text-main, inherit);
}

.complib-page--themed .complib-preview .form-control[b-p0d4747mh6]::placeholder,
.complib-page--themed .complib-preview textarea[b-p0d4747mh6]::placeholder {
    color: var(--brand-text-muted, #6c757d);
    opacity: 0.7;
}

.complib-page--themed .complib-preview .form-control:focus[b-p0d4747mh6],
.complib-page--themed .complib-preview .form-select:focus[b-p0d4747mh6] {
    background-color: color-mix(in srgb, var(--brand-surface, #fff) 80%, black);
    border-color: var(--brand-accent, #2563eb);
    color: var(--brand-text-main, inherit);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand-accent, #2563eb) 20%, transparent);
}

/* Native <select> option lists render via OS chrome regardless of the rules above - forcing a
   light background/dark text here at least keeps the closed dropdown legible. */
.complib-page--themed .complib-preview .form-select option[b-p0d4747mh6] {
    background-color: #fff;
    color: #212529;
}
/* _content/InuniSphere.Web/Components/Pages/Contest/Contest.razor.rz.scp.css */
/* Base page chrome shared with every other themed page (RoomSelection/Documents/ProfileWizard) -
   kept as a separate copy since Blazor CSS isolation scopes rules to the component that
   declares them. These four rules stay UNscoped-as-usual (no ::deep) because .iam-page itself is
   Contest.razor's own directly-rendered wrapper - its custom properties below cascade to every
   descendant (including child components) through normal CSS inheritance regardless of scoping.
   Everything from the "Typography hierarchy" section on IS ::deep, because it's rendered by the
   new ContestCard/ContestTaskCard/ContestLeaderboardWidget/ContestFileDropzone child components,
   not by Contest.razor directly - Blazor CSS isolation only scopes a rule to elements the
   DECLARING component itself renders, not to a child component's own markup, so without ::deep
   none of this would apply to a single card on the page. Fallback color values intentionally use
   the palette specified for this redesign (close to, but not identical to, boost.json's real
   values) - real BOOST events still render boost.json's own colors via ThemedHead's --brand-*
   overrides; these fallbacks only kick in if theme resolution ever fails. */
.iam-page[b-xe89fwhgep] {
    --iam-space-3: 1rem;
    --iam-space-4: 1.5rem;
    --iam-space-5: 2rem;
    --iam-radius: 0.75rem;
    --contest-success: #22c55e;
    --contest-warning: #f59e0b;
    --contest-danger: #ef4444;
    --contest-info: #3b82f6;
    max-width: 76rem;
    margin: 0 auto;
    padding: 0 var(--iam-space-4) var(--iam-space-5);
}

.iam-breadcrumbs[b-xe89fwhgep] {
    max-width: 76rem;
    margin: 0 auto;
    padding: 0.9rem 1.5rem 0;
    font-size: 0.85rem;
    color: var(--brand-text-muted, #c7bfe0);
}

.iam-breadcrumbs a[b-xe89fwhgep] {
    color: inherit;
    text-decoration: none;
}

.iam-breadcrumbs a:hover[b-xe89fwhgep] {
    text-decoration: underline;
}

.iam-breadcrumbs__sep[b-xe89fwhgep] {
    margin: 0 0.4rem;
}

.iam-breadcrumbs [aria-current="page"][b-xe89fwhgep] {
    color: var(--brand-text-main, #fff);
    font-weight: 600;
}

.iam-banner[b-xe89fwhgep] {
    border-radius: 0.5rem;
    padding: var(--iam-space-3) var(--iam-space-4);
    margin-bottom: var(--iam-space-4);
}

.iam-banner strong[b-xe89fwhgep] {
    display: block;
    margin-bottom: 0.25rem;
}

.iam-banner--error[b-xe89fwhgep] {
    background: rgba(239, 68, 68, 0.12);
    border: 1px solid rgba(239, 68, 68, 0.35);
    color: #fca5a5;
    max-width: 76rem;
    margin: var(--iam-space-4) auto;
}

.room-selection--themed[b-xe89fwhgep] {
    background: var(--brand-page-bg, #0a0714);
    color: var(--brand-text-main, #ffffff);
}

/* ============ Typography hierarchy ============ */

[b-xe89fwhgep] .contest-page-title {
    font-size: 36px;
    font-weight: 700;
    margin: var(--iam-space-4) 0 0.25rem;
}

[b-xe89fwhgep] .contest-title {
    font-size: 24px;
    font-weight: 700;
    margin: 0 0 0.2rem;
}

[b-xe89fwhgep] .contest-task-title {
    font-size: 18px;
    font-weight: 600;
    margin: 0;
}

[b-xe89fwhgep] .contest-meta {
    font-size: 14px;
    font-weight: 500;
    color: var(--brand-text-main, #ffffff);
}

[b-xe89fwhgep] .contest-secondary {
    font-size: 13px;
    color: var(--brand-text-muted, #c7bfe0);
    margin: 0 0 0.5rem;
}

[b-xe89fwhgep] .contest-page-header {
    margin-bottom: var(--iam-space-4);
}

/* ============ Top summary stat widgets ============ */

[b-xe89fwhgep] .contest-stat-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(9.5rem, 1fr));
    gap: var(--iam-space-3);
    margin-bottom: var(--iam-space-4);
}

[b-xe89fwhgep] .contest-stat {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    padding: var(--iam-space-3) var(--iam-space-4);
    border: 1px solid var(--brand-border, #2a1f47);
    border-radius: var(--iam-radius);
    background: var(--brand-surface, #131021);
}

[b-xe89fwhgep] .contest-stat__value {
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 1.1;
    color: var(--brand-primary, #d05cff);
}

[b-xe89fwhgep] .contest-stat__label {
    font-size: 13px;
    color: var(--brand-text-muted, #c7bfe0);
}

/* ============ Contest card ============ */

[b-xe89fwhgep] .contest-card {
    position: relative;
    border: 1px solid color-mix(in srgb, var(--brand-border, #2a1f47) 70%, transparent);
    border-radius: 1.1rem;
    background: linear-gradient(160deg, color-mix(in srgb, var(--brand-surface, #131021) 85%, white 8%), var(--brand-surface, #131021));
    backdrop-filter: blur(6px);
    padding: 2rem;
    margin-bottom: 1.75rem;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2), 0 8px 24px rgba(0, 0, 0, 0.18);
    transition: border-color 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
}

[b-xe89fwhgep] .contest-card:hover {
    border-color: color-mix(in srgb, var(--brand-primary, #d05cff) 45%, var(--brand-border, #2a1f47));
    transform: translateY(-2px);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.24), 0 16px 32px rgba(0, 0, 0, 0.24);
}

[b-xe89fwhgep] .contest-card__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--iam-space-3);
    flex-wrap: wrap;
}

[b-xe89fwhgep] .contest-card__window {
    margin: 0.9rem 0 0.6rem;
    padding: 0.75rem 1rem;
    border-radius: 0.6rem;
    background: color-mix(in srgb, var(--brand-surface, #131021) 40%, black 12%);
    border: 1px solid color-mix(in srgb, var(--brand-border, #2a1f47) 60%, transparent);
}

[b-xe89fwhgep] .contest-card__window-label {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--brand-text-muted, #c7bfe0);
    margin-bottom: 0.25rem;
}

[b-xe89fwhgep] .contest-card__meta {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    flex-wrap: wrap;
    margin: 0 0 var(--iam-space-4);
}

[b-xe89fwhgep] .contest-card__columns {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(15rem, 1fr);
    gap: 2rem;
    align-items: start;
}

[b-xe89fwhgep] .contest-card__tasks {
    display: flex;
    flex-direction: column;
    gap: 1.1rem;
}

[b-xe89fwhgep] .contest-card__sidebar {
    display: flex;
    flex-direction: column;
    gap: var(--iam-space-3);
}

[b-xe89fwhgep] .contest-card__leaderboard {
    border: 1px solid var(--brand-border, #2a1f47);
    border-radius: var(--iam-radius);
    padding: var(--iam-space-3);
    background: color-mix(in srgb, var(--brand-surface, #131021) 60%, black 8%);
}

[b-xe89fwhgep] .contest-leaderboard__title {
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 0.5rem;
}

@media (max-width: 900px) {
    [b-xe89fwhgep] .contest-card__columns {
        grid-template-columns: 1fr;
    }
}

/* ============ Status badge ============ */

[b-xe89fwhgep] .contest-status-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.3rem 0.75rem;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.02em;
    white-space: nowrap;
}

[b-xe89fwhgep] .contest-status-badge--open {
    background: rgba(34, 197, 94, 0.15);
    color: var(--contest-success);
    border: 1px solid rgba(34, 197, 94, 0.4);
}

[b-xe89fwhgep] .contest-status-badge--closed {
    background: rgba(239, 68, 68, 0.15);
    color: var(--contest-danger);
    border: 1px solid rgba(239, 68, 68, 0.4);
}

[b-xe89fwhgep] .contest-status-badge--awaiting {
    background: rgba(245, 158, 11, 0.15);
    color: var(--contest-warning);
    border: 1px solid rgba(245, 158, 11, 0.4);
}

[b-xe89fwhgep] .contest-status-badge--graded {
    background: rgba(34, 197, 94, 0.15);
    color: var(--contest-success);
    border: 1px solid rgba(34, 197, 94, 0.4);
}

[b-xe89fwhgep] .contest-status-badge--not-started {
    background: rgba(255, 255, 255, 0.06);
    color: var(--brand-text-muted, #c7bfe0);
    border: 1px solid var(--brand-border, #2a1f47);
}

/* ============ Chips ============ */

[b-xe89fwhgep] .contest-chip {
    display: inline-flex;
    align-items: center;
    padding: 0.2rem 0.6rem;
    border-radius: 0.4rem;
    font-size: 13px;
    background: color-mix(in srgb, var(--brand-surface, #131021) 40%, black 10%);
    border: 1px solid var(--brand-border, #2a1f47);
    color: var(--brand-text-main, #ffffff);
}

[b-xe89fwhgep] .contest-chip--accent {
    border-color: color-mix(in srgb, var(--brand-primary, #d05cff) 50%, transparent);
    color: var(--brand-primary, #d05cff);
}

[b-xe89fwhgep] .contest-action-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.5rem 0.9rem;
    border-radius: 0.5rem;
    border: 1px solid color-mix(in srgb, var(--brand-primary, #d05cff) 35%, var(--brand-border, #2a1f47));
    background: color-mix(in srgb, var(--brand-primary, #d05cff) 10%, transparent);
    color: var(--brand-text-main, #ffffff);
    text-decoration: none;
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 0.5rem;
    transition: border-color 0.15s ease, background 0.15s ease;
}

[b-xe89fwhgep] .contest-action-btn:hover {
    border-color: var(--brand-primary, #d05cff);
    background: color-mix(in srgb, var(--brand-primary, #d05cff) 20%, transparent);
    color: var(--brand-primary, #d05cff);
}

/* ============ Status box (attempts-exhausted/closed-for-submission notices) ============ */

[b-xe89fwhgep] .contest-status-box {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.65rem 0.9rem;
    border-radius: 0.5rem;
    font-size: 14px;
    font-weight: 500;
}

[b-xe89fwhgep] .contest-status-box--info {
    background: rgba(59, 130, 246, 0.1);
    border: 1px solid rgba(59, 130, 246, 0.3);
    color: var(--brand-text-main, #ffffff);
}

[b-xe89fwhgep] .contest-status-box--warning {
    background: rgba(245, 158, 11, 0.1);
    border: 1px solid rgba(245, 158, 11, 0.3);
    color: var(--brand-text-main, #ffffff);
}

/* ============ Task card ============ */

[b-xe89fwhgep] .contest-task-card {
    border: 1px solid color-mix(in srgb, var(--brand-border, #2a1f47) 70%, transparent);
    border-radius: 0.75rem;
    padding: 1.25rem;
    background: color-mix(in srgb, var(--brand-surface, #131021) 55%, white 4%);
}

[b-xe89fwhgep] .contest-task-card__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    margin-bottom: 0.6rem;
}

[b-xe89fwhgep] .contest-task-card__pills {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
    margin: 0.6rem 0;
}

[b-xe89fwhgep] .contest-task-card__submitted-at {
    margin: 0;
}

/* ============ Generic badge (submission/evaluation pills) ============ */

[b-xe89fwhgep] .contest-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.2rem 0.6rem;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 600;
    white-space: nowrap;
}

[b-xe89fwhgep] .contest-badge--success {
    background: rgba(34, 197, 94, 0.15);
    color: var(--contest-success);
}

[b-xe89fwhgep] .contest-badge--warning {
    background: rgba(245, 158, 11, 0.15);
    color: var(--contest-warning);
}

[b-xe89fwhgep] .contest-badge--danger {
    background: rgba(239, 68, 68, 0.15);
    color: var(--contest-danger);
}

[b-xe89fwhgep] .contest-badge--info {
    background: rgba(59, 130, 246, 0.15);
    color: var(--contest-info);
}

[b-xe89fwhgep] .contest-badge--neutral {
    background: rgba(255, 255, 255, 0.06);
    color: var(--brand-text-muted, #c7bfe0);
}

/* ============ Result block ============ */

[b-xe89fwhgep] .contest-result {
    border: 1px solid var(--brand-border, #2a1f47);
    border-radius: 0.65rem;
    padding: var(--iam-space-3);
    background: color-mix(in srgb, var(--brand-primary, #d05cff) 8%, var(--brand-surface, #131021));
    margin: 0.5rem 0;
}

[b-xe89fwhgep] .contest-result__label {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.06em;
    color: var(--brand-text-muted, #c7bfe0);
    margin-bottom: 0.2rem;
}

[b-xe89fwhgep] .contest-result__score {
    font-size: 1.4rem;
    font-weight: 700;
    color: var(--brand-text-main, #ffffff);
}

[b-xe89fwhgep] .contest-result__pct {
    font-size: 14px;
    font-weight: 600;
    color: var(--contest-success);
}

[b-xe89fwhgep] .contest-result__rank {
    font-size: 13px;
    color: var(--brand-text-muted, #c7bfe0);
    margin-top: 0.2rem;
}

[b-xe89fwhgep] .contest-result__comment {
    margin-top: 0.4rem;
    margin-bottom: 0;
}

/* ============ Drag-and-drop dropzone ============ */

[b-xe89fwhgep] .contest-dropzone {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    border: 1.5px dashed var(--brand-border, #2a1f47);
    border-radius: 0.65rem;
    padding: var(--iam-space-3);
    cursor: pointer;
    background: color-mix(in srgb, var(--brand-surface, #131021) 50%, black 6%);
    transition: border-color 0.15s ease, background 0.15s ease;
}

[b-xe89fwhgep] .contest-dropzone:hover,
[b-xe89fwhgep] .contest-dropzone--dragover {
    border-color: var(--brand-primary, #d05cff);
    background: color-mix(in srgb, var(--brand-primary, #d05cff) 10%, var(--brand-surface, #131021));
}

[b-xe89fwhgep] .contest-dropzone--disabled {
    opacity: 0.6;
    cursor: not-allowed;
    pointer-events: none;
}

[b-xe89fwhgep] .contest-dropzone__input {
    position: absolute;
    inset: 0;
    opacity: 0;
    cursor: pointer;
}

[b-xe89fwhgep] .contest-dropzone__content {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

[b-xe89fwhgep] .contest-dropzone__icon {
    font-size: 1.8rem;
    line-height: 1;
}

/* Camera-scan-to-PDF (ContestTaskCard.razor's own "Skanuj (aparat)" mode) - same rules as
   Admin.razor.css's own copy for its "submit on behalf" flow, kept separate for the same
   Blazor-CSS-isolation reason documented at the top of this file. The <video>/thumbnails
   elements themselves are plain empty containers wwwroot/js/contest-scan.js owns directly. */
[b-xe89fwhgep] .contest-scan__video {
    width: 100%;
    max-width: 28rem;
    border-radius: var(--brand-radius, 0.6rem);
    background: #000;
}

[b-xe89fwhgep] .contest-scan__thumbnails {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
    margin-top: 0.75rem;
}

[b-xe89fwhgep] .contest-scan__thumb {
    width: 4.5rem;
    height: 4.5rem;
    object-fit: cover;
    border-radius: var(--brand-radius, 0.6rem);
    border: 1px solid var(--brand-border, #2a1f47);
}

/* ============ Submission history timeline ============ */

[b-xe89fwhgep] .contest-timeline {
    margin-top: 0.75rem;
    border-top: 1px solid var(--brand-border, #2a1f47);
    padding-top: 0.6rem;
}

[b-xe89fwhgep] .contest-timeline__title {
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 0.4rem;
}

[b-xe89fwhgep] .contest-timeline__item {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    flex-wrap: wrap;
    font-size: 14px;
    padding: 0.3rem 0;
    border-bottom: 1px solid color-mix(in srgb, var(--brand-border, #2a1f47) 60%, transparent);
}

[b-xe89fwhgep] .contest-timeline__item:last-child {
    border-bottom: none;
}

[b-xe89fwhgep] .contest-timeline__item a {
    color: var(--brand-primary, #d05cff);
    text-decoration: none;
}

[b-xe89fwhgep] .contest-timeline__item a:hover {
    text-decoration: underline;
}

/* ============ Leaderboard widget ============ */

[b-xe89fwhgep] .contest-leaderboard__empty {
    margin: 0;
}

[b-xe89fwhgep] .contest-leaderboard__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}

[b-xe89fwhgep] .contest-leaderboard__row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.5rem;
    border-radius: 0.4rem;
    font-size: 14px;
}

[b-xe89fwhgep] .contest-leaderboard__row--me {
    background: color-mix(in srgb, var(--brand-primary, #d05cff) 14%, transparent);
    font-weight: 600;
}

[b-xe89fwhgep] .contest-leaderboard__rank {
    color: var(--brand-primary, #d05cff);
    font-weight: 700;
    min-width: 2.2rem;
}

[b-xe89fwhgep] .contest-leaderboard__name {
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

[b-xe89fwhgep] .contest-leaderboard__score {
    color: var(--brand-text-muted, #c7bfe0);
    font-size: 13px;
}

[b-xe89fwhgep] .contest-leaderboard__me-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: 0.5rem;
    padding-top: 0.5rem;
    border-top: 1px solid var(--brand-border, #2a1f47);
}

[b-xe89fwhgep] .contest-leaderboard__view-all {
    appearance: none;
    background: none;
    border: none;
    color: var(--brand-primary, #d05cff);
    font-size: 13px;
    font-weight: 600;
    padding: 0.5rem 0 0;
    cursor: pointer;
    text-align: left;
}

[b-xe89fwhgep] .contest-leaderboard__view-all:hover {
    text-decoration: underline;
}

@media (max-width: 640px) {
    [b-xe89fwhgep] .contest-card__header {
        flex-direction: column;
    }
}

/* ============ Participant feedback modal (read-only PdfAnnotationViewer + ReviewSidebar) ============
   Same component classes ContestReviewWorkspace.razor.css defines for the grader workspace, but
   this is a SEPARATE page's component tree (Blazor CSS isolation only scopes to the declaring
   page), so they need their own copy here - adapted to this page's dark theme instead of Admin's
   light one, since the --brand-* variables resolve to whichever real values ThemedHead injected
   on THIS page regardless of the fallback literals below. */

[b-xe89fwhgep] .contest-feedback-modal {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(16rem, 1fr);
    gap: 1rem;
    height: 70vh;
}

[b-xe89fwhgep] .contest-feedback-modal__viewer,
[b-xe89fwhgep] .contest-feedback-modal__sidebar {
    height: 100%;
    min-height: 0;
    border: 1px solid var(--brand-border, #2a1f47);
    border-radius: 0.65rem;
    overflow: hidden;
}

@media (max-width: 900px) {
    [b-xe89fwhgep] .contest-feedback-modal {
        grid-template-columns: 1fr;
        height: auto;
    }

    [b-xe89fwhgep] .contest-feedback-modal__viewer {
        height: 50vh;
    }
}

[b-xe89fwhgep] .pdf-viewer {
    display: flex;
    flex-direction: column;
    height: 100%;
}

[b-xe89fwhgep] .pdf-viewer__toolbar {
    display: none;
}

[b-xe89fwhgep] .pdf-viewer__viewport {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
    background: #1a1625;
    position: relative;
}

[b-xe89fwhgep] .pdf-viewer__stack {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
    padding: 1rem;
    transform-origin: 0 0;
    width: max-content;
}

[b-xe89fwhgep] .pdf-page {
    position: relative;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.5);
    background: #fff;
}

[b-xe89fwhgep] .pdf-page canvas {
    position: absolute;
    top: 0;
    left: 0;
}

[b-xe89fwhgep] .pdf-page__marks-canvas {
    pointer-events: none;
}

[b-xe89fwhgep] .pdf-page__pins {
    position: absolute;
    inset: 0;
}

[b-xe89fwhgep] .pdf-pin {
    position: absolute;
    transform: translate(-50%, -100%);
    appearance: none;
    border: 2px solid #fff;
    border-radius: 999px;
    width: 1.75rem;
    height: 1.75rem;
    color: #fff;
    font-size: 0.85rem;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
}

[b-xe89fwhgep] .pdf-pin--pulse {
    animation: contest-pdf-pin-pulse-b-xe89fwhgep 0.5s ease-in-out 2;
}

@keyframes contest-pdf-pin-pulse-b-xe89fwhgep {
    0%, 100% { transform: translate(-50%, -100%) scale(1); }
    50% { transform: translate(-50%, -100%) scale(1.4); }
}

[b-xe89fwhgep] .review-sidebar {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    height: 100%;
    overflow-y: auto;
    padding: 1rem;
    background: var(--brand-surface, #131021);
    color: var(--brand-text-main, #ffffff);
}

[b-xe89fwhgep] .review-sidebar__header {
    padding-bottom: 0.75rem;
    border-bottom: 1px solid var(--brand-border, #2a1f47);
}

[b-xe89fwhgep] .review-sidebar__summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 1rem;
    border-radius: 0.5rem;
    background: color-mix(in srgb, var(--brand-primary, #d05cff) 10%, transparent);
}

[b-xe89fwhgep] .review-sidebar__summary-score {
    font-size: 1.5rem;
    font-weight: 700;
}

[b-xe89fwhgep] .review-sidebar__summary-counts {
    display: flex;
    gap: 0.6rem;
    font-size: 0.85rem;
}

[b-xe89fwhgep] .review-sidebar__count--error { color: var(--contest-danger); }
[b-xe89fwhgep] .review-sidebar__count--suggestion { color: var(--contest-info); }
[b-xe89fwhgep] .review-sidebar__count--positive { color: var(--contest-success); }

[b-xe89fwhgep] .review-sidebar__section {
    border-top: 1px solid var(--brand-border, #2a1f47);
    padding-top: 0.75rem;
}

[b-xe89fwhgep] .review-sidebar__section-title {
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--brand-text-muted, #c7bfe0);
    margin: 0 0 0.5rem;
}

[b-xe89fwhgep] .review-sidebar__criterion {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
}

[b-xe89fwhgep] .review-sidebar__criterion-score {
    font-weight: 600;
}

[b-xe89fwhgep] .review-sidebar__comment-list {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

[b-xe89fwhgep] .review-sidebar__comment {
    border-radius: 0.5rem;
    padding: 0.6rem 0.75rem;
    border-left: 4px solid #888;
    background: color-mix(in srgb, var(--brand-surface, #131021) 60%, black 10%);
}

[b-xe89fwhgep] .review-sidebar__comment--error { border-left-color: var(--contest-danger); }
[b-xe89fwhgep] .review-sidebar__comment--issue { border-left-color: var(--contest-warning); }
[b-xe89fwhgep] .review-sidebar__comment--suggestion { border-left-color: var(--contest-info); }
[b-xe89fwhgep] .review-sidebar__comment--positive { border-left-color: var(--contest-success); }

[b-xe89fwhgep] .review-sidebar__comment-header {
    display: flex;
    justify-content: space-between;
    font-size: 0.8rem;
    font-weight: 700;
}

[b-xe89fwhgep] .review-sidebar__comment-text {
    margin: 0.35rem 0;
    font-size: 0.9rem;
}
/* _content/InuniSphere.Web/Components/Pages/Documents/Documents.razor.rz.scp.css */
/* Same visual language as /admin (see Admin.razor.css's own design-tokens comment) - kept as
   a separate copy rather than a shared stylesheet because Blazor CSS isolation scopes rules
   to the component that declares them; a class used in Documents.razor picks up nothing from
   ProfileWizard.razor.css even though this page reuses several of its class names. */
.iam-page[b-7tdmru89wv] {
    --iam-space-3: 1rem;
    --iam-space-4: 1.5rem;
    --iam-space-5: 2rem;
    --iam-radius: 0.75rem;
    --iam-shadow: 0 1px 2px rgba(16, 24, 40, 0.06), 0 1px 3px rgba(16, 24, 40, 0.08);
    max-width: 72rem;
    margin: 0 auto;
    padding: 0 var(--iam-space-4) var(--iam-space-5);
}

.iam-breadcrumbs[b-7tdmru89wv] {
    max-width: 72rem;
    margin: 0 auto;
    padding: 0.9rem 1.5rem 0;
    font-size: 0.85rem;
    color: var(--brand-text-muted, #5d7a7a);
}

.iam-breadcrumbs a[b-7tdmru89wv] {
    color: inherit;
    text-decoration: none;
}

.iam-breadcrumbs a:hover[b-7tdmru89wv] {
    text-decoration: underline;
}

.iam-breadcrumbs__sep[b-7tdmru89wv] {
    margin: 0 0.4rem;
}

.iam-breadcrumbs [aria-current="page"][b-7tdmru89wv] {
    color: var(--brand-text-main, #232323);
    font-weight: 600;
}

.iam-header[b-7tdmru89wv] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--iam-space-3);
    padding-top: var(--iam-space-4);
    margin-bottom: var(--iam-space-4);
}

.iam-header h1[b-7tdmru89wv] {
    margin: 0 0 0.35rem;
    font-size: 1.75rem;
}

.iam-header__subtitle[b-7tdmru89wv] {
    margin: 0;
    color: var(--brand-text-muted, #5d7a7a);
}

.iam-card[b-7tdmru89wv] {
    background: #fff;
    border: 1px solid var(--brand-border, #d8e8e8);
    border-radius: var(--iam-radius);
    box-shadow: var(--iam-shadow);
    padding: var(--iam-space-4);
    margin-bottom: var(--iam-space-4);
}

.iam-card h2[b-7tdmru89wv] {
    font-size: 1.15rem;
    margin: 0 0 0.25rem;
}

.iam-card__header[b-7tdmru89wv] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--iam-space-3);
    margin-bottom: var(--iam-space-4);
}

.iam-banner[b-7tdmru89wv] {
    border-radius: 0.5rem;
    padding: var(--iam-space-3) var(--iam-space-4);
    margin-bottom: var(--iam-space-4);
}

.iam-banner strong[b-7tdmru89wv] {
    display: block;
    margin-bottom: 0.25rem;
}

.iam-banner--error[b-7tdmru89wv] {
    background: #fff2f2;
    border: 1px solid #f3c9c9;
    color: #6d1e1e;
    max-width: 72rem;
    margin: var(--iam-space-4) auto;
}

/* Staff feedback on a submission isn't an error - neutral/informational styling that still
   follows the theme (unlike --error's fixed light-mode colors above). */
.iam-banner--info[b-7tdmru89wv] {
    background: var(--brand-accent-soft, #eef6f6);
    border: 1px solid var(--brand-border, #d8e8e8);
    color: var(--brand-text-main, inherit);
}

@media (max-width: 640px) {
    .iam-header[b-7tdmru89wv] {
        flex-direction: column;
    }

    .iam-card__header[b-7tdmru89wv] {
        flex-direction: column;
        align-items: stretch;
    }
}

/* Same theming approach as ProfileWizard.razor.css's own .profile-wizard--themed - .iam-card/
   .iam-breadcrumbs/.iam-header above already reference --brand-* custom properties with
   light-theme fallbacks, so ThemedHead alone re-colors accents/borders automatically once this
   class is present; only the page/card backgrounds and body text need an explicit override. */
.profile-wizard--themed[b-7tdmru89wv] {
    background: var(--brand-page-bg, transparent);
    color: var(--brand-text-main, inherit);
}

.profile-wizard--themed .iam-header__subtitle[b-7tdmru89wv] {
    color: var(--brand-text-muted, #5d7a7a);
}

.profile-wizard--themed .iam-card[b-7tdmru89wv] {
    background: var(--brand-surface, #fff);
    border-color: var(--brand-border, #d8e8e8);
}

/* Bootstrap's default .form-control is a light control (white background, dark text) - wrong
   on BOOST's dark surface. Same treatment ProfileWizard.razor.css/Welcome.razor's own
   .welcome-form already use. Also covers the file input's own "Choose file" pseudo-button,
   which otherwise keeps its default light OS/browser styling regardless of the input's own
   background. */
.profile-wizard--themed .form-control[b-7tdmru89wv] {
    background-color: color-mix(in srgb, var(--brand-surface) 80%, black);
    border-color: var(--brand-border, #cbd5e1);
    color: var(--brand-text-main, inherit);
}

.profile-wizard--themed .form-control[b-7tdmru89wv]::file-selector-button {
    margin-inline-end: 0.75rem;
    padding: 0.35rem 0.75rem;
    border-radius: 0.4rem;
    border: 1px solid var(--brand-border, #cbd5e1);
    background: var(--brand-accent, #2563eb);
    color: var(--brand-primary-contrast, #fff);
}

.profile-wizard--themed .form-control[b-7tdmru89wv]::file-selector-button:hover {
    background: var(--brand-accent-strong, #1d4ed8);
}

/* Bootstrap's .text-muted is a fixed grey tuned for a light card - on Boost's dark
   --brand-surface card that grey is nearly invisible, so it needs to follow the theme's own
   muted color instead. */
.profile-wizard--themed .text-muted[b-7tdmru89wv] {
    color: var(--brand-text-muted, #6c757d) !important;
}

/* ---- Dokumenty page furniture (the table itself now comes from the shared app-table.css -
   see wwwroot/css/app-table.css - this page just needs a couple of its own colors for the
   non-table bits below, sourced from the same --brand-* variables). ------------------------ */

.docs-page[b-7tdmru89wv] {
    --docs-text-muted: var(--brand-text-muted, #5d7a7a);
}

.docs-expand[b-7tdmru89wv] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    flex-wrap: wrap;
}

.docs-note[b-7tdmru89wv] {
    margin-top: 0.35rem;
    font-size: 0.8rem;
    color: var(--docs-text-muted);
}

.docs-muted[b-7tdmru89wv] {
    color: var(--docs-text-muted);
    font-size: 0.85rem;
}

.docs-help[b-7tdmru89wv] {
    margin-top: var(--iam-space-4);
}

.docs-help__banner[b-7tdmru89wv] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--iam-space-3);
}

@media (max-width: 720px) {
    /* A row merged (rowspan) into a prior one on desktop has no Dokument/Opis/Dostępność cell
       of its own at all - it's genuinely absent from this row's DOM, not just hidden - so on
       mobile it stacks as its own compact card missing those fields. Label it instead of
       leaving it looking broken. Page-specific (depends on Documents.razor's own column
       labels), so it stays here rather than in the generic app-table.css. */
    .app-table tbody tr:not(.app-table__expand-row):not(:has(td[data-label="Dokument"]))[b-7tdmru89wv] {
        margin-top: -0.5rem;
        margin-left: 1rem;
        width: calc(100% - 1rem);
    }

    .app-table tbody tr:not(.app-table__expand-row):not(:has(td[data-label="Dokument"]))[b-7tdmru89wv]::before {
        content: "Kolejny plik";
        display: block;
        font-size: 0.68rem;
        text-transform: uppercase;
        letter-spacing: 0.05em;
        color: var(--docs-text-muted);
        margin-bottom: 0.4rem;
    }
}
/* _content/InuniSphere.Web/Components/Pages/Finance/Finance.razor.rz.scp.css */
.finance-page[b-wsvmq2iuf1] {
    max-width: 1440px;
    margin: 0 auto;
    padding: 0 1.25rem 3rem;
}

.finance-shell[b-wsvmq2iuf1] {
    display: flex;
    align-items: flex-start;
    gap: 1.5rem;
}

.finance-sidenav[b-wsvmq2iuf1] {
    flex: none;
    width: 13rem;
    position: sticky;
    top: 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    background: #fff;
    border: 1px solid #d8e8e8;
    border-radius: 0.75rem;
    padding: 0.6rem;
}

.finance-sidenav__item[b-wsvmq2iuf1] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    border: none;
    background: none;
    text-align: left;
    padding: 0.55rem 0.7rem;
    border-radius: 0.5rem;
    font-size: 0.9rem;
    color: #3b3b3b;
    font-weight: 500;
}

.finance-sidenav__item span[b-wsvmq2iuf1] {
    font-size: 1rem;
}

.finance-sidenav__item:hover[b-wsvmq2iuf1] {
    background: #f2f7f7;
}

.finance-sidenav__item.is-active[b-wsvmq2iuf1] {
    background: #185354;
    color: #fff;
}

.finance-main[b-wsvmq2iuf1] {
    flex: 1;
    min-width: 0;
}

.finance-grid-2col[b-wsvmq2iuf1] {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
    gap: 1.25rem;
    align-items: start;
}

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

    .finance-sidenav[b-wsvmq2iuf1] {
        width: 100%;
        flex-direction: row;
        overflow-x: auto;
        position: static;
    }

    .finance-grid-2col[b-wsvmq2iuf1] {
        grid-template-columns: 1fr;
    }
}

.finance-header[b-wsvmq2iuf1] {
    margin: 1rem 0 1.5rem;
}

.finance-header h1[b-wsvmq2iuf1] {
    margin-bottom: 0.25rem;
}

.finance-header__subtitle[b-wsvmq2iuf1] {
    color: #5d7a7a;
    margin: 0;
}

.finance-tabs[b-wsvmq2iuf1] {
    margin-bottom: 1.5rem;
}

.finance-card[b-wsvmq2iuf1] {
    background: #fff;
    border: 1px solid #d8e8e8;
    border-radius: 0.75rem;
    padding: 1.25rem 1.5rem;
    margin-bottom: 1.25rem;
}

.finance-card h2[b-wsvmq2iuf1] {
    font-size: 1.1rem;
    margin-bottom: 1rem;
}

.finance-form-grid[b-wsvmq2iuf1] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
    gap: 0.9rem;
}

.finance-field label[b-wsvmq2iuf1] {
    font-size: 0.85rem;
}

.finance-form-actions[b-wsvmq2iuf1] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-top: 1rem;
}

.finance-saved-note[b-wsvmq2iuf1] {
    color: #185354;
    font-size: 0.85rem;
}

.finance-iban[b-wsvmq2iuf1] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 1rem;
}

.finance-table[b-wsvmq2iuf1] {
    margin-bottom: 0;
}

.finance-custom-doc[b-wsvmq2iuf1] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.35rem 0;
}

.finance-rejection-reason[b-wsvmq2iuf1] {
    font-size: 0.75rem;
    color: #a83f2e;
    margin-top: 0.15rem;
}

.finance-banner[b-wsvmq2iuf1] {
    padding: 0.85rem 1.1rem;
    border-radius: 0.6rem;
    margin-bottom: 1rem;
}

.finance-banner--error[b-wsvmq2iuf1] {
    background: #f5e0da;
    color: #7a2f1f;
}

.finance-banner--warn[b-wsvmq2iuf1] {
    background: #f5ead2;
    color: #7a5711;
}

.finance-admin-toolbar[b-wsvmq2iuf1] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    margin-bottom: 1rem;
}

.finance-agreement[b-wsvmq2iuf1] {
    border: 1px solid #e5eaea;
    border-radius: 0.6rem;
    padding: 1rem 1.1rem;
    margin-bottom: 0.9rem;
}

.finance-agreement__head[b-wsvmq2iuf1] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
}

.finance-agreement__docs[b-wsvmq2iuf1] {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    margin-bottom: 0.5rem;
}

.finance-agreement__action[b-wsvmq2iuf1] {
    border-top: 1px dashed #e5eaea;
    padding-top: 0.75rem;
    margin-top: 0.5rem;
}

.finance-thread[b-wsvmq2iuf1] {
    border: 1px solid #e5eaea;
    border-radius: 0.6rem;
    padding: 0.8rem 1rem;
    margin-bottom: 0.6rem;
}

.finance-thread__subject[b-wsvmq2iuf1] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 600;
    text-decoration: none;
}

.finance-thread__messages[b-wsvmq2iuf1] {
    margin-top: 0.6rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.finance-thread__message[b-wsvmq2iuf1] {
    background: #f6f8f7;
    border-radius: 0.5rem;
    padding: 0.5rem 0.7rem;
}

.finance-thread__message--own[b-wsvmq2iuf1] {
    background: #e8f3f2;
    align-self: flex-end;
}

.finance-agreement__toolbar[b-wsvmq2iuf1] {
    display: flex;
    align-items: center;
    gap: 0.9rem;
    margin-bottom: 0.4rem;
}

.finance-line-item[b-wsvmq2iuf1] {
    border: 1px solid #eef1f0;
    border-radius: 0.5rem;
    padding: 0.7rem 0.9rem;
    margin: 0.6rem 0;
    background: #fbfcfc;
}

.finance-line-item--new[b-wsvmq2iuf1] {
    background: #fff;
    border-style: dashed;
}

.finance-line-item__head[b-wsvmq2iuf1] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.6rem;
    margin-bottom: 0.5rem;
}

.finance-line-item__head span[b-wsvmq2iuf1] {
    color: #5d7a7a;
    font-size: 0.85rem;
}

.finance-line-item__attachments[b-wsvmq2iuf1] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
    gap: 0.9rem;
}

.finance-line-item__attachments-label[b-wsvmq2iuf1] {
    display: block;
    font-size: 0.78rem;
    font-weight: 600;
    color: #3b3b3b;
    margin-bottom: 0.25rem;
}

.finance-attachment-row[b-wsvmq2iuf1] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.85rem;
}

.finance-card__head[b-wsvmq2iuf1] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    margin-bottom: 0.9rem;
}

.finance-card__head h2[b-wsvmq2iuf1] {
    margin-bottom: 0;
}

.finance-snapshot[b-wsvmq2iuf1] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
    gap: 0.9rem;
    margin-bottom: 1.25rem;
}

.finance-snapshot__card[b-wsvmq2iuf1] {
    background: #fff;
    border: 1px solid #d8e8e8;
    border-radius: 0.75rem;
    padding: 1rem 1.15rem;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.finance-snapshot__card--primary[b-wsvmq2iuf1] {
    background: #0c3536;
    border-color: #0c3536;
}

.finance-snapshot__card--primary .finance-snapshot__label[b-wsvmq2iuf1],
.finance-snapshot__card--primary .finance-snapshot__value[b-wsvmq2iuf1] {
    color: #fff;
}

.finance-snapshot__card--link[b-wsvmq2iuf1] {
    cursor: pointer;
}

.finance-snapshot__card--link:hover[b-wsvmq2iuf1] {
    border-color: #185354;
}

.finance-snapshot__label[b-wsvmq2iuf1] {
    font-size: 0.76rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #5d7a7a;
}

.finance-snapshot__value[b-wsvmq2iuf1] {
    font-size: 1.4rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    color: #10201f;
}

.finance-action-list[b-wsvmq2iuf1] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
}

.finance-action-list__item[b-wsvmq2iuf1] {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    font-size: 0.88rem;
}

.finance-action-list__dot[b-wsvmq2iuf1] {
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 50%;
    flex: none;
}

.finance-action-list__item--info .finance-action-list__dot[b-wsvmq2iuf1] { background: #2f5f8f; }
.finance-action-list__item--warning .finance-action-list__dot[b-wsvmq2iuf1] { background: #a9711a; }
.finance-action-list__item--critical .finance-action-list__dot[b-wsvmq2iuf1] { background: #a83f2e; }

.finance-quick-actions[b-wsvmq2iuf1] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.finance-chart[b-wsvmq2iuf1] {
    display: flex;
    align-items: flex-end;
    gap: 0.5rem;
    height: 9rem;
    padding-top: 0.5rem;
}

.finance-chart__bar-wrap[b-wsvmq2iuf1] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    height: 100%;
    gap: 0.35rem;
}

.finance-chart__bar[b-wsvmq2iuf1] {
    width: 100%;
    max-width: 1.6rem;
    background: linear-gradient(180deg, #a9812e, #185354);
    border-radius: 3px 3px 1px 1px;
    min-height: 4px;
}

.finance-chart__label[b-wsvmq2iuf1] {
    font-size: 0.68rem;
    color: #5d7a7a;
}

.finance-compliance-grid[b-wsvmq2iuf1] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr));
    gap: 0.9rem;
}

.finance-compliance-card[b-wsvmq2iuf1] {
    border: 1px solid #eef1f0;
    border-radius: 0.6rem;
    padding: 0.8rem 0.9rem;
}

.finance-compliance-card__head[b-wsvmq2iuf1] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    margin-bottom: 0.4rem;
}

.finance-compliance-mini[b-wsvmq2iuf1] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
}

.finance-compliance-mini li[b-wsvmq2iuf1] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 0.88rem;
}

.finance-agreement-mini[b-wsvmq2iuf1] {
    border-bottom: 1px dashed #eef1f0;
    padding: 0.5rem 0;
}

.finance-agreement-mini:last-child[b-wsvmq2iuf1] {
    border-bottom: none;
}

.finance-summary-cards[b-wsvmq2iuf1] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(18rem, 1fr));
    gap: 1rem;
}

.finance-summary-card[b-wsvmq2iuf1] {
    background: #fff;
    border: 1px solid #d8e8e8;
    border-radius: 0.75rem;
    padding: 1.1rem 1.25rem;
}

.finance-summary-card__row[b-wsvmq2iuf1] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.finance-summary-card__label[b-wsvmq2iuf1] {
    display: block;
    font-size: 0.76rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #5d7a7a;
}

.finance-summary-card__value[b-wsvmq2iuf1] {
    display: block;
    font-size: 1.05rem;
    font-weight: 600;
    margin-top: 0.2rem;
}
/* _content/InuniSphere.Web/Components/Pages/Finance/FinanceAdmin.razor.rz.scp.css */
.finance-page[b-uslpuvjf8s] {
    max-width: 960px;
    margin: 0 auto;
    padding: 0 1rem 3rem;
}

.finance-header[b-uslpuvjf8s] {
    margin: 1rem 0 1.5rem;
}

.finance-header h1[b-uslpuvjf8s] {
    margin-bottom: 0.25rem;
}

.finance-header__subtitle[b-uslpuvjf8s] {
    color: #5d7a7a;
    margin: 0;
}

.finance-tabs[b-uslpuvjf8s] {
    margin-bottom: 1.5rem;
}

.finance-card[b-uslpuvjf8s] {
    background: #fff;
    border: 1px solid #d8e8e8;
    border-radius: 0.75rem;
    padding: 1.25rem 1.5rem;
    margin-bottom: 1.25rem;
}

.finance-card h2[b-uslpuvjf8s] {
    font-size: 1.1rem;
    margin-bottom: 1rem;
}

.finance-form-grid[b-uslpuvjf8s] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
    gap: 0.9rem;
}

.finance-field label[b-uslpuvjf8s] {
    font-size: 0.85rem;
}

.finance-form-actions[b-uslpuvjf8s] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-top: 1rem;
}

.finance-saved-note[b-uslpuvjf8s] {
    color: #185354;
    font-size: 0.85rem;
}

.finance-iban[b-uslpuvjf8s] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 1rem;
}

.finance-table[b-uslpuvjf8s] {
    margin-bottom: 0;
}

.finance-custom-doc[b-uslpuvjf8s] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.35rem 0;
}

.finance-rejection-reason[b-uslpuvjf8s] {
    font-size: 0.75rem;
    color: #a83f2e;
    margin-top: 0.15rem;
}

.finance-banner[b-uslpuvjf8s] {
    padding: 0.85rem 1.1rem;
    border-radius: 0.6rem;
    margin-bottom: 1rem;
}

.finance-banner--error[b-uslpuvjf8s] {
    background: #f5e0da;
    color: #7a2f1f;
}

.finance-banner--warn[b-uslpuvjf8s] {
    background: #f5ead2;
    color: #7a5711;
}

.finance-admin-toolbar[b-uslpuvjf8s] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    margin-bottom: 1rem;
}

.finance-agreement[b-uslpuvjf8s] {
    border: 1px solid #e5eaea;
    border-radius: 0.6rem;
    padding: 1rem 1.1rem;
    margin-bottom: 0.9rem;
}

.finance-agreement__head[b-uslpuvjf8s] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
}

.finance-agreement__docs[b-uslpuvjf8s] {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    margin-bottom: 0.5rem;
}

.finance-agreement__action[b-uslpuvjf8s] {
    border-top: 1px dashed #e5eaea;
    padding-top: 0.75rem;
    margin-top: 0.5rem;
}

.finance-thread[b-uslpuvjf8s] {
    border: 1px solid #e5eaea;
    border-radius: 0.6rem;
    padding: 0.8rem 1rem;
    margin-bottom: 0.6rem;
}

.finance-thread__subject[b-uslpuvjf8s] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 600;
    text-decoration: none;
}

.finance-thread__messages[b-uslpuvjf8s] {
    margin-top: 0.6rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.finance-thread__message[b-uslpuvjf8s] {
    background: #f6f8f7;
    border-radius: 0.5rem;
    padding: 0.5rem 0.7rem;
}

.finance-thread__message--own[b-uslpuvjf8s] {
    background: #e8f3f2;
    align-self: flex-end;
}

.finance-admin-toolbar--split[b-uslpuvjf8s] {
    justify-content: space-between;
}

.finance-review-table[b-uslpuvjf8s] {
    margin: 0.5rem 0 0.75rem;
}

.finance-review-decision[b-uslpuvjf8s] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.9rem;
    border-top: 1px dashed #e5eaea;
    padding-top: 0.75rem;
    margin-top: 0.5rem;
}

.finance-review-decision__reject[b-uslpuvjf8s] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.finance-mt-1[b-uslpuvjf8s] {
    margin-top: 0.35rem;
}

.finance-pdf-preview[b-uslpuvjf8s] {
    width: 100%;
    height: 70vh;
    border: 1px solid #d8e8e8;
    border-radius: 0.5rem;
}
/* _content/InuniSphere.Web/Components/Pages/Fundacja/MojeDane.razor.rz.scp.css */
.moje-dane-layout[b-szlmh100k7] {
    display: flex;
    gap: 1.5rem;
    align-items: flex-start;
}

.moje-dane-main[b-szlmh100k7] {
    flex: 1;
    min-width: 0;
}

.moje-dane-audit[b-szlmh100k7] {
    width: 20rem;
    flex: none;
    position: sticky;
    top: 1rem;
}

@media (max-width: 900px) {
    .moje-dane-layout[b-szlmh100k7] {
        flex-direction: column;
    }

    .moje-dane-audit[b-szlmh100k7] {
        width: 100%;
        position: static;
    }
}
/* _content/InuniSphere.Web/Components/Pages/Fundacja/Projekty.razor.rz.scp.css */
/* Same breadcrumb look as Iam.razor/FinanceAdmin.razor's own copy - CSS isolation scopes each
   page's .razor.css independently, so there is no single shared source to link against instead. */
.iam-breadcrumbs[b-kldu4693xz] {
    padding: 0.9rem 1.5rem 0;
    font-size: 0.85rem;
    color: var(--brand-text-muted, #5d7a7a);
}

.iam-breadcrumbs a[b-kldu4693xz] {
    color: inherit;
    text-decoration: none;
}

.iam-breadcrumbs a:hover[b-kldu4693xz] {
    text-decoration: underline;
}

.projekty-page[b-kldu4693xz] {
    width: 100%;
    padding: 1.5rem;
}

.projekty-toolbar[b-kldu4693xz] {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
    margin: 1.25rem 0 1.5rem;
}

.projekty-toolbar > :first-child[b-kldu4693xz] {
    flex: 1 1 16rem;
    min-width: 12rem;
}

.projekty-group-heading[b-kldu4693xz] {
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--brand-text-muted, #5d7a7a);
    margin: 1.75rem 0 0.75rem;
}

.projekty-group[b-kldu4693xz] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.projekty-row-side[b-kldu4693xz] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.projekty-row-owner[b-kldu4693xz] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.projekty-row-owner-name[b-kldu4693xz] {
    font-size: 0.8rem;
    color: var(--brand-text-muted, #5d7a7a);
    white-space: nowrap;
}

.modal-form-actions[b-kldu4693xz] {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    margin-top: 1.25rem;
}

.projekty-streams[b-kldu4693xz] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.projekty-stream[b-kldu4693xz] {
    border: 1px solid var(--brand-border, rgba(11, 38, 32, .16));
    border-radius: 0.5rem;
    padding: 0.75rem 1rem;
}

.projekty-stream__head[b-kldu4693xz] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}

.projekty-stream__members[b-kldu4693xz] {
    margin-top: 0.75rem;
    padding-top: 0.75rem;
    border-top: 1px solid var(--brand-border, rgba(11, 38, 32, .16));
}

.projekty-new-stream[b-kldu4693xz] {
    border-top: 1px solid var(--brand-border, rgba(11, 38, 32, .16));
    padding-top: 1rem;
}

/* Same compact PL/EN toggle as PageComponentEditor.razor's own copy - CSS isolation means that
   one's styles don't reach here, so this is a deliberate duplicate, not drift. A plain two-item
   pill switch, not SegmentedTabs (that component is sized for a handful of content-rich, one-per-
   row filter options, not a compact inline language toggle sitting next to a text field). */
.inuni-lang-switcher[b-kldu4693xz] {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    border: 1px solid var(--brand-border, rgba(11, 38, 32, 0.16));
    border-radius: var(--brand-radius, 4px);
    padding: 2px;
    width: fit-content;
}

.inuni-lang-switcher__item[b-kldu4693xz] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2.4rem;
    padding: .3rem .5rem;
    font-size: .7rem;
    font-family: inherit;
    font-weight: 600;
    letter-spacing: .08em;
    color: var(--brand-text-muted, #5d7a7a);
    background: none;
    border: none;
    border-radius: 3px;
    cursor: pointer;
    transition: color .12s ease, background .12s ease;
}

.inuni-lang-switcher__item:hover[b-kldu4693xz] {
    color: var(--brand-text-main, #1a1c1b);
    background: var(--brand-accent-soft, #eaf4f1);
}

.inuni-lang-switcher__item.is-active[b-kldu4693xz] {
    color: var(--brand-primary-contrast, #fff);
    background: var(--brand-primary, #0F6E56);
}
/* _content/InuniSphere.Web/Components/Pages/Iam/Iam.razor.rz.scp.css */
/* Design tokens for this page: a small, consistent spacing/radius scale rather than
   ad-hoc rem values scattered per rule, so the redesign reads as one system rather
   than a pile of individually-tuned components. */
.iam-page[b-w25k43w629] {
    --iam-space-1: 0.5rem;
    --iam-space-2: 0.75rem;
    --iam-space-3: 1rem;
    --iam-space-4: 1.5rem;
    --iam-space-5: 2rem;
    --iam-radius: 0.75rem;
    --iam-radius-sm: 0.5rem;
    --iam-shadow: 0 1px 2px rgba(16, 24, 40, 0.06), 0 1px 3px rgba(16, 24, 40, 0.08);
    max-width: 72rem;
    margin: 0 auto;
    padding: 0 var(--iam-space-4) var(--iam-space-5);
}

/* Breadcrumbs — the page-specific layer of a three-layer nav hierarchy: InuniNav's
   utility bar (org area), InuniNav's IAM/Admin/Konto links (app section), this (where
   in the current page). Deliberately plain-text, not another set of pill buttons —
   it's orientation, not a place to click around. */
.iam-breadcrumbs[b-w25k43w629] {
    max-width: 72rem;
    margin: 0 auto;
    padding: 0.9rem 1.5rem 0;
    font-size: 0.85rem;
    color: var(--brand-text-muted, #5d7a7a);
}

.iam-breadcrumbs a[b-w25k43w629],
.iam-breadcrumbs__link[b-w25k43w629] {
    color: inherit;
    text-decoration: none;
}

.iam-breadcrumbs a:hover[b-w25k43w629],
.iam-breadcrumbs__link:hover[b-w25k43w629] {
    text-decoration: underline;
}

/* The "IAM" crumb is a real control (jumps to the overview), so it's a <button>, not
   an <a> — reset it back to reading as plain breadcrumb text rather than a button. */
.iam-breadcrumbs__link[b-w25k43w629] {
    appearance: none;
    background: none;
    border: none;
    padding: 0;
    font: inherit;
    cursor: pointer;
}

.iam-breadcrumbs__sep[b-w25k43w629] {
    margin: 0 0.4rem;
}

.iam-breadcrumbs [aria-current="page"][b-w25k43w629] {
    color: var(--brand-text-main, #232323);
    font-weight: 600;
}

/* Header: one title, one subtitle, contextual chips — replacing the old redundant
   "Zarządzanie dostępem" + "Zarządzanie tenantami" double-heading. */
.iam-header[b-w25k43w629] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--iam-space-3);
    padding-top: var(--iam-space-4);
    margin-bottom: var(--iam-space-4);
}

.iam-header h1[b-w25k43w629] {
    margin: 0 0 0.35rem;
    font-size: 1.75rem;
}

.iam-header__subtitle[b-w25k43w629] {
    margin: 0;
    color: var(--brand-text-muted, #5d7a7a);
}

.iam-header__context[b-w25k43w629] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: center;
}

/* The horizontal tab bar that used to live here was retired in favor of InuniNav's own
   "IAM" hover dropdown (see Iam.razor's own doc comment at that spot) - with 13+ possible
   tabs it wrapped badly on anything but a very wide viewport. */

/* Overview/"welcome" grid — landing content shown on arrival at /iam, listing every
   section this person can reach so they pick one instead of being dropped into
   whichever section happened to load first. */
.iam-section-grid[b-w25k43w629] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(18rem, 1fr));
    gap: var(--iam-space-3);
    margin-bottom: var(--iam-space-4);
}

.iam-section-card[b-w25k43w629] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--iam-space-3);
    width: 100%;
    text-align: left;
    background: #fff;
    border: 1px solid var(--brand-border, #d8e8e8);
    border-radius: var(--iam-radius);
    box-shadow: var(--iam-shadow);
    padding: var(--iam-space-4);
    cursor: pointer;
    transition: box-shadow 0.15s ease, border-color 0.15s ease;
}

.iam-section-card:hover[b-w25k43w629] {
    border-color: var(--brand-primary, #185354);
    box-shadow: 0 4px 14px rgba(16, 24, 40, 0.1);
}

.iam-section-card__body h2[b-w25k43w629] {
    font-size: 1.05rem;
    margin: 0 0 0.25rem;
}

.iam-section-card__body p[b-w25k43w629] {
    margin: 0;
}

.iam-section-card__chevron[b-w25k43w629] {
    font-size: 1.25rem;
    color: var(--brand-primary, #185354);
    flex-shrink: 0;
}

/* Cards — the one container type every section uses, so tenants, permissions, and
   staff sections all read as the same kind of surface. */
.iam-card[b-w25k43w629] {
    background: #fff;
    border: 1px solid var(--brand-border, #d8e8e8);
    border-radius: var(--iam-radius);
    box-shadow: var(--iam-shadow);
    padding: var(--iam-space-4);
    margin-bottom: var(--iam-space-4);
}

.iam-card h2[b-w25k43w629] {
    font-size: 1.15rem;
    margin: 0 0 0.25rem;
}

/* A card-styled block inside another .iam-card (column picker, bulk-action bar) — same
   bordered look, without stacking a second shadow/margin on top of the parent card's own. */
.iam-card--nested[b-w25k43w629] {
    box-shadow: none;
    margin-bottom: 0;
    background: var(--brand-accent-soft, #f4fafa);
}

.iam-card__header[b-w25k43w629] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--iam-space-3);
    margin-bottom: var(--iam-space-4);
}

/* The primary action, moved here from below the table — top-right of the section
   it acts on, next to a search field, where a creation action is expected. */
.iam-card__actions[b-w25k43w629] {
    display: flex;
    align-items: center;
    gap: var(--iam-space-2);
    flex-wrap: wrap;
}

.iam-search[b-w25k43w629] {
    width: 16rem;
    max-width: 100%;
}

.iam-create-tenant-form[b-w25k43w629] {
    padding: var(--iam-space-4);
    margin: 0 0 var(--iam-space-4);
    background: var(--brand-accent-soft, #f4fafa);
    border-radius: var(--iam-radius-sm);
}

/* Grid instead of Bootstrap's row/col-auto flex-wrap — every field keeps the same
   label-above-control shape and lines up on its own grid row regardless of how many
   fields fit per line, instead of a manual margin-top hack (the checkbox field) that
   only lined up while nothing wrapped. */
.iam-form-grid[b-w25k43w629] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
    gap: var(--iam-space-3);
}

.iam-form-field[b-w25k43w629] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    min-width: 0;
}

.iam-form-field .form-label[b-w25k43w629] {
    margin: 0;
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--brand-text-main, #232323);
}

.iam-form-field .form-check[b-w25k43w629] {
    margin-top: 0.3rem;
}

.iam-form-actions[b-w25k43w629] {
    display: flex;
    align-items: center;
    gap: var(--iam-space-3);
    flex-wrap: wrap;
    margin-top: var(--iam-space-4);
}

/* Informational banners for special, non-actionable entries (e.g. the pre-tenant-model
   sentinel row) or error states — visually distinct from a normal card so it reads as
   "read this" rather than "here's more data". */
.iam-banner[b-w25k43w629] {
    border-radius: var(--iam-radius-sm);
    padding: var(--iam-space-3) var(--iam-space-4);
    margin-bottom: var(--iam-space-4);
}

.iam-banner strong[b-w25k43w629] {
    display: block;
    margin-bottom: 0.25rem;
}

.iam-banner p[b-w25k43w629] {
    margin: 0;
}

.iam-banner--info[b-w25k43w629] {
    background: #eef6f6;
    border: 1px solid var(--brand-border, #d8e8e8);
    color: #123f40;
}

.iam-banner--error[b-w25k43w629] {
    background: #fff2f2;
    border: 1px solid #f3c9c9;
    color: #6d1e1e;
    max-width: 72rem;
    margin: var(--iam-space-4) auto;
}

.iam-banner--success[b-w25k43w629] {
    background: #eef9f0;
    border: 1px solid #bfe6c8;
    color: #1e5c33;
}

/* Tenant detail modal's Admin-only actions (link an existing Entra account, assign a
   SystemRole directly) — each gets its own labeled, collapsible block instead of an
   unlabeled toggle button, so it's clear which section's content is currently open. */
.iam-admin-action__divider[b-w25k43w629] {
    border: none;
    border-top: 1px solid var(--brand-border, #d8e8e8);
    margin: var(--iam-space-4) 0;
}

.iam-admin-action__header[b-w25k43w629] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--iam-space-3);
    margin-bottom: var(--iam-space-3);
}

.iam-admin-action__header h3[b-w25k43w629] {
    margin: 0 0 0.15rem;
    font-size: 1rem;
}

/* The person currently picked out of a search-results table, before the final confirming
   action (Podłącz/Przypisz) — a distinct highlighted row so it reads as "this is who the
   button below will act on", not just another line of text. */
.iam-selected-person[b-w25k43w629] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--iam-space-3);
    background: var(--brand-accent-soft, #f4fafa);
    border: 1px solid var(--brand-border, #d8e8e8);
    border-radius: var(--iam-radius-sm);
    padding: var(--iam-space-2) var(--iam-space-3);
    margin-bottom: var(--iam-space-3);
}

/* Tenant/role tiles, replacing the old plain <table> — a manageable set of cards
   rather than a dense grid, per the expected scale of "partner orgs", with generous
   spacing and a hover state so each one reads as its own, clickable-feeling unit. */
.iam-tile-grid[b-w25k43w629] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr));
    gap: var(--iam-space-3);
}

.iam-tile[b-w25k43w629] {
    border: 1px solid var(--brand-border, #d8e8e8);
    border-radius: var(--iam-radius-sm);
    padding: var(--iam-space-3);
    transition: box-shadow 0.15s ease, border-color 0.15s ease;
    cursor: pointer;
}

.iam-tile:hover[b-w25k43w629] {
    box-shadow: var(--iam-shadow);
    border-color: var(--brand-primary, #185354);
}

.iam-tile__top[b-w25k43w629] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--iam-space-2);
    margin-bottom: 0.35rem;
}

.iam-tile__name[b-w25k43w629] {
    font-weight: 700;
}

.iam-detail-list[b-w25k43w629] {
    display: grid;
    grid-template-columns: max-content 1fr;
    column-gap: var(--iam-space-3);
    row-gap: 0.35rem;
    margin-bottom: var(--iam-space-3);
}

.iam-detail-list dt[b-w25k43w629] {
    color: var(--brand-muted, #5f7a7a);
    font-weight: 600;
}

.iam-detail-list dd[b-w25k43w629] {
    margin: 0;
}

/* Status badges — color-coded, human-readable labels instead of identitycore's raw
   internal TenantStatus strings (PermissionReady/PermissionNotGranted/Disconnected). */
.iam-badge[b-w25k43w629] {
    display: inline-flex;
    align-items: center;
    padding: 0.2rem 0.6rem;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 700;
    white-space: nowrap;
}

.iam-badge--success[b-w25k43w629] {
    background: #e3f5e9;
    color: #1a7a3e;
}

.iam-badge--warning[b-w25k43w629] {
    background: #fdf3d8;
    color: #8a6300;
}

.iam-badge--danger[b-w25k43w629] {
    background: #fde3e3;
    color: #a12626;
}

.iam-badge--neutral[b-w25k43w629] {
    background: #f2f4f5;
    color: var(--brand-text-muted, #5d7a7a);
}

/* Inline "remove this role" control inside a badge — "Zarządzaj rolami na evencie"'s
   per-person role tags. */
.iam-badge__remove[b-w25k43w629] {
    appearance: none;
    background: none;
    border: none;
    padding: 0;
    margin-left: 0.35rem;
    line-height: 1;
    font-size: 0.9rem;
    color: inherit;
    cursor: pointer;
    opacity: 0.6;
}

.iam-badge__remove:hover[b-w25k43w629] {
    opacity: 1;
    color: #a12626;
}

/* Small round "+" trigger that opens the request modal — sits in a tile's header row
   next to its title, instead of an always-visible inline form. */
.iam-icon-button[b-w25k43w629] {
    appearance: none;
    border: 1px solid var(--brand-border, #d8e8e8);
    background: #fff;
    color: var(--brand-primary, #185354);
    border-radius: 50%;
    width: 1.75rem;
    height: 1.75rem;
    font-size: 1.1rem;
    line-height: 1;
    cursor: pointer;
    flex-shrink: 0;
}

.iam-icon-button:hover[b-w25k43w629] {
    background: var(--brand-accent-soft, #f4fafa);
    border-color: var(--brand-primary, #185354);
}

/* Row spacing/hover for the one table that's left (role requests — a genuine log of
   past events, not something that benefits from card treatment). */
.iam-table td[b-w25k43w629],
.iam-table th[b-w25k43w629] {
    padding: var(--iam-space-2) var(--iam-space-3);
}

.iam-table tbody tr:hover[b-w25k43w629] {
    background: var(--brand-accent-soft, #f4fafa);
}

.iam-dashboard__stats[b-w25k43w629] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
    gap: var(--iam-space-3);
}

.iam-dashboard__stat[b-w25k43w629] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    padding: var(--iam-space-3) var(--iam-space-4);
    border: 1px solid var(--brand-border, #d8e8e8);
    border-radius: var(--iam-radius-sm);
    background: var(--brand-accent-soft, #f4fafa);
}

.iam-dashboard__stat-value[b-w25k43w629] {
    font-size: 1.75rem;
    font-weight: 600;
    line-height: 1.1;
}

.iam-dashboard__stat-label[b-w25k43w629] {
    font-size: 0.85rem;
    color: var(--brand-text-muted, #5d7a7a);
}

@media (max-width: 640px) {
    .iam-header[b-w25k43w629] {
        flex-direction: column;
    }

    .iam-card__header[b-w25k43w629] {
        flex-direction: column;
        align-items: stretch;
    }

    .iam-search[b-w25k43w629] {
        width: 100%;
    }
}
/* _content/InuniSphere.Web/Components/Pages/Login/Login.razor.rz.scp.css */
/* INUNI's own institutional/"high finance" identity - same palette InuniNav.razor.css
   and the shared component library already carry (ink #0B2620, teal accent #0F6E56,
   Libre Baskerville serif). Reads var(--brand-*, <institutional default>) throughout so
   an opt-in ThemedHead override (?brand=<slug>, see Login.razor's own comment) still
   reskins this page exactly the way it reskins InuniNav today. */
.inuni-login[b-tpvf52rlyh] {
    --ink: var(--brand-text-main, #0B2620);
    --teal: var(--brand-primary, #0F6E56);
    --paper: var(--brand-page-bg, #FAFAF8);
    --surface: var(--brand-surface, #ffffff);
    --rule: var(--brand-border, rgba(11, 38, 32, 0.16));
    --rule-soft: rgba(11, 38, 32, 0.09);
    --text-soft: var(--brand-text-muted, #565B58);
    --text-faint: #8C918D;
    --serif: var(--brand-font-serif, "Libre Baskerville", Georgia, "Times New Roman", serif);

    position: relative;
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: clamp(1.5rem, 4vw, 3rem);
    background: var(--paper);
    font-family: "Inter", "Segoe UI", system-ui, -apple-system, sans-serif;
}

.inuni-login__lang[b-tpvf52rlyh] {
    position: absolute;
    top: 1.25rem;
    right: 1.5rem;
}

.inuni-login__card[b-tpvf52rlyh] {
    width: 100%;
    max-width: 27rem;
    background: var(--surface);
    border: 1px solid var(--rule);
    border-radius: 2px;
    padding: 2.75rem 2.5rem;
    text-align: center;
}

.inuni-login__brand[b-tpvf52rlyh] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.6rem;
    margin-bottom: 2rem;
}

.inuni-login__brand-img[b-tpvf52rlyh] {
    height: 2.4rem;
    object-fit: contain;
}

.inuni-login__brand-label[b-tpvf52rlyh] {
    font-size: 9px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--text-faint);
    padding-top: 0.4rem;
    border-top: 1px solid var(--rule-soft);
}

.inuni-login__eyebrow[b-tpvf52rlyh] {
    font-family: var(--serif);
    font-weight: 400;
    font-size: 1.3rem;
    color: var(--ink);
    margin: 0 0 0.5rem;
}

.inuni-login__subtitle[b-tpvf52rlyh] {
    font-size: 0.85rem;
    line-height: 1.6;
    color: var(--text-soft);
    margin: 0 0 2rem;
}

.inuni-login__options[b-tpvf52rlyh] {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
    margin-bottom: 1.5rem;
}

.inuni-login__option[b-tpvf52rlyh] {
    padding: 0.85rem 1.25rem;
    font: inherit;
    font-weight: 500;
    color: var(--ink);
    background: var(--paper);
    border: 1px solid var(--rule);
    border-radius: 2px;
    cursor: pointer;
    transition: border-color 0.12s ease, background-color 0.12s ease;
}

.inuni-login__option:hover[b-tpvf52rlyh] {
    border-color: var(--teal);
}

.inuni-login__option.is-selected[b-tpvf52rlyh] {
    border-color: var(--teal);
    background: color-mix(in srgb, var(--teal) 10%, var(--paper));
}

.inuni-login__continue[b-tpvf52rlyh] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    background: var(--teal);
    color: var(--brand-primary-contrast, #fff);
    border: none;
    border-radius: 2px;
    padding: 0.8rem 1.5rem;
    font-size: 0.72rem;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    cursor: pointer;
    transition: background-color 0.12s ease;
}

.inuni-login__continue:hover:not(:disabled)[b-tpvf52rlyh] {
    background: var(--ink);
}

.inuni-login__continue:disabled[b-tpvf52rlyh] {
    opacity: 0.5;
    cursor: not-allowed;
}

.inuni-login__error[b-tpvf52rlyh] {
    color: #e5484d;
    font-size: 0.85rem;
}
/* _content/InuniSphere.Web/Components/Pages/NewsBuilder/NewsBuilder.razor.rz.scp.css */
.news-builder[b-9j9et072eo] {
    width: 100%;
    margin: 0;
    padding: 1.25rem 1.5rem 3rem;
}

.news-builder__layout[b-9j9et072eo] {
    display: grid;
    grid-template-columns: 18rem minmax(0, 1fr);
    gap: 1.5rem;
    align-items: start;
    margin-top: 1rem;
}

.news-builder__list[b-9j9et072eo] {
    display: flex;
    flex-direction: column;
    gap: .35rem;
    border: 1px solid var(--brand-border, #e5e5e5);
    border-radius: .5rem;
    padding: .5rem;
    background: var(--brand-surface, #fff);
    position: sticky;
    top: 1rem;
}

.news-builder__add-btn[b-9j9et072eo] {
    width: 100%;
    margin-bottom: .4rem;
    padding: .4rem .5rem;
    background: var(--brand-surface-alt, #f1f7f5);
    border: 1px dashed var(--brand-accent, #0F6E56);
    border-radius: .4rem;
    font-size: .74rem;
    font-weight: 600;
    color: var(--brand-accent, #0F6E56);
    cursor: pointer;
}

.news-builder__add-btn:hover[b-9j9et072eo] {
    background: var(--brand-accent, #0F6E56);
    color: #fff;
}

.news-builder__list-item[b-9j9et072eo] {
    display: flex;
    flex-direction: column;
    gap: .2rem;
    width: 100%;
    padding: .5rem .6rem;
    background: none;
    border: 0;
    border-radius: .4rem;
    text-align: left;
    font: inherit;
    cursor: pointer;
}

.news-builder__list-item:hover[b-9j9et072eo] {
    background: var(--brand-surface-alt, #f1f7f5);
}

.news-builder__list-item.is-active[b-9j9et072eo] {
    background: var(--brand-accent-soft, #eaf4f1);
}

.news-builder__list-item-title[b-9j9et072eo] {
    font-size: .82rem;
    font-weight: 600;
    color: var(--brand-text-main, #0B2620);
}

.news-builder__list-item-title.is-archived[b-9j9et072eo] {
    color: var(--brand-text-muted, #93a5a5);
    text-decoration: line-through;
}

.news-builder__list-item-meta[b-9j9et072eo] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .35rem;
    font-size: .68rem;
    color: var(--brand-text-muted, #93a5a5);
}

.news-builder__editor[b-9j9et072eo] {
    border: 1px solid var(--brand-border, #e5e5e5);
    border-radius: .5rem;
    padding: 1.25rem;
    background: var(--brand-surface, #fff);
    min-height: 12rem;
}

.news-builder__form[b-9j9et072eo] {
    display: flex;
    flex-direction: column;
    gap: .9rem;
}

.news-builder__placements[b-9j9et072eo] {
    display: flex;
    flex-direction: column;
    gap: .4rem;
    border: 1px solid var(--brand-border, #e5e5e5);
    border-radius: .4rem;
    padding: .6rem .75rem;
}

.news-builder__placements legend[b-9j9et072eo] {
    font-size: .72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: var(--brand-text-muted, #93a5a5);
    padding: 0 .3rem;
}

.news-builder__checkbox[b-9j9et072eo] {
    display: flex;
    align-items: center;
    gap: .4rem;
    font-size: .85rem;
}

.news-builder__actions[b-9j9et072eo] {
    display: flex;
    justify-content: flex-end;
    gap: .6rem;
    padding-top: .5rem;
}

.news-builder__content-editor[b-9j9et072eo] {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: .4rem;
    margin-top: .5rem;
    padding-top: 1rem;
    border-top: 1px solid var(--brand-border, #e5e5e5);
}

@media (max-width: 760px) {
    .news-builder__layout[b-9j9et072eo] {
        grid-template-columns: 1fr;
    }

    .news-builder__list[b-9j9et072eo] {
        position: static;
    }
}
/* _content/InuniSphere.Web/Components/Pages/Room/RoomSelection.razor.rz.scp.css */
/* Same visual language as ProfileWizard.razor.css's own design-tokens comment - kept as a
   separate copy since Blazor CSS isolation scopes rules to the component that declares them. */
.iam-page[b-3nm6ffd10f] {
    --iam-space-3: 1rem;
    --iam-space-4: 1.5rem;
    --iam-space-5: 2rem;
    --iam-radius: 0.75rem;
    --iam-shadow: 0 1px 2px rgba(16, 24, 40, 0.06), 0 1px 3px rgba(16, 24, 40, 0.08);
    max-width: 72rem;
    margin: 0 auto;
    padding: 0 var(--iam-space-4) var(--iam-space-5);
}

.iam-breadcrumbs[b-3nm6ffd10f] {
    max-width: 72rem;
    margin: 0 auto;
    padding: 0.9rem 1.5rem 0;
    font-size: 0.85rem;
    color: var(--brand-text-muted, #5d7a7a);
}

.iam-breadcrumbs a[b-3nm6ffd10f] {
    color: inherit;
    text-decoration: none;
}

.iam-breadcrumbs a:hover[b-3nm6ffd10f] {
    text-decoration: underline;
}

.iam-breadcrumbs__sep[b-3nm6ffd10f] {
    margin: 0 0.4rem;
}

.iam-header[b-3nm6ffd10f] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--iam-space-3);
    padding-top: var(--iam-space-4);
    margin-bottom: var(--iam-space-4);
}

.iam-header h1[b-3nm6ffd10f] {
    margin: 0 0 0.35rem;
    font-size: 1.75rem;
}

.iam-header__subtitle[b-3nm6ffd10f] {
    margin: 0;
    color: var(--brand-text-muted, #5d7a7a);
}

.iam-card[b-3nm6ffd10f] {
    background: #fff;
    border: 1px solid var(--brand-border, #d8e8e8);
    border-radius: var(--iam-radius);
    box-shadow: var(--iam-shadow);
    padding: var(--iam-space-4);
    margin-bottom: var(--iam-space-4);
}

.iam-card h2[b-3nm6ffd10f] {
    font-size: 1.15rem;
    margin: 0 0 0.25rem;
}

.iam-card__header[b-3nm6ffd10f] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--iam-space-3);
    margin-bottom: var(--iam-space-4);
}

.iam-banner[b-3nm6ffd10f] {
    border-radius: 0.5rem;
    padding: var(--iam-space-3) var(--iam-space-4);
    margin-bottom: var(--iam-space-4);
}

.iam-banner strong[b-3nm6ffd10f] {
    display: block;
    margin-bottom: 0.25rem;
}

.iam-banner--error[b-3nm6ffd10f] {
    background: #fff2f2;
    border: 1px solid #f3c9c9;
    color: #6d1e1e;
}

.iam-banner--info[b-3nm6ffd10f] {
    background: #eff8ff;
    border: 1px solid #bfe0f5;
    color: #0f3a5a;
}

.room-selection--themed[b-3nm6ffd10f] {
    background: var(--brand-page-bg, transparent);
    color: var(--brand-text-main, inherit);
}

.room-selection--themed .iam-header__subtitle[b-3nm6ffd10f] {
    color: var(--brand-text-muted, #5d7a7a);
}

.room-selection--themed .iam-card[b-3nm6ffd10f] {
    background: var(--brand-surface, #fff);
    border-color: var(--brand-border, #d8e8e8);
}

/* Bootstrap's .text-muted is a fixed grey tuned for a light card - on Boost's dark
   --brand-surface card that grey is nearly invisible, so it needs to follow the theme's own
   muted color instead (same fix as ProfileWizard.razor.css/Documents.razor.css). */
.room-selection--themed .text-muted[b-3nm6ffd10f] {
    color: var(--brand-text-muted, #6c757d) !important;
}

/* Map on the left, room details (capacity/opiekun/roster) on the right - stacks on narrow
   viewports since a side-by-side layout doesn't fit a floor-plan image at any useful size. */
.room-selection__layout[b-3nm6ffd10f] {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(16rem, 1fr);
    gap: var(--iam-space-4);
    align-items: start;
}

@media (max-width: 768px) {
    .room-selection__layout[b-3nm6ffd10f] {
        grid-template-columns: 1fr;
    }
}

.room-selection__details[b-3nm6ffd10f] {
    border: 1px solid var(--brand-border, #d8e8e8);
    border-radius: var(--iam-radius);
    padding: var(--iam-space-3) var(--iam-space-4);
}

.room-selection__member-list[b-3nm6ffd10f] {
    margin: 0;
    padding-left: 1.2rem;
}

.room-selection__member-list li[b-3nm6ffd10f] {
    font-size: 0.9rem;
}
/* _content/InuniSphere.Web/Components/Pages/Shop/ShopSelection.razor.rz.scp.css */
/* Same visual language as /admin and ActivitySelection.razor's own copy of it - kept as a
   separate copy rather than a shared stylesheet because Blazor CSS isolation scopes rules to the
   component that declares them. */
.iam-page[b-iz2oysc0qd] {
    --iam-space-3: 1rem;
    --iam-space-4: 1.5rem;
    --iam-space-5: 2rem;
    --iam-radius: 0.75rem;
    --iam-shadow: 0 1px 2px rgba(16, 24, 40, 0.06), 0 1px 3px rgba(16, 24, 40, 0.08);
    max-width: 72rem;
    margin: 0 auto;
    padding: 0 var(--iam-space-4) var(--iam-space-5);
}

.iam-breadcrumbs[b-iz2oysc0qd] {
    max-width: 72rem;
    margin: 0 auto;
    padding: 0.9rem 1.5rem 0;
    font-size: 0.85rem;
    color: var(--brand-text-muted, #5d7a7a);
}

.iam-breadcrumbs a[b-iz2oysc0qd] {
    color: inherit;
    text-decoration: none;
}

.iam-breadcrumbs a:hover[b-iz2oysc0qd] {
    text-decoration: underline;
}

.iam-breadcrumbs__sep[b-iz2oysc0qd] {
    margin: 0 0.4rem;
}

.iam-header[b-iz2oysc0qd] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--iam-space-3);
    padding-top: var(--iam-space-4);
    margin-bottom: var(--iam-space-4);
}

.iam-header h1[b-iz2oysc0qd] {
    margin: 0 0 0.35rem;
    font-size: 1.75rem;
}

.iam-header__subtitle[b-iz2oysc0qd] {
    margin: 0;
    color: var(--brand-text-muted, #5d7a7a);
}

.iam-card[b-iz2oysc0qd] {
    background: #fff;
    border: 1px solid var(--brand-border, #d8e8e8);
    border-radius: var(--iam-radius);
    box-shadow: var(--iam-shadow);
    padding: var(--iam-space-4);
    margin-bottom: var(--iam-space-4);
}

.iam-banner[b-iz2oysc0qd] {
    border-radius: 0.5rem;
    padding: var(--iam-space-3) var(--iam-space-4);
    margin-bottom: var(--iam-space-4);
}

.iam-banner strong[b-iz2oysc0qd] {
    display: block;
    margin-bottom: 0.25rem;
}

.iam-banner--error[b-iz2oysc0qd] {
    background: #fff2f2;
    border: 1px solid #f3c9c9;
    color: #6d1e1e;
}

.shop-page--themed[b-iz2oysc0qd] {
    background: var(--brand-page-bg, transparent);
    color: var(--brand-text-main, inherit);
}

.shop-page--themed .iam-header__subtitle[b-iz2oysc0qd] {
    color: var(--brand-text-muted, #5d7a7a);
}

.shop-page--themed .iam-card[b-iz2oysc0qd] {
    background: var(--brand-surface, #fff);
    border-color: var(--brand-border, #d8e8e8);
}

.shop-page--themed .text-muted[b-iz2oysc0qd] {
    color: var(--brand-text-muted, #6c757d) !important;
}

.shop-selection-row[b-iz2oysc0qd] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    border: 1px solid var(--brand-border, #d8e8e8);
    border-radius: var(--brand-radius, 0.6rem);
    padding: 0.75rem 1rem;
    background: #fff;
}

.shop-page--themed .shop-selection-row[b-iz2oysc0qd] {
    background: var(--brand-surface, #fff);
    border-color: var(--brand-border, #d8e8e8);
}

.shop-selection-row__image[b-iz2oysc0qd] {
    width: 3.5rem;
    height: 3.5rem;
    object-fit: cover;
    border-radius: var(--brand-radius, 0.6rem);
    border: 1px solid var(--brand-border, #d8e8e8);
    flex-shrink: 0;
}

.shop-selection-row__qty[b-iz2oysc0qd] {
    width: 5rem;
    flex-shrink: 0;
}

@media (max-width: 640px) {
    .iam-header[b-iz2oysc0qd] {
        flex-direction: column;
    }

    .shop-selection-row[b-iz2oysc0qd] {
        flex-wrap: wrap;
    }
}
/* _content/InuniSphere.Web/Components/Pages/Surveys/SurveyList.razor.rz.scp.css */
/* Same visual language as /admin and ActivitySelection.razor's own copy of it - kept as a
   separate copy rather than a shared stylesheet because Blazor CSS isolation scopes rules to the
   component that declares them. */
.iam-page[b-3blxqv2uhu] {
    --iam-space-3: 1rem;
    --iam-space-4: 1.5rem;
    --iam-space-5: 2rem;
    --iam-radius: 0.75rem;
    --iam-shadow: 0 1px 2px rgba(16, 24, 40, 0.06), 0 1px 3px rgba(16, 24, 40, 0.08);
    max-width: 72rem;
    margin: 0 auto;
    padding: 0 var(--iam-space-4) var(--iam-space-5);
}

.iam-breadcrumbs[b-3blxqv2uhu] {
    max-width: 72rem;
    margin: 0 auto;
    padding: 0.9rem 1.5rem 0;
    font-size: 0.85rem;
    color: var(--brand-text-muted, #5d7a7a);
}

.iam-breadcrumbs a[b-3blxqv2uhu] {
    color: inherit;
    text-decoration: none;
}

.iam-breadcrumbs a:hover[b-3blxqv2uhu] {
    text-decoration: underline;
}

.iam-breadcrumbs__sep[b-3blxqv2uhu] {
    margin: 0 0.4rem;
}

.iam-header[b-3blxqv2uhu] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--iam-space-3);
    padding-top: var(--iam-space-4);
    margin-bottom: var(--iam-space-4);
}

.iam-header h1[b-3blxqv2uhu] {
    margin: 0 0 0.35rem;
    font-size: 1.75rem;
}

.iam-header__subtitle[b-3blxqv2uhu] {
    margin: 0;
    color: var(--brand-text-muted, #5d7a7a);
}

.iam-card[b-3blxqv2uhu] {
    background: #fff;
    border: 1px solid var(--brand-border, #d8e8e8);
    border-radius: var(--iam-radius);
    box-shadow: var(--iam-shadow);
    padding: var(--iam-space-4);
    margin-bottom: var(--iam-space-4);
}

.iam-banner[b-3blxqv2uhu] {
    border-radius: 0.5rem;
    padding: var(--iam-space-3) var(--iam-space-4);
    margin-bottom: var(--iam-space-4);
}

.iam-banner--error[b-3blxqv2uhu] {
    background: #fff2f2;
    border: 1px solid #f3c9c9;
    color: #6d1e1e;
}

.surveys-page--themed[b-3blxqv2uhu] {
    background: var(--brand-page-bg, transparent);
    color: var(--brand-text-main, inherit);
}

.surveys-page--themed .iam-header__subtitle[b-3blxqv2uhu] {
    color: var(--brand-text-muted, #5d7a7a);
}

.surveys-page--themed .iam-card[b-3blxqv2uhu] {
    background: var(--brand-surface, #fff);
    border-color: var(--brand-border, #d8e8e8);
}

.surveys-page--themed .text-muted[b-3blxqv2uhu] {
    color: var(--brand-text-muted, #6c757d) !important;
}

.survey-card--completed[b-3blxqv2uhu] {
    border-color: var(--brand-accent, #185354);
    background: var(--brand-accent-soft, #eef6f6);
}

@media (max-width: 640px) {
    .iam-header[b-3blxqv2uhu] {
        flex-direction: column;
    }
}
/* _content/InuniSphere.Web/Components/Pages/Transport/TransportWizard.razor.rz.scp.css */
/* Same visual language as /admin (see Admin.razor.css's own design-tokens comment) - kept as
   a separate copy rather than a shared stylesheet because Blazor CSS isolation scopes rules
   to the component that declares them; a class used in TransportWizard.razor picks up nothing
   from Admin.razor.css. */
.iam-page[b-byojahfz8x] {
    --iam-space-3: 1rem;
    --iam-space-4: 1.5rem;
    --iam-space-5: 2rem;
    --iam-radius: 0.75rem;
    --iam-shadow: 0 1px 2px rgba(16, 24, 40, 0.06), 0 1px 3px rgba(16, 24, 40, 0.08);
    max-width: 72rem;
    margin: 0 auto;
    padding: 0 var(--iam-space-4) var(--iam-space-5);
}

.iam-breadcrumbs[b-byojahfz8x] {
    max-width: 72rem;
    margin: 0 auto;
    padding: 0.9rem 1.5rem 0;
    font-size: 0.85rem;
    color: var(--brand-text-muted, #5d7a7a);
}

.iam-breadcrumbs a[b-byojahfz8x] {
    color: inherit;
    text-decoration: none;
}

.iam-breadcrumbs a:hover[b-byojahfz8x] {
    text-decoration: underline;
}

.iam-breadcrumbs__sep[b-byojahfz8x] {
    margin: 0 0.4rem;
}

.iam-breadcrumbs [aria-current="page"][b-byojahfz8x] {
    color: var(--brand-text-main, #232323);
    font-weight: 600;
}

.iam-header[b-byojahfz8x] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--iam-space-3);
    padding-top: var(--iam-space-4);
    margin-bottom: var(--iam-space-4);
}

.iam-header h1[b-byojahfz8x] {
    margin: 0 0 0.35rem;
    font-size: 1.75rem;
}

.iam-header__subtitle[b-byojahfz8x] {
    margin: 0;
    color: var(--brand-text-muted, #5d7a7a);
}

.iam-card[b-byojahfz8x] {
    background: #fff;
    border: 1px solid var(--brand-border, #d8e8e8);
    border-radius: var(--iam-radius);
    box-shadow: var(--iam-shadow);
    padding: var(--iam-space-4);
    margin-bottom: var(--iam-space-4);
}

.iam-card h2[b-byojahfz8x] {
    font-size: 1.15rem;
    margin: 0 0 0.25rem;
}

.iam-card__header[b-byojahfz8x] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--iam-space-3);
    margin-bottom: var(--iam-space-4);
}

.iam-card__actions[b-byojahfz8x] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.iam-banner[b-byojahfz8x] {
    border-radius: 0.5rem;
    padding: var(--iam-space-3) var(--iam-space-4);
    margin-bottom: var(--iam-space-4);
}

.iam-banner strong[b-byojahfz8x] {
    display: block;
    margin-bottom: 0.25rem;
}

.iam-banner--error[b-byojahfz8x] {
    background: #fff2f2;
    border: 1px solid #f3c9c9;
    color: #6d1e1e;
    max-width: 72rem;
    margin: var(--iam-space-4) auto;
}

.iam-banner--success[b-byojahfz8x] {
    background: #f0fdf4;
    border: 1px solid #bbf7d0;
    color: #14532d;
}

.transport-wizard--themed .iam-banner--success[b-byojahfz8x] {
    background: color-mix(in srgb, #10b981 18%, var(--brand-surface, #fff));
    border-color: #10b981;
    color: var(--brand-text-main, inherit);
}

@media (max-width: 640px) {
    .iam-header[b-byojahfz8x] {
        flex-direction: column;
    }

    .iam-card__header[b-byojahfz8x] {
        flex-direction: column;
        align-items: stretch;
    }
}

/* Same theming approach as ProfileWizard.razor.css's own .profile-wizard--themed - .iam-card/
   .iam-breadcrumbs/.iam-header above already reference --brand-* custom properties with
   light-theme fallbacks, so ThemedHead alone re-colors accents/borders automatically once this
   class is present; only the page/card backgrounds and body text need an explicit override. */
.transport-wizard--themed[b-byojahfz8x] {
    background: var(--brand-page-bg, transparent);
    color: var(--brand-text-main, inherit);
}

.transport-wizard--themed .iam-header__subtitle[b-byojahfz8x] {
    color: var(--brand-text-muted, #5d7a7a);
}

.transport-wizard--themed .iam-card[b-byojahfz8x] {
    background: var(--brand-surface, #fff);
    border-color: var(--brand-border, #d8e8e8);
}

/* Bootstrap's default .form-control is a light control (white background, dark text) - wrong
   on BOOST's dark surface. Same treatment ProfileWizard.razor.css/Welcome.razor's own
   .welcome-form already use. */
.transport-wizard--themed .form-control[b-byojahfz8x] {
    background-color: color-mix(in srgb, var(--brand-surface) 80%, black);
    border-color: var(--brand-border, #cbd5e1);
    color: var(--brand-text-main, inherit);
}

.transport-wizard--themed .form-control[b-byojahfz8x]::placeholder {
    color: var(--brand-text-muted);
    opacity: 0.7;
}

.transport-wizard--themed .form-control:focus[b-byojahfz8x] {
    background-color: color-mix(in srgb, var(--brand-surface) 80%, black);
    border-color: var(--brand-accent, #2563eb);
    color: var(--brand-text-main, inherit);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand-accent) 20%, transparent);
}

/* Bootstrap's .text-muted is a fixed grey tuned for a light card - on Boost's dark
   --brand-surface card that grey is nearly invisible, so it needs to follow the theme's own
   muted color instead. */
.transport-wizard--themed .text-muted[b-byojahfz8x] {
    color: var(--brand-text-muted, #6c757d) !important;
}

.transport-method-grid[b-byojahfz8x] {
    display: grid;
    /* auto-fit (not auto-fill) - with only 3 cards, auto-fill reserves as many empty columns as
       the row has room for, squeezing the real cards to the left; auto-fit collapses those empty
       tracks so the existing cards stretch to fill the row instead. */
    grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
    gap: 1rem;
}

.transport-method-card[b-byojahfz8x] {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    text-align: left;
    background: var(--brand-surface, #fff);
    border: 2px solid var(--brand-border, #d8e8e8);
    border-radius: var(--brand-radius, 0.6rem);
    padding: 1rem;
    cursor: pointer;
    /* Browsers give <button> its own default text color (not inherited from the page like a
       plain <div> would), so without this its <strong> title stays dark/invisible against
       BOOST's dark card even though everything around it already follows the theme. */
    color: var(--brand-text-main, inherit);
}

.transport-method-card:not(:disabled):hover[b-byojahfz8x],
.transport-method-card:not(.transport-method-card--disabled):hover[b-byojahfz8x] {
    border-color: var(--brand-accent, #185354);
}

.transport-method-card--recommended[b-byojahfz8x] {
    border-color: var(--brand-accent, #185354);
}

.transport-method-card--disabled[b-byojahfz8x] {
    opacity: 0.6;
    cursor: not-allowed;
}

.transport-method-card__icon[b-byojahfz8x] {
    font-size: 1.5rem;
}

.transport-method-card__badge[b-byojahfz8x] {
    display: inline-block;
    align-self: flex-start;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--brand-accent, #185354);
    background: var(--brand-accent-soft, #eef6f6);
    border-radius: 999px;
    padding: 0.15rem 0.6rem;
}

.transport-station-option[b-byojahfz8x] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    border: 1px solid var(--brand-border, #d8e8e8);
    border-radius: var(--brand-radius, 0.6rem);
    padding: 0.6rem 0.8rem;
    cursor: pointer;
}

.transport-station-option.is-selected[b-byojahfz8x] {
    border-color: var(--brand-accent, #185354);
    background: var(--brand-accent-soft, #eef6f6);
}

.transport-timeline[b-byojahfz8x] {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}

.transport-timeline__step[b-byojahfz8x] {
    display: flex;
    align-items: baseline;
    gap: 0.85rem;
    border-left: 2px solid var(--brand-border, #d8e8e8);
    padding: 0.1rem 0 0.1rem 1rem;
}

.transport-timeline__step-time[b-byojahfz8x] {
    flex-shrink: 0;
    min-width: 3.4rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    color: var(--brand-accent, #185354);
}

.transport-timeline__step-label[b-byojahfz8x] {
    color: var(--brand-text-main, inherit);
}

.transport-timeline__staff[b-byojahfz8x] {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid var(--brand-border, #d8e8e8);
}

.transport-timeline__step--staff[b-byojahfz8x] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.transport-staff-photo[b-byojahfz8x] {
    width: 8rem;
    height: 8rem;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
}

/* ==================== Travel-pass redesign ====================
   A single-column stack, boarding-pass-first - see TransportWizard.razor's own
   RenderTravelExperience. Every "iam-card" sibling here reuses that shared card treatment
   (already theme-aware via .transport-wizard--themed above) so only the pass itself needs its
   own distinct, more prominent visual language. */
.transport-pass-page[b-byojahfz8x] {
    display: flex;
    flex-direction: column;
    gap: var(--iam-space-4);
}

.transport-pass[b-byojahfz8x] {
    position: relative;
    background: linear-gradient(160deg, color-mix(in srgb, var(--brand-accent, #185354) 22%, var(--brand-surface, #fff)) 0%, var(--brand-surface, #fff) 55%);
    border: 1px solid var(--brand-border, #d8e8e8);
    border-radius: calc(var(--brand-radius, 0.6rem) * 1.4);
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.18);
    padding: var(--iam-space-4) var(--iam-space-4) 0;
    color: var(--brand-text-main, inherit);
    overflow: hidden;
}

.transport-pass[b-byojahfz8x]::before {
    content: "";
    position: absolute;
    inset: 0 0 auto 0;
    height: 0.35rem;
    background: var(--brand-accent, #185354);
}

.transport-pass--pending[b-byojahfz8x]::before { background: #d9a521; }
.transport-pass--transit[b-byojahfz8x]::before { background: #3b82f6; }
.transport-pass--arrived[b-byojahfz8x]::before { background: #10b981; }
.transport-pass--modified[b-byojahfz8x]::before { background: #f97316; }
.transport-pass--confirmed[b-byojahfz8x]::before { background: var(--brand-accent, #10b981); }

/* Status/countdown live here now, right next to the eyebrow - the spec's own priority order
   ("in 3 seconds") puts confirmation-of-status ahead of the train number, which moved down to
   .transport-pass__train-chip below the big station/time row instead of being the page's
   biggest heading. */
.transport-pass__eyebrow-row[b-byojahfz8x] {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 0.6rem;
    margin-top: 0.5rem;
    margin-bottom: 0.85rem;
}

.transport-pass__eyebrow[b-byojahfz8x] {
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    color: var(--brand-text-muted, #5d7a7a);
}

.transport-pass__status[b-byojahfz8x] {
    font-size: 0.85rem;
    font-weight: 700;
}

.transport-pass__countdown[b-byojahfz8x] {
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--brand-accent, #185354);
}

/* The core "when do I leave / when do I arrive" answer - deliberately the single largest text
   on the page (spec: "these should be larger than all other transport information"). */
.transport-pass__journey[b-byojahfz8x] {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 1rem;
}

.transport-pass__stop[b-byojahfz8x] {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    min-width: 0;
}

.transport-pass__stop--end[b-byojahfz8x] {
    align-items: flex-end;
    text-align: right;
}

.transport-pass__stop-label[b-byojahfz8x] {
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    color: var(--brand-accent, #185354);
}

.transport-pass__stop-name[b-byojahfz8x] {
    font-size: 0.95rem;
    color: var(--brand-text-muted, #5d7a7a);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.transport-pass__stop-time[b-byojahfz8x] {
    font-size: 2.5rem;
    font-weight: 800;
    line-height: 1;
    font-variant-numeric: tabular-nums;
}

.transport-pass__arrow[b-byojahfz8x] {
    font-size: 1.5rem;
    color: var(--brand-accent, #185354);
}

/* Train number/duration are secondary, supporting facts now - a plain pill row underneath the
   big station/time headline rather than the page's main heading (spec: "numer pociągu powinien
   być informacją pomocniczą, a nie głównym nagłówkiem"). */
.transport-pass__meta-row[b-byojahfz8x] {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
    margin-bottom: 0.75rem;
}

.transport-pass__train-chip[b-byojahfz8x],
.transport-pass__chip[b-byojahfz8x] {
    font-size: 0.85rem;
    font-weight: 600;
    padding: 0.25rem 0.7rem;
    border-radius: 999px;
    background: var(--brand-accent-soft, #eef6f6);
    color: var(--brand-accent, #185354);
}

/* A transfer needs the full hand-off spelled out (arrival platform → departure platform, both
   trains' own times) right in the hero, not a vague "you have a connection" note - spec:
   "Połączenia przesiadkowe muszą mieć timeline" / legible platform-to-platform detail. */
.transport-pass__transfer-note[b-byojahfz8x] {
    display: flex;
    gap: 0.6rem;
    align-items: flex-start;
    padding: 0.75rem 1rem;
    margin-bottom: 0.85rem;
    border: 1px solid var(--brand-border, #d8e8e8);
    border-radius: var(--brand-radius, 0.6rem);
    background: color-mix(in srgb, var(--brand-surface, #fff) 92%, black);
}

.transport-pass__transfer-note-icon[b-byojahfz8x] {
    font-size: 1.2rem;
    flex-shrink: 0;
}

.transport-pass__transfer-note-detail[b-byojahfz8x] {
    font-size: 0.9rem;
    color: var(--brand-text-muted, #5d7a7a);
    font-variant-numeric: tabular-nums;
}

/* The perforated "boarding pass stub" - a dashed tear-line divider, same visual grammar as a
   real paper ticket / Apple Wallet card. */
.transport-pass__stub[b-byojahfz8x] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin: 0 -1.25rem;
    padding: 1rem 1.25rem;
    border-top: 2px dashed var(--brand-border, #d8e8e8);
    background: color-mix(in srgb, var(--brand-surface, #fff) 92%, black);
}

.transport-pass__stub-info[b-byojahfz8x] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    min-width: 0;
}

.transport-pass__stub-name[b-byojahfz8x] {
    font-weight: 700;
}

.transport-pass__stub-label[b-byojahfz8x] {
    font-size: 0.85rem;
    color: var(--brand-text-muted, #5d7a7a);
}

/* Deliberately its own distinct, high-contrast card (spec: "ta informacja musi być bardziej
   widoczna niż komunikaty organizacyjne") - a solid accent fill rather than the soft-tint
   treatment every other card on this page uses, so it reads as more urgent than the alerts
   section below it, not just another equally-weighted box. */
.transport-gathering[b-byojahfz8x] {
    background: var(--brand-accent, #185354);
    color: #fff;
    border-radius: var(--iam-radius);
    padding: var(--iam-space-4);
    margin-bottom: var(--iam-space-4);
    box-shadow: var(--iam-shadow);
}

.transport-gathering__badge[b-byojahfz8x] {
    font-size: 0.8rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    margin-bottom: 0.35rem;
    opacity: 0.9;
}

.transport-gathering__time[b-byojahfz8x] {
    font-size: 2.5rem;
    font-weight: 800;
    line-height: 1;
    font-variant-numeric: tabular-nums;
    margin-bottom: 0.35rem;
}

.transport-gathering__place[b-byojahfz8x] {
    font-size: 1.05rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
}

.transport-gathering__platform[b-byojahfz8x] {
    font-weight: 700;
}

.transport-gathering__note[b-byojahfz8x] {
    margin: 0;
    font-size: 0.9rem;
    opacity: 0.9;
}

/* Big, unambiguous ODJAZD/PRZYJAZD tiles - same visual grammar as an airline boarding pass's
   GATE/SEAT boxes (spec: "perony powinny być bardzo duże i jednoznaczne", "make wagon and peron
   more visible"), and each tile is explicitly labeled so it's never ambiguous which leg a peron
   number belongs to. */
.transport-platforms[b-byojahfz8x] {
    display: flex;
    gap: 0.75rem;
    margin-bottom: var(--iam-space-4);
}

.transport-platforms__tile[b-byojahfz8x] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    padding: 0.85rem 1.1rem;
    border: 2px solid var(--brand-accent, #185354);
    border-radius: var(--iam-radius);
    background: var(--brand-surface, #fff);
}

.transport-platforms__tile--arrival[b-byojahfz8x] {
    border-color: var(--brand-border, #d8e8e8);
}

.transport-platforms__label[b-byojahfz8x] {
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    color: var(--brand-text-muted, #5d7a7a);
}

.transport-platforms__value[b-byojahfz8x] {
    font-size: 1.5rem;
    font-weight: 800;
    line-height: 1.15;
    color: var(--brand-accent, #185354);
}

.transport-platforms__tile--arrival .transport-platforms__value[b-byojahfz8x] {
    color: var(--brand-text-main, inherit);
}

.transport-platforms__sub[b-byojahfz8x] {
    font-size: 0.85rem;
    color: var(--brand-text-muted, #5d7a7a);
}

.transport-todo__list[b-byojahfz8x] {
    margin: 0;
    padding-left: 1.1rem;
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.transport-alerts[b-byojahfz8x] {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}

.transport-alert[b-byojahfz8x] {
    border-radius: var(--brand-radius, 0.6rem);
    padding: 0.75rem 1rem;
    border: 1px solid transparent;
}

.transport-alert strong[b-byojahfz8x] {
    display: block;
    margin-bottom: 0.2rem;
}

.transport-alert--info[b-byojahfz8x] {
    background: var(--brand-accent-soft, #eef6f6);
    border-color: var(--brand-border, #d8e8e8);
    color: var(--brand-text-main, inherit);
}

.transport-alert--warning[b-byojahfz8x] {
    background: color-mix(in srgb, #d9a521 18%, var(--brand-surface, #fff));
    border-color: #d9a521;
    color: var(--brand-text-main, inherit);
}

.transport-alert--urgent[b-byojahfz8x] {
    background: color-mix(in srgb, #dc2626 18%, var(--brand-surface, #fff));
    border-color: #dc2626;
    color: var(--brand-text-main, inherit);
}

.transport-alert--urgent a[b-byojahfz8x] {
    font-size: 1.3rem;
    font-weight: 800;
    color: inherit;
}

/* The 6 facts the spec calls out for a phone's first screen (departure station/time/platform,
   gathering time, arrival station/time) all live in the hero + gathering + platforms sections in
   that exact order - this query only tightens their own spacing/type-scale so all three fit
   without scrolling; everything below (todo/alerts/timeline/destination) is unaffected. */
@media (max-width: 640px) {
    .transport-pass[b-byojahfz8x] {
        padding: var(--iam-space-3) var(--iam-space-3) 0;
    }

    .transport-pass__stop-time[b-byojahfz8x] {
        font-size: 1.8rem;
    }

    .transport-pass__stub[b-byojahfz8x] {
        flex-direction: column;
        align-items: flex-start;
    }

    .transport-gathering[b-byojahfz8x] {
        padding: 0.85rem 1rem;
        margin-bottom: 0.85rem;
    }

    .transport-gathering__time[b-byojahfz8x] {
        font-size: 2rem;
    }

    .transport-platforms[b-byojahfz8x] {
        margin-bottom: 0.85rem;
    }

    .transport-platforms__tile[b-byojahfz8x] {
        padding: 0.6rem 0.85rem;
    }

    .transport-platforms__value[b-byojahfz8x] {
        font-size: 1.25rem;
    }
}
/* _content/InuniSphere.Web/Components/Pages/ZarzadzajStrona/ContentManagementHub.razor.rz.scp.css */
.content-management-hub[b-bqgus7ruyz] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 2rem 1.25rem 3rem;
}

.content-management-hub__grid[b-bqgus7ruyz] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
    gap: 1.25rem;
    max-width: 44rem;
}
/* _content/InuniSphere.Web/Components/Pages/ZarzadzajStrona/ZarzadzajStrona.razor.rz.scp.css */
.zarzadzaj-strona[b-hzwn74dgzv] {
    width: 100%;
    margin: 0;
    padding: 2rem 2rem 3rem;
}

.zarzadzaj-strona__layout[b-hzwn74dgzv] {
    display: grid;
    grid-template-columns: 16rem minmax(0, 1fr);
    gap: 1.5rem;
    align-items: start;
}

.zarzadzaj-strona__pages[b-hzwn74dgzv] {
    display: flex;
    flex-direction: column;
    gap: .1rem;
    border: 1px solid var(--brand-border, #d8e8e8);
    border-radius: var(--brand-radius, .5rem);
    padding: .5rem;
    background: var(--brand-surface, #fff);
    position: sticky;
    top: 1rem;
}

.zarzadzaj-strona__pages-toolbar[b-hzwn74dgzv] {
    display: flex;
    gap: .4rem;
    padding: 0 .3rem .5rem;
    margin-bottom: .25rem;
    border-bottom: 1px solid var(--brand-border, #e5e5e5);
}

.zarzadzaj-strona__pages-toolbar-btn[b-hzwn74dgzv] {
    background: none;
    border: 0;
    padding: 0;
    font-size: .72rem;
    font-weight: 600;
    color: var(--brand-accent, #0F6E56);
    cursor: pointer;
}

.zarzadzaj-strona__pages-toolbar-btn:hover[b-hzwn74dgzv] {
    text-decoration: underline;
}

.zarzadzaj-strona__pages-toolbar-btn:not(:first-child)[b-hzwn74dgzv] {
    border-left: 1px solid var(--brand-border, #d8e8e8);
    padding-left: .4rem;
}

.zarzadzaj-strona__pages-group[b-hzwn74dgzv] {
    display: flex;
    align-items: center;
    gap: .35rem;
    width: 100%;
    margin: .8rem 0 .25rem;
    padding: 0 .3rem .25rem;
    background: none;
    border: 0;
    border-bottom: 1px solid var(--brand-border, #e5e5e5);
    font: inherit;
    font-size: .66rem;
    font-weight: 700;
    text-align: left;
    text-transform: uppercase;
    letter-spacing: .1em;
    color: var(--brand-text-muted, #93a5a5);
    cursor: pointer;
}

.zarzadzaj-strona__pages-group:hover[b-hzwn74dgzv] {
    color: var(--brand-text-main, #0B2620);
}

.zarzadzaj-strona__pages-group-caret[b-hzwn74dgzv] {
    font-size: .6rem;
    flex: none;
}

.zarzadzaj-strona__pages-group-row:first-of-type .zarzadzaj-strona__pages-group[b-hzwn74dgzv] {
    margin-top: 0;
}

.zarzadzaj-strona__pages-group-row[b-hzwn74dgzv] {
    display: flex;
    align-items: center;
    gap: .15rem;
}

.zarzadzaj-strona__pages-group-row .zarzadzaj-strona__pages-group[b-hzwn74dgzv] {
    flex: 1;
    width: auto;
}

.zarzadzaj-strona__pages-group-navbtn[b-hzwn74dgzv] {
    flex: none;
    background: none;
    border: 0;
    font-size: .78rem;
    line-height: 1;
    padding: 0 .2rem;
    margin-top: .25rem;
    cursor: pointer;
    opacity: .55;
}

.zarzadzaj-strona__pages-group-navbtn:hover[b-hzwn74dgzv] {
    opacity: 1;
}

.zarzadzaj-strona__page-item[b-hzwn74dgzv] {
    text-align: left;
    background: none;
    border: 0;
    border-left: 3px solid transparent;
    border-radius: calc(var(--brand-radius, .5rem) - .15rem);
    padding: .5rem .7rem;
    font: inherit;
    font-size: .85rem;
    color: var(--brand-text-muted, #5d7a7a);
    cursor: pointer;
    transition: background .12s ease, color .12s ease;
}

.zarzadzaj-strona__page-item--sub[b-hzwn74dgzv] {
    padding-left: 1.35rem;
    font-size: .82rem;
}

.zarzadzaj-strona__page-item:hover[b-hzwn74dgzv] {
    background: var(--brand-accent-soft, #eaf4f1);
}

.zarzadzaj-strona__page-item--active[b-hzwn74dgzv] {
    background: var(--brand-accent-soft, #eaf4f1);
    color: var(--brand-accent, #0F6E56);
    border-left-color: var(--brand-accent, #0F6E56);
    font-weight: 600;
}

.zarzadzaj-strona__editor-column[b-hzwn74dgzv] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    min-width: 0;
}

.zarzadzaj-strona__editor-head[b-hzwn74dgzv] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    border: 1px solid var(--brand-border, #d8e8e8);
    border-radius: var(--brand-radius, .5rem);
    padding: 1rem 1.25rem;
    background: var(--brand-surface, #fff);
}

.zarzadzaj-strona__editor-title[b-hzwn74dgzv] {
    margin: 0;
    font-size: 1.1rem;
    color: var(--brand-text-main, #0B2620);
}

.zarzadzaj-strona__modal-confirm-actions[b-hzwn74dgzv] {
    display: flex;
    justify-content: flex-end;
    gap: .5rem;
    margin-top: 1.25rem;
}

@media (max-width: 760px) {
    .zarzadzaj-strona__layout[b-hzwn74dgzv] {
        grid-template-columns: 1fr;
    }

    .zarzadzaj-strona__pages[b-hzwn74dgzv] {
        flex-direction: row;
        flex-wrap: wrap;
        position: static;
    }
}

.zarzadzaj-strona__pages-add-btn[b-hzwn74dgzv] {
    width: 100%;
    margin: 0 0 .6rem;
    padding: .4rem .5rem;
    background: var(--brand-surface-alt, #f1f7f5);
    border: 1px dashed var(--brand-accent, #0F6E56);
    border-radius: .4rem;
    font-size: .74rem;
    font-weight: 600;
    color: var(--brand-accent, #0F6E56);
    cursor: pointer;
}

.zarzadzaj-strona__commodities-list[b-hzwn74dgzv] {
    display: flex;
    flex-direction: column;
    gap: .1rem;
    margin: 0 0 .6rem;
}

.zarzadzaj-strona__commodities-row[b-hzwn74dgzv] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    padding: .3rem .3rem;
    font-size: .78rem;
    color: var(--brand-text-muted, #5d7a7a);
}

.zarzadzaj-strona__pages-add-btn:hover[b-hzwn74dgzv] {
    background: var(--brand-accent, #0F6E56);
    color: #fff;
}

.zarzadzaj-strona__navtree-item[b-hzwn74dgzv] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    padding: .5rem .6rem;
    border: 1px solid var(--brand-border, #d8e8e8);
    border-radius: var(--brand-radius, .5rem);
    margin-bottom: .35rem;
    font-size: .85rem;
    color: var(--brand-text-main, #0B2620);
}

.zarzadzaj-strona__navtree-item--child[b-hzwn74dgzv] {
    margin-left: 1.25rem;
    color: var(--brand-text-muted, #5d7a7a);
}

.zarzadzaj-strona__navtree-fields[b-hzwn74dgzv] {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    flex: 1;
}

.zarzadzaj-strona__navtree-fields > *[b-hzwn74dgzv] {
    flex: 1 1 10rem;
    min-width: 8rem;
}

.zarzadzaj-strona__navtree-toolbar[b-hzwn74dgzv] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .5rem;
    margin-bottom: .5rem;
}

.zarzadzaj-strona__navtree-toolbar > span[b-hzwn74dgzv] {
    margin-right: auto;
}

.zarzadzaj-strona__pages-form[b-hzwn74dgzv] {
    display: flex;
    flex-direction: column;
    gap: .75rem;
}

.zarzadzaj-strona__pages-form-checkbox[b-hzwn74dgzv] {
    display: flex;
    align-items: center;
    gap: .4rem;
    font-size: .85rem;
}

/* ---- "Nawigacja i stopka" menu editor - same card language as the page builder's own
   component list (.zarzadzaj-strona__component*): white cards, thin brand border, a compact
   head row, edit fields revealed on demand. Nested columns/items indent with a guide line. ---- */
.navedit[b-hzwn74dgzv] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.navedit__group[b-hzwn74dgzv] {
    display: flex;
    flex-direction: column;
    gap: .6rem;
}

.navedit__group-title[b-hzwn74dgzv] {
    margin: 0;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--brand-text-muted, #5d7a7a);
}

.navedit__hint[b-hzwn74dgzv] {
    margin: 0;
    font-size: .82rem;
    line-height: 1.5;
    color: var(--brand-text-muted, #5d7a7a);
}

.navedit__fields[b-hzwn74dgzv] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
    gap: .6rem;
}

.navedit__list[b-hzwn74dgzv] {
    display: flex;
    flex-direction: column;
    gap: .45rem;
}

.navedit__card[b-hzwn74dgzv] {
    border: 1px solid var(--brand-border, #d8e8e8);
    border-radius: var(--brand-radius, .5rem);
    background: #fff;
    transition: box-shadow .12s ease, border-color .12s ease;
}

.navedit__card--column[b-hzwn74dgzv],
.navedit__card--item[b-hzwn74dgzv] {
    background: var(--brand-page-bg, #fff);
}

.navedit__card.navedit--drop-target[b-hzwn74dgzv],
.navedit__dropend.navedit--drop-target[b-hzwn74dgzv] {
    border-color: var(--brand-accent, #0F6E56);
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--brand-accent, #0F6E56) 25%, transparent);
}

.navedit__head[b-hzwn74dgzv] {
    display: flex;
    align-items: center;
    gap: .55rem;
    padding: .5rem .6rem;
    min-height: 2.5rem;
}

.navedit__handle[b-hzwn74dgzv] {
    flex: none;
    cursor: grab;
    user-select: none;
    color: var(--brand-text-muted, #5d7a7a);
    font-size: .9rem;
    letter-spacing: -.1em;
    padding: 0 .15rem;
}

.navedit__handle:active[b-hzwn74dgzv] {
    cursor: grabbing;
}

.navedit__title[b-hzwn74dgzv] {
    flex: 0 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-align: left;
    background: none;
    border: 0;
    padding: 0;
    font: inherit;
    font-weight: 600;
    font-size: .9rem;
    color: var(--brand-text-main, #0B2620);
    cursor: pointer;
}

.navedit__title:hover[b-hzwn74dgzv] {
    color: var(--brand-accent, #0F6E56);
}

.navedit__title--column[b-hzwn74dgzv] {
    font-size: .78rem;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.navedit__title--item[b-hzwn74dgzv] {
    font-weight: 500;
    font-size: .85rem;
}

.navedit__url[b-hzwn74dgzv] {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: .75rem;
    color: var(--brand-text-muted, #5d7a7a);
}

.navedit__actions[b-hzwn74dgzv] {
    flex: none;
    margin-left: auto;
    display: flex;
    gap: .15rem;
}

.navedit__actions button[b-hzwn74dgzv] {
    background: none;
    border: 0;
    border-radius: .25rem;
    cursor: pointer;
    padding: .2rem .4rem;
    color: var(--brand-text-muted, #5d7a7a);
}

.navedit__actions button:hover[b-hzwn74dgzv] {
    background: var(--brand-accent-soft, #eaf4f1);
    color: var(--brand-text-main, #0B2620);
}

.navedit__body[b-hzwn74dgzv] {
    border-top: 1px solid var(--brand-border, #d8e8e8);
    padding: .75rem .6rem;
}

.navedit__children[b-hzwn74dgzv] {
    display: flex;
    flex-direction: column;
    gap: .35rem;
    margin: 0 .6rem .6rem 1.4rem;
    padding-left: .75rem;
    border-left: 2px solid var(--brand-accent-soft, #eaf4f1);
}

.navedit__add[b-hzwn74dgzv] {
    align-self: flex-start;
    background: none;
    border: 0;
    padding: .25rem 0;
    font-size: .78rem;
    font-weight: 600;
    color: var(--brand-accent, #0F6E56);
    cursor: pointer;
}

.navedit__add:hover[b-hzwn74dgzv] {
    text-decoration: underline;
}

.navedit__dropend[b-hzwn74dgzv] {
    border: 1px dashed var(--brand-border, #d8e8e8);
    border-radius: var(--brand-radius, .5rem);
    padding: .6rem;
    text-align: center;
    font-size: .78rem;
    color: var(--brand-text-muted, #5d7a7a);
}
/* _content/InuniSphere.Web/Components/Shared/Avatar.razor.rz.scp.css */
.app-avatar[b-333byafpq0] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    border-radius: 50%;
    color: #fff;
    font-weight: 600;
    letter-spacing: .02em;
    overflow: hidden;
}

.app-avatar--normal[b-333byafpq0] {
    width: 1.75rem;
    height: 1.75rem;
    font-size: .68rem;
}

.app-avatar--small[b-333byafpq0] {
    width: 1.4rem;
    height: 1.4rem;
    font-size: .58rem;
}

.app-avatar__photo[b-333byafpq0] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
/* _content/InuniSphere.Web/Components/Shared/Banner.razor.rz.scp.css */
/* Ported from the "INUNI banery zdjęciowe" reference's own ".banner"/".field"/".tile"/
   ".scrim"/".banner__inner" block - same grid/marquee mechanics, reskinned onto
   var(--brand-*, <institutional default>) so it inherits whatever ThemedHead the host
   page already applies, the same way Login/InuniNav do. */
.banner[b-rfuf0awgd1] {
    position: relative;
    background: var(--brand-text-main, #0B2620);
    border-bottom: 1px solid var(--brand-border, rgba(11, 38, 32, 0.16));
    overflow: hidden;
}

.field[b-rfuf0awgd1] {
    position: absolute;
    inset: 0;
    display: grid;
    gap: 2px;
    grid-template-columns: repeat(var(--cols), 1fr);
    grid-template-rows: repeat(var(--rows), 1fr);
}

.tile[b-rfuf0awgd1] {
    position: relative;
    overflow: hidden;
    background: color-mix(in srgb, var(--brand-text-main, #0B2620) 88%, #63BCC4);
}

.tile:nth-child(3n)[b-rfuf0awgd1] {
    background: color-mix(in srgb, var(--brand-text-main, #0B2620) 78%, #63BCC4);
}

.tile:nth-child(4n)[b-rfuf0awgd1] {
    background: color-mix(in srgb, var(--brand-text-main, #0B2620) 94%, #63BCC4);
}

.tile:nth-child(5n)[b-rfuf0awgd1] {
    background: color-mix(in srgb, var(--brand-text-main, #0B2620) 70%, #63BCC4);
}

.tile img[b-rfuf0awgd1] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    /* A photo bigger than its tile is cropped evenly from every side, keeping its middle. */
    object-position: center;
    display: block;
    filter: saturate(0.6) contrast(1.05) brightness(0.92);
}

.banner--no-filter .tile img[b-rfuf0awgd1] {
    filter: none;
}

.tile a[b-rfuf0awgd1] {
    display: block;
    width: 100%;
    height: 100%;
}

.tile--wide[b-rfuf0awgd1] {
    grid-column: span 2;
}

.tile--tall[b-rfuf0awgd1] {
    grid-row: span 2;
}

.tile--hero[b-rfuf0awgd1] {
    grid-column: span 4;
    grid-row: span 4;
}

.tile--med[b-rfuf0awgd1] {
    grid-column: span 2;
    grid-row: span 2;
}

.tile--half[b-rfuf0awgd1] {
    grid-row: span 2;
}

.scrim[b-rfuf0awgd1] {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.scrim--left[b-rfuf0awgd1] {
    background: linear-gradient(90deg,
        color-mix(in srgb, var(--brand-text-main, #0B2620) 95%, transparent) 0%,
        color-mix(in srgb, var(--brand-text-main, #0B2620) 86%, transparent) 32%,
        color-mix(in srgb, var(--brand-text-main, #0B2620) 50%, transparent) 64%,
        color-mix(in srgb, var(--brand-text-main, #0B2620) 22%, transparent) 100%);
}

.scrim--center[b-rfuf0awgd1] {
    background: radial-gradient(ellipse at 50% 55%,
        color-mix(in srgb, var(--brand-text-main, #0B2620) 90%, transparent) 0%,
        color-mix(in srgb, var(--brand-text-main, #0B2620) 78%, transparent) 45%,
        color-mix(in srgb, var(--brand-text-main, #0B2620) 55%, transparent) 100%);
}

.scrim--bottom[b-rfuf0awgd1] {
    background: linear-gradient(180deg,
        color-mix(in srgb, var(--brand-text-main, #0B2620) 42%, transparent) 0%,
        color-mix(in srgb, var(--brand-text-main, #0B2620) 72%, transparent) 55%,
        color-mix(in srgb, var(--brand-text-main, #0B2620) 93%, transparent) 100%);
}

.banner__inner[b-rfuf0awgd1] {
    position: relative;
    max-width: 1280px;
    margin: 0 auto;
    padding: clamp(48px, 6.5vw, 86px) clamp(16px, 3vw, 36px) clamp(44px, 5.5vw, 76px);
    min-height: clamp(290px, 36vw, 410px);
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}

.banner__inner--center[b-rfuf0awgd1] {
    align-items: center;
    text-align: center;
    justify-content: center;
}

.banner__inner--center .banner__title[b-rfuf0awgd1],
.banner__inner--center .banner__lede[b-rfuf0awgd1] {
    margin-left: auto;
    margin-right: auto;
}

.banner__eyebrow[b-rfuf0awgd1] {
    display: flex;
    align-items: center;
    gap: 14px;
    font-size: 9.5px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.62);
    margin: 0 0 20px;
}

.banner__eyebrow[b-rfuf0awgd1]::after {
    content: "";
    flex: 0 0 56px;
    height: 1px;
    background: rgba(255, 255, 255, 0.32);
}

.banner__inner--center .banner__eyebrow[b-rfuf0awgd1]::after {
    display: none;
}

.banner__title[b-rfuf0awgd1] {
    font-family: var(--brand-font-serif, "Libre Baskerville", Georgia, "Times New Roman", serif);
    font-weight: 400;
    font-size: clamp(25px, 3.2vw, 41px);
    line-height: 1.24;
    color: #fff;
    margin: 0;
    max-width: 18ch;
}

/* An image (e.g. a logo) in place of the title text. */
.banner__title--image[b-rfuf0awgd1] {
    max-width: none;
    line-height: 0;
}

.banner__title--image img[b-rfuf0awgd1] {
    display: block;
    width: auto;
    height: auto;
    max-width: min(100%, 520px);
    max-height: clamp(80px, 14vw, 180px);
}

.banner__lede[b-rfuf0awgd1] {
    font-size: 14px;
    line-height: 1.75;
    color: rgba(255, 255, 255, 0.74);
    margin: 18px 0 0;
    max-width: 48ch;
}

.banner__actions[b-rfuf0awgd1] {
    display: flex;
    gap: 14px;
    margin-top: 30px;
    flex-wrap: wrap;
}

.btn[b-rfuf0awgd1] {
    display: inline-flex;
    align-items: center;
    font-size: 10.5px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    padding: 15px 28px;
    border-radius: 0;
    border: 1px solid transparent;
    transition: background 0.12s ease, border-color 0.12s ease;
}

/* Button colours are overridable per banner (Banner.ButtonStyle - the Hero/"Baner zdjęciowy"
   blocks' own button colour fields); the fallbacks are the reference's own look. */
.btn--light[b-rfuf0awgd1] {
    background: var(--banner-btn-bg, #fff);
    color: var(--banner-btn-text, var(--brand-text-main, #0B2620));
}

.btn--light:hover[b-rfuf0awgd1] {
    background: var(--banner-btn-hover, #F4F3EF);
}

.btn--ghost[b-rfuf0awgd1] {
    border-color: color-mix(in srgb, var(--banner-btn-ghost, #fff) 38%, transparent);
    color: var(--banner-btn-ghost, #fff);
}

.btn--ghost:hover[b-rfuf0awgd1] {
    border-color: var(--banner-btn-ghost, #fff);
    background: color-mix(in srgb, var(--banner-btn-ghost, #fff) 8%, transparent);
}

/* Two rows, each duplicated once by banner-marquee.js so the CSS animation loops
   seamlessly (translateX(-50%) lands exactly back on the first, un-duplicated copy). */
.field--marquee[b-rfuf0awgd1] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.marquee[b-rfuf0awgd1] {
    flex: 1;
    overflow: hidden;
    position: relative;
}

.marquee__track[b-rfuf0awgd1] {
    display: flex;
    gap: 2px;
    height: 100%;
    width: max-content;
    animation: banner-slide-b-rfuf0awgd1 60s linear infinite;
}

.marquee--reverse .marquee__track[b-rfuf0awgd1] {
    animation-direction: reverse;
}

.marquee__track .tile[b-rfuf0awgd1] {
    width: clamp(150px, 14vw, 230px);
    flex: 0 0 auto;
}

@keyframes banner-slide-b-rfuf0awgd1 {
    from {
        transform: translateX(0);
    }

    to {
        transform: translateX(-50%);
    }
}

@media (max-width: 1080px) {
    /* Only the multi-photo grid layouts fold into 3x3 - a Strip keeps its own one row sized to
       its photo count (a single photo would otherwise shrink to the top-left ninth). */
    .field--mosaic[b-rfuf0awgd1],
    .field--hero[b-rfuf0awgd1] {
        --cols: 3 !important;
        --rows: 3 !important;
    }

    .tile--wide[b-rfuf0awgd1], .tile--tall[b-rfuf0awgd1], .tile--med[b-rfuf0awgd1], .tile--half[b-rfuf0awgd1] {
        grid-column: auto;
        grid-row: auto;
    }

    .tile--hero[b-rfuf0awgd1] {
        grid-column: span 3;
        grid-row: span 2;
    }

    .scrim--left[b-rfuf0awgd1] {
        background: linear-gradient(180deg,
            color-mix(in srgb, var(--brand-text-main, #0B2620) 50%, transparent) 0%,
            color-mix(in srgb, var(--brand-text-main, #0B2620) 88%, transparent) 60%,
            color-mix(in srgb, var(--brand-text-main, #0B2620) 95%, transparent) 100%);
    }

    .btn[b-rfuf0awgd1] {
        width: 100%;
        justify-content: center;
    }

    .marquee__track .tile[b-rfuf0awgd1] {
        width: 150px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .marquee__track[b-rfuf0awgd1] {
        animation: none;
    }
}
/* _content/InuniSphere.Web/Components/Shared/BoostNav.razor.rz.scp.css */
/* Values below are ported directly from boost.inuni.org.pl's own compiled stylesheet
   (its BOOST-scoped .site-header override, fetched and read directly - see BoostNav.razor's
   own doc comment) — not approximated from a screenshot. */

.boost-nav[b-ngttl4zp7s] {
    position: relative;
    font-family: var(--brand-font-family, inherit);
    background: var(--brand-page-bg, #0e0e17);
    border-bottom: 2px solid var(--brand-accent, #cf6bff);
}

.boost-nav__grid[b-ngttl4zp7s] {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: 1rem 1.5rem;
    padding: 1rem 1.5rem 0.5rem;
}

/* The public-marketing header's right column stacks TWO rows (utility bar + links), so its
   slightly taller bottom padding balances that extra row visually. IsAppContext drops the
   utility bar, leaving only one (shorter) row - the same asymmetric padding then reads as the
   logo sitting above center instead of vertically centered, so this evens it out for that case. */
.boost-nav--app .boost-nav__grid[b-ngttl4zp7s] {
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
}

.boost-nav__brand[b-ngttl4zp7s] {
    display: flex;
    align-items: center;
    margin-left: 1.5rem;
}

.boost-nav__brand img[b-ngttl4zp7s] {
    height: 3.1rem;
    width: auto;
    display: block;
}

/* The real site's .right-column is a COLUMN-direction flex box - it stacks two right-aligned
   rows (utility links above, main links + sign-in/user below) in the same grid cell next to a
   single vertically-centered logo, rather than one unified row. */
.boost-nav__right[b-ngttl4zp7s] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.45rem;
    width: 100%;
    margin-right: 0.45rem;
}

.boost-nav__utility[b-ngttl4zp7s] {
    display: flex;
    gap: 0.5rem;
    width: 100%;
    justify-content: flex-end;
    min-height: 1.4rem;
}

.boost-nav__utility a[b-ngttl4zp7s] {
    color: var(--brand-text-main, #fff);
    text-decoration: none;
    font-size: 0.92rem;
    padding: 0.25rem 0.55rem;
    border-bottom-left-radius: 0.5rem;
    border-bottom-right-radius: 0.5rem;
    transition: color 0.2s ease, background-color 0.2s ease;
}

.boost-nav__utility a:hover[b-ngttl4zp7s] {
    background-color: var(--brand-accent-soft, #2c214b);
}

.boost-nav__main[b-ngttl4zp7s] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    width: 100%;
    justify-content: flex-end;
}

.boost-nav__links[b-ngttl4zp7s] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.boost-nav__links a[b-ngttl4zp7s] {
    color: var(--brand-text-main, #fff);
    text-decoration: none;
    font-weight: 500;
    padding: 0.45rem 0.75rem;
    border-radius: 0.5rem;
    border: 1px solid transparent;
    transition: color 0.2s ease, background-color 0.2s ease, border-color 0.2s ease;
}

.boost-nav__links a:hover[b-ngttl4zp7s] {
    background: var(--brand-accent-soft, #2c214b);
    border-color: color-mix(in srgb, var(--brand-accent, #cf6bff) 35%, transparent);
}

.boost-nav__discord-btn[b-ngttl4zp7s] {
    color: var(--brand-text-main, #fff);
    font-weight: 500;
    padding: 0.45rem 0.75rem;
    border-radius: 0.5rem;
    border: 1px solid transparent;
    background: transparent;
    font: inherit;
    cursor: pointer;
    transition: color 0.2s ease, background-color 0.2s ease, border-color 0.2s ease;
}

.boost-nav__discord-btn:hover[b-ngttl4zp7s] {
    background: var(--brand-accent-soft, #2c214b);
    border-color: color-mix(in srgb, var(--brand-accent, #cf6bff) 35%, transparent);
}

.boost-nav__discord-btn:disabled[b-ngttl4zp7s] {
    opacity: 0.6;
    cursor: default;
}

.boost-nav__signin[b-ngttl4zp7s] {
    background: var(--brand-accent-strong, #b84df2);
    color: var(--brand-text-main, #fff);
    border: 1px solid transparent;
    border-radius: 0.6rem;
    padding: 0.5rem 1.15rem;
    min-width: 9rem;
    text-align: center;
    text-decoration: none;
    font-weight: 600;
    white-space: nowrap;
}

.boost-nav__signin:hover[b-ngttl4zp7s] {
    background: var(--brand-accent, #cf6bff);
    border-color: rgba(255, 255, 255, 0.25);
}

.boost-nav__user[b-ngttl4zp7s] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.2rem 0.65rem 0.2rem 0.2rem;
    border: 1px solid color-mix(in srgb, var(--brand-accent, #cf6bff) 40%, transparent);
    border-radius: 2rem;
    background: color-mix(in srgb, var(--brand-accent-soft, #2c214b) 75%, transparent);
    max-width: min(36vw, 26rem);
}

.boost-nav__avatar[b-ngttl4zp7s] {
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    background: var(--brand-accent-strong, #b84df2);
    color: var(--brand-text-main, #fff);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.02em;
}

.boost-nav__user-name[b-ngttl4zp7s] {
    font-size: 0.82rem;
    color: var(--brand-text-main, #fff);
    min-width: 0;
    flex: 1 1 auto;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.boost-nav__signout-form[b-ngttl4zp7s] {
    display: contents;
}

.boost-nav__signout[b-ngttl4zp7s] {
    font-size: 0.75rem;
    color: var(--brand-text-muted, #c5bddb);
    background: none;
    border: none;
    line-height: 1;
    padding: 0.1rem 0.4rem;
    border-radius: 50%;
    flex-shrink: 0;
    cursor: pointer;
}

.boost-nav__signout:hover[b-ngttl4zp7s] {
    color: var(--brand-text-main, #fff);
    background: color-mix(in srgb, var(--brand-accent, #cf6bff) 25%, transparent);
}

.boost-nav__toggle[b-ngttl4zp7s] {
    display: none;
}

.boost-nav__toggle-label[b-ngttl4zp7s] {
    display: none;
    flex-direction: column;
    justify-content: center;
    gap: 0.3rem;
    width: 2.25rem;
    height: 2.25rem;
    padding: 0.5rem;
    cursor: pointer;
}

.boost-nav__toggle-label span[b-ngttl4zp7s] {
    display: block;
    height: 2px;
    background: var(--brand-text-main, #fff);
    border-radius: 1px;
}

/* Closes the menu on an outside click without any JS - a second <label> for the same
   checkbox (see BoostNav.razor), invisible and covering the whole viewport, that only exists
   in the DOM's rendered layout while the menu is open. Sits at a lower z-index than the menu
   content itself (.boost-nav__grid, below) so it only catches clicks that land outside the
   actual menu - clicking any real menu item still reaches that item first. */
.boost-nav__scrim[b-ngttl4zp7s] {
    display: none;
}

@media (max-width: 991.98px) {
    /* Absolutely positioned (out of the grid's own flow) so it can sit on the right edge of
       the same row as the logo instead of the full-width row above it this used to render as -
       .boost-nav has position:relative for this to anchor against. */
    .boost-nav__toggle-label[b-ngttl4zp7s] {
        display: flex;
        position: absolute;
        top: 50%;
        right: 1.5rem;
        transform: translateY(-50%);
        /* Must outrank .boost-nav__grid's own z-index: 2 below - equal values are tie-broken by
           DOM order, and .boost-nav__grid comes later in markup, so at z-index:2 its (invisible
           but still present) box silently intercepted every tap meant for this label, even
           though the label was still visibly painted underneath it. This is the actual reason
           the mobile menu button did nothing - unrelated to any browser's :has() support. */
        z-index: 3;
    }

    .boost-nav__grid[b-ngttl4zp7s] {
        position: relative;
        z-index: 2;
    }

    /* Collapsed by default - a floating dropdown card anchored under the hamburger, matching
       the real boost.inuni.org.pl site's own mobile menu, rather than pushing the page's actual
       content down by rendering inline in the grid's normal flow (which is what this looked
       like before - technically "open" but visually just a flat stack of links, not a menu). */
    .boost-nav__main[b-ngttl4zp7s] {
        display: none;
        position: absolute;
        top: 100%;
        right: 1.5rem;
        margin-top: 0.5rem;
        flex-direction: column;
        align-items: stretch;
        justify-content: flex-start;
        gap: 0.35rem;
        width: min(18rem, calc(100vw - 3rem));
        padding: 1rem;
        border-radius: 1rem;
        background: var(--brand-accent-soft, #2c214b);
        box-shadow: 0 16px 40px rgba(0, 0, 0, 0.45);
    }

    .boost-nav__links[b-ngttl4zp7s] {
        width: 100%;
        flex-direction: column;
        align-items: flex-start;
    }

    .boost-nav__user[b-ngttl4zp7s],
    .boost-nav__signin[b-ngttl4zp7s] {
        margin-top: 0.35rem;
    }

    .boost-nav:has(.boost-nav__toggle:checked) .boost-nav__main[b-ngttl4zp7s],
    /* :has() fallback - see InuniNav.razor.css's own comment on this same pattern. */
    .boost-nav--open .boost-nav__main[b-ngttl4zp7s] {
        display: flex;
    }

    .boost-nav:has(.boost-nav__toggle:checked) .boost-nav__scrim[b-ngttl4zp7s],
    .boost-nav--open .boost-nav__scrim[b-ngttl4zp7s] {
        display: block;
        position: fixed;
        inset: 0;
        z-index: 1;
        cursor: default;
    }
}
/* _content/InuniSphere.Web/Components/Shared/Footer.razor.rz.scp.css */
/* Dark institutional footer, same palette family as InuniNav.razor's own --nav-ink/--nav-accent
   (dark teal-green ink, not a parallel color system) - a dark band under the light body reads as
   a natural "end of page" the same way a real letterhead's footer strip would, and gives the
   partner-logo bar below enough contrast to read as its own distinct zone. */
.inuni-footer[b-ax0xj2w4hp] {
    --footer-accent: #0F6E56;
    --footer-bg: #10201C;
    --footer-text: rgba(244, 243, 239, .82);
    --footer-text-faint: rgba(244, 243, 239, .5);
    --footer-rule: rgba(244, 243, 239, .14);
    /* Also overridable per section (see SectionColors.cs). */
    --footer-heading: #fff;
    --footer-link-hover: #fff;
    --footer-hover-bg: rgba(244, 243, 239, .06);
    --footer-button-bg: rgba(244, 243, 239, .08);
    --footer-button-text: var(--footer-text);
    --footer-button-hover-text: #fff;
    --footer-serif: "Libre Baskerville", Georgia, "Times New Roman", serif;

    background: var(--footer-bg);
    color: var(--footer-text);
    font-family: var(--brand-font-family, inherit);
}

.inuni-footer__main[b-ax0xj2w4hp] {
    max-width: 1440px;
    margin: 0 auto;
    padding: 2.75rem 1.5rem 2rem;
    display: flex;
    flex-wrap: wrap;
    gap: 2.5rem 3rem;
}

.inuni-footer__brand[b-ax0xj2w4hp] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    margin-right: auto;
}

.inuni-footer__social[b-ax0xj2w4hp] {
    display: flex;
    align-items: center;
    gap: .6rem;
}

.inuni-footer__social a[b-ax0xj2w4hp] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    background: var(--footer-button-bg);
    color: var(--footer-button-text);
    transition: background .12s ease, color .12s ease;
}

.inuni-footer__social a:hover[b-ax0xj2w4hp] {
    background: var(--footer-accent);
    color: var(--footer-button-hover-text);
}

.inuni-footer__lang[b-ax0xj2w4hp] {
    display: flex;
    align-items: center;
    gap: .6rem;
    font-size: .78rem;
    color: var(--footer-text-faint);
}

.inuni-footer__lang-label[b-ax0xj2w4hp] {
    letter-spacing: .04em;
}

.inuni-footer__lang[b-ax0xj2w4hp]  .inuni-lang-switcher {
    display: flex;
    gap: .3rem;
    background: rgba(244, 243, 239, .08);
    border-radius: 999px;
    padding: .2rem;
}

.inuni-footer__lang[b-ax0xj2w4hp]  .inuni-lang-switcher__item {
    padding: .25rem .65rem;
    border-radius: 999px;
    font-size: .72rem;
    letter-spacing: .04em;
    color: var(--footer-text-faint);
    text-decoration: none;
    transition: background .12s ease, color .12s ease;
}

.inuni-footer__lang[b-ax0xj2w4hp]  .inuni-lang-switcher__item.is-active {
    background: rgba(244, 243, 239, .16);
    color: #fff;
}

.inuni-footer__column[b-ax0xj2w4hp] {
    display: flex;
    flex-direction: column;
    gap: .65rem;
    min-width: 9rem;
}

/* Both a plain column link and the column's own heading are real buttons now (the heading
   doubles as a link to that zone's home page, same "the label IS the link" idea InuniNav's
   own utility-bar triggers use) - shared button shape/hover first, then the heading's own
   distinct type treatment layered on top so it still reads as a heading, not just another
   link. Left-border-on-hover, not underline - same accent-bar treatment
   .inuni-nav__dropdown-item:hover already uses in InuniNav.razor.css, so a footer link and a
   nav dropdown item read as the same "button" affordance. 2px of reserved left padding
   (rather than adding it only on hover) keeps the text from shifting right the moment the
   border appears. */
.inuni-footer__column a[b-ax0xj2w4hp],
.inuni-footer__heading[b-ax0xj2w4hp] {
    display: block;
    font-size: .85rem;
    color: var(--footer-text);
    text-decoration: none;
    width: fit-content;
    padding: .2rem .5rem .2rem .6rem;
    margin-left: -.5rem;
    border-radius: 2px;
    box-shadow: inset 2px 0 0 transparent;
    transition: color .12s ease, background .12s ease, box-shadow .12s ease;
}

.inuni-footer__column a:hover[b-ax0xj2w4hp],
.inuni-footer__heading:hover[b-ax0xj2w4hp] {
    color: var(--footer-link-hover);
    background: var(--footer-hover-bg);
    box-shadow: inset 2px 0 0 var(--footer-accent);
}

.inuni-footer__heading[b-ax0xj2w4hp] {
    font-family: var(--footer-serif);
    font-weight: 700;
    font-size: .95rem;
    color: var(--footer-heading);
    margin-bottom: .15rem;
}

.inuni-footer__rule[b-ax0xj2w4hp] {
    max-width: 1440px;
    margin: 2rem auto 1.25rem;
    height: 1px;
    background: var(--footer-rule);
}

.inuni-footer__partners[b-ax0xj2w4hp] {
    max-width: 1440px;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 1rem 2rem;
}

.inuni-footer__partner[b-ax0xj2w4hp] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .4rem;
}

.inuni-footer__partner-label[b-ax0xj2w4hp] {
    font-size: .62rem;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--footer-text-faint);
}

.inuni-footer__partner-logo[b-ax0xj2w4hp] {
    height: 1.9rem;
    width: auto;
    display: block;
}

.inuni-footer__legal[b-ax0xj2w4hp] {
    max-width: 1440px;
    margin: 0 auto;
    padding: 1.1rem 1.5rem 1.5rem;
    border-top: 1px solid var(--footer-rule);
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: .5rem 1.5rem;
    font-size: .78rem;
    color: var(--footer-text-faint);
}

.inuni-footer__legal-links[b-ax0xj2w4hp] {
    display: flex;
    gap: 1.25rem;
}

.inuni-footer__legal-links a[b-ax0xj2w4hp] {
    display: block;
    color: var(--footer-text-faint);
    text-decoration: none;
    padding: .2rem .5rem .2rem .6rem;
    margin-left: -.5rem;
    border-radius: 2px;
    box-shadow: inset 2px 0 0 transparent;
    transition: color .12s ease, background .12s ease, box-shadow .12s ease;
}

.inuni-footer__legal-links a:hover[b-ax0xj2w4hp] {
    color: var(--footer-link-hover);
    background: var(--footer-hover-bg);
    box-shadow: inset 2px 0 0 var(--footer-accent);
}

@media (max-width: 640px) {
    .inuni-footer__main[b-ax0xj2w4hp] {
        flex-direction: column;
        gap: 2rem;
    }

    .inuni-footer__brand[b-ax0xj2w4hp] {
        margin-right: 0;
    }

    .inuni-footer__partners[b-ax0xj2w4hp] {
        justify-content: center;
        text-align: center;
    }

    .inuni-footer__legal[b-ax0xj2w4hp] {
        flex-direction: column;
        text-align: center;
        gap: .75rem;
    }

    .inuni-footer__legal-links[b-ax0xj2w4hp] {
        justify-content: center;
    }
}
/* _content/InuniSphere.Web/Components/Shared/HelpButton.razor.rz.scp.css */
.help-icon-button[b-fns1i8g9bs] {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.75rem;
    height: 1.75rem;
    flex: none;
    border: 1px solid var(--brand-border, rgba(11, 38, 32, 0.16));
    border-radius: var(--brand-radius, 0.4rem);
    background: none;
    color: var(--brand-text-main, #232323);
    font-size: 0.8rem;
    font-weight: 700;
    line-height: 1;
    text-decoration: none;
    transition: background 0.12s ease, border-color 0.12s ease, color 0.12s ease;
}

.help-icon-button:hover[b-fns1i8g9bs],
.help-icon-button:focus-visible[b-fns1i8g9bs] {
    background: var(--brand-accent-soft, #f4fafa);
    border-color: var(--brand-primary, #185354);
    color: var(--brand-primary, #185354);
}

.help-icon-button[b-fns1i8g9bs]::after {
    content: attr(data-tooltip);
    position: absolute;
    bottom: calc(100% + 6px);
    left: 50%;
    transform: translateX(-50%) translateY(4px);
    padding: 0.3rem 0.55rem;
    border-radius: 0.3rem;
    background: var(--brand-text-main, #232323);
    color: #fff;
    font-size: 0.7rem;
    font-weight: 600;
    white-space: nowrap;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.12s ease, transform 0.12s ease;
    z-index: 20;
}

.help-icon-button:hover[b-fns1i8g9bs]::after,
.help-icon-button:focus-visible[b-fns1i8g9bs]::after {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
}
/* _content/InuniSphere.Web/Components/Shared/InuniNav.razor.rz.scp.css */
/* Institutional letterhead style - a full-width utility strip (Społeczność/Fundacja/
   Współpraca) above a full-width main bar (serif "INUNI" wordmark, app-section tabs
   with a teal underline, user chip). Ported from a reference mockup design, restyled
   onto this component's existing markup/behavior (hover-shown mega-menus, the native
   <details>/<summary> user menu, the checkbox-driven mobile reveal) rather than a
   rewrite of any of that. --nav-* custom properties below are this component's own
   palette, separate from the shared --brand-* tokens theme-base.css defines globally
   for buttons/forms/etc. elsewhere in the app - only --nav-ink/--nav-accent are ever
   reachable via Theme (see InuniNav.razor's InlineStyle), the rest are deliberately
   fixed, same "a handful of the nav's own colors are hardcoded" precedent as before. */
.inuni-nav[b-k7suloqjv8] {
    --nav-ink: #0B2620;
    /* Main bar + its dropdowns/mobile panel, and the top utility strip - both overridable per
       section (see SectionColors.cs), like --nav-ink/--nav-accent. */
    --nav-bg: var(--brand-page-bg, #fff);
    --nav-utility-bg: #AFDCE5;
    /* Also overridable per section: the top strip's own link text, and the "Zaloguj się"
       button. --nav-text-soft (main menu links) and --nav-hover (hover highlight) below are too. */
    --nav-utility-text: rgba(11, 38, 32, .68);
    --nav-button-bg: var(--nav-ink);
    --nav-button-text: #fff;
    --nav-icon: var(--nav-text-faint);
    --nav-icon-hover: var(--nav-accent);
    --nav-accent: #0F6E56;
    --nav-stone: #F4F3EF;
    --nav-hover: #EFEEE9;
    --nav-rule: rgba(11, 38, 32, .16);
    --nav-rule-soft: rgba(11, 38, 32, .09);
    --nav-text-soft: #565B58;
    --nav-text-faint: #8C918D;
    --nav-serif: "Libre Baskerville", Georgia, "Times New Roman", serif;
    --nav-pad-x: 1.5rem;

    display: flex;
    flex-direction: column;
    font-family: var(--brand-font-family, inherit);
    position: relative;
    z-index: 60;
}

.inuni-nav__toggle[b-k7suloqjv8] {
    display: none;
}

/* ---------- utility strip ---------- */
/* The pale sky-blue of the logo's own light rays (#AFDCE5) - light enough that dark
   ink text reads better on it than white, so text styling stays dark-on-light like
   the original stone strip. */
.inuni-nav__utility-row[b-k7suloqjv8] {
    background: var(--nav-utility-bg);
    border-bottom: 1px solid rgba(11, 38, 32, .12);
}

.inuni-nav__utility[b-k7suloqjv8] {
    display: flex;
    align-items: stretch;
    justify-content: flex-end;
    padding: 0 var(--nav-pad-x);
    min-height: 19px;
}

.inuni-nav__utility a[b-k7suloqjv8] {
    display: flex;
    align-items: center;
    font-size: .58rem;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--nav-utility-text);
    text-decoration: none;
    white-space: nowrap;
    padding: 0 .7rem;
    border-bottom: 1px solid transparent;
    margin-bottom: -1px;
    transition: color .12s ease, background .12s ease, border-color .12s ease;
}

.inuni-nav__utility a:hover[b-k7suloqjv8] {
    color: var(--nav-ink);
    background: rgba(255, 255, 255, .25);
}

.inuni-nav__utility a.is-active[b-k7suloqjv8] {
    color: var(--nav-ink);
    border-bottom-color: var(--nav-ink);
}

/* A utility item with its own zone content (only Społeczność today - see
   InuniNav.razor's DefaultUtilityLinks) reveals a dropdown on hover, same mechanism a
   main .inuni-nav__nav-item with Columns already uses; nav-dropdown.js's tap-to-expand
   handler already matches ".inuni-nav__nav-item > a, .boost-nav__nav-item > a" - it was
   extended to also match ".inuni-nav__utility-item > a" rather than duplicating that
   logic, so .is-expanded (used for the mobile/compact tap case below) is the exact
   same class name and mechanism throughout the file. */
.inuni-nav__utility-item[b-k7suloqjv8] {
    position: relative;
    display: flex;
    align-items: center;
}

.inuni-nav__utility-item .inuni-nav__caret[b-k7suloqjv8] {
    margin-left: .3rem;
    transform: scale(.7);
}

/* Keeps the trigger highlighted for as long as the cursor is anywhere inside the item -
   including inside its own open dropdown - not just while directly over the trigger's
   own text. .inuni-nav__utility a:hover alone only fires while hovering the anchor
   itself, so moving from the trigger down into the dropdown silently dropped this
   highlight even though the dropdown was still open; same fix the main nav's own
   .inuni-nav__nav-item:hover > a rule already applies there. Desktop only (:not(.inuni-
   nav--compact)) - touch has no real hover, and some mobile browsers leave a tapped
   element's :hover "stuck" until something else is tapped, which would fight with the
   tap-driven .is-expanded state nav-dropdown.js actually manages on mobile. */
.inuni-nav:not(.inuni-nav--compact) .inuni-nav__utility-item:hover > a[b-k7suloqjv8],
.inuni-nav:not(.inuni-nav--compact) .inuni-nav__utility-item:focus-within > a[b-k7suloqjv8] {
    color: var(--nav-ink);
    background: rgba(255, 255, 255, .25);
    border-bottom-color: var(--nav-accent);
}

/* Anchored to the trigger's RIGHT edge, growing leftward - the utility row itself is
   right-aligned (justify-content:flex-end), so a rightward-growing dropdown (left:0,
   the main nav's own .inuni-nav__nav-item default) ran off the edge of the viewport for
   whichever utility item sits closest to it (Współpraca, the last of the three) once it
   had enough items (8) to need real width. Every utility item is in the right portion
   of the header either way, so anchoring all of them from their own right edge instead
   is the direction with reliable room to grow into, regardless of which one has items. */
.inuni-nav__utility-item > .inuni-nav__dropdown[b-k7suloqjv8] {
    display: none;
    top: calc(100% + 3px);
    left: auto;
    right: 0;
    min-width: 11rem;
}

/* .inuni-nav__utility a (the tiny uppercase/tracked utility-bar link style) is a
   descendant selector that also matches these same <a> tags, since structurally they
   sit inside .inuni-nav__utility too - and at 0-1-1 (plus 0-2-1 for its :hover) it
   out-specifies .inuni-nav__dropdown-item alone (0-1-0 / 0-2-0 hover), winning on
   every property they both set (font-size, padding, letter-spacing, text-transform,
   hover background/color, ...) and leaving this dropdown looking like the utility bar's
   own tiny uppercase links instead of a normal dropdown - it's meant to behave exactly
   like a main-row mega-menu's dropdown items (e.g. Finanse's), not a scaled-down
   variant. Re-asserting the whole rule (not just the properties that visibly differed)
   under the extra .inuni-nav__utility-item class (0-2-0 / 0-3-0 hover) beats it outright
   rather than trying to guess which individual properties still needed a fix. */
.inuni-nav__utility-item .inuni-nav__dropdown-item[b-k7suloqjv8] {
    display: block;
    width: 100%;
    text-align: left;
    font-family: var(--nav-serif);
    padding: .5rem .5rem;
    border-radius: 2px;
    color: var(--nav-text-soft);
    text-decoration: none;
    font-size: .85rem;
    line-height: 1.3;
    letter-spacing: normal;
    text-transform: none;
    background: none;
    border: none;
    cursor: pointer;
    transition: background .12s ease, color .12s ease;
}

.inuni-nav__utility-item .inuni-nav__dropdown-item:hover[b-k7suloqjv8] {
    background: var(--nav-hover);
    color: var(--nav-ink);
    box-shadow: inset 2px 0 0 var(--nav-accent);
}

/* Same current-page accent bar as the base .inuni-nav__dropdown-item[aria-current] rule
   further down - re-asserted at matching (0-2-0) specificity so source order alone
   doesn't let this file's own utility-item style-parity fix above win the tie and quietly
   drop the accent bar back to the plain hover style for Społeczność's own items. */
.inuni-nav__utility-item .inuni-nav__dropdown-item[aria-current="page"][b-k7suloqjv8] {
    background: color-mix(in srgb, var(--nav-accent) 10%, transparent);
    color: var(--nav-ink);
    box-shadow: inset 2px 0 0 var(--nav-accent);
}

/* Desktop only - see the trigger-highlight rule above for why touch/mobile is excluded.
   On mobile, tapping a utility item swaps the WHOLE main items list instead of revealing
   this small dropdown - see .inuni-nav__links--zone-preview further down - so
   .is-expanded deliberately isn't part of the "show this dropdown" condition at all
   (it still gets set by nav-dropdown.js's tap handler either way; it just means
   something different once .inuni-nav--compact is present). */
.inuni-nav:not(.inuni-nav--compact) .inuni-nav__utility-item:hover > .inuni-nav__dropdown[b-k7suloqjv8],
.inuni-nav:not(.inuni-nav--compact) .inuni-nav__utility-item:focus-within > .inuni-nav__dropdown[b-k7suloqjv8] {
    display: block;
}

/* Mobile: tapping a utility item with its own zone content (Społeczność/Współpraca)
   swaps the ENTIRE main items list for that zone's own items, rather than opening a
   separate small dropdown under the utility bar (the earlier "inline"/flex-basis:100%
   attempt at something similar reshuffled Fundacja/Współpraca's own position - this
   instead leaves the utility row completely alone and only changes what .inuni-nav__menu
   shows in the space normally occupied by .inuni-nav__links). Every .inuni-nav__links--
   zone-preview is a plain, pre-rendered (hidden by default) list of that zone's items -
   see InuniNav.razor's own markup - swapped in per the specific utility-item that's
   currently .is-expanded via its own data-zone-key. */
/* Two classes, not one - the base .inuni-nav__links{display:flex} rule further down
   (also just one class, so equal specificity) is defined LATER in this file and wins
   the cascade tie by source order alone, which silently kept every zone-preview list
   visible (as flex items of .inuni-nav__main-row too, via .inuni-nav__menu's own
   display:contents at desktop width) right alongside the real one - the huge,
   everything-at-once navbar overflow this caused is exactly what surfaced this bug. */
.inuni-nav__links.inuni-nav__links--zone-preview[b-k7suloqjv8] {
    display: none;
}

.inuni-nav--compact .inuni-nav__menu:has(.inuni-nav__utility-item.is-expanded) .inuni-nav__links:not(.inuni-nav__links--zone-preview)[b-k7suloqjv8] {
    display: none;
}

.inuni-nav--compact .inuni-nav__menu:has(.inuni-nav__utility-item[data-zone-key="spolecznosc"].is-expanded) .inuni-nav__links--zone-preview[data-zone-key="spolecznosc"][b-k7suloqjv8],
.inuni-nav--compact .inuni-nav__menu:has(.inuni-nav__utility-item[data-zone-key="wspolpraca"].is-expanded) .inuni-nav__links--zone-preview[data-zone-key="wspolpraca"][b-k7suloqjv8] {
    display: flex;
}

/* ---------- main bar ---------- */
/* Sticks to the viewport's top edge once the utility strip above it scrolls out of
   view - only this row, not the whole header, so the utility strip's own links still
   scroll away normally. z-index sits between .inuni-nav's own 60 and the mega-menu
   dropdowns' 80, so an open dropdown still layers above it once it's stuck. */
.inuni-nav__main-row[b-k7suloqjv8] {
    display: flex;
    align-items: stretch;
    background: var(--nav-bg);
    border-bottom: 1px solid var(--nav-rule);
    padding: 0 var(--nav-pad-x);
    min-height: 58px;
    gap: .65rem;
    position: sticky;
    top: 0;
    z-index: 70;
}

/* Three independent, CUMULATIVE reclaim-space stages between plain desktop and
   .inuni-nav--compact - nav-responsive.js applies them one at a time, in this exact
   order, re-measuring after each: hide the brand's "Strefa Działacza" caption first,
   then ALSO the social icons if that alone wasn't enough, then ALSO collapse the
   account chip down to just the photo/initials if even that wasn't enough (the
   person's full name is still available - hover or tap the chip open to see it, see
   .inuni-nav__user-label's own rule below). Only falls through to .inuni-nav--compact
   if hiding all three still isn't enough. No app-section tab is ever shrunk, moved, or
   truncated at any stage - .inuni-nav__links keeps its own margin-left:auto (its base
   rule) throughout, which is why the tabs stay pinned to the right the whole time
   without needing any of these stages to reassign that job elsewhere: nothing here
   ever removes .inuni-nav__links from its normal spot, only hides OTHER things around
   it. Mutually exclusive with .inuni-nav--compact by construction (nav-responsive.js
   never sets both at once), so none of this ever applies to the mobile hamburger menu. */
.inuni-nav--hide-brand-label .inuni-nav__brand-label[b-k7suloqjv8] {
    display: none;
}

.inuni-nav--hide-social .inuni-nav__social[b-k7suloqjv8] {
    display: none;
}

.inuni-nav--hide-user-name .inuni-nav__user-label[b-k7suloqjv8] {
    display: none;
}

/* The name is still available even with the chip collapsed to just the photo - not as
   its own separate tooltip (an earlier attempt did that), but by revealing the SAME
   full account menu hover reveals that a click would anyway, now with its own
   photo+name header up top (see .inuni-nav__dropdown-user-summary below) - one menu,
   not two different popups depending on how you got there. <details> hides its own
   content by default unless [open]; this rule is what overrides that specifically for
   :hover, since a plain CSS display change on the child is enough to beat the native
   behavior (no JS needed - opening for a real click still works exactly as before). */
.inuni-nav__user:hover > .inuni-nav__dropdown--user[b-k7suloqjv8] {
    display: block;
}

.inuni-nav__dropdown-user-summary[b-k7suloqjv8] {
    display: flex;
    align-items: center;
    gap: .6rem;
    padding: .3rem .5rem .6rem;
}

.inuni-nav__dropdown-user-name[b-k7suloqjv8] {
    font-family: var(--nav-serif);
    font-size: .85rem;
    color: var(--nav-ink);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.inuni-nav__brand[b-k7suloqjv8] {
    display: flex;
    align-items: center;
    gap: .75rem;
    color: var(--nav-ink);
    white-space: nowrap;
    flex-shrink: 0;
}

/* Two independent links now, not one shared anchor around both - the logo always goes to
   inuni.org.pl (see InuniNav.razor's own markup comment), only the caption is adjustable
   per zone. Both need text-decoration reset explicitly - the browser's own default <a>
   underline isn't overridden just by the parent .inuni-nav__brand setting it above, since
   that's a real UA-stylesheet rule on <a> itself, not something plain inheritance beats. */
.inuni-nav__brand-logo[b-k7suloqjv8] {
    display: flex;
    text-decoration: none;
}

.inuni-nav__brand-img[b-k7suloqjv8] {
    height: 2.2rem;
    width: auto;
    display: block;
}

.inuni-nav__brand-label[b-k7suloqjv8] {
    font-size: .62rem;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: var(--nav-text-faint);
    text-decoration: none;
    padding-left: .7rem;
    border-left: 1px solid var(--nav-rule-soft);
    align-self: center;
    transition: color .12s ease;
}

.inuni-nav__brand-label:hover[b-k7suloqjv8] {
    color: var(--nav-ink);
}

/* ---------- app-section tabs ---------- */
/* Deliberately NOT min-width:0 (an earlier attempt set it here, plus ellipsis on each
   label, to let tabs individually shrink/truncate under pressure instead of the row
   hard-overflowing) - every label must always show its full text, no exceptions, so
   letting this row "gracefully" shrink below its content's natural size was exactly
   backwards: it silently truncated instead of overflowing, which also broke
   nav-responsive.js's own overflow check (scrollWidth never exceeds clientWidth once
   the text itself is what's shrinking) - the row must genuinely overflow when it
   doesn't fit, so that check correctly switches to compact mode instead. */
.inuni-nav__links[b-k7suloqjv8] {
    display: flex;
    align-items: stretch;
    margin-left: auto;
    flex-wrap: nowrap;
}

/* The IAM/Admin/Finanse/MegaMenus triggers are an <a> nested inside their own
   .inuni-nav__nav-item wrapper (for the hover-dropdown to anchor to), not a direct child
   of .inuni-nav__links like the plain "Konto" link - both need the same tab styling, so
   both are named explicitly here (a plain descendant selector would also catch the
   .inuni-nav__dropdown-item links nested deeper inside each dropdown, which must keep
   their own distinct style instead). */
.inuni-nav__links > a[b-k7suloqjv8],
.inuni-nav__links > .inuni-nav__nav-item > a[b-k7suloqjv8] {
    display: flex;
    align-items: center;
    gap: .5rem;
    font-family: var(--nav-serif);
    font-size: .8rem;
    line-height: 1;
    color: var(--nav-text-soft);
    text-decoration: none;
    white-space: nowrap;
    padding: 0 .55rem;
    border-bottom: 2px solid transparent;
    margin-bottom: -1px;
    transition: color .12s ease, border-color .12s ease, background .12s ease;
}

/* The label text still lives in its own <span> (see InuniNav.razor) so the caret can
   sit beside it without either being mistaken for the other, but it's plain inline
   content now - no ellipsis, no min-width:0. Full text, always. */
.inuni-nav__link-label[b-k7suloqjv8] {
    white-space: nowrap;
}

.inuni-nav__links > a:hover[b-k7suloqjv8],
.inuni-nav__links > .inuni-nav__nav-item > a:hover[b-k7suloqjv8] {
    color: var(--nav-ink);
    background: var(--nav-hover);
    /* Same accent highlight the dropdown items now get on hover (see
       .inuni-nav__dropdown-item:hover) - a bottom border here instead of a left one,
       matching this row's own horizontal-tabs orientation rather than a vertical list's.
       Plain links (no dropdown, e.g. "O Fundacji") used to miss this entirely - only a
       dropdown-having item's own separate :hover > a rule below set it, via the wrapper
       div plain links don't have. */
    border-bottom-color: var(--nav-accent);
}

.inuni-nav__nav-item[b-k7suloqjv8] {
    position: relative;
    display: flex;
    align-items: stretch;
}

.inuni-nav__nav-item:hover > a[b-k7suloqjv8],
.inuni-nav__nav-item:focus-within > a[b-k7suloqjv8] {
    color: var(--nav-ink);
    background: var(--nav-hover);
    border-bottom-color: var(--nav-accent);
}

.inuni-nav__caret[b-k7suloqjv8] {
    width: 0;
    height: 0;
    border-left: 3.5px solid transparent;
    border-right: 3.5px solid transparent;
    border-top: 4px solid currentColor;
    opacity: .45;
    flex-shrink: 0;
    transition: transform .12s ease, opacity .12s ease;
}

.inuni-nav__nav-item:hover .inuni-nav__caret[b-k7suloqjv8],
.inuni-nav__nav-item:focus-within .inuni-nav__caret[b-k7suloqjv8] {
    transform: rotate(180deg);
    opacity: .9;
}

/* Hover-shown, not click-shown like the avatar menu's <details> - a plain <div>, not
   <details>/<summary>, since <details> only opens on click. */
.inuni-nav__nav-item > .inuni-nav__dropdown[b-k7suloqjv8] {
    display: none;
    top: calc(100% + 1px);
    left: 0;
    right: auto;
}

.inuni-nav__nav-item:hover > .inuni-nav__dropdown[b-k7suloqjv8],
.inuni-nav__nav-item:focus-within > .inuni-nav__dropdown[b-k7suloqjv8] {
    display: block;
}

/* ---------- social + account ---------- */
.inuni-nav__social[b-k7suloqjv8] {
    display: flex;
    align-items: center;
    gap: .4rem;
    color: var(--nav-icon);
    flex-shrink: 0;
}

.inuni-nav__social a[b-k7suloqjv8] {
    display: flex;
    color: inherit;
}

.inuni-nav__social a:hover[b-k7suloqjv8] {
    color: var(--nav-icon-hover);
}

.inuni-nav__account[b-k7suloqjv8] {
    display: flex;
    align-items: center;
    flex-shrink: 0;
    margin-left: .25rem;
    padding-left: 1.25rem;
    border-left: 1px solid var(--nav-rule-soft);
}

.inuni-nav__signin[b-k7suloqjv8] {
    display: inline-flex;
    align-items: center;
    background: var(--nav-button-bg);
    color: var(--nav-button-text);
    font-size: .78rem;
    letter-spacing: .04em;
    text-decoration: none;
    font-weight: 600;
    padding: .5rem 1.15rem;
    border-radius: 2px;
    white-space: nowrap;
    transition: background .12s ease;
}

.inuni-nav__signin:hover[b-k7suloqjv8] {
    background: var(--nav-accent);
}

.inuni-nav__user[b-k7suloqjv8] {
    position: relative;
}

.inuni-nav__user[open][b-k7suloqjv8] {
    z-index: 1200;
}

.inuni-nav__user-trigger[b-k7suloqjv8] {
    display: flex;
    align-items: center;
    gap: .6rem;
    padding: .3rem .65rem .3rem .3rem;
    border: 1px solid var(--nav-rule-soft);
    border-radius: 2px;
    cursor: pointer;
    list-style: none;
    user-select: none;
    transition: background .12s ease, border-color .12s ease;
}

.inuni-nav__user-trigger[b-k7suloqjv8]::-webkit-details-marker {
    display: none;
}

.inuni-nav__user-trigger:hover[b-k7suloqjv8],
.inuni-nav__user[open] .inuni-nav__user-trigger[b-k7suloqjv8] {
    background: var(--nav-hover);
    border-color: var(--nav-rule);
}

.inuni-nav__avatar[b-k7suloqjv8] {
    width: 1.7rem;
    height: 1.7rem;
    border-radius: 2px;
    background: var(--nav-ink);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: .65rem;
    letter-spacing: .05em;
    font-weight: 600;
}

.inuni-nav__avatar--photo[b-k7suloqjv8] {
    object-fit: cover;
    background: none;
}

.inuni-nav__user-label[b-k7suloqjv8] {
    font-family: var(--nav-serif);
    font-size: .82rem;
    color: var(--brand-text-main, #1a1c1b);
    max-width: 11rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.inuni-nav__user[open] .inuni-nav__caret[b-k7suloqjv8] {
    transform: rotate(180deg);
    opacity: .9;
}

/* Momentary override forcing a hover-revealed dropdown closed the instant a real link inside
   it is clicked (see nav-dropdown.js's own "close everything on a real navigational click"
   listener) - necessary now that the nav persists across in-app navigation (EventLayout/
   FundacjaLayout/SpolecznoscLayout/WspolpracaLayout): a same-tab click never moves the mouse
   away from the trigger, so the dropdown's own :hover match keeps holding and it would
   otherwise stay floating open over whatever page just loaded underneath it. !important is
   deliberate - it's the only reliable way to beat a live :hover match with a plain class. */
.inuni-nav__nav-item.is-closing > .inuni-nav__dropdown[b-k7suloqjv8],
.inuni-nav__utility-item.is-closing > .inuni-nav__dropdown[b-k7suloqjv8],
.inuni-nav__user.is-closing > .inuni-nav__dropdown--user[b-k7suloqjv8] {
    display: none !important;
}

/* ---------- dropdown shell (mega-menus + the user menu) ---------- */
.inuni-nav__dropdown[b-k7suloqjv8] {
    position: absolute;
    top: calc(100% + 1px);
    right: 0;
    min-width: 15rem;
    max-width: calc(100vw - 2rem);
    background: var(--nav-bg);
    border: 1px solid var(--nav-rule);
    border-radius: 2px;
    box-shadow: 0 3px 10px rgba(11, 38, 32, .08);
    padding: 14px 10px 10px;
    z-index: 80;
}

.inuni-nav__dropdown--user[b-k7suloqjv8] {
    min-width: 12rem;
    padding: 10px;
}

/* The IAM dropdown alone lists every /iam tab (13+ items) - tall enough on a short viewport
   (a laptop window that isn't maximized in height, say) to run off-screen otherwise. */
.inuni-nav__dropdown--scrollable[b-k7suloqjv8] {
    max-height: min(70vh, 28rem);
    overflow-y: auto;
}

.inuni-nav__dropdown-head[b-k7suloqjv8] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    row-gap: 4px;
    gap: 10px;
    padding: 0 8px 9px;
    margin-bottom: 2px;
}

.inuni-nav__dropdown-heading[b-k7suloqjv8] {
    font-size: .68rem;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--nav-text-faint);
    white-space: nowrap;
}

/* A heading with its own HeadingUrl (e.g. a Commodity's top-level page, heading the column of
   pages nested under it) - same look, just clickable. */
.inuni-nav__dropdown-heading--link[b-k7suloqjv8] {
    text-decoration: none;
}

.inuni-nav__dropdown-heading--link:hover[b-k7suloqjv8],
.inuni-nav__dropdown-heading--link[aria-current="page"][b-k7suloqjv8] {
    color: var(--nav-accent);
}

.inuni-nav__dropdown-note[b-k7suloqjv8] {
    font-size: .68rem;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--nav-accent);
    white-space: nowrap;
}

.inuni-nav__dropdown-rule[b-k7suloqjv8] {
    flex: 1 1 12px;
    min-width: 12px;
    height: 1px;
    background: var(--nav-rule-soft);
}

.inuni-nav__dropdown-item[b-k7suloqjv8] {
    display: block;
    width: 100%;
    text-align: left;
    font-family: var(--nav-serif);
    padding: .5rem .5rem;
    border-radius: 2px;
    color: var(--nav-text-soft);
    text-decoration: none;
    font-size: .85rem;
    line-height: 1.3;
    background: none;
    border: none;
    cursor: pointer;
    transition: background .12s ease, color .12s ease;
}

.inuni-nav__dropdown-item:hover[b-k7suloqjv8] {
    background: var(--nav-hover);
    color: var(--nav-ink);
    box-shadow: inset 2px 0 0 var(--nav-accent);
}

/* Quiet left accent bar + tint for whichever item matches the current page (see
   InuniNav.razor's IsCurrentPage) - the same "current" treatment
   ComponentLibrary.razor.css's own .complib-nav__item.is-active already borrowed from
   this component (its comment names this exact box-shadow), not a generic hover style
   duplicated here. */
.inuni-nav__dropdown-item[aria-current="page"][b-k7suloqjv8] {
    background: color-mix(in srgb, var(--nav-accent) 10%, transparent);
    color: var(--nav-ink);
    box-shadow: inset 2px 0 0 var(--nav-accent);
}

.inuni-nav__dropdown-item--danger[b-k7suloqjv8] {
    color: #8d2c2c;
}

.inuni-nav__dropdown-item--danger:hover[b-k7suloqjv8] {
    background: #fdf1f1;
    color: #6d1e1e;
}

.inuni-nav__dropdown-sep[b-k7suloqjv8] {
    height: 1px;
    background: var(--nav-rule-soft);
    margin: .5rem .5rem;
}

/* The Finance mega-menu's "Moje finanse" + "Panel administratorski" content - a single CSS
   grid wrapping into 2 columns (auto-placement, plain DOM order), each section's own header
   spanning the FULL grid width via grid-column:1/-1 - the same mechanism the reference
   design itself uses. A per-column-half header (this file's earlier approach) starves a
   long label like "Panel administratorski ADMIN" of half the space it needs to lay out in,
   which is what caused it to crowd/look detached - giving it the full dropdown width fixes
   that at the source. */
.inuni-nav__dropdown--columns[b-k7suloqjv8] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2px 22px;
    min-width: 26rem;
}

.inuni-nav__dropdown--columns > .inuni-nav__dropdown-head[b-k7suloqjv8] {
    grid-column: 1 / -1;
}

/* Every .inuni-nav__nav-item trigger lives in the right-hand half of the main bar -
   .inuni-nav__nav-item > .inuni-nav__dropdown's base left:0 anchors a dropdown to extend
   further RIGHT from a trigger that's often already near the right edge of the viewport,
   which is fine for a narrow single-column menu but pushes a wide --columns one off-screen.
   Anchoring from the trigger's right edge instead keeps it growing back toward the middle
   of the page, where there's actually room. Same specificity as the base rule above (one
   class each side of the child combinator), so this only wins because it comes later. */
.inuni-nav__nav-item > .inuni-nav__dropdown--columns[b-k7suloqjv8] {
    left: auto;
    right: 0;
}

/* Same specificity as the plain :hover > .inuni-nav__dropdown { display: block } rule
   above, so source order alone decides the winner - this comes later, which is what
   actually reveals the grid on hover instead of display:block flattening it back to a
   single stacked column. */
.inuni-nav__nav-item:hover > .inuni-nav__dropdown--columns[b-k7suloqjv8],
.inuni-nav__nav-item:focus-within > .inuni-nav__dropdown--columns[b-k7suloqjv8] {
    display: grid;
}

/* ---------- mobile ---------- */
.inuni-nav__toggle-label[b-k7suloqjv8] {
    display: none;
    flex-direction: column;
    justify-content: center;
    gap: .3rem;
    width: 2rem;
    height: 2rem;
    padding: .45rem;
    cursor: pointer;
    margin-left: auto;
}

.inuni-nav__toggle-label span[b-k7suloqjv8] {
    display: block;
    height: 2px;
    background: var(--nav-ink);
    border-radius: 1px;
}

/* At desktop width this wrapper is invisible to layout - display:contents makes its two
   children (.inuni-nav__links, .inuni-nav__social) act as direct flex items of
   .inuni-nav__main-row, exactly as if this <div> weren't there at all. Only the mobile
   media query below turns it into a real, absolutely-positioned box. */
.inuni-nav__menu[b-k7suloqjv8] {
    display: contents;
}

/* Hidden outright at desktop - see the mobile media query for where this actually shows. */
.inuni-nav__menu-utility[b-k7suloqjv8] {
    display: none;
}

/* Same - only ever relevant inside the mobile panel (see the media query for when an
   armed-but-not-active utility link reveals it). Forgotten here the first time, which
   left it rendering as a stray, permanently-visible paragraph in the desktop header
   (.inuni-nav__menu's own display:contents at desktop promotes it to a plain flex item
   of .inuni-nav__main-row with no display override at all). */
.inuni-nav__menu-elsewhere-hint[b-k7suloqjv8] {
    display: none;
}

/* No font-size/padding shrinking tier here anymore (an earlier "medium desktop" band,
   901-1300px, did exactly that) - font size and spacing now stay exactly the same at
   every desktop width. Reclaiming space when the row doesn't fit is entirely
   nav-responsive.js's job instead: it hides brand/social/user-name one at a time (see
   .inuni-nav--hide-brand-label/--hide-social/--hide-user-name below) rather than
   shrinking anything, and only falls back to .inuni-nav--compact if even hiding all
   three still isn't enough. */

/* Compact/mobile mode is a CLASS (.inuni-nav--compact), applied by nav-responsive.js
   based on a fixed 900px viewport width, not a guessed content-fit measurement (an
   earlier version of this comment described a content-measuring approach - see
   nav-responsive.js's own current top comment for why that was dropped: the switch
   point moving around based on item count/name length read as unpredictable). Desktop
   proper covers everything down to 900px via the staged hide classes above, rather
   than collapsing to the hamburger sooner. */
.inuni-nav--compact .inuni-nav__utility[b-k7suloqjv8] {
    padding: 0 1rem;
    justify-content: flex-start;
}

.inuni-nav--compact .inuni-nav__main-row[b-k7suloqjv8] {
    padding: 0 1rem;
    align-items: center;
}

.inuni-nav--compact .inuni-nav__toggle-label[b-k7suloqjv8] {
    display: flex;
}

/* Unconditionally absolute (not just once opened) - same trick the reference nav's own
   .tabs uses: this box contributes zero space to .inuni-nav__main-row's flex layout
   whether it's open or closed, so the account chip after it never gets pushed onto
   its own line the way it did when this was a normal in-flow flex item, and opening
   it overlays below the header instead of pushing the page's own content down.
   .inuni-nav__main-row's own position:sticky (see base rule above) is what gives this
   a containing block to anchor top:100% against. */
.inuni-nav--compact .inuni-nav__menu[b-k7suloqjv8] {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    flex-direction: column;
    padding: .5rem 1rem 1rem;
    background: var(--nav-bg);
    border-bottom: 1px solid var(--nav-rule);
    box-shadow: 0 6px 16px rgba(11, 38, 32, .12);
    max-height: calc(100vh - 100px);
    overflow-y: auto;
    z-index: 65;
}

/* Compact-only duplicate of the utility strip, folded into this same panel - see
   InuniNav.razor's own comment on .inuni-nav__menu-utility. Hidden otherwise via the
   base (unscoped) rule below; the real .inuni-nav__utility-row is the one hidden here
   instead, so exactly one copy of these three links is ever visible. */
.inuni-nav--compact .inuni-nav__utility-row[b-k7suloqjv8] {
    display: none;
}

/* Same pale sky-blue as the real utility strip (#AFDCE5, see that rule's own
   comment), laid out as a horizontal row rather than stacked - matches the ask that
   this section keep its original blue/horizontal look even folded into the mobile
   panel. Negative side margins pull it flush to the panel's own edges (undoing
   .inuni-nav__menu's padding just for this strip) so the blue reaches edge to edge
   like the real utility-row does, rather than looking inset. */
.inuni-nav--compact .inuni-nav__menu-utility[b-k7suloqjv8] {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    background: var(--nav-utility-bg);
    margin: -.5rem -1rem .5rem;
    padding: .3rem .75rem;
}

.inuni-nav--compact .inuni-nav__menu-utility a[b-k7suloqjv8] {
    padding: .4rem .6rem;
    font-size: .62rem;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--nav-utility-text);
    text-decoration: none;
    border-bottom: 1px solid transparent;
    margin-bottom: -1px;
}

/* The currently-selected zone reads as permanently in the same "hovered" state the
   desktop utility bar's own :hover already uses (a light tint) plus a bottom border,
   matching that same desktop is-active treatment (.inuni-nav__utility a.is-active) -
   not just a font-weight/color change like before. */
.inuni-nav--compact .inuni-nav__menu-utility a.is-active[b-k7suloqjv8] {
    color: var(--nav-ink);
    font-weight: 600;
    background: rgba(255, 255, 255, .25);
    border-bottom-color: var(--nav-ink);
}

/* First tap "arms" a section instead of following it straight through (see
   nav-dropdown.js) - a highlighted, underlined state that a second tap on the same
   link then confirms/navigates from. */
.inuni-nav--compact .inuni-nav__menu-utility a.is-armed[b-k7suloqjv8] {
    color: var(--nav-ink);
    font-weight: 700;
    text-decoration: underline;
}

/* A utility item WITH ITS OWN ZONE CONTENT (Społeczność/Współpraca) doesn't go through
   is-armed/is-active at all when tapped - nav-dropdown.js's tap-to-expand handler marks
   its wrapper .is-expanded instead (the same mechanism a main nav-item with a dropdown
   uses), which is what actually swaps the main items list for that zone's own preview
   list below (see .inuni-nav__links--zone-preview further up). Without this rule the
   tapped trigger itself showed no visible change at all even though the list underneath
   it did swap - same "permanently hovered" treatment as .is-active above, so it reads
   as "this section's items are the ones currently shown" the same way. */
.inuni-nav--compact .inuni-nav__menu-utility .inuni-nav__utility-item.is-expanded > a[b-k7suloqjv8] {
    color: var(--nav-ink);
    font-weight: 600;
    background: rgba(255, 255, 255, .25);
    border-bottom-color: var(--nav-ink);
}

/* The zone matching ActiveSection (e.g. Fundacja) keeps its own .is-active class the
   whole time regardless of what's expanded - it's just a static "which page am I on"
   marker, not cleared by nav-dropdown.js when another zone gets tapped open. Left alone
   it stayed highlighted even while a DIFFERENT zone's items were the ones actually
   showing below, reading as two sections both being "current" at once. Once some other
   utility item is expanded, the active one's highlight resets back to the plain resting
   look (same as .inuni-nav__menu-utility a's own base rule) until it's tapped again to
   return to its own list (see nav-dropdown.js's is-active tap handler). */
.inuni-nav--compact .inuni-nav__menu-utility:has(.inuni-nav__utility-item.is-expanded) a.is-active[b-k7suloqjv8] {
    color: var(--nav-utility-text);
    font-weight: 400;
    background: none;
    border-bottom-color: transparent;
}

.inuni-nav--compact .inuni-nav__menu-elsewhere-hint[b-k7suloqjv8] {
    display: none;
    margin: 0 0 .5rem;
    padding: .75rem .5rem;
    font-size: .78rem;
    line-height: 1.5;
    color: var(--nav-text-soft);
    background: var(--nav-hover);
    border-radius: 2px;
}

/* Swap the current zone's own nav items for the hint above the moment a DIFFERENT
   zone gets armed - is-active already marks the utility link matching ActiveSection
   (the zone whose items MegaMenus actually holds), so :not(.is-active) is what tells
   "armed a section that has nothing to show here" apart from "armed the one already
   showing its own items below". */
.inuni-nav--compact .inuni-nav__menu:has(.inuni-nav__menu-utility a.is-armed:not(.is-active)) .inuni-nav__links[b-k7suloqjv8] {
    display: none;
}

.inuni-nav--compact .inuni-nav__menu:has(.inuni-nav__menu-utility a.is-armed:not(.is-active)) .inuni-nav__menu-elsewhere-hint[b-k7suloqjv8] {
    display: block;
}

.inuni-nav--compact .inuni-nav__links[b-k7suloqjv8] {
    width: 100%;
    flex-direction: column;
    align-items: stretch;
    margin-left: 0;
}

/* Horizontal, unlike .inuni-nav__links above - just the 4 icons in a row, same as
   desktop, so it doesn't need the stacked list treatment. */
.inuni-nav--compact .inuni-nav__social[b-k7suloqjv8] {
    width: 100%;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    margin-left: 0;
    padding: .75rem .25rem .25rem;
    gap: .9rem;
}

.inuni-nav--compact .inuni-nav__links > a[b-k7suloqjv8],
.inuni-nav--compact .inuni-nav__links > .inuni-nav__nav-item > a[b-k7suloqjv8] {
    border-bottom: 1px solid var(--nav-rule-soft);
    padding: .9rem .25rem;
    margin-bottom: 0;
}

.inuni-nav--compact .inuni-nav__nav-item[b-k7suloqjv8] {
    flex-direction: column;
    align-items: stretch;
}

.inuni-nav--compact .inuni-nav__nav-item > .inuni-nav__dropdown[b-k7suloqjv8] {
    display: none;
    position: static;
    box-shadow: none;
    border: 0;
    border-radius: 0;
    margin: 0;
    padding: .5rem 0 .75rem .75rem;
    min-width: 0;
}

.inuni-nav--compact .inuni-nav__nav-item:hover > .inuni-nav__dropdown[b-k7suloqjv8],
.inuni-nav--compact .inuni-nav__nav-item:focus-within > .inuni-nav__dropdown[b-k7suloqjv8],
/* :hover/:focus-within don't exist on a tap - nav-dropdown.js toggles this class on
   tap instead (and prevents that first tap's navigation), same problem/fix as the
   .inuni-nav--open :has() fallback above. */
.inuni-nav--compact .inuni-nav__nav-item.is-expanded > .inuni-nav__dropdown[b-k7suloqjv8] {
    display: block;
}

.inuni-nav--compact .inuni-nav__dropdown--columns[b-k7suloqjv8],
.inuni-nav--compact .inuni-nav__nav-item:hover > .inuni-nav__dropdown--columns[b-k7suloqjv8],
.inuni-nav--compact .inuni-nav__nav-item:focus-within > .inuni-nav__dropdown--columns[b-k7suloqjv8] {
    grid-template-columns: 1fr;
    min-width: 0;
}

.inuni-nav--compact:has(.inuni-nav__toggle:checked) .inuni-nav__menu[b-k7suloqjv8],
/* :has() fallback - some mobile browsers (older WebViews/in-app browsers reached via the
   social icons above) don't support it, which left the toggle checkbox flipping state with
   no visible effect. nav-dropdown.js mirrors that state onto .inuni-nav--open via a plain
   change listener, so this rule fires the same way regardless of :has() support. */
.inuni-nav--compact.inuni-nav--open .inuni-nav__menu[b-k7suloqjv8] {
    display: flex;
}

.inuni-nav--compact .inuni-nav__account[b-k7suloqjv8] {
    margin-left: .5rem;
    padding-left: .75rem;
}

.inuni-nav--compact .inuni-nav__user-label[b-k7suloqjv8] {
    display: none;
}
/* _content/InuniSphere.Web/Components/Shared/LanguageSwitcher.razor.rz.scp.css */
.inuni-lang-switcher[b-7y52wc8ppj] {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    border: 1px solid var(--brand-border, rgba(11, 38, 32, 0.16));
    border-radius: var(--brand-radius, 2px);
    padding: 2px;
}

/* display:contents so this <form> (needed for a real, forced page reload - see
   LanguageSwitcher.razor's own comment) contributes no box of its own to the flex layout;
   its <button> child becomes a direct flex item of .inuni-lang-switcher instead, same as a
   plain <a> would have been. */
.inuni-lang-switcher__form[b-7y52wc8ppj] {
    display: contents;
}

.inuni-lang-switcher__item[b-7y52wc8ppj] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.9rem;
    padding: 0.2rem 0.4rem;
    font-size: 0.62rem;
    font-family: inherit;
    letter-spacing: 0.08em;
    color: var(--brand-text-muted, #565B58);
    background: none;
    border: none;
    border-radius: 1px;
    cursor: pointer;
    transition: color 0.12s ease, background 0.12s ease;
}

.inuni-lang-switcher__item:hover[b-7y52wc8ppj] {
    color: var(--brand-text-main, #0B2620);
    background: var(--brand-accent-soft, #eaf4f1);
}

.inuni-lang-switcher__item.is-active[b-7y52wc8ppj] {
    color: var(--brand-primary-contrast, #fff);
    background: var(--brand-primary, #0F6E56);
}
/* _content/InuniSphere.Web/Components/Shared/ListRowCard.razor.rz.scp.css */
.app-list-row[b-lm6y8iklxr] {
    display: flex;
    gap: 1.75rem;
    align-items: flex-start;
    padding: 1.75rem 0;
    border-top: 1px solid var(--brand-border, rgba(11, 38, 32, .16));
    font-family: var(--brand-font-family, inherit);
}

.app-list-row:last-child[b-lm6y8iklxr] {
    border-bottom: 1px solid var(--brand-border, rgba(11, 38, 32, .16));
}

.app-list-row__logo[b-lm6y8iklxr] {
    flex: none;
    width: 6rem;
    aspect-ratio: 1;
    background: var(--brand-accent-soft, #eaf4f1);
    border: 1px solid var(--brand-border, rgba(11, 38, 32, .16));
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--brand-font-serif, 'Libre Baskerville', Georgia, serif);
    color: var(--brand-accent, #0F6E56);
    overflow: hidden;
}

.app-list-row__logo img[b-lm6y8iklxr] {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.app-list-row__body[b-lm6y8iklxr] {
    flex: 1 1 auto;
    min-width: 0;
}

.app-list-row__title[b-lm6y8iklxr] {
    font-family: var(--brand-font-serif, 'Libre Baskerville', Georgia, serif);
    font-size: 1.4rem;
    font-weight: 700;
    color: var(--brand-text-main, #0B2620);
    margin: 0 0 .35rem;
}

.app-list-row__description[b-lm6y8iklxr] {
    color: var(--brand-text-muted, #565B58);
    font-size: .95rem;
    max-width: 60ch;
    margin: 0 0 .9rem;
}

.app-list-row__meta[b-lm6y8iklxr] {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: .25rem 1rem;
    margin: 0;
    font-size: .85rem;
}

.app-list-row__meta dt[b-lm6y8iklxr] {
    color: var(--brand-text-muted, #565B58);
}

.app-list-row__meta dd[b-lm6y8iklxr] {
    margin: 0;
    color: var(--brand-text-main, #0B2620);
}

.app-list-row__side[b-lm6y8iklxr] {
    flex: none;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: .7rem;
    min-width: 11rem;
}

@media (max-width: 640px) {
    .app-list-row[b-lm6y8iklxr] {
        flex-direction: column;
    }

    .app-list-row__logo[b-lm6y8iklxr] {
        width: 4.5rem;
    }
}
/* _content/InuniSphere.Web/Components/Shared/Modal.razor.rz.scp.css */
.inuni-modal-backdrop[b-qnj7jw4uyk] {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 23, 0.45);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1300;
    padding: 1rem;
}

.inuni-modal[b-qnj7jw4uyk] {
    background: #fff;
    border-radius: 1rem;
    box-shadow: 0 24px 48px rgba(15, 23, 23, 0.25);
    max-width: 28rem;
    width: 100%;
    max-height: 90vh;
    overflow-y: auto;
}

.inuni-modal--wide[b-qnj7jw4uyk] {
    max-width: 44rem;
}

.inuni-modal--full-height[b-qnj7jw4uyk] {
    width: min(96vw, 90rem);
    max-width: min(96vw, 90rem);
    height: 90vh;
    max-height: 90vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.inuni-modal--full-height .inuni-modal__header[b-qnj7jw4uyk] {
    flex: 0 0 auto;
}

.inuni-modal--full-height .inuni-modal__body[b-qnj7jw4uyk] {
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.inuni-modal__header[b-qnj7jw4uyk] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid var(--brand-border, #d8e8e8);
}

.inuni-modal__title[b-qnj7jw4uyk] {
    margin: 0;
    font-size: 1.1rem;
}

.inuni-modal__close[b-qnj7jw4uyk] {
    appearance: none;
    background: none;
    border: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.25rem;
    height: 2.25rem;
    padding: 0;
    margin: -0.5rem;
    font-size: 1.4rem;
    line-height: 1;
    cursor: pointer;
    color: var(--brand-text-muted, #5d7a7a);
    flex-shrink: 0;
}

.inuni-modal__close:hover[b-qnj7jw4uyk] {
    color: #a12626;
}

.inuni-modal__body[b-qnj7jw4uyk] {
    padding: 1.5rem;
}
/* _content/InuniSphere.Web/Components/Shared/NotFoundPage.razor.rz.scp.css */
/* Same institutional look as Login.razor.css (INUNI's own identity: ink #0B2620, teal accent
   #0F6E56, Libre Baskerville serif) - a visitor landing on a dead link should still feel like
   they're on the INUNI site, not looking at a generic browser error. Own class prefix
   (inuni-not-found__*) since Blazor's CSS isolation scopes Login.razor.css's own classes to
   Login.razor's markup only. */
.inuni-not-found[b-g7uzc16kkx] {
    --ink: var(--brand-text-main, #0B2620);
    --teal: var(--brand-primary, #0F6E56);
    --paper: var(--brand-page-bg, #FAFAF8);
    --surface: var(--brand-surface, #ffffff);
    --rule: var(--brand-border, rgba(11, 38, 32, 0.16));
    --text-soft: var(--brand-text-muted, #565B58);

    position: relative;
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: clamp(1.5rem, 4vw, 3rem);
    background: var(--paper);
    font-family: "Inter", "Segoe UI", system-ui, -apple-system, sans-serif;
}

.inuni-not-found__lang[b-g7uzc16kkx] {
    position: absolute;
    top: 1.25rem;
    right: 1.5rem;
}

.inuni-not-found__card[b-g7uzc16kkx] {
    width: 100%;
    max-width: 27rem;
    background: var(--surface);
    border: 1px solid var(--rule);
    border-radius: 2px;
    padding: 2.75rem 2.5rem;
    text-align: center;
}

.inuni-not-found__brand[b-g7uzc16kkx] {
    display: flex;
    justify-content: center;
    margin-bottom: 2rem;
}

.inuni-not-found__brand-img[b-g7uzc16kkx] {
    height: 2.4rem;
    object-fit: contain;
}

.inuni-not-found__eyebrow[b-g7uzc16kkx] {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--teal);
    margin: 0 0 0.75rem;
}

.inuni-not-found__heading[b-g7uzc16kkx] {
    font-family: var(--brand-font-serif, "Libre Baskerville", Georgia, "Times New Roman", serif);
    font-weight: 400;
    font-size: 1.5rem;
    color: var(--ink);
    margin: 0 0 0.75rem;
}

.inuni-not-found__message[b-g7uzc16kkx] {
    font-size: 0.9rem;
    line-height: 1.6;
    color: var(--text-soft);
    margin: 0 0 2rem;
}

.inuni-not-found__home-link[b-g7uzc16kkx] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    background: var(--teal);
    color: var(--brand-primary-contrast, #fff);
    border: none;
    border-radius: 2px;
    padding: 0.8rem 1.5rem;
    font-size: 0.72rem;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    text-decoration: none;
    cursor: pointer;
    transition: background-color 0.12s ease;
}

.inuni-not-found__home-link:hover[b-g7uzc16kkx] {
    background: var(--ink);
}
/* _content/InuniSphere.Web/Components/Shared/PageComponents/CtaBandBlock.razor.rz.scp.css */
.app-cta-band[b-igws7dw70d] {
    background: var(--brand-accent-strong, #0B2620);
    color: #fff;
}

.app-cta-band__inner[b-igws7dw70d] {
    max-width: 1440px;
    margin: 0 auto;
    padding: 3rem 1.25rem;
    display: flex;
    flex-wrap: wrap;
    gap: 2.5rem 4rem;
    font-family: var(--brand-font-family, 'Inter', sans-serif);
}

.app-cta-band__inner > div:first-child[b-igws7dw70d] {
    flex: 1 1 320px;
}

.app-cta-band__heading[b-igws7dw70d] {
    margin: 0 0 1.2rem;
    font-family: var(--brand-font-serif, 'Libre Baskerville', Georgia, serif);
    font-weight: 300;
    font-size: 1.7rem;
}

.app-cta-band__points[b-igws7dw70d] {
    flex: 1 1 320px;
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: .9rem;
    color: rgba(255, 255, 255, .85);
    font-size: .95rem;
}
/* _content/InuniSphere.Web/Components/Shared/PageComponents/ImageFieldEditor.razor.rz.scp.css */
.page-component-editor__image-field[b-ya0iwvhml0] {
    display: flex;
    flex-direction: column;
    gap: .5rem;
    margin-bottom: 1rem;
}

.page-component-editor__image-preview[b-ya0iwvhml0] {
    max-width: 12rem;
    max-height: 8rem;
    object-fit: cover;
    border: 1px solid var(--brand-border, #d8e8e8);
    border-radius: var(--brand-radius, .5rem);
}

.page-component-editor__image-row[b-ya0iwvhml0] {
    display: flex;
    align-items: center;
    gap: .6rem;
    padding: .4rem;
    border: 1px solid var(--brand-border, #d8e8e8);
    border-radius: var(--brand-radius, .5rem);
}

.page-component-editor__image-thumb[b-ya0iwvhml0] {
    width: 3.5rem;
    height: 3.5rem;
    object-fit: cover;
    border-radius: calc(var(--brand-radius, .5rem) - .15rem);
    flex: none;
}

.page-component-editor__image-error[b-ya0iwvhml0] {
    margin: 0;
    font-size: .78rem;
    color: var(--brand-danger, #b3261e);
}
/* _content/InuniSphere.Web/Components/Shared/PageComponents/PageComponentEditor.razor.rz.scp.css */
/* Class names below keep the "zarzadzaj-strona__*" prefix carried over from where this markup
   was extracted (ZarzadzajStrona.razor) - cosmetic naming debt, not worth renaming ~40
   references for two callers (ZarzadzajStrona.razor and NewsBuilder.razor both host this same
   component now). Blazor's CSS isolation scopes these to only this component's own markup
   regardless of the shared name. */

.page-component-editor[b-v1nt68tl7j] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 18rem;
    gap: 1.5rem;
    align-items: start;
}

.inuni-lang-switcher[b-v1nt68tl7j] {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    border: 1px solid var(--brand-border, rgba(11, 38, 32, 0.16));
    border-radius: var(--brand-radius, 2px);
    padding: 2px;
    width: fit-content;
}

.inuni-lang-switcher__item[b-v1nt68tl7j] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2.4rem;
    padding: .3rem .5rem;
    font-size: .7rem;
    font-family: inherit;
    font-weight: 600;
    letter-spacing: .08em;
    color: var(--brand-text-muted, #565B58);
    background: none;
    border: none;
    border-radius: 1px;
    cursor: pointer;
    transition: color .12s ease, background .12s ease;
}

.inuni-lang-switcher__item:hover[b-v1nt68tl7j] {
    color: var(--brand-text-main, #0B2620);
    background: var(--brand-accent-soft, #eaf4f1);
}

.inuni-lang-switcher__item.is-active[b-v1nt68tl7j] {
    color: var(--brand-primary-contrast, #fff);
    background: var(--brand-primary, #0F6E56);
}

.zarzadzaj-strona__editor[b-v1nt68tl7j] {
    border: 1px solid var(--brand-border, #d8e8e8);
    border-radius: var(--brand-radius, .5rem);
    padding: 1.25rem;
    background: var(--brand-surface, #fff);
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.zarzadzaj-strona__stack[b-v1nt68tl7j] {
    display: flex;
    flex-direction: column;
    gap: .75rem;
}

.zarzadzaj-strona__component[b-v1nt68tl7j] {
    border: 1px solid var(--brand-border, #d8e8e8);
    border-radius: var(--brand-radius, .5rem);
    background: #fff;
}

.zarzadzaj-strona__component--hidden[b-v1nt68tl7j] {
    background: var(--brand-accent-soft, #eaf4f1);
    border-style: dashed;
    opacity: .7;
}

.zarzadzaj-strona__component-head[b-v1nt68tl7j] {
    display: flex;
    align-items: center;
    gap: .65rem;
    padding: .65rem .75rem;
}

.zarzadzaj-strona__component-move[b-v1nt68tl7j] {
    display: flex;
    flex-direction: column;
    gap: 0;
    flex: none;
}

.zarzadzaj-strona__component-move button[b-v1nt68tl7j] {
    background: none;
    border: 0;
    cursor: pointer;
    color: var(--brand-text-muted, #5d7a7a);
    line-height: 1;
    padding: .1rem .3rem;
}

.zarzadzaj-strona__component-move button:disabled[b-v1nt68tl7j] {
    opacity: .3;
    cursor: not-allowed;
}

.zarzadzaj-strona__component-title[b-v1nt68tl7j] {
    font-weight: 600;
    font-size: .9rem;
    color: var(--brand-text-main, #0B2620);
}

.zarzadzaj-strona__component-title--btn[b-v1nt68tl7j] {
    flex: 1;
    text-align: left;
    background: none;
    border: 0;
    padding: 0;
    font: inherit;
    cursor: pointer;
}

.zarzadzaj-strona__component-title--btn:hover[b-v1nt68tl7j] {
    text-decoration: underline;
}

.zarzadzaj-strona__component-actions[b-v1nt68tl7j] {
    margin-left: auto;
    display: flex;
    gap: .15rem;
}

.zarzadzaj-strona__component-actions button[b-v1nt68tl7j] {
    background: none;
    border: 0;
    border-radius: .25rem;
    cursor: pointer;
    width: 1.9rem;
    height: 1.9rem;
    color: var(--brand-text-muted, #5d7a7a);
}

.zarzadzaj-strona__component-actions button:hover[b-v1nt68tl7j] {
    background: var(--brand-accent-soft, #eaf4f1);
    color: var(--brand-text-main, #0B2620);
}

.zarzadzaj-strona__component-body[b-v1nt68tl7j] {
    border-top: 1px solid var(--brand-border, #d8e8e8);
    padding: 1rem .75rem;
    display: flex;
    flex-direction: column;
    gap: .9rem;
}

.page-component-editor__panel-body[b-v1nt68tl7j] {
    display: flex;
    flex-direction: column;
    gap: .9rem;
}

.zarzadzaj-strona__component-preview[b-v1nt68tl7j] {
    border-top: 1px dashed var(--brand-border, #d8e8e8);
    padding-top: .9rem;
}

.zarzadzaj-strona__component-preview-label[b-v1nt68tl7j] {
    margin: 0 0 .5rem;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--brand-text-muted, #5d7a7a);
}

.zarzadzaj-strona__component-preview-stage[b-v1nt68tl7j] {
    border: 1px solid var(--brand-border, #d8e8e8);
    border-radius: var(--brand-radius, .5rem);
    overflow: auto;
    background: #fff;
}

.zarzadzaj-strona__list-field label[b-v1nt68tl7j] {
    display: block;
    font-size: .82rem;
    font-weight: 600;
    margin-bottom: .5rem;
    color: var(--brand-text-main, #0B2620);
}

.zarzadzaj-strona__list-row[b-v1nt68tl7j] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(8rem, 1fr)) auto;
    gap: .5rem;
    align-items: center;
    margin-bottom: .5rem;
}

.page-component-editor__field-label[b-v1nt68tl7j] {
    display: block;
    font-size: .82rem;
    font-weight: 600;
    margin-bottom: .35rem;
    color: var(--brand-text-main, #0B2620);
}

.zarzadzaj-strona__addbar[b-v1nt68tl7j] {
    display: flex;
}

.zarzadzaj-strona__savebar[b-v1nt68tl7j] {
    position: sticky;
    bottom: 0;
    background: #fff;
    border-top: 1px solid var(--brand-border, #d8e8e8);
    padding-top: 1rem;
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
}

.zarzadzaj-strona__savebar-status[b-v1nt68tl7j] {
    font-size: .85rem;
    color: var(--brand-text-muted, #5d7a7a);
    display: flex;
    align-items: center;
    gap: .5rem;
    flex-wrap: wrap;
}

.page-component-editor__scheduled-badge[b-v1nt68tl7j] {
    font-size: .74rem;
    font-weight: 600;
    color: #8a5a00;
    background: #fff3d6;
    border-radius: .3rem;
    padding: .15rem .5rem;
}

.zarzadzaj-strona__savebar-actions[b-v1nt68tl7j] {
    margin-left: auto;
    display: flex;
    gap: .5rem;
    flex-wrap: wrap;
}

.zarzadzaj-strona__modal-cat[b-v1nt68tl7j] {
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--brand-text-muted, #5d7a7a);
    margin: 1rem 0 .6rem;
}

.zarzadzaj-strona__modal-cat:first-child[b-v1nt68tl7j] {
    margin-top: 0;
}

.zarzadzaj-strona__modal-grid[b-v1nt68tl7j] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
    gap: .6rem;
}

.zarzadzaj-strona__modal-option[b-v1nt68tl7j] {
    text-align: left;
    border: 1px solid var(--brand-border, #d8e8e8);
    border-radius: var(--brand-radius, .5rem);
    padding: .8rem .9rem;
    background: #fff;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    gap: .2rem;
}

.zarzadzaj-strona__modal-option:hover:not(:disabled)[b-v1nt68tl7j] {
    border-color: var(--brand-accent, #0F6E56);
    background: var(--brand-accent-soft, #eaf4f1);
}

.zarzadzaj-strona__modal-option:disabled[b-v1nt68tl7j] {
    opacity: .5;
    cursor: not-allowed;
}

.zarzadzaj-strona__modal-option b[b-v1nt68tl7j] {
    font-size: .88rem;
    color: var(--brand-text-main, #0B2620);
}

.zarzadzaj-strona__modal-option span[b-v1nt68tl7j] {
    font-size: .78rem;
    color: var(--brand-text-muted, #5d7a7a);
}

.zarzadzaj-strona__modal-confirm-actions[b-v1nt68tl7j] {
    display: flex;
    justify-content: flex-end;
    gap: .5rem;
    margin-top: 1.25rem;
}

.page-component-editor__publish-options[b-v1nt68tl7j] {
    display: flex;
    flex-direction: column;
    gap: .6rem;
    margin: .75rem 0;
}

.page-component-editor__radio[b-v1nt68tl7j] {
    display: flex;
    align-items: center;
    gap: .4rem;
    font-size: .88rem;
}

.zarzadzaj-strona__audit[b-v1nt68tl7j] {
    border: 1px solid var(--brand-border, #d8e8e8);
    border-radius: var(--brand-radius, .5rem);
    padding: 1rem;
    background: var(--brand-surface, #fff);
    position: sticky;
    top: 1rem;
}

.zarzadzaj-strona__audit-title[b-v1nt68tl7j] {
    margin: 0 0 .75rem;
    font-size: .82rem;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--brand-text-muted, #5d7a7a);
}

.zarzadzaj-strona__audit-empty[b-v1nt68tl7j] {
    font-size: .82rem;
    color: var(--brand-text-muted, #5d7a7a);
}

.zarzadzaj-strona__audit-list[b-v1nt68tl7j] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: .85rem;
}

.zarzadzaj-strona__audit-item[b-v1nt68tl7j] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: .3rem;
    padding-bottom: .85rem;
    border-bottom: 1px solid var(--brand-border, #e5e5e5);
}

.zarzadzaj-strona__audit-item:last-child[b-v1nt68tl7j] {
    padding-bottom: 0;
    border-bottom: 0;
}

.zarzadzaj-strona__audit-person[b-v1nt68tl7j] {
    font-size: .82rem;
    font-weight: 600;
    color: var(--brand-text-main, #0B2620);
}

.zarzadzaj-strona__audit-time[b-v1nt68tl7j] {
    font-size: .76rem;
    color: var(--brand-text-muted, #93a5a5);
}

.zarzadzaj-strona__audit-item-head[b-v1nt68tl7j] {
    display: flex;
    align-items: center;
    gap: .4rem;
}

.zarzadzaj-strona__audit-version[b-v1nt68tl7j] {
    font-family: monospace;
    font-size: .78rem;
    font-weight: 700;
    color: var(--brand-text-main, #0B2620);
}

.zarzadzaj-strona__audit-view[b-v1nt68tl7j] {
    background: none;
    border: 0;
    padding: 0;
    margin-top: .1rem;
    font-size: .76rem;
    font-weight: 600;
    color: var(--brand-accent, #0F6E56);
    cursor: pointer;
}

.zarzadzaj-strona__audit-view:hover[b-v1nt68tl7j] {
    text-decoration: underline;
}

.zarzadzaj-strona__snapshot-meta[b-v1nt68tl7j] {
    display: flex;
    align-items: center;
    gap: .5rem;
    font-size: .85rem;
    color: var(--brand-text-muted, #5d7a7a);
    margin: 0 0 1rem;
}

.zarzadzaj-strona__snapshot-tabs[b-v1nt68tl7j] {
    display: flex;
    gap: .25rem;
    border-bottom: 1px solid var(--brand-border, #e5e5e5);
    margin-bottom: 1rem;
}

.zarzadzaj-strona__snapshot-tab[b-v1nt68tl7j] {
    background: none;
    border: 0;
    border-bottom: 2px solid transparent;
    padding: .5rem .2rem;
    font-size: .82rem;
    font-weight: 600;
    color: var(--brand-text-muted, #5d7a7a);
    cursor: pointer;
}

.zarzadzaj-strona__snapshot-tab.is-active[b-v1nt68tl7j] {
    border-bottom-color: var(--brand-accent, #0F6E56);
    color: var(--brand-text-main, #0B2620);
}

.zarzadzaj-strona__snapshot-preview[b-v1nt68tl7j] {
    border: 1px solid var(--brand-border, #d8e8e8);
    border-radius: var(--brand-radius, .5rem);
    max-height: 32rem;
    overflow: auto;
    background: #fff;
}

.zarzadzaj-strona__snapshot-list[b-v1nt68tl7j] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: .6rem;
}

.zarzadzaj-strona__snapshot-item[b-v1nt68tl7j] {
    border: 1px solid var(--brand-border, #d8e8e8);
    border-radius: var(--brand-radius, .5rem);
    padding: .7rem .85rem;
}

.zarzadzaj-strona__snapshot-item-head[b-v1nt68tl7j] {
    display: flex;
    align-items: center;
    gap: .5rem;
    margin-bottom: .3rem;
}

.zarzadzaj-strona__snapshot-hidden[b-v1nt68tl7j] {
    font-size: .75rem;
    color: var(--brand-text-muted, #93a5a5);
    font-style: italic;
}

.zarzadzaj-strona__snapshot-summary[b-v1nt68tl7j] {
    margin: 0;
    font-size: .85rem;
    color: var(--brand-text-main, #0B2620);
}

.zarzadzaj-strona__snapshot-diff-note[b-v1nt68tl7j] {
    font-size: .82rem;
    color: var(--brand-text-muted, #5d7a7a);
    font-style: italic;
    margin: 0 0 .75rem;
}

.zarzadzaj-strona__diff-list[b-v1nt68tl7j] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: .75rem;
}

.zarzadzaj-strona__diff-item[b-v1nt68tl7j] {
    border: 1px solid var(--brand-border, #d8e8e8);
    border-radius: var(--brand-radius, .5rem);
    padding: .7rem .85rem;
}

.zarzadzaj-strona__diff-item-head[b-v1nt68tl7j] {
    display: flex;
    align-items: center;
    gap: .5rem;
    margin-bottom: .4rem;
}

.zarzadzaj-strona__diff-status[b-v1nt68tl7j] {
    font-size: .74rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.zarzadzaj-strona__diff-status--added[b-v1nt68tl7j] {
    color: #1a7a4c;
}

.zarzadzaj-strona__diff-status--removed[b-v1nt68tl7j] {
    color: #b3261e;
}

.zarzadzaj-strona__diff-field[b-v1nt68tl7j] {
    margin-bottom: .5rem;
    font-size: .82rem;
}

.zarzadzaj-strona__diff-field:last-child[b-v1nt68tl7j] {
    margin-bottom: 0;
}

.zarzadzaj-strona__diff-field b[b-v1nt68tl7j] {
    display: block;
    color: var(--brand-text-main, #0B2620);
    margin-bottom: .15rem;
}

.zarzadzaj-strona__diff-removed[b-v1nt68tl7j] {
    color: #b3261e;
    background: #fbeaea;
    border-radius: 2px;
    padding: .15rem .4rem;
    text-decoration: line-through;
    margin-bottom: .15rem;
}

.zarzadzaj-strona__diff-added[b-v1nt68tl7j] {
    color: #1a7a4c;
    background: #e9f7ef;
    border-radius: 2px;
    padding: .15rem .4rem;
}

@media (max-width: 900px) {
    .page-component-editor[b-v1nt68tl7j] {
        grid-template-columns: 1fr;
    }

    .zarzadzaj-strona__audit[b-v1nt68tl7j] {
        position: static;
    }
}
/* _content/InuniSphere.Web/Components/Shared/PageComponents/PartnerLogosBlock.razor.rz.scp.css */
.app-partner-logos[b-gnwzq9baod] {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem 2.5rem;
    align-items: center;
    justify-content: center;
    padding: 2rem 1.25rem;
    font-family: var(--brand-font-family, 'Inter', sans-serif);
    color: var(--brand-text-muted, #565B58);
}

.app-partner-logos a[b-gnwzq9baod] {
    color: inherit;
    text-decoration: none;
}

.app-partner-logos[b-gnwzq9baod]  img {
    height: 2.5rem;
    width: auto;
    object-fit: contain;
    filter: grayscale(1);
    opacity: .75;
    transition: filter .12s ease, opacity .12s ease;
}

.app-partner-logos[b-gnwzq9baod]  img:hover {
    filter: none;
    opacity: 1;
}

.app-partner-logos a:hover[b-gnwzq9baod] {
    color: var(--brand-accent, #0F6E56);
}
/* _content/InuniSphere.Web/Components/Shared/PageComponents/TextBlockBlock.razor.rz.scp.css */
.app-page-content-block[b-i733lsl3vp] {
    font-family: var(--brand-font-family, 'Inter', sans-serif);
    color: var(--brand-text-main, #0B2620);
    line-height: 1.6;
}

.app-page-content-block[b-i733lsl3vp]  :is(h1, h2, h3, h4) {
    font-family: var(--brand-font-serif, 'Libre Baskerville', Georgia, serif);
    color: var(--brand-text-main, #0B2620);
    margin: 1.2em 0 .5em;
}

.app-page-content-block[b-i733lsl3vp]  :is(h1, h2, h3, h4):first-child {
    margin-top: 0;
}

.app-page-content-block[b-i733lsl3vp]  p {
    margin: 0 0 1em;
}

.app-page-content-block[b-i733lsl3vp]  :is(ul, ol) {
    margin: 0 0 1em;
    padding-left: 1.4em;
}

.app-page-content-block[b-i733lsl3vp]  a {
    color: var(--brand-accent, #0F6E56);
}

.app-page-content-block[b-i733lsl3vp]  blockquote {
    margin: 0 0 1em;
    padding-left: 1em;
    border-left: 3px solid var(--brand-border, rgba(11, 38, 32, .16));
    color: var(--brand-text-muted, #565B58);
}

.app-page-content-block[b-i733lsl3vp]  img {
    max-width: 100%;
    height: auto;
}
/* _content/InuniSphere.Web/Components/Shared/ReimbursementHistoryView.razor.rz.scp.css */
.finance-history[b-904r5ma13w] {
    background: #f6f8f7;
    border-radius: 0.5rem;
    padding: 0.6rem 0.9rem;
    margin: 0.5rem 0;
}

.finance-history__list[b-904r5ma13w] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.finance-history__list li[b-904r5ma13w] {
    font-size: 0.82rem;
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    align-items: baseline;
}

.finance-history__when[b-904r5ma13w] {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    color: #5d7a7a;
    font-size: 0.76rem;
}

.finance-history__what[b-904r5ma13w] {
    font-weight: 600;
}

.finance-history__who[b-904r5ma13w] {
    color: #5d7a7a;
}

.finance-history__comment[b-904r5ma13w] {
    flex-basis: 100%;
    font-style: italic;
    color: #3b3b3b;
}
/* _content/InuniSphere.Web/Components/Shared/RoomMap.razor.rz.scp.css */
.room-map[b-enre3o7du8] {
    position: relative;
    width: 100%;
    max-width: 800px;
    border: 1px solid var(--brand-border, #d8e8e8);
    border-radius: 0.5rem;
    background: #f4fafa;
}

.room-map__image[b-enre3o7du8] {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    cursor: crosshair;
    user-select: none;
}

.room-map__placeholder[b-enre3o7du8] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    color: var(--brand-text-muted, #5d7a7a);
}

.room-map__pin[b-enre3o7du8] {
    position: absolute;
    transform: translate(-50%, -50%);
    appearance: none;
    border: 2px solid #185354;
    background: #fff;
    color: #185354;
    border-radius: 999px;
    padding: 0.15rem 0.6rem;
    font-size: 0.75rem;
    font-weight: 700;
    white-space: nowrap;
    cursor: pointer;
    box-shadow: 0 1px 3px rgba(16, 24, 40, 0.2);
}

.room-map__pin:hover:not(:disabled)[b-enre3o7du8] {
    background: #185354;
    color: #fff;
}

.room-map__pin--mine[b-enre3o7du8] {
    background: #1a7a3e;
    border-color: #1a7a3e;
    color: #fff;
}

.room-map__pin--disabled[b-enre3o7du8] {
    opacity: 0.5;
    cursor: not-allowed;
}

.room-map__mask[b-enre3o7du8] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    /* Each mask is a full-container-sized image (mostly transparent outside its own highlighted
       pixels) - its hit-test area is the whole rectangle, not just the visibly-colored part.
       pointer-events:none keeps every click passing through to the base map / pins underneath,
       exactly like before hover support was attempted here; a hover tooltip on the highlight
       itself would need per-pixel alpha hit-testing CSS can't do, so that's carried by the pin's
       own always-visible label + title instead (see RoomMap.razor's HotspotTooltip). */
    pointer-events: none;
}

.room-map__pin--pending[b-enre3o7du8] {
    border-style: dashed;
    border-color: #b8720a;
    color: #b8720a;
    background: #fff8ec;
    pointer-events: none;
}
/* _content/InuniSphere.Web/Components/Shared/RoomMapEditor.razor.rz.scp.css */
.room-map-editor[b-lujdzd53cw] {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
    gap: 0.75rem;
}

.room-map-editor__meta[b-lujdzd53cw] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex: 0 0 auto;
    margin: 0;
}

.room-map-editor__toolbar[b-lujdzd53cw] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
    flex: 0 0 auto;
}

.room-map-editor__toolbar-spacer[b-lujdzd53cw] {
    flex: 1 1 auto;
}

.room-map-editor__search input[b-lujdzd53cw] {
    max-width: 14rem;
}

.room-map-editor__zoom[b-lujdzd53cw] {
    display: flex;
    gap: 0.25rem;
}

.room-map-editor__body[b-lujdzd53cw] {
    display: flex;
    gap: 1rem;
    flex: 1 1 auto;
    min-height: 0;
}

.room-map-editor__canvas-area[b-lujdzd53cw] {
    flex: 1 1 68%;
    min-width: 0;
    border: 1px solid var(--brand-border, #d8e8e8);
    border-radius: 0.5rem;
    background: #eef5f5;
    overflow: hidden;
}

.room-map-editor__viewport[b-lujdzd53cw] {
    width: 100%;
    height: 100%;
    overflow: hidden;
    position: relative;
    touch-action: none;
}

/* Panning/dragging requires holding Cmd/Ctrl (see room-map.js's isPanModifier) - a plain
   click always reaches the base image/chip untouched, so the grab cursor only appears while
   that modifier is actually held, instead of implying every click can pan. */
.room-map-editor__viewport--pannable[b-lujdzd53cw] {
    cursor: grab;
}

.room-map-editor__viewport--pannable:active[b-lujdzd53cw] {
    cursor: grabbing;
}

.room-map-editor__canvas[b-lujdzd53cw] {
    position: absolute;
    top: 0;
    left: 0;
    transform-origin: 0 0;
}

.room-map-editor__image[b-lujdzd53cw] {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    cursor: crosshair;
    user-select: none;
    -webkit-user-drag: none;
}

.room-map-editor__mask[b-lujdzd53cw] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
}

.room-map-editor__dropzone[b-lujdzd53cw] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    height: 100%;
    min-height: 16rem;
    border: 2px dashed #b9d3d3;
    border-radius: 0.5rem;
    background: #f4fafa;
    color: var(--brand-text-muted, #5d7a7a);
    cursor: pointer;
    text-align: center;
    padding: 1rem;
}

.room-map-editor__dropzone:hover[b-lujdzd53cw] {
    border-color: #185354;
    background: #eef8f8;
}

.room-map-editor__dropzone input[type="file"][b-lujdzd53cw] {
    max-width: 18rem;
}

.room-chip[b-lujdzd53cw] {
    position: absolute;
    transform: translate(-50%, -50%);
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    appearance: none;
    border: 2px solid #7a8c8c;
    background: #f1f3f3;
    color: #2c3e3e;
    border-radius: 999px;
    padding: 0.15rem 0.55rem;
    font-size: 0.75rem;
    font-weight: 700;
    white-space: nowrap;
    cursor: pointer;
    box-shadow: 0 1px 3px rgba(16, 24, 40, 0.2);
    touch-action: none;
}

.room-chip--male[b-lujdzd53cw] {
    border-color: #2f6fa8;
    background: #eaf2fa;
    color: #1d4e77;
}

.room-chip--female[b-lujdzd53cw] {
    border-color: #b8548a;
    background: #fbeaf3;
    color: #7c3563;
}

.room-chip--selected[b-lujdzd53cw] {
    outline: 3px solid #185354;
    outline-offset: 1px;
}

.room-chip--highlighted[b-lujdzd53cw] {
    animation: room-chip-pulse-b-lujdzd53cw 1s ease-in-out infinite;
}

@keyframes room-chip-pulse-b-lujdzd53cw {
    0%, 100% {
        box-shadow: 0 0 0 0 rgba(24, 83, 84, 0.55);
    }
    50% {
        box-shadow: 0 0 0 6px rgba(24, 83, 84, 0);
    }
}

.room-chip__occupancy[b-lujdzd53cw] {
    opacity: 0.8;
    font-weight: 600;
}

.room-chip__warning[b-lujdzd53cw] {
    color: #b8720a;
}

.room-chip--pending[b-lujdzd53cw] {
    border-style: dashed;
    border-color: #b8720a;
    color: #b8720a;
    background: #fff8ec;
    pointer-events: none;
}

.room-map-editor__sidebar[b-lujdzd53cw] {
    flex: 0 0 20rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    overflow-y: auto;
    padding-right: 0.25rem;
}

.room-map-editor__inspector-row[b-lujdzd53cw] {
    display: flex;
    justify-content: space-between;
    margin: 0 0 0.35rem;
    font-size: 0.875rem;
}

.room-map-editor__inspector-row dt[b-lujdzd53cw] {
    color: var(--brand-text-muted, #5d7a7a);
    font-weight: 400;
}

.room-map-editor__inspector-row dd[b-lujdzd53cw] {
    margin: 0;
    font-weight: 600;
}

.room-map-editor__footer[b-lujdzd53cw] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex: 0 0 auto;
    padding-top: 0.75rem;
    border-top: 1px solid var(--brand-border, #d8e8e8);
}

/* .room-map-editor__body is a flex ROW with the sidebar pinned to a fixed 20rem (320px) - on a
   phone-width viewport (~375px) that alone exceeds the available width, leaving no room for the
   canvas at all. Stack canvas above sidebar instead, each taking the full width. */
@media (max-width: 900px) {
    .room-map-editor__body[b-lujdzd53cw] {
        flex-direction: column;
    }

    .room-map-editor__canvas-area[b-lujdzd53cw] {
        flex: 0 0 18rem;
        min-height: 14rem;
    }

    .room-map-editor__sidebar[b-lujdzd53cw] {
        flex: 1 1 auto;
        width: 100%;
    }

    .room-map-editor__search input[b-lujdzd53cw],
    .room-map-editor__dropzone input[type="file"][b-lujdzd53cw] {
        max-width: none;
    }

    .room-map-editor__meta[b-lujdzd53cw],
    .room-map-editor__footer[b-lujdzd53cw] {
        flex-wrap: wrap;
        gap: 0.5rem;
    }
}
/* _content/InuniSphere.Web/Components/Shared/SegmentedTabs.razor.rz.scp.css */
.app-segmented-tabs[b-kuqa68eue8] {
    display: flex;
    flex-wrap: wrap;
    border-top: 1px solid var(--brand-border, rgba(11, 38, 32, .16));
}

.app-segmented-tab[b-kuqa68eue8] {
    flex: 1 1 220px;
    text-align: left;
    background: none;
    border: 0;
    border-right: 1px solid var(--brand-border, rgba(11, 38, 32, .16));
    border-bottom: 3px solid transparent;
    /* Symmetric on every item, including the first/last - an earlier version zeroed the first
       item's left padding (and relied on it for every other item's own right padding to imply
       spacing before the divider) on the assumption the section heading above was left-aligned,
       so tab 1 should sit flush with it. That heading is centered on this page, so the trick
       bought nothing and just left every non-first tab's text flush against its divider. */
    padding: 1.4rem 1.5rem 1.3rem;
    cursor: pointer;
    font-family: var(--brand-font-family, inherit);
    display: flex;
    flex-direction: column;
    gap: .3rem;
    transition: background .12s ease, border-color .12s ease;
}

.app-segmented-tab:last-child[b-kuqa68eue8] {
    border-right: 0;
}

.app-segmented-tab:hover[b-kuqa68eue8] {
    background: var(--brand-accent-soft, #eaf4f1);
}

.app-segmented-tab--active[b-kuqa68eue8] {
    border-bottom-color: var(--brand-accent, #0F6E56);
    background: var(--brand-accent-soft, #eaf4f1);
}

.app-segmented-tab__title[b-kuqa68eue8] {
    font-family: var(--brand-font-serif, 'Libre Baskerville', Georgia, serif);
    font-size: 1.35rem;
    color: var(--brand-text-main, #0B2620);
}

.app-segmented-tab--active .app-segmented-tab__title[b-kuqa68eue8] {
    color: var(--brand-accent, #0F6E56);
}

.app-segmented-tab__subtitle[b-kuqa68eue8] {
    font-size: .8rem;
    color: var(--brand-text-muted, #565B58);
}

.app-segmented-tab__description[b-kuqa68eue8] {
    font-size: .88rem;
    color: var(--brand-text-muted, #565B58);
    line-height: 1.5;
    margin: .2rem 0 0;
}

.app-segmented-tab__meta[b-kuqa68eue8] {
    font-size: .78rem;
    font-weight: 600;
    color: var(--brand-accent, #0F6E56);
    margin-top: .3rem;
}

@media (max-width: 640px) {
    .app-segmented-tabs[b-kuqa68eue8] {
        flex-direction: column;
        border-top: 0;
        /* A stacked active tab's colored fill reaches its own edges, so its bottom padding
           reads as part of the highlight while the next (inactive) tab's white top padding is
           invisible against the page background - the two together look like they're touching
           even though the padding is identical. A real gap (not just border+padding) fixes it
           regardless of which tab is active. */
        gap: .75rem;
    }

    .app-segmented-tab[b-kuqa68eue8] {
        border-right: 0;
        border-top: 1px solid var(--brand-border, rgba(11, 38, 32, .16));
        border-bottom: 0;
        padding: 1.1rem 1.25rem;
    }

    .app-segmented-tab--active[b-kuqa68eue8] {
        border-left: 3px solid var(--brand-accent, #0F6E56);
    }
}
/* _content/InuniSphere.Web/Components/Shared/StatStrip.razor.rz.scp.css */
.app-stat-strip[b-ebasmrjzro] {
    background: var(--brand-accent-soft, #eaf4f1);
    border-top: 1px solid var(--brand-border, rgba(11, 38, 32, .16));
    border-bottom: 1px solid var(--brand-border, rgba(11, 38, 32, .16));
}

.app-stat-strip__inner[b-ebasmrjzro] {
    max-width: 1440px;
    margin: 0 auto;
    padding: 1.35rem 1.25rem;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 1.5rem 3rem;
    align-items: baseline;
}

.app-stat-strip__item[b-ebasmrjzro] {
    display: flex;
    align-items: baseline;
    gap: .6rem;
}

.app-stat-strip__value[b-ebasmrjzro] {
    font-family: var(--brand-font-serif, 'Libre Baskerville', Georgia, serif);
    font-size: 1.9rem;
    color: var(--brand-accent, #0F6E56);
}

.app-stat-strip__label[b-ebasmrjzro] {
    font-size: .9rem;
    color: var(--brand-text-muted, #565B58);
}
/* _content/InuniSphere.Web/Components/Shared/WikiPage.razor.rz.scp.css */
.wiki-breadcrumbs[b-1fjuxbdtv8] {
    width: 100%;
    padding: 0.9rem 2rem 0;
    font-size: 0.85rem;
    color: var(--brand-text-muted, #5d7a7a);
}

.wiki-breadcrumbs a[b-1fjuxbdtv8] {
    color: inherit;
    text-decoration: none;
}

.wiki-breadcrumbs a:hover[b-1fjuxbdtv8] {
    text-decoration: underline;
}

.wiki-breadcrumbs__sep[b-1fjuxbdtv8] {
    margin: 0 0.4rem;
}

.wiki-breadcrumbs [aria-current="page"][b-1fjuxbdtv8] {
    color: var(--brand-text-main, #232323);
    font-weight: 600;
}

.wiki-page[b-1fjuxbdtv8] {
    width: 100%;
    padding: 0 2rem 3rem;
}

.wiki-header[b-1fjuxbdtv8] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 1rem;
    padding-top: 1.5rem;
    margin-bottom: 1.5rem;
}

.wiki-header h1[b-1fjuxbdtv8] {
    font-family: var(--brand-font-serif, 'Libre Baskerville', Georgia, serif);
    font-weight: 400;
    margin: 0 0 0.35rem;
    font-size: 1.75rem;
    color: var(--brand-text-main, #232323);
}

.wiki-header__subtitle[b-1fjuxbdtv8] {
    margin: 0;
    color: var(--brand-text-muted, #5d7a7a);
}

.wiki-back[b-1fjuxbdtv8] {
    color: var(--brand-primary, #185354);
    text-decoration: none;
    font-weight: 600;
    font-size: 0.9rem;
    white-space: nowrap;
}

.wiki-back:hover[b-1fjuxbdtv8] {
    text-decoration: underline;
}

.wiki-layout[b-1fjuxbdtv8] {
    display: grid;
    grid-template-columns: 16rem minmax(0, 1fr);
    gap: 1.5rem;
    align-items: start;
}

.wiki-nav[b-1fjuxbdtv8] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    border: 1px solid var(--brand-border, #d8e8e8);
    border-radius: var(--brand-radius, 0.5rem);
    padding: 0.5rem;
    background: var(--brand-surface, #fff);
    position: sticky;
    top: 1rem;
}

.wiki-nav__item[b-1fjuxbdtv8] {
    text-align: left;
    border-left: 3px solid transparent;
    border-radius: calc(var(--brand-radius, 0.5rem) - 0.15rem);
    padding: 0.5rem 0.7rem;
    font-size: 0.85rem;
    color: var(--brand-text-muted, #5d7a7a);
    text-decoration: none;
    transition: background 0.12s ease, color 0.12s ease;
}

.wiki-nav__item:hover[b-1fjuxbdtv8] {
    background: var(--brand-accent-soft, #eaf4f1);
    color: var(--brand-accent, #0F6E56);
}

.wiki-nav__group[b-1fjuxbdtv8] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    width: 100%;
    margin: 0.8rem 0 0.25rem;
    padding: 0 0.3rem 0.25rem;
    background: none;
    border: 0;
    border-bottom: 1px solid var(--brand-border, #e5e5e5);
    font: inherit;
    font-size: 0.66rem;
    font-weight: 700;
    text-align: left;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--brand-text-muted, #93a5a5);
    cursor: pointer;
}

.wiki-nav__group:first-of-type[b-1fjuxbdtv8] {
    margin-top: 0;
}

.wiki-nav__group:hover[b-1fjuxbdtv8] {
    color: var(--brand-text-main, #0B2620);
}

.wiki-nav__group--current[b-1fjuxbdtv8] {
    color: var(--brand-accent, #0F6E56);
}

.wiki-nav__caret[b-1fjuxbdtv8] {
    font-size: 0.6rem;
    flex: none;
}

.wiki-card[b-1fjuxbdtv8] {
    background: var(--brand-surface, #fff);
    border: 1px solid var(--brand-border, #d8e8e8);
    border-radius: var(--brand-radius, 0.75rem);
    box-shadow: 0 1px 2px rgba(16, 24, 40, 0.06), 0 1px 3px rgba(16, 24, 40, 0.08);
    padding: 1.5rem 1.75rem;
    min-width: 0;
}

/* ::deep reaches into ChildContent — markup written in the *caller's* .razor file
   (e.g. IamHelp.razor), which carries the caller's own scope attribute, not this
   component's. Without ::deep these rules would silently match nothing. */
.wiki-card[b-1fjuxbdtv8]  h2 {
    font-family: var(--brand-font-serif, 'Libre Baskerville', Georgia, serif);
    font-weight: 400;
    font-size: 1.3rem;
    margin: 1.75rem 0 0.6rem;
    color: var(--brand-text-main, #232323);
    scroll-margin-top: 1rem;
}

.wiki-card[b-1fjuxbdtv8]  h2:first-child {
    margin-top: 0;
}

.wiki-card[b-1fjuxbdtv8]  h3 {
    font-family: var(--brand-font-serif, 'Libre Baskerville', Georgia, serif);
    font-weight: 400;
    font-size: 1.05rem;
    margin: 1.25rem 0 0.5rem;
    color: var(--brand-text-main, #232323);
    scroll-margin-top: 1rem;
}

.wiki-card[b-1fjuxbdtv8]  dl {
    margin: 0 0 0.75rem;
}

.wiki-card[b-1fjuxbdtv8]  dt {
    font-weight: 700;
    margin-top: 0.75rem;
}

.wiki-card[b-1fjuxbdtv8]  dt:first-child {
    margin-top: 0;
}

.wiki-card[b-1fjuxbdtv8]  dd {
    margin: 0.15rem 0 0;
    color: var(--brand-text-muted, #5d7a7a);
    line-height: 1.6;
}

.wiki-card[b-1fjuxbdtv8]  code {
    background: var(--brand-accent-soft, #f4fafa);
    border-radius: 0.25rem;
    padding: 0.1rem 0.35rem;
    font-size: 0.85em;
}

.wiki-card[b-1fjuxbdtv8]  p {
    margin: 0 0 0.75rem;
    line-height: 1.6;
}

.wiki-card[b-1fjuxbdtv8]  ul,
.wiki-card[b-1fjuxbdtv8]  ol {
    margin: 0 0 0.75rem;
    padding-left: 1.25rem;
    line-height: 1.6;
}

.wiki-card[b-1fjuxbdtv8]  li {
    margin-bottom: 0.25rem;
}

/* A field-reference table (Pole/Opis) reads as prose, not dense tabular data - same
   dark-label/muted-description split as dt/dd above, applied on top of the shared
   .app-datatable look every other admin table in the app already uses. */
.wiki-card[b-1fjuxbdtv8]  .app-datatable {
    margin: 0 0 1rem;
}

.wiki-card[b-1fjuxbdtv8]  .app-datatable td {
    color: var(--brand-text-muted, #5d7a7a);
    line-height: 1.6;
    vertical-align: top;
}

.wiki-card[b-1fjuxbdtv8]  .app-datatable td strong {
    color: var(--brand-text-main, #232323);
    font-weight: 700;
}

@media (max-width: 760px) {
    .wiki-layout[b-1fjuxbdtv8] {
        grid-template-columns: 1fr;
    }

    .wiki-nav[b-1fjuxbdtv8] {
        flex-direction: row;
        flex-wrap: wrap;
        position: static;
    }
}

@media (max-width: 640px) {
    .wiki-header[b-1fjuxbdtv8] {
        flex-direction: column;
    }
}