/* landingpages-ads/css/popup-style.css */

.popup-overlay {
    position: fixed;
    inset: 0; /* pintasan untuk top, right, bottom, left = 0 */
    background-color: rgba(16, 24, 40, 0.7); /* Latar belakang gelap separa telus */
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0s linear 0.3s;
}

.popup-overlay.is-visible {
    opacity: 1;
    visibility: visible;
    transition: opacity 0.3s ease;
}

.popup-content {
    background-color: #fff;
    padding: 2rem 2.5rem;
    border-radius: 1rem; /* Sudut lebih bulat */
    width: 100%;
    max-width: 750px; /* Anda boleh ubah nilai 550px jika mahu popup lebih kecil atau besar */
    position: relative;
    box-shadow: 0 10px 25px -5px rgba(0,0,0,0.1), 0 8px 10px -6px rgba(0,0,0,0.1);
    transform: scale(0.95) translateY(10px);
    transition: transform 0.3s ease;
    
    /* ===== TAMBAH DUA BARIS INI ===== */
    max-height: 85vh; /* Hadkan ketinggian untuk elak terkeluar dari skrin */
    overflow-y: auto; /* Tambah skrol jika perlu */
    /* =================================== */
}

.popup-overlay.is-visible .popup-content {
    transform: scale(1) translateY(0);
}

.popup-close-btn {
    position: absolute;
    top: 0.75rem;
    right: 1rem;
    font-size: 2rem;
    font-weight: 300;
    color: #94a3b8; /* kelabu */
    cursor: pointer;
    line-height: 1;
    transition: color 0.2s ease, transform 0.2s ease;
}

.popup-close-btn:hover {
    color: #101828; /* dark */
    transform: rotate(90deg);
}

/* Penyesuaian untuk borang Fluent Form di dalam popup */
.popup-content .ff-form-wrapper {
    margin-top: 1rem;
}

.popup-content .ff-btn-submit {
    width: 100%;
    background-color: var(--color-primary) !important;
    justify-content: center;
    font-size: 1rem !important;
    padding: 0.875rem 1rem !important;
}

.popup-content .ff-btn-submit:hover {
    background-color: #168d90 !important;
}