/* Estilos compartidos de BGT_UI (cargar vía _content/BGT_UI/bgt-ui.css). */

.phone-region-divider-item {
    pointer-events: none;
    min-height: 0 !important;
    padding-top: 0.35rem !important;
    padding-bottom: 0.35rem !important;
    opacity: 1 !important;
}

.phone-region-divider-item .mud-typography,
.phone-region-divider-item .mud-list-item-text {
    width: 100%;
}

.phone-region-divider {
    display: block;
    width: 100%;
    height: 1px;
    margin: 0.15rem 0;
    background: linear-gradient(
        90deg,
        transparent,
        rgba(106, 44, 145, 0.35),
        rgba(47, 120, 183, 0.35),
        transparent
    );
}

.password-visibility-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    margin: 0;
    padding: 0.2rem;
    border: 0;
    border-radius: 0.35rem;
    background: transparent;
    color: inherit;
    cursor: pointer;
    line-height: 0;
}

.password-visibility-toggle:hover {
    opacity: 0.8;
}

.password-visibility-toggle:focus-visible {
    outline: 2px solid var(--bega-primary, var(--primary, #2f78b7));
    outline-offset: 2px;
}

.password-native-input {
    flex: 1 1 auto;
    min-width: 0;
    width: 100%;
    border: 0;
    outline: 0;
    background: transparent;
    color: inherit;
    font: inherit;
}

.env-banner {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 2000;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 2.25rem;
    padding: 0.35rem 1rem;
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #fff;
    text-align: center;
}

.env-banner--dev {
    background: #c2410c;
}

.env-banner--qa {
    background: #1d4ed8;
}

body:has(.env-banner) {
    --env-banner-height: 2.25rem;
}

body:has(.env-banner) .mud-appbar {
    top: var(--env-banner-height) !important;
}

body:has(.env-banner) .public-shell,
body:has(.env-banner) .auth-shell {
    padding-top: var(--env-banner-height);
}

body:has(.env-banner) .content-shell {
    padding-top: calc(5.75rem + var(--env-banner-height));
}

body:has(.env-banner) .app-content {
    padding-top: calc(82px + var(--env-banner-height));
}

body:has(.env-banner) .auth-theme-toggle,
body:has(.env-banner) .auth-theme {
    top: calc(1rem + var(--env-banner-height));
}

@media (max-width: 600px) {
    body:has(.env-banner) .content-shell {
        padding-top: calc(5rem + var(--env-banner-height));
    }

    body:has(.env-banner) .app-content {
        padding-top: calc(74px + var(--env-banner-height));
    }
}

.app-version-label {
    color: inherit;
    font-size: 0.75rem;
    letter-spacing: 0.02em;
    font-variant-numeric: tabular-nums;
    opacity: 0.85;
}

.app-chrome-footer {
    display: flex;
    justify-content: center;
    padding: 0.65rem 1rem 1rem;
    color: var(--bega-text-muted, var(--muted, #686273));
}

.auth-shell {
    position: relative;
    min-height: 100vh;
}

.auth-shell > .app-chrome-footer {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
}