/* Base */
body, html {
    /*font-family: 'Barlow-Regular', serif !important;*/
}

h1,h2,h3,h4,h5,h6 {
    /*font-family: 'GildaDisplay-Regular', serif !important;*/
}

p,
span,
input,
label {
    /*font-family: 'Barlow-Regular', serif !important;*/
}

.main-layout {
    max-width: 1200px;
    margin-inline: auto;
}

/*@font-face {*/
/*    font-family: 'Barlow-Regular';*/
/*    src: url('../fonts/Barlow-Regular.ttf') format('truetype');*/
/*    font-weight: normal;*/
/*    font-style: normal;*/
/*}*/

/*@font-face {*/
/*    font-family: 'GildaDisplay-Regular';*/
/*    src: url('../fonts/GildaDisplay-Regular.ttf') format('truetype');*/
/*    font-weight: normal;*/
/*    font-style: normal;*/
/*}*/

.btn-primary {
    background-color: rgb(0, 0, 0) !important;
    color: #bed739 !important;
    border-color: rgb(0, 0, 0) !important;
    border-radius: 10px !important;
}

.btn-primary:hover {
    background-color: #bed739 !important;
    color: #000000 !important;
}

.btn-secondary {
    background-color: #00b6da !important;
    color: rgb(0, 0, 0) !important;
    border-color: rgb(0, 0, 0) !important;
    border-radius: 10px !important;
}

.btn-secondary:hover {
    background-color: #bed739 !important;
    color: #000000 !important;
}

.btn-tertiary {
    background-color: #00b6da !important;
    color: rgb(0, 0, 0) !important;
    border-color: rgb(0, 0, 0) !important;
    border-radius: 10px !important;
}

.btn-tertiary:hover {
    background-color: #bed739 !important;
    color: #000000 !important;
}

.btn-cancel {
    background-color: #ff2020 !important;
    color: rgb(255, 255, 255) !important;
    border-color: rgb(159, 0, 0) !important;
    border-radius: 10px !important;
}

.btn-cancel:hover {
    background-color: #ffffff !important;
    color: rgb(159, 0, 0) !important;
}

.btn-primary:disabled,
.btn-secondary:disabled,
.btn-tertiary:disabled,
.btn-cancel:disabled {
    background-color: #c0c0c0 !important;
    color: #f8f8f8 !important;
}

.loading-image-text {
    color: #000000 !important;
}
/* END Base */


/* NavBar */
.navbar-top {
    background-color: rgb(255, 255, 255);
}

.navbar-brand {
    height: 50px;
    width: auto;
}

.nav-list-item-text {
    /*font-family: 'GildaDisplay-Regular', serif !important;*/
}

.nav-link-list {
    color: #bed739;
}

.nav-link-list span.MuiTouchRipple-root {
    text-transform: capitalize;
}

.drawer-toggler-wrapper,
.drawer-wrapper,
.drawer-header,
.drawer-social-form,
.drawer-divider,
.drawer-close-toggler-icon,
.drawer-menu-select-wrapper,
.navbar-logo-wrapper {
/*    */
}

div.nav-link-wrapper button svg,
button.share-icon-wrapper svg.share-icon-link,
button.auth-signin-icon-wrapper svg.auth-signin-icon,
button.drawer-toggler-icon svg,
div.drawer-social-wrapper button svg,
button.drawer-close-toggler svg {
    color: #000000;
}
/* END NavBar */

/******************************* Main *******************************/

/* STEPPER */
.popup-content {
    background: white !important;
    color: rgb(34, 34, 34) !important;
}

.main-layout {
    min-height: 670px;
    text-align: center;
    padding: 1rem 2rem;
    margin: 8px auto;
    border-radius: 10px;
    max-width: 1300px;
}

.bookings-container,
.main-layout {
    background-color: white;
    filter: opacity(0.97);
}

.main-layout hr {
    background-color: rgba(0, 0, 0, 0.78);
}

.main-layout h1 {
    color: rgb(34, 34, 34) !important;
}

.main-layout .footer {
    background-color: white;
}

.main-layout .footer-inner {
    background-color: white;
    color: #000000;
}

.popup-content .btn-light {
    border: 1px solid #000000 !important;
    color: white !important;
    background-color: rgb(0, 0, 0) !important;
}

.slide-warning {
    color: rgb(0, 0, 0);
}

.btn-view-cart {
    background-color: rgb(0, 0, 0) !important;
    color: white !important;
    border-color: rgb(0, 0, 0) !important;
    box-shadow: black;
}

.btn-view-cart:hover,
.btn-floating-cart:hover,
.btn-floating-cart-expanded {
    background-color: #000000 !important;
    color: white !important;
}

.floating-cart-badge .MuiBadge-badge {
    background-color: #e6e0d5 !important;
    color: #000000 !important;
    border: 1px solid #000000 !important;
}

.stepper-step-icon {
    color: #DFDFDF;
}

.stepper-step-icon-active {
    color: #ffce00;
}
/* END STEPPER */

