/* MC Calendar Customization */

/* Hide the side display (left side calendar design) */





.mc-table__header{
    background: #05249414;
}
.mc-display {
    display: none !important;
}
.mc-calendar--inline
{
    box-shadow: rgba(0, 0, 0, 0.4) 0px 2px 4px, rgba(0, 0, 0, 0.3) 0px 7px 13px -3px, rgba(0, 0, 0, 0.2) 0px -3px 0px inset !important;
}
.mc-table__weekday {
    padding: 10px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    font-family: 'Poppins', sans-serif !important;
    color: #ff6b6b !important;
    text-align: center !important;
    width: 14.28571% !important;
    background: unset !important;
    border-right: unset !important; 
}
.mc-picker
{
    background-color: #ffffff !important;
    font-family: 'Poppins', sans-serif !important;
}
.mc-calendar--inline .mc-picker__footer
{
    border-top: #00000026 solid 1px;
}
.mc-date:hover
{
    background-color: #ff6b6b !important;
    color: #ffffff !important;
}
.mc-btn--danger
{
    background-color: #f24b4b !important;
    
}
#mc-btn__ok
{
    background-color: #4b64f2 !important;
    
}
.mc-picker__footer button
{
    background-color: #ff6b6b !important;
    color: #ffffff !important;
    border-radius: 15px !important;
    padding: 3px 14px !important;
}
.mc-picker__footer button:hover
{
    background-color: #ff6b6b !important;
    color: #ffffff !important;

}
/* Force the calendar to look like a small popover */
.mc-calendar--modal {
    position: absolute !important;
    top: auto !important;
    left: auto !important;
    transform: none !important;
    width: auto !important;
    max-width: 300px !important;
    /* Reduce calendar size */
    height: auto !important;
    max-height: auto !important;
    border-radius: 10px !important;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3) !important;
    z-index: 9999 !important;
}

/* On mobile, keep it centered but small */
@media (max-width: 768px) {
    .mc-calendar--modal {
        max-width: 90% !important;
        width: 300px !important;
    }
}

/* Adjust the picker section to fit the new size */
.mc-picker {
    width: 100% !important;
    height: auto !important;
    border-radius: 10px !important;
}

/* Font size adjustments for smaller look */
.mc-picker__header {
    font-size: 1rem !important;
    padding: 10px 0 !important;
}

.mc-date {
    font-size: 0.9rem !important;
    height: 30px !important;
    line-height: 30px !important;
}

.mc-table__weekday {
    font-size: 0.8rem !important;
    padding: 5px 0 !important;
}

.mc-picker__footer {
    padding: 6px !important;
}

.mc-btn {
    font-size: 0.9rem !important;
}

/* Month/Year selectors */
.mc-select__data--month,
.mc-select__data--month span {
    width: auto !important;
    min-width: 80px !important;
    font-size: 0.9rem !important;
}

.mc-select__data--year,
.mc-select__data--year span {
    width: auto !important;
    min-width: 60px !important;
    font-size: 0.9rem !important;
}

/* Hide animations that might conflict with fixed positioning overrides */
.mc-calendar--modal.mc-calendar--opened {
    animation: none !important;
    -webkit-animation: none !important;
}

/* Overriding specific internal components to be compact */
/* .mc-picker__body {
    padding: 0 10px !important;
} */

.mc-date--active.mc-date--today {
    background-color: transparent !important;
    color: var(--mc-theme-color) !important;
    border: 1px solid var(--mc-theme-color) !important;
}

/* Fix for calendar icon positioning if needed */
.login-new-calendar-icon {
    right: 10px !important;
}
.mc-container {
    width: 100% !important;
}

.mc-picker__header {
    background: #1a328d !important;
    color: #fff !important;
}

.mc-picker__header svg path {
    fill: #fff !important;
}

.mc-picker__body {
    padding: 5px 0px !important;
}
#mc-btn__cancel
{
    display: none !important;
}