/* Global styles for React Day Picker */

.rdp-day_range_start {
    background-color: #FF8522 !important;
    border-radius: 50% !important;
    color: #fff !important;
}

.rdp-day_range_end {
    background-color: #FF8522 !important;
    border-radius: 50% !important;
    color: #fff !important;
}

.rdp-root {
    --rdp-accent-color: none !important;
    --rdp-accent-background-color: none !important;
    --rdp-cell-size: 32px !important;
    --rdp-caption-font-size: 14px !important;
    margin: 0 !important;
    font-size: 12px !important;
}

@media (max-width: 600px) {
    .rdp-root {
        --rdp-cell-size: 28px !important;
        --rdp-caption-font-size: 12px !important;
        font-size: 10px !important;
    }
}

.rdp-day_selected {
    outline: none;
    border: none;
    background-color: #f5f5f5 !important;
    color: #111 !important;
}

.rdp-range_middle {
    background-color: #fff1e0 !important;
}

.rdp-chevron {
    fill: black !important;
}

.rdp-today:not(.rdp-outside) {
    color: inherit !important;
}

/* Fix for focus states on various buttons in reports */
button:focus,
button:active,
.MuiButton-root:focus,
.MuiButton-root:active,
.MuiIconButton-root:focus,
.MuiIconButton-root:active {
    outline: none !important;
    box-shadow: none !important;
}