/***
*** Styles Simple Calendar for Elementor plugin
*** Made by RH Medias
***/
:root {
    /* Base colors */
    --calendar-red-primary: #db343b;
    --calendar-red-secondary: #be282f;
    --calendar-dark: #1f231c;
    --calendar-light: #f8f9fa;

    /* Common variables */
    --calendar-border-radius: 8px;
    --calendar-spacing: 0.5rem;
    --calendar-day-size: 3.125rem;
    --calendar-transition: all 0.3s ease;
}

/* Dark Background Styles */
.rhm-calendar.rhm-bg-dark .miga_calendar {
    --calendar-bg: var(--calendar-dark);
    --calendar-text: var(--calendar-light);
    --calendar-day-bg: rgba(248, 249, 250, 0.1);
    --calendar-empty-day-bg: rgba(248, 249, 250, 0.05);
    --calendar-primary: var(--calendar-red-primary);
    --calendar-secondary: var(--calendar-red-secondary);
}

/* Light Background Styles */
.rhm-calendar.rhm-bg-light .miga_calendar {
    --calendar-bg: var(--calendar-light);
    --calendar-text: var(--calendar-dark);
    --calendar-day-bg: rgba(31, 35, 28, 0.1);
    --calendar-empty-day-bg: rgba(31, 35, 28, 0.05);
    --calendar-primary: var(--calendar-red-primary);
    --calendar-secondary: var(--calendar-red-secondary);
}

/* Base Calendar Styles */
.rhm-calendar .miga_calendar {
    --miga-cal-default-day-color: var(--calendar-day-bg);
    --miga-cal-empty-day-color: var(--calendar-empty-day-bg);
    --miga-cal-color: var(--calendar-primary);
    --miga-cal-color-second: var(--calendar-secondary);

    display: flex;
    width: 100%;
    max-width: 100%;
    position: relative;
    font-family: "Ubuntu", system-ui, -apple-system, sans-serif;
    color: var(--calendar-text);
}

/* Calendar Grid */
.rhm-calendar .miga_calendar .calendar__week {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: var(--calendar-spacing);
}

/* Calendar Dates */
.rhm-calendar .miga_calendar .calendar__dates {
    display: flex;
    flex-direction: column;
    gap: 2px;
    border-top: none;
    border-bottom: none;
}

/* Calendar Title */
.rhm-calendar .miga_calendar .calendar__header .calendar__title {
    margin: auto;
    font-weight: lighter;
    font-size: 1.2rem;
}

/* Navigation Buttons */
.rhm-calendar .miga_calendar .calendar__next,
.rhm-calendar .miga_calendar .calendar__prev {
    padding: 0.625rem;
    background: transparent;
    color: var(--calendar-text);
    border: none;
    cursor: pointer;
    transition: var(--calendar-transition);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
}

.rhm-calendar .miga_calendar .calendar__next:hover,
.rhm-calendar .miga_calendar .calendar__prev:hover {
    opacity: 0.8;
    /* transform: scale(1.1); */
    background-color: var(--calendar-day-bg);
}

/* SVG Arrows Styling */
.rhm-calendar .miga_calendar .calendar__next svg,
.rhm-calendar .miga_calendar .calendar__prev svg {
    width: 15px;
    height: 15px;
    display: block;
}

.rhm-calendar .miga_calendar .calendar__next svg path,
.rhm-calendar .miga_calendar .calendar__prev svg path {
    fill: var(--calendar-text);
    transition: var(--calendar-transition);
}

/* .rhm-calendar .miga_calendar .calendar__next:hover svg,
.rhm-calendar .miga_calendar .calendar__prev:hover svg {
    transform: scale(1.2);
} */

/* Week Days Names */
.rhm-calendar .miga_calendar .calendar__day_name {
    background-color: transparent;
    color: var(--calendar-text);
    width: var(--calendar-day-size);
    height: 20px;
    margin: 2px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: bold;
}

