/* ==========================================
   EXIT INTENT POPUP STYLES
   ========================================== */

/* Dark Overlay Backing */
.exit-popup-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: none;      /* Hidden initially */
    justify-content: center;
    align-items: center;
    background: rgba(0, 0, 0, 0.7);
    z-index: 99999;
    padding: 20px;     /* Screen boundary padding */

}

/* Shown State */
.exit-popup-overlay.show {
    display: flex;
}

/* Centered Modal Box with Image Background */
.exit-popup {
    position: relative;
    width: 100%;
    max-width: 900px;  /* Expanded width so both sides look proportional */
    max-height: 55vh;
    overflow: hidden;

    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.35);

    /* Background image positioned strictly on the left side */
    background-image: url('https://www.decisionsadvisors.com/assets/img/exit-popup.png');
    background-size: cover;
    background-position: left center;
    background-repeat: no-repeat;
}

/* Left side spacer to keep image clear of form fields */
.popup-image-side {
    min-height: 100%;
}

/* Right side white background container for text & inputs */
.popup-form-side {

    padding: 2.5rem 2rem;
    overflow-y: auto;
    max-height: 90vh;
    border: none;
}

/* Close Button (Top-Right) */
.popup-close {
    position: absolute;
    top: 5px;
    right: 15px;
    background: transparent;
    border: none;
    font-size: 1.02rem;
    color: #FFFFFF;
    cursor: pointer;
    z-index: 10;
    transition: color 0.2s ease;
}

.popup-close:hover {
    color: red;
}

.popup-content{
    margin-top: 0.3rem;
    border: none;

}

/* Modal Typography */
.popup-content h2 {
    font-size: 1.5rem;
    font-weight: 700;
    color: #FFFFFF;
    margin-bottom: 0.2rem;
}

.popup-content p {
    font-size: 0.8rem;
    color: #FFFFFF;
    margin-bottom: 1.25rem;
    line-height: 1.4;
}

.popup-content div input {
    border-radius: 0;
}

.popup-content div textarea {
    border-radius: 0;
}

/* Form Controls */
.exit-popup .form-control {
    background-color: #f8fafc;

    color: #1e293b;
    padding: 0.2rem 0.50rem;


    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.exit-popup .form-control:focus {
    background-color: #ffffff;
    border-color: #3b82f6;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.15);
}

.exit-popup label {
    font-size: 0.85rem;
    font-weight: 600;
    color: #334155;
}

/* Submit Button */
.exit-popup .popup-btn {
    background-color: white;
    color: black;
    font-weight: 600;
    padding: 0.65rem 1.5rem;

    border: none;
    transition: background-color 0.2s ease, transform 0.1s ease;
}

.exit-popup .popup-btn:hover {
    background-color: #1d4ed8;
    color: #ffffff;
}

.exit-popup .popup-btn:active {
    transform: scale(0.98);
}

/* Responsive handling for mobile/small screens */
@media (max-width: 991px) {
    .popup-form-side {
        padding: 2rem 1.5rem;
    }
}