.efp-popup[hidden] {
display: none;
}
.efp-popup {
position: fixed;
inset: 0;
z-index: 100000;
display: flex;
align-items: center;
justify-content: center;
padding: 16px;
}
.efp-popup-backdrop {
position: absolute;
inset: 0;
background: rgba(0, 0, 0, 0.5);
}
.efp-popup-dialog {
position: relative;
width: 100%;
max-width: 520px;
max-height: calc(100vh - 32px);
max-height: calc(100dvh - 32px);
overflow-y: auto;
background: #fff;
border-radius: 8px;
box-shadow: 0 20px 40px rgba(0, 0, 0, 0.2);
animation: efp-popup-in 0.2s ease;
}
.efp-popup-body {
padding: 32px 20px 24px;
}
@media (min-width: 768px) {
.efp-popup-body {
padding: 40px 32px 32px;
}
}
.efp-popup-close {
position: absolute;
top: 12px;
right: 12px;
width: 36px;
height: 36px;
display: flex;
align-items: center;
justify-content: center;
border: 0;
border-radius: 50%;
background: transparent;
color: #2B2B2B;
cursor: pointer;
}
.efp-popup-close:hover,
.efp-popup-close:focus-visible {
background: #F2F2F2;
}
.efp-popup-title {
margin: 0 0 8px;
padding-right: 32px;
font-size: 22px;
font-weight: 700;
color: #2B2B2B;
}
.efp-popup-intro {
margin: 0 0 24px;
font-size: 14px;
color: #646970;
}
.efp-popup-form {
display: flex;
flex-direction: column;
gap: 16px;
}
.efp-popup .efp-form-group {
gap: 6px;
} .efp-popup-date {
position: relative;
}
.efp-popup-date .efp-input {
padding-right: 44px;
}
.efp-popup-date-btn {
position: absolute;
top: 0;
right: 0;
width: 44px;
height: 45px;
display: flex;
align-items: center;
justify-content: center;
border: 0;
background: transparent;
color: #898989;
cursor: pointer;
}
.efp-popup-date-btn:hover {
color: #C9252C;
}
.efp-popup-date-native {
position: absolute;
right: 0;
bottom: 0;
width: 44px;
height: 1px;
opacity: 0;
pointer-events: none;
border: 0;
padding: 0;
}
.efp-popup-actions .btn {
width: 100%;
margin-top: 8px;
}
.efp-popup-success {
text-align: center;
padding: 24px 0 8px;
}
.efp-popup-success[hidden] {
display: none;
}
.efp-popup .efp-loading-overlay {
border-radius: 8px;
}
body.efp-popup-open {
overflow: hidden;
}
@keyframes efp-popup-in {
from {
opacity: 0;
transform: translateY(12px);
}
to {
opacity: 1;
transform: translateY(0);
}
}