/* =========================================================
   COSTA MODERNA V23 — LOGO CONFIGURABLE EN HEADER
   ========================================================= */

.modern-logo-config-v23 {
    min-width:
        0;
}


.modern-logo-image-v23 {
    display:
        inline-grid;

    place-items:
        center;

    flex:
        0 0
        auto;

    width:
        auto;

    max-width:
        var(
            --modern-brand-logo-width,
            150px
        );

    height:
        var(
            --modern-brand-logo-height,
            48px
        );
}


.modern-logo-image-v23 img {
    display:
        block;

    width:
        auto !important;

    max-width:
        var(
            --modern-brand-logo-width,
            150px
        ) !important;

    height:
        auto !important;

    max-height:
        var(
            --modern-brand-logo-height,
            48px
        ) !important;

    object-fit:
        contain;
}


.modern-logo-config-v23
.modern-logo-text {
    min-width:
        0;
}


.modern-logo-config-v23
.modern-logo-text strong {
    display:
        block;

    max-width:
        260px;

    overflow:
        hidden;

    text-overflow:
        ellipsis;

    white-space:
        nowrap;
}


.modern-logo-mode-logo_only {
    gap:
        0;
}


.modern-logo-mode-logo_only
.modern-logo-image-v23 {
    max-width:
        min(
            var(
                --modern-brand-logo-width,
                150px
            ),
            320px
        );
}


/*
 * En páginas interiores el logo sigue conservando su imagen
 * original; solamente cambia el color del texto si se muestra.
 */
.modern-listing-page
.modern-logo-config-v23,
.modern-detail-page
.modern-logo-config-v23,
.modern-advisor-page
.modern-logo-config-v23 {
    color:
        var(
            --modern-ink,
            #10243e
        );
}


@media (
    max-width:
    760px
) {
    .modern-logo-image-v23 {
        max-width:
            min(
                var(
                    --modern-brand-logo-width,
                    150px
                ),
                125px
            );

        height:
            min(
                var(
                    --modern-brand-logo-height,
                    48px
                ),
                42px
            );
    }


    .modern-logo-image-v23 img {
        max-width:
            min(
                var(
                    --modern-brand-logo-width,
                    150px
                ),
                125px
            ) !important;

        max-height:
            42px !important;
    }


    .modern-logo-config-v23
    .modern-logo-text strong {
        max-width:
            150px;

        font-size:
            11px;
    }


    .modern-logo-config-v23
    .modern-logo-text small {
        font-size:
            7px;
    }
}