/* /Components/Layout/HelpLayout.razor.rz.scp.css */
/* Help section theme overrides.

   Custom properties set on .help-layout cascade to every descendant via CSS
   variable inheritance, so overriding the brand variables here will retheme
   the whole help section without touching individual elements.

   To target specific descendant elements (h2, table, alert, etc.) use ::deep —
   Blazor's scoped-CSS rewriter adds a per-component attribute to .help-layout
   itself, and ::deep tells it to keep the attribute on the ancestor and match
   descendants without it.

   Uncomment and adjust the values you want to change. */

.help-layout[b-gxd6lflgnc] {
    /* Brand */
    /* --color-primary:         ; */
    /* --color-primary-dark:    ; */
    /* --color-primary-deeper:  ; */

    /* Accents */
    /* --color-accent-gold:     ; */
    /* --color-accent-sky:      ; */
    /* --color-accent-lavender: ; */

    /* Status */
    /* --color-success:         ; */
    /* --color-danger:          ; */

    /* Surfaces */
    /* --color-bg-page:         ; */
    /* --color-bg-card:         ; */
    /* --color-border:          ; */

    /* Text */
    /* --color-text-body:       ; */
    /* --color-text-muted:      ; */
}

/* Dark-mode equivalents. Override the same variables here for dark theme. */
[data-bs-theme="dark"] .help-layout[b-gxd6lflgnc] {
    /* --color-primary-deeper:  ; */
    /* ...etc */
}

/* ── Heading scale ────────────────────────────────────────────────────────
   Help pages use bare <h1>..<h4> rather than the .page-header wrapper used
   elsewhere, so without these rules they fall through to Bootstrap defaults
   (much larger than the rest of the app). These sizes line h2 up with
   .page-header h2 (1rem) and step the others around it. */

.help-layout[b-gxd6lflgnc]  h1 {
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--color-primary-deeper);
    margin-bottom: 0.6rem;
}

.help-layout[b-gxd6lflgnc]  h2 {
    font-size: 1rem;
    font-weight: 700;
    color: var(--color-primary-deeper);
    margin-top: 1.25rem;
    margin-bottom: 0.4rem;
}

.help-layout[b-gxd6lflgnc]  h3 {
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--color-text-body);
    margin-top: 0.9rem;
    margin-bottom: 0.3rem;
}

.help-layout[b-gxd6lflgnc]  h4 {
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--color-text-muted);
    margin-top: 0.7rem;
    margin-bottom: 0.25rem;
}

/* Per-element overrides — use ::deep to reach descendants rendered inside @Body.
   These are illustrative; uncomment and tweak as needed.

.help-layout ::deep table caption {
    color: var(--color-text-muted);
    font-style: italic;
}

.help-layout ::deep .alert-info {
    background-color: var(--color-accent-sky);
    border-color: var(--color-primary);
    color: var(--color-text-body);
}
*/
/* /Components/Layout/MainLayout.razor.rz.scp.css */
.sidebar[b-r9frl54ets] {
    background-color: var(--color-bg-card);
    border-right: 1px solid var(--color-border);
}

#blazor-error-ui[b-r9frl54ets] {
    color-scheme: light only;
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-r9frl54ets] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/Layout/NavMenu.razor.rz.scp.css */
/* NavMenu scoped styles removed — all sidebar styling is in app.css */
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-bs7gjv8ofs],
.components-reconnect-repeated-attempt-visible[b-bs7gjv8ofs],
.components-reconnect-failed-visible[b-bs7gjv8ofs],
.components-pause-visible[b-bs7gjv8ofs],
.components-resume-failed-visible[b-bs7gjv8ofs],
.components-rejoining-animation[b-bs7gjv8ofs] {
    display: none;
}

#components-reconnect-modal.components-reconnect-show .components-reconnect-first-attempt-visible[b-bs7gjv8ofs],
#components-reconnect-modal.components-reconnect-show .components-rejoining-animation[b-bs7gjv8ofs],
#components-reconnect-modal.components-reconnect-paused .components-pause-visible[b-bs7gjv8ofs],
#components-reconnect-modal.components-reconnect-resume-failed .components-resume-failed-visible[b-bs7gjv8ofs],
#components-reconnect-modal.components-reconnect-retrying[b-bs7gjv8ofs],
#components-reconnect-modal.components-reconnect-retrying .components-reconnect-repeated-attempt-visible[b-bs7gjv8ofs],
#components-reconnect-modal.components-reconnect-retrying .components-rejoining-animation[b-bs7gjv8ofs],
#components-reconnect-modal.components-reconnect-failed[b-bs7gjv8ofs],
#components-reconnect-modal.components-reconnect-failed .components-reconnect-failed-visible[b-bs7gjv8ofs] {
    display: block;
}


