.datepicker-input {
    background-color: transparent !important;
    cursor: pointer !important;
}

.daterangepicker {
    font-size: 14px;
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
    border: 1px solid #ddd;
}

/* Month and year dropdowns */
.daterangepicker select.monthselect,
.daterangepicker select.yearselect {
    width: auto;
    padding: 4px 25px 4px 10px;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 14px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3E%3Cpath fill='%23666' d='M0 2l4 4 4-4z'/%3E%3C/svg%3E") no-repeat right 10px center;
}

.daterangepicker select.monthselect {
    margin-right: 5px;
    min-width: 110px;
}

.daterangepicker select.yearselect {
    min-width: 80px;
}

/* Calendar cells */
.daterangepicker td, 
.daterangepicker th {
    width: 36px;
    height: 36px;
    font-size: 14px;
}

/* Active state */
.daterangepicker td.active {
    background-color: var(--primary-color, #007bff);
    color: white;
    border-radius: 50%;
}

/* Today state */
.daterangepicker td.today {
    border: 2px solid var(--primary-color, #007bff);
    border-radius: 50%;
}

.daterangepicker td.today.active {
    background-color: var(--primary-color, #007bff);
    color: white;
}

/* Hover states */
.daterangepicker td:hover {
    background-color: #f0f0f0;
    border-radius: 50%;
}

/* Navigation arrows */
.daterangepicker .prev span, 
.daterangepicker .next span {
    border-width: 2px 2px 0 0;
    padding: 5px;
}

/* Hide time picker */
.daterangepicker .calendar-time {
    display: none;
}

/* Disabled dates styling */
.daterangepicker td.disabled {
    text-decoration: line-through;
    background-color: #f8f9fa !important;
    color: #dee2e6 !important;
    cursor: not-allowed;
}

.daterangepicker td.disabled:hover {
    background-color: #f8f9fa !important;
    border-radius: 0;
}