/**
 * InvitKeun — undangan di dalam iframe pratinjau (demo / dashboard)
 * Satu scrollbar saja (di body iframe), cover bisa diklik & di-scroll.
 */

html.invitation-embed-root {
    height: 100%;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0;
    padding: 0;
    overflow: hidden !important;
    scrollbar-gutter: auto !important;
}

body.invitation-embed {
    width: 100% !important;
    max-width: 100% !important;
    height: 100%;
    margin: 0;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior-y: contain;
    -webkit-overflow-scrolling: touch;
}

/* Jangan scroll ganda: body saja yang scroll, bukan #cover / kartu */
body.invitation-embed.has-cover-open,
body.invitation-embed.cover-dismissed,
body.invitation-embed.invitation-content-ready {
    position: relative !important;
    inset: auto !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
}

body.invitation-embed #cover,
body.invitation-embed #cover.invitation-embed-cover {
    position: relative !important;
    inset: auto !important;
    display: flex !important;
    align-items: flex-start !important;
    justify-content: center !important;
    width: 100% !important;
    min-height: 100% !important;
    min-height: 100svh !important;
    height: auto !important;
    max-height: none !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    padding: 0.45rem 0.5rem 1.35rem !important;
    box-sizing: border-box !important;
    z-index: 1;
}

body.invitation-embed.has-cover-open #cover {
    scroll-padding-bottom: 1.25rem;
}

body.invitation-embed #cover .cover-stage {
    transform: none !important;
    transform-origin: top center !important;
    max-width: min(100%, 19.5rem) !important;
    width: 100% !important;
    margin: 0 auto;
    z-index: 30;
    pointer-events: auto;
    flex-shrink: 0;
}

body.invitation-embed #cover .cover-stage.is-embed-fitted {
    will-change: transform;
}

body.invitation-embed #cover .cover-card-3d {
    animation: none !important;
    transform: none !important;
    max-height: none !important;
    overflow: visible !important;
    overflow-x: hidden !important;
    overflow-y: visible !important;
    pointer-events: auto;
    padding: 0.85rem 0.95rem 1rem !important;
}

/* Cover ringkas — muat di iframe demo, tombol tidak kepotong */
body.invitation-embed #cover .cover-label {
    margin-bottom: 0.35rem !important;
}

body.invitation-embed #cover .cover-date-block {
    margin-bottom: 0.35rem !important;
}

body.invitation-embed #cover .cover-photo-block {
    margin-bottom: 0.45rem !important;
}

body.invitation-embed #cover .cover-photo-wrap {
    width: min(52vw, 148px) !important;
    max-width: 148px !important;
    padding: 6px !important;
}

body.invitation-embed #cover .cover-couple-names {
    font-size: clamp(1.55rem, 6.5vw, 2.1rem) !important;
    line-height: 1.15 !important;
}

body.invitation-embed #cover .cover-save-date {
    margin-top: 0.2rem !important;
    font-size: 0.62rem !important;
}

body.invitation-embed #cover .cover-guest-block {
    margin-top: 0.5rem !important;
}

body.invitation-embed #cover .cover-guest-inner {
    padding: 0.5rem 0.7rem !important;
}

body.invitation-embed #cover .cover-guest-name {
    font-size: 1rem !important;
}

@media (min-width: 900px) {
    body.invitation-embed #cover {
        overflow: visible !important;
        align-items: flex-start !important;
    }

    body.invitation-embed #cover .cover-stage {
        transform: none !important;
        max-height: none !important;
    }

    body.invitation-embed #cover .cover-card-3d {
        max-height: none !important;
        overflow: visible !important;
    }
}

@media (max-width: 899px) {
    body.invitation-embed #cover {
        overflow: visible !important;
        padding-block: 0.5rem !important;
    }

    body.invitation-embed #cover .cover-card-3d {
        max-height: none !important;
        overflow: visible !important;
        overflow-y: visible !important;
        scrollbar-width: auto !important;
    }
}

body.invitation-embed #cover .invitation-fx-canvas.cover-fx,
body.invitation-embed #cover .living-bg,
body.invitation-embed #cover .cover-ambient {
    pointer-events: none !important;
}

body.invitation-embed #cover .invitation-fx-canvas.cover-fx {
    position: absolute !important;
    z-index: 2 !important;
    inset: 0;
}

body.invitation-embed #cover .cover-premium-bg {
    position: absolute;
    inset: 0;
    z-index: 0;
}

body.invitation-embed #cover .cover-open-btn,
body.invitation-embed #cover .cover-button-block,
body.invitation-embed #cover .cover-guest-inner {
    pointer-events: auto;
    touch-action: manipulation;
}

body.invitation-embed #cover .cover-open-btn {
    position: relative;
    z-index: 40;
    cursor: pointer;
}

body.invitation-embed .invitation-fx-global,
body.invitation-embed #globalFxCanvas {
    position: fixed !important;
    inset: 0 !important;
    z-index: 28 !important;
    opacity: 0.75 !important;
    visibility: visible !important;
    pointer-events: none !important;
}

body.invitation-embed #cover .invitation-fx-canvas.cover-fx {
    opacity: 1 !important;
    z-index: 9 !important;
}

body.invitation-embed .invitation-fx-canvas.hero-fx {
    opacity: 0.92 !important;
    overflow: visible !important;
}

body.invitation-embed #mainContent {
    position: relative;
    z-index: 2;
    width: 100% !important;
    max-width: 100% !important;
    overflow: visible !important;
    min-height: 0;
}

body.invitation-embed.cover-dismissed #cover {
    display: none !important;
}

body.invitation-embed.cover-dismissed #mainContent {
    display: block !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    visibility: visible !important;
}

body.invitation-embed #hero {
    min-height: 100%;
    min-height: 100dvh;
    width: 100% !important;
    max-width: 100% !important;
}

body.invitation-embed #hero .hero-pattern__content {
    position: relative;
    z-index: 12;
    opacity: 1 !important;
    visibility: visible !important;
}

body.invitation-embed #hero .hero-fx {
    position: absolute !important;
    inset: 0;
    z-index: 3;
}

body.invitation-embed #floatNav {
    z-index: 50;
    max-width: calc(100% - 1rem);
}

body.invitation-embed #cover .cover-photo-wrap {
    isolation: isolate;
    z-index: 2;
}

body.invitation-embed #cover .cover-names-block {
    margin-top: 0.2rem;
}

body.invitation-embed #cover .cover-button-block {
    margin-top: 0.55rem !important;
    padding-top: 0.35rem !important;
    padding-bottom: 0.85rem !important;
    position: relative;
    z-index: 45;
}

body.invitation-embed #cover .cover-open-btn {
    min-height: 46px !important;
    width: 100% !important;
    max-width: 260px !important;
    font-size: 0.75rem !important;
    letter-spacing: 0.12em !important;
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.28) !important;
}

body.invitation-embed #cover .cover-photo {
    position: relative;
    z-index: 1;
}

/* Sembunyikan scrollbar horizontal jika ada */
body.invitation-embed::-webkit-scrollbar {
    width: 8px;
}

body.invitation-embed::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.2);
    border-radius: 999px;
}