/*
 * Base structure
 */

:root {
    --background-color: #e4e3ea;
    --background-red: #da1413;
    --background-dark-red: #bb0c14;
    --text-color: #506273;
    --border-color: #ced4da;
}

/* Move down content because we have a fixed navbar that is 3.5rem tall */
body {
    background: none;
    font-family: Roboto, sans-serif;
    font-size: 1rem;
    padding-top: 40px;
}

/*
 * Typography
 */

h1 {
    border-bottom: 1px solid #eee;
    margin-bottom: 20px;
    padding-bottom: 9px;
}

div.basic-information {
    border-bottom: 1px dashed #e2e7ec;
    margin-bottom: 20px;
    padding-bottom: 9px;
}

span.small-title {
    font-size: 1.1em;
    font-weight: 500;
}

span.dinnerbooking-profile {
    color: #f80000;
    font-weight: 500;
    font-size: 1.1em;
}

.border-bottom-dashed {
    border-bottom: 1px dashed #e2e7ec;
    box-sizing: border-box;
}

.booking-history-title {
    font-size: 16px;
    font-weight: 500;
    padding-bottom: 10px;
}

.edit-booking-history-modal-content {
    max-width: 400px;
}

.custom-table-height {
    min-height: 500px;
}

.gap-2 {
    gap: 8px;
}

/*
 * Form margin reset
 */

form {
    margin-bottom: 0;
}

::placeholder,
.form-control::placeholder {
    color: #717f8d;
}

/* Style the empty option of select tag as a placeholder */
select:invalid {
    color: #506273;
}

.kitchen-areas-delete-ban {
    width: 11px;
}

/*
 * Sidebar
 */
/* stylelint-disable declaration-block-no-redundant-longhand-properties -- Fix for New Booking Window to be removed
    ONLY AFTER SAFARI 14.1 IS THE LAST SUPPORTED VERSION */
.sidebar {
    bottom: 0;
    left: 0;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 0 0 20px;
    position: fixed;
    top: 0;
    z-index: 1021;
}
/* stylelint-enable declaration-block-no-redundant-longhand-properties */

.sidebar .nav {
    margin-bottom: 20px;
}

.sidebar .nav-item {
    width: 100%;
}

.sidebar .nav-item + .nav-item {
    margin-left: 0;
}

.sidebar .nav-link {
    border-radius: 0;
}

/*
 * Dashboard
 */

.main-content .content {
    margin: 0 20px 20px;
    width: 730px;
}

/* Placeholders */
.placeholders {
    padding-bottom: 3rem;
}

.placeholder img {
    padding-bottom: 1.5rem;
    padding-top: 1.5rem;
}

/************************************ CUSTOM STYLES ********************************************/

/* latin */
@font-face {
    font-family: Roboto;
    font-style: normal;
    font-weight: 300;
    src: url("../../fonts/Roboto-Light.eot");
    src:
        url("../../fonts/Roboto-Light.eot?#iefix") format("embedded-opentype"),
        url("../../fonts/Roboto-Light.woff2") format("woff2"),
        url("../../fonts/Roboto-Light.woff") format("woff"),
        url("../../fonts/Roboto-Light.ttf") format("truetype");
}

/* latin */
@font-face {
    font-family: Roboto;
    font-style: normal;
    font-weight: 400;
    src: url("../../fonts/Roboto-Regular.eot");
    src:
        url("../../fonts/Roboto-Regular.eot?#iefix") format("embedded-opentype"),
        url("../../fonts/Roboto-Regular.woff2") format("woff2"),
        url("../../fonts/Roboto-Regular.woff") format("woff"),
        url("../../fonts/Roboto-Regular.ttf") format("truetype");
}

/* latin */
@font-face {
    font-family: Roboto;
    font-style: normal;
    font-weight: 500;
    src: url("../../fonts/Roboto-Medium.eot");
    src:
        url("../../fonts/Roboto-Medium.eot?#iefix") format("embedded-opentype"),
        url("../../fonts/Roboto-Medium.woff2") format("woff2"),
        url("../../fonts/Roboto-Medium.woff") format("woff"),
        url("../../fonts/Roboto-Medium.ttf") format("truetype");
}

/* latin */
@font-face {
    font-family: Roboto;
    font-style: normal;
    font-weight: 700;
    src: url("../../fonts/Roboto-Bold.eot");
    src:
        url("../../fonts/Roboto-Bold.eot?#iefix") format("embedded-opentype"),
        url("../../fonts/Roboto-Bold.woff2") format("woff2"),
        url("../../fonts/Roboto-Bold.woff") format("woff"),
        url("../../fonts/Roboto-Bold.ttf") format("truetype");
}

.backend-navbar {
    background-color: #354758;
    height: 40px;
    left: 210px;
    transition: all 0.4s;
}

.backend-navbar.collapsed {
    left: 45px;
}

.backend-navbar-business-login-page {
    background-color: #354758;
    height: 40px;
}

.backend-sidebar {
    background-color: #506071;
    -webkit-transition: all 0.4s;
    transition: all 0.4s;
    width: 210px;
}

.backend-sidebar .top-logo {
    margin-left: 8px;
}

.padlock-admin {
    margin-left: 12px;
}

.top-logo {
    height: 40px;
}

.sidebar-menu {
    list-style: none;
    margin: 0 0 0 6px;
    overflow: hidden;
    padding: 0;
    white-space: nowrap;
    z-index: 1021;
}

.sidebar-menu li {
    margin: 2px 0;
    padding: 0;
    text-indent: -0.4em;
    list-style: none;
    border-radius: 4px;
}

.sidebar-menu li.treeview > a.active {
    background-color: #2c3b41;
}

.sidebar-menu .treeview .treeview-submenu {
    background: none;
    padding: 0;
}

.sidebar-menu .treeview > a {
    color: #fff;
    display: block;
    font-size: 13px;
    font-weight: 500;
    line-height: 15px;
    padding: 12px;
    white-space: nowrap;
    border-radius: 4px 0 0 4px;
    height: 39px;
}

.sidebar-menu .treeview > a:hover img {
    transform: rotate(360deg);
    transition: transform 1s ease-in-out;
}

.sidebar-menu .treeview > a .icon {
    height: 14px;
    margin-left: 4px;
    margin-right: 14px;
    padding: 0;
    width: 14px;
    line-height: 15px;
}

.sidebar .menu-lock {
    margin-left: 6px;
    position: absolute;
    bottom: 10%;
    line-height: 15px;
    height: 39px;
    width: 34px;
    padding: 10px;
}

.sidebar a.menu-lock:hover {
    background: #2c3b41;
    border-radius: 4px;
}

.sidebar .menu-lock > img {
    height: 14px;
    width: 14px;
    line-height: 15px;
}

.sidebar-menu .treeview > a .icon,
.sidebar-menu .treeview > a span {
    vertical-align: middle;
}

.sidebar-menu .treeview > a:hover {
    text-decoration: none;
}

.sidebar-menu .treeview > a .fa {
    line-height: 15px;
}

.sidebar-menu .treeview-menu {
    background-color: #2c3b41;
    margin: 0;
    padding: 0;
    position: fixed;
    top: 40px;
    left: 210px;
    transition: width 0.4s;
    transition-delay: 0.2s;
    width: 210px;
    height: 100%;
    z-index: 1021;
}

.sidebar-menu .treeview-menu.collapsed {
    width: 0;
}

.sidebar-menu .treeview-menu.collapsed .treeview-submenu > a {
    transition: opacity 0s;
    opacity: 0;
    width: 0;
    margin: 0;
    padding: 0;
}

.sidebar-menu .treeview-menu.collapsed .treeview-submenu > a .padlock-admin {
    margin: 0;
}

.sidebar-menu .treeview-submenu > a.active {
    transition: opacity 2s;
    opacity: 1;
}

.sidebar-menu .treeview-menu li {
    margin: 2px 6px;
}

.sidebar-menu .treeview-menu li a {
    color: #fff;
    display: block;
    font-size: 13px;
    font-weight: 500;
    line-height: 15px;
    height: 39px;
    margin: 0;
    padding: 12px;
    white-space: nowrap;
    border-radius: 4px;
    overflow: hidden;
    transition: opacity 2s;
    opacity: 1;
}

.sidebar-menu .treeview li a span {
    padding: 0;
    margin: 0;
}

.sidebar-menu .treeview-menu li a:active,
.sidebar-menu .treeview-menu li a:hover {
    background-color: #354859;
    text-decoration: none;
}

.sidebar-menu .treeview-menu a.active {
    background-color: #354859;
    text-decoration: none;
}

.sidebar-closed .backend-sidebar {
    width: 45px;
}

.sidebar-closed .treeview-menu {
    left: 45px;
    transition: all 0.4s;
}

.sidebar-closed .sidebar-menu .treeview > a span {
    transition: opacity 0s;
    opacity: 0;
    padding: 0;
    margin: 0;
}

.sidebar-closed .static-footer,
.sidebar-closed .static-footer-info {
    left: 0;
}

.close-arrow {
    content: url("../img/close_left_menu.png");
}

.open-arrow {
    content: url("../img/open_left_menu.png");
}

/* Fullscreen loader */

/* stylelint-disable declaration-block-no-redundant-longhand-properties -- Absolute Center Spinner.
    top, bottom, right, left = 0 is workaround since Safari doesn't support inset property */
.loading,
.loading-modal,
.initials-overlay {
    inset: 0;
    display: none;
    height: 2em;
    margin: auto;
    position: fixed;
    width: 2em;
    z-index: 999;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}
/* stylelint-enable declaration-block-no-redundant-longhand-properties */

.loading,
.loading-modal {
    z-index: 9999;
}

.loading-modal {
    height: 100%;
    position: absolute;
    width: 100%;
}

/* Transparent Overlay */
.loading::before,
.loading-modal::before,
.initials-overlay::after {
    background: #000;
    background: rgb(54 72 89 / 40%);
    content: "";
    display: block;
    height: 100%;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
}

.loading-modal::before {
    bottom: 0;
    position: absolute;
    right: 0;
}

/* :not(:required) hides these rules from IE9 and below */
.loading:not(:required),
.loading-modal:not(:required),
.initials-overlay:not(:required) {
    /* hide "loading..." text */
    background-color: transparent;
    border: 0;
    color: transparent;
    font: 0/0 a;
    text-shadow: none;
}

.loading:not(:required)::after,
.loading-modal:not(:required)::after {
    -moz-animation: spinner 1500ms infinite linear;
    -ms-animation: spinner 1500ms infinite linear;
    -o-animation: spinner 1500ms infinite linear;
    -webkit-animation: spinner 1500ms infinite linear;
    animation: spinner 1500ms infinite linear;
    border-radius: 0.5em;
    -webkit-box-shadow: rgb(0 0 0 / 75%) 1.5em 0 0 0, rgb(0 0 0 / 75%) 1.1em 1.1em 0 0, rgb(0 0 0 / 75%) 0 1.5em 0 0, rgb(0 0 0 / 75%) -1.1em 1.1em 0 0, rgb(0 0 0 / 50%) -1.5em 0 0 0, rgb(0 0 0 / 50%) -1.1em -1.1em 0 0, rgb(0 0 0 / 75%) 0 -1.5em 0 0, rgb(0 0 0 / 75%) 1.1em -1.1em 0 0;
    box-shadow: rgb(0 0 0 / 75%) 1.5em 0 0 0, rgb(0 0 0 / 75%) 1.1em 1.1em 0 0, rgb(0 0 0 / 75%) 0 1.5em 0 0, rgb(0 0 0 / 75%) -1.1em 1.1em 0 0, rgb(0 0 0 / 75%) -1.5em 0 0 0, rgb(0 0 0 / 75%) -1.1em -1.1em 0 0, rgb(0 0 0 / 75%) 0 -1.5em 0 0, rgb(0 0 0 / 75%) 1.1em -1.1em 0 0;
    content: "";
    display: block;
    font-size: 10px;
    height: 1em;
    margin-top: -0.5em;
    width: 1em;
}

.loading-modal:not(:required)::after {
    left: 50%;
    position: absolute;
    top: 50%;
}

/* Animation */

@keyframes spinner {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

.initials-select {
    align-items: center;
    background: white;
    border-radius: 4px;
    display: flex;
    flex-direction: column;
    font-family: Roboto, sans-serif;
    font-size: 1rem;
    justify-content: center;
    left: 50%;
    padding: 50px;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 300px;
    z-index: 1000;
}

.initials-title {
    border: none;
    color: #516172;
    font-family: Roboto, sans-serif;
    font-size: 20px;
    margin-bottom: 10px;
    padding: 0;
}

.initials-select .form-control {
    width: 140px;
}

.initials-list {
    background: #eaeaea;
    height: 240px;
    list-style: none;
    overflow-y: scroll;
    padding: 5px;
}

.initials-list li {
    cursor: pointer;
    padding: 3px 0;
}

.initials-list li.selected {
    background: #afcfe9;
}

.flag-icon {
    width: 1em;
}

/* force uk flag */
.flag-icon-us {
    background-image: url("../../vendor/css/flag-icon/flags/4x3/gb.svg");
}

/* Flags */

.flag {
    background: transparent url("../../img/flags.png?v=2") no-repeat;
    display: inline-block;
    height: 11px;
    width: 16px;
}

.flag-ad {
    background-position: -16px 0;
}

.flag-ae {
    background-position: -32px 0;
}

.flag-af {
    background-position: -48px 0;
}

.flag-ag {
    background-position: -64px 0;
}

.flag-ai {
    background-position: -80px 0;
}

.flag-al {
    background-position: -96px 0;
}

.flag-am {
    background-position: -112px 0;
}

.flag-an {
    background-position: -128px 0;
}

.flag-ao {
    background-position: -144px 0;
}

.flag-ar {
    background-position: -160px 0;
}

.flag-as {
    background-position: -176px 0;
}

.flag-at {
    background-position: -192px 0;
}

.flag-au {
    background-position: -208px 0;
}

.flag-aw {
    background-position: -224px 0;
}

.flag-ax {
    background-position: -96px -165px;
}

.flag-az {
    background-position: -240px 0;
}

.flag-ba {
    background-position: 0 -11px;
}

.flag-bb {
    background-position: -16px -11px;
}

.flag-bd {
    background-position: -32px -11px;
}

.flag-be {
    background-position: -48px -11px;
}

.flag-bf {
    background-position: -64px -11px;
}

.flag-bg {
    background-position: -80px -11px;
}

.flag-bh {
    background-position: -96px -11px;
}

.flag-bi {
    background-position: -112px -11px;
}

.flag-bj {
    background-position: -128px -11px;
}

.flag-bm {
    background-position: -144px -11px;
}

.flag-bn {
    background-position: -160px -11px;
}

.flag-bo {
    background-position: -176px -11px;
}

.flag-br {
    background-position: -192px -11px;
}

.flag-bs {
    background-position: -208px -11px;
}

.flag-bt {
    background-position: -224px -11px;
}

.flag-bv {
    background-position: -240px -11px;
}

.flag-bw {
    background-position: 0 -22px;
}

.flag-by {
    background-position: -16px -22px;
}

.flag-bz {
    background-position: -32px -22px;
}

.flag-ca {
    background-position: -48px -22px;
}

.flag-catalonia {
    background-position: -64px -22px;
}

.flag-cc {
    background-position: -64px -165px;
}

.flag-cd {
    background-position: -80px -22px;
}

.flag-cf {
    background-position: -96px -22px;
}

.flag-cg {
    background-position: -112px -22px;
}

.flag-ch {
    background-position: -128px -22px;
}

.flag-ci {
    background-position: -144px -22px;
}

.flag-ck {
    background-position: -160px -22px;
}

.flag-cl {
    background-position: -176px -22px;
}

.flag-cm {
    background-position: -192px -22px;
}

.flag-cn {
    background-position: -208px -22px;
}

.flag-co {
    background-position: -224px -22px;
}

.flag-cr {
    background-position: -240px -22px;
}

.flag-cu {
    background-position: 0 -33px;
}

.flag-cv {
    background-position: -16px -33px;
}

.flag-cx {
    background-position: -32px -165px;
}

.flag-cy {
    background-position: -32px -33px;
}

.flag-cz {
    background-position: -48px -33px;
}

.flag-de {
    background-position: -64px -33px;
}

.flag-dj {
    background-position: -80px -33px;
}

.flag-dk {
    background-position: -96px -33px;
}

.flag-dm {
    background-position: -112px -33px;
}

.flag-do {
    background-position: -128px -33px;
}

.flag-dz {
    background-position: -144px -33px;
}

.flag-ec {
    background-position: -160px -33px;
}

.flag-ee {
    background-position: -176px -33px;
}

.flag-eg {
    background-position: -192px -33px;
}

.flag-eh {
    background-position: -208px -33px;
}

.flag-england {
    background-position: -224px -33px;
}

.flag-er {
    background-position: -240px -33px;
}

.flag-es {
    background-position: 0 -44px;
}

.flag-et {
    background-position: -16px -44px;
}

.flag-eu {
    background-position: -32px -44px;
}

.flag-fi {
    background-position: -48px -44px;
}

.flag-fj {
    background-position: -64px -44px;
}

.flag-fk {
    background-position: -80px -44px;
}

.flag-fm {
    background-position: -96px -44px;
}

.flag-fo {
    background-position: -112px -44px;
}

.flag-fr {
    background-position: -128px -44px;
}

.flag-ga {
    background-position: -144px -44px;
}

.flag-gd {
    background-position: -176px -44px;
}

.flag-ge {
    background-position: -192px -44px;
}

.flag-gf {
    background-position: -208px -44px;
}

.flag-gh {
    background-position: -224px -44px;
}

.flag-gi {
    background-position: -240px -44px;
}

.flag-gl {
    background-position: 0 -55px;
}

.flag-gm {
    background-position: -16px -55px;
}

.flag-gn {
    background-position: -32px -55px;
}

.flag-gp {
    background-position: -48px -55px;
}

.flag-gq {
    background-position: -64px -55px;
}

.flag-gr {
    background-position: -80px -55px;
}

.flag-gs {
    background-position: -96px -55px;
}

.flag-gt {
    background-position: -112px -55px;
}

.flag-gu {
    background-position: -128px -55px;
}

.flag-gw {
    background-position: -144px -55px;
}

.flag-gy {
    background-position: -160px -55px;
}

.flag-hk {
    background-position: -176px -55px;
}

.flag-hm {
    background-position: -192px -55px;
}

.flag-hn {
    background-position: -208px -55px;
}

.flag-hr {
    background-position: -224px -55px;
}

.flag-ht {
    background-position: -240px -55px;
}

.flag-hu {
    background-position: 0 -66px;
}

.flag-id {
    background-position: -16px -66px;
}

.flag-ie {
    background-position: -32px -66px;
}

.flag-il {
    background-position: -48px -66px;
}

.flag-im {
    background-position: -80px -165px;
}

.flag-in {
    background-position: -64px -66px;
}

.flag-io {
    background-position: -80px -66px;
}

.flag-iq {
    background-position: -96px -66px;
}

.flag-ir {
    background-position: -112px -66px;
}

.flag-is {
    background-position: -128px -66px;
}

.flag-it {
    background-position: -144px -66px;
}

.flag-je {
    background-position: -48px -165px;
}

.flag-jm {
    background-position: -160px -66px;
}

.flag-jo {
    background-position: -176px -66px;
}

.flag-jp {
    background-position: -192px -66px;
}

.flag-ke {
    background-position: -208px -66px;
}

.flag-kg {
    background-position: -224px -66px;
}

.flag-kh {
    background-position: -240px -66px;
}

.flag-ki {
    background-position: 0 -77px;
}

.flag-km {
    background-position: -16px -77px;
}

.flag-kn {
    background-position: -32px -77px;
}

.flag-kp {
    background-position: -48px -77px;
}

.flag-kr {
    background-position: -64px -77px;
}

.flag-kw {
    background-position: -80px -77px;
}

.flag-ky {
    background-position: -96px -77px;
}

.flag-kz {
    background-position: -112px -77px;
}

.flag-la {
    background-position: -128px -77px;
}

.flag-lb {
    background-position: -144px -77px;
}

.flag-lc {
    background-position: -160px -77px;
}

.flag-li {
    background-position: -176px -77px;
}

.flag-lk {
    background-position: -192px -77px;
}

.flag-lr {
    background-position: -208px -77px;
}

.flag-ls {
    background-position: -224px -77px;
}

.flag-lt {
    background-position: -240px -77px;
}

.flag-lu {
    background-position: 0 -88px;
}

.flag-lv {
    background-position: -16px -88px;
}

.flag-ly {
    background-position: -32px -88px;
}

.flag-ma {
    background-position: -48px -88px;
}

.flag-mc {
    background-position: -64px -88px;
}

.flag-md {
    background-position: -80px -88px;
}

.flag-me {
    background-position: -96px -88px;
}

.flag-mg {
    background-position: -112px -88px;
}

.flag-mh {
    background-position: -128px -88px;
}

.flag-mk {
    background-position: -144px -88px;
}

.flag-ml {
    background-position: -160px -88px;
}

.flag-mm {
    background-position: -176px -88px;
}

.flag-mn {
    background-position: -192px -88px;
}

.flag-mo {
    background-position: -208px -88px;
}

.flag-mp {
    background-position: -224px -88px;
}

.flag-mq {
    background-position: -240px -88px;
}

.flag-mr {
    background-position: 0 -99px;
}

.flag-ms {
    background-position: -16px -99px;
}

.flag-mt {
    background-position: -32px -99px;
}

.flag-mu {
    background-position: -48px -99px;
}

.flag-mv {
    background-position: -64px -99px;
}

.flag-mw {
    background-position: -80px -99px;
}

.flag-mx {
    background-position: -96px -99px;
}

.flag-my {
    background-position: -112px -99px;
}

.flag-mz {
    background-position: -128px -99px;
}

.flag-na {
    background-position: -144px -99px;
}

.flag-nc {
    background-position: -160px -99px;
}

.flag-ne {
    background-position: -176px -99px;
}

.flag-nf {
    background-position: -192px -99px;
}

.flag-ng {
    background-position: -208px -99px;
}

.flag-ni {
    background-position: -224px -99px;
}

.flag-nl {
    background-position: -240px -99px;
}

.flag-np {
    background-position: -16px -110px;
}

.flag-nr {
    background-position: -32px -110px;
}

.flag-nu {
    background-position: -48px -110px;
}

.flag-nz {
    background-position: -64px -110px;
}

.flag-om {
    background-position: -80px -110px;
}

.flag-pa {
    background-position: -96px -110px;
}

.flag-pe {
    background-position: -112px -110px;
}

.flag-pf {
    background-position: -128px -110px;
}

.flag-pg {
    background-position: -144px -110px;
}

.flag-ph {
    background-position: -160px -110px;
}

.flag-pk {
    background-position: -176px -110px;
}

.flag-pl {
    background-position: -192px -110px;
}

.flag-pm {
    background-position: -208px -110px;
}

.flag-pn {
    background-position: -224px -110px;
}

.flag-pr {
    background-position: -240px -110px;
}

.flag-ps {
    background-position: 0 -121px;
}

.flag-pt {
    background-position: -16px -121px;
}

.flag-pw {
    background-position: -32px -121px;
}

.flag-py {
    background-position: -48px -121px;
}

.flag-qa {
    background-position: -64px -121px;
}

.flag-re {
    background-position: -80px -121px;
}

.flag-ro {
    background-position: -96px -121px;
}

.flag-rs {
    background-position: -112px -121px;
}

.flag-ru {
    background-position: -128px -121px;
}

.flag-rw {
    background-position: -144px -121px;
}

.flag-sa {
    background-position: -160px -121px;
}

.flag-sb {
    background-position: -176px -121px;
}

.flag-sc {
    background-position: -192px -121px;
}

.flag-scotland {
    background-position: -208px -121px;
}

.flag-sd {
    background-position: -224px -121px;
}

.flag-se {
    background-position: -240px -121px;
}

.flag-sg {
    background-position: 0 -132px;
}

.flag-sh {
    background-position: -16px -132px;
}

.flag-si {
    background-position: -32px -132px;
}

.flag-sk {
    background-position: -48px -132px;
}

.flag-sl {
    background-position: -64px -132px;
}

.flag-sm {
    background-position: -80px -132px;
}

.flag-sn {
    background-position: -96px -132px;
}

.flag-so {
    background-position: -112px -132px;
}

.flag-sr {
    background-position: -128px -132px;
}

.flag-st {
    background-position: -144px -132px;
}

.flag-sv {
    background-position: -160px -132px;
}

.flag-sy {
    background-position: -176px -132px;
}

.flag-sz {
    background-position: -192px -132px;
}

.flag-tc {
    background-position: -208px -132px;
}

.flag-td {
    background-position: -224px -132px;
}

.flag-tf {
    background-position: -240px -132px;
}

.flag-tg {
    background-position: 0 -143px;
}

.flag-th {
    background-position: -16px -143px;
}

.flag-tj {
    background-position: -32px -143px;
}

.flag-tk {
    background-position: -48px -143px;
}

.flag-tl {
    background-position: -64px -143px;
}

.flag-tm {
    background-position: -80px -143px;
}

.flag-tn {
    background-position: -96px -143px;
}

.flag-to {
    background-position: -112px -143px;
}

.flag-tr {
    background-position: -128px -143px;
}

.flag-tt {
    background-position: -144px -143px;
}

.flag-tv {
    background-position: -160px -143px;
}

.flag-tw {
    background-position: -176px -143px;
}

.flag-tz {
    background-position: -192px -143px;
}

.flag-ua {
    background-position: -208px -143px;
}

.flag-ug {
    background-position: -224px -143px;
}

.flag-um {
    background-position: -240px -143px;
}

.flag-us {
    background-position: 0 -154px;
}

.flag-uy {
    background-position: -16px -154px;
}

.flag-uz {
    background-position: -32px -154px;
}

.flag-va {
    background-position: -48px -154px;
}

.flag-vc {
    background-position: -64px -154px;
}

.flag-ve {
    background-position: -80px -154px;
}

.flag-vg {
    background-position: -96px -154px;
}

.flag-vi {
    background-position: -112px -154px;
}

.flag-vn {
    background-position: -128px -154px;
}

.flag-vu {
    background-position: -144px -154px;
}

.flag-wales {
    background-position: -160px -154px;
}

.flag-wf {
    background-position: -176px -154px;
}

.flag-ws {
    background-position: -192px -154px;
}

.flag-ye {
    background-position: -208px -154px;
}

.flag-yt {
    background-position: -224px -154px;
}

.flag-za {
    background-position: -240px -154px;
}

.flag-zm {
    background-position: 0 -165px;
}

.flag-zw {
    background-position: -16px -165px;
}

.lang-us {
    background-position: -16px -757px;
}

.flag-gb,
.flag-uk {
    background-position: -160px -44px;
}

.flag-no,
.flag-sj {
    background-position: 0 -110px;
}

.restaurant-select-wrapper {
    min-height: 60px;
}

.switch-restaurant-form .white-label {
    color: white;
    font-size: 12px;
    font-weight: bold;
    line-height: 14px;
}

.navbar-custom-menu {
    height: 40px;
}

.navbar-nav {
    align-items: center;
    display: flex;
    height: 40px;
    flex-wrap: nowrap;
    white-space: nowrap;
}

.navbar-custom-item .navbar-anchor {
    align-items: center;
    color: white;
    display: flex;
    font-size: 13px;
    height: 100%;
    position: relative;
}

.navbar-custom-item .navbar-anchor .flag-icon {
    margin-right: 6px;
}

.pl-15 {
    padding-left: 15px;
}

.navbar-custom-item {
    align-items: center;
    display: flex;
    height: 100%;
    margin: 0 10px;
    min-width: 100px;
    position: relative;
}

.mw-130 {
    min-width: 130px;
}

.mw-147 {
    min-width: 147px;
}

.navbar-custom-item a {
    padding: 0 15px 0 3px;
    white-space: nowrap;
}

.navbar-custom-item a:hover {
    text-decoration: none;
}

.navbar-custom-item:hover {
    background: #4d5b68;
}

.navbar-with-tick .navbar-anchor::after {
    border-color: white transparent transparent;
    border-style: solid;
    border-width: 5px 5px 0;
    content: "";
    display: inline-block;
    height: 0;
    margin-left: 10px;
    width: 0;
}

.navbar-with-button {
    margin: 0;
    min-width: initial;
}

.navbar-with-button .notifications-circle,
.navbar-with-button .restaurant-unread-messages-circle {
    color: white;
    font-size: 12px;
    height: 16px;
    line-height: 16px;
    min-width: 16px;
    padding: 0 3px;
    width: auto;
}

img.unread-icon + .notifications-circle {
    left: 11px;
    top: 3px;
    height: 7px;
    width: 7px;
    transform: unset;
}

.email-unread-icon {
    position: relative;
    width: 15px;
    height: 18px;
    left: 50%;
    transform: translateX(-50%);
}

.w-80 {
    width: 80%;
}

.w-88 {
    width: 88%;
}

.margin-left15 {
    margin-left: 15px;
}

.horizontal-brd {
    border-bottom: 1px solid #d0d0d0;
    width: 100%;
}

.review-body {
    font-size: 12px;
    margin-left: 15px;
}

.navbar-with-dropdown .dropdown {
    display: none;
}

.navbar-with-dropdown:hover .dropdown {
    display: block;
}

.top-menu-wrapper {
    background-color: #303030;
    font-size: 0;
    left: 50%;
    min-width: 850px;
    padding: 15px 20px;
    position: absolute;
    top: 40px;
    transform: translateX(-50%);
}

.top-menu-wrapper .column {
    display: inline-block;
    vertical-align: top;
    min-width: 150px;
}

.align-top {
    vertical-align: top;
}

.top-menu-wrapper .top-menu-item,
.top-menu-wrapper .top-menu-parent {
    color: white;
    display: block;
    font-size: 13px;
    margin-bottom: 6px;
    position: relative;
}

.top-menu-wrapper .top-menu-parent {
    font-weight: bold;
}

.top-menu-wrapper .top-menu-list {
    list-style: none;
    margin: 0 0 20px;
    padding-left: 0;
}

.top-menu-wrapper .column .top-menu-list:last-child {
    margin-bottom: 0;
}

.top-menu-wrapper .top-menu-item {
    padding-left: 15px;
    text-indent: -0.9em;
    overflow: hidden;
    margin-right: 6px;
}

.top-menu-wrapper .top-menu-item a {
    color: white;
    font-size: 13px;
}

.top-menu-wrapper .top-menu-item a:hover {
    text-decoration: underline;
}

.top-menu-wrapper .top-menu-item::before {
    color: white;
    content: "\f111";
    font: normal normal normal 14px/1 FontAwesome;
    font-size: 6px;
    left: 0;
    transform: translateY(-50%);
    position: relative;
    top: -2px;
}

.active-submenu {
    background-color: #54a2eb;
}

.top-languages-wrapper,
.top-username-wrapper {
    background-color: #5a6c7d;
    position: absolute;
    left: 0;
    top: 40px;
    min-width: 100%;
}

.btn-link {
    background: none;
    border: none;
    color: #54a2eb;
    cursor: pointer;
    padding: 0;
    text-decoration: underline;
}

.top-countries-wrapper {
    left: 0;
    width: fit-content;
}

.top-countries-wrapper .top-dropdown-list {
    columns: auto 1;
}

.top-countries-wrapper .top-dropdown-list li {
    width: 200px;
}

.top-countries-wrapper .top-dropdown-list li a {
    white-space: initial;
}

.top-languages-wrapper .top-dropdown-item .top-dropdown-anchor,
.top-username-wrapper .top-username-item .top-username-anchor {
    padding: 6px 8px;
}

.top-languages-wrapper .top-dropdown-item .top-dropdown-anchor:hover,
.top-username-wrapper .top-username-item .top-username-anchor:hover {
    background: #589ee9;
}

.top-dropdown-list,
.top-username-list {
    list-style: none;
    padding: 0;
}

.top-dropdown-anchor,
.top-username-anchor {
    align-items: center;
    color: white;
    display: flex;
    font-size: 13px;
    min-width: 100%;
    padding: 5px 10px;
}

.top-dropdown-anchor .flag,
.top-dropdown-anchor .flag-icon {
    margin-right: 6px;
}

.top-username-anchor:hover {
    color: white;
}

.top-dropdown-item:hover,
.top-username-item:hover {
    background: #32434a;
}

.dropdown-label {
    color: white;
    font-size: 13px;
}

.navbar-anchor,
.top-username-anchor .fa-external-link {
    margin-left: 5px;
}

.navbar-anchor .flag {
    display: inline-block;
    margin-right: 6px;
}

.top-username {
    color: white;
    font-size: 20px;
    margin: 0 0 0 15px;
}

/* Static footer */

.static-footer {
    background: #f4f4f4;
    border-top: 1px solid #dcdcdc;
    bottom: 22px;
    cursor: pointer;
    font-size: 14px;
    left: 210px;
    padding: 7px 10px;
    transform: translateX(-20px);
    display: block;
    width: calc(100% + 40px);
    right: 0;
    -webkit-transition: all 0.4s;
    transition: all 0.4s;
    z-index: 998;
}

.footer-button {
    background: var(--text-color);
    color: white;
    display: inline-block;
    font-size: 13px;
    margin-right: 10px;
    padding: 5px 20px;
}

.footer-blue {
    background: #54a2eb;
}

.footer-button:hover {
    color: white;
}

.static-footer-info {
    background: #354859;
    bottom: 0;
    color: white;
    cursor: pointer;
    height: 22px;
    width: calc(100% + 45px);
    transform: translateX(-10px);
    -webkit-transition: all 0.4s;
    transition: all 0.4s;
    overflow: hidden;
}

.static-footer-info span {
    line-height: 22px;
}

.max-width-50 {
    max-width: 50%;
}

.static-footer-tooltip .tooltip-inner {
    background: white;
    color: #354758;
    font-size: 13px;
    line-height: 1.2;
    max-width: initial;
}

.static-footer-tooltip .arrow::before {
    border-top-color: white;
}

/* Content */

.main-content {
    font-size: 0.813rem;
    padding: 20px 20px 20px 230px;
    transition: all 0.4s;
}

.main-content .modal {
    font-size: 1rem;
}

.wrapper {
    display: flex;
}

.without-sidebar {
    padding-left: 60px !important;
}

.main-title {
    border-bottom: none;
    color: #516273;
    font-size: 30px;
    font-weight: 700;
}

/* New Booking modal */

.modal-xl {
    margin: 10px auto;
    min-width: 1210px;
}

.modal-lg-x {
    margin-top: 10px;
    min-width: 1000px;
}

.modal-header {
    cursor: pointer;
    padding: 16px 16px 4px;
}

#notificationsModalContent .modal-header {
    cursor: unset;
}

