/* Popup Builder — Frontend Styles */

/* ── Animations ── */
.hp-popup {
    transition-property: opacity, transform;
    transition-timing-function: ease;
    transition-duration: 300ms; /* fallback, inline style override eder */
}

/* Fade */
.hp-popup--fade { opacity: 0; }
.hp-popup--fade.hp-popup--open { opacity: 1; }

/* Slide Up */
.hp-popup--slide-up { opacity: 0; transform: translateY(40px) !important; }
.hp-popup--slide-up.hp-popup--open { opacity: 1; transform: translateY(0) !important; }

/* Slide Down */
.hp-popup--slide-down { opacity: 0; transform: translateY(-40px) !important; }
.hp-popup--slide-down.hp-popup--open { opacity: 1; transform: translateY(0) !important; }

/* Zoom */
.hp-popup--zoom { opacity: 0; transform: translate(-50%,-50%) scale(.88) !important; }
.hp-popup--zoom.hp-popup--open { opacity: 1; transform: translate(-50%,-50%) scale(1) !important; }

/* None */
.hp-popup--none { transition: none; }

/* Overlay */
.hp-overlay {
    transition: opacity .3s ease;
    opacity: 0;
}
.hp-overlay.hp-overlay--open { opacity: 1; }

/* Close button */
.hp-close-btn {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: absolute !important;
    top: 10px !important;
    right: 10px !important;
    border: none !important;
    border-radius: 50% !important;
    cursor: pointer !important;
    z-index: 100001 !important;
    padding: 0 !important;
    margin: 0 !important;
    pointer-events: auto !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
}
.hp-close-btn svg {
    display: block !important;
    flex-shrink: 0 !important;
    margin: auto !important;
}

/* Prevent body scroll */
body.pb-scroll-locked {
    overflow: hidden;
}

/* Content area */
.hp-popup-content {
    line-height: 1.7;
    width: 100%;
}
.hp-popup-content > *:first-child { margin-top: 0; }
.hp-popup-content > *:last-child  { margin-bottom: 0; }

/* ── Responsive fixes ── */
.hp-popup {
    word-break: normal !important;
    overflow-wrap: break-word !important;
}

/* Gutenberg columns inside popup */
.hp-popup .wp-block-columns {
    flex-wrap: nowrap;
    gap: 16px;
}

@media (max-width: 600px) {
    .hp-popup {
        left: 50% !important;
        right: auto !important;
        transform: translateX(-50%) !important;
        width: calc(100vw - 24px) !important;
        max-height: 85vh !important;
        top: 50% !important;
        transform: translate(-50%, -50%) !important;
    }
    .hp-popup--zoom {
        transform: translate(-50%, -50%) scale(.88) !important;
    }
    .hp-popup--zoom.hp-popup--open {
        transform: translate(-50%, -50%) scale(1) !important;
    }
    .hp-popup .wp-block-columns {
        flex-wrap: wrap !important;
    }
    .hp-popup .wp-block-column {
        flex-basis: 100% !important;
    }
}