p {
    font-size: 1em !important;
}

.food-color {
    color: #FF740D;
}

.modal-dialog-scrollable {
    max-height: unset;
}

.modal-dialog-scrollable .modal-content {
    max-height: unset;
    overflow: unset;
}

.modal-dialog-scrollable .modal-body {
    overflow-y: unset;
}

.flex-row {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

.flex-category-arrow {
    flex: 0 0 30px;
    text-align: center;
    padding: 5px 0px 0px 0px;
    font-size: 2em;
}

.flex-category-content {
    flex: 1 0 50%;
    text-align: center;
    padding: 10px;
    overflow: hidden;
}

.heading-cover {
    height: 400px;
    display: flex;
    background-image: url('https://www.live-resto.fr/img/home/cover-1.jpg');
    background-size: cover;
}

.heading-content {
    color: white;
    text-align: center;
    margin: auto;
}

.heading-content h1 {
    font-size: 2.5rem !important;
}

.content-container p {
    font-size: 1em !important;
}

.content-container {
    padding-top: 40px;
}

#carouselHomeBackground .carousel-item {
    height: 750px;

    position: relative;
}

#carouselHomeBackground .carousel-content {
    width: 90%;
    max-width: 1200px;
    height: 100%;

    display: flex;
    flex-direction: column;
    justify-content: center;

    margin: 0 auto;
    padding: 50px 0;

    position: relative;
    z-index: 10;
}

#carouselHomeBackground .carousel-content .btn {
    width: fit-content;
}

#carouselHomeBackground .carousel-content h2 {
    font-size: 3rem;
    font-weight: 700;

    color: #fff;
    text-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
}

#carouselHomeBackground .carousel-content p {
    margin-top: 24px;

    font-size: 1.5rem !important;
    font-weight: 300;

    color: #fff;
    text-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
}

#carouselHomeBackground .carousel-background {
    width: 100%;
    height: 100%;

    position: absolute;
    top: 0;
    left: 0;

    object-fit: cover;

    filter: brightness(0.8);
}

#main-search-banner {
    height: 120px !important;
    position: relative;
    width: 600px;
    top: -110px;
    margin: auto;
    background-color: white;
    z-index: 99;
}

@media (max-width: 991.98px) {
    #main-search-banner {
        height: auto !important;
        position: initial;
        width: auto;
        background-color: white;
        z-index: 99;
    }
}

/* Calendar */
.current-month {
    background-color: #f8f9fa;
}

.booking-component {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    margin: 100px 0;
}

.booking-component__container {
    width: 100%;
    max-width: 450px;

    border: 1px solid #ecedef;
    border-radius: 10px;

    overflow: hidden;

    box-shadow: rgba(0, 0, 0, 0.12) -0.0625rem 0.1875rem 0.375rem;
}

.booking-component__container-header {
    padding: 15px 10px 10px 10px;

    background-color: #f8f9fa;

    border-bottom: 1px solid #ecedef;
}

.booking-component__container-header-title {
    font-size: 1.5rem;
}

.booking-component__container-header-subtitle {
    margin: 0;
}

.booking-component__container-breadcrumb {
    display: flex;
    align-items: center;

    padding: 10px;

    border-bottom: 1px solid #ecedef;
}


.booking-component__container-breadcrumb-item {
    height: 40px;

    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1;
    gap: 5px;

    padding: 0px 10px;

    cursor: pointer;
}

.booking-component__container-breadcrumb-item:first-child {
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
}

.booking-component__container-breadcrumb-item:last-child {
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
}

.booking-component__container-breadcrumb-item.active {
    background-color: #e2e2e2;

    transition: background-color 0.3s ease;
}

.booking-component__container-breadcrumb-item.active:hover {
    background-color: #c7c7c7;
}

.booking-component__container-breadcrumb-item.current {
    color: white;
    background-color: #397427;
}

.booking-component__container-breadcrumb-item.current:hover {
    background-color: #397427;
}

.booking-component__container-breadcrumb-item svg {
    width: 20px;
    height: 20px;
}

.booking-component__container-content {
    padding: 10px;
}

.booking-component__container-content-title {
    font-size: 1.25rem;
}

.booking-component__container-content-subtitle {
    margin-top: 10px;
    padding: 10px 0;

    font-size: 1rem;

    text-align: center;

    border-top: 1px solid #ecedef;
    border-bottom: 1px solid #ecedef;
}

.booking-component__container-content-guest {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(60px, 1fr));
    gap: 10px;
}

.booking-component__container-content-guest-button {
    display: flex;
    align-items: center;
    justify-content: center;

    padding: 10px 20px;

    background-color: #ececec;

    border: none;
    border: 1px solid #888888;
    border-radius: 5px;

    transition: background-color .2s ease-in-out;
}

.booking-component__container-content-guest-button:hover {
    background-color: #bdbdbd;
}

.booking-component__container-content-guest-more {
    width: 100%;

    margin-top: 10px;
    padding: 10px 20px;

    color: #fff;
    background-color: #397427;

    font-weight: 600;

    border: none;
    border: 1px solid #143517;
    border-radius: 5px;

    transition: background-color .2s ease-in-out;
}

.booking-component__container-content-guest-more:hover {
    background-color: #265222;
}

.calendar__year {
    display: flex;
    align-items: center;
    justify-content: center;
}

.calendar__year-button {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 34px;
    height: 34px;

    background-color: #fff;

    border: none;
}

.calendar__year-text {
    font-size: 1.25rem;
    font-weight: 600;
}

.calendar__month {
    margin-top: 10px;
}

.calendar__month-select {
    width: 100%;

    padding: 10px;

    border: 1px solid #a1a1a1;
    border-radius: 5px;
}

table.calendar__day-table {
    width: 100%;

    margin-top: 10px;

    border-collapse: collapse;
}

table.calendar__day-table th {
    padding: 10px;

    font-weight: 600;

    text-align: center;

    border-bottom: 1px solid #a1a1a1;
}

table.calendar__day-table td {
    padding: 10px;

    color: #464646;
    background-color: #c2c2c2;

    text-align: center;

    border-bottom: 1px solid #a1a1a1;

    cursor: not-allowed;
}

table.calendar__day-table td.current-month {
    position: relative;
    z-index: 10;

    background-color: #ffffff;

    font-weight: 600;

    transition: background-color 0.3s ease;

    cursor: pointer;
}

table.calendar__day-table td.current-month:hover {
    color: #fff;
    background-color: #397427;
}

.reservation-form {
    display: flex;
    flex-direction: column;
}

.reservation-form__group {
    display: flex;
    flex-direction: column;
    gap: 4px;

    margin-top: 10px;
}

.reservation-form__group label {
    margin: 0;

    font-size: .8rem;
}