.modal-content {
    position: relative;
}

.modal-xl .modal-content {
    min-height: 740px;
}

.modal-title {
    font-size: 18px;
    overflow: hidden;
}

.modal-scroll {
    overflow-y: auto;
}

.custom-form {
    width: 100%;
}

.separator {
    border-right: 1px solid #e9ecef;
}

.to-time-label {
    font-size: 12px;
    text-align: right;
}

.custom-form .input-group-text {
    font-size: 12px;
    padding: 2px 6px;
}

.custom-form .form-group {
    align-items: center;
    margin-bottom: 10px;
}

.custom-form .form-group-smaller {
    margin-bottom: 6px;
}

.custom-form .form-label {
    color: #272833;
    font-size: 13px;
    font-weight: 500;
    line-height: 1;
    margin-bottom: 0;
    padding: 0 0 0 20px;
}

#InternalOrderItemNote {
    font-size: 14px;
    height: 642px;
    font-weight: 500;
    color: var(--text-color);
}

.custom-form .form-label-block {
    line-height: 1;
    padding: 0;
}

.custom-form .custom-control-label {
    font-size: 13px;
}

.custom-form .form-control {
    color: #2c3b41;
    font-size: 12px;
    max-height: 32px;
    padding: 6px 10px;
}

.custom-form .form-control-taller {
    max-height: 64px;
}

.custom-form .form-control-textarea {
    max-height: initial;
}

.custom-form .disabled-input {
    border-color: #f1f2f5;
    color: #a7a9bc;
    cursor: not-allowed;
    pointer-events: none;
}

.custom-form .disabled-label {
    color: #a7a9bc;
    pointer-events: none;
}

.custom-form .scrollable-box-multiple {
    max-height: 130px;
}

.custom-form .custom-checkbox .form-label,
.custom-form .custom-radio .form-label {
    font-weight: 400;
    line-height: 25px;
    padding-left: 0;
}

.custom-checkbox-group .custom-checkbox {
    margin-right: 0;
}

.custom-checkbox-group .form-group {
    margin-bottom: 0;
}

.custom-button,
.listing-dialog .ui-dialog-buttonpane button.custom-button {
    background: white;
    border: 1px solid #cdced9;
    border-radius: 4px;
    color: #4a4a4a;
    font-size: 13px;
    font-weight: 500;
    min-width: 100%;
    padding: 6px;
    text-align: center;
}

.custom-button.smh {
    height: 26px;
    line-height: 16px;
}

.custom-button[disabled] {
    background: #ceced9;
    cursor: not-allowed;
}

.custom-button-blue {
    background: #589ee9;
    color: white;
}

.custom-button.suggested-button-align {
    height: 26px;
    padding-top: 2px;
    text-align: left;
}

.phone-country-dropdown .btn {
    background: #f1f2f5;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='512'%20height='512'%20viewBox='0%200%20512%20512'%3E%3Cpath%20class='lexicon-icon-outline'%20d='M347.913%20199.336l-81.538-85c-5.413-5.642-14.188-5.642-19.6%200l-81.538%2085c-8.731%209.101-2.548%2024.664%209.8%2024.664h163.077c12.348%200%2018.531-15.563%209.8-24.664zM165.236%20312.664l81.538%2085c5.412%205.642%2014.188%205.642%2019.6%200l81.538-85c8.731-9.101%202.548-24.664-9.8-24.664H175.035c-12.347%200-18.531%2015.563-9.8%2024.664z'%20fill='%236B6C7E'/%3E%3C/svg%3E");
    background-position: right 0.1em center;
    background-repeat: no-repeat;
    background-size: 1.5em auto;
    border-color: #e7e7ed;
    color: #2c3b41;
    font-size: 12px;
    font-weight: normal;
    max-height: 32px;
    padding: 6px 10px;
    width: 100%;
}

.phone-country-dropdown .btn::after {
    display: none;
}

.custom-form .phone-country-dropdown > .btn:hover,
.custom-form .phone-country-dropdown > .btn:active,
.custom-form .phone-country-dropdown > .btn:focus-within {
    background: #f1f2f5;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='512'%20height='512'%20viewBox='0%200%20512%20512'%3E%3Cpath%20class='lexicon-icon-outline'%20d='M347.913%20199.336l-81.538-85c-5.413-5.642-14.188-5.642-19.6%200l-81.538%2085c-8.731%209.101-2.548%2024.664%209.8%2024.664h163.077c12.348%200%2018.531-15.563%209.8-24.664zM165.236%20312.664l81.538%2085c5.412%205.642%2014.188%205.642%2019.6%200l81.538-85c8.731-9.101%202.548-24.664-9.8-24.664H175.035c-12.347%200-18.531%2015.563-9.8%2024.664z'%20fill='%236B6C7E'/%3E%3C/svg%3E");
    background-position: right 0.1em center;
    background-repeat: no-repeat;
    background-size: 1.5em auto;
    border-color: #e7e7ed;
    color: #2c3b41;
}

.custom-form .phone-country-dropdown > .btn:focus {
    background-color: #f0f5ff;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='512'%20height='512'%20viewBox='0%200%20512%20512'%3E%3Cpath%20class='lexicon-icon-outline'%20d='M347.913%20199.336l-81.538-85c-5.413-5.642-14.188-5.642-19.6%200l-81.538%2085c-8.731%209.101-2.548%2024.664%209.8%2024.664h163.077c12.348%200%2018.531-15.563%209.8-24.664zM165.236%20312.664l81.538%2085c5.412%205.642%2014.188%205.642%2019.6%200l81.538-85c8.731-9.101%202.548-24.664-9.8-24.664H175.035c-12.347%200-18.531%2015.563-9.8%2024.664z'%20fill='%236B6C7E'/%3E%3C/svg%3E");
    background-position: right 0.1em center;
    background-repeat: no-repeat;
    background-size: 1.5em auto;
    border-color: #80acff;
    box-shadow: 0 0 0 0.2rem rgb(0 123 255 / 25%);
    color: #2c3b41;
    outline: 0;
}

.custom-form .phone-country-dropdown .dropdown-menu {
    height: 200px;
    overflow-y: auto;
}

.custom-form .phone-country-dropdown .dropdown-menu .dropdown-item {
    cursor: pointer;
    font-size: 13px;
    padding: 5px;
}

.scrollable-box-wrapper {
    border: 1px solid var(--border-color);
    border-radius: 5px;
}

.scrollable-box,
.scrollable-box-multiple,
.scrollable-box-both-ways,
.scrollable-box-both-ways-tall,
.scrollable-box-both-ways-taller,
.scrollable-box-both-ways-skyscraper {
    font-size: 13px;
    height: 110px;
    list-style: none;
    margin: 0;
    min-width: 100%;
    overflow-y: scroll;
    padding: 0 1px;
}

.scrollable-box-both-ways {
    height: 120px;
}

.scrollable-box-both-ways,
.scrollable-box-both-ways-tall,
.scrollable-box-both-ways-taller,
.scrollable-box-both-ways-skyscraper {
    overflow-x: scroll;
}

.scrollable-box-both-ways-tall {
    height: 150px;
}

.scrollable-box-both-ways-taller {
    height: 220px;
}

.scrollable-box-both-ways-skyscraper {
    height: 270px;
}

.scrollable-box-multiple {
    max-height: 130px;
    padding: 4px;
}

.scrollable-box {
    background: #f1f2f5;
    padding: 3px 0 0 6px;
}

.scrollable-box .booking-time-item,
.scrollable-box .booking-table-item {
    cursor: pointer;
    font-size: 12px;
}

.scrollable-box .booking-table-item .table-icon-square {
    display: inline-block;
    height: 10px;
    margin-right: 3px;
    width: 10px;
}

.scrollable-box .booking-table-item .table-icon-circle {
    border-radius: 50%;
    display: inline-block;
    height: 10px;
    margin-right: 3px;
    width: 10px;
}

.scrollable-box .active {
    background-color: #3188fc;
    color: white;
}

.scrollable-box-wrapper table.custom-data-table {
    white-space: nowrap;
    width: 100%;
}

.scrollable-box-wrapper table.custom-data-table .even {
    background: #f4f4f4;
}

.scrollable-box-wrapper table.custom-data-table td {
    border: none;
}

.scrollable-box-both-ways-taller table.custom-data-table tbody td,
.scrollable-box-both-ways-taller table.custom-data-table thead th {
    padding: 5px;
}

.scrollable-box-disabled {
    border-color: #f1f2f5;
    color: #a7a9bc;
    cursor: not-allowed;
    pointer-events: none;
}

.scrollable-box-disabled .active {
    background: #cfced9;
}

.scrollable-popover-body {
    max-height: 300px;
    max-width: 300px;
    white-space: nowrap;
    overflow-y: auto;
}

.customer-row {
    cursor: pointer;
}

.customer-row td,
.customer-booking-row td {
    min-width: 150px;
}

.scrollable-box-wrapper table.dataTable {
    margin: 0;
}

.scrollable-box-wrapper table.dataTable thead th {
    cursor: pointer;
}

.scrollable-box-wrapper table.dataTable thead th,
.scrollable-box-wrapper table.dataTable tbody td {
    padding: 3px 5px;
}

.fileupload-buttonbar .fileinput-button {
    max-height: 29px;
}

.content-box {
    width: 660px;
}

.r-pictures-title {
    clear: both;
}

.guest-database-table tbody td {
    max-width: 200px;
}

.dataTables {
    width: 730px;
}

.status {
    width: 658px;
}

.text {
    clear: left;
}

.navbar {
    padding: 0;
}

.navbar-anchor {
    background: none;
}

.pointer {
    cursor: pointer;
}

.minimizeRestaurantBookingModal,
.closeRestaurantBookingModal {
    position: absolute;
    right: 15px;
}

.minimizeRestaurantBookingModal {
    right: 40px;
    top: 5px;
}

.minimizeRestaurantBookingModal:focus,
.closeRestaurantBookingModal:focus {
    color: black;
    outline: none;
}

.minimized-wrapper {
    background: #f4f4f4;
    border-top: 1px solid #dcdcdc;
    padding: 10px;
    width: calc(100% + 40px);
    transform: translateX(-20px);
}

.minimized-modal {
    background: #60676f;
    color: white;
    display: inline-block;
    margin-right: 5px;
    padding: 4px 10px;
}

.minimized-modal .title {
    display: inline-block;
    font-size: 14px;
    margin: 0 4px 0 0;
    max-height: 1.5em;
}

.minimize-modal-button {
    background: none;
    border: none;
    color: white;
    font-size: 20px;
    height: 26px;
    line-height: 26px;
    padding: 0;
    vertical-align: middle;
    width: 20px;
}

.minimize-modal-button:focus,
.minimize-modal-button:hover {
    color: #abafb3;
    cursor: pointer;
    outline: none;
}

.minimize-modal-button-icon {
    margin-top: -3px;
    vertical-align: middle;
}

.restaurant-booking-modal .modal-tabs {
    align-items: center;
    background: var(--background-color);
    display: flex;
    justify-content: space-between;
    padding-right: 10px;
}

.restaurant-booking-modal.booking-modal .modal-tabs,
.restaurant-booking-modal.booking-modal .modal-body {
    background: #fff;
    border-radius: 4px;
    padding-top: 4px;
}

.restaurant-booking-modal .modal-header {
    border-bottom: none;
}

.restaurant-booking-modal.booking-modal .modal-header {
    padding: 4px;
}

.restaurant-booking-modal.booking-modal .order-tab-modal {
    margin-top: 5px;
}

.restaurant-booking-modal .modal-title {
    color: var(--text-color);
    font-size: 23px;
    font-weight: bold;
    line-height: 1.1;
}

.internal-order-note-title {
    color: var(--text-color);
    font-weight: bold;
    line-height: 1.1;
}

.restaurant-booking-modal .modal-subtitle {
    color: var(--text-color);
    font-size: 14px;
    font-weight: bold;
    line-height: 16px;
}

.restaurant-booking-modal .modal-body {
    padding: 0 15px 5px;
}

.internal-notes-modal-content .modal-body {
    padding: 0 16px 20px;
}

.internal-notes-modal-content .form-group {
    margin-bottom: 1rem;
}

.internal-notes-message {
    position: absolute;
    bottom: 100px;
    right: 300px;
}

.restaurant-booking-modal .nav-tabs .nav-item {
    margin-bottom: 0;
}

.restaurant-booking-modal .nav-tabs .nav-link {
    color: #6b6c7e;
}

.restaurant-booking-modal.booking-modal .nav-tabs {
    border-bottom: none;
}

.restaurant-booking-modal.booking-modal .nav-tabs .nav-link {
    margin-bottom: 0;
}

.restaurant-booking-modal .nav-tabs .nav-link,
.restaurant-booking-modal .nav-tabs .nav-link:hover,
.restaurant-booking-modal .nav-tabs .active {
    border: none;
    font-size: 0.813rem;
    padding: 5px 15px 1px;
}

.restaurant-booking-modal.booking-modal .nav-tabs .nav-link:hover,
.restaurant-booking-modal.booking-modal .nav-tabs .active {
    border-bottom: 4px solid #54a2eb;
}

.restaurant-booking-modal.booking-modal .nav-tabs :first-child .nav-link {
    border-bottom-left-radius: 4px;
}

.restaurant-booking-modal .custom-data-table {
    width: 100%;
}

.restaurant-booking-modal .booking-files-table td:first-child {
    overflow: visible;
    width: 161px;
}