/* Calendar Days */
.rhm-calendar .miga_calendar .calendar__day,
.rhm-calendar .miga_calendar .calendar__editor__day,
.rhm-calendar .miga_calendar .calendar__legend_item {
    background: var(--miga-cal-default-day-color);
    width: var(--calendar-day-size);
    height: var(--calendar-day-size);
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: var(--calendar-border-radius);
    transition: var(--calendar-transition);
    user-select: none;
    color: var(--calendar-text);
    font-weight: 500;
}

/* Blocked States */
.rhm-calendar .miga_calendar .calendar__day.blocked,
.rhm-calendar .miga_calendar .calendar__editor__day.blocked,
.rhm-calendar .miga_calendar .calendar__legend_item.blocked {
    background-color: var(--calendar-primary);
    color: var(--calendar-light);
}

/* Half Blocked States */
.rhm-calendar .miga_calendar .calendar__day.half_blocked,
.rhm-calendar .miga_calendar .calendar__editor__day.half_blocked,
.rhm-calendar .miga_calendar .calendar__legend_item.half_blocked {
    background: linear-gradient(
        135deg,
        var(--miga-cal-color) 0%,
        var(--miga-cal-color) 50%,
        var(--miga-cal-color-second) 50%,
        var(--miga-cal-color-second) 100%
    );
}

/* Empty Days */
.rhm-calendar .miga_calendar .calendar__day.calendar__day--empty,
.rhm-calendar .miga_calendar .calendar__editor__day.calendar__day--empty,
.rhm-calendar .miga_calendar .calendar__legend_item.calendar__day--empty {
    background: var(--miga-cal-empty-day-color);
}

/* Today Highlight */
.rhm-calendar .miga_calendar .calendar__day.calendar__day--today,
.rhm-calendar .miga_calendar .calendar__editor__day.calendar__day--today,
.rhm-calendar .miga_calendar .calendar__legend_item.calendar__day--today {
    border: 2px solid var(--calendar-text);
}

/* Header Styles */
.rhm-calendar .miga_calendar .calendar__header {
    color: var(--calendar-text);
    font-weight: 600;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--calendar-spacing);
}

/* Navigation Buttons */
.rhm-calendar .miga_calendar .calendar__next,
.rhm-calendar .miga_calendar .calendar__prev {
    padding: 0.625rem;
    background: transparent;
    color: var(--calendar-text);
    border: none;
    cursor: pointer;
    transition: var(--calendar-transition);
}

.rhm-calendar .miga_calendar .calendar__next:hover,
.rhm-calendar .miga_calendar .calendar__prev:hover {
    opacity: 0.8;
    /* transform: scale(1.1); */
}

/* Today Button */
.rhm-calendar .miga_calendar .calendar__today {
    width: 100%;
    padding: 0.625rem;
    margin-top: 0.5rem;
    background: transparent;
    color: var(--calendar-text);
    border: 1px solid var(--calendar-text);
    border-radius: var(--calendar-border-radius);
    transition: var(--calendar-transition);
    text-transform: capitalize;
    font-size: 1rem;
}

.rhm-calendar .miga_calendar .calendar__today:hover {
    background: var(--calendar-text);
    color: var(--calendar-bg);
}

/* Loading Spinner */
@keyframes spinner {
    to {
        transform: rotate(360deg);
    }
}

.rhm-calendar .miga_calendar .loading_spinner {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 2.5rem;
    height: 2.5rem;
    display: none;
}

.rhm-calendar .miga_calendar .loading_spinner.show {
    display: block;
}

.rhm-calendar .miga_calendar .loading_spinner::after {
    content: "";
    width: 100%;
    height: 100%;
    display: block;
    border: 3px solid var(--calendar-text);
    border-top-color: transparent;
    border-radius: 50%;
    animation: spinner 0.8s linear infinite;
}

/* Legend Styles */
.rhm-calendar .miga_calendar .calendar__legend {
    min-width: 300px;
    margin-left: 20px;
}

.rhm-calendar .miga_calendar .calendar__legend .calendar__legend_row {
    display: flex;
    align-items: center;
    margin-bottom: 0.5rem;
}

.rhm-calendar
    .miga_calendar
    .calendar__legend
    .calendar__legend_row
    .calendar__legend_item {
    width: 25px;
    height: 25px;
    margin-right: 0.625rem;
}
