/* Shared map controls and the image-anchored island map. Loaded after theme styles. */
[data-usvi-map] [data-usvi-trigger] { -webkit-tap-highlight-color: transparent; }
[data-usvi-map] [data-usvi-trigger]:focus-visible,
[data-usvi-map] [data-usvi-close]:focus-visible { outline: 3px solid #0b81ae; outline-offset: 4px; }
.discover-sec-two[data-usvi-map] .map-pin { border: 0; padding: 0; background: transparent; line-height: 0; z-index: 6; }
.discover-sec-two[data-usvi-map] .map-pin img { display: block; }
.discover-sec-two[data-usvi-map] .island-card-in[aria-hidden="true"] { pointer-events: none; }

/* Homepage markers are anchored to the illustrated image, independent of row order. */
.discover-sec-two[data-usvi-map] .map-img-box { position: relative; }
.discover-sec-two[data-usvi-map] .map-img-box > img { display: block; height: auto; }
.discover-sec-two[data-usvi-map] .usvi-home-map-points { position: absolute; inset: 0; pointer-events: none; }
.discover-sec-two[data-usvi-map] .usvi-home-map-point { position: absolute; right: auto; bottom: auto; width: 0; height: 0; z-index: 4; }
.discover-sec-two[data-usvi-map] .usvi-home-map-point.active { z-index: 40; }
.discover-sec-two[data-usvi-map] .usvi-home-map-point .island-card-outer { position: relative; width: 0; height: 0; }
.discover-sec-two[data-usvi-map] .usvi-home-map-point .disc-point-wrp { position: absolute; top: 0; left: 0; right: auto; bottom: auto; width: 0; height: 0; pointer-events: none; }
.discover-sec-two[data-usvi-map] .usvi-home-map-point .map-pin { position: absolute; top: 0; left: 0; right: auto; bottom: auto; width: 45px; transform: translate(-50%, -100%); pointer-events: auto; }
.discover-sec-two[data-usvi-map] .usvi-home-map-point .island-card-in { position: absolute; width: 375px; max-width: min(375px, calc(100vw - 32px)); right: auto; bottom: auto; visibility: hidden; pointer-events: none; }
.discover-sec-two[data-usvi-map] .usvi-home-map-point .island-card-in[aria-hidden="true"] { display: none; }
.discover-sec-two[data-usvi-map] .usvi-home-map-point.active .island-card-in { visibility: visible; pointer-events: auto; }
.discover-sec-two[data-usvi-map] .usvi-home-map-point .close-card { top: 10px; right: 10px; }
.discover-sec-two[data-usvi-map] .usvi-home-map-point--left .island-card-in { right: 12px; top: -55px; }
.discover-sec-two[data-usvi-map] .usvi-home-map-point--right .island-card-in { left: 65px; top: -130px; }
.discover-sec-two[data-usvi-map] .usvi-home-map-point--below .island-card-in { left: -187px; top: -430px; }
.discover-sec-two[data-usvi-map] .usvi-home-map-point .dotted-line-wrp { display: block; position: absolute; top: -30px; left: 16px; width: 48px; height: 0; border-top: 3px dotted var(--usvi-sky-blue); pointer-events: none; }
.discover-sec-two[data-usvi-map] .usvi-home-map-point--left .dotted-line-wrp { left: auto; right: 16px; }
.discover-sec-two[data-usvi-map] .usvi-home-map-point--below .dotted-line-wrp { top: -50px; left: 0; width: 0; height: 48px; border-top: 0; border-left: 3px dotted var(--usvi-sky-blue); }
.discover-sec-two[data-usvi-map] .usvi-home-map-point .dotted-crcl { top: -8px; left: auto; right: -7px; padding: 0; width: 14px; height: 14px; }
.discover-sec-two[data-usvi-map] .usvi-home-map-point--left .dotted-crcl { right: auto; left: -7px; }
.discover-sec-two[data-usvi-map] .usvi-home-map-point--below .dotted-crcl { top: -7px; bottom: auto; left: -8px; right: auto; }

@media (max-width: 1199px) {
    .discover-sec-two[data-usvi-map] .usvi-home-map-point .island-card-in { position: fixed; top: 50%; left: 50%; right: auto; bottom: auto; width: min(400px, calc(100vw - 32px)); max-height: calc(100vh - 32px); overflow-y: auto; transform: translate(-50%, 10px); z-index: 101; }
    .discover-sec-two[data-usvi-map] .usvi-home-map-point.active .island-card-in { transform: translate(-50%, 0); }
    .discover-sec-two[data-usvi-map] .usvi-home-map-point .dotted-line-wrp { display: none; }
}

.usvi-island-map-section .sec-head { max-width: 1161px; margin: 0 auto 30px; }
.usvi-island-map-section .discover-content-wrap { max-width: 1116px; margin: 0 auto; }
.usvi-island-map__stage { position: relative; width: 100%; margin: 0 auto; overflow: visible; }
.usvi-island-map__image { display: block; width: 100%; height: auto; }
.usvi-map-point { position: absolute; width: 0; height: 0; z-index: 4; }
.usvi-map-point.active { z-index: 40; }
.usvi-map-trigger { position: absolute; left: 0; top: 0; width: 45px; margin: 0; padding: 0; border: 0; background: transparent; cursor: pointer; transform: translate(-50%, -100%); z-index: 5; }
.usvi-map-trigger img { display: block; width: 100%; height: auto; }
.usvi-map-popup { position: absolute; left: 28px; top: -190px; width: min(375px, calc(100vw - 32px)); max-height: calc(100vh - 32px); overflow-y: auto; border-radius: 20px; background: #fff; box-shadow: 0 14px 74px rgba(0,0,0,.14); opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(10px); transition: opacity .22s ease, transform .22s ease, visibility .22s ease; z-index: 10; }
.usvi-island-map-section .usvi-map-popup[aria-hidden="true"] { display: none; }
.usvi-map-point.active .usvi-map-popup { opacity: 1; visibility: visible; pointer-events: auto; transform: translateY(0); }
.usvi-map-popup .card-img { position: relative; padding-top: 48%; overflow: hidden; border-radius: 20px 20px 0 0; }
.usvi-map-popup .card-img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.usvi-map-popup .card-info { padding: 20px 23px; background: #fff; border-radius: 0 0 20px 20px; }
.usvi-map-popup h3 { margin-bottom: 10px; }
.usvi-map-popup p a { color: var(--usvi-sky-blue); text-decoration: underline !important; font-weight: 500; }
.usvi-map-popup .card-links { margin-top: 14px; }
.usvi-map-popup__close { position: absolute; top: 10px; right: 10px; width: 34px; height: 34px; display: flex; align-items: center; justify-content: center; padding: 0; border: 0; border-radius: 50%; background: #fff; box-shadow: 0 2px 10px rgba(0,0,0,.18); cursor: pointer; z-index: 3; }
.usvi-map-popup__close img { width: 13px; height: 13px; }

@media (max-width: 991px) {
    .usvi-island-map-section .discover-content-wrap { margin: 0 auto; }
    .usvi-island-map-section .usvi-map-point { z-index: 110; }
    .usvi-island-map-section .usvi-map-point.active { z-index: 120; }
    .usvi-map-trigger { width: 35px; }
    .usvi-map-popup { position: fixed; top: 16px; left: 50%; width: min(400px, calc(100vw - 32px)); max-height: calc(100vh - 40px); transform: translate(-50%, 10px); z-index: 101; }
    .usvi-map-point.active .usvi-map-popup { transform: translate(-50%, 0); }
    .discover-sec-two[data-usvi-map] .island-card.active { z-index: 20; }
    .discover-sec-two[data-usvi-map] .island-card.active .island-card-outer { pointer-events: none; }
    .discover-sec-two[data-usvi-map] .island-card.active .island-card-in { pointer-events: auto; margin: 0 auto; }
    .discover-sec-two[data-usvi-map] .map-pin { opacity: 1 !important; pointer-events: auto !important; }
    .discover-sec-two[data-usvi-map] .usvi-home-map-point { z-index: 10; }
    .discover-sec-two[data-usvi-map] .usvi-home-map-point.active { z-index: 40; }
    .discover-sec-two[data-usvi-map] .usvi-home-map-point .map-pin { position: absolute; top: 0; left: 0; transform: translate(-50%, -100%); width: 35px; }
}

@media (max-width: 480px) {
    .usvi-island-map-section .sec-head { margin-bottom: 18px; }
    .usvi-map-trigger { width: 31px; }
    .usvi-map-popup .card-info { padding: 16px 19px; }
    .discover-sec-two[data-usvi-map] .usvi-home-map-point .map-pin { width: 31px; }
}
