/**
 * The following styles get applied both on the front of your site
 * and in the editor.
 *
 * Replace them with your own styles or remove the file completely.
 */

.wp-block-bookable-bookable-plugin {
	background-color: #fff;
}

.settingsContainer {
	padding: 0 16px;

	.inspectorControls {
		display: flex;
		flex-direction: column;
		padding-top: 16px;
		gap: 32px;

		.errorText {
			color: #c00;
		}

		.applyButton {
			display: inline-block;
			width: 100%;
		}

		label {
			font-size: 11px;
			font-weight: 500;
			line-height: 1.4;
			text-transform: uppercase;
			display: inline-block;
			margin-bottom: calc(8px);
			padding-top: 0;
		}
	}
}

.bookableContainer {
	background-color: #fff;
	border-width: 1px !important;
	border-style: solid !important;
	box-sizing: border-box;
	width: 100%;
	height: 700px;

	iframe {
		border: none;
		width: 100%;
		height: 100%;
	}

	.schedulePlaceholder {
		height: 100%;
		padding: 0 24px;
		display: flex;
		flex-direction: column;
		justify-content: flex-start;
		align-items: center;
		gap: 24px;

		div {
			margin-top: 24px;
			font-size: 16px;
			text-align: center;
		}
	}
}