body .calendar table.month td.day .day-content{
	padding: 0;
}

table.month{
	border: 0;
}
table.month th.month-title{
	border-bottom: 1px solid #E7E7E7;
	padding-bottom: 11px !important;
	color: #333;
	font-size: 14px !important;
}
@media (max-width: 768px) {
}

.calendar table.month th.day-header{
	padding-top: 11px;
	padding-bottom: 10px;
	text-transform: uppercase;
	font-size: 12px;
	font-weight: 500;
	color: #333;
}

.atbb-visually-hidden {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	padding: 0 !important;
	margin: -1px !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	white-space: nowrap !important;
	border: 0 !important;
}

/* Classe per nascondere gli elementi */
.atbb-hidden {
	display: none !important;
}

/* Opzionale: aggiungi un'animazione di comparsa */
.atbb-fade-in {
	animation: fadeIn 0.5s;
}

@keyframes fadeIn {
	from { opacity: 0; }
	to { opacity: 1; }
}

/* Layout Griglia del Calendario */
.months-container {
	display: grid !important;
	grid-template-columns: repeat(4, 1fr);
	grid-template-rows: repeat(3, 1fr);
	gap: 30px;
}

.calendar .months-container .month-container {
	width: 100% !important;
}

/* Giorno abilitato */
.calendar table.month tr td.day{
	padding: 2px;
}

.calendar table.month tr td.day .day-content{
	aspect-ratio: 1;
	display: flex;
	justify-content: center;
	align-items: center;
	max-width: 30px;

	font-weight: 500;
	font-size: 16px;
	font-size: 15px;
	border-radius: 30px !important;
}

.calendar .day .day-content.atbb-date {
	/* text-shadow: 0 -1px 1px rgba(0,0,1), -1px 0 1px rgba(0,0,1); */
}

.calendar .day .day-content.atbb-date-enabled {
	background-color: var(--at-accent) !important;
	color: #fff;
	cursor: pointer;
}

/* Effetto Hover sul giorno abilitato */
.calendar .day .day-content.atbb-date-enabled:hover {
	background-color: var(--at-primary-dark) !important;
	box-shadow: inset 0 0 0 2px var(--at-primary);
}

/* Giorno disabilitato */
.calendar .day .day-content.atbb-date-disabled {
	/* color: #ccc !important; */
	cursor: default !important;
	background-color: #9E9E9E !important;
}

/* Giorno passato che era prenotabile */
.calendar .day .day-content.atbb-date-past {
	border: 1px solid #d1d1d1 !important;
	color: var(--contrast-2) !important;
	background-color: transparent !important;
	cursor: default;
}

/* Opzionale: un leggero stile per distinguere i "passati" dai "mai stati prenotabili" */
.calendar .day .day-content.atbb-date-disabled {
	color: var(--contrast-2) !important;
	background-color: transparent !important;
}

.legend-circle.atbb-date-ecg,
.calendar .day .day-content.atbb-date-ecg {
	background-color: #00A99D !important;
	color: #fff !important;
}

.calendar .day .day-content.atbb-date-enabled:not(.atbb-date-plasma, .atbb-date-sangue):hover {
	background-color: #00A99D !important;
}

.legend-circle.atbb-date-sangue:not(.atbb-date-plasma),
.calendar .day .day-content.atbb-date-sangue:not(.atbb-date-plasma) {
	background-color: var(--at-accent) !important;
	color: #fff !important;
}

.legend-circle.atbb-date-plasma:not(.atbb-date-sangue),
.calendar .day .day-content.atbb-date-plasma:not(.atbb-date-sangue) {
	background-color: var(--at-tertiary) !important;
	color: #000 !important;
}

.legend-circle.atbb-date-sangue.atbb-date-plasma,
.calendar .day .day-content.atbb-date-sangue.atbb-date-plasma {
	background: #249f05 !important;
	background: linear-gradient(90deg, var(--at-tertiary) 50%, var(--at-accent) 50%) !important;
	color: #fff !important;
}

