/* ================================
   DATERANGEPICKER – COMPACT (80%)
   ================================ */

/* Base scale */
.daterangepicker {
    font-size: 0.8rem; /* ~20% smaller */
}

/* Calendar container spacing */
.daterangepicker .calendar-table {
    padding: 6px;
}

/* Day cells + headers */
.daterangepicker td,
.daterangepicker th {
    padding: 4px !important;
    min-width: 28px;
    height: 28px;
    line-height: 1.2;
}

/* Month / Year header text */
.daterangepicker .month {
    font-size: 0.8rem;
}

/* Month & year select dropdowns */
.daterangepicker select.monthselect,
.daterangepicker select.yearselect {
    font-size: 0.75rem;
    padding: 2px 4px;
    height: 26px;
}

/* Range shortcuts (Today, Last 7 Days, etc.) */
.daterangepicker .ranges li {
    font-size: 0.8rem;
    padding: 6px 10px;
}

/* Selected date text */
.daterangepicker .drp-selected {
    font-size: 0.75rem;
}

/* ================================
   ACTION BUTTONS (TAILWIND STYLE)
   ================================ */

.daterangepicker .drp-buttons {
    display: flex !important;
    justify-content: space-between !important;
    padding: 6px;
}

/* Reset Bootstrap assumptions */
.daterangepicker .drp-buttons .btn {
    all: unset;
    cursor: pointer;
    padding: 6px 12px;
    font-size: 0.75rem;
    border-radius: 6px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* Cancel / Clear */
.daterangepicker .drp-buttons .cancelBtn {
    background-color: #e5e7eb; /* Tailwind gray-200 */
    color: #374151;           /* gray-700 */
}

/* Apply */
.daterangepicker .drp-buttons .applyBtn {
    background-color: #3b82f6; /* Tailwind blue-500 */
    color: #ffffff;
}

/* Hover states */
.daterangepicker .drp-buttons .cancelBtn:hover {
    background-color: #d1d5db; /* gray-300 */
}

.daterangepicker .drp-buttons .applyBtn:hover {
    background-color: #2563eb; /* blue-600 */
}



.daterangepicker .drp-buttons {
        display: flex !important;
        justify-content: space-between !important;
    }

.daterangepicker .drp-buttons .cancelBtn {
    border-radius: 4;
    background-color: rgb(193, 195, 196);
}

.daterangepicker .drp-buttons .applyBtn {
    border-radius: 4;
    background-color: rgb(0, 123, 255);
    color: white;
}