.reservation-form__group>input,
.reservation-form__group textarea {
    padding: 10px;

    border: 1px solid #a1a1a1;
    border-radius: 5px;
}

.reservation-form__group .reservation-form__input--phone {
    width: 100%;

    margin: 0;
}

/* #vue-orders-payments */
.vue-orders-payments {
    padding: 50px 0;
}

.vue-orders-payments__container {
    width: 90%;
    max-width: 1200px;

    display: flex;
    flex-direction: column;
    gap: 50px;

    margin: 0 auto;

    @media screen and (min-width: 768px) {
        flex-direction: row;
    }
}

.vue-orders-payments__payment-panel {
    flex: 1;
}

.vue-orders-payments__title-container {
    margin-bottom: 80px;
}

.vue-orders-payments__title {
    color: #000;

    font-size: 24px;
    font-weight: 600;
}

.vue-orders-payments__payment-methods {
    display: flex;
    flex-direction: column;
}

.vue-orders-payments__payment-methods-title-container {
    margin-bottom: 20px;
}

.vue-orders-payments__payment-methods-title {
    color: #000;

    font-size: 1.5rem;
    font-weight: 800;
}

.vue-orders-payments__payment-methods-subtitle {
    color: #737373;

    font-size: 1.125rem !important;
    font-weight: 400;
}

.vue-orders-payments__payment-methods-list {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: 20px;

    margin-bottom: 30px;

    @media screen and (min-width: 768px) {
        grid-template-columns: repeat(2, 1fr);
    }
}

.vue-orders-payments__payment-methods-list-title {
    margin-bottom: 20px;

    color: #000;

    font-size: 1.125rem !important;
    font-weight: 800;
}

.vue-orders-payments__payment-methods-list-item {
    display: flex;
    align-items: center;
    justify-content: center;

    color: #FF740D;

    font-size: 16px;
    font-weight: 600;

    border: 2px solid #FF740D;
    border-radius: 5px;

    cursor: pointer;
}

.vue-orders-payments__payment-methods-list-item:hover {
    background: #f6f6f6;
}

.vue-orders-payments__payment-methods-list-item.active {
    color: #FF740D;
    background: #f6f6f6;
}

.vue-orders-payments__payment-methods-list-item-name {
    flex: 1;
    padding: 25px 10px;
    text-align: center;
}

.vue-orders-payments__payment-methods-list-item-subtitle {
    font-size: 0.8em;
    color: #2e2e2e;
}

.vue-orders-payments__payment-methods-continue-button .btn {
    border-radius: 4px !important;
}

.vue-orders-payments__modal {
    width: 100vw;
    height: 100vh;

    display: flex;
    align-items: center;
    justify-content: center;

    position: fixed;
    z-index: 9999;
    top: 0;
    left: 0;
}

.vue-orders-payments__modal-container {
    width: 90%;
    max-width: 500px;

    display: flex;
    flex-direction: column;
    gap: 30px;

    padding: 15px;

    position: relative;
    z-index: 9999999;

    color: #000;
    background: #fff;

    border-radius: 5px;
}

.vue-orders-payments__modal-header {
    display: flex;
    justify-content: space-between;
}

.vue-orders-payments__modal-header-title {
    padding-top: 20px;
    padding-left: 15px;
}

.vue-orders-payments__modal-header-close svg {
    width: 26px;
    height: 26px;

    padding: 2px;

    color: #FF740D;
    background: transparent;

    border: 2px solid #FF740D;
    border-radius: 4px;

    cursor: pointer;

    transition: color 0.3s ease, background 0.3s ease;
}

.vue-orders-payments__modal-header-close svg:hover {
    color: #fff;
    background: #FF740D;
}

.vue-orders-payments__modal-body {
    display: flex;

    padding: 0 15px 15px 15px;
}

.vue-orders-payments__modal-body-input {
    display: flex;
    align-items: center;
    gap: 10px;
}

.vue-orders-payments__modal-body input {
    height: 40px;

    flex: 1;

    padding: 0 10px;

    border: 1px solid #d3d3d3;
    border-radius: 5px;
}

.vue-orders-payments__modal-body-button {
    height: 40px;

    display: flex;
    align-items: center;
    justify-content: center;

    margin-top: 10px;
    padding: 10px 20px;

    color: #FF740D;
    background: #fff;

    border: 2px solid #FF740D;
    border-radius: 5px;

    cursor: pointer;

    transition: color 0.3s ease, background 0.3s ease;
}

.vue-orders-payments__modal-body-button:hover {
    color: #fff;
    background: #FF740D;
}

.vue-orders-payments__modal-body-button-svg {
    width: 40px;
    height: 40px;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 10px;

    color: #fff;
    background: #7BA640;

    border: none;
    border-radius: 5px;

    cursor: pointer;
}

.vue-orders-payments__modal-body-button-svg svg {
    width: 100%;
    height: 100%;
}

/* .vue-orders-payments__modal-header-close svg {
    width: 100%;
    height: 100%;
  } */

.vue-orders-payments__modal-background {
    width: 100%;
    height: 100%;

    background: rgba(0, 0, 0, 0.5);

    position: absolute;
    z-index: 10;
    top: 0;
    left: 0;
}

.vue-orders-payments__payment-details {
    width: 100%;
    height: fit-content;

    display: flex;
    flex-direction: column;
    gap: 10px;

    position: fixed;
    z-index: 500;
    left: 0;
    bottom: 0;

    padding: 20px 30px;

    color: #000;
    background: #F9F9F9;

    border-top: 2px solid #CDCDCD;

    @media screen and (min-width: 768px) {
        width: 40%;
        max-width: 500px;

        position: relative;

        border: 2px solid #CDCDCD;
        border-radius: 5px;
    }
}

.vue-orders-payments__payment-details-line {
    width: 100%;
    height: 1px;

    background: #AEC68E;

    border-radius: 999px;
}

.vue-orders-payments__payment-details-total-amount {
    margin-bottom: 15px;

    text-align: center;
}

.vue-orders-payments__payment-details-total-amount-title {
    font-size: 16px;
    font-weight: 400;
}

.vue-orders-payments__payment-details-total-amount-value {
    margin-top: 15px;

    color: #7BA640;

    font-size: 40px;
    font-weight: 600;
}

.vue-orders-payments__payment-details-total-amount-secure-payment {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;

    margin-top: 25px;
}

.vue-orders-payments__payment-details-total-amount-secure-payment svg {
    width: 14px;
    height: 14px;

    color: #088E15;
}

.vue-orders-payments__payment-details-order-total {
    display: flex;
    align-items: center;
    justify-content: space-between;

    margin-top: 15px;
}

.vue-orders-payments__payment-details-payment-done-title {
    margin-bottom: 15px;

    font-size: 16px;
}