.restaurant-booking-modal .booking-files-table .booking-file-name {
    width: 380px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.restaurant-booking-modal .modal-content-wrapper {
    background: var(--background-color);
    padding: 10px;
    pointer-events: auto;
}

.restaurant-booking-modal .tab-pane.scrollable {
    overflow-x: auto;
}

.restaurant-booking-modal .modal-content,
.guest-chat-day-view-modal .modal-content {
    border: 10px solid var(--background-color);
    border-radius: 0.3rem;
    box-sizing: border-box;
    flex: 1;
}

.restaurant-booking-modal.booking-modal .modal-content {
    background: var(--background-color);
}

.internal-product-category-modal .modal-content {
    background: white;
    border: 8px solid #e4e3ea;
    border-radius: 0.25rem;
}

.guest-chat-modal-container.background-modal {
    background: white;
    border: 10px solid var(--background-color);
    border-radius: 0.3rem;
    box-sizing: border-box;
    flex: 1;
    position: relative;
    margin: 10px auto;
    min-width: 1190px;
    max-width: 1190px;
    min-height: calc(100% - 3.5rem);
    max-height: calc(100% - 3.5rem);
}

.guest-chat-modal-container-wrapper {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1049;
    width: 100%;
    height: 100%;
    overflow: hidden;
    outline: 0;
}

.booking-initials-modal.restaurant-booking-modal .modal-body {
    padding-top: 10px;
}

.booking-initials-modal.restaurant-booking-modal .modal-body label {
    color: #000;
    font-weight: bold;
}

.booking-initials-modal.restaurant-booking-modal .modal-header {
    border-bottom: 1px solid #dee2e6;
}

.booking-initials-modal.restaurant-booking-modal .modal-header .close {
    color: var(--text-color);
}

.booking-initials-modal.restaurant-booking-modal .modal-content {
    border-top: 3px solid #589ee9;
    border-left: none;
    border-bottom: none;
    border-right: none;
    border-top-left-radius: unset;
    border-top-right-radius: unset;
}

.booking-initials-modal.restaurant-booking-modal .modal-footer {
    border-top: none;
    padding: 10px;
}

.booking-initials-modal.restaurant-booking-modal .nav-tabs .nav-item {
    margin-bottom: -1px;
}

.restaurant-booking-modal .close {
    opacity: 1;
}

.restaurant-booking-modal-footer {
    margin-top: 15px;
}

.internal-order-window-footer {
    background: #e4e6ea;
    padding: 0;
}

.internal-order-note-footer {
    background: #fff;
    margin-top: 0;
}

.internal-order-footer-container {
    background-color: #fff;
    border-radius: 4px;
    padding: 10px 15px;
    margin-bottom: -13px;
}

.booking-files-footer-container {
    position: absolute;
    border-top: 1px solid #eee;
    bottom: 10px;
    width: 100%;
    padding: 8px 15px;
}

.modal-footer.internal-order-window-footer,
.modal-footer.internal-order-note-footer {
    border-top: none;
}

.restaurant-booking-modal-footer .custom-button {
    margin: 1px;
    min-width: 140px;
}

.internal-order-window-footer .custom-button,
.internal-order-note-footer .custom-button {
    margin: 1px;
    min-width: 83px;
    height: 38px;
    padding: 8px 20px;
    font-size: 14px;
    color: var(--text-color);
}

.internal-order-note-footer .custom-button.save-note-button {
    min-width: 71px;
    color: #fff;
}

.internal-order-window-footer .custom-button.save-booking-order-tab {
    min-width: 125px;
    color: #fff;
}

.internal-products-row {
    border-bottom: 2px solid #ccc;
}

.internal-products-window-row {
    border-bottom: 7px solid #e4e3ea;
    display: flex;
    justify-content: space-between;
    gap: 8px;
    background-color: #e4e3ea;
    margin-top: -9px;
}

.order-tab-modal {
    background-color: #e4e3ea;
}

.internal-products-wrapper {
    height: 170px;
    overflow-y: scroll;
}

.internal-products-window-wrapper {
    height: 280px;
    overflow-y: auto;
    flex: 1;
    background-color: #fff;
    border-radius: 4px;
}

.custom-scroll-bar::-webkit-scrollbar-track {
    margin-right: 10px;
}

.internal-products-categories,
.internal-products,
.internal-order-items,
.internal-order-window-items {
    list-style: none;
    margin: 0;
    padding: 0;
}

.internal-products-categories li,
.internal-products li {
    align-items: center;
    border-bottom: 1px solid #ccc;
    display: flex;
    padding: 5px;
    height: 39px;
}

.internal-order-items li {
    align-items: flex-start;
    border-bottom: 1px solid #ccc;
    display: flex;
    padding: 5px;
}

.internal-order-window-items li {
    align-items: flex-start;
    border-bottom: 1px solid #ccc;
    display: flex;
    padding: 4px;
}

.internal-product-note {
    white-space: pre-line;
}

.internal-products-categories li:last-child,
.internal-products li:last-child,
.internal-order-items li:last-child {
    border-bottom: none;
}

.internal-product-title,
.internal-product-note,
.internal-product-info {
    flex: 1;
}

.internal-product-window-title {
    flex: 1;
}

.internal-product-window-info {
    flex: 0.9;
}

.internal-product {
    display: block;
    flex: 1;
}

.internal-order-items-row {
    height: 380px;
    overflow-y: scroll;
    margin-bottom: 69px;
    background-color: #fff;
}

.internal-order-items-row.nwb-order-tab {
    overflow-y: auto;
}

.internal-order-items-row .custom-control.custom-checkbox {
    z-index: auto;
}

.internal-order-price-row {
    background: var(--background-color);
    bottom: 0;
    left: 0;
    padding: 10px;
    position: absolute;
    right: 0;
}

.internal-order-price-window-row {
    border-top: 2px solid #e4e6ea;
    border-bottom: 7px solid #e4e6ea;
    background: #e4e6ea;
    bottom: 59px;
    left: 0;
    position: absolute;
    right: 0;
    z-index: 1;
}

.internal-order-price-container {
    background: #fff;
    border-radius: 4px;
    padding: 10px;
}

.internal-order-price-div {
    width: 245px;
}

.internal-order-price-row .form-control[readonly] {
    background: #f1f2f5;
}

.internal-order-price-window-row .form-control[readonly] {
    background: #f1f2f5;
    height: 22px;
    font-weight: 500;
    font-size: 14px;
    color: var(--text-color);
}

.order-item-price,
.order-item-quantity {
    width: 100px;
}

.order-item-window-price,
.order-item-window-quantity,
.order-item-window-note {
    width: 82px;
    height: 26px;
    padding: 8px 20px;
    font-size: 14px;
    color: #717f8d;
}

.order-item-window-note,
.order-item-window-note:focus {
    white-space: nowrap;
    text-overflow: ellipsis;
}

.internal-order-header span {
    display: inline-block;
    font-weight: bold;
    padding: 5px;
}

.internal-order-header-order {
    width: 760px;
}

.internal-order-header-price {
    width: 100px;
}

.internal-order-header-quantity {
    width: 230px;
}

.internal-order-item-handle {
    cursor: pointer;
}

.internal-order-header-window-order {
    width: 769px;
}

.internal-order-header-window-price {
    width: 86px;
}

.internal-order-header-window-quantity {
    width: 90px;
}

.internal-order-header-window-note {
    width: 100px;
}

.internal-order-item-window-handle {
    cursor: pointer;
    padding: 4px;
}

.draggable-product-category-div,
.draggable-product-div {
    cursor: pointer;
}

.draggable-product-category-div img,
.draggable-product-div img {
    margin-top: 7px;
}

.static-footer .btn:disabled {
    background: #f7f7f7;
    border-color: #e8e9ec;
    color: #c3c8cd;
}

.static-footer .btn-default {
    background: #fff;
    border-color: #cdced9;
    color: #74818f;
    font-weight: 600;
}

.static-footer .btn-default:focus {
    background: #cdced9;
    box-shadow: none;
}

.static-footer .btn-primary {
    background: #589ee9;
    border-color: #589ee9;
}

.static-footer .btn-primary:focus {
    background: #488ee9;
    border-color: #488ee9;
    box-shadow: none;
}

.guest-database-index .btn-with-icon,
.static-footer .btn-with-icon,
.guest-database-modal .btn-with-icon {
    background: transparent;
    border-color: transparent;
    padding: 0;
}

.guest-database-index .btn-with-icon.no-functionality {
    display: none;
}

.static-footer .listing-footer-separator {
    background: #dcdcdc;
    display: inline-block;
    height: 33px;
    margin: 0 3px;
    vertical-align: middle;
    width: 1px;
}

.footer-tab-actions {
    display: inline-block;
}

.guest-database-index .btn-with-icon img,
.static-footer .btn-with-icon img,
.guest-database-modal .btn-with-icon img {
    height: 30px;
}

.static-footer .dropdown-menu {
    padding: 0;
}

.static-footer .dropdown-item {
    border-bottom: 1px solid #e7e7ed;
    color: #303b45;
    cursor: pointer;
    font-size: 14px;
    padding: 5px 10px;
}

.static-footer .extra-menu .dropdown-item {
    padding: 8px 16px;
}

.static-footer .extra-menu .dropdown-item:hover {
    background: #f0f5ff;
}

.static-footer .status-icon {
    height: 30px;
    margin-right: 5px;
}

.static-footer .dropdown-item:active {
    background: white;
    color: #000;
}

.static-footer .dropdown-item:last-child {
    border-bottom: none;
}

.bookings-table-tabs .nav-link {
    background: transparent;
    color: black;
    cursor: pointer;
    padding-bottom: 2px;
    padding-top: 2px;
}

.top-modal-button {
    color: var(--text-color);
    font-size: 20px;
}

.no-pad {
    padding: 0;
}

.lpad-20 {
    padding-left: 20px;
}

.lpad-5 {
    padding-left: 5px;
}

.lpad-0 {
    padding-left: 0;
}

.rpad-5 {
    padding-right: 5px;
}

.lrpad-5 {
    padding-left: 5px;
    padding-right: 5px;
}

.lpad-10 {
    padding-left: 10px;
}

.rpad-0 {
    padding-right: 0;
}

.rpad-10 {
    padding-right: 10px;
}

.lpad-30 {
    padding-left: 30px;
}

.rpad-30 {
    padding-right: 30px;
}

.lrpad-15 {
    padding-left: 15px;
    padding-right: 15px;
}

.align-center {
    text-align: center;
}

.align-right {
    text-align: right;
}

.align-left {
    text-align: left;
}

.no-border {
    border: none;
}

.mt-10 {
    margin-top: 10px;
}

.mt-20 {
    margin-top: 20px;
}

.mt-30 {
    margin-top: 30px;
}

.mt-35 {
    margin-top: 35px;
}

.mt-50 {
    margin-top: 50px;
}

.mb-30 {
    margin-bottom: 30px;
}

.mb-20 {
    margin-bottom: 20px;
}

.mb-0 {
    margin-bottom: 0;
}

.pt-25 {
    padding-top: 25px;
}

.pr-70 {
    padding-right: 70px;
}

.cursor-pointer {
    cursor: pointer;
}

.reply-text {
    background-color: #f2f2f2;
    padding-left: 10px;
    padding-top: 15px;
}

.color-input-wrapper {
    position: relative;
}

.color-input-wrapper input {
    opacity: 0;
    z-index: 0;
}

.color-input-label {
    background: #f1f2f5;
    border: 1px solid #e7e7ed;
    border-radius: 4px;
    cursor: pointer;
    left: 0;
    min-width: 100%;
    padding: 6px;
    position: absolute;
    top: -5px;
    z-index: 1;
}

.color-input-box {
    background: #000;
    display: block;
    height: 18px;
}

.focus-outline-none {
    text-decoration: none;
}

.focus-outline-none:focus {
    box-shadow: none;
    outline: none;
    text-decoration: none;
}

.focus-outline-none:hover {
    text-decoration: none;
}

.initials-wrapper-form {
    min-width: 180px;
    position: relative;
}

.initials-wrapper-form .save-button {
    position: absolute;
    right: 24px;
    top: 50%;
    transform: translateY(-50%);
}

.initials-wrapper-form .close-button {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
}

.initials-wrapper-form input {
    display: inline-block;
    min-width: initial;
    width: 100px;
}

/* Guest database modal */

.guest-database-wrapper {
    height: 560px;
    overflow: auto;
}

.booking-list-wrapper table tr:nth-child(even):not(.active-row),
.guest-database-table tbody tr:nth-child(even):not(.active-row) {
    background: #eaeef2;
}

.guest-database-form .form-label {
    padding-left: 0;
}

.guest-database-form .form-group {
    margin-bottom: 2px;
}

.guest-database-form .form-control {
    padding: 3px 6px;
}

.guest-database-wrapper .guest-database-table {
    margin: 0;
}

.guest-database-wrapper .guest-database-table thead th span,
.guest-database-wrapper .guest-database-table tbody td {
    padding: 2px;
}

.guest-database-form .legend {
    font-weight: bold;
    margin-top: 5px;
}

.guest-database-form .legend img {
    height: auto;
    margin-right: 5px;
    width: 20px;
}

.ui-datepicker .ui-datepicker-header .ui-datepicker-month,
.ui-datepicker .ui-datepicker-header .ui-datepicker-year {
    border: none;
    font-family: Roboto, sans-serif;
    font-weight: bold;
    width: 30%;
}

.guest-database-numbers {
    margin-top: 5px;
}

.guest-database-numbers p {
    font-weight: bold;
    margin-bottom: 5px;
}

.guest-database .form-group-with-checkbox,
.guest-database-modal .form-group-with-checkbox {
    padding-left: 30px;
}

.guest-database .form-group-with-checkbox .custom-checkbox,
.guest-database-modal .form-group-with-checkbox .custom-checkbox {
    bottom: 0;
    left: 0;
    position: absolute;
}

.guest-database-modal .guest-status-icon,
.guest-database-wrapper .guest-status-icon {
    height: 20px;
    width: auto;
    margin-top: -5px;
}

.auditlog-added {
    color: #dc3545;
    font-weight: bold;
}

.auditlog-missing {
    color: #198754;
    font-weight: bold;
}

/* Search booking modal */

.search-booking-wrapper {
    height: 160px;
    overflow: auto;
}

#SearchBookingModal .expanded-modal .first-search-button {
    margin-left: auto;
}

#SearchBookingModal .expanded-modal .mw-160-px {
    max-width: 160px;
}

#searchBookingModalContent .expand-table-button {
    background: #fff;
    border: none;
    position: absolute;
    right: 30px;
    top: 0;
    font-size: 0.75em;
    font-weight: 600;
    z-index: 999; /* z-index is used here to overlay the table header (example: thead.sticky-top) */
    padding: 0 0 2px 3px;
}

#searchBookingModalContent .expand-table-button .fa {
    color: #a7a9bc;
}

#SearchBookingModal .expanded-modal .expand-table-button {
    transform: translate(calc(-1em + 15px), -20px);
    font-size: inherit;
}

#SearchBookingModal .expanded-modal td {
    width: 9.5%;
}

#SearchBookingModal .expanded-modal td:nth-child(1),
#SearchBookingModal .expanded-modal td:nth-child(5),
#SearchBookingModal .expanded-modal td:nth-child(9) {
    width: 0;
    padding-right: 10px;
}

#SearchBookingModal .expanded-modal td:nth-child(6) {
    width: 15%;
}

#SearchBookingModal .expanded-modal td:nth-child(8) {
    width: 28%;
}

#SearchBookingModal #SearchBookingDeleteButton:disabled {
    border: 1px solid #cdced9;
    color: var(--text-color);
    background: #fff;
    opacity: 0.5;
}

#SearchBookingModal .modal-dialog.expanded-modal {
    width: calc(100% - 60px);
    min-width: calc(100% - 60px);
}

.search-booking-modal .modal-dialog {
    height: 730px;
    max-width: 850px;
    width: 850px;
}

.search-booking-form .header,
.guest-database-form .header {
    border-bottom: 1px dotted #e2e7ec;
    font-size: 16px;
    font-weight: bold;
    margin-bottom: 10px;
}

.search-booking-modal .custom-checkbox .form-label {
    font-weight: normal;
}

.search-booking-table tbody tr:nth-child(even) {
    background: #eaeef2;
}

.search-booking-form {
    width: initial;
}

.search-booking-form .form-label {
    padding-left: 0;
}

.search-booking-modal .form-group {
    margin-bottom: 7px;
}

.search-booking-form .form-control {
    padding: 2px 6px;
}

.search-booking-wrapper .search-booking-table {
    margin: 0;
}

.search-booking-wrapper .search-booking-table thead th span,
.search-booking-wrapper .search-booking-table tbody td {
    padding: 3px 2px;
}

.search-booking-table {
    min-width: 100%;
    position: relative;
}

.search-booking-table tbody tr {
    cursor: pointer;
}

.search-booking-modal .btn {
    margin: 0;
}

.search-booking-modal .search-booking-table .odd {
    background: #f5f6f5;
}

.search-booking-modal .search-booking-table .even {
    background: #fff;
}

.search-booking-modal .dataTable thead th {
    border-bottom: 2px solid #e1e1e1;
}

.search-booking-modal .dataTable tbody td {
    border-bottom: none;
}

.search-booking-wrapper .search-booking-table tbody .active-row,
.guest-database-table tbody tr.active-row,
#EditCustomerBookingHistoryTable tbody tr.active-row {
    background: #afcfe9;
}

.paragraph {
    color: #2c3b41;
}

.p-relative {
    position: relative;
}

.flex-between {
    align-items: center;
    display: flex;
    justify-content: space-between;
}

.waiting-reset-button {
    position: absolute;
    right: 8px;
    top: 0;
}

.waiting-booking-modal .scrollable-box-both-ways {
    height: 176px;
}

.edit-guest-modal .scrollable-box-both-ways {
    height: 356px;
}

.edit-guest-modal .dinnerbooking-profile {
    color: #404e5c;
    font-size: 16px;
    position: absolute;
    right: 15px;
    top: -2px;
}

.guest-status-dropdown-button > .fa-chevron-down {
    position: absolute;
    right: 0;
    top: 10px;
}

#RestaurantCustomerVIPS {
    background-color: white;
    max-height: unset;
}

.guest-status-dropdown > ul {
    font-size: 12px;
    list-style: none;
}

.guest-status-dropdown > ul > li:first-child {
    padding-left: 40px;
}

.guest-status-dropdown > ul > li img {
    padding-right: 10px;
}

.guest-status-dropdown > ul > li {
    cursor: default;
}

.guest-status.active,
.no-status-selected.active {
    background-color: #afcfe9;
}

.guest-status-small-title {
    font-size: 12px;
}

/* Book taxi */

.book-taxi-modal .modal-dialog {
    max-width: 600px;
}

/* Close online */

.close-online-modal .modal-dialog {
    max-width: 620px;
}

.close-online-modal .modal-content {
    min-height: 740px;
    background-color: var(--background-color);
    color: var(--text-color);
    font-size: 14px;
}

.close-online-modal .modal-header {
    background-color: #fff;
    border-radius: 5px;
    margin-bottom: 10px;
    font-size: 20px;
}

.close-online-modal #closeOnlineModalContent {
    display: flex;
    flex-direction: column;
    justify-content: stretch;
    width: 100%;
}

.close-online-modal #existing-rules-container {
    height: 188px;
    background-color: #fff;
    margin-bottom: 10px;
    border-radius: 5px;
    padding: 10px;
}

.close-online-modal #rules-list {
    overflow-y: scroll;
    width: 100%;
    -ms-overflow-style: none;
    scrollbar-width: none;
    max-height: calc(100% - 25px);
}

.close-online-modal #rules-list::-webkit-scrollbar {
    display: none;
}

.close-online-modal #edit-rule-container {
    flex-grow: 1;
    background-color: #fff;
    border-radius: 5px;
    padding: 10px;
    display: flex;
    flex-direction: column;
}

.close-online-modal #edit-rule-container .form-textarea {
    height: 60px;
}

.close-type-and-area-container {
    display: flex;
    gap: 20px;
    margin-top: 10px;
}

.close-online-modal .close-system-type-container {
    border: 1px solid #e4e6ea;
    border-radius: 4px;
    padding: 5px;
}

.close-online-modal .close-system-type-container,
.close-online-modal .areas-container {
    height: 110px;
}

.close-online-modal .areas-container {
    overflow-y: auto;
    border: 1px solid #e4e6ea;
    border-radius: 4px;
    padding: 5px;
}

.close-type-and-area-container > * {
    flex: 1 1 0;
}

.close-online-modal .close-interval-container {
    flex-grow: 1;
    display: flex;
    align-items: end;
    border: 1px solid #e4e6ea;
    border-radius: 4px;
    padding: 5px;
    margin-bottom: 5px;
    justify-content: space-between;
}

.close-online-modal span {
    font-weight: 500;
    color: var(--text-color);
    margin-top: 5px;
    margin-bottom: 3px;
}

.close-online-modal #add-rule-header,
.close-online-modal #edit-rule-header,
.close-online-modal #close-online-edit-header,
.close-online-modal #existing-rules-container span {
    font-size: 16px;
}

.close-online-modal .custom-data-table {
    table-layout: fixed;
}

.close-online-modal .custom-data-table td {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-weight: 500;
    padding: 7px 5px;
}

.close-online-modal .custom-data-table td:nth-child(1) {
    width: 30%;
    max-width: 30%;
    color: var(--background-red);
}

.close-online-modal .custom-data-table td:nth-child(2) {
    width: 20%;
    max-width: 20%;
}

.close-online-modal .custom-data-table td:nth-child(3) {
    width: 35%;
    max-width: 35%;
}

.close-online-modal .custom-data-table td:nth-child(4) {
    display: flex;
    justify-content: space-between;
}

.close-online-modal .custom-data-table #edit-close-time {
    margin-right: 15px;
    padding-top: 3px;
}

.close-online-modal .custom-button,
#delete-close-online-modal .custom-button,
.listing-dialog .ui-dialog-buttonpane button.custom-button {
    min-width: 0;
    font-weight: 500;
    width: 83px;
    height: 38px;
    margin: 0.5em 0.4em 0.5em 0;
}

.close-online-modal .custom-button.custom-icon-button,
#delete-close-online-modal .custom-button.custom-icon-button {
    border: none;
    background-color: transparent;
    padding: 3px;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.close-online-modal .custom-button:focus,
#delete-close-online-modal .custom-button:focus {
    border: 3px solid #6c757d50;
}

.close-online-modal .custom-button i,
#delete-close-online-modal .custom-button i {
    font-size: 18px;
    color: var(--text-color);
}

.close-online-modal .edit-icon-button i {
    transform: translate(1px, 1px);
}

.close-online-modal .custom-button:hover,
#delete-close-online-modal .custom-button:hover,
.listing-dialog .ui-dialog-buttonpane button.custom-button:hover {
    background: #cdced9;
    border-color: #cdced9;
}

.close-online-modal .custom-button:active,
#delete-close-online-modal .custom-button:active,
.listing-dialog .ui-dialog-buttonpane button.custom-button:active {
    background: var(--text-color);
    border-color: var(--text-color);
    color: #fff;
}

.close-online-modal .custom-button:active i,
#delete-close-online-modal .custom-button:active i {
    color: #fff;
}

.close-online-modal .custom-button:disabled,
#delete-close-online-modal .custom-button:disabled,
.listing-dialog .ui-dialog-buttonpane button.custom-button:disabled {
    border: 1px solid #51617280;
    color: #516172;
    background: #fff;
    opacity: 0.6;
}

.close-online-modal .custom-button:disabled,
#delete-close-online-modal .custom-button:disabled {
    color: #929da8;
    cursor: pointer;
}

.close-online-modal .custom-button:disabled i,
#delete-close-online-modal .custom-button:disabled i {
    color: #516172;
}

.close-online-modal .custom-button.custom-button-blue,
#delete-close-online-modal .custom-button.custom-button-blue,
.listing-dialog .ui-dialog-buttonpane button.custom-button.custom-button-blue {
    color: #fff;
    background: #54a2eb;
    border: 3px solid #54a2eb;
}

.close-online-modal .custom-button.custom-button-blue:focus,
#delete-close-online-modal .custom-button.custom-button-blue:focus,
.listing-dialog .ui-dialog-buttonpane button.custom-button.custom-button-blue:focus {
    border: 3px solid #86b6fe;
}

.close-online-modal .custom-button.custom-button-blue:hover,
#delete-close-online-modal .custom-button.custom-button-blue:hover,
.listing-dialog .ui-dialog-buttonpane button.custom-button.custom-button-blue:hover {
    background: #478ac8;
    border-color: #478ac8;
}

.close-online-modal .custom-button.custom-button-blue:active,
#delete-close-online-modal .custom-button.custom-button-blue:active,
.listing-dialog .ui-dialog-buttonpane button.custom-button.custom-button-blue:active {
    background: #4382bc;
    border-color: #4382bc;
}

.close-online-modal .custom-button.custom-button-blue:disabled,
#delete-close-online-modal .custom-button.custom-button-blue:disabled,
.listing-dialog .ui-dialog-buttonpane button.custom-button.custom-button-blue:disabled {
    color: #fff;
    background: #54a2eb;
    border-color: #54a2eb;
    opacity: 0.6;
}

.close-online-modal .custom-button.custom-button-red,
#delete-close-online-modal .custom-button.custom-button-red,
.listing-dialog .ui-dialog-buttonpane button.custom-button.custom-button-red {
    color: #fff;
    background: var(--background-red);
    border: 3px solid var(--background-red);
}

.close-online-modal .custom-button.custom-button-red:focus,
#delete-close-online-modal .custom-button.custom-button-red:focus,
.listing-dialog .ui-dialog-buttonpane button.custom-button.custom-button-red:focus {
    border: 3px solid #ea9b9b;
}

.close-online-modal .custom-button.custom-button-red:hover,
#delete-close-online-modal .custom-button.custom-button-red:hover,
.listing-dialog .ui-dialog-buttonpane button.custom-button.custom-button-red:hover {
    background: var(--background-dark-red);
    border-color: var(--background-dark-red);
}

.close-online-modal .custom-button.custom-button-red:active,
#delete-close-online-modal .custom-button.custom-button-red:active,
.listing-dialog .ui-dialog-buttonpane button.custom-button.custom-button-red:active {
    background: var(--background-dark-red);
    border-color: var(--background-dark-red);
}

.close-online-modal .custom-button.custom-button-red:disabled,
#delete-close-online-modal .custom-button.custom-button-red:disabled,
.listing-dialog .ui-dialog-buttonpane button.custom-button.custom-button-red:disabled {
    color: #fff;
    background: var(--background-red);
    border-color: var(--background-red);
    opacity: 0.6;
}

.close-online-modal .alert-info {
    border: none;
}

@media screen and (max-height: 775px) {
    .close-online-modal .modal-content {
        min-height: 680px;
    }

    .close-online-modal .modal-dialog {
        margin-top: 10px;
    }

    .close-online-modal .close-system-type-container,
    .close-online-modal .areas-container {
        height: 90px;
    }

    .close-online-modal #existing-rules-container {
        height: 148px;
    }
}

#delete-close-online-modal .modal-dialog {
    width: 400px;
    height: 128px;
}

#delete-close-online-modal .modal-content {
    border: 8px solid var(--background-color);
}

#delete-close-online-modal .modal-title {
    font-size: 20px;
    color: var(--text-color);
}

/* Custom dual range input selector */
.custom-slider-container {
    width: 100%;
    position: relative;
}

.custom-range-slider {
    position: relative;
    width: calc(100% - 10px);
    height: 6px;
    margin-bottom: 11px;
    margin-left: 5px;
    background-color: #d3d8dd;
    border-radius: 3px;
}

.custom-range-slider input {
    position: absolute;
    width: 100%;
    pointer-events: none;
    -webkit-appearance: none;
    appearance: none;
    background: none;
}

.custom-range-slider input::-webkit-slider-thumb {
    pointer-events: auto;
    -webkit-appearance: none;
    width: 16px;
    height: 16px;
    background: #fff;
    border-radius: 50%;
    cursor: pointer;
    position: relative;
    border: 5px solid var(--background-red);
}

.custom-range-slider #close-online-min-range::-webkit-slider-thumb {
    transform: translate(-2px, -5px);
}

.custom-range-slider #close-online-max-range::-webkit-slider-thumb {
    transform: translate(2px, -5px);
}

.custom-range-slider:hover input::-webkit-slider-thumb {
    border: 5px solid var(--background-dark-red);
}

/*
This is used for firefox thumbs range input.
These selectors should be different for the ones used for chrome.
*/
.custom-range-slider input::-moz-range-thumb {
    pointer-events: auto;
    -webkit-appearance: none;
    width: 6px;
    height: 6px;
    background: #fff;
    border-radius: 50%;
    cursor: pointer;
    position: relative;
    border: 5px solid var(--background-red);
}

.custom-range-slider #close-online-min-range::-moz-range-thumb {
    transform: translate(-2px, -6px);
}

.custom-range-slider #close-online-max-range::-moz-range-thumb {
    transform: translate(2px, -6px);
}

.custom-range-slider:hover input::-moz-range-thumb {
    border: 5px solid var(--background-dark-red);
}

.custom-slider-track {
    position: absolute;
    height: 6px;
    background: var(--background-red);
    top: 50%;
    transform: translateY(-3px);
}

.custom-range-slider:hover .custom-slider-track {
    background: var(--background-dark-red);
}

.close-online-modal .form-check-label,
.close-online-modal .form-check-input {
    cursor: pointer;
}

.flash-message-container {
    position: fixed;
    top: 60px;
    right: 20px;
    width: 360px;
    z-index: 99999;
}

.listing-flash-message {
    padding: 12px 20px;
    background: #fff;
    font-size: 14px;
    font-weight: 500;
    display: flex;
    justify-content: space-between;
    text-align: center;
    border-radius: 4px;
    transition: 0.5s;
    box-shadow: 0 2px 8px 1px #929da880;
    opacity: 0; /* Start hidden */
    gap: 10px;
    transform: translateX(380px); /* Start off-screen */
    margin-bottom: 8px;
    visibility: hidden;
}

.listing-flash-message.show {
    opacity: 1;
    transform: translateX(0); /* Slide in */
    visibility: visible;
}

.listing-flash-message .message {
    text-align: start;
    flex-grow: 1;
    padding-top: 2px;
    font-weight: 400;
}

.flash-message-content {
    flex: 1;
}

.flash-message-main {
    display: flex;
    gap: 10px;
    flex-direction: column;
    align-items: flex-start;
    flex-grow: 1;
}

.flash-message-icon img {
    width: 20px;
    height: 20px;
    display: block;
}

.flash-message-title {
    font-weight: 500;
    font-size: 16px;
    line-height: 1.4;
    color: #303b45;
}

.flash-content-title {
    display: flex;
    gap: 10px;
}

.message {
    font-weight: 400;
    font-size: 16px;
    line-height: 1.4;
    margin-left: 30px;
    color: #303b45;
}

