﻿.ºmonth{
}
	.ºmonth .weekdays{
		display: grid;
		grid-template-columns: repeat(7, min-content);
		border-radius: var(--control-border-radius) var(--control-border-radius) 0 0;
		overflow: hidden;
	}
		.ºmonth .weekday{
			padding: 4px 0 2px;
			background: var(--color-text-2);
			color: var(--color-12);	
			text-align: center;
		}
	.ºmonth .dates{
		display: grid;
		grid-template-columns: repeat(7, min-content);
		cursor: pointer;
	}
		.ºmonth .date{
			position: relative;
			display: flex;
			flex-direction: column;
			background: var(--control-disable-bg);
		}
			.ºmonth .date .overlay{
				position: absolute;
				width: 100%;
				height: 100%;
				background: linear-gradient(180deg, rgba(0, 0, 0, .05) 0%, rgba(0, 0, 0, 0) 35%, rgba(0, 0, 0, 0) 100%);
				z-index: 1;
			}
			.ºmonth .date .label{
				z-index: 2;
			}
				.ºmonth .date .label.day{
					padding: 12px 0 10px 0;
					font-size: 26px;
					font-weight: 500;
					align-self: center;
					opacity: .75;
				}
				.ºmonth .date .label.line{
					padding: 0 var(--size-2);
					line-height: 16px;
					white-space: nowrap;
					text-overflow: ellipsis;
					overflow: hidden;				
				}
					.ºmonth .date .label.line.n1{
						font-weight: 400;
					}
			.ºmonth .date:hover{
				box-shadow: 0 0 0 1px #000;
				z-index: 1;
			}
			
			.ºmonth .date.selected .overlay{
				background-color: #12ADE3 !important;
			}
			.ºmonth .date.disabled{
				background: var(--color-text-4);
				justify-content: center;
				cursor: default;			
			}
				.ºmonth .date.disabled .overlay{
					background: linear-gradient(180deg, rgba(0, 0, 0, .05) 0%, rgba(0, 0, 0, 0) 35%, rgba(0, 0, 0, 0) 100%);
				}
				.ºmonth .date.disabled .label.day{
					padding-top: 0;
					color: #CCC;
					font-size: 22px;
				}
				.ºmonth .date.disabled:hover{
					box-shadow: none;
				}
	.ºmonth .header{
		background: var(--color-5);
		color: var(--color-12);
		text-align: center;
		cursor: pointer;
	}
		.ºmonth .header:hover{
			background: var(--color-4);
		}

.ºmonth.small .header,
.ºmonth.small .weekday{
	font-size: 10px;
}	
	.ºmonth.small .header{
		border-radius: var(--control-border-radius-2) var(--control-border-radius-2) 0 0;
	}
	.ºmonth.small .weekdays{
		border-radius: 0;
	}
	.ºmonth.small .date{
		justify-content: center;
	}
		.ºmonth.small .date .label.day{
			font-size: 12px;
			padding-top: 0;
			opacity: .85;
		}
		.ºmonth.small .date .label.line{
			display: none;
		}