.vue-orders-payments__payment-details-payment-done-list {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.vue-orders-payments__payment-details-payment-done-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;

    position: relative;
}

.vue-orders-payments__payment-details-payment-done-item-gray span {
    position: relative;
    flex: 1;

    color: #000000;
}

.vue-orders-payments__payment-details-payment-done-item-icon-pending {
    color: #FFC107;

    animation: loading 1s infinite;
}

@keyframes loading {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

.vue-orders-payments__payment-details-payment-done-item-icon-unpaid {
    color: #FF0000;
}

.vue-orders-payments__payment-details-payment-done-item-icon-paid {
    color: #088E15;
}

.vue-orders-payments__payment-details-payment-done-item-icon {
    display: flex;
    align-items: center;
    justify-content: center;

    position: absolute;
    top: 0;
    left: -4px;

    transform: translate(-100%, 25%);
}

.vue-orders-payments__payment-details-payment-done-item-icon span {
    display: flex;
    align-items: center;
    justify-content: center;
}

.vue-orders-payments__payment-details-payment-done-item-icon svg {
    width: 15px;
    height: 15px;
}

.vue-orders-payments__payment-details-payment-done-item-trash {
    width: 20px;
    height: 20px;

    display: flex;
    align-items: center;
    justify-content: center;

    position: absolute;
    right: -5px;
    top: 50%;

    padding: 2px;

    transform: translate(100%, -50%);

    color: #ffffff;
    background-color: #ff5100;

    border-radius: 4px;

    cursor: pointer;
}

.vue-orders-payments__payment-details-amount-left {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.vue-orders-payments__payment-details-amount-left-title--bold {
    font-weight: 600;
}

.vue-orders-payments__payment-details-amount-left-value {
    font-weight: 600;
}

.vue-orders-payments__payment-details-payment-done-item-reason {
    margin-top: 5px;
    margin-bottom: 5px;

    color: #4A4A4A;

    font-size: 12px;
    font-weight: 400;
}

.vue-orders-payments__payment-details-payment-done-item-amount {
    font-weight: 600;
}

.vue-orders-payments__iframe {
    display: none;
}

.vue-orders-payments__modal--input .vue-orders-payments__modal-container {
    gap: 15px;
}

.vue-orders-payments__modal--input .vue-orders-payments__modal-body {
    gap: 15px;
}

.vue-orders-payments__modal--input .vue-orders-payments__modal-body-input {
    flex: 1;
}

.vue-orders-payments__modal--input .vue-orders-payments__modal-body-button {
    margin-top: unset;
}

.vue-orders-payments__modal--input .vue-orders-payments__modal-body input {
    height: 100%;

    border: 1px solid #FF740D;
    border-radius: 999px;
}

.login-hide {
    display: none;
}

td.current-month.past-day {
    color: #a1a1a1;

    text-decoration: line-through;

    cursor: not-allowed !important;
}

td.current-month.past-day:hover {
    background-color: #c2c2c2 !important;
}

/* td.current-month:not(.past-day)::after {
    content: '';

    width: 26px;
    height: 26px;

    position: absolute;
    z-index: -1;
    top: 50%;
    left: 50%;

    border: 1px solid #397427;
    border-radius: 50%;

    transition: border-color 0.3s ease;

    transform: translate(-50%, -50%);
} */

td.current-day {
    color: #fff !important;
}

td.current-day::after {
    content: '';

    width: 26px;
    height: 26px;

    position: absolute;
    z-index: -1;
    top: 50%;
    left: 50%;

    background-color: #397427;

    border-radius: 50%;

    transform: translate(-50%, -50%);
}

/* vue-reservation-details */

.reservation-details {
    position: relative;
}


.reservation-details__header-images {
    width: 100%;
    max-width: 100vw;
    height: 400px;

    display: flex;
    align-items: center;
    justify-content: center;

    overflow: hidden;
}

.reservation-details__header-image {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.reservation-details__body {
    width: 90%;
    max-width: 1200px;

    display: flex;
    flex-direction: column;
    gap: 20px;

    margin: 0 auto;
    padding: 10px;

    @media screen and (min-width: 768px) {
        padding: 20px;

        justify-content: space-between;
        flex-direction: row;
    }

    @media screen and (min-width: 992px) {
        padding: 30px;
    }

    @media screen and (min-width: 1200px) {
        padding: 40px;
    }
}

.reservation-details__body-left {
    flex: 1;

    overflow: hidden;
}

.reservation-details__body-title {
    margin: 0;
    margin-top: 20px;

    font-size: 2rem;
    font-weight: 600;
}

.reservation-details__body-header-type {
    display: inline-block;

    margin-top: 20px;
    margin-bottom: 10px;
    padding: 10px;

    color: #f3f3f3;
    background-color: #303030;

    font-weight: 600;

    border-radius: 5px;

    @media screen and (min-width: 768px) {
        margin-top: 0;
    }
}

.reservation-details__body-header-title {
    font-size: 2rem;
    font-weight: 600;
}

.reservation-details__body-header-icons {
    display: flex;
    flex-direction: column;
    gap: 10px;

    margin-top: 20px;
    margin-bottom: 20px;
}

.reservation-details__body-header-icons-item {
    display: flex;
    align-items: center;
    gap: 5px;

    padding: 10px;

    color: hsl(174, 100%, 15%);
    background-color: hsl(173, 31%, 95%);

    border-radius: 5px;

    cursor: pointer;

    transition: color 0.3s ease, background-color 0.3s ease;
}

.reservation-details__body-header-icons-item:hover {
    color: hsl(174, 100%, 15%) !important;
    background-color: hsl(173, 31%, 85%);
}

.reservation-details__body-header-icons-item-icon {
    width: 20px;
    height: 20px;

    display: flex;
    align-items: center;
    justify-content: center;
}

.reservation-details__body-header-icons-item-icon svg {
    width: 100%;
    height: 100%;
}

.reservation-details__body-header-icons-item-text {
    font-size: 1rem;
}

.reservation-details__body-header-icons--grey .reservation-details__body-header-icons-item {
    color: hsl(0, 0%, 26%) !important;
    background-color: hsl(0deg 0% 93.06%);
}

.reservation-details__body-header-icons--grey .reservation-details__body-header-icons-item:hover {
    color: hsl(0, 0%, 26%) !important;
    background-color: hsl(0deg 0% 85.06%);
}

.reservation-details__body-header-icons--grey .reservation-details__body-header-icons-item-icon svg {
    color: hsl(0, 0%, 26%) !important;
}

.reservation-details__body-right {
    display: none;

    @media screen and (min-width: 768px) {
        display: flex;
        flex-direction: column;
        gap: 20px;

        flex: 1;
    }
}

.reservation-details__mobile {
    width: 100%;
    height: 100vh;

    display: flex;
    align-items: center;
    justify-content: center;

    position: fixed;
    z-index: 1000;
    top: 0;
    left: 0;

    @media screen and (min-width: 768px) {
        display: none;
    }
}

.reservation-details__mobile-background {
    width: 100%;
    height: 100%;

    background-color: rgba(0, 0, 0, 0.5);

    position: absolute;
    top: 0;
    left: 0;
}

.reservation-details__mobile-fixed {
    width: 100%;

    position: fixed;
    bottom: 0;
    left: 0;
    z-index: 100;

    padding: 10px;

    background-color: #fff;

    border-top-left-radius: 10px;
    border-top-right-radius: 10px;

    box-shadow: rgba(0, 0, 0, 0.12) 0px -0.0625rem 0.375rem;

    @media screen and (min-width: 768px) {
        display: none;
    }
}

.reservation-details__mobile-fixed-button {
    width: 100%;

    padding: 10px;

    color: #fff;
    background-color: #397427;

    border: none;
    border-radius: 5px;

    cursor: pointer;
}

.reservation-details__body-header-booking {
    display: flex;
    align-items: center;

    margin-top: 20px;

    @media screen and (min-width: 768px) {
        display: none;
    }
}

.reservation-details__body-header-booking-button {
    width: 100%;

    margin-bottom: 20px;
    padding: 10px 20px;

    color: #fff;
    background-color: #397427;

    border: none;
    border-radius: 5px;

    cursor: pointer;
}

.reservation-details__body-header-booking-button:hover {
    background-color: #265222;
}

.booking-component--slim {
    max-width: 400px;
    max-height: 90vh;

    margin: 0;
    margin-top: -100px;
}

.booking-component--slim .booking-component__container {
    width: 100%;

    background-color: #fff;

    overflow-y: auto;
}

.sticky-booking {
    position: sticky;
    top: 20px;
    z-index: 100;
}

.reservation-details__body-menu {
    display: flex;
    flex-direction: column;
    gap: 30px;
}

.reservation-details__body-menu-category-title {
    font-size: 1.5rem;
    font-weight: 600;
}

.reservation-details__body-menu-items {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.reservation-details__body-menu-item {
    display: flex;
    align-items: center;
    gap: 10px;

    padding: 10px;

    color: hsl(174, 100%, 15%);
    background-color: hsl(173, 31%, 95%);

    border-radius: 5px;

    cursor: pointer;

    transition: color 0.3s ease, background-color 0.3s ease;
}

.reservation-details__body-menu-item-image {
    width: 100px;
    height: 100px;

    display: flex;
    align-items: center;
    justify-content: center;

    object-fit: cover;
}

.reservation-details__body-menu-item-title {
    font-size: 1rem;
}

.reservation-details__body-menu-item-description {
    font-size: 0.8rem;
}

.reservation-details__body-header-cuisine {
    display: flex;
    align-items: center;
    gap: 5px;

    color: #696969;
}

.reservation-details__body-nav {
    width: 100%;

    display: flex;
    align-items: center;

    margin-top: 20px;
    margin-bottom: 20px;
}

.reservation-details__body-nav-item {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1;

    padding: 10px;

    color: #acacac;

    font-size: 1rem;

    border-bottom: 2px solid #acacac;

    cursor: pointer;

    transition: color 0.3s ease, border-bottom 0.3s ease;
}

.reservation-details__body-nav-item:hover {
    color: #5f5f5f;
    border-bottom: 2px solid #5f5f5f;
}

.reservation-details__body-nav-item--active {
    color: #397427;
    border-bottom: 2px solid #397427;
}

.reservation-details__body-nav-item--active:hover {
    color: #397427;
    border-bottom: 2px solid #397427;
}

.reservation-details__body-menu-category-items {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.reservation-details__body-menu-category-item {
    display: flex;
    gap: 10px;

    padding: 10px;

    border: 1px solid #bad6cd;
    border-radius: 5px;
}

.reservation-details__body-menu-category-item-image {
    width: 100px;
    height: 100px;

    display: flex;
    align-items: center;
    justify-content: center;
}

.reservation-details__body-menu-category-item-image img {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.reservation-details__body-menu-category-item-details {
    display: flex;
    flex-direction: column;
    flex: 1;
}

.reservation-details__body-menu-category-item-details-title {
    margin: 0;

    font-size: 1rem;
    font-weight: 600;
}

.reservation-details__body-menu-category-item-details-description {
    font-size: 0.8rem;
}

/* REFONT */
.btn {
    padding: 10px 30px;

    border: 3px solid transparent;
    border-radius: 999px;
}

.btn-orange {
    color: #FF740D;
    background-color: transparent;

    border-color: #FF740D;

    font-size: 1.25rem;
    font-weight: 600;

    text-transform: uppercase;
}

.btn-orange:hover {
    color: #fff !important;
    background-color: #FF740D !important;
}

#main-search-banner {
    top: 0;
}

.el-input__wrapper {
    padding: unset !important;

    border: 3px solid #FF740D;
    border-radius: 999px;

    box-shadow: unset !important;
}

.search-geocomplete {
    background-color: unset !important;
}

.btn-link {
    color: #FF740D !important;
}

.btn-link:hover {
    color: #c1590d !important;
}

.btn-link i {
    color: #FF740D !important;
}

.btn-link2 {
    color: #0085ff !important;
}

.btn-link2:hover {
    color: #0056b3 !important;

    text-decoration: underline;
}

.all-flavor__container {
    padding-top: 50px;
}

.all-flavor__title {
    font-size: 2rem;
    font-weight: 600;

    text-align: center;
}

.all-flavor__body {
    display: flex;
    flex-direction: column;
    gap: 40px;

    margin-top: 50px;

    @media screen and (min-width: 768px) {
        flex-direction: row;
        gap: 20px;
    }
}

.all-flavor__item {
    display: flex;
    flex-direction: column;
    gap: 20px;
    flex: 1;
}

.all-flavor__item img {
    width: 100%;
    height: 140px;

    object-fit: contain;
}

.all-flavor__item-title {
    font-size: 1.5rem;
    font-weight: 600;

    text-align: center;
}

.pt-50 {
    padding-top: 50px;
}

#main-search-banner {
    height: unset !important;
}

.carousel-sector__container {
    padding-top: 50px;
}

.carousel-sector__header {
    display: flex;
}

.carousel-sector__left {
    flex: 1;
}

.carousel-sector__title {
    font-size: 2rem;
    font-weight: 600;
}

/* .carousel-sector__list {
    display: flex;
    gap: 20px;
} */

.carousel-sector__item {
    width: fit-content;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 5px 15px;

    color: #FF740D;
    background-color: #fff;

    border: 3px solid #FF740D;
    border-radius: 999px;

    /* text-wrap: nowrap; */

    cursor: pointer;

    transition: color 0.3s ease, background-color 0.3s ease;
}

.carousel-sector__item:hover {
    color: #fff !important;
    background-color: #FF740D;
}

.nearby-carousel .section-title span {
    color: #FF740D !important;
}

.restaurant-carousel-item {
    width: 250px !important;

    border: 1px solid #0F0F0F1A;
    border-radius: 5px;

    overflow: hidden;
}

.restaurant-carousel-item__badge {
    display: flex;
    align-items: center;
    justify-content: center;

    top: 10px !important;
    left: 10px !important;

    padding: 5px 10px;

    color: #fff;
    background-color: #FF740D;

    border-radius: 999px;
}

.restaurant-carousel-item__content {
    width: 100%;

    padding: 10px;

    background-color: #F9F9F9;
}

.recruitment__body {
    display: flex;
    flex-direction: column;
    gap: 20px;

    @media screen and (min-width: 768px) {
        flex-direction: row;
    }
}

.recruitment__item {
    min-height: 400px;

    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    flex: 1;

    position: relative;

    border-radius: 5px;

    overflow: hidden;
}

.recruitment__item-img {
    width: 100%;
    height: 100%;

    position: absolute;
    top: 0;
    left: 0;
}

.recruitment__item-img img {
    width: 100%;
    height: 100%;

    object-fit: cover;

    filter: brightness(0.8);
}

.recruitment__item-content {
    position: relative;
    z-index: 10;

    padding: 20px;
    padding-top: 100px;
    padding-bottom: 30px;
}

.recruitment__item-title {
    color: #fff;

    font-size: 2rem;
    font-weight: 600;
}

.recruitment__item-text {
    color: #fff;

    font-size: 1rem;
}

.recruitment .btn {
    padding: 5px 15px;

    font-size: 1rem;

    border: 1px solid transparent;
    border-radius: 999px;
}

.recruitment .btn.btn-white {
    color: #ffffff;
    background-color: transparent;

    border-color: #ffffff;
}

.recruitment .btn.btn-white:hover {
    color: #ffffff !important;
}

.app-footer__container {
    display: flex;
    justify-content: center;
    gap: 50px;

    padding-top: 50px;
    padding-bottom: 50px;
}

.app-footer__image {
    display: none;

    order: 1;

    @media screen and (min-width: 768px) {
        display: block;
    }
}

.app-footer__content {
    order: 2;
}

.app-footer__title {
    font-size: 2.5rem;
    font-weight: 600;
}

.app-footer__subtitle {
    margin-top: 24px;

    font-size: 1.5rem;
    font-weight: 600;
}

.app-footer__text {
    margin-top: 24px;

    font-size: 1rem;
}

.app-footer__buttons {
    display: flex;
    gap: 20px;
}

.btn-green {
    color: #fff !important;
    background-color: #FF740D !important;
}

.btn-green:hover {
    color: #fff !important;
    background-color: #d1620e !important;
}

.carousel-content .btn {
    font-size: 1.25rem;
    text-transform: uppercase;
}

.top-logo img {
    height: 30px;

    object-fit: contain;
}

.footer-logo img {
    height: 30px;
}

.carousel-sector__right {
    display: flex;
}

.footer {
    margin-top: 0 !important;
    padding: 50px 0 20px 0;

    background-color: #F9F9F9;

    border-top: 3px solid #FF740D;
}

.footer__container {
    width: 90%;
    max-width: 1200px;

    display: flex;
    flex-direction: column;
    gap: 20px;

    margin: 0 auto;
}

.footer__top {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 45px;

    @media screen and (min-width: 768px) {
        flex-direction: row;
        justify-content: space-between;
        gap: 20px;
    }
}

.footer-logo img {
    width: 100%;
    height: 50px;

    object-fit: contain;
}

.footer__newsletter {
    width: 100%;

    @media screen and (min-width: 768px) {
        width: 50%;
    }
}

.sub-footer-app {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;

    @media screen and (min-width: 768px) {
        flex-direction: row;
        align-items: flex-start;
    }
}

.sub-footer-app img {
    width: 100%;
    max-width: 150px;
}

.sub-footer-nav {
    text-align: center;

    @media screen and (min-width: 768px) {
        text-align: left;
    }
}

.sub-footer-nav h6 {
    color: #FF740D;

    font-size: 1.25rem;
    font-weight: 600;
}

.sub-footer-nav a {
    color: #FF740D;
}

.sub-footer-nav a:hover {
    color: #FF740D !important;

    text-decoration: underline;
}

.footer__newsletter-wrap {
    display: flex;
    gap: 10px;
}

.text-underline {
    text-decoration: underline;
}

.user-nav {
    flex: 1;
    display: flex;
    align-items: stretch;
    justify-content: flex-end;

    padding: 10px 0;
}

.user-nav__list {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 30px;

    margin: 0;
}

.user-nav__item--cart {
    position: relative;
}

.user-nav__item-badge {
    width: 14px;
    height: 14px;

    display: flex;
    align-items: center;
    justify-content: center;

    position: absolute;
    top: -5px;
    right: -5px;

    color: #fff;
    background-color: #FF740D;

    font-size: 0.6rem;

    border-radius: 50%;
}

.user-nav__icon {
    width: 24px;
    height: 24px;

    object-fit: contain;

    @media screen and (min-width: 768px) {
        width: 30px;
        height: 30px;
    }
}

#top-navigation {
    width: 100%;
    max-width: 1200px;

    margin: 0 auto;
    align-items: center;

    @media screen and (min-width: 768px) {
        width: 90%;
    }
}
.draft-orders {
    width: 100%;
    max-width: 1200px;
    @media screen and (min-width: 768px) {
        width: 90%;
    }

    margin: 0 auto;
    display: flex;
    align-items: center; /* Centre verticalement le SVG et le texte */
    gap: 15px; /* Espace entre le SVG et le texte */
    padding: 15px; /* Padding pour l'alerte */
}

.icon-container {
    flex: 0 0 auto; /* Le SVG prend uniquement l'espace nécessaire */
}

.text-container {
    flex: 1; /* Le texte prend tout l'espace restant */
}

.user-nav .with-icons a {
    padding-left: 25px;
}

.user-nav__drawer {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.user-nav__drawer a {
    background-size: contain;
}

.vue-orders-payments__modal-body-label {
    display: flex;
    align-items: center;

    font-size: 1rem;
    font-weight: 400;
}

.vue-orders-payments__payment-methods-continue-button--disabled {
    cursor: not-allowed;
}

.vue-orders-payments__payment-methods-continue-tooltip {
    display: flex;
    align-items: center;
    justify-content: center;

    position: fixed;
    z-index: 10;
    top: 50%;
    left: 50%;

    padding: 10px;

    color: #fff;
    background-color: #FF740D;

    text-align: center;

    border-radius: 5px;

    transform: translate(-50%, -50%);

    pointer-events: none;
}

.vue-orders-payments__payment-methods-continue-tooltip::after {
    content: '';

    width: 0;
    height: 0;

    position: absolute;
    top: 0;
    left: 50%;

    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 10px solid #FF740D;

    transform: translateX(-50%) translateY(-100%);
}

.next-availability {
    position: absolute;
    top: 5px;
    left: 5px;
    font-size: 0.9em;
    padding: 6px;
}

.el-breadcrumb__item a {
    color: #CDCDCD !important;

    font-size: 1rem;
}

.el-breadcrumb__item--restaurant {
    color: #FF740D !important;

    font-size: 1rem;
    font-weight: 600;
}

.img-thumbnail {
    border: 1px solid #FF740D;
}

.merchant-details__title {
    font-size: 2rem;
    font-weight: 600;
}

.merchant-details__rating * {
    color: #FF740D !important;
}

.components-top-category {
    background-color: #F9F9F9;

    border-top: 3px solid #FF740D;
    border-bottom: 3px solid #FF740D;
}

.components-top-category__item {
    color: #FF740D !important;
}

.category-owlcarousel .nav-link.active:after {
    border-bottom: 3px solid #FF740D;
}

.menu-data__category-name {
    font-size: 1.75rem;
}

.card-item {
    min-height: 125px;

    display: flex;
    align-items: stretch;

    border: 1px solid #CDCDCD;
    border-radius: 10px;

    overflow: hidden;
}

.card-item__container {
    display: flex;
    align-items: stretch;
    flex: 1;
}

.card-item__picture {
    width: 35%;
    min-width: 125px;
}

.card-item__picture img {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.card-item__details {
    display: flex;
    flex: 1;

    position: relative;
}

.card-item__details-container {
    display: flex;
    flex-direction: column;
    flex: 1;

    padding: 20px 30px;
}

.card-item__title {
    margin: 0;

    font-size: 1rem;
    font-weight: 600;
}

.card-item__description {
    margin-top: 10px;

    font-size: 0.8rem;
}

.card-item__price {
    margin-top: 10px;
    margin-bottom: 32px;
}

.card-item__price * {
    font-size: 0.8rem;
}

.card-item__action {
    position: absolute;
    bottom: 10px;
    right: 10px;
}

#components-merchant-services .btn {
    border-radius: 10px !important;
}

#components-merchant-services .btn.active {
    color: #fff;
    background-color: #FF740D;

    /*border-color: #FF740D;*/
}

.schedule-order {
    padding-bottom: 25px;
}

.schedule-order__container {
    display: flex;
    justify-content: center;

    position: relative;

    color: #fff;
    background-color: #FF740D;

    border-radius: 10px;

    overflow: hidden;
}

.schedule-order__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1;

    position: absolute;
}

.schedule-order__icon--left {
    left: -999px;
    top: 50%;

    transform: rotate(15deg) scaleX(-1) translateY(-50%);

    @media screen and (min-width: 768px) {
        left: -10%;
    }

    @media screen and (min-width: 990px) {
        left: 10px;
    }
}

.schedule-order__icon--right {
    right: 999px;
    top: 50%;

    transform: rotate(-15deg) translateY(-50%);

    @media screen and (min-width: 768px) {
        right: -10%;
    }

    @media screen and (min-width: 990px) {
        right: 10px;
    }
}

.schedule-order__content {
    display: flex;
    flex-direction: column;
    justify-content: center;

    padding: 20px;

    text-align: center;
}

.schedule-order__title {
    font-size: 1.5rem;
    font-weight: 600;
}

.schedule-order__text {
    margin: 0;

    font-size: 1rem;
}

.schedule-order__text a {
    color: #fff;

    font-weight: 600;
}

.schedule-order__text a:hover {
    color: #fff !important;

    text-decoration: underline;
}

.informations-section {
    margin: 10px 0;

    display: flex;
    align-items: center;
    gap: 10px;
}

.informations-section svg {
    width: 36px;
    height: 36px;

    cursor: pointer;
}

.savestore-component {
    cursor: pointer;
}

.modal-details {
    width: 100%;
    height: 100vh;

    position: fixed;
    z-index: 1000;
    top: 0;
    left: 0;
}

.modal-details__container {
    width: 100%;
    height: 100%;

    display: flex;
    align-items: center;
    justify-content: center;

    position: relative;
}

.modal-details__background {
    width: 100%;
    height: 100%;

    position: absolute;
    z-index: 10;

    background-color: rgba(0, 0, 0, 0.5);
}

.modal-details__modal {
    width: 90%;
    max-width: 500px;
    max-height: 90vh;

    position: relative;
    z-index: 11;

    padding: 20px 30px;

    background-color: #fff;

    border-radius: 10px;

    overflow-y: auto;
    overflow-x: hidden;
}

.modal-details__modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.modal-details__modal-title {
    font-size: 1.5rem;
    font-weight: 600;
}

.modal-details__modal-title i {
    margin-left: 10px;

    color: #FF740D;
}

.modal-details__modal-close {
    width: 30px;
    height: 30px;

    display: flex;
    align-items: center;
    justify-content: center;

    position: absolute;
    top: 10px;
    right: 10px;

    color: #fff;
    background-color: #FF740D;

    border: none;
    border-radius: 50%;

    cursor: pointer;

    transition: background-color 0.3s ease;
}

.modal-details__modal-close:hover {
    background-color: #ca6517;
}

.modal-details__modal-close svg {
    width: 100%;
    height: 100%;
}

.modal-details__modal-nav {
    width: 90%;

    display: flex;

    margin: 0 auto;
    margin-top: 20px;
}

.modal-details__modal-nav-item {
    padding: 5px 15px;

    font-size: 1.125rem;
    font-weight: 600;

    border-bottom: 3px solid transparent;
    border-radius: 2px;

    cursor: pointer;

    transition: border 0.3s ease;
}

.modal-details__modal-nav-item:hover {
    border-bottom: 3px solid #ff760d75;
}

.modal-details__modal-nav-item.active {
    border-color: #FF740D;
}

.modal-details__modal-content-container {
    display: flex;
    flex-direction: column;
    gap: 20px;

    padding-top: 20px;
}

.modal-details__modal-content-item-title {
    display: flex;
    align-items: center;
    gap: 10px;

    margin-bottom: 10px;

    font-size: 1.25rem;
    font-weight: 600;
}

.modal-details__modal-content-item-title svg {
    width: 24px;
    height: 24px;
}

.modal-details__modal-content-item--tags .modal-details__modal-content-item-content {
    display: flex;
    gap: 10px;
}

.modal-details__modal-content-item--tags .modal-details__modal-content-item-content span {
    padding: 5px 10px;

    color: #fff;
    background-color: #FF740D;

    border-radius: 999px;
}

.modal-details__modal-content-item-review {
    padding: 15px;

    border: 2px solid #CDCDCD;
    border-radius: 5px;
}

.modal-details__modal-content-item-review-header {
    display: flex;
    align-items: center;
    gap: 15px;
}

.modal-details__modal-content-item-review-header-title {
    font-size: 1rem;
    font-weight: 600;
}

.modal-details__modal-content-item-review-header-rating-stars {
    display: flex;
    align-items: center;
    gap: 5px;
}

.modal-details__modal-content-item-review-header-rating-stars i {
    color: #FF740D;

    font-size: 1rem;
}

.modal-details__modal-content-item-review-subheader-date {
    font-size: 0.75rem;
}

.modal-details__modal-content-item-content {
    padding: 15px;

    border: 2px solid #CDCDCD;
    border-radius: 5px;
}

.modal-details__modal-content-item-content--reviews {
    display: flex;
    flex-direction: column;
    gap: 15px;

    margin-top: 25px;

    border: none;
}

.modal-details__modal-content-item--tags .modal-details__modal-content-item-content {
    padding: 0;

    border: none;
}

.modal-details__modal-content-item-content-loadmore {
    display: flex;
    align-items: center;
    justify-content: center;

    margin-top: 15px;
    padding: 10px;

    color: #FF740D;
    background-color: #fff;

    font-weight: 600;

    border: 2px solid #FF740D;
    border-radius: 5px;


    cursor: pointer;

    transition: color 0.3s ease, background-color 0.3s ease;
}

.modal-details__modal-content-item-content-loadmore:hover {
    color: #fff;
    background-color: #FF740D;
}

.modal-details__modal-content-item-header {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 30px;
}

.modal-details__modal-content-item-header-title {
    display: flex;
    flex-direction: column;

    text-align: center;
}

.modal-details__modal-content-item-header-separator {
    width: 2px;
    height: 70px;

    background-color: #000;
}

.modal-details__modal-content-item-header-title-rating {
    font-size: 1.25rem;
    font-weight: 600;
}

.modal-details__modal-content-item-header-rating {
    color: #FF740D;

    font-size: 3.375rem;
    font-weight: 600;
}

.modal-details__modal-content-item-header-review-count-title {
    display: flex;
    align-items: center;
    gap: 10px;

    color: #FF740D;

    font-size: 2rem;
}

.modal-details__modal-content-item--description .modal-details__modal-content-item-content {
    padding: 0;

    border: none;
}

.modal-details__modal-content-item-content p {
    margin: 0;
}

.modal-details__modal-content-item-content a {
    color: #FF740D;
}

.modal-details__modal-content-item-content a:hover {
    color: #FF740D !important;

    text-decoration: underline;
}

#vue-merchant-menu {
    max-width: 100%;

    overflow-x: hidden;
}

.top-merchant-details__services {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;

    @media screen and (min-width: 768px) {
        flex-direction: row;
        justify-content: flex-start;
    }
}

.confirmation {
    position: relative;

    overflow: hidden;
}

.confirmation__container {
    width: 90%;
    max-width: 1200px;

    display: flex;

    margin: 0 auto;
}

.confirmation__resume-header {
    display: flex;
    flex-direction: column;
    gap: 20px;

    padding-top: 20px;

    @media screen and (min-width: 768px) {
        flex-direction: row;
        align-items: center;
    }
}

.confirmation__background {
    opacity: 0.1;

    @media screen and (min-width: 1024px) {
        opacity: 1;
    }
}

.confirmation__background svg {
    position: absolute;
    top: 0;
    right: 0;
}

.confirmation__resume {
    display: flex;
    flex-direction: column;
    gap: 25px;

    position: relative;
    z-index: 5;

    padding-bottom: 50px;
}

.confirmation__resume-header-title {
    font-size: 2rem;
    font-weight: 600;

    text-transform: uppercase;
}

.confirmation__resume-header-text {
    font-size: 1rem;
}

.confirmation__resume-separator {
    width: 225px;
    height: 3px;

    background-color: #CDCDCD;

    border-radius: 999px;
}

.confirmation__resume-content-title {
    font-size: 1.25rem;
    font-weight: 400;
}

.confirmation__resume-order-details-title {
    font-size: 1.5rem;
    font-weight: 600;

    @media screen and (min-width: 768px) {
        font-size: 2rem;
    }
}

.confirmation__resume-order-details-restaurant {
    display: flex;
    flex-direction: column;
    gap: 10px;

    margin-top: 15px;

    @media screen and (min-width: 768px) {
        flex-direction: row;
        align-items: center;
    }
}

.confirmation__resume-order-details-restaurant-logo {
    width: 85px;
    height: 85px;

    display: flex;
    align-items: center;
    justify-content: center;

    background-color: #fff;

    border: 2px solid #FF740D;
    border-radius: 10px;

    overflow: hidden;
}

.confirmation__resume-order-details-restaurant-logo img {
    width: 100%;
    height: 100%;

    object-fit: contain;
}

.confirmation__resume-order-details-restaurant-title {
    font-size: 1.5rem;
    font-weight: 600;
}

.confirmation__resume-order-details-restaurant-separator {
    width: 70px;
    height: 3px;

    margin: 15px 0;

    background-color: #CDCDCD;

    border-radius: 999px;
}

.confirmation__resume-order-details-restaurant-summary-items {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.confirmation__resume-order-details-restaurant-summary-item-content {
    display: flex;
    align-items: center;
    gap: 5px;
}

.confirmation__resume-order-details-restaurant-summary-item-content * {
    margin: 0;
    padding: 0;
}

.confirmation__resume-order-details-restaurant-summary-item-content-quantity {
    font-size: 1.25rem;
    font-weight: 600;
}

.merchant-top-header-img {
    width: 100%;
    min-height: 150px;

    @media screen and (min-width: 768px) {
        width: 200px;
    }
}

.m-restaurant-details__header * {
    margin: 0;
    padding: 0;
}

.m-restaurant-details__header {
    display: flex;
}

.m-restaurant-details__header-container {
    width: 100%;

    display: flex;
    align-items: center;
    justify-content: space-between;

    position: relative;

    padding: 20px;
}

.m-restaurant-details__header-title {
    font-size: 1.5rem;
    font-weight: 600;
}

.m-restaurant-details__header-info {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;

    padding-right: 100px;
}

.m-restaurant-details__header-rating {
    display: flex;
    align-items: center;
    gap: 5px;

    color: #FF740D;

    font-size: 1rem;
    font-weight: 600;
}

.m-restaurant-details__header-rating i {
    font-size: 1.25rem;
}

.m-restaurant-details__header-logo {
    width: 100px;

    display: flex;
    align-items: center;
    justify-content: center;

    position: absolute;
    bottom: 20px;
    right: 20px;

    background-color: #fff;

    border: 2px solid #FF740D;
    border-radius: 10px;

    aspect-ratio: 1 / 1;
}

.m-restaurant-details__header-logo img {
    width: 100%;
    height: 100%;

    object-fit: contain;
}

.m-restaurant-details__content {
    padding: 20px;
    padding-top: 0px;
}

.m-restaurant-details__content-top {
    display: flex;
    align-items: center;
    gap: 10px;
}

.m-restaurant-details__content-bottom {
    display: flex;
    flex-direction: column;
    gap: 10px;

    margin-top: 10px;
}

#itemModal .modal-content {
    max-height: 90vh;
    overflow-y: auto;
}

body {
    max-width: 100vw;
    overflow-x: hidden;
}

.confirmation__resume-order-details-restaurant-summary-total-title {
    margin-top: 15px;

    font-size: 1.125 !important;
    font-weight: 600;
}

.confirmation__resume-order-details-restaurant-summary-total-title span {
    font-weight: 400;
}

.confirmation__resume-order-details-restaurant-address {
    margin-top: 15px;
}

.confirmation__resume-order-details-restaurant-address p {
    display: flex;
    flex-direction: column;
    gap: 5px;

    margin: 0;

    font-size: 1.125 !important;
    font-weight: 600;
}

.confirmation__resume-order-details-restaurant-address p span {
    font-weight: 400;
}

.confirmation__resume-footer {
    display: flex;
    flex-direction: column;
    gap: 10px;

    padding-top: 20px;
}

.confirmation__resume-footer * {
    margin: 0;
    padding: 0;
}

.confirmation__resume-footer p {
    font-size: 1.5rem !important;
}

.confirmation__button {
    width: fit-content;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 10px 20px;

    color: #fff;
    background-color: #FF740D;

    border: none;
    border-radius: 5px;

    cursor: pointer;

    transition: background-color 0.3s ease;
}

.confirmation__button:hover {
    color: #fff !important;
    background-color: #ca6517;
}

.confirmation__resume-order-details-restaurant-summary-title {
    font-weight: 600;
}

.modal-dialog:not(.modal-dialog-small) {
    max-width: 800px !important;
}


#itemModal .list-selection {
    display: grid;
    /* Max 2 column */
    grid-template-columns: repeat(1, 1fr);
    gap: 0;

    @media screen and (min-width: 375px) {
        grid-template-columns: repeat(2, 1fr);
        gap: 0 20px;
    }

    @media screen and (min-width: 768px) {
        grid-template-columns: repeat(3, 1fr);
        gap: 0 20px;
    }
}