.flash-message-container .close {
    opacity: 1;
}

.edit-buttons,
.save-buttons {
    display: flex;
    height: 31px;
    justify-content: flex-end;
}

.save-buttons button {
    flex: 1;
}

.intervals-wrapper {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100px;
    padding: 0 16px;
}

.intervals-wrapper .bar {
    background: #d5dbe1;
    display: block;
    height: 8px;
    position: relative;
    width: 420px; /* 420 = 5px * 84 time ticks */
}

.intervals-wrapper .bar .interval {
    background: #d72626;
    height: 100%;
    left: 96px;
    position: absolute;
    top: 0;
    width: 96px;
}

.intervals-wrapper .bar .insert-tick,
.intervals-wrapper .bar .remove-tick {
    height: 14px;
    left: 0;
    line-height: 14px;
    position: absolute;
    top: 14px;
    width: 14px;
}

.intervals-wrapper .bar .insert-tick .insert-tick-content,
.intervals-wrapper .bar .remove-tick .remove-tick-content {
    background: #54a2eb;
    border-radius: 3px;
    color: white;
    cursor: pointer;
    font-size: 10px;
    margin-left: -50%;
    position: relative;
    text-align: center;
    width: 100%;
}

.intervals-wrapper .bar .remove-tick .remove-tick-content {
    background: #d72626;
}

.intervals-wrapper .bar .insert-tick .insert-tick-triangle,
.intervals-wrapper .bar .remove-tick .remove-tick-triangle {
    border-color: transparent transparent #54a2eb;
    border-style: solid;
    border-width: 0 4px 4px;
    height: 0;
    left: 50%;
    position: absolute;
    top: -4px;
    transform: translateX(-50%);
    width: 0;
}

.intervals-wrapper .bar .remove-tick .remove-tick-triangle {
    border-color: transparent transparent #d72626;
}

.close-online-modal .time-tick,
.intervals-wrapper .bar .time-tick {
    height: 14px;
    left: 0;
    line-height: 14px;
    position: absolute;
    top: -36px;
    width: 30px;
}

.close-online-modal .time-tick .time-tick-content,
.intervals-wrapper .bar .time-tick .time-tick-content {
    background: #6b6c7e;
    border-radius: 3px;
    color: white;
    cursor: pointer;
    font-size: 10px;
    margin-left: -50%;
    position: relative;
    text-align: center;
    width: 100%;
}

.close-online-modal .time-tick .time-tick-triangle,
.intervals-wrapper .bar .time-tick .time-tick-triangle {
    border-color: #6b6c7e transparent transparent;
    border-style: solid;
    border-width: 4px 4px 0;
    bottom: -4px;
    height: 0;
    left: 50%;
    position: absolute;
    transform: translateX(-50%);
    width: 0;
}

.close-online-modal .time-tick .time-tick-content {
    top: 0;
    padding: 4px 8px;
    background: #181d23;
    color: #fff;
    width: auto;
}

.close-online-modal .time-tick .time-tick-content .time {
    color: #fff;
    font-size: 10px;
    font-weight: 400;
}

.close-online-modal .time-tick .time-tick-triangle {
    border-color: #181d23 transparent transparent;
    border-width: 6px 6px 0;
    bottom: -8px;
}

/* Guests database */

.merge-customers-modal .modal-dialog,
.guest-database-modal .modal-dialog {
    max-width: 1200px;
}

/* Shared style for all modals in NWB */

.nwb-modal .modal-header {
    padding: 15px;
}

.edit-guest-modal.nwb-modal .modal-content,
.add-guest-modal.nwb-modal .modal-content {
    background-color: #e4e3ea;
}

.edit-guest-modal.nwb-modal .box-container,
.edit-guest-modal.nwb-modal .modal-header,
.add-guest-modal.nwb-modal .box-container,
.add-guest-modal.nwb-modal .modal-header {
    background-color: #fff;
    border-radius: 4px;
}

.edit-guest-modal.nwb-modal .custom-badge,
.add-guest-modal.nwb-modal .custom-badge {
    font-size: 12px;
}

.nwb-modal .modal-title {
    font-size: 21px;
}

.nwb-modal .close {
    font-size: 1rem;
}

.nwb-modal .minimizeRestaurantBookingModal .fa {
    margin-top: 2px;
}

.nwb-modal .modal-body {
    padding: 0 0 10px;
}

.nwb-modal-content {
    width: initial;
}

.nwb-modal-content .small-title {
    border-bottom: none;
    color: #272833;
    font-size: 13px;
    font-weight: 500;
    margin-bottom: 4px;
    padding-bottom: 0;
}

.nwb-modal-content .header {
    border-bottom: 1px dotted #e2e7ec;
    font-size: 16px;
    font-weight: bold;
    margin-bottom: 10px;
}

.nwb-modal-content .small-title-underline {
    border-bottom: 1px solid #808080;
    padding-bottom: 3px;
}

.nwb-modal-content .form-group {
    margin-bottom: 2px;
}

.nwb-modal-content .form-control {
    height: 26px;
    line-height: 1.1;
    padding: 3px 10px;
}

.edit-guest-modal.nwb-modal .form-control,
.add-guest-modal.nwb-modal .form-control {
    height: 38px;
    max-height: 38px;
}

.edit-guest-modal.nwb-modal .form-control.form-control-textarea,
.add-guest-modal.nwb-modal .form-control.form-control-textarea {
    height: auto;
    max-height: none;
}

.edit-guest-modal.nwb-modal .form-group,
.add-guest-modal.nwb-modal .form-group {
    margin-bottom: 12px;
}

.nwb-modal-content .form-control-textarea {
    height: auto;
    padding: 5px 6px;
}

.nwb-modal-content select.form-control:not([size], [multiple]) {
    height: 26px;
}

.nwb-modal-content .horizontal-separator {
    background: #d4d4d4;
    height: 1px;
    margin: 2px 0;
    width: 100%;
}

.nwb-modal-content .form-label {
    padding-left: 15px;
}

.nwb-modal-content .form-label-block {
    padding-left: 0;
}

.nwb-modal-content .full-width-table {
    margin: 0;
    min-width: 100%;
    white-space: nowrap;
}

.nwb-modal-content .btn-with-icon {
    color: var(--text-color);
    font-size: 20px;
    padding: 0;
}

.modal-dialog .modal-content .nwb-modal-content .tab-content > .active {
    display: flex;
    flex-grow: 1;
    flex-direction: column;
}

.nwb-modal-footer {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    padding: 0.75rem;
}

/* Headers */

.header {
    color: #516273;
    margin: 0 0 20px;
}

.header .header-title a {
    color: #54a2eb;
}

.header .header-title {
    border: none;
    font-size: 23px;
    font-weight: 700;
    margin: 0;
    padding: 0;
}

.header .header-subtitle {
    border: none;
    font-size: 20px;
    font-weight: 500;
    margin: 0;
    padding: 0;
}

.section-header {
    border-bottom: 1px dashed #d1d8df;
    color: #516273;
    margin: 0 0 20px;
    padding-bottom: 6px;
}

.section-header .header-title {
    font-size: 16px;
    font-weight: 700;
    margin: 0;
    padding: 0;
}

.section-header .header-subtitle {
    font-size: 14px;
    font-weight: 700;
    margin: 0;
    padding: 0;
}

.box-container {
    border: 1px solid #00000021;
    border-radius: 4px;
    margin: 0 15px 20px;
}

.edit-guest-modal.nwb-modal .small-title,
.add-guest-modal.nwb-modal .small-title {
    font-size: 16px;
    color: #404e5c;
}

.edit-guest-modal.nwb-modal .modal-body,
.add-guest-modal.nwb-modal .modal-body {
    padding-top: 8px;
}

.edit-guest-modal.nwb-modal .modal-body .absolute-note-input-wrapper,
.add-guest-modal.nwb-modal .modal-body .absolute-note-input-wrapper {
    border-radius: 0.25rem;
}

.edit-guest-modal.nwb-modal .box-container,
.add-guest-modal.nwb-modal .box-container {
    border: none;
    margin: 0;
    padding: 16px;
}

.edit-guest-modal.nwb-modal .guest-status-small-title,
.edit-guest-modal.nwb-modal .form-label,
.add-guest-modal.nwb-modal .guest-status-small-title,
.add-guest-modal.nwb-modal .form-label {
    color: #404e5c;
    font-size: 14px;
}

.edit-guest-modal.nwb-modal .ts-control,
.edit-guest-modal.nwb-modal .customer-tag-wrapper,
.edit-guest-modal.nwb-modal .guest-status-dropdown-button,
.add-guest-modal.nwb-modal .ts-control,
.add-guest-modal.nwb-modal .customer-tag-wrapper,
.add-guest-modal.nwb-modal .guest-status-dropdown-button,
#GuestDatabaseModal .customer-tag-wrapper {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='512'%20height='512'%20viewBox='0%200%20512%20512'%3E%3Cpath%20class='lexicon-icon-outline'%20d='M347.913%20199.336l-81.538-85c-5.413-5.642-14.188-5.642-19.6%200l-81.538%2085c-8.731%209.101-2.548%2024.664%209.8%2024.664h163.077c12.348%200%2018.531-15.563%209.8-24.664zM165.236%20312.664l81.538%2085c5.412%205.642%2014.188%205.642%2019.6%200l81.538-85c8.731-9.101%202.548-24.664-9.8-24.664H175.035c-12.347%200-18.531%2015.563-9.8%2024.664z'%20fill='%236B6C7E'/%3E%3C/svg%3E");
    background-position: right 5% center;
    background-repeat: no-repeat;
    background-size: 1.1em auto;
    background-color: #f1f2f5;
    border: none;
    border-radius: 0.25rem;
    position: relative;
}

.edit-guest-modal.nwb-modal .ts-control,
.add-guest-modal.nwb-modal .ts-control {
    background-size: 1.5em auto;
    height: 38px;
    border: none;
}

.edit-guest-modal.nwb-modal .disabled .ts-control,
.add-guest-modal.nwb-modal .disabled .ts-control {
    opacity: 1;
    background-color: #d3d8dd;
    color: var(--text-color);
}

.edit-guest-modal.nwb-modal .disabled *,
.add-guest-modal.nwb-modal .disabled * {
    cursor: not-allowed !important;
}

.edit-guest-modal.nwb-modal .customer-tag-wrapper .short-tags,
.add-guest-modal.nwb-modal .customer-tag-wrapper .short-tags,
#GuestDatabaseModal .customer-tag-wrapper .short-tags {
    height: 38px;
    display: flex;
    align-items: center;
    margin-left: 10px;
}

.edit-guest-modal.nwb-modal .guest-status-message,
.edit-guest-modal.nwb-modal .customer-tag-wrapper .short-tags .placeholder,
.add-guest-modal.nwb-modal .guest-status-message,
.add-guest-modal.nwb-modal .customer-tag-wrapper .short-tags .placeholder {
    color: #717f8d;
    font-size: 14px;
}

.edit-guest-modal.nwb-modal .customer-tag-wrapper .short-tags .custom-badge,
.add-guest-modal.nwb-modal .customer-tag-wrapper .short-tags .custom-badge,
#GuestDatabaseModal .customer-tag-wrapper .short-tags .custom-badge {
    margin-right: 2px;
}

.edit-guest-modal.nwb-modal .customer-tag-wrapper .tags {
    top: 38px;
    width: 354px;
}

.add-guest-modal.nwb-modal .customer-tag-wrapper .tags {
    top: 38px;
    width: 448px;
}

.edit-guest-modal.nwb-modal .customer-tag-wrapper .tags .tag-checkbox .custom-control-label::before,
.edit-guest-modal.nwb-modal .customer-tag-wrapper .tags .tag-checkbox .custom-control-label::after,
.edit-guest-modal.nwb-modal .customer-tag-wrapper .tags .tag-checkbox .form-checkbox-input,
.add-guest-modal.nwb-modal .customer-tag-wrapper .tags .tag-checkbox .custom-control-label::before,
.add-guest-modal.nwb-modal .customer-tag-wrapper .tags .tag-checkbox .custom-control-label::after,
.add-guest-modal.nwb-modal .customer-tag-wrapper .tags .tag-checkbox .form-checkbox-input,
#GuestDatabaseModal .customer-tag-wrapper .tags .tag-checkbox .custom-control-label::before,
#GuestDatabaseModal .customer-tag-wrapper .tags .tag-checkbox .custom-control-label::after,
#GuestDatabaseModal .customer-tag-wrapper .tags .tag-checkbox .form-checkbox-input {
    display: none;
}

.edit-guest-modal.nwb-modal .customer-tag-wrapper .tags .tag-checkbox,
.add-guest-modal.nwb-modal .customer-tag-wrapper .tags .tag-checkbox,
#GuestDatabaseModal .customer-tag-wrapper .tags .tag-checkbox {
    display: inline-block;
}

.edit-guest-modal.nwb-modal .customer-tag-wrapper .tags .custom-badge img,
.add-guest-modal.nwb-modal .customer-tag-wrapper .tags .custom-badge img {
    margin-left: 4px;
}

#GuestDatabaseModal .customer-tag-wrapper .tags .custom-badge img {
    margin-left: 4px;
    margin-bottom: 3px;
}

#search-customer-tags-dialog {
    margin-top: 8px;
}

.edit-guest-modal.nwb-modal .customer-tag-wrapper .tags .custom-badge img.add,
.add-guest-modal.nwb-modal .customer-tag-wrapper .tags .custom-badge img.add,
#GuestDatabaseModal .customer-tag-wrapper .tags .custom-badge img.add {
    transform: rotate(45deg);
}

.edit-guest-modal.nwb-modal .split,
.add-guest-modal.nwb-modal .split {
    display: flex;
    align-items: center;
}

.edit-guest-modal.nwb-modal .split .form-control,
.add-guest-modal.nwb-modal .split .form-control {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.edit-guest-modal.nwb-modal .split .control-icon-button,
.add-guest-modal.nwb-modal .split .control-icon-button {
    border: none;
    background-color: #e4e6ea;
    padding: 0;
    width: 41px;
    height: 38px;
    border-top-right-radius: 0.25rem;
    border-bottom-right-radius: 0.25rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.edit-guest-modal.nwb-modal .split .control-icon-button:hover,
.add-guest-modal.nwb-modal .split .control-icon-button:hover {
    background-color: #ced4da;
}

.edit-guest-modal.nwb-modal .minimize-note-button,
.add-guest-modal.nwb-modal .minimize-note-button {
    right: 28px;
    top: 20px;
}

.edit-guest-modal.nwb-modal .absolute-note-input-wrapper,
.add-guest-modal.nwb-modal .absolute-note-input-wrapper {
    position: relative;
}

.edit-guest-modal.nwb-modal .fa,
.add-guest-modal.nwb-modal .fa {
    color: var(--text-color);
}

div.cke,
.box-container .form-control,
.box-container .input-group-text {
    border-color: #f1f2f5;
}

div.cke:hover,
.custom-select2 .select2-container--default .select2-selection--multiple:hover,
.box-container .form-control:hover {
    border-color: var(--border-color);
}

div.cke.input-focused,
.custom-select2 .select2-container--default.select2-container--focus .select2-selection--multiple,
.box-container .form-control:focus {
    background-color: #eef6fd;
    border-color: #bbdaf7;
    box-shadow: 0 0 0 0.2rem rgb(0 123 255 / 25%);
}

.edit-guest-modal-content .custom-switch,
.add-guest-modal-content .custom-switch,
.box-container .custom-switch {
    padding-left: 2.25rem;
    height: 1rem;
}

.edit-guest-modal-content .inline-label,
.add-guest-modal-content .inline-label {
    display: flex;
    align-items: center;
    justify-content: center;
}

.edit-guest-modal-content .inline-label .form-label,
.add-guest-modal-content .inline-label .form-label {
    padding-right: 8px;
}

.edit-guest-modal-content .custom-switch .custom-control-input,
.add-guest-modal-content .custom-switch .custom-control-input,
.box-container .custom-switch .custom-control-input {
    width: 32px;
    top: 2px;
    z-index: 1;
}

.edit-guest-modal-content .custom-switch .custom-control-label,
.add-guest-modal-content .custom-switch .custom-control-label,
.box-container .custom-switch .custom-control-label {
    display: inline-block;
}

.edit-guest-modal-content .custom-control-label::before,
.add-guest-modal-content .custom-control-label::before,
.box-container .custom-switch .custom-control-label::before {
    width: 2rem;
    height: calc(0.85rem + 4px);
    background-color: #929da8;
}

.edit-guest-modal-content .custom-switch .custom-control-input:checked ~ .custom-control-label::before,
.add-guest-modal-content .custom-switch .custom-control-input:checked ~ .custom-control-label::before,
.box-container .custom-switch .custom-control-input:checked ~ .custom-control-label::before {
    background-color: var(--text-color);
    border-color: var(--text-color);
}

.edit-guest-modal-content .custom-control-input:checked ~ .custom-control-label::after,
.add-guest-modal-content .custom-control-input:checked ~ .custom-control-label::after,
.box-container .custom-switch .custom-control-input:checked ~ .custom-control-label::after {
    transform: translateX(1rem);
}

.edit-guest-modal-content .custom-control-input:hover ~ .custom-control-label::before,
.add-guest-modal-content .custom-control-input:checked ~ .custom-control-label::after,
.box-container .custom-switch .custom-control-input:hover ~ .custom-control-label::before {
    background-color: #404e5c;
    border-color: var(--text-color);
}

.edit-guest-modal-content .custom-switch .custom-control-label::after,
.add-guest-modal-content .custom-control-input:checked ~ .custom-control-label::after,
.box-container .custom-switch .custom-control-label::after {
    top: calc(0.25rem + 2px);
    background-color: #fff;
}

.edit-guest-modal-content .maximize-table-button,
.add-guest-modal-content .maximize-table-button {
    position: absolute;
    top: 0;
    right: 1.5rem;
    font-size: 0.75em;
    font-weight: 600;
    border: none;
    background-color: #fff;
}

.edit-guest-modal-content .absolute-note-input-wrapper,
.add-guest-modal-content .absolute-note-input-wrapper {
    display: flex;
    flex-direction: column;
}

.edit-guest-modal-content .expanded-table-overflow-wrapper {
    max-width: 100%;
    width: 100%;
    overflow: auto;
    flex: 1;
}

.edit-guest-modal-content .expanded-table-overflow-wrapper .custom-data-table {
    margin-top: 0;
}

.box-header {
    color: #212529;
    font-size: 16px;
    line-height: 23px;
    padding: 8px 16px 9px;
    background-color: #f7f7f7;
    border-bottom: 1px solid #00000014;
    border-radius: 4px 4px 0 0;
}

.breadcrumbs {
    background-color: transparent;
    border-radius: 0.25rem;
    display: flex;
    flex-wrap: wrap;
    list-style: none;
    margin-bottom: 0;
    padding: 0;
}

.breadcrumb-item {
    font-size: 0.875rem;
    margin-right: 0.5em;
    position: relative;
}

.breadcrumb-item + .breadcrumb-item {
    padding-left: 1em;
}

.breadcrumb-item + .breadcrumb-item::before {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='512'%20height='512'%20viewBox='0%200%20512%20512'%3E%3Cpath%20class='lexicon-icon-outline'%20d='M396.394%20255.607a28.207%2028.207%200%200%200-8.272-19.111L160.901%209.275c-11.026-11.059-28.94-11.059-39.999%200-11.058%2011.026-11.058%2028.941%200%2039.999l206.333%20206.333L120.902%20461.94c-11.058%2011.058-11.058%2028.973%200%2039.999%2011.059%2011.059%2028.972%2011.059%2039.999%200l227.221-227.221a28.196%2028.196%200%200%200%208.272-19.111z'%20fill='%236B6C7E'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: 100%;
    content: "";
    display: block;
    float: left;
    height: 0.6em;
    left: 0;
    margin-top: -0.3em;
    padding: 0;
    position: absolute;
    top: 50%;
    width: 0.6em;
}

.breadcrumb-link {
    color: #64a5eb;
    display: block;
    text-decoration: underline;
}

.breadcrumb-link:hover {
    color: #64a5eb;
}

.breadcrumbs .active {
    color: #2c3b41;
}

/* Time Picker */

.ui-widget-content .ui_tpicker_hour {
    height: 20px;
}

.ui-widget-content .ui_tpicker_hour_slider {
    overflow: hidden;
}

.ui-widget-content .ui_tpicker_hour_slider .ui-slider-handle {
    background: #6490e3;
}

/* Form Inputs */

.form-group {
    margin-bottom: 1.5rem;
    position: relative;
}

.inline-form-group {
    display: inline-block;
}

.form-group-ckeditor {
    min-height: 298px;
}

.form-group-ckeditor .cke {
    border-radius: 0.25rem;
}

.form-group-ckeditor .cke_top,
.form-group-ckeditor .cke_bottom {
    background: #f1f2f5;
}

.error {
    color: #dd1e0e;
}

.success {
    color: #287d3d;
}

.form-group .error-message {
    color: #dd1e0e;
    font-weight: 500;
    margin-top: 4px;
}

.form-label {
    color: #272833;
    cursor: pointer;
    font-size: 0.875rem;
    font-weight: 600;
    margin-bottom: 0.25rem;
    max-width: 100%;
    position: relative;
    word-wrap: break-word;
}

.cke_inner {
    border-radius: 0.25rem;
}

.cke_inner .cke_top {
    background-color: #e9ecef;
    border-bottom: none;
    border-top-left-radius: 0.25rem;
    border-top-right-radius: 0.25rem;
}

.cke_inner .cke_bottom {
    background-color: #f1f2f5;
    border-bottom-left-radius: 0.25rem;
    border-bottom-right-radius: 0.25rem;
    border-top: none;
}

.cke_bottom .cke_resizer {
    border-color: transparent #506273 transparent transparent;
}

div.cke,
.form-control {
    background-clip: border-box;
    background-color: #f1f2f5;
    border-radius: 0.25rem;
    box-shadow: none;
    color: #272833;
    display: block;
    font-size: 0.8125rem;
    line-height: 1.5;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.form-control {
    border: 0.0625rem solid #e7e7ed;
    padding: 0.3rem 1rem;
}

.form-control[disabled] {
    border-color: #f1f2f5;
    color: #a7a9bc;
    cursor: not-allowed;
}

.edit-guest-modal.nwb-modal .form-control[disabled],
.add-guest-modal.nwb-modal .form-control[disabled] {
    border: none;
    color: var(--text-color);
    background-color: #d3d8dd;
    max-height: 38px;
}

.form-control[readonly] {
    background: #dcdcdc;
}

.form-control-info {
    display: flex;
    font-size: 14px;
    justify-content: space-between;
    margin-top: 5px;
    color: #212529;
}

.internal-order-label {
    line-height: 18px;
    font-weight: 500;
    color: var(--text-color);
}

.mtop5 {
    margin-top: 5px;
}

.form-textarea {
    height: auto;
}

.select2-selection--multiple,
.form-select {
    -moz-appearance: none;
    -webkit-appearance: none;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='512'%20height='512'%20viewBox='0%200%20512%20512'%3E%3Cpath%20class='lexicon-icon-outline'%20d='M347.913%20199.336l-81.538-85c-5.413-5.642-14.188-5.642-19.6%200l-81.538%2085c-8.731%209.101-2.548%2024.664%209.8%2024.664h163.077c12.348%200%2018.531-15.563%209.8-24.664zM165.236%20312.664l81.538%2085c5.412%205.642%2014.188%205.642%2019.6%200l81.538-85c8.731-9.101%202.548-24.664-9.8-24.664H175.035c-12.347%200-18.531%2015.563-9.8%2024.664z'%20fill='%236B6C7E'/%3E%3C/svg%3E");
    background-position: right 0.5em center;
    background-repeat: no-repeat;
    background-size: 1.5em auto;
    padding-right: 2em;
}

select.form-control:not([size], [multiple]) {
    height: inherit;
}

.form-time {
    align-items: center;
    display: flex;
    justify-content: space-between;
}

.form-time .form-select {
    max-width: 46%;
    min-width: inherit;
}

.form-select-multiple {
    font-size: 14px;
    padding: 4px;
}

.dropdown-menu {
    z-index: 1040;
}

.custom-control {
    display: block;
    min-height: 1.5rem;
    padding-left: 0;
    position: relative;
}

.custom-control label {
    cursor: pointer;
    display: inline-block;
    font-size: 1rem;
    margin-bottom: 0;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -webkit-user-select: none;
    user-select: none;
}

.form-checkbox-input {
    cursor: pointer;
    height: 1.0625rem;
    left: 0;
    min-width: initial;
    opacity: 0;
    position: absolute;
    top: 0.2188rem;
    width: 1.0625rem;
    z-index: 0;
}

#GuestDatabaseForm .form-checkbox-input {
    opacity: 1;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.form-checkbox-input:disabled {
    opacity: 0;
}

.custom-control-label {
    font-size: 0.875rem;
    line-height: 1.5rem;
}

.custom-control-label::before {
    background-color: #fff;
    border: 0.0625rem solid #cdced9;
    border-radius: 0.125rem;
    box-shadow: none;
    content: "";
    display: block;
    float: left;
    font-size: 1.0625rem;
    left: 0;
    height: 1.0625rem;
    width: 1.0625rem;
    pointer-events: none;
    position: relative;
    top: 0.2188rem;
    user-select: none;
}

.custom-radio .custom-control-label::before {
    border-radius: 50%;
}

.custom-control-label::after {
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 50% 50%;
    content: "";
    cursor: pointer;
    display: block;
    height: 1.0625rem;
    left: 0;
    position: absolute;
    top: 0.2188rem;
    width: 1.0625rem;
}

#GuestDatabaseForm .form-control.checkbox-filter {
    outline: 0;
    padding: 0;
    border: 0;
    background: transparent;
    height: 1.0625rem;
    width: 1.0625rem;
}

#GuestDatabaseCloseModal:focus,
#GuestDatabaseModalClose:focus {
    outline: 0;
    border-color: #80acff;
    box-shadow: 0 0 0 0.2rem rgb(128 172 255 / 75%);
}

#GuestDatabaseModalClose {
    padding: 0.2rem;
}

#GuestDatabaseCloseModal:focus {
    background-color: #f0f5ff;
    color: #4d4d4d;
    border-color: #80acff;
    outline: 0;
}

.custom-control-label-text {
    padding-left: 0.5rem;
}