#components-reconnect-modal[b-bs7gjv8ofs] {
    background-color: white;
    width: 20rem;
    margin: 20vh auto;
    padding: 2rem;
    border: 0;
    border-radius: 0.5rem;
    box-shadow: 0 3px 6px 2px rgba(0, 0, 0, 0.3);
    opacity: 0;
    transition: display 0.5s allow-discrete, overlay 0.5s allow-discrete;
    animation: components-reconnect-modal-fadeOutOpacity-b-bs7gjv8ofs 0.5s both;
    &[open]

{
    animation: components-reconnect-modal-slideUp-b-bs7gjv8ofs 1.5s cubic-bezier(.05, .89, .25, 1.02) 0.3s, components-reconnect-modal-fadeInOpacity-b-bs7gjv8ofs 0.5s ease-in-out 0.3s;
    animation-fill-mode: both;
}

}

#components-reconnect-modal[b-bs7gjv8ofs]::backdrop {
    background-color: rgba(0, 0, 0, 0.4);
    animation: components-reconnect-modal-fadeInOpacity-b-bs7gjv8ofs 0.5s ease-in-out;
    opacity: 1;
}

@keyframes components-reconnect-modal-slideUp-b-bs7gjv8ofs {
    0% {
        transform: translateY(30px) scale(0.95);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes components-reconnect-modal-fadeInOpacity-b-bs7gjv8ofs {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes components-reconnect-modal-fadeOutOpacity-b-bs7gjv8ofs {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.components-reconnect-container[b-bs7gjv8ofs] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

#components-reconnect-modal p[b-bs7gjv8ofs] {
    margin: 0;
    text-align: center;
}

#components-reconnect-modal button[b-bs7gjv8ofs] {
    border: 0;
    background-color: var(--color-primary-dark);
    color: white;
    padding: 4px 24px;
    border-radius: 4px;
}

    #components-reconnect-modal button:hover[b-bs7gjv8ofs] {
        background-color: var(--color-primary-deeper);
    }

    #components-reconnect-modal button:active[b-bs7gjv8ofs] {
        background-color: var(--color-primary-dark);
    }

.components-rejoining-animation[b-bs7gjv8ofs] {
    position: relative;
    width: 80px;
    height: 80px;
}

    .components-rejoining-animation div[b-bs7gjv8ofs] {
        position: absolute;
        border: 3px solid var(--color-primary-dark);
        opacity: 1;
        border-radius: 50%;
        animation: components-rejoining-animation-b-bs7gjv8ofs 1.5s cubic-bezier(0, 0.2, 0.8, 1) infinite;
    }

        .components-rejoining-animation div:nth-child(2)[b-bs7gjv8ofs] {
            animation-delay: -0.5s;
        }

@keyframes components-rejoining-animation-b-bs7gjv8ofs {
    0% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    4.9% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    5% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 1;
    }

    100% {
        top: 0px;
        left: 0px;
        width: 80px;
        height: 80px;
        opacity: 0;
    }
}
/* /Components/Shared/DatePicker.razor.rz.scp.css */
.aml-date-picker[b-rnbusd6s5u] {
    position: relative;
}

/* Keep the input group above the backdrop when the popup is open */
.aml-date-picker .input-group[b-rnbusd6s5u] {
    position: relative;
    z-index: 1001;
}

/* Transparent full-screen layer — catches outside clicks to close the popup */
.aml-dp-backdrop[b-rnbusd6s5u] {
    position: fixed;
    inset: 0;
    z-index: 1000;
}

.aml-dp-popup[b-rnbusd6s5u] {
    position: absolute;
    top: calc(100% + 2px);
    left: 0;
    z-index: 1002;
    min-width: 252px;
}

.aml-dp-grid[b-rnbusd6s5u] {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    text-align: center;
    gap: 1px;
}

.aml-dp-header[b-rnbusd6s5u] {
    font-size: 0.75rem;
    color: var(--color-text-muted);
    font-weight: 600;
    padding: 2px 0;
}

.aml-dp-day[b-rnbusd6s5u] {
    border: none;
    background: none;
    padding: 3px 0;
    border-radius: 4px;
    font-size: 0.85rem;
    cursor: pointer;
    width: 100%;
    line-height: 1.4;
    color: var(--color-text-body);
}

.aml-dp-day:hover[b-rnbusd6s5u] {
    background-color: var(--color-border);
}

.aml-dp-day.today[b-rnbusd6s5u] {
    border: 1px solid var(--color-primary-dark);
    color: var(--color-primary-dark);
    font-weight: 600;
}

.aml-dp-day.selected[b-rnbusd6s5u] {
    background-color: var(--color-primary-dark);
    color: #fff;
    font-weight: 600;
}
