/* Override litepicker Style*/

:root {
	--litepicker-day-width: 40px;
	--litepicker-button-prev-month-color-hover: var(--button-color) !important;
    --litepicker-button-next-month-color-hover: var(--button-color) !important;
}
#calender-wrapper .litepicker {
	font-family: var(--beon-cal-font-family);
}
#calender-wrapper .litepicker .container__months {
	background-color: var(--beon-popup-bg-color);
	box-shadow: none;
	border-radius: 0;
}
#calender-wrapper .litepicker .container__months .month-item-header .month-item-name, #calender-wrapper .litepicker .container__months .month-item-header .month-item-year {
    font: var(--beon-cal-month-font);
    color: var(--beon-cal-month-text-color);
}
#calender-wrapper .litepicker .container__months .month-item-header .button-previous-month, #calender-wrapper .litepicker .container__months .month-item-header .button-next-month {
    background-color: var(--beon-cal-change-month-bg-color);
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    cursor: pointer;
}
#calender-wrapper .litepicker .container__months .month-item-header .button-next-month::after {
    content: url(/wp-content/themes/schwedenhaus/assets/images/arrow_right.svg);
    filter: var(--beon-cal-change-month-icon-filter);
    width: 12px;
    height: 12px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
#calender-wrapper .litepicker .container__months .month-item-header .button-previous-month::after {
    content: url(/wp-content/themes/schwedenhaus/assets/images/arrow_left.svg);
    filter: var(--beon-cal-change-month-icon-filter);
    width: 12px;
    height: 12px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
#calender-wrapper .litepicker .container__months .month-item-header .button-previous-month svg, #calender-wrapper .litepicker .container__months .month-item-header .button-next-month svg {
    display: none;
}
#calender-wrapper .litepicker .container__months .month-item-weekdays-row {
    color: var(--beon-cal-weekday-text-color);
    font: var(--beon-cal-weekday-font);
    margin-top: 12px;
    margin-bottom: 12px;
}
#calender-wrapper .litepicker .container__tooltip {
    z-index: 3;
}
#calender-wrapper .litepicker .container__days {
    row-gap: 3px;
}
#calender-wrapper .litepicker .container__days .day-item {
    font: var(--beon-cal-day-font);
    color: var(--beon-cal-day-text-color);
    display: flex;
    align-items: center;
    justify-content: center;
    height: var(--litepicker-day-width);
}
#calender-wrapper .litepicker .container__days .day-item.is-locked {
    color: var(--beon-cal-day-text-color-disabled);
    text-decoration: line-through;
}
form .litepicker .container__days .day-item.is-start-date, form .litepicker .container__days .day-item.is-end-date.is-flipped {
	background-color: var(--beon-cal-day-bg-color-indirect-select);
	color: var(--beon-cal-day-text-color-direct-select);
    /* border-radius: var(--beon-cal-day-border-radius-direct-select); */
    border-radius: var(--beon-cal-day-border-radius-direct-select) 0 0 var(--beon-cal-day-border-radius-direct-select) !important;
    position: relative;
    z-index: 2;
}
form .litepicker .container__days .day-item.is-in-range {
	background-color: var(--beon-cal-day-bg-color-indirect-select);
    border-radius: 0;
	color: var(--beon-cal-day-text-color-indirect-select);
}

form .litepicker .container__days .day-item.is-end-date, form .litepicker .container__days .day-item.is-start-date.is-flipped {
	background-color: var(--beon-cal-day-bg-color-indirect-select);
	color: var(--beon-cal-day-text-color-direct-select);
    border-radius: 0 var(--beon-cal-day-border-radius-direct-select) var(--beon-cal-day-border-radius-direct-select) 0 !important;
    position: relative;
    z-index: 2;
}
form .litepicker .container__days .day-item.is-start-date.is-end-date{
	border-radius: 50% !important;
}

form .litepicker .container__days .day-item:hover {
	box-shadow: none;
	color: inherit;
	cursor: pointer;
}
.litepicker .container__days .day-item.is-start-date:before, .litepicker .container__days .day-item.is-end-date:before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: var(--beon-cal-day-bg-color-direct-select);
    border-radius: var(--beon-cal-day-border-radius-direct-select);
    z-index: -1;
}