.custom-checkbox .form-checkbox-input:checked ~ .custom-control-label::before,
.custom-radio .form-checkbox-input:checked ~ .custom-control-label::before {
    background-color: #5c9ae7;
}

.custom-checkbox .form-checkbox-input:checked:disabled ~ .custom-control-label::before,
.custom-radio .form-checkbox-input:checked:disabled ~ .custom-control-label::before {
    background-color: #9fc2e7;
}

.form-checkbox-input:checked ~ .custom-control-label::before {
    background-color: #5c9ae7;
    border-color: #5c9ae7;
    box-shadow: none;
    color: #fff;
}

.form-checkbox-input:checked:disabled ~ .custom-control-label::before {
    background-color: #9fc2e7;
    border-color: #9fc2e7;
    box-shadow: none;
    color: #fff;
}

.custom-checkbox .form-checkbox-input:checked ~ .custom-control-label::after {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='512'%20height='512'%20viewBox='0%200%20512%20512'%3E%3Cpath%20class='lexicon-icon-outline'%20d='M502.091%2060.993c-9.909-9.91-25.962-9.91-35.843%200L129.26%20397.981%2045.752%20314.53c-9.881-9.909-25.962-9.909-35.843%200-9.909%209.909-9.909%2025.962%200%2035.843l98.257%2098.257c2.608%202.608%205.679%204.433%208.924%205.679%204.028%202.464%208.403%204.115%2012.952%204.115%206.49%200%2012.981-2.464%2017.936-7.418L502.09%2096.865c9.909-9.909%209.909-25.962%200-35.871v-.001z'%20fill='%23FFF'/%3E%3C/svg%3E");
    background-size: 60%;
    left: -1.0625rem;
    top: 50%;
    transform: translateY(-50%);
}

.custom-radio .form-radio-input {
    display: inline-block;
    min-width: inherit;
    width: auto;
}

.form-control:focus,
#GuestDatabaseForm .checkbox-filter:focus:not(:checked) ~ .custom-control-label::before {
    background-color: #f0f5ff;
    border-color: #80acff;
    outline: 0;
}

.inline-link {
    color: #54a2eb;
    display: inline-block;
    font-size: 0.8125rem;
    margin-right: 10px;
    text-decoration: underline;
}

/* Select2 */

.custom-select2 .select2-selection--single .select2-selection__arrow {
    -moz-appearance: none;
    -webkit-appearance: none;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='512'%20height='512'%20viewBox='0%200%20512%20512'%3E%3Cpath%20class='lexicon-icon-outline'%20d='M347.913%20199.336l-81.538-85c-5.413-5.642-14.188-5.642-19.6%200l-81.538%2085c-8.731%209.101-2.548%2024.664%209.8%2024.664h163.077c12.348%200%2018.531-15.563%209.8-24.664zM165.236%20312.664l81.538%2085c5.412%205.642%2014.188%205.642%2019.6%200l81.538-85c8.731-9.101%202.548-24.664-9.8-24.664H175.035c-12.347%200-18.531%2015.563-9.8%2024.664z'%20fill='%23FFF'/%3E%3C/svg%3E");
    background-position: right 0.1em center;
    background-repeat: no-repeat;
    background-size: 1.2em auto;
    height: 100%;
    padding-right: 2em;
    right: 0;
    top: 0;
}

.custom-select2 .select2-selection__arrow b {
    display: none;
}

.custom-select2 .select2-selection--single {
    background: #f1f2f5;
    border: 1px solid #e7e7ed;
}

.custom-select2 .select2-selection--single .select2-selection__rendered {
    font-size: 13px;
    line-height: 18px;
    padding: 0.3rem 1.2rem 0.3rem 1rem;
}

.custom-select2 .select2-container .select2-selection--multiple {
    min-height: 30.59px;
}

.custom-select2 .select2-container--default .select2-selection--multiple {
    background-color: #f1f2f5;
    border-color: transparent;
    border-style: solid;
    border-width: 1px;
}

.select2-container--default .select2-results__option,
.select2-container--default .select2-search--dropdown .select2-search__field {
    font-size: 13px;
    padding: 4px;
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background: #e5eff9;
    color: inherit;
}

.select2-container--default .select2-results__option[aria-selected="true"] {
    background-color: inherit;
}

.select2-container--default .select2-results__option[aria-selected="true"]:hover {
    background-color: #e5eff9;
}

.select2-container--default .select2-results__option[aria-selected="true"]::before {
    content: "✔";
    color: #54a2eb;
    margin-right: 8px;
    display: inline-block; /* ensures margin works consistently */
}

.select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color: #506273;
    border-color: #717f8d;
    color: #fff;
    padding-right: 1.5em; /* space for the × */
    position: relative;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice:hover {
    background-color: #717f8d;
    border-color: #717f8d;
}

/* Move the × to the right edge */
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
    color: #fff;
    font-size: 1.2rem;
    font-weight: 400;
    margin: 0; /* override default margin-right */
    position: absolute;
    right: 0.15em;
    top: 50%;
    transform: translateY(-50%);
}

.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover {
    color: inherit;
}

.select2-container--default .select2-search--dropdown .select2-search__field {
    background: url("../../img/magnifier.png") no-repeat 12px;
    padding-left: 32px;
}

.select2-container--default .select2-search--dropdown .select2-search__field:focus {
    outline: none;
}

.select2-container--default .select2-results .select2-results__options {
    overflow-x: hidden;
}

.no-search .select2-container--default .select2-search--dropdown .select2-search {
    display: none;
}

.restaurant-switch {
    width: 189px;
}

.restaurant-switch .select2-selection--single {
    background: #354758;
    border: 1px solid var(--border-color);
    border-radius: 3px;
}

.restaurant-switch .select2-selection--single .select2-selection__rendered {
    color: #fff;
    font-weight: bold;
    padding: 0.2rem 1.2rem 0.2rem 0.6rem;
}

select[name="switch_restaurant_id"] {
    width: 189px;
    background: #354758;
    border: 1px solid var(--border-color);
    border-radius: 3px;
    color: #fff;
    font-weight: bold;
    padding: 0.2rem 1.2rem 0.2rem 0.6rem;
    font-size: 13px;
    line-height: 18px;
}

.read-only {
    font-size: 0.875rem;
}

.read-only .inline-label {
    font-weight: bold;
}

.read-only .fixed-width-label {
    display: inline-block;
    text-align: right;
    width: 110px;
}

.star-rating {
    color: #dbdbdb;
    display: inline-block;
    font-family: FontAwesome;
    font-size: 16px;
    height: 22px;
    letter-spacing: 2px;
    line-height: 22px;
    position: relative;
    vertical-align: top;
    white-space: nowrap;
}

.star-rating::before {
    content: "\f005\f005\f005\f005\f005";
    display: inline-block;
    position: relative;
}

.star-rating .star-rating-inner {
    height: inherit;
    left: 0;
    line-height: inherit;
    overflow: hidden;
    position: absolute;
    top: 0;
    white-space: nowrap;
    z-index: 1;
}

.star-rating-inner::before {
    color: #4a90e2;
    content: "\f005\f005\f005\f005\f005";
    position: relative;
}

.label-tooltip {
    color: #4a4a4a;
    font-size: 18px;
    margin-left: 4px;
}

.check-reply {
    color: #80d523;
    font-size: 15px;
}

.alert-reply {
    color: #ff4545;
    font-size: 15px;
}

.blue-circle {
    color: #4a90e2;
    font-size: 10px;
}

.shop-item-container .label-tooltip {
    font-size: 14px;
}

.description-example > div {
    border: 1px solid #d1d1d1;
    padding: 20px;
    height: 415px;
    overflow-y: scroll;
}

.description-example ul {
    padding: 15px;
}

/* Buttons */

.btn {
    border: 1px solid transparent;
    border-radius: 0.25rem;
    box-shadow: none;
    cursor: pointer;
    display: inline-block;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.5;
    margin: 0 0.4375rem 0 0;
    padding: 0.4375rem 0.9375rem;
    text-align: center;
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    user-select: none;
    vertical-align: middle;
    white-space: nowrap;
}

.guest-status-dropdown-button {
    border: 1px solid transparent;
    border-radius: 0.25rem;
    padding: 6px 10px;
    position: relative;
    text-align: left;
    width: 100%;
}

.edit-guest-modal-content .guest-status-dropdown-button,
.add-guest-modal-content .guest-status-dropdown-button {
    padding: 6px 10px;
}

.btn-primary {
    background-color: #5c9ae7;
    border-color: #5c9ae7;
    color: #fff;
}

.btn-primary:hover {
    background-color: #3483e7;
    border-color: #3483e7;
    color: #fff;
}

.btn-secondary {
    background-color: #fff;
    border-color: #dbdce4;
    color: #4d4d4d;
}

.btn-secondary:hover {
    background-color: #dbdce4;
    border-color: #dbdce4;
    color: #4d4d4d;
}

.btn-grey {
    background-color: #f3f3f3;
    border-color: #f3f3f3;
    color: #4d4d4d;
}

.btn-grey:hover {
    background-color: #d1d1d1;
    border-color: #d1d1d1;
    color: #4d4d4d;
}

.btn-positive {
    background-color: #fff;
    border-color: #cdced9;
    color: var(--text-color);
}

.btn-positive:hover {
    background-color: #dbdce4;
    border-color: #cdced9;
    color: var(--text-color);
}

.btn-negative {
    background-color: #d61b11;
    border-color: #d61b11;
    color: #fff;
}

.btn-negative:hover {
    background-color: #d60800;
    border-color: #d60800;
    color: #fff;
}

.btn-sm {
    border-radius: 0.1875rem;
    font-size: 13px;
    font-weight: 500;
    line-height: 15px;
    padding: 0.4375rem 0.75rem;
}

.btn.btn-sm.day {
    padding: 0.45rem 0.1rem;
}

.btn-big {
    align-items: center;
    background: #d8d8d8;
    color: #777;
    flex-direction: column;
    font-size: 13px;
    justify-content: center;
}

.btn-big .fa {
    color: #b2b2b2;
    display: block;
    font-size: 34px;
}

.btn .fa {
    margin-right: 6px;
}

.btn-primary.disabled,
.btn-primary:disabled {
    opacity: 0.3;
}

.btn-no-tranzition {
    transition: none;
}

.btn .fa.no-right-margin {
    margin-right: initial;
}

.reviews-btn {
    background-color: #326493;
    color: #fff;
    font-weight: 400;
    line-height: 10px;
    margin: 20px 0 20px 20px;
}

/* Alerts */

.alert {
    border: 0.0625rem solid transparent;
    border-radius: 0.25rem;
    display: block;
    font-size: 0.87rem;
    margin-bottom: 1rem;
    padding: 0.4rem 1rem;
    position: relative;
}

.alert-danger {
    background-color: #feefef;
    border-color: #f48989;
    color: #da1414;
}

.alert-success {
    background-color: #edf9f0;
    border-color: #5aca76;
    color: #287d3d;
}

.alert-info {
    background-color: #eef2fa;
    border-color: #89a7e0;
    color: #2e5aac;
}

.alert-warning,
.alert-warning a {
    background-color: #fff4ec;
    border-color: #ff8f39;
    color: #b95000;
}

.alert .fa {
    margin-right: 4px;
}

/* Shop Item Overrides Table */

.shop-item-overrides-table input {
    max-width: 60px;
}

.shop-item-overrides-table .date {
    max-width: 80px;
}

.shop-item-overrides-table td,
.shop-item-overrides-table th {
    padding: 5px;
}

.shop-item-overrides-table input[readonly] {
    border: 0;
}

.shop-item-overrides-table input[readonly]::-webkit-inner-spin-button,
.shop-item-overrides-table input[readonly]::-webkit-outer-spin-button {
    margin: 0;
}

.shop-item-overrides-table button {
    background: none;
    border: none;
    color: #3c80b8;
    cursor: pointer;
    padding: 0;
    text-decoration: underline;
}

/* Actions menu */

.actions-menu .actions-menu-button {
    font-size: 13px;
}

.actions-menu .actions-menu-button,
.actions-menu .actions-menu-button:active,
.actions-menu .actions-menu-button:hover {
    box-shadow: none;
}

.actions-menu .dropdown-menu {
    padding: 0;
}

.actions-menu .dropdown-item {
    border-bottom: 1px solid #e7e7ed;
    color: #536575;
    font-size: 13px;
    padding: 10px;
}

.actions-menu .dropdown-item:active {
    background-color: white;
    color: #536575;
}

.actions-menu .dropdown-item:last-child {
    border-bottom: none;
}

.actions-menu .form {
    display: flex;
    margin-left: -15px;
    margin-right: -15px;
}

.action-buton-input {
    background: none;
    color: #536575;
    font-size: 0.8125em;
    margin-left: 15px;
    min-width: 158px;
    width: 158px;
}

.action-buton-input:hover {
    background: #f1f2f5;
    color: #536575;
}

/* Autocomplete */

.ui-widget-content {
    overflow-y: auto;
}

.ui-widget-content .ui-menu-item {
    cursor: pointer;
    font-family: Roboto, sans-serif;
    font-size: 13px;
}

/* Tree view */

.custom-tree-view {
    /* display: inline-block; */
    font-weight: 500;
}

.custom-tree-view .active-link {
    color: #589ee9;
}

.custom-tree-view .filetree .expandable > .folder,
.custom-tree-view .filetree .collapsable > .folder,
.custom-tree-view .filetree .file {
    background: none;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    padding: 0 0 0 5px;
}

.custom-tree-view .filetree .expandable > .folder > .treeLink::before,
.custom-tree-view .filetree .collapsable > .folder > .treeLink::before,
.custom-tree-view .filetree .file > .treeLink::before {
    color: #516172;
    font-family: FontAwesome, sans-serif;
    font-size: 14px;
    margin-right: 5px;
}

.custom-tree-view .filetree .file > .treeLink::before {
    content: "\f15b";
}

.custom-tree-view .filetree .expandable > .folder > .treeLink::before {
    content: "\f07b";
}

.custom-tree-view .filetree .collapsable > .folder > .treeLink::before {
    content: "\f07c";
}

.custom-tree-view .custom-data-table-button {
    font-size: 14px;
}

.custom-tree-view .area-badge {
    background: #d8d8d8;
    border-radius: 20px;
    color: #2f3e44;
    padding: 1px 6px;
}

.custom-tree-view .area-buttons {
    align-items: center;
    display: flex;
    flex-grow: 1;
    justify-content: flex-end;
}

.custom-tree-view .treeview .expandable,
.custom-tree-view .treeview .collapsable {
    background-position: 0 -173px;
}

.custom-tree-view .treeview .hitarea {
    margin-top: 3px;
}

.custom-tree-view .filetree li {
    padding: 2px 0 2px 16px;
}

/* Restaurant pictures */

.image-wrapper {
    margin-bottom: 20px;
}

.restaurant-image {
    border-radius: 4px;
    height: auto;
    width: 100%;
}

.restaurant-picture-preview .image-wrapper .image-container .image-control {
    width: 40%;
}

.restaurant-picture-preview .restaurant-image {
    width: 40%;
}

.image-wrapper .form-select:not([size], [multiple]) {
    height: 30px;
    padding-left: 7px;
}

.image-container {
    border: 5px solid transparent;
    position: relative;
}

.image-container-for-logo {
    position: relative;
    background-color: #000;
}

.image-control {
    display: none;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 9;
}

.image-container:hover .image-control {
    display: block;
}

.image-container-for-logo:hover .image-control {
    display: block;
}

.image-control-content {
    align-items: center;
    display: flex;
    flex-direction: row;
    height: 100%;
    justify-content: space-around;
    padding: 0 10px;
}

.image-control-button {
    background: none;
    border: none;
    color: white;
    cursor: pointer;
    font-size: 26px;
}

.image-control-button:hover {
    color: #589ee9;
}

#OnlineBookingPictureWrapper .image-container > .image-control,
#OnlineBookingBackgroundWrapper .image-container > .image-control,
#OnlineBookingLogoWrapper .image-container-for-logo > .image-control {
    display: block;
}

.nob-logo,
.nob-background {
    width: 50%;
}

.restaurant-picture-message {
    background: #fff;
    bottom: 0;
    color: #d0021b;
    opacity: 0.8;
    overflow: hidden;
    position: absolute;
    text-align: center;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%;
}

.dz-message {
    background: #f4f5f7;
    border: 2px dashed #d3d8dd;
    border-radius: 4px;
}

.custom-dropzone .dz-message {
    align-items: center;
    color: #506172;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    font-size: 15px;
    justify-content: center;
    padding: 30px 0;
}

#OnlineBookingLogoDropzone .fa-download,
#OnlineBookingVideoDropzone .fa-download,
#OnlineBookingPictureDropzone .fa-download,
#OnlineBookingBackgroundDropzone .fa-download,
#RestaurantPictureDropzone .fa-download {
    color: #506273;
    font-size: 30px;
}

#OnlineBookingLogoDropzone span,
#OnlineBookingVideoDropzone span,
#OnlineBookingPictureDropzone span,
#OnlineBookingBackgroundDropzone span,
#RestaurantPictureDropzone span {
    color: #000;
    font-size: 14px;
}

.col.image-copyright-flash > .alert.alert-info {
    font-size: 16px;
}

.dz-message.booking-file-upload {
    margin-top: 30px;
    padding: 40px 0;
}

.custom-dropzone .dz-message .fa {
    color: #cacaca;
    font-size: 63px;
    margin-bottom: 15px;
}

.custom-dropzone .dz-preview {
    display: flex;
    flex-direction: row;
    margin-bottom: 10px;
    overflow: hidden;
}

.custom-dropzone .dz-image img {
    height: auto;
    margin-right: 5px;
    width: 28px;
}

.custom-dropzone .dz-details {
    overflow: hidden;
}

