.uni-calendar {

    &__container {
        width: $calendar-size;
        height: $calendar-size;
        background-color: #fff;
        font-size: 12px;
        padding: $basic-padding/3;

        @include no-touch();

        &--range-from .uni-calendar__day {

            &--selected {
                @include halfBg(left)
			}

            &--range-from {
                @include halfBg(right)
            }
		}

        &--range-to .uni-calendar__day {

            &--selected {
                @include halfBg(right)
			}

            &--range-to {
                @include halfBg(left)
            }
        }
	}

    &__month-name {

        p {
            font-weight: 700;
        }
	}

    &__days-name {

        p {
            color: $color-primary;
            font-weight: 700;
            font-size: $font-small - 1px;
            text-transform: uppercase;
        }
	}

	&__day-number {
		width: 30px;
        height: 30px;
        @include border-radius($label-height / 5);
    }

    &__day {

        &:hover {

            .uni-calendar__day-number {
                background-color: $alpha-black-light;
            }
		}

        &--today, &--today:hover {

            .uni-calendar__day-number {
                border: 1px $color-primary solid;
            }
		}

		&--range {

            &-from, &-from:hover {

                .uni-calendar__day-number {
                    background-color: $color-primary-medium;
                }
            }

            &-to, &-to:hover {

                .uni-calendar__day-number {
                    background-color: $color-primary-medium;
                }
            }

            &-middle, &-middle:hover {
                background-color: $color-primary-light
            }
        }

        &--selected, &--selected:hover {

            .uni-calendar__day-number {
                background-color: $color-primary;
                color: white;
            }
		}

        &--different-month {
            visibility: hidden
		}

        &--unavailable, &--unavailable:hover {
			opacity: 0.25;

			.uni-calendar__day-number {
                background-color: transparent;
            }
        }
    }

	&--bordered {

		.uni-calendar__container {
			@include border();
		}
	}
}