#itemModal .list-selection>li {
    width: 100%;
}

#itemModal .custom-control-label h6 {
    min-width: unset !important;
}

#vue-merchant-category {
    position: sticky;
    top: 0;
    z-index: 10;
}

.card-product {
    height: 100%;

    border: 1px solid #CDCDCD;
    /*border-radius: 10px;*/

    overflow: hidden;
}

.card-product__container {
    height: 100%;

    display: flex;
    gap: 20px;

    padding: 10px;
}

.card-product__info {
    display: flex;
    flex-direction: column;
    flex: 1;
}

.card-product__read-more {
    display: block;

    color: #000000;

    text-decoration: underline !important;
}

.cart-product__description {
    margin: 0;
    margin-bottom: 10px;

    text-overflow: ellipsis;
}

.cart-product__description * {
    margin: 0;
}

.card-product__price {
    margin-top: auto;
}

.card-product__right {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;
}

.card-product__image {
    width: 100px;
    height: 100px;

    display: flex;
    align-items: center;
    justify-content: center;

    background-color: #F9F9F9;

    cursor: pointer;
}

.card-product__image--no-image {
    background-color: #fff;
}

.card-product__image img {
    width: 100%;
    height: 100%;

    object-fit: cover;

    border-radius: 4px;
}

.card-product__cart {
    margin-top: auto;
}

