/****************************************************************************************
 * Sistema     : FRONTERA
 * Descripción : Identidad visual específica de Frontera Centro Comercial.
 ****************************************************************************************/

.ps-frontera-logo {
    display: block;
    width: 100%;
    height: auto;
    object-fit: contain;
}

.ps-frontera-logo--login {
    max-width: 250px;
    max-height: 156px;
}

.ps-frontera-logo--home {
    flex: 0 0 auto;
    width: 64px;
    max-height: 40px;
}

.ps-frontera-topbar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
}
.ps-frontera-topbar .ps-brand-logo {
    position: static;
    transform: none;
    max-width: none;
    height: auto;
    border-radius: 4px;
}
.ps-frontera-topbar .ps-brand-logo:focus-visible {
    outline: 3px solid #fff;
    outline-offset: 3px;
}
.ps-frontera-topbar .ps-frontera-logo--navbar {
    width: auto;
    height: 42px;
    max-width: 130px;
    object-fit: contain;
    filter: none;
}
.ps-frontera-topbar .ps-topbar__right {
    max-width: 100%;
    margin: 0;
}
.ps-frontera-topbar .ps-user-button { max-width: 100%; }
.ps-frontera-topbar .ps-user-dropdown { min-width: 0; max-width: 100%; }
.ps-frontera-topbar .ps-user-avatar { flex: 0 0 auto; }
.ps-frontera-topbar .ps-menu-btn { width: 44px; height: 44px; }
.ps-frontera-topbar .ps-user-button:focus-visible,
.ps-frontera-topbar .ps-menu-btn:focus-visible { outline: 3px solid #fff; outline-offset: 2px; }
.ps-frontera-topbar .ps-user-menu { max-width: calc(100vw - 16px); }

/* Variantes de composición de Inicio: geometría y estados compartidos. */
.ps-frontera-access--inventario { --ps-access-color: var(--ps-brand-blue); }
.ps-frontera-access--etiquetas { --ps-access-color: #087581; }
.ps-frontera-access--configuracion { --ps-access-color: #6950a1; }
.ps-home-page .ps-home-card--link {
    background: color-mix(in srgb, var(--ps-access-color) 6%, var(--ps-card));
    border-color: color-mix(in srgb, var(--ps-access-color) 24%, var(--ps-card));
}
.ps-home-page .ps-home-card--link .ps-home-card__icon {
    color: var(--ps-access-color);
    background: color-mix(in srgb, var(--ps-access-color) 12%, var(--ps-card));
}
.ps-home-page .ps-home-card--link :is(.ps-home-card__tag, .ps-home-card__arrow) { color: var(--ps-access-color); }
.ps-home-page .ps-home-card--link p { color: #475569; }
.ps-home-page .ps-home-card--link:hover {
    background: color-mix(in srgb, var(--ps-access-color) 10%, var(--ps-card));
    border-color: var(--ps-access-color);
}
.ps-home-page .ps-home-card--link:focus-visible {
    outline: 3px solid var(--ps-brand-blue);
    outline-offset: 3px;
    border-color: var(--ps-access-color);
    box-shadow: 0 0 0 3px rgba(0,84,184,.11);
}
@media (max-width: 900px) {
    .ps-frontera-topbar .ps-frontera-logo--navbar { height: 34px; max-width: 92px; }
}
@media (max-width: 600px) {
    .ps-frontera-logo--home { width: 48px; max-height: 30px; }
}

@media (max-width: 390px) {
    .ps-frontera-logo--login {
        max-width: 210px;
    }
}