.custom-dropzone .dz-size,
.custom-dropzone .dz-filename {
    color: #4a4a4a;
    line-height: 1.2;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.custom-dropzone .dz-remove-button {
    background: none;
    border: none;
    color: #9b9b9b;
    cursor: pointer;
    font-size: 21px;
}

.custom-dropzone .dz-image-block {
    flex-direction: column;
}

.custom-dropzone .dz-image-block .dz-image {
    margin-bottom: 6px;
}

.custom-dropzone .dz-image-block .dz-image img {
    width: 100%;
}

.profile-picture-checkmark {
    bottom: -5px;
    color: #7cbb4e;
    font-size: 20px;
    left: -5px;
    line-height: 1;
    position: absolute;
}

.profile-picture-checkmark .fa-check {
    color: white;
    font-size: 14px;
}

.checkmarked-picture {
    background-color: #98c7f3;
    display: inline-block;
    position: relative;
    border: 5px solid #98c7f3;
    border-radius: 4px;
    overflow: visible; /* Important: allows checkmark to overflow */
}

/* Blue circular background */
.checkmarked-picture::before {
    content: "";
    position: absolute;
    top: -10px;
    left: -10px;
    width: 16px;
    height: 16px;
    background-color: #54a2eb;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 1px 3px rgb(0 0 0 / 30%);
    z-index: 1;
}

/* White checkmark */
.checkmarked-picture::after {
    content: "";
    position: absolute;
    top: -6px;
    left: -4px;
    width: 5px;
    height: 7px;
    border: solid white;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
    z-index: 2;
}

/* Date rule */

.calendar-rule-wrapper {
    align-items: flex-start;
    display: flex;
    justify-content: flex-start;
}

.calendar-rule-wrapper .custom-control-label {
    font-size: 13px;
}

.calendar-rule-wrapper-title {
    color: #4f4f4f;
    font-size: 13px;
    font-weight: bold;
}

.weekdays-wrapper {
    display: inline-block;
    margin-right: 30px;
    width: 135px;
}

.backend-reviews .weekdays-wrapper {
    width: 270px;
}

.monthdays-wrapper {
    display: inline-block;
    margin-right: 30px;
    width: 270px;
}

.mr-10 {
    margin-right: 10px;
}

.mr-20 {
    margin-right: 20px;
}

.mr-12 {
    margin-right: 12px;
}

.monthday {
    width: 50px;
}

.calendar-rule-wrapper .calendar-illustrator {
    margin-top: 0;
}

/* Filter form */

.filter-form-wrapper {
    border: 1px solid #e7e7ed;
    border-radius: 4px;
    padding: 20px;
}

.filter-form-title {
    color: #516273;
    font-size: 18px;
    font-weight: 700;
    margin: 0 0 20px;
    padding: 0;
}

/* Separator */

.dashed-separator {
    border-bottom: 1px dashed #d1d8df;
    margin-bottom: 20px;
    margin-top: 24px;
    width: 100%;
}

/* Translation widget */

.translation-tab {
    display: none;
}

.translation-tab-active {
    display: initial;
}

.translation-tab .stage-wrap {
    background-color: #f2f2f2;
}

.form-builder-wrapper .form-builder .form-actions .clear-all {
    background-color: #fff;
    border: 1px solid #dbdce4;
    border-radius: 0.1875rem;
    box-shadow: none;
    color: #4d4d4d;
    cursor: pointer;
    font-size: 13px;
    font-weight: 500;
    line-height: 15px;
    margin: 0;
    padding: 0.4375rem 0.75rem;
    text-align: center;
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    user-select: none;
    vertical-align: middle;
    white-space: nowrap;
}

/* Stripped Table */

.stripped-table {
    color: #2c3b41;
    width: 100%;
}

.stripped-table th {
    font-weight: 500;
}

.stripped-table tr:nth-child(even) {
    background: #f4f4f4;
}

.stripped-table td,
.stripped-table th {
    padding: 6px;
}

.stripped-table .button-cell {
    text-align: center;
    width: 25px;
}

.stripped-table .btn-icon {
    background: none;
    border: none;
    color: var(--text-color);
    font-size: 16px;
    line-height: 16px;
    padding: 0;
}

/* Communication categories */

.category-wrapper {
    border: 1px solid #ddd;
    border-radius: 4px;
    margin-bottom: 20px;
    min-height: 193px;
    padding: 20px;
}

.category-title {
    color: var(--text-color);
    font-size: 15px;
    font-weight: 700;
}

.category-description {
    color: #2c3b41;
    font-size: 13px;
}

.category-recipients {
    color: #2c3b41;
}

/* Data table */

.totals,
.custom-data-table {
    font-size: 13px;
    width: 100%;
}

.totals thead,
.custom-data-table thead {
    border-bottom: 3px solid #ddd;
}

.booking-files-table thead {
    border-bottom: 2px solid #d3d8dd;
}

.totals tbody tr:nth-child(even),
.custom-data-table tbody tr:nth-child(even) {
    background: #f6fafe;
}

table.custom-data-table tbody tr:hover,
.scrollable-box-wrapper table.custom-data-table tbody tr:hover {
    background: #e5eff9;
}

.totals tfoot,
.custom-data-table tfoot {
    border-top: 3px solid #ddd;
}

.totals tfoot td,
.custom-data-table tfoot td {
    color: #2c3b41;
    font-size: 13px;
    font-weight: bold;
}

.totals th,
.custom-data-table th {
    color: #2c3b41;
    font-size: 13px;
    font-weight: bold;
    padding: 4px 6px;
    position: relative;
    white-space: nowrap;
}

.custom-data-table th.booking-file-header {
    padding: 12px 8px;
    font-size: 12px;
    font-weight: 500;
    line-height: 150%;
    color: #506273;
}

.totals th a,
.custom-data-table th a {
    cursor: pointer;
    color: #2c3b41;
    display: block;
    text-decoration: underline;
}

.custom-data-table th.sorting,
.custom-data-table th.sorting_asc,
.custom-data-table th.sorting_desc {
    background: none;
}

.custom-data-table th.sorting::after,
.custom-data-table th.sorting_asc::after,
.custom-data-table th.sorting_desc::after {
    font-family: FontAwesome;
    margin-left: 4px;
}

.custom-data-table th.sorting::after {
    content: "\f0dc";
}

.custom-data-table th.sorting_asc::after {
    content: "\f0de";
}

.custom-data-table th.sorting_desc::after {
    content: "\f0dd";
}

.custom-data-table th .asc::after {
    color: #a8bbd0;
    content: "▲";
    position: absolute;
    right: 10px;
}

.custom-data-table th .desc::after {
    color: #a8bbd0;
    content: "▼";
    position: absolute;
    right: 10px;
}

.totals tbody tr,
.custom-data-table tbody tr {
    border-bottom: 1px solid #ebebeb;
}

.booking-files-table tbody tr {
    border-bottom: 1px solid #e4e6ea;
}

.totals td,
.custom-data-table td {
    padding: 10px 6px;
    font-size: 14px;
}

.custom-data-table.booking-files-table td {
    padding: 12px 8px;
}

.totals thead th,
.custom-data-table thead th {
    padding-left: 6px;
}

.totals .right-padding,
.custom-data-table .right-padding {
    padding-right: 30px;
}

.totals .odd,
.custom-data-table .odd {
    background-color: white;
}

.totals .deleted-booking,
.custom-data-table .deleted-booking {
    background-color: #feeeee;
}

.custom-data-table-wrapper .dataTables_length,
.custom-data-table-wrapper .dataTables_filter {
    display: none;
}

.custom-data-table-wrapper .dataTables_info {
    color: #2c3b41;
    font-size: 13px;
    padding-top: 12px;
    width: 100%;
}

ul.paging_simple_numbers {
    display: flex;
    list-style: none;
}

.custom-data-table-wrapper .paging_simple_numbers {
    cursor: pointer;
    font-size: 13px;
    padding: 10px 0 6px;
    text-align: right;
}

.guest-database-wrapper .paging_simple_numbers {
    position: fixed;
}

.custom-data-table-wrapper .paging_simple_numbers li,
.custom-data-table-wrapper .paging_simple_numbers .paginate_button {
    color: var(--text-color);
    padding: 6px 7px;
    text-decoration: none;
}

.custom-data-table-wrapper .paging_simple_numbers li a,
.custom-data-table-wrapper .paging_simple_numbers .paginate_button a {
    color: var(--text-color);
    text-decoration: none;
}

.custom-data-table-wrapper .paging_simple_numbers .active,
.custom-data-table-wrapper .paging_simple_numbers .current {
    background-color: #edecef;
    border-radius: 2px;
    color: black;
}

.custom-data-table-wrapper .paging_simple_numbers .previous,
.custom-data-table-wrapper .paging_simple_numbers .next {
    color: black;
    font-weight: 500;
}

.custom-data-table-wrapper .paging_simple_numbers .disabled {
    color: #ccc;
}

.custom-data-table-wrapper .audit-log-data .dataTables_info {
    display: none;
}

.custom-data-table .enabled,
.custom-data-table .on,
.stripped-table .on,
.dataTables .on {
    border: 1px solid #207c44;
    color: #207c44;
    font-size: 11px;
    font-weight: 500;
    padding: 1px 10px;
    text-transform: uppercase;
}

.clickable-row-review:nth-child(even) {
    background-color: #f6fafe;
}

.custom-data-table .disabled {
    border: 1px solid #cdced9;
    color: #6b6c7e;
    font-size: 11px;
    font-weight: 500;
    padding: 1px 10px;
    text-transform: uppercase;
}

.custom-data-table .demo,
.stripped-table .demo {
    border: 1px solid #ff9543;
    color: #bd5b12;
    font-size: 11px;
    font-weight: 500;
    padding: 1px 10px;
    text-transform: uppercase;
}

.custom-data-table .off,
.stripped-table .off,
.dataTables .off,
.dashboard-container .off {
    border: 1px solid #b40c00;
    color: #b40c00;
    font-size: 11px;
    font-weight: 500;
    padding: 1px 10px;
    text-transform: uppercase;
}

.audit-logs-types .dt-container {
    border: 1px solid #ddd;
    border-radius: 8px;
    margin-bottom: 30px;
    min-height: 0;
    overflow: hidden;
}

.multiple-audit-log-tables th {
    font-weight: inherit;
}

.custom-data-table a.label_no_underline {
    text-decoration: none !important;
}

.custom-data-table .label_event_status,
.custom-data-table .label_cc_expired,
.dashboard-container .label_cc_expired,
.totals .label_restaurant_status,
.custom-data-table .label_restaurant_status,
.dashboard-container .label_restaurant_status,
.custom-data-table .label_event_type,
.custom-data-table .label_giftcard_groups,
.custom-data-table .label_invoice_category,
.custom-data-table .label_invoice_payment_status,
.custom-data-table .label_audit_log_type,
.custom-data-table .label_2fa_status {
    border: 1px solid #cdced9;
    color: #6b6c7e;
    font-size: 11px;
    font-weight: 500;
    padding: 1px 10px;
    text-transform: uppercase;
}

.totals .label_restaurant_status_5,
.custom-data-table .label_restaurant_status_5,
.custom-data-table .label_event_type_saver,
.custom-data-table .label_restaurant_status_10,
.dashboard-container .label_restaurant_status_5,
.dashboard-container .label_restaurant_status_10 {
    border: 1px solid #4f62b1;
    color: #4f62b1;
}

.totals .label_restaurant_status_1,
.custom-data-table .label_restaurant_status_1,
.dashboard-container .label_restaurant_status_1,
.custom-data-table .label_event_type_normal,
.custom-data-table .label_event_status_active,
.custom-data-table .label_giftcard_groups_status_active,
.custom-data-table .label_invoice_category_invoice,
.custom-data-table .label_invoice_payment_status_approved,
.custom-data-table .label_audit_log_type_create,
.custom-data-table .label_2fa_status_yes,
.custom-data-table .label_cc_expired_no {
    border: 1px solid #207c44;
    color: #207c44;
}

.dashboard-container .label_restaurant_status_1 {
    border: 1px solid #287d3c;
    color: #287d3c;
}

.totals .label_restaurant_status_6,
.totals .label_restaurant_status_7,
.totals .label_restaurant_status_9,
.custom-data-table .label_restaurant_status_6,
.custom-data-table .label_restaurant_status_7,
.custom-data-table .label_restaurant_status_9,
.dashboard-container .label_restaurant_status_6,
.dashboard-container .label_restaurant_status_7,
.dashboard-container .label_restaurant_status_9,
.custom-data-table .label_invoice_payment_status_errored,
.custom-data-table .label_giftcard_groups_status_deleted,
.custom-data-table .label_audit_log_type_delete,
.custom-data-table .label_event_status_closed,
.custom-data-table .label_cc_expired_yes,
.dashboard-container .label_cc_expired_yes {
    border: 1px solid #b40c00;
    color: #b40c00;
}

.totals .label_restaurant_status_2,
.totals .label_restaurant_status_4,
.totals .label_restaurant_status_8,
.custom-data-table .label_restaurant_status_2,
.custom-data-table .label_restaurant_status_4,
.custom-data-table .label_restaurant_status_8,
.dashboard-container .label_restaurant_status_2,
.dashboard-container .label_restaurant_status_4,
.dashboard-container .label_restaurant_status_8,
.custom-data-table .label_event_status_test,
.custom-data-table .label_audit_log_type_update,
.custom-data-table .label_invoice_category_credit,
.custom-data-table .label_invoice_payment_status_pending {
    border: 1px solid #ff9543;
    color: #bd5b12;
}

.custom-data-table .text-muted .label_restaurant_status {
    border: 1px solid #6c757d !important;
    color: #6c757d !important;
}

.label_prio {
    border: 1px solid #4f62b1;
    color: #4f62b1;
    font-size: 11px;
    font-weight: 500;
    padding: 1px 10px;
    text-transform: uppercase;
}

.label_prio_low {
    border-color: #287d3c;
    color: #287d3c;
}

.label_prio_high {
    border-color: #b40c00;
    color: #b40c00;
}

.custom-data-table-wrapper {
    position: relative;
}

.custom-data-table-search-wrapper::after {
    color: #6c6b7d;
    content: "\f002";
    display: block;
    font-family: FontAwesome;
    font-size: 16px;
    position: absolute;
    right: 10px;
    top: 3px;
}

.custom-data-table-search {
    background: #f1f2f5;
    border: 1px solid #e7e7ed;
    border-radius: 3px;
    font-size: 13px;
    padding: 5px 40px 5px 10px;
}

.custom-data-table-length-wrapper {
    align-items: center;
    display: flex;
    font-size: 13px;
    height: 31px;
}

.custom-data-table-length {
    margin-left: 5px;
    width: auto;
}

.custom-data-table-length::-ms-expand {
    display: none;
}

.custom-data-table td a:not(.btn) {
    color: #54a2eb;
    text-decoration: underline;
}

.stripped-table a {
    color: #54a2eb;
}

.custom-data-table-button {
    background: none;
    border: none;
    color: #506172;
    cursor: pointer;
    font-size: 20px;
    line-height: 1;
}

.custom-data-table-button .fa {
    color: #506172;
}

.custom-data-table .light-blue {
    background-color: #f0f5fa;
    border-bottom: 1px solid #e0e5ea;
}

.custom-data-table .blue {
    background-color: #dae5f2;
}

.custom-data-table .dashed-bottom {
    border-bottom: 1px dashed #c5ced6;
}

.custom-data-table .w40 {
    width: 40%;
}

.event-stats-container {
    overflow: auto;
    position: relative;
}

.event-stats-top-side {
    left: 0;
    position: absolute;
    top: 0;
    z-index: 999;
}

.event-stats-left-side {
    left: 0;
    position: absolute;
    top: 0;
    width: 200px;
    z-index: 998;
}

.event-stats-wrapper {
    padding-left: 200px;
}

.event-stats .fixed-column {
    min-width: 100px;
    white-space: normal;
}

.event-stats td {
    text-align: center;
}

.custom-data-table.event-stats {
    table-layout: fixed;
    width: initial;
}

.custom-data-table.event-stats td {
    white-space: nowrap;
}

.event-stats th {
    padding: 4px 10px;
}

.event-stats.fixed th,
.event-stats.fixed td {
    background: white;
}

.custom-data-table.event-stats .pax-related + :not(.pax-related) {
    border-left: 1px solid #979797;
}

.custom-data-table.event-stats .tickets-highlighted:nth-child(odd) {
    background: #f6fafe;
}

.custom-data-table.event-stats tr:nth-child(even) {
    background: none;
}

.custom-data-table.event-stats tr:hover:nth-child(even),
.custom-data-table.event-stats tbody tr:hover .tickets-highlighted {
    background: #e5eff9;
}

/* Restaurants list */

.restaurants-info-title {
    color: #2c3b41;
    font-size: 15px;
    margin: 20px 0 5px;
}

.restaurants-info-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.restaurants-info-list li {
    color: #2c3b41;
    display: flex;
    flex-wrap: wrap;
    position: relative;
    width: 100%;
}

.restaurants-info-list li .status-name {
    background: white;
    font-weight: bold;
    z-index: 1;
}

.restaurants-info-list li::before {
    border-bottom: 1px dotted #ccc;
    content: "";
    flex-grow: 1;
    margin: 0 3px;
    min-height: 1em;
    order: 2;
}

.restaurants-info-list li .amount {
    order: 3;
}

.restaurants-info-list .total-item {
    border-top: 1px solid #ccc;
    font-size: 14px;
    margin-top: 4px;
    padding-top: 4px;
}

.restaurants-info-list .total-item::before {
    border-bottom: 1px solid #fff;
}

.restaurants-info-list .total-item .amount {
    font-weight: bold;
}

.bottom-row {
    background: #f4f4f4;
    border-bottom: 2px solid #ddd;
    font-weight: bold;
}

/* Booking guide */

.booking-guide-preview {
    border: 1px solid #e7e7ed;
    border-radius: 4px;
    margin-top: 25px;
}

.booking-guide-preview h5 {
    background-color: #f1f2f5;
    color: #a2a8b5;
    display: block;
    font-size: 13px;
    font-weight: 500;
    margin: 0;
    padding: 7px 8px;
}

.booking-guide-preview-content {
    align-items: center;
    display: flex;
    height: 79px;
    justify-content: center;
}

.booking-guide-preview-content a {
    color: #346191;
    text-decoration: underline;
}

/* Review */
.big-number {
    font-size: 24px;
    font-weight: bold;
    text-align: center;
}

.reviews-title {
    color: #536272;
    font-size: 25px;
    font-weight: 700;
    margin-bottom: 12px;
}

/* Credit cards */

.credit-card-wrapper {
    font-size: 13px;
    margin-bottom: 24px;
}

.inline-form {
    display: inline-block;
}

/* Templates */

.textarea-with-dynamic-data {
    align-items: flex-end;
    background: #f1f2f5;
    border: 1px solid #ddd;
    border-radius: 2px;
    display: flex;
    flex-direction: column;
}

.textarea-with-dynamic-data .dynamic-text-select {
    border: none;
    border-radius: 0;
    max-width: 50%;
    min-height: 30px;
    min-width: inherit;
}

.textarea-with-dynamic-data .sms-template-textarea {
    background: white;
    border: none;
    border-radius: 0;
}

.sms-template-preview {
    height: 232px;
}

.transparent-overlay {
    background: #fff;
    height: 100%;
    left: 0;
    opacity: 0.6;
    position: absolute;
    width: 100%;
    z-index: 100;
}

/* Internal orders */
.internal-order-item.product-category-item,
.internal-order-item.product-item-title {
    font-size: 14px;
    color: #404e5c;
    cursor: pointer;
    overflow: hidden;
    padding: 8px;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 413px;
    flex-grow: 1;
}

.product-item-actions {
    display: inline-block;
    margin: 5px;
}

.product-category-container,
.product-item {
    position: relative;
    display: flex;
    height: 42px;
    border-bottom: 1px solid #e4e6ea;
}

/* Color picker */

.color-picker-list {
    display: none;
    list-style: none;
    padding: 0;
}

.color-picker-list li {
    display: inline-block;
}

/* Modules */

.module-options-wrapper {
    border: 1px solid #d1d8df;
    border-radius: 4px;
    margin-bottom: 20px;
    padding: 12px 14px;
}

.module-options-wrapper-title {
    color: #464646;
    font-size: 14px;
    font-weight: 700;
    margin-bottom: 21px;
}

.module-option-wrapper {
    margin-bottom: 10px;
}

.vertical-centered {
    align-items: center;
    display: flex;
}

.flex-end {
    display: flex;
    justify-content: flex-end;
}

.module-option-title,
.module-option-label {
    color: #464646;
    font-size: 14px;
}

.toggle-switch {
    align-items: center;
    cursor: pointer;
    display: flex;
}

.toggle-switch .toggle-label {
    color: #2c3b41;
    font-size: 13px;
    font-weight: 500;
    margin-right: 6px;
}

.toggle-switch .toggle-label-right {
    margin: 0 0 0 70px;
}

.toggle-switch-bar .toggle-switch-handle {
    display: block;
    float: left;
    min-width: 60px;
    text-transform: uppercase;
}

.toggle-switch-bar .toggle-switch-icon {
    font-size: 0.75rem;
}

.toggle-switch-bar .toggle-switch-icon .lexicon-icon {
    margin-top: -0.2em;
}

.toggle-switch-bar .button-icon {
    font-size: 0.875rem;
}

.toggle-switch-check {
    font-size: 62.5%;
    opacity: 0;
    position: absolute;
}

.toggle-switch-check:empty ~ .toggle-switch-bar {
    cursor: pointer;
    display: block;
    float: left;
    font-size: 0.75rem;
    height: 32px;
    line-height: 32px;
    position: relative;
    text-indent: 0;
    -moz-user-select: none;
    -ms-user-select: none;
    -webkit-user-select: none;
    user-select: none;
}

.toggle-switch-check:empty ~ .toggle-switch-bar::after {
    background-color: #fff;
    border-color: #fff;
    border-radius: 50%;
    border-style: solid;
    border-width: 1px;
    bottom: 4px;
    content: "";
    display: block;
    height: 24px;
    left: 4px;
    position: absolute;
    top: 4px;
    transition: background-color 100ms ease-in, border-color 100ms ease-in, color 100ms ease-in, left 100ms ease-in, right 100ms ease-in;
    width: 24px;
}

.toggle-switch-check:empty ~ .toggle-switch-bar.small::after {
    top: 11px;
    height: 12px;
    width: 12px;
}

.toggle-switch-check:empty ~ .toggle-switch-bar::before {
    background-color: #a7a9bc;
    border-color: #a7a9bc;
    border-radius: 20px;
    border-style: solid;
    border-width: 1px;
    bottom: 0;
    content: " ";
    display: block;
    left: 0;
    position: absolute;
    top: 0;
    transition: background-color 100ms ease-in, border-color 100ms ease-in, color 100ms ease-in, left 100ms ease-in, right 100ms ease-in;
    width: 60px;
}

.toggle-switch-check:empty ~ .toggle-switch-bar.small::before {
    top: 8px;
    height: 18px;
    width: 36px;
}

.toggle-switch-check:empty ~ .toggle-switch-bar .toggle-switch-handle::after {
    content: attr(data-label-off);
    margin-left: 68px;
    transition: background-color 100ms ease-in, border-color 100ms ease-in, color 100ms ease-in, left 100ms ease-in, right 100ms ease-in;
    white-space: nowrap;
}

.toggle-switch-check:empty ~ .toggle-switch-bar .toggle-switch-handle::before {
    transition: background-color 100ms ease-in, border-color 100ms ease-in, color 100ms ease-in, left 100ms ease-in, right 100ms ease-in;
}

.toggle-switch-check:empty ~ .toggle-switch-bar .toggle-switch-icon {
    color: #fff;
    left: 4px;
    line-height: 24px;
    position: absolute;
    text-align: center;
    text-indent: 0;
    top: 4px;
    transition: background-color 100ms ease-in, border-color 100ms ease-in, color 100ms ease-in, left 100ms ease-in, right 100ms ease-in;
    width: 24px;
    z-index: 1;
}

.toggle-switch-check:empty ~ .toggle-switch-bar .toggle-switch-icon-on {
    left: 4px;
    opacity: 0;
}

.toggle-switch-check:empty ~ .toggle-switch-bar .toggle-switch-icon-off {
    left: 32px;
}

.toggle-switch-check:empty ~ .toggle-switch-bar .button-icon {
    color: #506172;
}

.toggle-switch-check:empty ~ .toggle-switch-bar .button-icon-on {
    opacity: 0;
}

.toggle-switch-check:checked ~ .toggle-switch-bar::after {
    background-color: #fff;
    border-color: #fff;
    border-radius: 50%;
    border-style: solid;
    border-width: 1px;
    left: 32px;
}

.toggle-switch-check:checked ~ .toggle-switch-bar.small::after {
    left: 20px;
}

.toggle-switch-check:checked ~ .toggle-switch-bar::before {
    background-color: #506172;
    border-color: #506172;
    border-radius: 20px;
    border-style: solid;
    border-width: 1px;
}

.toggle-switch-check:checked ~ .toggle-switch-bar .toggle-switch-handle::after {
    content: attr(data-label-on);
}

.toggle-switch-check:checked ~ .toggle-switch-bar .toggle-switch-icon {
    color: #fff;
}

.toggle-switch-check:checked ~ .toggle-switch-bar .button-icon {
    color: #272833;
    left: 32px;
}

.toggle-switch-check:checked ~ .toggle-switch-bar .button-icon-on,
.toggle-switch-check:checked ~ .toggle-switch-bar .toggle-switch-icon-on {
    opacity: 1;
}

.toggle-switch-check:checked ~ .toggle-switch-bar .button-icon-off,
.toggle-switch-check:checked ~ .toggle-switch-bar .toggle-switch-icon-off {
    opacity: 0;
}

.toggle-switch-check:disabled ~ .toggle-switch-bar,
.toggle-switch-check.disabled ~ .toggle-switch-bar {
    cursor: not-allowed;
    opacity: 0.4;
}

/* Period templates */

.scrollable-box-both-ways-tall table.period-template-table thead th,
.scrollable-box-both-ways-tall table.period-template-table tbody td {
    padding: 2px;
    white-space: nowrap;
}

.scrollable-box-both-ways-tall table.period-template-table tbody tr:hover {
    cursor: pointer;
}

.scrollable-box-both-ways-tall table.period-template-table .selected,
.scrollable-box-both-ways-tall table.override-table .selected {
    background: #bddbf9;
}

.period-templates-caps-container {
    background: #e0e0e0;
    overflow-y: scroll;
    height: 300px;
    padding: 10px;
}

.period-template-cap-input,
.period-template-cap-time,
.override-cap-input,
.override-cap-time {
    margin: 0 14px;
}

.period-templates-legend-container {
    display: flex;
    padding: 20px 28px 0 10px;
    position: relative;
}

.period-templates-legend-container .top-legend-left,
.period-templates-legend-container .top-legend-right {
    border-bottom: 1px solid black;
    display: block;
    font-weight: bold;
    position: absolute;
    text-align: center;
    top: 0;
    width: 30%;
}

.period-templates-legend-container .top-legend-left {
    left: 15.5%;
}

.period-templates-legend-container .top-legend-right {
    right: 12%;
}

.period-templates-legend {
    display: inline-block;
    flex: 1;
    font-weight: bold;
    margin: 0 14px;
    text-align: center;
}

.period-templates-legend-container .time-legend {
    flex: none;
}

/* Overrides */

.scrollable-box-both-ways-overrides {
    height: 465px;
}

.override-row,
.override-subrow {
    cursor: pointer;
}

.override-subrow td {
    padding-left: 30px;
}

/* Custom Text */

.event-setups-custom-text {
    color: #272833;
    cursor: auto;
    font-size: 1rem;
}

.preview-ticket-dashed-separator {
    border-bottom: 1px dashed #d1d8df;
    margin-bottom: 20px;
    margin-top: 90px;
    width: 100%;
}

.preview-ticket-custom-text {
    font-weight: normal;
}

.event-setups-ticket-preview-form {
    bottom: 110px;
    position: absolute;
}

.event-setups-ticket-preview-checkbox {
    bottom: 60px;
    position: absolute;
}

/* Table plan setup */

.table-properties-modal .modal-dialog {
    max-width: 710px;
}

.table-caps-wrapper {
    padding: 15px;
}

.table-caps-labels {
    display: flex;
    justify-content: space-between;
    padding: 0 29px 0 10px;
}

.table-caps-label {
    font-weight: bold;
    text-align: center;
}

.table-caps-wrapper .w-18 {
    width: 18%;
}

.table-caps-wrapper .w-17 {
    width: 17%;
}

.table-caps-wrapper .w-16 {
    width: 16%;
}

.table-caps-wrapper .w-12 {
    width: 12%;
}

.table-caps-wrapper .w-10 {
    width: 10%;
}

.table-caps-wrapper .w-9 {
    width: 9%;
}

.table-caps-wrapper .w-8 {
    width: 8%;
}

.table-caps-wrapper .w-7 {
    width: 7%;
}

.table-caps-container {
    background: #e0e0e0;
    height: 450px;
    overflow-y: scroll;
    padding: 10px;
}

.table-cap {
    display: flex;
    justify-content: space-between;
}

.table-cap .form-control {
    padding: 0 4px;
    text-align: center;
}

.table-cap select.form-control:not([size], [multiple]) {
    height: calc(1.5em + 0.75rem + 2px);
}

.new-tables-tabs {
    bottom: 100%;
    left: 0;
    margin: 0 5px;
    position: absolute;
    right: 0;
}

.new-tables-tabs .nav-link {
    color: black;
    padding: 4px;
}

.new-tables-tabs .nav-link.active {
    font-weight: bold;
}

.table-plan-new-wrapper {
    border: 1px solid #dee2e6;
    border-top: none;
}

.table-plans-list:not(.restaurant-masterplans-list) {
    list-style: none;
    height: 517px;
    overflow-y: scroll;
    padding-left: 0;
    padding-top: 10px;
}

.table-plans-list:not(.restaurant-masterplans-list) .table-plans-list-item {
    cursor: pointer;
    padding: 5px;
}

.table-plans-list:not(.restaurant-masterplans-list) .table-plans-list-item.selected {
    font-weight: bold;
}

.table-plan-name {
    color: #516273;
    font-size: 16px;
    font-weight: bold;
    margin: 0;
}

.wrong-table-name,
.wrong-table-name:focus {
    background: #ce292f;
    color: white;
}

.locked-table-name,
.locked-table-name[readonly],
.locked-table-name:focus {
    background: #ceca24;
}

.table-wrapper.ui-selected .table-content {
    box-shadow: inset 0 0 0 3px #dc5050;
}

.table-wrapper.ui-selected .chair {
    background: #6d7ada;
}

.table-wrapper.ui-selecting .table-content {
    box-shadow: inset 0 0 0 3px #dc9993;
}

.table-wrapper.ui-selecting .chair {
    background: #a8b7da;
}

.ui-selectable-helper {
    border: 2px dotted #0eac3f;
    border-radius: 5px;
    position: absolute;
}

/* User settings */

.user-settings-modal .modal-content {
    min-height: 615px;
}

.user-settings-tabs .active {
    border-bottom: 2px solid #ccc;
    font-weight: bold;
}

.restaurant-list-order {
    background: var(--background-color);
    height: 446px;
    list-style: none;
    overflow-y: scroll;
    padding: 10px;
}

.restaurant-list-order li {
    cursor: pointer;
    padding: 3px 0;
}

/* Event Setups Minimum Width Input */

.event-setups-min-input-width {
    min-width: 55px;
}

@media screen and (min-width: 992px) {
    .add-guest-modal .modal-lg {
        max-width: 500px;
    }
}

@media screen and (max-width: 1368px) {
    .custom-form .form-control {
        font-size: 11px;
        max-height: 24px;
        padding: 2px 6px;
    }

    .custom-form .form-control-taller {
        max-height: 48px;
    }

    .custom-form .form-control-textarea {
        height: auto;
        max-height: 80px;
    }

    .custom-form .form-label {
        font-size: 11px;
    }

    .custom-control-label-text {
        padding-left: 0.1rem;
    }

    .modal-xl,
    .guest-chat-modal-container.background-modal {
        min-width: 970px;
    }

    .scrollable-box,
    .scrollable-box-multiple,
    .scrollable-box-both-ways,
    .scrollable-box-both-ways-tall,
    .scrollable-box-both-ways-taller {
        font-size: 11px;
    }

    .custom-form .form-label,
    .custom-form .custom-control-label {
        font-size: 11px;
    }

    .modal-header {
        padding: 10px;
    }

    .restaurant-booking-modal .header .header-title {
        font-size: 16px;
    }

    .custom-form .form-group {
        margin-bottom: 2px;
    }

    .form-select {
        background-position: right 0 center;
    }

    .scrollable-box .booking-time-item,
    .scrollable-box .booking-table-item {
        font-size: 11px;
    }

    .restaurant-booking-modal .modal-body {
        padding: 0 5px 10px;
    }

    .restaurant-booking-modal .custom-data-table {
        font-size: 11px;
    }

    .close-online-modal .custom-data-table {
        font-size: 14px;
    }

    .modal-xl .modal-content {
        min-height: initial;
    }

    .color-input-label {
        top: 0;
    }

    .color-input-box {
        height: 14px;
    }

    :not(.close-online-modal) .custom-button {
        font-size: 12px;
        padding: 3px;
    }

    .restaurant-booking-modal-footer {
        margin-top: 10px;
    }

    .toggle-switch {
        margin-bottom: 0;
    }

    .toggle-switch-check:empty ~ .toggle-switch-bar {
        height: 24px;
        line-height: 24px;
    }

    .toggle-switch-bar .button-icon {
        font-size: 0.775rem;
    }

    .toggle-switch-check:empty ~ .toggle-switch-bar::after {
        height: 16px;
        width: 16px;
    }

    .toggle-switch-check:empty ~ .toggle-switch-bar .toggle-switch-icon {
        line-height: 16px;
        width: 16px;
    }

    .toggle-switch-check:checked ~ .toggle-switch-bar::after,
    .toggle-switch-check:checked ~ .toggle-switch-bar .button-icon {
        left: 40px;
    }

    .internal-order-window-footer,
    .internal-products-window-row,
    .internal-order-items-row.nwb-order-tab,
    .internal-order-header.order-table-header {
        margin-left: -21px;
        margin-right: -21px;
    }
}

/* Edit columns */

.edit-columns-wrapper {
    height: 400px;
    overflow: hidden auto;
    padding: 0 10px;
}

/* Booking list context menu */

.booking-list-context-menu {
    background: white;
    border: 1px solid #ccc;
    border-radius: 4px;
    position: absolute;
    z-index: 1000;
}

.booking-list-context-menu ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.booking-list-context-menu .separator {
    background: #bbb;
    height: 1px;
    width: 100%;
}

.context-menu-button {
    background: transparent;
    border: none;
    border-bottom: 1px solid #e7e7ed;
    color: #303b45;
    font-size: 14px;
    padding: 8px 16px;
    text-align: left;
    user-select: none;
    width: 100%;
}

.context-menu-button:hover {
    background: #f0f5ff;
}

.booking-list-context-menu .btn-group .dropdown-menu {
    margin-left: 0;
    min-width: 12rem;
    padding: 0;
}

.booking-list-context-menu .btn-group:not(.disabled):hover > .dropdown-menu {
    display: block;
}

.booking-list-context-menu .btn-group .dropdown-toggle::after {
    position: absolute;
    right: 9px;
    top: 50%;
    transform: translateY(-50%);
}

.booking-list-context-menu .disabled {
    color: #aaa;
    pointer-events: none;
}

.booking-list-context-menu .btn-group {
    width: 100%;
}

/* Week picker styles on pages like /bookings/week and /points/week_summary */

.week-picker {
    height: 300px;
    overflow: auto;
}

.week-picker .dropdown-item,
.quarter-picker .dropdown-item {
    border-bottom: 1px solid #ccc;
    color: #2c3b41;
    font-size: 0.875rem;
    padding: 0.45rem 1.5rem;
}

.quarter-picker {
    height: 160px;
    overflow: auto;
}

.half-year {
    max-height: 400px;
    overflow: auto;
}

.half-year .container {
    width: 320px;
    padding: 0.45rem 1.5rem;
}

.half-year .container a {
    color: #212529;
}

.half-year .container .first a {
    color: #fff;
}

.half-year .container .bg-active {
    background-color: #e8e8e8;
}

.half-year .container div.bg-active:first-child,
.half-year .container div.bg-active.first {
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
}

.half-year .container div.bg-active:last-child,
.half-year .container div.bg-active.last {
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
}

.half-year .container .bg-active.first {
    background-color: #545b62;
}

.six-months-bookings .booking-stats-item {
    background-color: #f2f0f0;
    margin: 2px 4px;
    border-radius: 5px;
}

.six-months-bookings .booking-stats-item a {
    color: #2c3b41;
}

.six-months-bookings .booking-stats-item.weekend {
    background-color: #dadddf;
}

.six-months-bookings .booking-stats-item.current {
    background-color: #54a2ec;
}

.day-short-name {
    background-color: #edeeef;
    padding: 0.06rem;
    border-radius: 3px;
}

.total-bookings {
    background-color: #f4f4f4;
    padding: 2px 5px;
    margin-left: 12px;
    border-radius: 3px;
    line-height: 25px;
    text-align: center;
    white-space: nowrap;
}

div.covered-div {
    position: relative;
}

a.cover-link {
    position: absolute;
    inset: 0;
    z-index: 1;
}

.week-title {
    position: absolute;
    z-index: 2;
}

.month-bookings .calendar .day-header {
    background-color: #e5e5e5;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    font-size: 0.875rem;
}

.month-bookings .calendar .day-body {
    background-color: #f2f0f0;
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px;
    font-size: 0.563rem;
    line-height: 20px;
}

.month-bookings .calendar .current {
    background-color: #54a2ec;
    color: #fff;
}

.month-bookings .week {
    max-width: 60px;
}

.month-bookings .calendar .week {
    font-size: 0.813rem;
}

.month-bookings .calendar div.disabled {
    pointer-events: none;
    opacity: 0.4;
}

.month-bookings a {
    color: #2c3b41;
}

.month-bookings .current a {
    color: #fff;
}

/* Send SMS Listing */

.listing-sms .guests-title {
    color: #272833;
    font-size: 13px;
    font-weight: 500;
    margin-bottom: 4px;
}

.listing-sms .contact-list {
    border-bottom: 2px solid #ddd;
    border-top: 2px solid #ddd;
    height: 370px;
    list-style: none;
    margin: 0;
    overflow-y: scroll;
    padding: 0;
}

.listing-sms .form-control {
    padding: 6px 10px;
}

.contact-list .contact-list-item {
    padding: 4px 5px;
}

.contact-list .contact-list-item:nth-child(even) {
    background: #f4f4f4;
}

.listing-sms .languages {
    display: flex;
    margin-bottom: 10px;
}

.listing-sms .languages .slick-list {
    flex: 1;
    margin: 0 4px;
    overflow: hidden;
}

.listing-sms .language {
    border: 1px solid #cdced9;
    border-radius: 4px;
    color: #506172;
    cursor: pointer;
    display: inline-block;
    height: 22px;
    margin: 0 2px;
    text-align: center;
}

.listing-sms .selected-language {
    background: #506172;
    color: white;
}

.slick-arrow {
    background: none;
    border: 1px solid #cdced9;
    border-radius: 4px;
    color: #506172;
    height: 22px;
    padding: 0;
    width: 22px;
}

.listing-sms .form-control-textarea {
    font-size: 13px;
    height: 250px;
    max-height: 250px;
}

.listing-sms .preview-message {
    background: #eef2fa;
    border-bottom: 1px solid #888796;
    border-radius: 15px 15px 0;
    border-right: 1px solid #888796;
    color: #5b6b7c;
    padding: 20px;
}

/* Send SMS Index */

.warning-text {
    color: #da1414;
    visibility: hidden;
}

/* Send SMS Confirmation */

.summary-title {
    color: #536272;
    font-size: 25px;
    font-weight: 700;
    margin-bottom: 12px;
}

.sms-message {
    background-color: #f1f2f5;
    border-radius: 0.25rem;
    padding: 10px;
    margin-bottom: 1rem;
}

.sms-summary-modal .modal-content {
    text-align: center;
    border: none;
}

.sms-summary-modal-message {
    color: #516172;
    font-family: Roboto, sans-serif;
    font-size: 20px;
    margin-bottom: 10px;
}

@media screen and (max-width: 1368px) {
    .listing-sms .form-control {
        padding: 2px 6px;
    }
}

@media screen and (max-width: 1199px) {
    .week-buttons {
        display: none;
    }

    .change-date,
    .icon-button {
        margin: 0 1px;
    }

    .btn-group.zoom-buttons {
        position: absolute;
        top: 35px;
        right: -4px;
    }

    .listing-header .row {
        margin-bottom: 1rem;
    }
}

@media screen and (min-width: 1600px) {
    .listing-header .row .today-button {
        margin-left: 1.5rem;
    }
}

/* Table with progress bars */
.progress-bar-table {
    width: 100%;
}

.progress-bar-table td {
    padding: 2px;
}

.progress-bar-table td.progress-cell {
    width: 250px;
}

.no-progress-bar {
    padding: 0 10px;
}

.blue-progress-bar {
    height: 24px;
    min-width: 250px;
    position: relative;
}

.blue-progress-bar > progress {
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    background-color: #ddd;
    border: none;
    height: 100%;
    width: 100%;
}

.br-50 {
    border-radius: 0.5rem;
}

.blue-progress-bar > progress::-webkit-progress-bar {
    background-color: #ddd;
}

.blue-progress-bar > progress::-moz-progress-bar {
    background-color: #8ab2d4;
}

.blue-progress-bar > progress::-ms-fill {
    border: none;
    color: #8ab2d4;
}

.blue-progress-bar > progress::-webkit-progress-value {
    background-color: #8ab2d4;
}

.blue-progress-bar.full > progress::-moz-progress-bar {
    background-color: #5a82a4;
}

.blue-progress-bar.full > progress::-ms-fill {
    color: #5a82a4;
}

.blue-progress-bar.full > progress::-webkit-progress-value {
    background-color: #5a82a4;
}

.blue-progress-bar > label {
    line-height: 24px;
    position: absolute;
    right: 10px;
}

.big-number .blue-progress-bar {
    height: 40px;
}

.big-number .blue-progress-bar > label {
    line-height: 40px;
}

.border-table {
    border: 1px solid #ebebeb;
}

.table-header {
    background: #e5eff9;
}

/* Restaurant booking */

.maximize-note-button,
.minimize-note-button {
    background: transparent;
    border: none;
    cursor: pointer;
    position: absolute;
    right: 15px;
    top: -3px;
}

.minimize-note-button {
    right: 5px;
}

.absolute-note-input-wrapper {
    background: #fff;
    inset: 0;
    padding: 0 30px 15px 15px;
    position: absolute;
    z-index: 1000;
}

.absolute-note-input-wrapper .absolute-note-input {
    height: 100%;
}

.color-select-wrapper {
    height: 32px;
    width: 100%;
}

.color-select-input {
    background: #f1f2f5;
    border: 0.0625rem solid #e7e7ed;
    border-radius: 0.25rem;
    cursor: pointer;
    display: flex;
    height: 100%;
    justify-content: space-between;
    padding: 6px;
    position: relative;
    width: 100%;
}

.color-select-input .dropdown-tick::after {
    border-bottom: 0;
    border-left: 0.3em solid transparent;
    border-right: 0.3em solid transparent;
    border-top: 0.3em solid;
    content: "";
    display: inline-block;
    vertical-align: 0.255em;
}

.color-select-label {
    background: black;
    display: inline-block;
    height: 100%;
    width: 80%;
}

.color-select-box,
.tags {
    align-items: center;
    background: #f4f4f4;
    border: 0.0625rem solid #e7e7ed;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    padding: 10px;
    position: absolute;
    width: 290px;
    z-index: 1000;
}

.color-select-box {
    top: 42px;
    height: 290px;
}

.booking-tag-wrapper .short-tags,
.customer-tag-wrapper .short-tags {
    cursor: pointer;
    width: 100%;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

.booking-tag-wrapper .short-tags .tag-button,
.customer-tag-wrapper .short-tags .tag-button {
    display: inline-block;
    margin-right: 2px;
}

.booking-tag-wrapper .short-tags .tag-button .custom-button,
.customer-tag-wrapper .short-tags .tag-button .custom-button {
    width: 24px;
    height: 24px;
}

.booking-tag-wrapper .short-tags .tag-button .custom-button .fa,
.customer-tag-wrapper .short-tags .tag-button .custom-button .fa {
    padding: 0;
    width: 22px;
}

.booking-tag-wrapper .short-tags .custom-badge,
.customer-tag-wrapper .short-tags .custom-badge,
.booking-tag-wrapper .tags .tags-content .custom-badge,
.customer-tag-wrapper .tags .tags-content .custom-badge {
    line-height: 15px;
    padding: 3px 8px;
}

.booking-tag-wrapper .tags,
.customer-tag-wrapper .tags {
    top: 30px;
    border-radius: 5px;
}

.booking-tag-wrapper .tags .tags-content,
.customer-tag-wrapper .tags .tags-content {
    margin: 0;
    width: 100%;
    max-height: 304px;
    overflow: auto;
}

.booking-tag-wrapper .tags .tags-content .form-group .custom-checkbox .form-label,
.customer-tag-wrapper .tags .tags-content .form-group .custom-checkbox .form-label {
    line-height: 12px;
    padding-left: 0;
}

.booking-tag-wrapper .tags .tags-content .form-group .custom-checkbox .form-label .custom-badge,
.customer-tag-wrapper .tags .tags-content .form-group .custom-checkbox .form-label .custom-badge {
    display: inline-block;
    max-width: 200px;
}

.booking-tag-wrapper .tags .tags-content .form-group .custom-checkbox .custom-control-label::before,
.customer-tag-wrapper .tags .tags-content .form-group .custom-checkbox .custom-control-label::before {
    display: inline-block;
    height: 13px;
    width: 13px;
}

.booking-tag-wrapper .tags .tags-content .form-group .custom-checkbox .custom-control-label::after,
.customer-tag-wrapper .tags .tags-content .form-group .custom-checkbox .custom-control-label::after {
    display: inline-block;
    height: 8px;
    width: 8px;
    left: -10px;
    top: 0;
}

.color-select-box-smaller {
    height: 180px;
    width: 230px;
}

.color-select-wrapper .white-triangle {
    bottom: -16px;
    left: 22%;
    position: absolute;
}

.color-select-wrapper .white-triangle::after {
    border-bottom: 0;
    border-left: 15px solid transparent;
    border-right: 15px solid transparent;
    border-top: 15px solid #f4f4f4;
    content: "";
    display: block;
}

.color-square {
    border: 1px solid #f4f4f4;
    cursor: pointer;
    height: 48px;
    margin: 2px;
    padding: 4px;
    width: 48px;
}

.color-select-box .selected {
    border: 1px solid #cbcbcb;
}

.color-select-wrapper .hidden {
    display: none;
}

.color-square-inner {
    background: pink;
    height: 100%;
    width: 100%;
}

/* Reviews filters */

.reviews-filters-wrapper {
    background: #f4f4f4;
    border: 1px solid #eaeaea;
    margin-bottom: 25px;
    padding: 20px 15px;
}

.reviews-filters-title {
    border-bottom: 1px solid #d1d7de;
    color: #4b4b4b;
    font-size: 14px;
    font-weight: bold;
    padding-bottom: 4px;
}

.reviews-filters-wrapper .form-control {
    background: white;
}

.mt-28 {
    margin-top: 28px;
}

.mt-40 {
    margin-top: 40px;
}

.narrow-form-control {
    padding: 0.3rem;
}

.no-resize {
    resize: none;
}

.alert-danger a {
    color: #da1414;
}

/* Backend reviews */

.reviews-score {
    font-size: 2.5rem;
}

.tooltip-inner {
    max-width: 500px;
    text-align: left;
}

/* Notifications */

.notifications-modal .modal-body,
.notifications-modal .tab-content,
.notifications-modal .tab-pane,
.notifications-modal .notifications-row,
.notifications-modal .notifications-column,
.notifications-modal .product-news-details,
.guest-chat-day-view-modal .modal-body,
.guest-chat-day-view-modal .tab-content,
.guest-chat-day-view-modal .tab-pane,
.guest-chat-day-view-modal .guest-chat-list-row,
.guest-chat-day-view-modal .guest-chat-list-column {
    height: 100%;
}

.notifications-modal .modal-body,
.guest-chat-day-view-modal .modal-body {
    padding-bottom: 15px;
}

.notifications-modal .notifications-column,
.guest-chat-day-view-modal .guest-chat-list-column {
    background-color: #f4f4f4;
}

.notifications-modal .modal-content,
.guest-chat-day-view-modal .modal-content {
    /* TODO: should be changed back to fit-content when the chrome (ver 129) bug is fixed */
    min-height: auto;
}

.notifications-wrapper,
.guest-chat-list-wrapper {
    align-content: start;
    border: 1px solid #d6d6d6;
    border-radius: 4px;
    height: 100%;
    overflow-y: auto;
}

.notifications-wrapper .alert,
.guest-chat-list-wrapper .alert {
    height: max-content;
    padding: 1.3rem 2.5rem;
    margin: 20px auto 0;
}

.notifications-circle,
.restaurant-unread-messages-circle {
    background: #d31116;
    border-radius: 50%;
    display: block;
    height: 12px;
    left: 60%;
    position: absolute;
    top: 35%;
    transform: translateX(-50%) translateY(-50%);
    width: 12px;
}

.notifications-picture-wrapper .restaurant-image {
    border-radius: 4px;
}

.list-item-unread-messages-circle {
    background: #5c9ae7;
    border-radius: 50%;
    display: block;
    height: 14px;
    width: 14px;
    margin-top: 3px;
}

.list-item-unread-messages-circle p {
    color: #fff;
    font-size: 10px;
    font-weight: bold;
    letter-spacing: 0;
    line-height: 14px;
    text-align: center;
}

.list-item-unread-messages-circle p.less-than-10 {
    margin-left: 4px;
}

.list-item-unread-messages-circle p.more-than-9 {
    margin-left: 1px;
}

#guest-chat-day-view-modal-content .guest-chat-details #guest-chat-messages div.justify-content-between div.form-group {
    margin-top: 0;
    margin-bottom: 0;
}

#guest-chat-day-view-modal-content .tab-pane.active.with-pagination {
    max-height: 93%;
}