/* Tutto esaurito */
.legend-circle.atbb-date-full,
.calendar .day .day-content.atbb-date-full {
	background-color: #9E9E9E !important;
	color: #fff !important;
	/* text-decoration: line-through; */
	/* cursor: not-allowed !important; */
	/* pointer-events: none; */
}

/* Stile per il giorno selezionato (classe custom) */
.legend-circle.atbb-selected,
.calendar .day .day-content.atbb-selected,
.calendar .day .day-content.atbb-selected.atbb-date-ecg,
.calendar .day .day-content.atbb-selected.atbb-date-sangue,
.calendar .day .day-content.atbb-selected.atbb-date-plasma,
.calendar .day .day-content.atbb-selected.atbb-date-sangue.atbb-date-plasma{
	background: var(--at-primary) !important;
}

/* Supporto Responsive per la griglia */
@media (max-width: 1024px) {
	.months-container {
		grid-template-columns: 1fr 1fr;
	}
}

@media (max-width: 600px) {
	.months-container {
		grid-template-columns: 1fr;
	}
}

/* Contenitore degli slot */
#atbb-slots-container {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 15px;
}

/* Label base per lo slot */
.atbb-slot-label {
	display: inline-block;
	padding: 9px 16px;
	border: 1px solid #333;
	cursor: pointer;
	transition: all 0.2s;
	background-color: #fff;
	width: 85px;
	text-align: center;

	color: #333;
	font-size: 18px;
	font-weight: 400;
}

.atbb-slot-label:not(.atbb-slot-booked, .atbb-active):hover {
	background-color: var(--contrast-3);
	background-color: #eaf3fb;
	border-color: var(--at-primary-dark);
	color: var(--at-primary-dark);
}

.atbb-slot-label:has(input:focus-visible) {
    outline: 2px solid #ff9800;
    outline-offset: 3px;
}

/* Slot occupato */
.atbb-slot-label.atbb-slot-booked {
	color: #ACACAC;
	background-color: #D9D9D9;
	border-color: #D9D9D9;
	cursor: not-allowed;
}

.atbb-slot-label.atbb-slot-booked:hover {
	/* border-color: #eee; */
	/* background-color: #f5f5f5; */
}

/* Nascondiamo il radio button reale per un look più pulito (opzionale) */
/* Se preferisci vedere il pallino, rimuovi questa regola */
.atbb-slot-label input {
	margin-right: 5px;
}

/* Stato quando il radio button interno è selezionato */
.atbb-slot-label.atbb-active {
	/* border-color: #2196f3 !important;
	background-color: #e3f2fd !important;
	color: #0d47a1; */

	border-color: var(--at-primary) !important;
	background-color: var(--at-primary) !important;
	color: #fff;
}

/* Contenitore Servizi */
#atbb-service-selector ul{
	border-radius: 20px;
	border-radius: 30px;
	background: #F2F2F2;
	margin: 0;
	padding: 10px 20px;
	padding: 10px 10px;
	display: inline-flex;
	flex-direction: row;
	gap: 10px;
	list-style: none;
}

#atbb-service-selector ul li{
	padding: 0;
	display: block;
}


/* Riutilizziamo o estendiamo lo stile dei label */
#atbb-service-selector label {
	display: block;
	transition: all 0.2s;
	cursor: pointer;
	color: var(--grigio_topo, #333);
	font-family: Poppins;
	font-size: 18px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
	border-radius: 20px;
	border-radius: 30px;
	padding: 6px 10px 7px;
	background-color: transparent;
	border: 2px solid transparent;
	position: relative;
}

/* Classe attiva per il servizio selezionato */
#atbb-service-selector label.atbb-active,
#atbb-service-selector label:has(input:checked) {
	background-color: var(--at-primary);
	color: #fff;
}

#atbb-service-selector label[for="atbb-service-ecg"].atbb-active,
#atbb-service-selector label[for="atbb-service-ecg"]:has(input:checked) {
	background-color: #00A99D;
	color: #fff;
}

