.lanelleria-temp-popup {
position: fixed;
inset: 0;
z-index: 99999;
display: flex;
align-items: center;
justify-content: center;
padding: 24px;
opacity: 0;
visibility: hidden;
pointer-events: none;
transition: opacity 0.25s ease, visibility 0.25s ease;
}
.lanelleria-temp-popup,
.lanelleria-temp-popup * {
box-sizing: border-box;
}
.lanelleria-temp-popup.is-open {
opacity: 1;
visibility: visible;
pointer-events: auto;
}
body.lanelleria-temp-popup-open {
overflow: hidden;
}
.lanelleria-temp-popup__overlay {
position: absolute;
inset: 0;
background: rgba(17, 12, 9, 0.76);
}
.lanelleria-temp-popup__dialog {
position: relative;
z-index: 1;
display: grid;
grid-template-columns: minmax(260px, 0.95fr) minmax(320px, 1.05fr);
width: min(960px, 100%);
max-height: min(720px, calc(100vh - 48px));
overflow: hidden;
background: #fffaf6;
border-radius: 0;
box-shadow: 0 24px 80px rgba(37, 20, 11, 0.24);
}
.lanelleria-temp-popup--size-compact .lanelleria-temp-popup__dialog {
width: min(760px, 100%);
grid-template-columns: minmax(220px, 0.8fr) minmax(320px, 1fr);
}
.lanelleria-temp-popup--size-balanced .lanelleria-temp-popup__dialog {
width: min(960px, 100%);
grid-template-columns: minmax(260px, 0.95fr) minmax(320px, 1.05fr);
}
.lanelleria-temp-popup--size-wide .lanelleria-temp-popup__dialog {
width: min(1140px, 100%);
grid-template-columns: minmax(320px, 1.05fr) minmax(360px, 1fr);
}
.lanelleria-temp-popup__media {
min-height: 100%;
min-width: 0;
background: linear-gradient(135deg, #f7eee8 0%, #ebd3c2 100%);
}
.lanelleria-temp-popup__image {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
}
.lanelleria-temp-popup__content {
display: flex;
flex-direction: column;
justify-content: flex-start;
padding: 52px 44px 40px;
min-width: 0;
overflow-y: auto;
}
.lanelleria-temp-popup--align-top .lanelleria-temp-popup__content {
justify-content: flex-start;
}
.lanelleria-temp-popup--align-center .lanelleria-temp-popup__content {
justify-content: center;
}
.lanelleria-temp-popup--align-bottom .lanelleria-temp-popup__content {
justify-content: flex-end;
}
.lanelleria-temp-popup__close {
position: absolute;
top: 16px;
right: 16px;
z-index: 2;
width: 40px;
height: 40px;
border: 0;
border-radius: 999px;
background: rgba(105, 69, 49, 0.12);
color: inherit;
padding: 0;
display: flex;
align-items: center;
justify-content: center;
font-size: 0;
line-height: 0;
cursor: pointer;
transition: background 0.2s ease, transform 0.2s ease;
}
.lanelleria-temp-popup__close::before,
.lanelleria-temp-popup__close::after {
content: "";
position: absolute;
left: 50%;
top: 50%;
width: 18px;
height: 2px;
background: currentColor;
transform-origin: center;
}
.lanelleria-temp-popup__close::before {
transform: translate(-50%, -50%) rotate(45deg);
}
.lanelleria-temp-popup__close::after {
transform: translate(-50%, -50%) rotate(-45deg);
}
.lanelleria-temp-popup__close:hover,
.lanelleria-temp-popup__close:focus {
background: rgba(105, 69, 49, 0.2);
transform: scale(1.04);
}
.lanelleria-temp-popup__title {
margin: 0 0 14px;
font-size: 21px;
line-height: 1.08;
text-align: center;
padding: 40px 40px 0;
}
.lanelleria-temp-popup__description {
margin: 0 0 24px;
font-size: 16px;
line-height: 1.6;
}
.lanelleria-temp-popup__form {
margin-bottom: 18px;
}
.lanelleria-temp-popup__form p {
margin: 0 0 12px;
}
.lanelleria-temp-popup__placeholder-form {
display: grid;
gap: 12px;
}
.lanelleria-temp-popup__form input[type="checkbox"] {
width: 20px;
}
.lanelleria-temp-popup__form form {
width: 100%;
}
.lanelleria-temp-popup__form iframe,
.lanelleria-temp-popup__form img,
.lanelleria-temp-popup__form svg,
.lanelleria-temp-popup__form table,
.lanelleria-temp-popup__form input,
.lanelleria-temp-popup__form select,
.lanelleria-temp-popup__form textarea,
.lanelleria-temp-popup__form button {
max-width: 100%;
}
.lanelleria-temp-popup__form .mc4wp-form-fields {
display: flex;
flex-direction: column;
}
.lanelleria-temp-popup__form .mc4wp-form-fields p {
position: static !important;
}
.lanelleria-temp-popup__form .mc4wp-form-fields p a {
width: auto;
}
.lanelleria-temp-popup__form .mc4wp-form-fields * {
width: 100%;
margin-bottom: 2px;
}
.lanelleria-temp-popup__form .nsl-container-buttons {
width: 100% !important;
}
.lanelleria-temp-popup__consent {
display: flex;
gap: 10px;
align-items: flex-start;
margin-bottom: 20px;
font-size: 13px;
line-height: 1.5;
}
.lanelleria-temp-popup__consent input {
margin-top: 2px;
}
.lanelleria-temp-popup.is-preview .lanelleria-temp-popup__overlay {
background: rgba(17, 12, 9, 0.42);
}
@media (max-width: 1024px) {
.lanelleria-temp-popup {
padding: 16px;
}
.lanelleria-temp-popup__dialog,
.lanelleria-temp-popup--size-compact .lanelleria-temp-popup__dialog,
.lanelleria-temp-popup--size-balanced .lanelleria-temp-popup__dialog,
.lanelleria-temp-popup--size-wide .lanelleria-temp-popup__dialog {
width: min(860px, 100%);
grid-template-columns: minmax(200px, 0.78fr) minmax(0, 1fr);
max-height: calc(100vh - 32px);
}
.lanelleria-temp-popup__media {
min-height: 100%;
}
.lanelleria-temp-popup__content {
padding: 52px 24px 24px;
}
.lanelleria-temp-popup__title {
padding: 24px 16px 0;
}
}
@media (max-width: 767px) {
.lanelleria-temp-popup {
padding: 12px;
align-items: center;
}
.lanelleria-temp-popup__dialog,
.lanelleria-temp-popup--size-compact .lanelleria-temp-popup__dialog,
.lanelleria-temp-popup--size-balanced .lanelleria-temp-popup__dialog,
.lanelleria-temp-popup--size-wide .lanelleria-temp-popup__dialog {
grid-template-columns: 1fr;
grid-template-rows: auto;
height: auto;
min-height: 50vh;
max-height: none;
width: 100%;
border-radius: 0;
}
.lanelleria-temp-popup__media {
display: none;
}
.lanelleria-temp-popup__content {
padding: 56px 18px 20px;
overflow: visible;
min-height: 0;
}
.lanelleria-temp-popup__title {
padding: 0;
font-size: 21px;
line-height: 1.12;
}
.lanelleria-temp-popup__description {
font-size: 15px;
line-height: 1.55;
}
.lanelleria-temp-popup__close {
top: 12px;
right: 12px;
width: 36px;
height: 36px;
font-size: 24px;
}
.lanelleria-temp-popup__form .mc4wp-form-fields * {
min-width: 0;
}
.lanelleria-temp-popup__form,
.lanelleria-temp-popup__form form,
.lanelleria-temp-popup__form .mc4wp-form-fields,
.lanelleria-temp-popup__form .mc4wp-form-fields p,
.lanelleria-temp-popup__form .mc4wp-form-fields div {
width: 100%;
max-width: 100%;
}
}
@media (max-width: 480px) {
.lanelleria-temp-popup {
padding: 8px;
}
.lanelleria-temp-popup__dialog,
.lanelleria-temp-popup--size-compact .lanelleria-temp-popup__dialog,
.lanelleria-temp-popup--size-balanced .lanelleria-temp-popup__dialog,
.lanelleria-temp-popup--size-wide .lanelleria-temp-popup__dialog {
height: auto;
min-height: 50vh;
max-height: none;
border-radius: 0;
}
.lanelleria-temp-popup__content {
padding: 52px 14px 16px;
}
.lanelleria-temp-popup__title {
font-size: 19px;
}
.lanelleria-temp-popup__description {
font-size: 14px;
}
}