/*********
*** DATERANGEPICKER CUSTOM STYLING
*** Matches the calendar color scheme
**********************/

/* Overall daterangepicker background */
.daterangepicker {
    background: rgba(0, 0, 0, 0) url("images/backgrounds/wild_oliva_dark.png") repeat scroll 0 0 !important;
    border: 1px solid #555 !important;
}

/* Calendar table background */
.daterangepicker .calendar-table {
    background: rgba(0, 0, 0, 0) url("images/backgrounds/wild_oliva_dark.png") repeat scroll 0 0 !important;
    border: 0 !important;
}

/* Header styling */
.daterangepicker .calendar-table thead tr {
    background: rgba(0, 0, 0, 0.3) !important;
}

.daterangepicker .calendar-table thead tr th {
    color: #cccccc !important;
}

.daterangepicker .calendar-table thead tr td {
    color: #cccccc !important;
}

/* Month name styling */
.daterangepicker th.month {
    color: #cccccc !important;
}

.daterangepicker th.next, .daterangepicker th.prev {
    background-color: white;
}

/* Available/clickable dates (wissel days - changeover days) */
.daterangepicker td.available:not(.off) {
    background-color: #4da6ff !important;
    color: #fff !important;
    font-weight: bold;
}

.daterangepicker td.available:not(.off):hover {
    background-color: #3d96ef !important;
    color: #fff !important;
}

/* Unavailable/disabled dates (off dates) */
.daterangepicker td.off {
    background-color: #da5555;
    color: #fff !important;
}

/* Available dates (green - not changeover, but available) */
/* Higher specificity to override .off styling */
.daterangepicker td.off.available-date,
.daterangepicker td.available-date,
.daterangepicker td.off.disabled.available-date
{
    background-color: #5ab049;
    color: #fff !important;
}

.daterangepicker td.off.available-date:hover,
.daterangepicker td.off.disabled.available-date:hover,
.daterangepicker td.available-date:hover {
    background-color: #4a9f39;
    color: #fff !important;
}

.daterangepicker td.off.disabled {
    background-color: #da5555;
    color: #fff !important;
    opacity: 0.8;
    text-decoration: none;
}

/* In-range dates (between start and end date) */
.daterangepicker td.in-range {
    background-color: #4da6ff;
    color: #fff !important;
}
.daterangepicker td.off.in-range,
.daterangepicker td.off.disabled.available-date.in-range
{
    background-color: #4da6ff;
    color: #fff !important;
    opacity: 1;
    font-weight: bold;
    text-decoration: none;
}

.daterangepicker td.off.in-range.today {
    background-color: #da5555 ;
}

.daterangepicker .calendar-table td,
.daterangepicker .calendar-table td.off.disabled,
.daterangepicker .calendar-table td.available
{
    border: 5px solid transparent !important;
    border-radius: 0;
}

/* Start and end date styling */
.daterangepicker td.start-date {
    background-color: #4da6ff !important;
    color: #fff !important;
    /* font-weight: bold !important; */
}

.daterangepicker td.end-date {
    background-color: #4da6ff !important;
    color: #fff !important;
    font-weight: bold !important;
}

/* Active date (currently selected) */
.daterangepicker td.active {
    background-color: #4da6ff !important;
    color: #fff !important;
}

.daterangepicker td.active:hover {
    background-color: #3d96ef !important;
}

/* Buttons styling */
.daterangepicker .drp-buttons {
    border-top: 1px solid #555 !important;
    background: rgba(0, 0, 0, 0.2) !important;
}

.daterangepicker .drp-buttons .btn {
    background-color: #4da6ff !important;
    border-color: #4da6ff !important;
    color: #fff !important;
}

.daterangepicker .drp-buttons .btn:hover {
    background-color: #3d96ef !important;
    border-color: #3d96ef !important;
}

.daterangepicker .drp-buttons .btn.btn-default {
    background-color: #666 !important;
    border-color: #666 !important;
}

.daterangepicker .drp-buttons .btn.btn-default:hover {
    background-color: #777 !important;
    border-color: #777 !important;
}

/* Range labels styling */
.daterangepicker .ranges {
    background: rgba(0, 0, 0, 0.2) !important;
}

.daterangepicker .ranges li {
    color: #cccccc !important;
}

.daterangepicker .ranges li:hover {
    background-color: #4da6ff !important;
    color: #fff !important;
}

.daterangepicker .ranges li.active {
    background-color: #4da6ff !important;
    color: #fff !important;
}

/* Week numbers */
.daterangepicker td.week {
    color: #999 !important;
}

/* Today styling */
.daterangepicker td.today {
    background-color: rgba(77, 166, 255, 0.3) !important;
}

/* Dropdown selects */
.daterangepicker select.monthselect,
.daterangepicker select.yearselect {
    background-color: rgba(0, 0, 0, 0.3) !important;
    color: #cccccc !important;
    border: 1px solid #555 !important;
}

/* Input fields in daterangepicker */
.daterangepicker .drp-calendar {
    background: transparent !important;
}