/* /Components/Layout/InformationBanner.razor.rz.scp.css */
/* Markdig output (rendered via MarkupString) lives outside the scope id, so use ::deep
   to zero the trailing margin on the last block element — keeps notification__content
   visually centered when the markdown ends with a <p>. */
.notification__content[b-vpypd4n626]  > *:last-child {
    margin-bottom: 0;
}
/* /Components/Pages/Connections.razor.rz.scp.css */
/* The row markup lives in the AssignmentDisplayRow component, so most of these rules
   use ::deep to pierce the scope and match elements rendered by the child component
   (and any controls passed in via RenderFragment). Two-column grid on desktop, single
   column on mobile so controls drop below the info. */
[b-arleohrako] .assignments-row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    column-gap: 1rem;
    row-gap: 0.5rem;
    padding: 0.5rem 0.75rem;
    border: none !important;
    border-radius: 4px;
    width: 100%;
}

@media screen and (max-width: 768px) {
    [b-arleohrako] .assignments-row {
        grid-template-columns: minmax(0, 1fr);
    }

    [b-arleohrako] .assignments-row__controls {
        width: 100%;
        justify-self: stretch;
        justify-content: space-evenly !important;
    }
}

[b-arleohrako] .assignments-row--prioritized {
    background-color: #fff7d6;
}

[b-arleohrako] .assignments-row__info {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    min-width: 0;
}

[b-arleohrako] .assignments-row__title {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

[b-arleohrako] .assignments-row__title-text {
    font-weight: 600;
    word-break: break-word;
}

[b-arleohrako] .assignments-row__dates {
    font-size: 0.875rem;
    color: #4a4a4a;
}

[b-arleohrako] .assignments-row__controls {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem;
    flex-wrap: wrap;
}

[b-arleohrako] .assignments-row__controls .link-list__button {
    width: 40px;
    height: 40px;
}

[b-arleohrako] .assignments-row__icon--up,
[b-arleohrako] .assignments-row__icon--down {
    width: 22px;
    height: 22px;
}

[b-arleohrako] .assignments-row__icon--up {
    transform: rotate(-90deg);
}

[b-arleohrako] .assignments-row__icon--down {
    transform: rotate(90deg);
}

[b-arleohrako] .assignments-row__tag {
    margin: 0;
}

.assignments-row__subheading[b-arleohrako] {
    font-size: 14px;
    font-weight: bold;
    color: #5d6f7a;
    margin: 16px 0 8px 0;
}

.assignments-row__subheading:first-child[b-arleohrako] {
    margin-top: 0;
}

/* Reserve a stable line of space so the optimistic-write indicator can flip on and off
   without shifting the assignment lists below. */
.assignments-sync[b-arleohrako] {
    min-height: 1.5em;
    margin: 0 0 1rem 0;
}
/* /Components/Pages/Password.razor.rz.scp.css */
/* The framework .tag class clamps font-size to 10px and uppercases the text, which
   shrinks the CID below readable size. This box keeps the blue-light tag look but
   renders the CID at a legible size. */
.cid-display[b-gjciee5grh] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 12px 24px;
    background-color: #ecf5fb;
    border: 1px solid rgba(88, 176, 227, 0.3);
    border-radius: 4px;
    color: #52626c;
    margin-bottom: 8px;
    text-align: center;
    line-height: 1;
}

.cid-display__label[b-gjciee5grh] {
    font-size: 1.125rem;
    color: #5d6f7a;
}

.cid-display__value[b-gjciee5grh] {
    font-size: 1.75rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    line-height: 1;
    /* Crop the font's ascent/descent leading so the glyph box hugs the text.
       Without this the big CID sits low in its line box and looks off-center.
       text-box-trim isn't in Firefox yet, so negative margins do it manually. */
    margin-top: -0.18em;
    margin-bottom: -0.12em;
}
/* /Components/Shared/ComboBox.razor.rz.scp.css */
.combobox[b-apa62g6loa] {
    position: relative;
}

.combobox input:disabled[b-apa62g6loa] {
    color: #757575;
    opacity: 1;
}

.combobox input:disabled[b-apa62g6loa]::placeholder {
    color: #a0a0a0;
    opacity: 1;
}

.combobox__dropdown[b-apa62g6loa] {
    position: absolute;
    z-index: 10;
    left: 0;
    right: 0;
    top: 100%;
    max-height: 200px;
    overflow-y: auto;
    margin: 0;
    padding: 0;
    list-style: none;
    background: #fff;
    border: 1px solid #ccc;
    border-top: none;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.combobox__option[b-apa62g6loa] {
    padding: 0.25rem 18px;
    font-size: 14px;
    cursor: pointer;
}

.combobox__option:hover[b-apa62g6loa] {
    background: #f0f0f0;
}

.combobox__option--active[b-apa62g6loa] {
    background: #e6f1f0;
    box-shadow: inset 3px 0 0 #267371;
}

@media (forced-colors: active) {
    .combobox__option--active[b-apa62g6loa] {
        outline: 2px solid Highlight;
        outline-offset: -2px;
    }
}
/* /Components/Storybook/Storybook.razor.rz.scp.css */
.storybook[b-77hj7rpqe9] {
    display: flex;
    height: 100vh;
    font-family: inherit;
}

.storybook__sidebar[b-77hj7rpqe9] {
    width: 260px;
    flex-shrink: 0;
    background: #1e1e2e;
    color: #cdd6f4;
    padding: 20px 0;
    overflow-y: auto;
}

.storybook__sidebar-title[b-77hj7rpqe9] {
    font-size: 14px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #89b4fa;
    padding: 0 16px 16px;
    margin: 0;
    border-bottom: 1px solid #313244;
}

.storybook__type[b-77hj7rpqe9] {
    padding: 12px 0 0;
}

.storybook__type-title[b-77hj7rpqe9] {
    font-size: 14px;
    font-weight: 600;
    color: #cdd6f4;
    padding: 0 16px 6px;
    margin: 0;
}

.storybook__group[b-77hj7rpqe9] {
    padding: 4px 0;
}

.storybook__group-title[b-77hj7rpqe9] {
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #6c7086;
    padding: 0 16px 6px;
    margin: 0;
}

.storybook__story-btn[b-77hj7rpqe9] {
    display: block;
    width: 100%;
    text-align: left;
    background: none;
    border: none;
    color: #cdd6f4;
    padding: 6px 16px;
    font-size: 13px;
    cursor: pointer;
    line-height: 1.4;
}

.storybook__story-btn:hover[b-77hj7rpqe9] {
    background: #313244;
}

.storybook__story-btn--active[b-77hj7rpqe9] {
    background: #313244;
    color: #89b4fa;
    font-weight: 600;
}

.storybook__canvas[b-77hj7rpqe9] {
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: auto;
}

.storybook__story-header[b-77hj7rpqe9] {
    background: #fff;
    border-bottom: 1px solid #e0e0e0;
    padding: 10px 20px;
}

.storybook__breadcrumb[b-77hj7rpqe9] {
    font-size: 13px;
    color: #555;
    font-family: monospace;
}

.storybook__story-frame[b-77hj7rpqe9] {
    flex: 1;
    background: #fff;
    overflow: auto;
}

.storybook__empty[b-77hj7rpqe9] {
    padding: 40px;
    color: #888;
    font-style: italic;
}
/* /Components/Storybook/StorybookLayout.razor.rz.scp.css */
.storybook-root[b-dcpvuxxqb3] {
    min-height: 100vh;
    background: #f5f5f5;
}