@import '_content/Microsoft.FluentUI.AspNetCore.Components/Microsoft.FluentUI.AspNetCore.Components.lcdo7z9xd2.bundle.scp.css';
@import '_content/StandardsCore.Ui/StandardsCore.Ui.8s37vfi8lz.bundle.scp.css';

/* /Components/LoginComponent.razor.rz.scp.css */
/* Scoped styles for LoginComponent. */

.login-component[b-ruj489k19a] {
    display: flex;
    flex-direction: column;
    gap: var(--design-unit-3x, 12px);
    padding: var(--design-unit-2x, 8px);
    max-width: 360px;
}

.login-component h1[b-ruj489k19a] {
    margin: 0 0 var(--design-unit-2x, 8px) 0;
    font-size: var(--type-ramp-plus-3-font-size, 1.5rem);
    line-height: var(--type-ramp-plus-3-line-height, 1.75rem);
}

.login-field[b-ruj489k19a] {
    display: flex;
    flex-direction: column;
    gap: var(--design-unit, 4px);
}

/* FluentTextField is a custom element; force it to fill the field row. */
.login-field fluent-text-field[b-ruj489k19a] {
    width: 100%;
}

.login-field fluent-button[b-ruj489k19a] {
    width: 100%;
    margin-top: var(--design-unit-2x, 8px);
}

.login-link-row[b-ruj489k19a] {
    margin-top: var(--design-unit, 4px);
}

    /* Click-only actions that open an Office dialog: present them as hypertext links.
   Uses Fluent design tokens so Light/Dark themes and focus rings stay correct. */
    .login-link-row[b-ruj489k19a]  fluent-button.login-link-button {
        min-width: 0;
        height: auto;
        padding: 0;
        color: var(--accent-foreground-rest);
        cursor: pointer;
    }

        .login-link-row[b-ruj489k19a]  fluent-button.login-link-button::part(control) {
            min-width: 0;
            height: auto;
            padding: 0;
            background: transparent;
            color: var(--accent-foreground-rest);
            text-decoration: underline;
            cursor: pointer;
        }

        .login-link-row[b-ruj489k19a]  fluent-button.login-link-button:hover::part(control) {
            color: var(--accent-foreground-hover);
            background: transparent;
        }

.login-error-banner-row[b-ruj489k19a] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    gap: 0.25rem;
    margin-bottom: 0.75rem;
}

/* The body and link are rendered by this component (inside the bar's child content),
   so they are reachable with plain scoped selectors. */
.login-error-body[b-ruj489k19a] {
    display: block;
    min-width: 0;
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
}

a.login-error-link[b-ruj489k19a] {
    color: var(--accent-foreground-rest);
    text-decoration: underline;
    overflow-wrap: anywhere;
    word-break: break-all;
}

.login-error-dismiss-button[b-ruj489k19a] {
    grid-column: 2;
}