/* jQuery UI 1.8 -> 1.13 compatibility: the site CSS was written against the old
   button markup (text inside span.ui-button-text) and the old selectmenu plugin. */
.ui-button.ui-button-text-only { padding: 0; line-height: normal; }
.ui-button .ui-button-text { display: block; line-height: 1.4; }
.ui-button-text-only .ui-button-text { padding: .4em 1em; }
.ui-controlgroup > .ui-controlgroup-item { float: none; }

/* header search: jQuery UI's own selectmenu dressed as the old plugin */
#head-nav .search .ui-selectmenu.ui-button { padding: 0; box-sizing: content-box; text-align: right; white-space: nowrap; line-height: 23px; }
#head-nav .search .ui-selectmenu .ui-selectmenu-text { margin: 0 0 0 20px; }
body.en #head-nav .search .ui-selectmenu.ui-button { text-align: left; }
body.en #head-nav .search .ui-selectmenu .ui-selectmenu-text { margin: 0 20px 0 0; }
body.en .ui-selectmenu-menu .ui-menu-item-wrapper { text-align: left; }
#head-nav .search .ui-selectmenu .ui-selectmenu-icon.ui-icon { position: absolute; top: 50%; margin-top: -8px; float: none; }
.ui-selectmenu-menu .ui-menu { padding-bottom: 0; }
.ui-selectmenu-menu .ui-menu-item-wrapper { padding: .3em 1em; text-align: right; }

/* site dialogs (.pj-dialog): coupon on the order page, video on the home page */
.ui-widget-overlay { background: #1f1a14; opacity: .45; }
.pj-dialog.ui-dialog {
    padding: 0; border: 0; border-radius: 16px; overflow: hidden;
    background: #fff; box-shadow: 0 18px 50px rgba(31, 26, 20, .28);
    font-family: "Heebo", Arial, Helvetica, sans-serif;
}
.pj-dialog .ui-dialog-titlebar {
    position: relative; padding: 20px 24px 4px; border: 0; border-radius: 0;
    background: none; color: #2b2620;
}
.pj-dialog .ui-dialog-title {
    float: none; display: block; width: auto; margin: 0; white-space: normal;
    font-family: "Frank Ruhl Libre", Georgia, serif; font-size: 22px; font-weight: 700;
}
.pj-dialog .ui-dialog-titlebar-close {
    position: absolute; top: 14px; right: auto; left: 14px; margin: 0;
    width: 32px; height: 32px; padding: 0; border: 0; border-radius: 50%;
    background: #f4efe6; color: #4a433a; text-indent: 0; font-size: 0;
}
body.en .pj-dialog .ui-dialog-titlebar-close { left: auto; right: 14px; }
.pj-dialog .ui-dialog-titlebar-close:hover { background: #e9e1d2; }
.pj-dialog .ui-dialog-titlebar-close .ui-icon { display: none; }
.pj-dialog .ui-dialog-titlebar-close::before {
    content: "\00d7"; font-size: 22px; line-height: 32px; font-family: Arial, sans-serif;
}
.pj-dialog .ui-dialog-content { padding: 8px 24px 24px; }
.coupon-dialog #pnlAddNewCoupon { margin: 0; }
.coupon-dialog #pnlAddNewCoupon label {
    display: block; margin: 0 0 8px; font-weight: 500; font-size: 14px; color: #6b6255;
}
.coupon-dialog #pnlAddNewCoupon input[type="text"] {
    display: block; width: 100%; height: 46px; margin: 0 0 14px; padding: 0 14px;
    border: 1px solid #e0d6c4; border-radius: 10px; box-sizing: border-box;
    font: 500 16px "Heebo", Arial, sans-serif; color: #2b2620; background: #fff;
    letter-spacing: .5px;
}
.coupon-dialog #pnlAddNewCoupon input[type="text"]:focus {
    outline: 0; border-color: #12a0b5; box-shadow: 0 0 0 3px rgba(18, 160, 181, .18);
}
.coupon-dialog #pnlAddNewCoupon .jqui-button,
.coupon-dialog #pnlAddNewCoupon .ui-button {
    display: block; width: 100%; height: 46px; margin: 0; padding: 0;
    border: 0; border-radius: 10px; cursor: pointer;
    background: linear-gradient(135deg, #0a6b7a 0%, #12a0b5 100%); color: #fff;
    font: 700 16px "Heebo", Arial, sans-serif; line-height: 46px; box-shadow: none;
}
.coupon-dialog #pnlAddNewCoupon .ui-button .ui-button-text { padding: 0; line-height: 46px; }
.coupon-dialog #pnlAddNewCoupon .jqui-button:hover { filter: brightness(1.06); }
.video-dialog .ui-dialog-content { padding: 8px 16px 16px; }
.video-dialog .ui-dialog-title { padding-left: 40px; }
body.en .video-dialog .ui-dialog-title { padding-left: 0; padding-right: 40px; }
.video-dialog .popup-player iframe {
    display: block; width: 100%; height: auto; aspect-ratio: 16 / 9;
    border: 0; border-radius: 10px; background: #000;
}
.video-dialog .popup-player-missing { margin: 8px 0 4px; font-size: 16px; color: #6b6255; }