#popup_overlay{
    position: fixed;
    inset: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    background: rgba(0, 0, 0, 0.4);
    z-index: 999;
    opacity: 0;

    visibility: hidden;

    transition:
        opacity 0.4s ease,
        visibility 0.4s ease;
}

#popup_overlay.active{opacity: 1; visibility: visible;}

#popup_wrapper{
    width: 100%;
    max-width: 640px;
    max-height: calc(100dvh - 32px);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    background: #FFF;
    padding: 40px;
    border-radius: 6px;
    box-sizing: border-box;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    opacity: 0;

    transition:
        opacity 0.4s ease;
}

#popup_overlay.active #popup_wrapper{opacity: 1;}

#popup_wrapper .X{
    position: absolute; 
    inset: 40px 20px auto auto;
    width: 29px; 
    height: 29px; 
    --icon-stroke: 4; 
    cursor: pointer;

}

.popup_text1{font-size: var(--h4-fsize); text-align: center; color: var(--ZLK-Green); font-weight: 400;}

.popup_text2{font-size: var(--h3-fsize); text-align: center; color: #777;}

.popup_text3{text-align: center; color: #666;}

#popup_wrapper > h1{color:  var(--ZLK-DarkBlue); text-align: center;}

#pop_up_form{display: flex; flex-direction: column; gap: 16px; width: 100%;}

.popup_form_row{display: flex; gap: 16px;}

.popup_form_row .popup_form_input_wrapper{flex: 1;}

.popup_form_input_wrapper{
    display: flex; 
    align-items: center;
    border: var(--ZLK-border);
    height: 43px; 
    padding: 0 0 0 16px;
    border-radius: 4px;
    background-color: #FFF;
}

.popup_form_input_wrapper input{
    border: none;
    outline: none;
    font-family: var(--Serif400);
    font-size: 16px;
    transition: var(--ZLK-Transitions);
    height: 100%;
    width: 100%;
    box-sizing: border-box;
    padding: 0 16px 0 8px;
    border-radius: 0 4px 4px 0;
    background: transparent;
}

.popup_form_input_wrapper:hover{background-color: var(--ZLK-TableHoverGreen);}

.popup_form_input_wrapper input::placeholder{color: #BDBDBD; font-weight: 500;}

#btn_pop_up_form{
    height: 43px;
    border: none;
    background-color: var(--ZLK-Green);
    border-radius: 4px;
    color: #FFF;
    font-family: var(--Serif400);
    font-size: var(--h4-fsize);
    font-weight: 700;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 0;
    transition: var(--ZLK-Transitions);
}

#btn_pop_up_form svg{flex-shrink: 0}

#btn_pop_up_form:hover{background-color: #26614d; transform: translate(1px, 1px); color: #CCC;}

#popup_intro_row_section{
    padding: 32px 0 0;
    border-top: 1px solid #DDD;
    width: 100%;
    margin-top: 16px;
}

#popup_intro_row{
    display: flex;
}

.popup_intro_item{
    flex:1;
    padding: 0 24px;
    display: flex; 
    gap: 16px;
    border-right: 1px solid #DDD;
    color: var(--ZLK-Green);
    align-items: flex-start;
}

.popup_intro_item:first-child{padding: 0 24px 0 0;}

.popup_intro_item:last-child{padding: 0 0 0 24px; border-right: none;}

.popup_intro_item > svg{flex-shrink: 0; padding-top: 6px;}

.popup_intro_item > p{color: var(--ZLK-DarkBlue); font-weight: 700; font-size: var(--h4-fsize);}

@media only screen and (max-width: 620px) {
    #popup_overlay{padding: 10px; align-items: flex-start;}

    #popup_wrapper{padding: 16px; margin-top: 10px; max-height: calc(100dvh - 20px);}

    #popup_intro_row_section{padding: 16px 0 0; margin-top: 0;}

    #popup_wrapper .X{inset: 16px 8px auto auto}

    .popup_form_row{flex-direction: column;}

    .popup_form_row .popup_form_input_wrapper{flex: none;}

    #popup_intro_row{flex-direction: column;}

    .popup_intro_item{padding: 8px 0; border-right: none; align-items: center; gap: 8px;}

    .popup_intro_item:first-child{padding: 0 0 8px 0;}

    .popup_intro_item:last-child{padding: 8px 0 0 0;}

    .popup_intro_item svg{width: 24px; height: 24px; padding-top: 0;}

    .popup_intro_item > p{font-size: var(--regular-fsize);}

}