/* Not for sale */
.card-product__add-cart--disabled {
    padding: 10px 20px;

    color: #fff;
    background-color: #CDCDCD;

    border: none;
    border-radius: 5px;

    cursor: not-allowed;
}

.lightbox-product {
    width: 100%;
    height: 100vh;

    display: none;

    position: fixed;
    z-index: 1000;
    top: 0;
    left: 0;
}

.lightbox-product.active {
    display: flex;
    align-items: center;
    justify-content: center;
}

.lightbox-product__container {
    width: 100%;
    height: 100%;

    display: flex;
    align-items: center;
    justify-content: center;

    position: relative;
}

.lightbox-product__close {
    width: 100%;
    height: 100%;

    position: absolute;
    z-index: 3;
    top: 0;
    left: 0;

    background-color: rgba(0, 0, 0, 0.5);
}

.lightbox-product__content {
    max-width: 90%;
    max-height: 90%;

    position: relative;
    z-index: 5;

    overflow: hidden;
}

.lightbox-product__img {
    max-width: 100%;
    max-height: 100%;

    object-fit: cover;
}

.description-modal {
    width: 100%;
    height: 100vh;

    position: fixed;
    z-index: 1000;
    top: 0;
    left: 0;
}

.description-modal__background {
    width: 100%;
    height: 100%;

    position: absolute;
    top: 0;
    left: 0;

    background-color: rgba(0, 0, 0, 0.5);
}

.description-modal__container {
    width: 100%;
    height: 100%;

    display: flex;
    align-items: center;
    justify-content: center;
}

.description-modal__content {
    width: 90%;
    max-width: 500px;

    position: absolute;
    z-index: 10;

    padding: 20px;

    background-color: #fff;

    border-radius: 10px;
}

.description-modal__content-header {
    display: flex;
    align-items: center;
    justify-content: space-between;

    margin-bottom: 20px;
}

.description-modal__content-header>* {
    margin: 0;
}

.description-modal__content-body>* {
    max-height: 50vh;

    margin: 0;

    overflow-y: auto;
}

.description-modal__title {
    font-size: 1.5rem;
    font-weight: 600;
}

.description-modal__close {
    width: 30px;
    height: 30px;

    display: flex;
    align-items: center;
    justify-content: center;

    color: #fff;
    background-color: #FF740D;

    border: none;
    border-radius: 50%;

    cursor: pointer;
}