/* =========================================================
   COSTA MODERNA V55
   MAPA INTERACTIVO SIN IFRAME
   ========================================================= */

.modern-interactive-map-v55 {
    position:
        relative;

    display:
        block;

    min-height:
        390px;

    overflow:
        hidden;

    cursor:
        grab;

    touch-action:
        none;

    user-select:
        none;

    background:
        #e9eef4;

    isolation:
        isolate;
}


.modern-interactive-map-v55.is-dragging {
    cursor:
        grabbing;
}


.modern-map-tiles-v55 {
    position:
        absolute;

    inset:
        0;

    overflow:
        hidden;

    z-index:
        1;
}


.modern-map-tile-v55 {
    position:
        absolute;

    width:
        256px;

    height:
        256px;

    max-width:
        none !important;

    pointer-events:
        none;

    user-select:
        none;

    -webkit-user-drag:
        none;
}


.modern-map-property-marker-v55 {
    position:
        absolute;

    left:
        0;

    top:
        0;

    width:
        0;

    height:
        0;

    z-index:
        5;

    pointer-events:
        none;
}


.modern-map-property-marker-v55
> span {
    position:
        absolute;

    left:
        -22px;

    top:
        -50px;

    display:
        block;

    width:
        44px;

    height:
        44px;

    border:
        5px solid
        #fff;

    border-radius:
        50% 50% 50% 8px;

    background:
        #1764ef;

    box-shadow:
        0
        12px
        26px
        rgba(
            16,
            61,
            124,
            .34
        );

    transform:
        rotate(
            -45deg
        );
}


.modern-map-property-marker-v55
> span::after {
    content:
        "";

    position:
        absolute;

    left:
        50%;

    top:
        50%;

    width:
        12px;

    height:
        12px;

    border-radius:
        50%;

    background:
        #fff;

    transform:
        translate(
            -50%,
            -50%
        );
}


.modern-map-controls-v55 {
    position:
        absolute;

    left:
        16px;

    top:
        16px;

    display:
        grid;

    gap:
        7px;

    z-index:
        8;
}


.modern-map-controls-v55
button {
    display:
        grid;

    place-items:
        center;

    width:
        42px;

    height:
        42px;

    padding:
        0;

    border:
        1px solid
        rgba(
            214,
            226,
            240,
            .95
        );

    border-radius:
        12px;

    color:
        #173a60;

    background:
        rgba(
            255,
            255,
            255,
            .94
        );

    box-shadow:
        0
        9px
        22px
        rgba(
            21,
            55,
            91,
            .12
        );

    backdrop-filter:
        blur(
            10px
        );

    cursor:
        pointer;

    font-size:
        23px;

    font-weight:
        700;

    line-height:
        1;

    transition:
        transform
        .2s
        ease,
        background-color
        .2s
        ease,
        color
        .2s
        ease;
}


.modern-map-controls-v55
button:hover {
    color:
        #fff;

    background:
        #1764ef;

    transform:
        translateY(
            -1px
        );
}


.modern-map-controls-v55
button:disabled {
    opacity:
        .42;

    cursor:
        default;

    transform:
        none;
}


.modern-map-controls-v55
.modern-map-recenter-v55
svg {
    width:
        18px !important;

    height:
        18px !important;
}


.modern-map-loading-v55 {
    position:
        absolute;

    left:
        50%;

    top:
        50%;

    display:
        inline-flex;

    align-items:
        center;

    gap:
        9px;

    z-index:
        10;

    padding:
        10px
        14px;

    border-radius:
        999px;

    color:
        #526981;

    background:
        rgba(
            255,
            255,
            255,
            .93
        );

    box-shadow:
        0
        12px
        26px
        rgba(
            24,
            52,
            81,
            .12
        );

    font-size:
        10px;

    font-weight:
        850;

    transform:
        translate(
            -50%,
            -50%
        );
}


.modern-map-loading-v55[hidden] {
    display:
        none;
}


.modern-map-loading-v55
> span {
    width:
        14px;

    height:
        14px;

    border:
        2px solid
        #d2def0;

    border-top-color:
        #1764ef;

    border-radius:
        50%;

    animation:
        modernMapSpinV55
        .8s
        linear
        infinite;
}


@keyframes modernMapSpinV55 {
    to {
        transform:
            rotate(
                360deg
            );
    }
}


.modern-map-google-badge-v55 {
    position:
        absolute;

    right:
        16px;

    bottom:
        38px;

    display:
        inline-flex;

    align-items:
        center;

    gap:
        8px;

    min-height:
        42px;

    padding:
        9px
        13px;

    z-index:
        8;

    border:
        1px solid
        rgba(
            255,
            255,
            255,
            .60
        );

    border-radius:
        999px;

    color:
        #fff;

    background:
        rgba(
            13,
            42,
            76,
            .86
        );

    box-shadow:
        0
        12px
        28px
        rgba(
            8,
            31,
            58,
            .20
        );

    backdrop-filter:
        blur(
            10px
        );

    font-size:
        10px;

    font-weight:
        900;

    line-height:
        1;

    text-decoration:
        none;

    transition:
        transform
        .2s
        ease,
        background-color
        .2s
        ease;
}


.modern-map-google-badge-v55:hover {
    color:
        #fff;

    background:
        #1764ef;

    transform:
        translateY(
            -2px
        );
}


.modern-map-google-badge-v55
svg {
    width:
        16px !important;

    height:
        16px !important;
}


.modern-map-attribution-v55 {
    position:
        absolute;

    right:
        8px;

    bottom:
        7px;

    z-index:
        7;

    padding:
        3px
        6px;

    border-radius:
        6px;

    color:
        #587087;

    background:
        rgba(
            255,
            255,
            255,
            .82
        );

    font-size:
        8px;

    line-height:
        1.25;
}


.modern-map-attribution-v55
a {
    color:
        inherit;

    text-decoration:
        underline;
}


@media (
    max-width:
    700px
) {
    .modern-interactive-map-v55 {
        min-height:
            310px;
    }


    .modern-map-controls-v55 {
        left:
            11px;

        top:
            11px;
    }


    .modern-map-controls-v55
    button {
        width:
            38px;

        height:
            38px;
    }


    .modern-map-google-badge-v55 {
        right:
            10px;

        bottom:
            34px;

        padding:
            8px
            11px;

        font-size:
            9px;
    }
}