@media screen and (min-width: 1025px) {
    #guest-chat-day-view-modal-content .guest-chat-details:not(.with-pagination) #guest-chat-messages .communication-dialog {
        min-height: 100px;
        height: calc(100vh - 410px);
        max-height: calc(100vh - 410px);
    }

    #guest-chat-day-view-modal-content .guest-chat-details:not(.with-pagination) #guest-chat-messages .communication-dialog.one-communication-type {
        min-height: 100px;
        height: calc(100vh - 385px);
        max-height: calc(100vh - 385px);
    }
}

@media screen and (min-width: 1025px) and (max-height: 1060px) {
    #guest-chat-day-view-modal-content .guest-chat-details.with-pagination #guest-chat-messages .communication-dialog {
        min-height: 100px;
        height: calc(100vh - 465px);
        max-height: calc(100vh - 465px);
    }

    #guest-chat-day-view-modal-content .guest-chat-details.with-pagination #guest-chat-messages .communication-dialog.one-communication-type {
        min-height: 100px;
        height: calc(100vh - 440px);
        max-height: calc(100vh - 440px);
    }
}

@media screen and (min-width: 1025px) and (min-height: 1061px) {
    #guest-chat-day-view-modal-content .guest-chat-details.with-pagination #guest-chat-messages .communication-dialog {
        min-height: 100px;
        height: calc(100vh - 505px);
        max-height: calc(100vh - 505px);
    }

    #guest-chat-day-view-modal-content .guest-chat-details.with-pagination #guest-chat-messages .communication-dialog.one-communication-type {
        min-height: 100px;
        height: calc(100vh - 480px);
        max-height: calc(100vh - 480px);
    }
}

@media screen and (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
    #guest-chat-day-view-modal-content .guest-chat-details.with-pagination #guest-chat-messages .communication-dialog {
        min-height: 100px;
        max-height: 250px;
    }

    #guest-chat-day-view-modal-content .guest-chat-details:not(.with-pagination) #guest-chat-messages .communication-dialog {
        min-height: 170px;
        max-height: 320px;
    }
}

#guest-chat-day-view-modal-content .dataTables_paginate {
    float: left;
    padding-bottom: 0;
    margin-bottom: 0;
}

.notification-list-item-date,
.guest-chat-list-item-date {
    font-size: 12px;
    color: #838383;
    margin-bottom: 0.2rem;
    font-weight: 400;
}

.notification-list-item-title {
    font-size: 14px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #656565;
    margin-bottom: 0.2rem;
    font-weight: normal;
}

.notification-list-item,
.guest-chat-list-item {
    height: max-content;
    border-bottom: 1px solid #e4e4e4;
    cursor: pointer;
    padding: 16px 8px;
    background: #fff;
    font-weight: bold;
}

.notification-list-item.active,
.guest-chat-list-item.active {
    border-left: 5px solid #54a2eb;
    background: #f1f5ff;
    padding-left: 3px;
}

.notification-list-item-description,
.guest-chat-list-item-description {
    font-size: 14px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #838383;
    font-weight: normal;
}

.notification-list-item-description p,
.guest-chat-list-item-destription p {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.guest-chat-list-item i.no-messages {
    font-size: 16px;
    font-weight: bold;
    color: #131313;
}

.notification-title {
    font-size: 1.25rem;
    color: #131313;
}

.notification-body {
    background: #fff;
    border-radius: 5px;
    padding-left: 15px;
}

.notification-date {
    color: var(--text-color);
    font-size: 0.81rem;
}

.notification-description {
    font-size: 1rem;
    color: #4a4a4a;
    text-align: justify;
}

.notification-list-item.unread,
.guest-chat-list-item.unread {
    background: #f1f5ff;
}

.guest-chat-list-item.unread .guest-chat-list-item-description,
.notification-list-item.unread .notification-list-item-title {
    font-weight: 700;
    color: #131313;
}

.notification-list-item.unread .notification-list-item-description {
    font-weight: 400;
    color: #656565;
}

.guest-chat-list-item:not(.unread) .guest-chat-list-item-description,
.notification-list-item:not(.unread) .notification-list-item-description {
    font-weight: 400;
    color: #838383;
}

.notification-list-item:not(.unread) .notification-list-item-title {
    font-weight: 500;
    color: #656565;
}

.notification-body .notification-description p {
    font-weight: 400;
    color: #656565;
}

.guest-chat-list-item.active .guest-chat-list-item-description,
.notification-list-item.active .notification-list-item-title {
    color: #131313;
}

.notification-list-item.active .notification-list-item-description {
    color: #656565;
}

.notification-list-item:hover,
.guest-chat-list-item:hover {
    background: #e5eff9;
}

#guest-chat-day-view-modal-content #guest-chat-messages .row {
    margin-left: 0;
}

#guest-chat-day-view-modal-content #guest-chat-messages .communication-dialog.custom-scroll-bar {
    margin-right: 0;
}

#guest-chat-day-view-modal-content #BookingCommunicationForm .col.col-md-12.d-flex.justify-content-end {
    padding-right: 8px;
}

#guest-chat-day-view-modal-content .modal-body {
    padding-top: 0;
}

.custom-scroll-bar {
    scrollbar-width: thin;
    scrollbar-color: #a7a9bc #edecef;
}

.mark-as-read,
.mark-as-unread {
    height: 15px;
    width: 18px;
    color: var(--text-color);
}

.mark-all-as-read {
    font-size: 0.81rem;
    height: 32px;
    float: right;
    margin-right: -2px;
}

.mark-all-as-read:disabled {
    background-color: #fff;
    color: #838383;
    border-color: #dbdce4;
}

#productNewsMarkAsRead,
#productNewsMarkAsUnread {
    height: 32px;
}

.notification-read-more-link {
    color: #54a2eb;
    text-decoration: underline;
}

.notifications-modal-tab-list .notifications-circle {
    left: 25%;
    top: 39%;
}

.notifications-modal-tab-list #product-news-tab .notifications-circle {
    left: 40px;
    top: 39%;
}

.notifications-modal-tab-list .nav-item {
    margin: -1px;
}

.notifications-modal-tab-list a.active {
    border-radius: 8px 8px 0 0;
}

.guest-chat-day-view-modal .modal-tabs {
    padding-top: 10px;
    padding-right: 15px;
}

.guest-chat-day-view-modal .close {
    opacity: 1;
}

.internal-note-details .btn-with-icon img {
    height: 30px;
}

.product-news-footer,
.internal-notes-footer {
    align-items: flex-end;
    bottom: 0;
    display: flex;
    flex-direction: column;
    padding: 0 15px;
    position: absolute;
    right: 0;
}

.product-news-footer button,
.internal-notes-footer button {
    margin: 0;
    padding: 10px 30px;
}

.dashed-border {
    border-top: 1px dashed #d1d8df;
    height: 1px;
    margin: 20px 0;
    width: 100%;
}

.guest-chat-list-item-date {
    display: flex;
}

.guest-chat-list-item-date div {
    padding-right: 5px;
}

.guest-chat-list-item-date div.guest-chat-list-item-customer {
    margin-left: auto;
}

.guest-chat-list-item-flag.d-none {
    padding-right: 0;
}

/* media print */
@media print {
    body {
        padding: 0 !important;
        margin: 0 !important;
    }

    .main-content {
        width: 100% !important;
        padding: 0 !important;
    }

    .backend-sidebar,
    .navbar,
    .actions-menu,
    .custom-data-table-length-wrapper,
    .custom-data-table-search-wrapper,
    .custom-data-table *::after,
    .dataTables_paginate,
    .notifications-modal,
    #notifications-popup-window,
    .hidden,
    .no-print,
    .dt-container .dt-paging,
    #custom-data-table-buttons .dt-buttons,
    .date-nav-container,
    .nwb-modal,
    .restaurant-booking-modal {
        display: none !important;
    }
}

.hidden {
    display: none;
}

.font-size0 {
    font-size: 0;
}

/* Prevents big width bug in firefox */
.slick-slider {
    overflow: hidden;
    min-width: 100%;
    width: 0;
}

#enterpriseWarning {
    color: #e32;
}

/* Show giftcard modal */

#ShowGiftcardModal .modal-dialog {
    max-width: 370px;
}

#BookingDepositModal .modal-dialog {
    max-width: 440px;
}

#OrderItemShowGiftcardForm label {
    padding-left: 0;
}

/* Dynamic text */

.cke_combopanel.cke_combopanel__dynamictext {
    width: 240px;
}

.cke_combo__dynamictext .cke_combo_text {
    width: 140px;
}

.YearDatePicker .ui-datepicker-month {
    display: none;
}

.HideTodayButton .ui-datepicker-buttonpane .ui-datepicker-current {
    visibility: hidden;
}

.hide-calendar .ui-datepicker-calendar {
    display: none !important;
    visibility: hidden !important;
}

.input-group-text {
    font-size: 0.8125rem;
}

#promoting-map {
    height: 600px;
    width: 100%;
}

#promoting-map.fullscreen {
    height: 100% !important;
    left: 0;
    position: fixed !important;
    top: 0;
    width: 100% !important;
    z-index: 1031;
}

#promoting-map .map-content a:focus {
    outline: none;
}

.no-special-formatting-options {
    font-family: sans-serif;
    font-size: 13px;
}

.filterForm input[type="checkbox"] {
    width: 30px;
}

.customer-phone {
    background-clip: border-box;
    background-color: #f1f2f5;
    border: 0.0625rem solid #e7e7ed;
    border-radius: 0.25rem;
    box-shadow: none;
    color: #272833;
    display: block;
    font-size: 0.8125rem;
    height: 26px;
    line-height: 1.5;
    padding-bottom: 1.5rem;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    width: 110%;
}

.phone-prefix {
    display: block;
    font-size: 0.85em;
    height: 15px;
    left: 25px;
    line-height: 24px;
    padding-bottom: 24px;
    position: absolute;
    text-align: center;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
}

.small-blue-button {
    border: 1px solid #cdced9;
    border-radius: 4px;
    font-size: 0.85em;
    font-weight: 500;
    padding: 5px 6px;
    text-align: center;
}

.small-blue-button:focus {
    background-color: green;
}

.phone-prefix-flag {
    margin-bottom: -2px;
}

.navbar-custom-menu .notification-list-icon,
.navbar-custom-menu .guest-chat-list-icon {
    display: inline-block;
    height: 30px;
    width: auto;
}

.notifications-modal-tab-list .notification-list-icon {
    display: inline-block;
    height: 34px;
    width: auto;
    margin-bottom: 5px;
}

.notifications-modal-tab-list #product-news-tab img {
    margin-left: -5px;
}

.popover {
    z-index: 1051;
}

.popover.menu {
    z-index: 1051;
}

.day-popover-content {
    min-width: 130px;
    font-size: 0.563rem;
}

