@charset "UTF-8";

/*!



 * Bootstrap  v5.2.3 (https://getbootstrap.com/)



 * Copyright 2011-2022 The Bootstrap Authors



 * Copyright 2011-2022 Twitter, Inc.



 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)



 Gold: #DDB17A;

 Beige: #DDB17A;

 Blassgelb: #FFF8DC;



 */

/* =========================================================

   GLAEMPIRE ONLINE TERMINBUCHUNG

   ========================================================= */



.gc-booking-section {

	background: #ffffff;

	padding-top: 70px;

	padding-bottom: 70px;

}





/* =========================================================

   ÄUSSERER BEREICH

   ========================================================= */



.gc-booking-box {

	max-width: 1150px;

	margin: 0 auto;



	border: 1px solid rgba(221, 177, 122, 0.65);

	border-radius: 20px;



	overflow: hidden;



	box-shadow:

		0 20px 55px rgba(0, 0, 0, 0.18);

}





/* =========================================================

   HEADER

   ========================================================= */



.gc-booking-header {

	display: flex;

	align-items: center;

	gap: 20px;



	padding: 25px 30px;



	color: #ffffff;



	background:

		radial-gradient(

			ellipse at top center,

			rgba(255, 255, 255, 0.10) 0%,

			rgba(255, 255, 255, 0.03) 28%,

			transparent 55%

		),

		linear-gradient(

			145deg,

			#050505 0%,

			#171717 42%,

			#0b0b0b 70%,

			#000000 100%

		);

}





.gc-booking-header-logo img {

	width: 70px;

	height: auto;

}





.gc-booking-header h2 {

	margin: 0 0 5px 0;



	font-size: 30px;

	font-weight: 700;



	color: #DDB17A;

}





.gc-booking-header p {

	margin: 0;

	color: #ffffff;

}





/* =========================================================

   CREMEFARBENER BODY

   ========================================================= */



.gc-booking-body {

	background: #FFF8DC;

	padding: 30px;

}





/* =========================================================

   EINZELNE PANELS

   ========================================================= */



.gc-booking-panel {

	height: 100%;



	background: rgba(255, 255, 255, 0.72);



	border: 1px solid rgba(221, 177, 122, 0.40);

	border-radius: 16px;



	padding: 24px;

}





.gc-booking-panel h3 {

	font-size: 20px;

	font-weight: 700;



	margin-top: 0;

	margin-bottom: 15px;



	color: #111111;

}





.gc-booking-step {

	margin-top: 30px !important;

}





/* =========================================================

   BEHANDLUNG AUSWAHL

   ========================================================= */



.gc-booking-select {

	width: 100%;



	min-height: 48px;



	padding: 10px 14px;



	font-family: inherit;

	font-size: 16px;



	background: #ffffff;



	color: #111111;



	border: 1px solid #DDB17A;

	border-radius: 9px;



	outline: none;

}





.gc-booking-select:focus {

	border-color: #DDB17A;



	box-shadow:

		0 0 0 3px rgba(221, 177, 122, 0.20);

}





/* =========================================================

   KALENDER NAVIGATION

   ========================================================= */



.gc-calendar-toolbar {

	display: grid;



	grid-template-columns: 48px 1fr 48px;



	align-items: center;



	margin-bottom: 15px;

}





.gc-calendar-title {

	text-align: center;



	font-size: 20px;

	font-weight: 700;



	text-transform: capitalize;



	color: #111111;

}





.gc-calendar-nav {

	width: 44px;

	height: 44px;



	border: 1px solid #DDB17A;

	border-radius: 50%;



	background: #ffffff;



	color: #111111;



	font-size: 28px;



	line-height: 1;



	cursor: pointer;



	transition:

		background-color 0.25s ease,

		color 0.25s ease,

		transform 0.15s ease;

}





.gc-calendar-nav:hover {

	background: #DDB17A;

	color: #000000;

}





.gc-calendar-nav:active {

	transform: scale(0.95);

}





.gc-calendar-nav:disabled {

	opacity: 0.30;

	cursor: default;

}





/* =========================================================

   WOCHENTAGE

   ========================================================= */



.gc-calendar-weekdays {

	display: grid;



	grid-template-columns: repeat(6, 1fr);



	gap: 6px;



	margin-bottom: 7px;

}





.gc-calendar-weekdays span {

	text-align: center;



	font-size: 13px;

	font-weight: 700;



	color: #777777;

}





/* =========================================================

   KALENDERTAGE

   ========================================================= */



.gc-calendar-grid {

	display: grid;



	grid-template-columns: repeat(6, 1fr);



	gap: 7px;

}





.gc-calendar-empty {

	min-height: 48px;

}





.gc-calendar-day {

	min-height: 48px;



	border: 1px solid #DDD4C7;

	border-radius: 9px;



	background: #ffffff;



	color: #111111;



	font-size: 15px;



	cursor: pointer;



	transition:

		background-color 0.20s ease,

		border-color 0.20s ease,

		transform 0.15s ease,

		box-shadow 0.20s ease;

}





.gc-calendar-day:hover:not(:disabled) {

	background: rgba(221, 177, 122, 0.35);



	border-color: #DDB17A;



	transform: translateY(-2px);



	box-shadow:

		0 4px 10px rgba(0, 0, 0, 0.10);

}





.gc-calendar-day.selected {

	background: #DDB17A;



	border-color: #DDB17A;



	color: #000000;



	font-weight: 700;

}





