/* Override date range picker */
.daterangepicker {
    background-color: var(--fh-white) !important;
    = box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    color: var(--fh-black) !important;
    font-family: "Plus Jakarta Sans", sans-serif !important;
    font-size: 14px;
}

    .daterangepicker .ranges {
        font-family: "Plus Jakarta Sans", sans-serif !important;
        font-size: 14px;
    }

    .daterangepicker.show-ranges .ranges {
        border-radius: 0 !important;
    }

    .daterangepicker.show-ranges.show-calendar {
        padding-bottom: 8px;
        border-radius: 16px !important;
    }

    .daterangepicker.show-calendar .ranges {
        margin-top: 12px !important;
    }

        .daterangepicker.show-calendar .ranges li {
            margin: 0 0 0.6rem -1px !important;
        }

    .daterangepicker .prev.available span, .daterangepicker .next.available span {
        color: var(--fh-black) !important;
    }

    .daterangepicker .prev.available:hover, .daterangepicker .next.available:hover {
        background-color: var(--fh-light-green-btn) !important;
        border-radius: 16px;
        color: var(--fh-black) !important;
    }

    .daterangepicker .monthselect {
        outline: none;
    }

    .daterangepicker .yearselect {
        outline: none;
    }

    .daterangepicker .drp-buttons {
        border-top: none !important;
    }

    .daterangepicker .ranges li {
        font-size: 14px !important;
        padding: 0.5rem !important;
    }

        .daterangepicker .ranges li:hover {
            background-color: var(--fh-light-green) !important;
        }

        .daterangepicker .ranges li.active {
            background-color: var(--fh-green) !important;
        }

    .daterangepicker .calendar-table {
        background-color: var(--fh-white) !important;
        border: none !important;
    }

    .daterangepicker td.available.start-date.active {
        background-color: var(--fh-green) !important;
        border-top-left-radius: 50%;
        border-bottom-left-radius: 50%;
        color: var(--fh-white) !important;
    }

    .daterangepicker td.available.end-date.active {
        background-color: var(--fh-green) !important;
        border-top-right-radius: 50%;
        border-bottom-right-radius: 50%;
        color: var(--fh-white) !important;
    }

    .daterangepicker th {
        font-size: 14px !important;
        padding: 0.3rem !important;
        border: 0 !important;
    }

    .daterangepicker td.available {
        font-size: 14px !important;
        padding: 0.3rem !important;
    }

        .daterangepicker td.available:hover {
            background-color: var(--fh-light-green) !important;
        }

    .daterangepicker td.off.disabled {
        font-size: 14px !important;
    }

    .daterangepicker .drp-selected {
        display: inline-block;
        font-size: 13px;
        font-weight: 700;
        padding-right: 8px;
        color: var(--fh-green);
    }

    .daterangepicker .drp-buttons .cancelBtn {
        background-color: var(--fh-light-green-btn) !important;
        color: var(--fh-black) !important;
        line-height: 25px !important;
        border-radius: 20px !important;
        padding: 0.25rem 1rem !important;
        border-width: 0px !important;
        font-weight: 500 !important;
    }

    .daterangepicker .drp-buttons .applyBtn {
        background-color: var(--fh-green) !important;
        min-height: 35px !important;
        line-height: 25px !important;
        border-radius: 20px !important;
        border-color: initial !important;
        padding: 0.25rem 1rem !important;
        font-weight: 500 !important;
    }

    .daterangepicker td.in-range.available {
        background-color: var(--fh-light-green-btn) !important;
    }

    .daterangepicker.show-ranges.ltr .drp-calendar.left {
        border-left: 1px solid #ddd;
    }

    .daterangepicker.show-ranges.show-calendar.opensleft:after {
        content: none;
    }

    .daterangepicker.show-ranges.show-calendar.opensleft:before {
        content: none;
    }

    .daterangepicker.show-ranges.show-calendar.opensleft {
        content: none;
    }

    .daterangepicker.show-ranges.show-calendar.openscenter:after {
        content: none;
    }

    .daterangepicker.show-ranges.show-calendar.openscenter:before {
        content: none;
    }

    .daterangepicker.show-ranges.show-calendar.openscenter {
        content: none;
    }

    .daterangepicker.show-ranges.show-calendar.opensright:after {
        content: none;
    }

    .daterangepicker.show-ranges.show-calendar.opensright:before {
        content: none;
    }

    .daterangepicker.show-ranges.show-calendar.opensright {
        content: none;
    }