[v-cloak] {
    display: none;
}

.hours { display: grid; grid-template-columns: repeat(auto-fill, minmax(90px,1fr)); gap: 8px; padding: 10px; border-top: 1px solid #eee; }

.paging { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px,3fr)); gap: 8px; padding: 10px; border-top: 1px solid #eee; }
.paging-icon { 
	font-size: 0.7em; 
	vertical-align: middle; 
	display: inline-block;
}

.day {
	margin-bottom: 10px;
}

.day__header i {
	margin-left: 10px;
}

.hour:hover {
	background-color: #abb8c3;
}

details {
	border: 1px solid #aaaaaa;
	border-radius: 4px;
	padding: 0.5em 0.5em 0;
	margin-top: 10px;
}

summary {
	font-weight: bold;
	margin: -0.5em -0.5em 0;
	padding: 0.5em;
}


button.hour.active {
	background-color: #abb8c3;
}

#riepilogo_prenotazione {
	margin-top: 30px;
}

#riepilogo_prenotazione h3 {
	margin-bottom: 10px;
}

div.form-group  {
	padding: 5px;
}

div.form-group label {
	margin-top: 10px;
}

span.error {
	margin-left: 10px;
	color: red;
}

.pv-root {
	position: relative;
}

.pv-overlay {
	position: absolute;
	inset: 0;
	background: rgba(255,255,255,0.75);
	backdrop-filter: blur(1px);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	z-index: 9999;
	pointer-events: all; /* cattura i click */
}

.pv-spinner {
	width: 42px;
	height: 42px;
	border: 4px solid #ddd;
	border-top-color: #555;
	border-radius: 50%;
	animation: pv-spin 0.8s linear infinite;
	margin-bottom: 8px;
}
@keyframes pv-spin {
	to { transform: rotate(360deg); }
}

.pv-overlay-text {
	font-size: 0.95rem;
	color: #333;
}

.hour[disabled] {
	opacity: 0.6;
	cursor: not-allowed;
}

.fade-enter-active, .fade-leave-active {
	transition: opacity 0.5s ease;
}
.fade-enter-from, .fade-leave-to {
	opacity: 0;
}

div#alert {
	position: fixed;
	top: 0px;
	right: 0px;
	background: #f44336;
	color: #fff;
	padding: 12px;
	margin: 15px;
	border-radius: 5px;
	font-size: 20px;
}

div#success {
	position: fixed;
	top: 0px;
	right: 0px;
	background: #43f436;
	color: #fff;
	padding: 12px;
	margin: 15px;
	border-radius: 5px;
	font-size: 20px;
}

.bluebutton {
	margin-top: 20px !important;
	margin: 5px;
}