.gc-calendar-day.today {

	border: 2px solid #111111;

}





.gc-calendar-day:disabled {

	background: #ECECEC;



	border-color: #E1E1E1;



	color: #AAAAAA;



	cursor: default;

}





/* =========================================================

   UHRZEITEN

   ========================================================= */



.gc-booking-time-info {

	margin-bottom: 12px;



	font-size: 14px;



	color: #666666;

}





.gc-booking-times {

	display: grid;



	grid-template-columns: repeat(4, 1fr);



	gap: 8px;

}





.gc-booking-time {

	min-height: 44px;



	padding: 8px 5px;



	border: 1px solid #D6CEC3;

	border-radius: 9px;



	background: #ffffff;



	color: #111111;



	font-family: inherit;

	font-size: 15px;



	cursor: pointer;



	transition:

		background-color 0.20s ease,

		border-color 0.20s ease,

		transform 0.15s ease;

}





.gc-booking-time:hover:not(:disabled) {

	background: rgba(221, 177, 122, 0.35);



	border-color: #DDB17A;



	transform: translateY(-1px);

}





.gc-booking-time.selected {

	background: #DDB17A;



	border-color: #DDB17A;



	color: #000000;



	font-weight: 700;

}





.gc-booking-time:disabled {

	background: #EAEAEA;



	border-color: #DDDDDD;



	color: #AAAAAA;



	cursor: default;

}





/* =========================================================

   LEGENDE

   ========================================================= */



.gc-booking-legend {

	display: flex;

	flex-wrap: wrap;



	gap: 16px;



	margin-top: 15px;



	font-size: 13px;



	color: #666666;

}





.gc-booking-legend i {

	display: inline-block;



	width: 12px;

	height: 12px;



	margin-right: 5px;



	border-radius: 50%;



	vertical-align: -1px;

}





.gc-legend-free {

	background: #ffffff;



	border: 1px solid #AAAAAA;

}





.gc-legend-selected {

	background: #DDB17A;

}





.gc-legend-blocked {

	background: #D8D8D8;

}





/* =========================================================

   TERMIN ZUSAMMENFASSUNG

   ========================================================= */



.gc-summary-row {

	display: flex;



	justify-content: space-between;



	gap: 20px;



	padding: 11px 0;



	border-bottom: 1px solid rgba(221, 177, 122, 0.42);

}





.gc-summary-row span {

	color: #666666;

}





.gc-summary-row strong {

	text-align: right;



	color: #111111;

}





/* =========================================================

   FORMULAR

   ========================================================= */



.gc-booking-input {

	display: block;



	width: 100%;



	margin-bottom: 11px;



	padding: 11px 13px;



	font-family: inherit;

	font-size: 16px;



	color: #111111;



	background: #ffffff;



	border: 1px solid #D8CFC2;

	border-radius: 9px;



	outline: none;

}





.gc-booking-input:focus {

	border-color: #DDB17A;



	box-shadow:

		0 0 0 3px rgba(221, 177, 122, 0.18);

}





.gc-booking-textarea {

	min-height: 90px;



	resize: vertical;

}





/* =========================================================

   DATENSCHUTZ

   ========================================================= */



.gc-booking-consent {

	display: flex;



	align-items: flex-start;



	gap: 10px;



	margin: 16px 0;



	font-size: 13px;



	line-height: 1.4;



	color: #444444;



	cursor: pointer;

}





.gc-booking-consent input {

	margin-top: 3px;

}





/* =========================================================

   BUCHUNGSBUTTON

   ========================================================= */



.gc-booking-submit {

	width: 100%;



	min-height: 50px;



	border: none;

	border-radius: 11px;



	background:

		linear-gradient(

			145deg,

			#050505,

			#191919,

			#000000

		);



	color: #ffffff;



	font-family: inherit;

	font-size: 16px;

	font-weight: 700;



	cursor: pointer;



	transition:

		background-color 0.25s ease,

		transform 0.15s ease,

		opacity 0.25s ease;

}





.gc-booking-submit:hover:not(:disabled) {

	background: #66BB6A;

}





.gc-booking-submit:active:not(:disabled) {

	transform: scale(0.98);

}





.gc-booking-submit:disabled {

	opacity: 0.35;



	cursor: not-allowed;

}





/* =========================================================

   STATUS

   ========================================================= */



.gc-booking-status {

	display: none;



	margin-top: 15px;



	padding: 12px 14px;



	border-radius: 9px;



	background: rgba(102, 187, 106, 0.15);



	border: 1px solid rgba(102, 187, 106, 0.40);



	color: #245C2A;



	font-size: 14px;

}





/* =========================================================

   MOBILE

   ========================================================= */



@media (max-width: 767px) {



	.gc-booking-section {

		padding-top: 40px;

		padding-bottom: 40px;

	}





	.gc-booking-header {

		flex-direction: column;



		text-align: center;



		padding: 22px 18px;

	}





	.gc-booking-header-logo img {

		width: 60px;

	}





	.gc-booking-header h2 {

		font-size: 25px;

	}





	.gc-booking-body {

		padding: 14px;

	}





	.gc-booking-panel {

		padding: 16px;

	}





	.gc-booking-times {

		grid-template-columns: repeat(3, 1fr);

	}





	.gc-calendar-day {

		min-height: 44px;

	}





	.gc-summary-row {

		gap: 10px;



		font-size: 14px;

	}



}





@media (max-width: 420px) {



	.gc-booking-times {

		grid-template-columns: repeat(2, 1fr);

	}



}