/* STEP 1 */
.date-and-pax h1,
.date-and-pax h3,
.date-and-pax table,
.date-and-pax .checkinout,
.domesticCheckBox.Mui-checked {
    color: #000000 !important;
}

.react-calendar {
    background: #ffffff !important;
    color: rgb(0, 0, 0) !important;
    border: 1px solid #000000 !important;
    box-shadow: 4px 4px 8px rgba(255, 255, 255, 0.137) !important;
}

.date-and-pax .pax,
.react-calendar__navigation button:enabled:hover,
.react-calendar__navigation button:enabled:focus,
.react-calendar__navigation button[disabled],
.rdrCalendarWrapper,
.react-calendar__tile:disabled,
.rdrDayToday span::after {
    background-color: #ffffff !important;
}

.rdrDay span {
    color: rgb(0, 0, 0) !important;
}

.rdrDay:not(.rdrDayPassive) .rdrStartEdge ~ .rdrDayNumber span,
.rdrDay:not(.rdrDayPassive) .rdrEndEdge ~ .rdrDayNumber span,
.rdrDay:not(.rdrDayPassive) .rdrInRange ~ .rdrDayNumber span {
    color: white !important;
}

.rdrDayDisabled{
    background-color: transparent !important;
}

.rdrDayPassive span,
.rdrDayDisabled span {
    color: rgba(64, 60, 60, 0.65) !important;
    font-weight: normal;
}

.rdrDateDisplayItem {
    border-color: #000000 !important;
}
/* END STEP 1 */

/* STEP 3 */
.category-image-box .MuiButtonBase-root{
    border:1px solid rgb(0, 0, 0);
}

.category-image-box .MuiButtonBase-root:hover {
    border:1px solid transparent;
    filter: invert(1);
    background-color: #fff;
}

.category-button-normal{
    color: white !important;
    background-color: rgb(0, 0, 0) !important;
}

.category-button-normal:hover{
    background-color: white !important;
    color: rgb(0, 0, 0) !important;
}

.category-button-normal:disabled {
    background-color: rgba(0, 0, 0, 0.62) !important;
    color: rgba(225, 225, 225, 0.94) !important;
}

.category-image-box .MuiButtonBase-root{
    border:1px solid rgb(0, 0, 0) !important;
    color: white !important;
}

.category-image-box .MuiButtonBase-root:hover {
    border:1px solid transparent;
    filter: none !important;
    background-color: rgb(0, 0, 0) !important;
    color: white !important;
}
/* END STEP 3 */

/* STEP 4 */
.select-rate-button {
    background-color: rgba(0, 0, 0, 0.88);
    border-radius: 0 !important;
    color: #ffffff !important;
}

.select-rate-button:hover {
    background-color: #ffce00;
    color: #000000 !important;
}

.select-rate-button svg {
    color: rgb(255, 255, 255)
}

.select-rate-button:hover svg {
    color: rgb(0, 0, 0)
}

.room-card-accordion-summary {
    color: #ffffff !important;
    background-color: rgba(0, 0, 0, 0.88);
}

.room-card-accordion-summary:hover {
    background-color: #ffce00;
    color: #000000 !important;
}

.view-rate-mobile-button {
    color: rgb(13, 134, 255);
}

.view-rate-mobile-button:hover {
    color: rgb(0, 73, 147);
}

.room-card-room-description {
    text-align: left;
    color: rgb(0, 0, 0);
}

.rooms-card-special-rate-description {
    color: rgb(0, 0, 0);
}
/* END STEP 4 */

/* STEP 5 */
.comp-extras-image {
    width: 100px;
    height: 100px;
}

.booker-contact-clear {
    color: rgb(0, 0, 0);
}
/* END STEP 5 */

/* CART */
.cart-tc-text {
    color: rgb(34, 34, 34) !important;
}
/* END CART */

/* PAYMENT MODAL */
.modal-cancel-button {
     background-color: #d32f2f !important;
     color: white !important;
     border: 1px solid black !important;
 }

.modal-cancel-button:hover {
    background-color: #d35d5d !important;
    color: white !important;
    border: 1px solid black !important;
}

.modal-confirm-button {
    background-color: #1b5e20 !important;
    color: white !important;
    border: 1px solid black !important;
}

.modal-confirm-button:hover {
    background-color: #4a7e4c !important;
    color: white !important;
    border: 1px solid black !important;
}
/* END PAYMENT MODAL */
/******************************* END Main *******************************/


/* AUTH Components */
.auth-box-wrapper,
.loading-box-wrapper {
    background-color: white;
}

.auth-title {
    text-transform: uppercase;
}
/* END AUTH Components */


/* Room List Entries */
.roomlist-entries {
    background: rgb(255, 255, 255) !important;
    color: rgb(48, 54, 61) !important;
}
/* END Room List Entries */

/* Availability Grid */
.AvailabilityGrid h1 {
    color: rgb(27, 27, 27) !important;
}

.react-calendar__tile--active {
    color: rgb(255, 255, 255) !important;
    background-color: rgb(27, 27, 27) !important;
}
/* END Availability Grid */