.day-popover-content .column {
    display: inline-block;
}

.day-popover-content .column,
.day-popover-content .fa-moon-o,
.day-popover-content .fa-sun-o {
    width: 20px;
    text-align: center;
}

.custom-dates-wrapper {
    height: 170px;
    overflow-y: scroll;
}

.custom-dates-wrapper ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.custom-dates-wrapper li {
    align-items: center;
    display: flex;
    padding: 5px 10px;
    justify-content: space-between;
}

.custom-dates-wrapper .custom-control-upload,
.custom-dates-wrapper .form-radio-label {
    font-size: 0.8125rem;
    vertical-align: top;
    margin-bottom: 0;
}

.replicate-monthdays-wrapper {
    display: inline-block;
    padding: 0;
    margin: auto;
    width: 312px;
}

.replicate-monthdays-wrapper .btn-outline-secondary {
    font-size: 0.8125rem;
    border-color: #6c757d;
    padding: 8px 0 0;
    margin-left: 3px;
    margin-right: 3px;
    width: 30px;
    height: 30px;
    line-height: 13px;
}

.replicate-monthdays-wrapper .btn-outline-secondary .form-checkbox-input {
    z-index: -1;
}

.replicate-monthdays-wrapper .btn-outline-secondary:not(:disabled).active {
    background-color: #589ee9;
}

.bookings-replicator-modal .modal-dialog {
    max-width: 359px;
}

.booking-replicator-modal-content {
    padding-left: 0;
    padding-right: 0;
}

.booking-replicator-frequency {
    margin-bottom: 20px;
}

.booking-replicator-frequency .form-group {
    margin-bottom: 12px;
    line-height: 13px;
}

.booking-replicator-frequency .form-group .form-label {
    padding: 0;
    vertical-align: top;
}

.booking-replicator-modal-content .section-header {
    margin: 0;
}

.nwb-modal-content.listing-email .custom-dates-wrapper {
    height: 185px;
}

.nwb-modal-content.listing-email .custom-dates-wrapper,
.booking-replicator-modal-content .custom-dates-wrapper {
    padding-left: 0;
    padding-right: 0;
    border: 0.0625rem solid #e7e7ed;
    border-radius: 0.25rem;
}

.nwb-modal-content.listing-email .custom-dates-wrapper .odd,
.booking-replicator-modal-content .custom-dates-wrapper {
    background-color: #f1f2f5;
}

.nwb-modal-content.listing-email .custom-dates-wrapper .bottom-border {
    border-bottom: 1px solid #ccc;
}

.font-size-12 {
    font-size: 0.75rem;
}

.dark-blue {
    color: #506273;
}

@media screen and (min-width: 1200px) {
    .month-bookings .calendar .day-body {
        font-size: 0.75rem;
    }

    .month-bookings .calendar .day-header {
        font-size: 1.125rem;
    }

    .day-popover-content {
        font-size: 0.75rem;
    }

    .guest-chat-modal-container.background-modal {
        max-width: 1140px;
    }
}

@media screen and (max-width: 1200px) {
    #guest-chat-day-view-modal .dataTables_info,
    #guest-chat-day-view-modal .paging_simple_numbers {
        font-size: 11px;
    }
}

@media screen and (min-width: 1600px) {
    .month-bookings .calendar .day-body {
        font-size: 0.9rem;
    }

    .day-popover-content {
        font-size: 0.9rem;
    }
}

.business-login-bg {
    height: 100%;
    width: 100%;
    background: url("/img/business_login_bg.jpg") no-repeat center;
    background-size: cover;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.login-container {
    padding: 5px;
    height: 500px;
    width: 450px;
    border-radius: 5px;
    background-color: #e6e6f0;
}

.login-box {
    padding: 40px 50px;
    height: 480px;
    width: 430px;
    border-radius: 5px;
    background-color: white;
}

.login-box h1 {
    margin-top: 1rem;
    font-size: 0.9rem;
    border: none;
    padding: 0;
    font-weight: 700;
    color: #6c757d;
}

.login-box iframe {
    max-width: 230px;
}

.login-box form .row {
    height: 40px;
}

form .row.error-box {
    min-height: 24px;
    padding: 0;
    height: auto;
}

.error-box .alert-danger {
    width: 100%;
    text-align: center;
    font-weight: normal;
    line-height: 20px;
    border: 1px solid #da1414;
}

.text-input {
    background-color: #e6e6f0;
    border: 1px solid #d2d2e1;
    border-radius: 0.25rem;
}

#login-pwd.text-input {
    border-bottom-right-radius: 0;
    border-top-right-radius: 0;
    border-right: none;
}

#toggle-pwd {
    background-color: #e6e6f0;
    border: 1px solid #d2d2e1;
    border-left: none;
    border-bottom-right-radius: 0.25rem;
    border-top-right-radius: 0.25rem;
}

#toggle-pwd img {
    width: 1rem;
    height: 1rem;
    pointer-events: none;
}

.focusable:focus,
.focusable:focus-visible,
#login-pwd:focus ~ #toggle-pwd,
#login-pwd:focus-visible ~ #toggle-pwd {
    outline: #54a2eb solid 2px;
}

#login-pwd:focus,
#login-pwd:focus-visible {
    border-right: none;
}

.h7 {
    font-size: 0.875rem;
}

.bg-blue-primary {
    background: #54a2eb;
}

#forgot-pwd-result-wrapper .alert {
    height: 65px;
    font-size: 13px;
    line-height: 19px;
}

.notifications-popup-window {
    display: block;
    position: fixed;
    top: 2.25rem;
    right: 1.5rem;
    width: 25rem;
    max-width: 28.25rem;
    z-index: 1100;
    overflow: hidden;
    background: #fff;
    border: 1px solid #cdced9;
    border-radius: 4px;
    box-shadow: 5px 5px 25px rgb(0 0 0 / 50%);
}

.notifications-popup-header {
    display: flex;
    height: 32px;
    overflow: hidden;
    align-items: center;
}

.notifications-popup-title {
    display: inline-block;
    color: var(--text-color);
    font-size: 16px;
    line-height: 1.25rem;
    font-weight: 500;
    letter-spacing: 0;
    font-family: Roboto, sans-serif;
}

.notifications-popup-close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-left: auto;
    width: 32px;
    height: 32px;
    font-size: 1rem;
    letter-spacing: 0;
    line-height: 1rem;
    text-align: center;
    border: none;
    background-color: #fff;
}

.notifications-popup-close:hover {
    background-color: #e4e6ea;
    border-radius: 4px;
}

.notification-preview {
    overflow: hidden;
    font-size: 0.875rem;
    border: 0;
    background: #e5eff9;
    border-radius: 4px;
    cursor: pointer;
    padding: 16px;
    height: 96px;
}

.notification-preview:hover {
    background: #dcebfb;
    border: 1px #656565;
}

.notification-preview-date {
    display: block;
    font-size: 12px;
    line-height: 18px;
    font-weight: 400;
    letter-spacing: 0;
    font-family: Roboto, sans-serif;
    color: #717f8d;
}

.notification-preview-title {
    display: block;
    font-size: 16px;
    line-height: 22.4px;
    font-weight: 500;
    letter-spacing: 0;
    font-family: Roboto, sans-serif;
    color: #20272e;
    text-overflow: ellipsis;
}

.notification-preview-message {
    display: block;
    font-size: 14px;
    line-height: 19.6px;
    font-weight: 400;
    letter-spacing: 0;
    font-family: Roboto, sans-serif;
    color: #717f8d;
}

.notifications-popup-footer {
    height: 2.5rem;
    font-size: 1rem;
}

.notifications-popup-footer > .btn {
    position: relative;
    top: 5px;
    font-family: Roboto, sans-serif;
    letter-spacing: 0%;
    font-weight: 400;
    font-size: 16px;
    line-height: 22.4px;
    text-align: right;
    text-decoration: underline;
    text-decoration-style: solid;
    text-decoration-thickness: auto;
    color: #54a2eb;
}

.notifications-popup-footer > .btn:hover {
    text-decoration: none;
    color: #4484c0;
}

.btn-custom-radius {
    border-radius: 3px !important;
}

.main-content .modal .search-booking-table {
    font-size: 0.813rem;
}

.search-booking-table thead {
    background: #fff;
    top: 0;
    z-index: 1;
}

.opacity-50 {
    opacity: 0.5;
}

.listing-table .dt-column-order {
    display: none;
}

#current-bl-table .dt-orderable-asc.dt-ordering-asc::after {
    color: #a8bbd0;
    content: "▲";
    position: absolute;
}

#current-bl-table .dt-orderable-desc.dt-ordering-desc::after {
    color: #a8bbd0;
    content: "▼";
    position: absolute;
}

#current-bl-table .custom-data-table th .asc::after {
    color: #a8bbd0;
    content: "▲";
    position: absolute;
    right: 10px;
}

#current-bl-table .custom-data-table th .desc::after {
    color: #a8bbd0;
    content: "▼";
    position: absolute;
    right: 10px;
}

.booking-theme-switch-wrapper .custom-switch .custom-control-label,
.visible-wrapper .custom-control-label,
.internal-product-wrapper .custom-control-label {
    color: var(--text-color);
    font-family: Roboto;
    font-size: 0.93em;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 1.9em;
}

.booking-theme-switch-wrapper .custom-switch .custom-control-label::before,
.visible-wrapper .custom-control-label::before,
.internal-product-wrapper .custom-control-label::before {
    left: 0;
    background-color: #a7a9bc;
    width: 2em;
}

.order-tab-modal .custom-switch .custom-control-label::before {
    background-color: #929da8;
}

.booking-theme-switch-wrapper .custom-switch .custom-control-label::after,
.visible-wrapper .custom-control-label::after,
.internal-product-wrapper .custom-control-label::after {
    left: 0.25em;
    background-color: #fff;
}

.booking-theme-switch-wrapper .custom-control-input:checked ~ .custom-control-label::before,
.internal-product-wrapper .custom-control-input:checked ~ .custom-control-label::before {
    background-color: var(--text-color);
    border-color: #3c4a56;
}

.booking-theme-switch-wrapper .custom-control-input:checked ~ .custom-control-label::after,
.internal-product-wrapper .custom-control-input:checked ~ .custom-control-label::after {
    transform: translate(1.2em, 0);
}

#legend div {
    border: 1px solid #cdced9;
    border-radius: 4px;
    padding: 5px;
    margin-left: 5px;
    margin-top: 24px;
    display: inline-block;
}

#legend div input {
    margin-right: 5px;
    vertical-align: middle;
}

#legend div span {
    padding-left: 14px;
    margin-right: 5px;
    border-radius: 14px;
}

#legend div label {
    margin-bottom: 0;
    vertical-align: middle;
}

.restaurant_messages .custom-control.custom-checkbox {
    padding-left: 1.5rem;
    top: 28px;
}

.restaurant_messages_types label {
    font-weight: 500;
    font-size: 0.875rem;
    border-radius: 3px;
    width: 180px;
    padding: 5px;
    margin-left: 1.6rem;
    cursor: pointer;
}

.restaurant_messages_targets label {
    margin-left: 1.6rem;
    cursor: pointer;
}

.restaurant_messages_types label i {
    margin-left: 10px;
    margin-right: 10px;
}

.restaurant_messages_types .form-check-input {
    margin-left: -1.75rem;
    cursor: pointer;
}

.restaurant_messages_types label.alert-info {
    border: 1px solid #2e5aac;
}

.restaurant_messages_types label.alert-danger {
    border: 1px solid #da1414;
}

.restaurant_messages_types label.alert-warning {
    border: 1px solid #b95000;
}

.restaurant-messages .alert {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
}

.restaurant-messages .alert a {
    text-decoration: underline;
}

.cropper-container {
    max-height: 900px;
    min-height: 200px;
    width: 100%;
}

.online-booking-cropper-container > img {
    max-width: 100%;
}

.restaurant-customers-delete-form {
    display: inline;
}

.audit-logs-types.mt-10 table th:nth-child(1) {
    max-width: 340px;
    width: 340px;
}

.audit-logs-types .created-type-row {
    max-width: 804px;
    width: 804px;
    overflow-wrap: break-word;
    word-wrap: break-word;
    white-space: normal;
}

.audit-logs-types .update-type-row {
    max-width: 409px;
    width: 409px;
    overflow-wrap: break-word;
    word-wrap: break-word;
    white-space: normal;
}

.audit-logs-types.mt-10 table th:nth-child(3) {
    max-width: 409px;
    width: 409px;
}

table.custom-data-table .multiple-audit-log-tables {
    text-align: left;
}

.truncated-text {
    overflow: hidden;
}

.truncated-text::after {
    content: attr(data-tooltip);
    display: none;
}

.truncated-text:hover::after {
    display: block;
    position: absolute;
    background-color: #fff;
    border: 1px solid #ccc;
    padding: 5px;
    z-index: 1000;
    white-space: nowrap;
}

.audit-logs-types table.dataTable {
    white-space: unset;
}

iframe#email-queue-iframe,
iframe#marketing-setting-iframe {
    width: 100%;
    height: 500px;
    border: 1px solid #ccc;
}

.custom-switch .custom-control-label.left-0::before {
    left: 0;
}

.custom-switch .custom-control-label.left-0::after {
    left: 2px;
}

.custom-badge {
    border-radius: 15px;
    padding: 5px 10px;
    color: #fff;
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    text-wrap: nowrap;
}

.custom-badge-small {
    border-radius: 10px;
    padding: 2px 6px;
    margin-right: 1px;
    color: #fff;
    max-width: 50px;
    overflow: hidden;
    text-overflow: ellipsis;
    text-wrap: nowrap;
}

.badge-edit-button > .custom-badge {
    font-size: 13px;
}

.custom-data-table td a:not(.btn).badge-edit-button {
    text-decoration: none;
}

.badges-translation-fields {
    margin: 0 15px;
    width: 100%;
}

.badges-info {
    font-weight: bold;
}

.custom-data-table-button.badge-edit-button .fa-edit {
    transform: translateY(2px);
}

.badge-action-buttons {
    display: flex;
    gap: 20px;
}

.badges-container {
    width: 500px;
    display: grid;
    grid-template-columns: 1fr auto;
}

.badges-container .language-wrapper,
.badges-container .badges-name-input {
    grid-column: 1/2;
}

.badges-container .language-wrapper,
.badges-container .badge-color-container {
    width: 60%;
}

.badges-container .language-copy-all {
    margin-left: 15px;
    padding-top: 44px;
}

.badges-container .language-copy-all #copyToAllEmptyBtn {
    margin-right: 0;
    height: 34px;
}

.badges-custom-switch .custom-switch .custom-control-label {
    letter-spacing: 0;
    line-height: 1.9em;
    font-size: 0.875rem;
}

.badges-custom-switch .custom-switch .custom-control-label::before {
    left: 0;
    background-color: #a7a9bc;
    width: 2em;
}

.badges-custom-switch .custom-switch .custom-control-label::after {
    left: 0.25em;
    background-color: #fff;
    color: var(--text-color);
    font-family: Roboto;
    font-size: 0.93em;
}

.badges-custom-switch .custom-control-input:checked ~ .custom-control-label::before {
    background-color: var(--text-color);
    border-color: #3c4a56;
}

.badges-custom-switch .custom-control-input:checked ~ .custom-control-label::after {
    transform: translate(1.2em, 0);
}

.booking-modal .category-title,
.booking-modal .product-title {
    font-size: 16px;
    color: #404e5c;
    font-weight: 500;
    margin: 10px 0;
}

.internal-product-category {
    cursor: pointer;
}

.clickable:hover,
.internal-product-category.selected,
.product-category-container.selected {
    background-color: #e5eff9;
}

.list-container span.internal-product-title {
    font-size: 14px;
    color: #404e5c;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.btn-sm.add-as-menu-window,
.btn-sm.add-product-window {
    font-size: 12px;
    color: var(--text-color);
}

.btn-sm.add-as-menu-window:focus,
.btn-sm.add-product-window:focus {
    color: #fff;
}

.internal-order-header.order-table-header {
    background: #e4e6ea;
    color: var(--text-color);
    font-weight: 500;
    border-bottom: 2px solid #d3d8dd;
    font-size: 12px;
}

.internal-order-header.order-table-header .order-table-header-container {
    background: #fff;
    border-radius: 4px;
}

.order-item-window-delete {
    cursor: pointer;
    margin-right: -25px;
}

.product-category-delete,
.product-delete {
    width: 36px;
    height: 42px;
    margin-top: 11px;
    cursor: pointer;
}

.product-category-edit,
.product-edit {
    width: 36px;
    height: 42px;
    cursor: pointer;
    margin-top: 5px;
    margin-right: 2px;
}

.product-category-actions,
.product-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
}

.info-message .icon,
.add-product-item .icon,
.add-category-item .icon {
    text-align: left;
    padding-right: 10px;
    display: flex;
}

.add-product-item .icon img,
.add-category-item .icon img {
    width: 15px;
    height: 15px;
}

.flash-info .info-message .icon img {
    width: 18px;
    height: 18px;
}

.info-message .message {
    display: inline-block;
}

.flash-info .info-message {
    background-color: #eef2fa;
    border-radius: 4px;
    color: #2e5aac;
    padding: 20px 12px;
    font-size: 16px;
    font-weight: 400;
    line-height: 18px;
    text-align: left;
    display: flex;
}

.info-message .span-info-message {
    font-weight: 500;
    margin-right: 5px;
}

.category-section,
.product-section {
    border: 1px solid #e4e6ea;
    border-radius: 4px;
    padding: 32px;
    gap: 12px;
}

.add-category-item,
.add-product-item {
    padding: 8px 20px 8px 16px;
    border: 1px solid #cdced9;
    border-radius: 4px;
    font-size: 14px;
}

.internal-product-category-footer-container,
.internal-product-footer-container {
    padding: 10px 15px;
}

.product-manage-form .form-label,
.add-new-product-form .form-label {
    font-weight: 500;
    color: var(--text-color);
}

.product-manage-form .form-control.form-select,
.internal-category-name {
    font-size: 14px;
    font-weight: 500;
    color: var(--text-color);
}

.add-new-product-form .custom-control-label {
    font-size: 14px;
    color: #404e5c;
}

.internal-product-category-modal .form-control,
.internal-product-modal .form-control,
.internal-product-category-modal .form-control:focus-visible,
.internal-product-modal .form-control:focus-visible {
    border: 1px solid #f1f2f5;
    transition: none;
}

.internal-product-category-modal .form-control:hover,
.internal-product-modal .form-control:hover {
    border: 1px solid var(--border-color);
}

.internal-product-category-modal .form-control:active,
.internal-product-category-modal .form-control:focus,
.internal-product-modal .form-control:active,
.internal-product-modal .form-control:focus {
    border: 1px solid #98c7f3;
    background: #eef6fd;
}

.arrow-icon-wrapper {
    position: relative;
}

.arrow-icon-wrapper textarea {
    position: relative;
    min-height: 50px;
}

.arrow-icon-overlay {
    position: absolute;
    bottom: 1px;
    right: 1px;
    pointer-events: none;
    background-color: #f1f2f5;
}

.arrow-icon-wrapper textarea:focus ~ .arrow-icon-overlay,
.arrow-icon-wrapper textarea:active ~ .arrow-icon-overlay {
    background-color: #eef6fd;
}

.custom-badge-333538 {
    background-color: #333538;
}

.custom-badge-196207 {
    background-color: #196207;
}

.custom-badge-3505d2 {
    background-color: #3505d2;
}

.custom-badge-389c82 {
    background-color: #389c82;
}

.custom-badge-4785ff {
    background-color: #4785ff;
}

.custom-badge-47d3ff {
    background-color: #47d3ff;
}

.custom-badge-47ed4a {
    background-color: #47ed4a;
}

.custom-badge-4a4094 {
    background-color: #4a4094;
}

.custom-badge-556a5b {
    background-color: #556a5b;
}

.custom-badge-568cbf {
    background-color: #568cbf;
}

.custom-badge-615f72 {
    background-color: #615f72;
}

.custom-badge-6cb393 {
    background-color: #6cb393;
}

.custom-badge-81b1c5 {
    background-color: #81b1c5;
}

.custom-badge-85101c {
    background-color: #85101c;
}

.custom-badge-9ab374 {
    background-color: #9ab374;
}

.custom-badge-a567ff {
    background-color: #a567ff;
}

.custom-badge-b1820a {
    background-color: #b1820a;
}

.custom-badge-b48484 {
    background-color: #b48484;
}

.custom-badge-b797c6 {
    background-color: #b797c6;
}

.custom-badge-c9c5a3 {
    background-color: #c9c5a3;
}

.custom-badge-dd6caa {
    background-color: #dd6caa;
}

.custom-badge-e2b079 {
    background-color: #e2b079;
}

.custom-badge-e47a7a {
    background-color: #e47a7a;
}

.custom-badge-ff4790 {
    background-color: #ff4790;
}

.custom-badge-ffd247 {
    background-color: #ffd247;
}

.restaurant-title-header {
    color: var(--text-color);
    font-size: 24px;
}

.card-header.restaurant-header {
    background-color: #fff;
    padding: 16px 20px 8px;
    font-size: 20px;
    font-weight: 700;
    color: #404e5c;
    border: none;
}

.card-header-icon {
    margin-bottom: 10px;
    width: 38px;
    height: 38px;
    border-radius: 4px;
    background-color: #e4e6ea;
    display: flex;
    align-items: center;
    justify-content: center;
}

.restaurant-info-header {
    border-bottom: 1px solid #e4e6ea;
}

.restaurant-info-div {
    font-size: 14px;
    color: #20272e;
    padding-top: 3px;
    padding-bottom: 16px;
}

.restaurant-info-card {
    height: 246px;
}

.basic-info-card {
    height: 389px;
}

.status-label-yes {
    color: #287d3c;
}

.status-label-no {
    color: #da1413;
}

.template-div,
.module-div {
    display: flex;
    align-items: center;
    border-bottom: 1px solid #e4e6ea;
}

.template-div .icon,
.module-div .icon {
    margin-right: 8px;
}

.templates-info-card .restaurant-info-div {
    color: #404e5c;
}

.big-cost-price {
    color: #20272e;
    font-weight: 700;
}

.low-cost-price {
    color: #929da8;
    font-weight: 700;
}

.hubspot-link,
.phone-link,
.email-link,
.no-show-link {
    font-size: 14px;
}

.user-card-icon {
    width: 24px;
    height: 24px;
    display: inline-block;
}

.hubspot-picture {
    width: 24px;
    height: 24px;
    margin-right: 10px;
}

.hubspot-picture-line::before {
    content: "";
    display: inline-block;
    width: 1.2em;
    height: 1.2em;
    background-image: url("/responsive/img/hubspot.jpg");
    background-size: contain;
    background-repeat: no-repeat;
    margin-right: 0.4em;
    vertical-align: middle;
}

.card-body.restaurant-info-div > .row:nth-child(even) .template-div,
.card-body.restaurant-info-div .module-list > .row:nth-child(even) .module-div {
    background: #f6fafe;
}

.module-list.collapsed {
    max-height: 200px;
    overflow: hidden;
    position: relative;
    transition: max-height 0.3s ease;
}

.no-show-info-card {
    height: 325px;
}

.module-list.expanded {
    max-height: none;
}

.see-more-link {
    display: block;
    margin-top: 10px;
    color: #007bff;
    cursor: pointer;
    font-size: 14px;
}

.dashboard-admin-container {
    background: #fafafb;
}

.form-control.form-select.select-role-permission,
.form-control.form-select.select-role-permission:focus-visible {
    border: 1px solid #f1f2f5;
    transition: none;
}

.form-control.form-select.select-role-permission:hover {
    border: 1px solid var(--border-color);
    border-radius: 4px;
}

.form-control.form-select.select-role-permission:active,
.form-control.form-select.select-role-permission:focus {
    border: 1px solid #bbdaf7;
}

.form-control.form-select.select-role-permission:disabled {
    background-color: #d3d8dd;
}

/* New design for form-controll */

.improved-form-elements .form-control {
    transition: none;
    border: 1px solid #f1f2f5;
    color: var(--text-color);
    font-weight: 500;
    font-size: 14px;
    background: #f1f2f5;
}

.improved-form-elements .form-control:hover {
    border: 1px solid var(--border-color);
}

.improved-form-elements .form-control:disabled {
    border: 1px solid #d3d8dd;
    background: #d3d8dd;
}

.improved-form-elements .form-label {
    font-size: 14px;
    font-weight: 500;
    color: var(--text-color);
    margin-bottom: 0;
}

.icon-button.download-booking-file,
.icon-button.delete-booking-file {
    border: none;
    display: inline-block;
    width: 32px;
    height: 32px;
}

.scrollable-files-table-container {
    overflow-y: auto;
    max-height: 480px;
}

table.dataTable th.dt-type-numeric div.dt-column-header,
table.dataTable th.dt-type-date div.dt-column-header,
table.dataTable td.dt-type-numeric div.dt-column-header,
table.dataTable td.dt-type-date div.dt-column-header {
    flex-direction: row;
}

table.dataTable th div.dt-column-header:has(span.dt-column-title:empty) {
    flex-direction: row-reverse;
}

#current-bl-table thead > tr > th div.dt-column-header {
    display: inline;
}

#current-bl-table thead > tr > th {
    padding-right: 30px;
}

.listing-dialog.ui-widget.ui-widget-content {
    border: 8px solid var(--background-color);
    padding: 16px;
    border-radius: 8px;
}

.listing-dialog .ui-dialog-buttonpane {
    justify-content: end;
}

.booking-menus-tabs .nav-tabs .nav-link {
    background-color: #fff;
    border-bottom: 1px solid #e4e6ea;
    margin-bottom: 0;
}

.booking-menus-tabs .nav-tabs .nav-link.active,
.booking-menus-tabs .nav-tabs .nav-link:hover {
    border-color: transparent;
    border-bottom: 4px solid #54a2eb;
    padding-bottom: 5px;
}

.close-online-modal .nav-tabs .nav-link,
.close-online-modal .nav-tabs .nav-link:hover,
.close-online-modal .nav-tabs .active {
    padding: 5px 15px 4px;
}

.close-online-modal .nav-tabs .nav-link:not(.active):hover {
    border-color: transparent;
    border-bottom: 1px solid #929da8;
}

.close-online-modal .nav-tabs .nav-link.active {
    padding-bottom: 1px;
}