/**
 * Salon Booking System Styles
 * Save this as: assets/css/appointment-booking.css
 */

/* Time Slot Status Message */
.time-slot-status {
	transition: all 0.3s ease;
}

/* Disabled Submit Button */
.elementor-form button[type="submit"]:disabled {
	opacity       : 0.5 !important;
	cursor        : not-allowed !important;
	pointer-events: none;
}

/* Booking Notifications */
.booking-notification {
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

/* Success Popup */
.booking-success-popup {
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

.booking-success-popup h2 {
	font-family: inherit;
}

/* Smooth transitions */
* {
	-webkit-font-smoothing : antialiased;
	-moz-osx-font-smoothing: grayscale;
}

/* Responsive adjustments */
@media (max-width: 768px) {
	.booking-notification {
		top      : 10px;
		right    : 10px;
		left     : 10px;
		max-width: none;
	}

	.booking-success-popup>div {
		width  : 95%;
		padding: 30px 20px;
	}

	.time-slot-status {
		font-size: 13px;
		padding  : 10px 12px;
	}
}


/* Time slot availability status */
.time-slot-status {
	margin       : 15px 0 !important;
	padding      : 12px 15px !important;
	border-radius: 5px !important;
	font-weight  : 600 !important;
	font-size    : 14px !important;
	animation    : slideDown 0.3s ease-out !important;
}

@keyframes slideDown {
	from {
		transform: translateY(-20px);
		opacity  : 0;
	}

	to {
		transform: translateY(0);
		opacity  : 1;
	}
}