dialog.order-dialog .close-button {
    border: 1px solid var(--color-border);
    font-size: 0;
    width: 24px;
    height: 24px;
    position: absolute;
    top: 30px;
    right: 30px;
    border-radius: 250px;
    background: url(data:image/svg+xml,%3Csvg%20version%3D%221.1%22%20baseProfile%3D%22full%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20xmlns%3Aev%3D%22http%3A%2F%2Fwww.w3.org%2F2001%2Fxml-events%22%20xml%3Aspace%3D%22preserve%22%20x%3D%220px%22%20y%3D%220px%22%20width%3D%229px%22%20height%3D%228px%22%20%20viewBox%3D%220%200%209%208%22%20preserveAspectRatio%3D%22none%22%20shape-rendering%3D%22geometricPrecision%22%3E%3Cpath%20fill%3D%22rgb%28255%2C%200%2C%200%29%22%20d%3D%22M7.710%2C1.766%20L5.493%2C3.984%20L7.709%2C6.200%20C8.116%2C6.608%208.116%2C7.269%207.709%2C7.677%20C7.300%2C8.085%206.639%2C8.085%206.231%2C7.677%20L4.015%2C5.461%20L1.799%2C7.677%20C1.391%2C8.085%200.729%2C8.085%200.321%2C7.677%20C-0.087%2C7.269%20-0.087%2C6.608%200.321%2C6.200%20L2.537%2C3.984%20L0.320%2C1.766%20C-0.088%2C1.358%20-0.088%2C0.697%200.320%2C0.288%20C0.728%2C-0.119%201.390%2C-0.119%201.797%2C0.288%20L4.015%2C2.506%20L6.232%2C0.288%20C6.640%2C-0.119%207.302%2C-0.119%207.710%2C0.288%20C8.118%2C0.697%208.118%2C1.358%207.710%2C1.766%20Z%22%2F%3E%3C%2Fsvg%3E) 50% no-repeat;
    cursor: pointer;
}

dialog.order-dialog .title {
    font-family: var(--second-font);
    font-weight: 700;
    color: var(--color-black);
    font-size: 25px;
    text-align: left;
    margin-bottom: 40px;
    padding-right: 30px;
}

dialog.order-dialog .tpl-field:not(:last-child) {
    margin-bottom: 17px;
}

dialog.order-dialog .tpl-field {
    margin: 0;
    text-align: left;
}

dialog.order-dialog .tpl-field .field-title {
    color: var(--color-text-muted);
    font-family: var(--second-font);
    font-size: 13px;
    line-height: 13px;
    margin-bottom: 7px;
}

dialog.order-dialog .tpl-field .field-value input[type="text"],
dialog.order-dialog .tpl-field .field-value input[type="email"],
dialog.order-dialog .tpl-field .field-value input[type="phone"] {
    width: 100%;
    height: 50px;
    box-sizing: border-box;
    border: 1px solid var(--color-border);
    padding: 18px 20px 19px;
    outline: none;
    color: var(--color-text-dark);
    font-family: var(--second-font);
    font-size: 16px;
    border-radius: 3px;
}

dialog.order-dialog .tpl-field .field-value textarea {
    width: 100%;
    box-sizing: border-box;
    border: 1px solid var(--color-border);
    padding: 18px 20px 19px;
    outline: none;
    color: var(--color-text-dark);
    font-family: var(--second-font);
    font-size: 16px;
    border-radius: 3px;
}

p.privacy {
    font-size: small;
    text-align: left;
    color: var(--color-text-muted);
    line-height: normal;
}

dialog.order-dialog {
    max-width: 600px;
    width: 90%;
    border: none;
    border-radius: 8px;
    padding: 30px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
    position: relative;
}

dialog.order-dialog::backdrop {
    background: rgba(0, 0, 0, 0.5);
}

/* Lightbox dialog */
dialog.lightbox-dialog {
    max-width: 90vw;
    max-height: 90vh;
    border: none;
    padding: 0;
    background: transparent;
    overflow: visible;
}

dialog.lightbox-dialog::backdrop {
    background: rgba(0, 0, 0, 0.85);
}

dialog.lightbox-dialog img {
    max-width: 90vw;
    max-height: 85vh;
    object-fit: contain;
    display: block;
}

dialog.lightbox-dialog .lightbox-close {
    position: absolute;
    top: -35px;
    right: -5px;
    background: none;
    border: none;
    color: var(--color-white);
    font-size: 28px;
    cursor: pointer;
    line-height: 1;
    padding: 5px;
}
