.calendar.template-1 {
    background: var(--section-background);
	margin: 0 auto;
	
    & .amelia-v2-booking #amelia-container .am-fs-sb {
        background: var(--sidebar-background, #17295a);
        color: var(--sidebar-text-color, #fff) !important;
    }

    & .amelia-v2-booking #amelia-container .am-button.am-button--filled {
        background: var(--btn1Color, #265CF2FF);

        & span {
            color: var(--btn1TextColor, #fff) !important;
        }
    }

    & .amelia-v2-booking #amelia-container .am-advsc.fc-theme-standard td.am-advsc__dayGridMonth-cell:not(.am-advsc__dayGridMonth-disabled):not(.am-advsc__dayGridMonth-selected) .fc-daygrid-day-frame {
        background: var(--calendar-date-color) !important;

        &:active {
            background: var(--calendar-activeDate-color) !important;
        }
    }

    .am-advsc__dayGridMonth-selected .fc-daygrid-day-frame {
        background: var(--calendar-activeDate-color) !important;
    }

    & .am-fs__main-inner {
        background: var(--container-background);
    }

    & .am-fs-dt__calendar {
        background: var(--calendar-background);
    }

    & .am-fs__main-heading-inner-title,
    .am-fs__init-form__label,
    .am-advsc__slots-heading,
    .am-fs__info-form__label,
    .el-input__inner,
    .am-fs__payments span,
    .am-fs__payments p {
        color: var(--text-color, #000) !important;
    }

    & .is-icon-only,
    .am-icon-arrow-left {
        color: var(--text-color) !important;
        border-color: var(--text-color) !important;
    }

    & .el-input__wrapper,
    .el-select__wrapper,
    .el-input__inner,
    .am-input-phone-wrapper,
    .m-input-wrapper-right,
    .m-phone-number-input__input {
        background: var(--input-background, #FFF) !important;
        background-color: var(--input-background, #FFF) !important;
    }
}

.calendar.template-1 {
	min-width: var(--section-dimensions-mobile-minWidth, auto);
	width: var(--section-dimensions-mobile-width, auto);
	max-width: var(--section-dimensions-mobile-maxWidth, none);
	min-height: var(--section-dimensions-mobile-minHeight, auto);
	height: var(--section-dimensions-mobile-height, auto);
	max-height: var(--section-dimensions-mobile-maxHeight, none);

	& .calendar-container {
        width: 100%;
    }

	& .section-title {
        padding: calc(var(--sectionTitle-padding-mobile-top, 0) * 1rem) calc(var(--sectionTitle-padding-mobile-right, 0) * 1rem) calc(var(--sectionTitle-padding-mobile-bottom, 0) * 1rem) calc(var(--sectionTitle-padding-mobile-left, 0) * 1rem);
        margin: var(--sectionTitle-margin-mobile-top, 1rem) var(--sectionTitle-margin-mobile-right, 0) var(--sectionTitle-margin-mobile-bottom, 1rem) var(--sectionTitle-margin-mobile-left, 0);
        font-size: calc(var(--sectionTitle-font-mobile-fontSize, 2) * 1rem);
        font-weight: var(--sectionTitle-font-mobile-fontWeight, 500);
        line-height: var(--sectionTitle-font-mobile-lineHeight, 1);
        text-align: var(--sectionTitle-font-mobile-textAlign, center);
        font-family: var(--sectionTitle-font-mobile-fontFamily, var(--heading-font-family));
        text-transform: var(--sectionTitle-font-mobile-textTransform, none);
    }

    & .section-desc {
        padding: calc(var(--sectionDesc-padding-mobile-top, 0) * 1rem) calc(var(--sectionDesc-padding-mobile-right, 0) * 1rem) calc(var(--sectionDesc-padding-mobile-bottom, 0) * 1rem) calc(var(--sectionDesc-padding-mobile-left, 0) * 1rem);
        margin: var(--sectionDesc-margin-mobile-top, 1rem) var(--sectionDesc-margin-mobile-right, 0) var(--sectionDesc-margin-mobile-bottom, 1rem) var(--sectionDesc-margin-mobile-left, 0);
        font-size: calc(var(--sectionDesc-font-mobile-fontSize, 1) * 1rem);
        font-weight: var(--sectionDesc-font-mobile-fontWeight, 500);
        line-height: var(--sectionDesc-font-mobile-lineHeight, 1);
        text-align: var(--sectionDesc-font-mobile-textAlign, center);
        font-family: var(--sectionDesc-font-mobile-fontFamily, var(--global-font-family));
        text-transform: var(--sectionDesc-font-mobile-textTransform, none);
    }
}

@container page-container (min-width: 768px) {
    .calendar.template-1 {
        min-width: var(--section-dimensions-tablet-minWidth, auto);
        width: var(--section-dimensions-tablet-width, auto);
        max-width: var(--section-dimensions-tablet-maxWidth, none);
        min-height: var(--section-dimensions-tablet-minHeight, auto);
        height: var(--section-dimensions-tablet-height, auto);
        max-height: var(--section-dimensions-tablet-maxHeight, none);

        & .section-title {
            padding: calc(var(--sectionTitle-padding-tablet-top, 0) * 1rem) calc(var(--sectionTitle-padding-tablet-right, 0) * 1rem) calc(var(--sectionTitle-padding-tablet-bottom, 0) * 1rem) calc(var(--sectionTitle-padding-tablet-left, 0) * 1rem);
            margin: var(--sectionTitle-margin-tablet-top, 1rem) var(--sectionTitle-margin-tablet-right, 0) var(--sectionTitle-margin-tablet-bottom, 1rem) var(--sectionTitle-margin-tablet-left, 0);
            font-size: calc(var(--sectionTitle-font-tablet-fontSize, 2) * 1rem);
            line-height: var(--sectionTitle-font-tablet-lineHeight, 1);
            text-align: var(--sectionTitle-font-tablet-textAlign, center);
        }

        & .section-desc {
            padding: calc(var(--sectionDesc-padding-tablet-top, 0) * 1rem) calc(var(--sectionDesc-padding-tablet-right, 0) * 1rem) calc(var(--sectionDesc-padding-tablet-bottom, 0) * 1rem) calc(var(--sectionDesc-padding-tablet-left, 0) * 1rem);
            margin: var(--sectionDesc-margin-tablet-top, 1rem) var(--sectionDesc-margin-tablet-right, 0) var(--sectionDesc-margin-tablet-bottom, 1rem) var(--sectionDesc-margin-tablet-left, 0);
            font-size: calc(var(--sectionDesc-font-tablet-fontSize, 1) * 1rem);
            line-height: var(--sectionDesc-font-tablet-lineHeight, 1);
            text-align: var(--sectionDesc-font-tablet-textAlign, center);
        }
    }
}

@container page-container (min-width: 992px) {
    .calendar.template-1 {
        min-width: var(--section-dimensions-desktop-minWidth, auto);
        width: var(--section-dimensions-desktop-width, auto);
        max-width: var(--section-dimensions-desktop-maxWidth, none);
        min-height: var(--section-dimensions-desktop-minHeight, auto);
        height: var(--section-dimensions-desktop-height, auto);
        max-height: var(--section-dimensions-desktop-maxHeight, none);

        & .section-title {
            padding: calc(var(--sectionTitle-padding-desktop-top, 0) * 1rem) calc(var(--sectionTitle-padding-desktop-right, 0) * 1rem) calc(var(--sectionTitle-padding-desktop-bottom, 0) * 1rem) calc(var(--sectionTitle-padding-desktop-left, 0) * 1rem);
            margin: var(--sectionTitle-margin-desktop-top, 1rem) var(--sectionTitle-margin-desktop-right, 0) var(--sectionTitle-margin-desktop-bottom, 1rem) var(--sectionTitle-margin-desktop-left, 0);
            font-size: calc(var(--sectionTitle-font-desktop-fontSize, 2) * 1rem);
            line-height: var(--sectionTitle-font-desktop-lineHeight, 1);
            text-align: var(--sectionTitle-font-desktop-textAlign, center);
        }

        & .section-desc {
            padding: calc(var(--sectionDesc-padding-desktop-top, 0) * 1rem) calc(var(--sectionDesc-padding-desktop-right, 0) * 1rem) calc(var(--sectionDesc-padding-desktop-bottom, 0) * 1rem) calc(var(--sectionDesc-padding-desktop-left, 0) * 1rem);
            margin: var(--sectionDesc-margin-desktop-top, 1rem) var(--sectionDesc-margin-desktop-right, 0) var(--sectionDesc-margin-desktop-bottom, 1rem) var(--sectionDesc-margin-desktop-left, 0);
            font-size: calc(var(--sectionDesc-font-desktop-fontSize, 1) * 1rem);
            line-height: var(--sectionDesc-font-desktop-lineHeight, 1);
            text-align: var(--sectionDesc-font-desktop-textAlign, center);
        }
    }
}