/* /Components/Account/AuthLayout.razor.rz.scp.css */
/* ── Body y neutralización de tema oscuro ── */
:global(body)[b-gvxeqmlirl] {
    background: #f0f2f5 !important;
    overflow-x: hidden;
}

:global(body)[b-gvxeqmlirl],
:global(html)[b-gvxeqmlirl] {
    color-scheme: light !important;
}

:global([data-bs-theme=dark])[b-gvxeqmlirl] {
    --bs-body-bg: #f0f2f5 !important;
    --bs-body-color: #1d1d1f !important;
    --bs-input-bg: #f5f5f7 !important;
}

/* ── Layout raíz ── */
.auth-layout[b-gvxeqmlirl] {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    font-family: -apple-system, 'SF Pro Display', 'SF Pro Text', 'Helvetica Neue', sans-serif;
    padding: 2rem 1rem;
    background: #f0f2f5 !important;
    color: #1d1d1f !important;
}

.auth-layout__background[b-gvxeqmlirl],
.auth-layout__grid[b-gvxeqmlirl],
.auth-layout__orb--1[b-gvxeqmlirl],
.auth-layout__orb--2[b-gvxeqmlirl],
.auth-layout__orb--3[b-gvxeqmlirl] {
    display: none;
}

/* ── Wrapper ── */
.auth-layout__wrapper[b-gvxeqmlirl] {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 460px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
    animation: fadeUp-b-gvxeqmlirl .4s ease both;
}

