/* datepicker inputs */
.form-calendar .check_date_wrap {position: relative;width: 100%;float: left;}
input.check_date.unvisible {opacity: 0 !important;position: absolute;z-index: 0 !important;}
input.check_date_view {z-index: 1;position: relative;}


.datepicker.dropdown-menu {font-size: 10px; border-radius:0; padding:0;
    box-shadow:0 6px 12px rgba(0, 0, 0, .175); border: 1px solid #eaeaee !important;}

.datepicker-dropdown::before{  border-left: 7px solid transparent;  border-right: 7px solid transparent;
    border-bottom: 7px solid #eaeaee;  border-bottom-color:  #eaeaee;  border-top: 0; }

.datepicker-dropdown.datepicker-orient-bottom::after { top: -5px;}


.datepicker table tr td{padding: 0.4rem 0.7rem;}
.datepicker .datepicker-switch:hover,
.datepicker .prev:hover,
.datepicker .next:hover,
.datepicker tfoot tr th:hover {background: none;}

/* datepicker header */

.datepicker .datepicker-header{display: block !important; text-align: center;
    width: 100%;border-bottom: 1px solid #eaeaee; padding-bottom: 3px; margin-top:6px;margin-bottom:0; }
.datepicker .datepicker-header span{font-size: 1.6em; font-weight: 800; }
.datepicker .datepicker-footer{display: block !important;}
.datepicker.js-check-out .datepicker-footer{display: none !important;}

.datepicker button.close{color: #f3ab1f; font-size: 1.7rem;  position: absolute;  top: -5px; right: 3px;  opacity: 1;}

.datepicker table tr th{font-weight: 600;}
.datepicker table tr td, .datepicker table tr th{height: 28px; font-size: 12px;}

.datepicker table thead tr th.next svg,
.datepicker table thead tr th.prev svg {width: 20px; height: 18px; display: inline-block;}

.datepicker table thead tr th.next{text-align: right!important; padding-right: 10px;padding-top: 0;}
.datepicker table thead tr th.prev{text-align: left!important; padding-left: 10px;padding-top: 0;}

.datepicker .prev.disabled, .datepicker .next.disabled {}

/* datepicker body */

.datepicker  .datepicker-days{width: 100%;}

.datepicker table tbody {}
.datepicker table tbody tr td{font-size: 1.5em; border-radius:0;  font-weight: 400;
    border: 1px solid #e7e7e7 !important; background:#F7F7F7;}

.datepicker table .datepicker-switch{font-size: 1.5em; font-weight: 600;}

.datepicker table tr td.day:hover,
.datepicker table tr td.focused{ background-color:  #F5B841; color: #fff; }

.datepicker table tr td.disabled,
.datepicker table tr td.disabled:hover,
.datepicker table tr td.old.disabled{  background: none;  color: #777777; cursor: default; opacity: 0.5;}


.datepicker table tr td.active:active:hover,
.datepicker table tr td.active.highlighted:active:hover,
.datepicker table tr td.active.active:hover,
.datepicker table tr td.active.highlighted.active:hover,
.datepicker table tr td.active:active:focus,
.datepicker table tr td.active.highlighted:active:focus,
.datepicker table tr td.active.active:focus,
.datepicker table tr td.active.highlighted.active:focus,
.datepicker table tr td.active:active.focus,
.datepicker table tr td.active.highlighted:active.focus,
.datepicker table tr td.active.active.focus,
.datepicker table tr td.active.highlighted.active.focus,
.datepicker table tr td.active:active, .datepicker table tr td.active.highlighted:active,
.datepicker table tr td.active.active, .datepicker table tr td.active.highlighted.active{color: #fff;
    background-color: #f3ab1f;  text-shadow: none; border-radius: 0; font-weight: 600;}

.datepicker table tr td.old{background: #FBFBFB; color: #646669;}
.datepicker table tr td.new {background: #FBFBFB; color: #646669;}

.datepicker table tr td.old:hover{cursor: default;}
.datepicker table tr td.new:hover {cursor: pointer;}

.datepicker.datepicker-dropdown.datepicker-wrong-date .datepicker-days table.table-condensed tr td.disabled,
.datepicker.datepicker-dropdown.datepicker-wrong-date .datepicker-days table.table-condensed tr td.disabled:hover {
    opacity: 0.2; background: none; color: #777777; cursor: default; }

.calendar-month-icon {
    background-image: url("../images/calendar-month.svg");
    width: 16px;
    height: 16px;
    display: inline-block;
    vertical-align: bottom;
}

@media (max-width: 768px) {

    .datepicker.datepicker-dropdown.dropdown-menu{ z-index: 9999999 !important;}

    .datepicker-open .datepicker.datepicker-dropdown {position: absolute !important; top:50% !important; left: 50% !important;}

    .datepicker-dropdown.datepicker-orient-bottom::before,
    .datepicker-dropdown.datepicker-orient-bottom::after{display: none;}
}

@media (max-width: 360px) {

    .datepicker table tr td {padding: 0.4rem 0.6rem;}

}


@media (max-width: 320px) {

    .datepicker table tr td {padding: 0.35rem 0.5rem;}
}

/* NDA availability calendar variant b — all selectors include .gr-avail-calendar-active */

.datepicker.datepicker-dropdown.gr-avail-calendar-active.dropdown-menu {
    border: 0 !important;
}
.datepicker-dropdown.gr-avail-calendar-active .datepicker-header {
    border: 1px solid #e7e7e7;
    margin-top: 0;
    padding: 4px 0;
}
.datepicker-dropdown.gr-avail-calendar-active .datepicker-days table.table-condensed thead {
    border-left: 1px solid #e7e7e7;
    border-right: 1px solid #e7e7e7;
    border-top: 0;
    border-bottom: 0;
}

.datepicker-dropdown.gr-avail-calendar-active table tbody tr td.day:not(.old):not(.new):not(.disabled):not(:hover):not(.focused):not(.active):not(.day--in-range):not(.day--range-start):not(.day--range-end) {
    background-color: #ffffff;
}

.datepicker-dropdown.gr-avail-calendar-active table tbody tr td.day.new:not(.disabled):not(.day--unavailable):not(.day--loading):not(:hover):not(.focused):not(.active):not(.day--in-range):not(.day--range-start):not(.day--range-end),
.datepicker-dropdown.gr-avail-calendar-active table tbody tr td.day.old:not(.disabled):not(.day--unavailable):not(.day--loading):not(:hover):not(.focused):not(.active):not(.day--in-range):not(.day--range-start):not(.day--range-end) {
    background-color: #ffffff;
    color: #202027;
}

.datepicker-dropdown.gr-avail-calendar-active table tbody tr td.day:not(.disabled).focused {
    background-color: #f3ab1f;
}

@media (hover: hover) and (pointer: fine) {
    .datepicker-dropdown.gr-avail-calendar-active table tbody tr td.day:not(.disabled):hover {
        background-color: #f3ab1f;
    }
}

/* Exclude range anchors: check-out picker marks check-in as .disabled; :hover would otherwise beat .day--range-start/-end on fine pointers. */
.datepicker-dropdown.gr-avail-calendar-active table tbody tr td.day.disabled:not(.day--loading):not(.day--range-start):not(.day--range-end),
.datepicker-dropdown.gr-avail-calendar-active table tbody tr td.day.old.disabled:not(.day--loading):not(.day--range-start):not(.day--range-end) {
    background-color: #f7f7f7;
    color: rgba(32, 32, 39, 0.5);
    cursor: default;
    opacity: 1;
}

@media (hover: hover) and (pointer: fine) {
    .datepicker-dropdown.gr-avail-calendar-active table tbody tr td.day.disabled:hover:not(.day--loading):not(.day--range-start):not(.day--range-end) {
        background-color: #f7f7f7;
        color: rgba(32, 32, 39, 0.5);
        cursor: default;
        opacity: 1;
    }
}

.datepicker-dropdown.gr-avail-calendar-active.datepicker-wrong-date .datepicker-days table.table-condensed tr td.day.disabled:not(.day--loading):not(.day--range-start):not(.day--range-end) {
    opacity: 1;
    background-color: #f7f7f7;
    color: rgba(32, 32, 39, 0.5);
}

@media (hover: hover) and (pointer: fine) {
    .datepicker-dropdown.gr-avail-calendar-active.datepicker-wrong-date .datepicker-days table.table-condensed tr td.day.disabled:hover:not(.day--loading):not(.day--range-start):not(.day--range-end) {
        opacity: 1;
        background-color: #f7f7f7;
        color: rgba(32, 32, 39, 0.5);
    }
}

/* Touch/coarse: sticky :hover breaks :not(:hover) above — apply default white without hover guard. */
@media (hover: none), (pointer: coarse) {
    .datepicker-dropdown.gr-avail-calendar-active table tbody tr td.day:not(.old):not(.new):not(.disabled):not(.focused):not(.active):not(.day--in-range):not(.day--range-start):not(.day--range-end) {
        background-color: #ffffff;
    }

    .datepicker-dropdown.gr-avail-calendar-active table tbody tr td.day.new:not(.disabled):not(.day--unavailable):not(.day--loading):not(.focused):not(.active):not(.day--in-range):not(.day--range-start):not(.day--range-end),
    .datepicker-dropdown.gr-avail-calendar-active table tbody tr td.day.old:not(.disabled):not(.day--unavailable):not(.day--loading):not(.focused):not(.active):not(.day--in-range):not(.day--range-start):not(.day--range-end) {
        background-color: #ffffff;
        color: #202027;
    }
}

.datepicker-dropdown.gr-avail-calendar-active table tbody tr td.day.day--unavailable {
    position: relative;
    background-color: #ffffff;
    color: #74747c;
}
.datepicker-dropdown.gr-avail-calendar-active table tbody tr td.day.day--unavailable::after {
    content: "";
    position: absolute;
    top: calc(50% - 1px);
    left: 50%;
    width: 24px;
    height: 1px;
    background-color: currentColor;
    transform: translateX(-50%);
}
.datepicker-dropdown.gr-avail-calendar-active table tbody tr td.day.day--unavailable.focused,
.datepicker-dropdown.gr-avail-calendar-active:not(.js-check-out) table tbody tr td.day.day--unavailable.active,
.datepicker-dropdown.gr-avail-calendar-active table tbody tr td.day.day--unavailable.day--range-start,
.datepicker-dropdown.gr-avail-calendar-active table tbody tr td.day.day--unavailable.day--range-end {
    color: #ffffff;
}

@media (hover: hover) and (pointer: fine) {
    .datepicker-dropdown.gr-avail-calendar-active table tbody tr td.day.day--unavailable:not(.disabled):hover {
        color: #ffffff;
    }
}

/*
 * Check-in picker: selected day is .active (checkout uses .day--range-*). Include .day--unavailable — user can still
 * have that night selected; old rules left white bg + white text (line 215) from .day--unavailable.active. Orange anchor
 * + strike (::after uses currentColor) matches unavailable styling on other days while keeping selection visible.
 */
.datepicker-dropdown.gr-avail-calendar-active.js-check-in table tbody tr td.day.active:not(.day--loading) {
    background-color: #f3ab1f;
    color: #ffffff;
    font-weight: 600;
    text-shadow: none;
}

.datepicker-dropdown.gr-avail-calendar-active.js-check-out table tbody tr td.day.active {
    background-color: #ffffff;
    font-weight: 400;
    text-shadow: none;
}
.datepicker-dropdown.gr-avail-calendar-active.js-check-out table tbody tr td.day.active:not(.day--unavailable):not(.day--range-start):not(.day--range-end):not(.day--loading) {
    color: #202027;
}

.datepicker-dropdown.gr-avail-calendar-active.js-check-out table tbody tr td.day.day--in-range {
    background-color: #fef7e1;
    font-weight: 400;
}

.datepicker-dropdown.gr-avail-calendar-active.js-check-out table tbody tr td.day.day--in-range.new:not(.day--unavailable):not(.day--loading),
.datepicker-dropdown.gr-avail-calendar-active.js-check-out table tbody tr td.day.day--in-range.old:not(.day--unavailable):not(.day--loading) {
    background-color: #fef7e1;
    color: #202027;
}

.datepicker-dropdown.gr-avail-calendar-active.js-check-out table tbody tr td.day.day--range-start,
.datepicker-dropdown.gr-avail-calendar-active.js-check-out table tbody tr td.day.day--range-end {
    background-color: #f3ab1f;
    color: #ffffff;
    font-weight: 600;
    text-shadow: none;
    opacity: 1;
}

.datepicker-dropdown.gr-avail-calendar-active table tbody tr td.day.day--loading,
.datepicker-dropdown.gr-avail-calendar-active table tbody tr td.day.day--loading.focused,
.datepicker-dropdown.gr-avail-calendar-active table tbody tr td.day.day--loading.active,
.datepicker-dropdown.gr-avail-calendar-active table tbody tr td.day.day--loading.day--range-start,
.datepicker-dropdown.gr-avail-calendar-active table tbody tr td.day.day--loading.day--range-end,
.datepicker-dropdown.gr-avail-calendar-active table tbody tr td.day.day--loading.day--in-range,
.datepicker-dropdown.gr-avail-calendar-active.js-check-out table tbody tr td.day.day--loading.day--in-range.old,
.datepicker-dropdown.gr-avail-calendar-active.js-check-out table tbody tr td.day.day--loading.day--in-range.new {
    position: relative;
    color: transparent;
}

@media (hover: hover) and (pointer: fine) {
    .datepicker-dropdown.gr-avail-calendar-active table tbody tr td.day.day--loading:hover {
        position: relative;
        color: transparent;
    }
}

/* After generic .day--loading.active { color: transparent } — restore check-in selection (incl. unavailable nights). */
.datepicker-dropdown.gr-avail-calendar-active.js-check-in table tbody tr td.day.day--loading.active {
    background-color: #f3ab1f;
    color: #ffffff;
    font-weight: 600;
    text-shadow: none;
}

@media (hover: hover) and (pointer: fine) {
    .datepicker-dropdown.gr-avail-calendar-active.js-check-in table tbody tr td.day.day--loading.active:hover {
        background-color: #f3ab1f;
        color: #ffffff;
    }
}

.datepicker-dropdown.gr-avail-calendar-active table tbody tr td.day.day--loading::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 18px;
    height: 12px;
    background-color: #d9d9d9;
    transform: translate(-50%, -50%);
}

.datepicker-dropdown.gr-avail-calendar-active:not(.gr-avail-calendar-day-grid) .gr-avail-calendar-footer {
    display: none !important;
}
.datepicker-dropdown.gr-avail-calendar-active.gr-avail-calendar-day-grid .gr-avail-calendar-footer {
    display: block !important;
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    padding: 4px 8px;
    background-color: #ffffff;
    border: 1px solid #e7e7e7;
    text-align: center;
    font-family: "Nunito Sans", sans-serif;
    font-size: 10px;
    line-height: 14px;
    font-weight: 400;
    color: #202027;
    overflow-wrap: break-word;
    word-wrap: break-word;
}
.datepicker-dropdown.gr-avail-calendar-active.gr-avail-calendar-day-grid .gr-avail-calendar-footer.gr-avail-calendar-footer--width-measure-hidden {
    display: none !important;
}
.datepicker-dropdown.gr-avail-calendar-active .gr-avail-calendar-footer__content {
    display: block;
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    text-align: center;
    line-height: 14px;
    min-height: 14px;
}
/* Spinner + label as one shrink-to-fit row, centered in the padded footer (inline-flex + parent text-align). */
.datepicker-dropdown.gr-avail-calendar-active .gr-avail-calendar-footer__loading-inner {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 4px;
    max-width: 100%;
    box-sizing: border-box;
    text-align: center;
    vertical-align: middle;
}
.datepicker-dropdown.gr-avail-calendar-active .gr-avail-calendar-spinner {
    display: block;
    flex-shrink: 0;
    width: 14px;
    height: 14px;
    line-height: 0;
    background: url("../images/nda-availability-footer-spinner.svg") no-repeat center center / 14px 14px;
    transform-origin: 50% 50%;
    animation: gr-avail-calendar-spin 0.8s linear infinite;
}
.datepicker-dropdown.gr-avail-calendar-active .gr-avail-calendar-footer__loading-text {
    display: block;
    flex: 0 1 auto;
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
    overflow-wrap: break-word;
    word-wrap: break-word;
    line-height: 14px;
    text-align: center;
}
.datepicker-dropdown.gr-avail-calendar-active .gr-avail-calendar-footer__resolved-text {
    display: block;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    margin: 0 auto;
    box-sizing: border-box;
    white-space: normal;
    overflow-wrap: anywhere;
    word-wrap: break-word;
    word-break: normal;
    line-height: 14px;
    text-align: center;
}
@keyframes gr-avail-calendar-spin {
    to { transform: rotate(360deg); }
}

.datepicker-dropdown.gr-avail-calendar-active .gr-avail-calendar-tooltip {
    position: absolute;
    display: none;
    z-index: 1;
    pointer-events: none;
    max-width: 175px;
}
.datepicker-dropdown.gr-avail-calendar-active .gr-avail-calendar-tooltip.is-visible {
    display: block;
}
.datepicker-dropdown.gr-avail-calendar-active .gr-avail-calendar-tooltip__body {
    background-color: #424242;
    color: #ffffff;
    font-family: "Nunito Sans", sans-serif;
    font-size: 12px;
    line-height: 14px;
    font-weight: 400;
    padding: 4px 8px;
    box-shadow: 0 2px 4px -2px rgba(0, 0, 0, 0.1), 0 4px 6px -1px rgba(0, 0, 0, 0.1);
}
.datepicker-dropdown.gr-avail-calendar-active .gr-avail-calendar-tooltip__arrow {
    position: relative;
    width: 10px;
    height: 5px;
    margin: 0 auto;
    background-color: #424242;
    clip-path: polygon(0 0, 100% 0, 50% 100%);
}