#atbb-service-selector label[for="atbb-service-sangue"].atbb-active,
#atbb-service-selector label[for="atbb-service-sangue"]:has(input:checked) {
	background-color: var(--at-accent);
	color: #fff;
}
#atbb-service-selector label[for="atbb-service-plasma"].atbb-active,
#atbb-service-selector label[for="atbb-service-plasma"]:has(input:checked) {
	background-color: var(--at-tertiary);
	color: var(--contrast-2);
}

#atbb-service-selector label:hover {
	background-color: #d1d1d1;
}
#atbb-service-selector label[for="atbb-service-ecg"]:hover {
	background-color: #6bcfc8;
}
#atbb-service-selector label[for="atbb-service-sangue"]:hover {
	background-color: #f5b9b9;
}
#atbb-service-selector label[for="atbb-service-plasma"]:hover {
	background-color: #f5deb9;
}

#atbb-service-selector label:has(input:focus-visible) {
    outline: 2px solid #ff9800;
    outline-offset: 3px;
}

.atbb-title.user-data--title{
	font-size: 35px;
	margin-bottom: 20px;
	line-height: 1.2em;
	font-weight: 400;
	text-transform: none;
}

.atbb-title.choose-timeslot--title {
	color: var(--grigio_topo, #333);
	font-family: Poppins;
	font-size: 22px;
	font-style: normal;
	font-weight: 400;
	line-height: 120%;
	margin-bottom: 20px;
}
.atbb-title.choose-timeslot--title span {
	color: var(--blu, #0063AD);
	font-family: Poppins;
	font-size: 22px;
	font-style: normal;
	font-weight: 500;
	line-height: 120%;
}

@media (min-width: 767.05px) {
	.atbb-title.choose-timeslot--title {
		font-size: 35px;
	}

	.atbb-title.choose-timeslot--title span {
		font-size: 35px;
		font-weight: 600;
	}
}


#atbb-service-selector{
	margin-top: 30px;
}

#atbb-timeslot-selector{
	margin-top: 24px;
}
@media screen and (min-width: 768px) {
	#atbb-service-selector{
		margin-top: 120px;
	}

	#atbb-timeslot-selector{
		margin-top: 60px;
	}
}

#atbb-user-data-container{
	margin-top: 80px;
}

.calendar-donations .cf7f-areyouback .wpcf7-form-control.wpcf7-radio{
	display: flex;
    flex-direction: column;
	gap: 10px;
}

.calendar-donations .cf7f-areyouback .wpcf7-form-control.wpcf7-radio label,
.calendar-donations .cf7f-areyouback .wpcf7-form-control.wpcf7-radio input{
	cursor: pointer;
}

.calendar-donations .wpcf7-response-output{
	margin-top: 15px !important;
}

body.home .atbb-section-preview .gb-carousel:not(.atbb-carousel){
	display: none !important;
}

body.home .atbb-section-preview .gb-carousel.atbb-carousel{
	padding-top: 4px;
	padding-bottom: 4px;
}


/*******************/

.atbb-slider-controls {
	display: none;
}

/* --- STILI MOBILE --- */
@media (max-width: 600px) {
	.months-container {
		position: relative;
		display: block !important;
	}

	.atbb-slider-controls {
		display: flex;
		justify-content: space-between;
		align-items: center;
		width: 100%;
		position: absolute;
		top: -5px;
	}

	.atbb-slider-controls button {
		color: var(--contrast-2);
		background-color: transparent;
		padding: 0;
		width: 24px;
		height: 24px;
		cursor: pointer;
		display: flex;
		justify-content: center;
		align-items: center;
		font-size: 14px;
	}
	.atbb-slider-controls button:hover {
		background-color: transparent;
		color: var(--contrast-3);
	}

	.atbb-slider-controls button:disabled {
		opacity: 0.5;
		cursor: not-allowed;
	}

	/* Esplicita per nascondere i mesi da nascondere */
	.month-container.is-hidden {
		display: none;
	}
	.month-container.is-hidden.month-selected {
		display: block;
	}
}