@keyframes fadeUp-b-gvxeqmlirl {
    from { opacity: 0; transform: translateY(14px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ── Card ── */
.auth-layout__card[b-gvxeqmlirl] {
    width: 100%;
    background: #ffffff !important;
    border: none;
    border-radius: 20px;
    box-shadow:
        0 1px 3px rgba(0,0,0,.06),
        0 8px 28px rgba(0,0,0,.10),
        0 20px 48px rgba(0,0,0,.06);
    color: #1d1d1f !important;
}

.auth-layout__card-inner[b-gvxeqmlirl] {
    padding: 2.5rem 2.75rem 2.25rem;
    background: #ffffff !important;
    border-radius: 20px;
}

/* ── Brand ── */
.auth-layout__brand[b-gvxeqmlirl] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    margin-bottom: .25rem;
}

.auth-layout__logo[b-gvxeqmlirl] {
    display: inline-block;
    line-height: 0;
}

.auth-layout__logo img[b-gvxeqmlirl] {
    max-width: 220px;
    max-height: 54px;
    width: auto;
    height: auto;
    object-fit: contain;
}

.auth-layout__brand-name[b-gvxeqmlirl] {
    margin: .8rem 0 .15rem;
    color: #1d1d1f !important;
    font-size: 1.35rem;
    font-weight: 600;
    letter-spacing: -.02em;
    line-height: 1.2;
}

.auth-layout__brand-subtitle[b-gvxeqmlirl] {
    margin: .5rem 0 0;
    color: #6e6e73 !important;
    font-size: .8125rem;
    font-weight: 400;
    letter-spacing: -.01em;
    line-height: 1.4;
}

/* ── Divisor decorativo ── */
.auth-layout__divider[b-gvxeqmlirl] {
    height: 1px;
    background: linear-gradient(to right, transparent, #e5e5ea 20%, #e5e5ea 80%, transparent);
    margin: 1.5rem 0;
}

/* ── Footer ── */
.auth-layout__footer[b-gvxeqmlirl] {
    color: #aeaeb2 !important;
    font-size: .73rem;
    text-align: center;
    margin: 0;
    letter-spacing: -.01em;
}

/* ── Tipografía ── */
[b-gvxeqmlirl] h1 { display: none; }
[b-gvxeqmlirl] h2 { display: none; }

[b-gvxeqmlirl] p {
    color: #6e6e73 !important;
    font-size: .875rem;
    margin-bottom: .6rem;
    line-height: 1.6;
    letter-spacing: -.01em;
}

[b-gvxeqmlirl] hr {
    border-color: #e5e5ea !important;
    margin: 1.75rem 0 1.25rem !important;
}

/* ── Párrafo descriptivo ── */
[b-gvxeqmlirl] .auth-page__description,
[b-gvxeqmlirl] .login-2fa__description {
    color: #3a3a3c !important;
    font-size: .9rem;
    line-height: 1.55;
    margin-bottom: 1.4rem;
    text-align: center;
    background: #f5f5f7 !important;
    border-radius: 10px;
    padding: .75rem 1rem;
    border-left: 3px solid #0071e3;
}

/* ── Confirmación ── */
[b-gvxeqmlirl] .auth-confirm {
    text-align: center;
    padding: .5rem 0;
}

[b-gvxeqmlirl] .auth-confirm__icon {
    font-size: 2.75rem;
    line-height: 1;
    margin-bottom: 1rem;
    display: block;
}

[b-gvxeqmlirl] .auth-confirm__title {
    display: block !important;
    color: #1d1d1f !important;
    font-size: 1.2rem !important;
    font-weight: 600 !important;
    letter-spacing: -.025em !important;
    margin-bottom: .6rem !important;
}

[b-gvxeqmlirl] .auth-confirm__text {
    color: #6e6e73 !important;
    font-size: .9rem;
    line-height: 1.6;
    margin-bottom: 1.5rem;
    padding: 0 .5rem;
}

/* ── Labels ── */
[b-gvxeqmlirl] .form-label {
    color: #1d1d1f !important;
    font-size: .8125rem;
    font-weight: 500;
    margin-bottom: .35rem;
    letter-spacing: -.01em;
}

/* ── Floating labels ── */
[b-gvxeqmlirl] .form-floating {
    position: relative;
}

[b-gvxeqmlirl] .form-floating > label.form-label {
    position: absolute !important;
    top: 50% !important;
    left: 1rem !important;
    transform: translateY(-50%) !important;
    color: #aeaeb2 !important;
    font-size: .9375rem !important;
    font-weight: 400 !important;
    pointer-events: none !important;
    transition: all .18s ease !important;
    margin: 0 !important;
    padding: 0 !important;
    height: auto !important;
    line-height: 1 !important;
    z-index: 2;
    letter-spacing: -.01em !important;
}

[b-gvxeqmlirl] .form-floating > .form-control:focus ~ label.form-label,
[b-gvxeqmlirl] .form-floating > .form-control:not(:placeholder-shown) ~ label.form-label {
    top: .5rem !important;
    font-size: .68rem !important;
    color: #6e6e73 !important;
    transform: none !important;
    font-weight: 500 !important;
    letter-spacing: .01em !important;
    text-transform: uppercase !important;
}

[b-gvxeqmlirl] .form-floating > .form-control {
    height: 56px !important;
    padding: 1.4rem 1rem .4rem !important;
}

/* ── Inputs ── */
[b-gvxeqmlirl] .form-control {
    background: #f5f5f7 !important;
    border: 1.5px solid #e5e5ea !important;
    border-radius: 10px !important;
    color: #1d1d1f !important;
    font-size: .9375rem !important;
    font-family: -apple-system, 'SF Pro Text', 'Helvetica Neue', sans-serif !important;
    transition: border-color .18s, box-shadow .18s !important;
}

[b-gvxeqmlirl] .form-control::placeholder { color: transparent !important; }

[b-gvxeqmlirl] .form-control:focus::placeholder { color: #aeaeb2 !important; }

[b-gvxeqmlirl] .form-control:focus {
    border-color: #0071e3 !important;
    box-shadow: 0 0 0 3px rgba(0,113,227,.15) !important;
    background: #fff !important;
    outline: none !important;
    color: #1d1d1f !important;
}

/* ── Botón principal ── */
[b-gvxeqmlirl] .btn-primary {
    background: #0071e3 !important;
    border: none !important;
    border-radius: 10px !important;
    padding: .75rem 1.5rem !important;
    font-weight: 500 !important;
    font-size: .9375rem !important;
    letter-spacing: -.01em !important;
    width: 100% !important;
    color: #fff !important;
    font-family: -apple-system, 'SF Pro Text', 'Helvetica Neue', sans-serif !important;
    transition: background .18s, transform .12s !important;
    box-shadow: none !important;
}

[b-gvxeqmlirl] .btn-primary:hover { background: #0077ed !important; }
[b-gvxeqmlirl] .btn-primary:active { background: #006edb !important; transform: scale(.99) !important; }

/* ── Links ── */
[b-gvxeqmlirl] a {
    color: #0071e3 !important;
    text-decoration: none !important;
    font-size: .875rem !important;
    transition: opacity .18s !important;
}

[b-gvxeqmlirl] a:hover { opacity: .75 !important; color: #0071e3 !important; }

/* ── Checkbox ── */
[b-gvxeqmlirl] .form-check-input {
    background-color: #fff !important;
    border-color: #d1d1d6 !important;
    border-radius: 5px !important;
    width: 1.1em !important;
    height: 1.1em !important;
}

[b-gvxeqmlirl] .form-check-input:checked {
    background-color: #0071e3 !important;
    border-color: #0071e3 !important;
}

[b-gvxeqmlirl] .form-check-label {
    color: #1d1d1f !important;
    font-size: .875rem !important;
    letter-spacing: -.01em !important;
}

/* ── Validación ── */
[b-gvxeqmlirl] .text-danger,
[b-gvxeqmlirl] .validation-message {
    color: #ff3b30 !important;
    font-size: .78rem !important;
    letter-spacing: -.01em !important;
    margin-top: .3rem !important;
    display: block !important;
}

/* ── StatusMessage ── */
[b-gvxeqmlirl] .alert {
    border-radius: 10px !important;
    font-size: .875rem !important;
    padding: .75rem 1rem !important;
    margin-bottom: 1rem !important;
    border: none !important;
}

[b-gvxeqmlirl] .alert-danger {
    background: #fff2f1 !important;
    color: #c0392b !important;
    border-left: 3px solid #ff3b30 !important;
}

/* ── Textos secundarios ── */
[b-gvxeqmlirl] .text-secondary { color: #aeaeb2 !important; font-size: .8125rem !important; }

[b-gvxeqmlirl] .register-optional {
    color: #aeaeb2;
    font-weight: 400;
    font-size: .75em;
    font-style: italic;
}

/* ── Responsive ── */
@media (max-width: 576px) {
    :global(body)[b-gvxeqmlirl] { background: #fff !important; }

    .auth-layout[b-gvxeqmlirl] {
        align-items: flex-start;
        padding: 0;
        background: #fff !important;
    }

    .auth-layout__wrapper[b-gvxeqmlirl] {
        max-width: 100%;
        min-height: 100vh;
        gap: 0;
        justify-content: flex-start;
    }

    .auth-layout__card[b-gvxeqmlirl] { border-radius: 0; box-shadow: none; }
    .auth-layout__card-inner[b-gvxeqmlirl] { padding: 2rem 1.5rem 1.5rem; }
    .auth-layout__footer[b-gvxeqmlirl] { padding: 1.5rem 1.5rem 2rem; }
}
/* /Components/Account/AuthLayoutWide.razor.rz.scp.css */
/* AuthLayoutWide usa los mismos estilos que AuthLayout.
   Blazor scoped CSS NO se hereda entre componentes,
   por eso este archivo duplica todos los overrides necesarios. */

/* ── Body ── */
:global(body)[b-6g0t0s98gy] {
    background: #f0f2f5 !important;
    overflow-x: hidden;
}

:global(body)[b-6g0t0s98gy],
:global(html)[b-6g0t0s98gy] {
    color-scheme: light !important;
}

:global([data-bs-theme=dark])[b-6g0t0s98gy] {
    --bs-body-bg: #f0f2f5 !important;
    --bs-body-color: #1d1d1f !important;
    --bs-input-bg: #f5f5f7 !important;
}

/* ── Layout raíz ── */
.auth-layout[b-6g0t0s98gy] {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    font-family: -apple-system, 'SF Pro Display', 'SF Pro Text', 'Helvetica Neue', sans-serif;
    padding: 2rem 1rem;
    background: #f0f2f5 !important;
    color: #1d1d1f !important;
}

.auth-layout__background[b-6g0t0s98gy],
.auth-layout__grid[b-6g0t0s98gy],
.auth-layout__orb--1[b-6g0t0s98gy],
.auth-layout__orb--2[b-6g0t0s98gy],
.auth-layout__orb--3[b-6g0t0s98gy] {
    display: none;
}

/* ── Wrapper — versión ancha ── */
.auth-layout__wrapper[b-6g0t0s98gy] {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 720px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
    animation: fadeUp-b-6g0t0s98gy .4s ease both;
}

@keyframes fadeUp-b-6g0t0s98gy {
    from { opacity: 0; transform: translateY(14px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ── Card ── */
.auth-layout__card[b-6g0t0s98gy] {
    width: 100%;
    background: #ffffff !important;
    border: none;
    border-radius: 20px;
    box-shadow:
        0 1px 3px rgba(0,0,0,.06),
        0 8px 28px rgba(0,0,0,.10),
        0 20px 48px rgba(0,0,0,.06);
    color: #1d1d1f !important;
}

.auth-layout__card-inner[b-6g0t0s98gy] {
    padding: 2.5rem 2.75rem 2.25rem;
    background: #ffffff !important;
    border-radius: 20px;
}

/* ── Brand ── */
.auth-layout__brand[b-6g0t0s98gy] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    margin-bottom: .25rem;
}

.auth-layout__logo[b-6g0t0s98gy] {
    display: inline-block;
    line-height: 0;
}

.auth-layout__logo img[b-6g0t0s98gy] {
    max-width: 220px;
    max-height: 54px;
    width: auto;
    height: auto;
    object-fit: contain;
}

.auth-layout__brand-name[b-6g0t0s98gy] {
    margin: .8rem 0 .15rem;
    color: #1d1d1f !important;
    font-size: 1.35rem;
    font-weight: 600;
    letter-spacing: -.02em;
    line-height: 1.2;
}

.auth-layout__brand-subtitle[b-6g0t0s98gy] {
    margin: .5rem 0 0;
    color: #6e6e73 !important;
    font-size: .8125rem;
    font-weight: 400;
    letter-spacing: -.01em;
    line-height: 1.4;
}

/* ── Divisor decorativo ── */
.auth-layout__divider[b-6g0t0s98gy] {
    height: 1px;
    background: linear-gradient(to right, transparent, #e5e5ea 20%, #e5e5ea 80%, transparent);
    margin: 1.5rem 0;
}

/* ── Footer ── */
.auth-layout__footer[b-6g0t0s98gy] {
    color: #aeaeb2 !important;
    font-size: .73rem;
    text-align: center;
    margin: 0;
    letter-spacing: -.01em;
}

/* ── Grid de dos columnas para registro ── */
[b-6g0t0s98gy] .register-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 1.25rem;
    row-gap: 0;
}

[b-6g0t0s98gy] .register-grid .register-full {
    grid-column: 1 / -1;
}

/* ── Separador de sección:
   El espacio DEBAJO (antes del primer campo) viene del margin-bottom.
   El espacio ARRIBA (separación del campo anterior) viene de padding-top
   en el propio label — así queda pegado visualmente al campo anterior
   pero con aire antes de la línea. ── */
[b-6g0t0s98gy] .register-section-label {
    grid-column: 1 / -1;
    display: block;
    font-size: .7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: #aeaeb2 !important;
    padding: 1.25rem 0 .5rem;   /* espacio arriba = separa del campo anterior */
    margin: 0 0 .625rem;         /* espacio abajo = separa del primer campo */
    border-bottom: 1px solid #ebebed;
    line-height: 1;
}

/* La primera sección no necesita espacio arriba */
[b-6g0t0s98gy] .register-section-label:first-child {
    padding-top: 0;
}

/* ── Etiqueta opcional ── */
[b-6g0t0s98gy] .register-optional {
    color: #aeaeb2;
    font-weight: 400;
    font-size: .75em;
    font-style: italic;
}

/* ── Tipografía ── */
[b-6g0t0s98gy] h1, [b-6g0t0s98gy] h2 { display: none; }

[b-6g0t0s98gy] p {
    color: #6e6e73 !important;
    font-size: .875rem;
    margin-bottom: .6rem;
    line-height: 1.6;
    letter-spacing: -.01em;
}

[b-6g0t0s98gy] hr {
    border-color: #e5e5ea !important;
    margin: 1.75rem 0 1.25rem !important;
}

/* ── Labels ── */
[b-6g0t0s98gy] .form-label {
    color: #1d1d1f !important;
    font-size: .8125rem;
    font-weight: 500;
    margin-bottom: .35rem;
    letter-spacing: -.01em;
}

/* ── Floating labels ── */
[b-6g0t0s98gy] .form-floating {
    position: relative;
}

[b-6g0t0s98gy] .form-floating > label.form-label {
    position: absolute !important;
    top: 50% !important;
    left: 1rem !important;
    transform: translateY(-50%) !important;
    color: #aeaeb2 !important;
    font-size: .9375rem !important;
    font-weight: 400 !important;
    pointer-events: none !important;
    transition: all .18s ease !important;
    margin: 0 !important;
    padding: 0 !important;
    height: auto !important;
    line-height: 1 !important;
    z-index: 2;
    letter-spacing: -.01em !important;
}

[b-6g0t0s98gy] .form-floating > .form-control:focus ~ label.form-label,
[b-6g0t0s98gy] .form-floating > .form-control:not(:placeholder-shown) ~ label.form-label {
    top: .5rem !important;
    font-size: .68rem !important;
    color: #6e6e73 !important;
    transform: none !important;
    font-weight: 500 !important;
    letter-spacing: .01em !important;
    text-transform: uppercase !important;
}

[b-6g0t0s98gy] .form-floating > .form-control {
    height: 56px !important;
    padding: 1.4rem 1rem .4rem !important;
}

/* ── Inputs ── */
[b-6g0t0s98gy] .form-control {
    background: #f5f5f7 !important;
    border: 1.5px solid #e5e5ea !important;
    border-radius: 10px !important;
    color: #1d1d1f !important;
    font-size: .9375rem !important;
    font-family: -apple-system, 'SF Pro Text', 'Helvetica Neue', sans-serif !important;
    transition: border-color .18s, box-shadow .18s !important;
}

[b-6g0t0s98gy] .form-control::placeholder { color: transparent !important; }
[b-6g0t0s98gy] .form-control:focus::placeholder { color: #aeaeb2 !important; }

[b-6g0t0s98gy] .form-control:focus {
    border-color: #0071e3 !important;
    box-shadow: 0 0 0 3px rgba(0,113,227,.15) !important;
    background: #fff !important;
    outline: none !important;
    color: #1d1d1f !important;
}

/* ── Select (país): mismo look que los inputs; su label SIEMPRE flotado
   (un select siempre "tiene valor", así que no debe solaparse con la opción). ── */
[b-6g0t0s98gy] .form-floating > .form-select {
    height: 56px !important;
    padding: 1.4rem 1rem .4rem !important;
    background-color: #f5f5f7 !important;
    border: 1.5px solid #e5e5ea !important;
    border-radius: 10px !important;
    color: #1d1d1f !important;
    font-size: .9375rem !important;
    font-family: -apple-system, 'SF Pro Text', 'Helvetica Neue', sans-serif !important;
    transition: border-color .18s, box-shadow .18s !important;
}

[b-6g0t0s98gy] .form-floating > .form-select ~ label.form-label {
    top: .5rem !important;
    font-size: .68rem !important;
    color: #6e6e73 !important;
    transform: none !important;
    font-weight: 500 !important;
    letter-spacing: .01em !important;
    text-transform: uppercase !important;
}

[b-6g0t0s98gy] .form-select:focus {
    border-color: #0071e3 !important;
    box-shadow: 0 0 0 3px rgba(0,113,227,.15) !important;
    background-color: #fff !important;
    outline: none !important;
    color: #1d1d1f !important;
}

/* ── Botón principal ── */
[b-6g0t0s98gy] .btn-primary {
    background: #0071e3 !important;
    border: none !important;
    border-radius: 10px !important;
    padding: .75rem 1.5rem !important;
    font-weight: 500 !important;
    font-size: .9375rem !important;
    letter-spacing: -.01em !important;
    width: 100% !important;
    color: #fff !important;
    font-family: -apple-system, 'SF Pro Text', 'Helvetica Neue', sans-serif !important;
    transition: background .18s, transform .12s !important;
    box-shadow: none !important;
}

[b-6g0t0s98gy] .btn-primary:hover { background: #0077ed !important; }
[b-6g0t0s98gy] .btn-primary:active { background: #006edb !important; transform: scale(.99) !important; }

/* ── Links ── */
[b-6g0t0s98gy] a {
    color: #0071e3 !important;
    text-decoration: none !important;
    font-size: .875rem !important;
    transition: opacity .18s !important;
}

[b-6g0t0s98gy] a:hover { opacity: .75 !important; color: #0071e3 !important; }

/* ── Validación ── */
[b-6g0t0s98gy] .text-danger,
[b-6g0t0s98gy] .validation-message {
    color: #ff3b30 !important;
    font-size: .78rem !important;
    letter-spacing: -.01em !important;
    margin-top: .3rem !important;
    display: block !important;
}

/* ── StatusMessage ── */
[b-6g0t0s98gy] .alert {
    border-radius: 10px !important;
    font-size: .875rem !important;
    padding: .75rem 1rem !important;
    margin-bottom: 1rem !important;
    border: none !important;
}

[b-6g0t0s98gy] .alert-danger {
    background: #fff2f1 !important;
    color: #c0392b !important;
    border-left: 3px solid #ff3b30 !important;
}

/* ── Textos secundarios ── */
[b-6g0t0s98gy] .text-secondary { color: #aeaeb2 !important; font-size: .8125rem !important; }

/* ── Responsive ── */
@media (max-width: 600px) {
    :global(body)[b-6g0t0s98gy] { background: #fff !important; }

    .auth-layout[b-6g0t0s98gy] {
        align-items: flex-start;
        padding: 0;
        background: #fff !important;
    }

    .auth-layout__wrapper[b-6g0t0s98gy] {
        max-width: 100%;
        min-height: 100vh;
        gap: 0;
        justify-content: flex-start;
    }

    .auth-layout__card[b-6g0t0s98gy] { border-radius: 0; box-shadow: none; }
    .auth-layout__card-inner[b-6g0t0s98gy] { padding: 2rem 1.5rem 1.5rem; }
    .auth-layout__footer[b-6g0t0s98gy] { padding: 1.5rem 1.5rem 2rem; }

    [b-6g0t0s98gy] .register-grid { grid-template-columns: 1fr; }
    [b-6g0t0s98gy] .register-grid .register-full { grid-column: 1; }
}
/* /Components/Account/Shared/ManageLayout.razor.rz.scp.css */
/* ══════════════════════════════════════════
   Manage Layout
   ══════════════════════════════════════════ */

.manage-wrap[b-i1sltmaf1u] {
    max-width: 900px;
}

.manage-wrap__header[b-i1sltmaf1u] {
    margin-bottom: 1.5rem;
}

.manage-wrap__title[b-i1sltmaf1u] {
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--bs-body-color);
    letter-spacing: -.025em;
    margin: 0 0 1.25rem;
}

/* ── Pill peligrosa (datos personales) ── */
.manage-nav__danger.active[b-i1sltmaf1u] {
    background-color: #dc3545 !important;
}

.manage-nav__danger:not(.active):hover[b-i1sltmaf1u] {
    color: #dc3545 !important;
}

/* ══════════════════════════════════════════
   Páginas internas
   ══════════════════════════════════════════ */

.manage-page[b-i1sltmaf1u] {
    max-width: 900px;
}

.manage-page__header[b-i1sltmaf1u] {
    margin-bottom: 1.75rem;
}

.manage-page__title[b-i1sltmaf1u] {
    font-size: 1.2rem;
    font-weight: 600;
    color: var(--bs-body-color);
    letter-spacing: -.02em;
    margin: 0 0 .2rem;
}

.manage-page__subtitle[b-i1sltmaf1u] {
    font-size: .875rem;
    color: var(--bs-secondary-color, #6c757d);
    margin: 0;
}

/* ── Separador de sección ── */
.manage-section-label[b-i1sltmaf1u] {
    display: block;
    font-size: .7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--bs-secondary-color, #6c757d);
    padding: 0 0 .5rem;
    margin: 0 0 .875rem;
    border-bottom: 1px solid var(--bs-border-color, #dee2e6);
    line-height: 1;
}

/* ── Valores de sólo lectura (texto plano, no input) ── */
.manage-static-label[b-i1sltmaf1u] {
    font-size: .75rem;
    color: var(--bs-secondary-color, #6c757d);
    margin: 0 0 .2rem;
}

.manage-static-value[b-i1sltmaf1u] {
    font-size: 1rem;
    font-weight: 500;
    color: var(--bs-body-color);
    margin: 0;
    line-height: 1.4;
}

/* ── Hint informativo ── */
.manage-field-hint[b-i1sltmaf1u] {
    font-size: .8125rem;
    color: var(--bs-secondary-color, #6c757d);
    margin: .625rem 0 0;
    line-height: 1.5;
}

.manage-field-hint a[b-i1sltmaf1u] {
    color: inherit;
    text-decoration: underline;
}

/* ── Opcional ── */
.manage-optional[b-i1sltmaf1u] {
    color: var(--bs-secondary-color, #6c757d);
    font-size: .75em;
    font-weight: 400;
    font-style: italic;
}

/* ── Vacío ── */
.manage-empty[b-i1sltmaf1u] {
    color: var(--bs-secondary-color, #6c757d);
    font-size: .875rem;
    font-style: italic;
}

/* ── Alertas ── */
.manage-alert[b-i1sltmaf1u] {
    display: flex;
    gap: .75rem;
    align-items: flex-start;
    border-radius: 10px;
    padding: 1rem 1.25rem;
    margin-bottom: 1.25rem;
    font-size: .875rem;
    line-height: 1.5;
}

.manage-alert > span[b-i1sltmaf1u] { font-size: 1.2rem; line-height: 1.3; flex-shrink: 0; }
.manage-alert strong[b-i1sltmaf1u] { display: block; margin-bottom: .2rem; }
.manage-alert p[b-i1sltmaf1u] { margin: .2rem 0 0; }
.manage-alert a[b-i1sltmaf1u] { color: inherit; text-decoration: underline; }

.manage-alert--warning[b-i1sltmaf1u] {
    background: rgba(255, 193, 7, .12);
    color: #856404;
    border-left: 3px solid #ffc107;
}

.manage-alert--danger[b-i1sltmaf1u] {
    background: rgba(220, 53, 69, .08);
    color: #842029;
    border-left: 3px solid #dc3545;
}

/* ── Grupo de acciones ── */
.manage-action-group[b-i1sltmaf1u] {
    display: flex;
    flex-wrap: wrap;
    gap: .625rem;
}

/* ── Estado 2FA ── */
.manage-2fa-status[b-i1sltmaf1u] {
    display: flex;
    align-items: flex-start;
    gap: .75rem;
    padding: 1rem 1.25rem;
    border-radius: 12px;
    margin-bottom: 1.25rem;
    font-size: .875rem;
}

.manage-2fa-status__icon[b-i1sltmaf1u] { font-size: 1.4rem; line-height: 1; }
.manage-2fa-status strong[b-i1sltmaf1u] { display: block; margin-bottom: .15rem; }
.manage-2fa-status p[b-i1sltmaf1u] { margin: 0; opacity: .8; }
.manage-2fa-status--on[b-i1sltmaf1u] { background: rgba(25, 135, 84, .1); color: #0a3622; }
.manage-2fa-status--off[b-i1sltmaf1u] { background: var(--bs-tertiary-bg, #f8f9fa); color: var(--bs-secondary-color, #6c757d); }

/* ── Email estado ── */
.manage-email-confirmed[b-i1sltmaf1u],
.manage-email-pending[b-i1sltmaf1u] {
    display: inline-flex;
    align-items: center;
    gap: .625rem;
    padding: .6rem 1rem;
    border-radius: 8px;
    font-size: .875rem;
}

.manage-email-confirmed[b-i1sltmaf1u] { background: rgba(25,135,84,.1); }
.manage-email-confirmed__address[b-i1sltmaf1u] { font-weight: 500; color: var(--bs-body-color); }
.manage-email-confirmed__badge[b-i1sltmaf1u] { font-size: .75rem; font-weight: 600; color: #0a3622; }

.manage-email-pending[b-i1sltmaf1u] { background: rgba(255,193,7,.12); }
.manage-email-pending__address[b-i1sltmaf1u] { font-weight: 500; color: var(--bs-body-color); }
.manage-email-pending__badge[b-i1sltmaf1u] { font-size: .75rem; font-weight: 600; color: #856404; }

/* ── Autenticador ── */
.manage-authenticator__desc[b-i1sltmaf1u] { font-size: .875rem; color: var(--bs-body-color); margin: 0; }

.manage-authenticator__qr[b-i1sltmaf1u] {
    display: block;
    width: 180px;
    height: 180px;
    border-radius: 10px;
    margin: .75rem 0;
    border: 1px solid var(--bs-border-color, #dee2e6);
}

.manage-authenticator__key-label[b-i1sltmaf1u] { font-size: .8rem; color: var(--bs-secondary-color); margin: .5rem 0 .25rem; }

.manage-authenticator__key[b-i1sltmaf1u] {
    display: inline-block;
    background: var(--bs-tertiary-bg, #f8f9fa);
    border: 1px solid var(--bs-border-color, #dee2e6);
    border-radius: 8px;
    padding: .4rem .75rem;
    font-size: .875rem;
    letter-spacing: .05em;
    color: var(--bs-body-color);
}

/* ── Recovery codes ── */
.recovery-codes__alert[b-i1sltmaf1u] {
    display: flex;
    gap: .75rem;
    align-items: flex-start;
    background: rgba(255,193,7,.12);
    color: #856404;
    border-left: 3px solid #ffc107;
    border-radius: 10px;
    padding: 1rem 1.25rem;
    margin-bottom: 1.5rem;
    font-size: .875rem;
}

.recovery-codes__alert-icon[b-i1sltmaf1u] { font-size: 1.2rem; }
.recovery-codes__alert strong[b-i1sltmaf1u] { display: block; margin-bottom: .25rem; }
.recovery-codes__alert p[b-i1sltmaf1u] { margin: 0; }

.recovery-codes__grid[b-i1sltmaf1u] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    gap: .625rem;
}

.recovery-codes__code[b-i1sltmaf1u] {
    display: block;
    background: var(--bs-tertiary-bg, #f8f9fa);
    border: 1px solid var(--bs-border-color, #dee2e6);
    border-radius: 8px;
    padding: .5rem .75rem;
    font-size: .875rem;
    letter-spacing: .06em;
    text-align: center;
    color: var(--bs-body-color);
    font-family: ui-monospace, 'SF Mono', monospace;
}

/* ── Datos personales ── */
.manage-personal-data[b-i1sltmaf1u] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.manage-personal-data__card[b-i1sltmaf1u] {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    background: var(--bs-tertiary-bg, #f8f9fa);
    border: 1px solid var(--bs-border-color, #dee2e6);
    border-radius: 12px;
    padding: 1.25rem 1.5rem;
}

.manage-personal-data__card--danger[b-i1sltmaf1u] {
    border-color: rgba(220,53,69,.3);
    background: rgba(220,53,69,.04);
}

.manage-personal-data__icon[b-i1sltmaf1u] { font-size: 1.75rem; line-height: 1; flex-shrink: 0; }
.manage-personal-data__card > div[b-i1sltmaf1u] { flex: 1; }
.manage-personal-data__card strong[b-i1sltmaf1u] { display: block; font-size: .9375rem; margin-bottom: .2rem; color: var(--bs-body-color); }
.manage-personal-data__card p[b-i1sltmaf1u] { margin: 0; font-size: .825rem; color: var(--bs-secondary-color, #6c757d); }

/* ── Login externo ── */
.manage-external-login[b-i1sltmaf1u] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: .75rem 1rem;
    background: var(--bs-tertiary-bg, #f8f9fa);
    border: 1px solid var(--bs-border-color, #dee2e6);
    border-radius: 10px;
    margin-bottom: .5rem;
}

.manage-external-login__name[b-i1sltmaf1u] { flex: 1; font-size: .9rem; font-weight: 500; }
.manage-external-login__add[b-i1sltmaf1u] { display: flex; flex-wrap: wrap; gap: .5rem; }

/* ── Passkeys ── */
.manage-passkey[b-i1sltmaf1u] {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: .75rem 1rem;
    background: var(--bs-tertiary-bg, #f8f9fa);
    border: 1px solid var(--bs-border-color, #dee2e6);
    border-radius: 10px;
    margin-bottom: .5rem;
}

.manage-passkey__icon[b-i1sltmaf1u] { font-size: 1.1rem; }
.manage-passkey__name[b-i1sltmaf1u] { flex: 1; font-size: .9rem; font-weight: 500; }
.manage-passkey form[b-i1sltmaf1u] { display: flex; gap: .4rem; }

/* ── Responsive ── */
@media (max-width: 600px) {
    .manage-personal-data__card[b-i1sltmaf1u] { flex-direction: column; align-items: flex-start; }
}
/* /Components/Account/Shared/ShowRecoveryCodes.razor.rz.scp.css */
.recovery-codes__grid[b-p9dm5s1p1p] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: .625rem;
    margin: 1.5rem 0;
}

.recovery-codes__code[b-p9dm5s1p1p] {
    display: block;
    background: var(--bs-tertiary-bg, #f8f9fa);
    border: 1px solid var(--bs-border-color, #dee2e6);
    border-radius: 8px;
    padding: .5rem .75rem;
    font-size: .875rem;
    letter-spacing: .06em;
    text-align: center;
    color: var(--bs-body-color);
    font-family: ui-monospace, 'SF Mono', monospace;
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-pui3qmsk44] {
    position: relative;
    display: flex;
    flex-direction: column;
}

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

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

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

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

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

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

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

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

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

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

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

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

    .top-row[b-pui3qmsk44], article[b-pui3qmsk44] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}

/* El circuito murió: la pestaña no responde. El aviso cubre la pantalla porque
   lo que hay detrás ya no funciona, y se apoya en las variables del tema para
   verse igual de bien en claro y en oscuro (la plantilla traía `lightyellow`
   con `color-scheme: light only`).

   z-index por encima de TODO —topbar, menú y footer incluidos—: el aviso de la
   plantilla iba en 1000 y caía justo sobre el footer, que es `position:
   absolute`, así que se veía una franja amarilla cortada e ilegible. */
#blazor-error-ui[b-pui3qmsk44] {
    display: none;   /* Blazor lo pone en `block` cuando el circuito cae. */
    position: fixed;
    inset: 0;
    z-index: 2000;
    padding: 1.5rem;
    background: color-mix(in srgb, var(--bs-body-color) 55%, transparent);
    backdrop-filter: blur(2px);
}

    /* El centrado NO puede depender de flex: Blazor muestra el aviso poniendo
       `display: block` INLINE, que gana sobre cualquier `display` del CSS. Por
       eso la tarjeta se centra ella misma. */
    #blazor-error-ui .blazor-error-ui__card[b-pui3qmsk44] {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        max-width: 27rem;
        width: calc(100% - 3rem);
        padding: 1.75rem;
        border-radius: 16px;
        background: var(--bs-body-bg);
        color: var(--bs-body-color);
        box-shadow: 0 12px 40px rgba(0, 0, 0, .28);
        text-align: center;
    }

    #blazor-error-ui .blazor-error-ui__icon[b-pui3qmsk44] {
        font-size: 1.75rem;
        color: var(--bs-danger);
        margin-bottom: .75rem;
    }

    #blazor-error-ui .blazor-error-ui__title[b-pui3qmsk44] {
        margin: 0 0 .5rem;
        font-weight: 600;
    }

    #blazor-error-ui .blazor-error-ui__body[b-pui3qmsk44] {
        margin: 0 0 1.25rem;
        font-size: .9rem;
        /* 85 % del color del cuerpo: el token secundario del tema cae por debajo
           de 4.5:1 en oscuro sobre una superficie propia. */
        color: color-mix(in srgb, var(--bs-body-color) 85%, transparent);
    }
/* /Components/Layout/NavMenu.razor.rz.scp.css */
/*.navbar-toggler {
    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 {
    background-color: rgba(255, 255, 255, 0.5);
}

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

.navbar-brand {
    font-size: 1.1rem;
}

.bi {
    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 {
    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 {
    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 {
    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");
}

.bi-lock-nav-menu {
    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 d='M8 1a2 2 0 0 1 2 2v4H6V3a2 2 0 0 1 2-2zm3 6V3a3 3 0 0 0-6 0v4a2 2 0 0 0-2 2v5a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2V9a2 2 0 0 0-2-2zM5 8h6a1 1 0 0 1 1 1v5a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1V9a1 1 0 0 1 1-1z'/%3E%3C/svg%3E");
}

.bi-person-nav-menu {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-person' viewBox='0 0 16 16'%3E%3Cpath d='M8 8a3 3 0 1 0 0-6 3 3 0 0 0 0 6Zm2-3a2 2 0 1 1-4 0 2 2 0 0 1 4 0Zm4 8c0 1-1 1-1 1H3s-1 0-1-1 1-4 6-4 6 3 6 4Zm-1-.004c-.001-.246-.154-.986-.832-1.664C11.516 10.68 10.289 10 8 10c-2.29 0-3.516.68-4.168 1.332-.678.678-.83 1.418-.832 1.664h10Z'/%3E%3C/svg%3E");
}

.bi-person-badge-nav-menu {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-person-badge' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 2a.5.5 0 0 0 0 1h3a.5.5 0 0 0 0-1h-3zM11 8a3 3 0 1 1-6 0 3 3 0 0 1 6 0z'/%3E%3Cpath d='M4.5 0A2.5 2.5 0 0 0 2 2.5V14a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V2.5A2.5 2.5 0 0 0 11.5 0h-7zM3 2.5A1.5 1.5 0 0 1 4.5 1h7A1.5 1.5 0 0 1 13 2.5v10.795a4.2 4.2 0 0 0-.776-.492C11.392 12.387 10.063 12 8 12s-3.392.387-4.224.803a4.2 4.2 0 0 0-.776.492V2.5z'/%3E%3C/svg%3E");
}

.bi-person-fill-nav-menu {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-person-fill' viewBox='0 0 16 16'%3E%3Cpath d='M3 14s-1 0-1-1 1-4 6-4 6 3 6 4-1 1-1 1H3Zm5-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6Z'/%3E%3C/svg%3E");
}

.bi-arrow-bar-left-nav-menu {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-arrow-bar-left' viewBox='0 0 16 16'%3E%3Cpath d='M12.5 15a.5.5 0 0 1-.5-.5v-13a.5.5 0 0 1 1 0v13a.5.5 0 0 1-.5.5ZM10 8a.5.5 0 0 1-.5.5H3.707l2.147 2.146a.5.5 0 0 1-.708.708l-3-3a.5.5 0 0 1 0-.708l3-3a.5.5 0 1 1 .708.708L3.707 7.5H9.5a.5.5 0 0 1 .5.5Z'/%3E%3C/svg%3E");
}

.nav-item {
    font-size: 0.9rem;
    padding-bottom: 0.5rem;
}

    .nav-item:first-of-type {
        padding-top: 1rem;
    }

    .nav-item:last-of-type {
        padding-bottom: 1rem;
    }

    .nav-item ::deep .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 ::deep a.active {
    background-color: rgba(255,255,255,0.37);
    color: white;
}

.nav-item ::deep .nav-link:hover {
    background-color: rgba(255,255,255,0.1);
    color: white;
}

.nav-scrollable {
    display: none;
}

.navbar-toggler:checked ~ .nav-scrollable {
    display: block;
}

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

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

        /* Allow sidebar to scroll for tall menus */
        /*height: calc(100vh - 3.5rem);
        overflow-y: auto;
    }
}*/
/* /Components/Layout/PageHeader.razor.rz.scp.css */
/* Cabecera de vista — patrón Linear/Stripe/Vercel/Google Cloud:
   breadcrumb sutil arriba, título prominente, separador inferior.
   En móvil stackea y las acciones toman el ancho completo. */

.page-header[b-j073evrpr0] {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1rem 1.5rem;
    flex-wrap: wrap;
    margin-bottom: 1.5rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--bs-border-color-translucent, rgba(0, 0, 0, .075));
}

.page-header__left[b-j073evrpr0] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    min-width: 0;
    flex: 1 1 auto;
}

/* Breadcrumb propio (sin .breadcrumb de Bootstrap) para tener control fino
   de tipografía, separador y line-height. */
.page-header__breadcrumb[b-j073evrpr0] {
    font-size: 0.8125rem;
    line-height: 1;
    color: var(--bs-secondary-color, #6c757d);
}

.page-header__breadcrumb ol[b-j073evrpr0] {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

.page-header__breadcrumb li[b-j073evrpr0] {
    display: inline-flex;
    align-items: center;
}

.page-header__breadcrumb li + li[b-j073evrpr0]::before {
    content: "›";
    padding: 0 0.5rem;
    color: var(--bs-tertiary-color, #adb5bd);
    font-size: 0.9375rem;
    line-height: 1;
}

/* ::deep para alcanzar el <a> generado por <NavLink> (sub-componente). */
.page-header__breadcrumb[b-j073evrpr0]  a {
    color: var(--bs-secondary-color, #6c757d);
    text-decoration: none;
    transition: color .12s ease;
}

.page-header__breadcrumb[b-j073evrpr0]  a:hover,
.page-header__breadcrumb[b-j073evrpr0]  a:focus-visible {
    color: var(--bs-primary, #1b6ec2);
    text-decoration: underline;
    text-underline-offset: 2px;
}

.page-header__breadcrumb li.active[b-j073evrpr0] {
    color: var(--bs-tertiary-color, #adb5bd);
    font-weight: 500;
}

.page-header__actions[b-j073evrpr0] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-shrink: 0;
    /* Con muchas acciones en una pantalla estrecha, envuelven entre ellas antes
       que desbordar la cabecera. */
    flex-wrap: wrap;
}

/* MÓVIL — EL ANCHO DECIDE, NO EL NÚMERO DE BOTONES.
   Aquí hubo una regla que apilaba la cabecera en columna y le daba el ancho
   completo al bloque de acciones. Primero se disparaba SIEMPRE (una rueda sola
   bajaba a su propio renglón habiendo sitio de sobra) y se acotó a "hay más de
   una accion"... que era la misma equivocación con otro número: al añadir un
   segundo botón de 44 px, dos iconos volvían a ocupar una fila entera
   (reportado por Randolf dos veces, 2026-07-25 y 2026-07-26).

   El número de acciones nunca fue la pregunta: la pregunta es si CABEN. Y eso
   el flex ya lo resuelve — `.page-header` es `flex-wrap: wrap`, así que el
   bloque de acciones se queda junto al título mientras haya sitio y baja solo
   cuando de verdad no cabe, quedando bajo el título con su ancho natural. Sin
   media query, sin `:has()` y sin adivinar cuántos botones son "muchos".

   REGLA QUE QUEDA: la cabecera no decide su disposición contando hijos. Si
   alguna pantalla necesitara que sus acciones se repartan la línea completa,
   eso lo pide ELLA con una clase propia, no la cabecera para todo el mundo. */
@media (max-width: 575.98px) {
    .page-header[b-j073evrpr0] {
        margin-bottom: 1.25rem;
        padding-bottom: 0.875rem;
    }
}
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-hgipbxfltw],
.components-reconnect-repeated-attempt-visible[b-hgipbxfltw],
.components-reconnect-failed-visible[b-hgipbxfltw],
.components-pause-visible[b-hgipbxfltw],
.components-resume-failed-visible[b-hgipbxfltw],
.components-rejoining-animation[b-hgipbxfltw] {
    display: none;
}

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


#components-reconnect-modal[b-hgipbxfltw] {
    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-hgipbxfltw 0.5s both;
    &[open]

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

}

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

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

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

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

    100% {
        opacity: 1;
    }
}

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

    100% {
        opacity: 0;
    }
}

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

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

#components-reconnect-modal button[b-hgipbxfltw] {
    border: 0;
    background-color: #6b9ed2;
    color: white;
    padding: 4px 24px;
    border-radius: 4px;
}

    #components-reconnect-modal button:hover[b-hgipbxfltw] {
        background-color: #3b6ea2;
    }

    #components-reconnect-modal button:active[b-hgipbxfltw] {
        background-color: #6b9ed2;
    }

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

    .components-rejoining-animation div[b-hgipbxfltw] {
        position: absolute;
        border: 3px solid #0087ff;
        opacity: 1;
        border-radius: 50%;
        animation: components-rejoining-animation-b-hgipbxfltw 1.5s cubic-bezier(0, 0.2, 0.8, 1) infinite;
    }

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

@keyframes components-rejoining-animation-b-hgipbxfltw {
    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/Layout/TopBar.razor.rz.scp.css */
/* Sidebar colapsado (data-sidebar-size=sm): el tema deja padding:0 1.5rem en
   un brand-box de 70px, lo que descentra y empuja a la derecha el símbolo
   ampliado. Quitamos el padding y centramos el logo dentro del box angosto. */
body[data-sidebar-size="sm"] .navbar-brand-box[b-jgnssmd9ic] {
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

body[data-sidebar-size="sm"] .logo span.logo-sm[b-jgnssmd9ic] {
    line-height: 0;
}

/* Separación clara topbar/contenido: el tema deja el border-bottom casi
   blanco (#f8f9fa). Le damos contraste con la variable de tema (adapta a
   claro/oscuro) y una sombra suave. */
#page-topbar[b-jgnssmd9ic] {
    border-bottom-color: var(--bs-border-color);
    box-shadow: 0 2px 4px rgba(15, 23, 42, 0.06);
}

/* Solo COLAPSADO: el brand-box tapa el borde inferior del topbar con su
   propia sombra en color de sidebar (se notaba el corte bajo el símbolo).
   La quitamos para que se vea el MISMO borde continuo del topbar, alineado
   perfecto (no le ponemos un borde propio: caería un pelín más arriba). */
body[data-sidebar-size="sm"] .navbar-brand-box[b-jgnssmd9ic] {
    box-shadow: none;
}
/* /Components/Sitemap/CommandPalette.razor.rz.scp.css */
/* ──────────────────────────────────────────────────────────────────────────
   CommandPalette — overlay "spotlight" estilo Linear / GitHub / Vercel.

   Design notes:
   • Backdrop con backdrop-filter blur — el contenido detrás queda visible
     pero atenuado, da sensación de "modal sobre el escritorio" sin tapar.
   • Panel con transform-origin: top center — la animación arranca chiquita
     arriba (donde está el trigger en el topbar) y baja escalando, así
     visualmente "sale" del input que la disparó.
   • CSS vars de Bootstrap (--bs-*) — sigue el tema light/dark sin código.
   • Z-index 1080 — arriba de modales Bootstrap (1055) y dropdowns (1000)
     pero debajo de toasts si los hay (1090).
   ────────────────────────────────────────────────────────────────────────── */

/* ── Backdrop ──────────────────────────────────────────────────────────── */

.cmdk-backdrop[b-st3t3rlvup] {
    position: fixed;
    inset: 0;
    background-color: rgba(15, 18, 26, .55);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
    z-index: 1080;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: clamp(56px, 9vh, 110px) 16px 16px;
    animation: cmdk-backdrop-in-b-st3t3rlvup 160ms ease-out;
}

/* ── Panel ─────────────────────────────────────────────────────────────── */

.cmdk-panel[b-st3t3rlvup] {
    width: 100%;
    max-width: 640px;
    background-color: var(--bs-body-bg, #ffffff);
    color: var(--bs-body-color, #212529);
    border-radius: 14px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    max-height: min(580px, calc(100vh - 140px));
    border: 1px solid var(--bs-border-color, rgba(0, 0, 0, .08));
    box-shadow:
        0 28px 64px -16px rgba(15, 18, 26, .35),
        0 8px 20px -8px rgba(15, 18, 26, .22),
        0 0 0 1px rgba(255, 255, 255, .04) inset;
    transform-origin: top center;
    animation: cmdk-panel-in-b-st3t3rlvup 220ms cubic-bezier(0.16, 1, 0.3, 1);
}

/* ── Search bar ────────────────────────────────────────────────────────── */

.cmdk-search[b-st3t3rlvup] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px 18px;
    border-bottom: 1px solid var(--bs-border-color, rgba(0, 0, 0, .08));
    flex-shrink: 0;
}

.cmdk-search > i[b-st3t3rlvup] {
    font-size: 18px;
    color: var(--bs-secondary-color, #6b7280);
    flex-shrink: 0;
}

.cmdk-search > input[b-st3t3rlvup] {
    flex: 1;
    background: transparent;
    border: none;
    outline: none;
    color: inherit;
    font-size: 15px;
    line-height: 1.4;
    padding: 0;
    margin: 0;
    font-weight: 400;
}

.cmdk-search > input[b-st3t3rlvup]::placeholder {
    color: var(--bs-secondary-color, #9ca3af);
    opacity: .7;
}

/* ── Results list ──────────────────────────────────────────────────────── */

.cmdk-results[b-st3t3rlvup] {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 6px 8px 8px;
    min-height: 0;
    scroll-behavior: smooth;
}

/* Scrollbar tunada para que no rompa el aire del panel */
.cmdk-results[b-st3t3rlvup]::-webkit-scrollbar {
    width: 10px;
}
.cmdk-results[b-st3t3rlvup]::-webkit-scrollbar-thumb {
    background-color: rgba(128, 128, 128, .25);
    border-radius: 8px;
    border: 2px solid transparent;
    background-clip: padding-box;
}
.cmdk-results[b-st3t3rlvup]::-webkit-scrollbar-thumb:hover {
    background-color: rgba(128, 128, 128, .45);
    background-clip: padding-box;
    border: 2px solid transparent;
}

.cmdk-group-title[b-st3t3rlvup] {
    padding: 10px 12px 6px;
    font-size: 10.5px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--bs-secondary-color, #6b7280);
    font-weight: 600;
}

/* ── Item ──────────────────────────────────────────────────────────────── */

.cmdk-item[b-st3t3rlvup] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 9px 12px;
    border-radius: 8px;
    background: transparent;
    border: none;
    width: 100%;
    cursor: pointer;
    color: inherit;
    text-align: left;
    font: inherit;
    transition: background-color 80ms ease, transform 80ms ease;
}

.cmdk-icon[b-st3t3rlvup] {
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background-color: rgba(128, 128, 128, .08);
    color: var(--bs-primary, #556ee6);
    font-size: 14px;
    transition: background-color 80ms ease, color 80ms ease;
}

.cmdk-title[b-st3t3rlvup] {
    flex: 1;
    font-weight: 500;
    font-size: 14px;
    color: var(--bs-body-color, #212529);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.cmdk-section[b-st3t3rlvup] {
    font-size: 11.5px;
    color: var(--bs-secondary-color, #9ca3af);
    flex-shrink: 0;
    white-space: nowrap;
}

.cmdk-item--selected[b-st3t3rlvup] {
    background-color: rgba(var(--bs-primary-rgb, 85, 110, 230), .10);
}

.cmdk-item--selected .cmdk-icon[b-st3t3rlvup] {
    background-color: rgba(var(--bs-primary-rgb, 85, 110, 230), .16);
    color: var(--bs-primary, #556ee6);
}

.cmdk-item--selected .cmdk-title[b-st3t3rlvup] {
    color: var(--bs-primary, #556ee6);
}

/* ── Empty state ───────────────────────────────────────────────────────── */

.cmdk-empty[b-st3t3rlvup] {
    text-align: center;
    padding: 56px 16px 64px;
    color: var(--bs-secondary-color, #6b7280);
}

.cmdk-empty > i[b-st3t3rlvup] {
    font-size: 36px;
    margin-bottom: 14px;
    display: block;
    opacity: .45;
}

.cmdk-empty > p[b-st3t3rlvup] {
    margin: 0;
    font-size: 14px;
}

.cmdk-empty strong[b-st3t3rlvup] {
    color: var(--bs-body-color, #212529);
    font-weight: 600;
}

/* ── Footer ────────────────────────────────────────────────────────────── */

.cmdk-footer[b-st3t3rlvup] {
    display: flex;
    gap: 18px;
    align-items: center;
    padding: 10px 18px;
    border-top: 1px solid var(--bs-border-color, rgba(0, 0, 0, .08));
    background-color: var(--bs-tertiary-bg, rgba(0, 0, 0, .015));
    font-size: 11.5px;
    color: var(--bs-secondary-color, #6b7280);
    flex-shrink: 0;
}

.cmdk-footer > span[b-st3t3rlvup] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

/* ── Kbd ───────────────────────────────────────────────────────────────── */

.cmdk-kbd[b-st3t3rlvup] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 20px;
    padding: 0 5px;
    border-radius: 4px;
    border: 1px solid var(--bs-border-color, #e5e7eb);
    background-color: var(--bs-body-bg, #ffffff);
    color: var(--bs-secondary-color, #6b7280);
    font-size: 10.5px;
    font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
    font-weight: 500;
    line-height: 1;
}

/* ── Animaciones ───────────────────────────────────────────────────────── */

@keyframes cmdk-backdrop-in-b-st3t3rlvup {
    from { opacity: 0; }
    to   { opacity: 1; }
}

@keyframes cmdk-panel-in-b-st3t3rlvup {
    from {
        opacity: 0;
        transform: translateY(-14px) scale(0.97);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

/* Respeta a quien tiene "reducir movimiento" activado en su SO */
@media (prefers-reduced-motion: reduce) {
    .cmdk-backdrop[b-st3t3rlvup],
    .cmdk-panel[b-st3t3rlvup] {
        animation: none;
    }
}

/* ── Responsive ────────────────────────────────────────────────────────── */

@media (max-width: 640px) {
    .cmdk-backdrop[b-st3t3rlvup] {
        padding: 16px 12px;
        align-items: flex-start;
    }

    .cmdk-panel[b-st3t3rlvup] {
        max-height: calc(100vh - 32px);
        border-radius: 12px;
    }

    .cmdk-search[b-st3t3rlvup] {
        padding: 14px;
    }

    .cmdk-search > input[b-st3t3rlvup] {
        font-size: 16px; /* >=16px evita zoom auto en iOS */
    }

    .cmdk-section[b-st3t3rlvup] {
        display: none; /* en mobile el breadcrumb por item es ruido */
    }

    .cmdk-footer[b-st3t3rlvup] {
        display: none; /* atajos de teclado no aplican en mobile */
    }
}
/* /Components/Sitemap/CommandPaletteTrigger.razor.rz.scp.css */
/* ──────────────────────────────────────────────────────────────────────────
   CommandPaletteTrigger — botón estilo input que vive en el topbar y abre
   el palette. Está pensado para reemplazar el <input class="form-control">
   estático del template y mantener el ancho/aspecto que el layout espera.
   ────────────────────────────────────────────────────────────────────────── */

/* Desktop: input-shaped, ancho fijo razonable */
.cmdk-trigger--desktop[b-lc23s6k5if] {
    align-items: center;
    gap: 10px;
    margin: 14px 0 14px 16px;
    padding: 0 12px;
    height: 38px;
    width: 320px;
    background-color: var(--bs-tertiary-bg, #f3f3f9);
    color: var(--bs-secondary-color, #6b7280);
    border: 1px solid var(--bs-border-color, #e5e7eb);
    border-radius: 8px;
    font-size: 13px;
    cursor: pointer;
    transition: background-color 120ms ease, border-color 120ms ease, box-shadow 120ms ease;
}

.cmdk-trigger--desktop:hover[b-lc23s6k5if] {
    background-color: var(--bs-body-bg, #ffffff);
    border-color: var(--bs-primary, #556ee6);
    box-shadow: 0 0 0 3px rgba(85, 110, 230, .12);
}

.cmdk-trigger--desktop > i[b-lc23s6k5if] {
    font-size: 14px;
    flex-shrink: 0;
}

.cmdk-trigger__placeholder[b-lc23s6k5if] {
    flex: 1;
    text-align: left;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.cmdk-trigger__kbd-group[b-lc23s6k5if] {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    flex-shrink: 0;
}

.cmdk-trigger__kbd[b-lc23s6k5if] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 22px;
    height: 20px;
    padding: 0 5px;
    border-radius: 4px;
    border: 1px solid var(--bs-border-color, #e5e7eb);
    background-color: var(--bs-body-bg, #ffffff);
    color: var(--bs-secondary-color, #6b7280);
    font-size: 10.5px;
    font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
    font-weight: 500;
    line-height: 1;
}

/* Tablet: angostar para que no se choque con notificaciones */
@media (max-width: 991px) {
    .cmdk-trigger--desktop[b-lc23s6k5if] {
        width: 220px;
    }
}