/* Roca Materiales: original artwork, with responsive presentation. */
.brand-surface {
    background-image: radial-gradient(circle at 0 0, rgb(27 33 62 / 0.08), transparent 28rem),
        radial-gradient(circle at 100% 100%, rgb(27 33 62 / 0.035), transparent 24rem);
}
.roca-accent { height: 6px; background: linear-gradient(90deg, #1b213e, #424a70); }
.brand-logo.roca-login-logo { width: 100%; height: auto; max-width: 100%; }
.roca-brand { display: flex; min-width: 0; flex-direction: column; align-items: center; }
.roca-brand-symbol { display: block; width: 44px; height: 44px; flex-shrink: 0; }
.roca-brand-wordmark, .roca-brand-company { display: none; }
@media (min-width: 1280px) {
    .roca-brand { width: 100%; max-width: 216px; align-items: flex-start; }
    .roca-brand-symbol { display: none; }
    .roca-brand-wordmark { display: block; width: 100%; height: auto; object-fit: contain; }
    .roca-brand-company { display: block; width: 100%; overflow: hidden; text-overflow: ellipsis;
        white-space: nowrap; font-size: 11px; font-weight: 600; color: #475569; line-height: 1.4; }
    .app-sidebar-brand:has(.roca-brand) { height: auto; min-height: 64px; }
}
@media (min-width: 1280px) and (max-height: 544px) {
    .app-sidebar-brand .roca-brand-wordmark { max-width: 150px; }
    .app-sidebar-brand .roca-brand-company { display: none; }
    .app-sidebar-brand:has(.roca-brand) { min-height: 0; }
}