/*
 * The source site is built on Duda. Its invisible mobile-drawer overlay is
 * normally managed by the Duda runtime; without that server runtime it can
 * remain above the document and absorb every click. Static hosting does not
 * need the dormant overlay to be interactive.
 */
.layout-drawer-overlay,
.dmPopupMask,
#dmPopup,
.dmPopup {
    display: none !important;
    pointer-events: none !important;
}

/* Keep ordinary HTML navigation and CTA controls directly interactive. */
a[href],
button,
[role="button"] {
    pointer-events: auto;
}

/* Locally mirrored homepage background video. */
[id="1248340342"] {
    overflow: hidden;
}

[id="1248340342"] > .local-hero-video {
    position: absolute;
    /* Extend past the section by two pixels.  This eliminates the thin line of
     * the original poster/background which can appear at the top when browser
     * layout rounds the video and section heights differently. */
    inset: -2px;
    z-index: 0;
    width: calc(100% + 4px);
    height: calc(100% + 4px);
    /* Duda's generic widget rule adds a 10px media margin.  A background
     * video must not inherit it, otherwise the poster peeks through above. */
    margin: 0 !important;
    object-fit: cover;
    pointer-events: none;
}

/* Static replacement for Duda's API-driven contact map. */
#dm .inlineMap .local-business-map {
    display: block;
    width: 100%;
    height: 100%;
    min-height: inherit;
    border: 0;
}

[id="1248340342"]::before {
    z-index: 1;
}

[id="1248340342"] > .dmRespColsWrapper {
    position: relative;
    z-index: 2;
}

/* Downloaded replacement for the embedded YouTube resort film. */
.innerYoutubeExt > .local-content-video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    background: #000;
}

.innerYoutubeExt > .local-content-audio {
    display: none;
}

/* The live Duda runtime reveals animated YouTube blocks after initialization.
 * A static export has no such runtime, so keep the locally replaced video and
 * its wrappers visible instead of leaving a decoded but hidden video. */
#dm .youtubeExt,
#dm .youtubeExt .innerYoutubeExt,
#dm .youtubeExt .local-content-video {
    visibility: visible !important;
    opacity: 1 !important;
}

/* Gallery lightbox, replacing the viewer the Duda runtime used to open.
 * Deliberately namespaced under .sx- so none of it collides with the exported
 * site's own classes, and so the .dmPopupMask rule above cannot hide it. */
.sx-lightbox {
    position: fixed;
    inset: 0;
    z-index: 2147483000;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 24px;
    background: rgba(0, 0, 0, .92);
    pointer-events: auto;
}

.sx-lightbox[hidden] {
    display: none !important;
}

body.sx-lightbox-open {
    overflow: hidden;
}

.sx-lightbox-figure {
    margin: 0;
    max-width: 100%;
    max-height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
}

.sx-lightbox-image {
    max-width: 100%;
    /* Room for the caption and the counter underneath. */
    max-height: calc(100vh - 140px);
    object-fit: contain;
    display: block;
    border-radius: 2px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, .6);
}

.sx-lightbox-caption {
    color: #fff;
    font-size: 15px;
    line-height: 1.5;
    text-align: center;
    max-width: 70ch;
    margin: 0;
}

.sx-lightbox-caption[hidden] {
    display: none !important;
}

.sx-lightbox-count {
    position: absolute;
    bottom: 18px;
    left: 0;
    right: 0;
    margin: 0;
    text-align: center;
    color: rgba(255, 255, 255, .75);
    font-size: 13px;
    letter-spacing: .08em;
}

.sx-lightbox button {
    appearance: none;
    border: 0;
    background: rgba(255, 255, 255, .12);
    color: #fff;
    cursor: pointer;
    border-radius: 50%;
    line-height: 1;
    transition: background .15s ease;
}

.sx-lightbox button:hover,
.sx-lightbox button:focus-visible {
    background: rgba(255, 255, 255, .28);
    outline: none;
}

.sx-lightbox button[hidden] {
    display: none !important;
}

.sx-lightbox-prev,
.sx-lightbox-next {
    flex: 0 0 auto;
    width: 48px;
    height: 48px;
    font-size: 22px;
}

.sx-lightbox-close {
    position: absolute;
    top: 16px;
    right: 16px;
    width: 44px;
    height: 44px;
    font-size: 28px;
}

/* The gallery thumbnails are anchors with no href, so nothing indicated they
 * could be opened. */
a[data-image-url] {
    cursor: zoom-in;
}

@media (max-width: 640px) {
    .sx-lightbox {
        padding: 12px;
        gap: 4px;
    }

    .sx-lightbox-prev,
    .sx-lightbox-next {
        width: 40px;
        height: 40px;
        font-size: 18px;
    }

    .sx-lightbox-image {
        max-height: calc(100vh - 160px);
    }
}

/* Duda normally reveals this home-page card row when its viewport animation
 * starts. The exported site has no Duda animation runtime, so keep the row
 * visible on both the English and Thai home pages. */
#dm [id="1118835599"] {
    visibility: visible !important;
    opacity: 1 !important;
}

/* The original runtime controls this drawer. Static hosting controls it here. */
@media (max-width: 1024px) {
    #layout-drawer-hamburger {
        z-index: 1001 !important;
    }

    body.static-menu-open #hamburger-drawer {
        transform: translate(0, 0) !important;
        visibility: visible !important;
        z-index: 1000 !important;
    }
}
