.ic-reservation-calendar-wrapper{margin:1rem 0;}
.ic-reservation-calendar-wrapper label{display:block;font-weight:600;margin-bottom:4px;}
.ic-reservation-calendar{width:100%;max-width:260px;padding:6px 8px;border:1px solid #ccc;border-radius:4px;}
.ui-datepicker{font-size:14px;background:#fff;border:1px solid #ccc;padding:.6rem;border-radius:4px;box-shadow:0 2px 4px rgba(0,0,0,.1);}
.ui-datepicker .ui-datepicker-header{background:#f5f5f5;border:1px solid #ddd;border-radius:3px;padding:.3rem .5rem;margin:-.6rem -0.6rem .6rem -0.6rem;}
.ui-datepicker .ui-datepicker-title{font-weight:600;text-align:left;font-size:13px;}
.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next{cursor:pointer;position:absolute;top:8px;width:24px;height:24px;text-align:left;line-height:24px;color:#333;}
.ui-datepicker .ui-datepicker-prev{left:8px;}
.ui-datepicker .ui-datepicker-next{right:8px;}
.ui-datepicker table{width:100%;border-collapse:collapse;font-size:12px;}
.ui-datepicker th{padding:4px;font-weight:600;color:#555;}
.ui-datepicker td{padding:0;}
.ui-datepicker td a{display:block;padding:6px 0;text-align:left;text-decoration:none;color:#222;border-radius:3px;margin:1px;}
.ui-datepicker td a:hover{background:#3498db;color:#fff;}
.ui-datepicker-unselectable a, .ui-state-disabled a{cursor:not-allowed !important;opacity:.5;}
.ic-reservation-calendar-hidden{position:absolute !important;left:-9999px !important;top:-9999px !important;width:1px !important;height:1px !important;opacity:0 !important;}
.ic-inline-calendar-wrapper{margin:1rem 0;}
.ic-inline-calendar-label{display:block;font-weight:600;margin-bottom:6px;}
.ic-inline-calendar{display:inline-block;}
.ic-res-disabled a, .ui-datepicker-calendar td.ic-res-disabled a{background:#e74c3c !important;color:#fff !important;cursor:not-allowed !important;opacity:0.85;}
.ui-datepicker-calendar td.ic-res-disabled{position:relative;}
.ui-datepicker-calendar td.ic-res-disabled:after{content:'X';position:absolute;top:4px;right:6px;font-size:11px;color:#fff;}
/* Original Tooltip-Styling für reservierte Tage */
.ic-inline-calendar td.ui-state-disabled.reserved{position:relative;}
.ic-inline-calendar td.ui-state-disabled.reserved::before {
	content: "Termin reserviert";
	text-align: center;
	position: absolute;
	width: 100%;
	height: 100%;
	top: -100%;
	left: 0;
	padding-top: 5px;
	border-radius: 4px;
	transition: all 0.25s linear;
	opacity: 0;
}
.ic-inline-calendar td.ui-state-disabled.reserved{
    background-color: #6B2A5C;
    color: #fff !important;
}
.ic-inline-calendar td.ui-state-disabled.reserved:hover{
	background-color: #59234c !important;
}
.ic-inline-calendar td.ui-state-disabled.reserved:hover::before{opacity:1;top:0;}
.ic-inline-calendar td.ui-state-disabled.reserved:hover .ui-state-default{
	opacity: 0;
}
/* Mapping unserer Klasse auf reserved für Kompatibilität */
.ic-inline-calendar td.ic-res-disabled{position:relative;}
.ic-inline-calendar td.ic-res-disabled.reserved::before{content:"Termin reserviert";}
/* Vergangene Tage */
.ui-datepicker td.ic-res-past a{background:#ebebeb !important;color:#666 !important;cursor:not-allowed !important;}
/* Optional: Heute hervorheben */
.ui-datepicker td.ic-res-today a{box-shadow:0 0 0 2px #3498db inset;font-weight:600;}
@media (max-width:480px){.ui-datepicker{width:100% !important;}}
/* Ninja Forms Feld Schreibschutz Style */
#nf-field-46.ic-datepicker-linked[readonly]{background:#f7f7f7 !important;color:#333 !important;cursor:default !important;border:1px solid #ccc;}
input.ic-datepicker-visible-locked[readonly]{background:#f7f7f7 !important;color:#333 !important;cursor:pointer;border:1px solid #ccc;}
input.ic-datepicker-visible-locked[readonly]:hover{background:#e9e9e9 !important;}
#booking_calender #reservierungsdatum_inline .ui-datepicker-header{
    min-height: 60px;
    display: flex;
    flex-direction: column;
    justify-content: center;
	border: none;
	position: relative;
}

#booking_calender #reservierungsdatum_inline{
	background-color: #f8f8f8 !important;
	border-radius: 5px !important;
	min-width: 265px !important;
	padding: 0 20px !important;
}

#booking_calender #reservierungsdatum_inline .ui-datepicker-inline{
	border: none;
	box-shadow: none;
	background-color: transparent;
}

.ui-datepicker .ui-datepicker-title{
	text-align: center;
}

#booking_calender #reservierungsdatum_inline .ui-datepicker-header .ui-datepicker-prev, #booking_calender #reservierungsdatum_inline .ui-datepicker-header .ui-datepicker-next{
    width: fit-content;
    border: none;
    top: 20px;
}

.ui-datepicker td span{
	display: block;
	padding: 6px 0;
	text-align: left;
	text-decoration: none;
	border-radius: 0;
	margin: 0;
	padding: 0.4em;
}

.ic-res-available a{
	background:none;
	color:#333;
	margin: 0;
	border-radius: 0;
	padding: 0.4em
}

.ic-res-available a:hover{
	background-color: #e9e9e9 !important;
	color:#333 !important;
	margin: 0;
	border-radius: 0;
}

.ic-res-past span{
	background:#f7f7f7 !important;
	color:#333 !important;
	margin: 0;
	border-radius: 0;
	padding: 0.4em;
	background: #ebebeb !important;
}

.ui-datepicker td.ic-res-today a{
	box-shadow: none;
	margin: 0;
	border-radius: 0;
	font-weight: normal;
	padding: 0.4em
}

.ui-datepicker td a{
	border-radius: 0;
	margin: 0;
	border: none;
	padding: 0.4em
}

.ui-datepicker-calendar td.ic-res-disabled::after{
	content: '';
}

.ui-datepicker table{
	font-size: 14px;
	margin-bottom: 50px;
}

.nf-form-cont .nf-form-wrap .nf-form-layout .nf-form-content .nf-field-container .nf-field .nf-field-element .nf-element{
	background: none !important;
}

.nf-form-cont .nf-form-wrap .nf-form-layout .nf-form-content .nf-field-container.submit-container .nf-field .nf-field-element .nf-element{
	position: relative;
	width: 262px;
	text-align: center;
	background-color: #7F1B59 !important;
	color: white;
	padding: 15px;
	box-sizing: border-box;
	border-radius: 10px;
	border-bottom: 3px solid #55123c;
	transition: background-color 0.25s ease;
	top: 100%;
	margin-left: auto;
	margin-right: auto;
	display: block;
	font-weight: 300;
	clear: both;
}

.nf-form-cont .nf-form-wrap .nf-form-layout .nf-form-content .nf-field-container.submit-container:hover .nf-field .nf-field-element .nf-element{
	background-color: #941f68 !important;
}

.nf-form-cont .nf-form-wrap .nf-form-layout .nf-form-content .nf-field-container.datenschutz .nf-field-description{
	margin: 0;
}

.nf-form-cont .nf-form-wrap .nf-form-layout .nf-form-content .nf-field-container.datenschutz .nf-field-label{
	display: none;
}

.nf-form-cont .nf-form-wrap .nf-form-layout .nf-form-content .nf-field-container{
	margin-bottom: 0;
}

.nf-form-cont .nf-form-wrap .nf-form-layout .nf-form-content .nf-field-container.your-package{
	height: 100%;
	max-height: 45px;
}

.nf-form-cont .nf-form-wrap .nf-form-layout .nf-form-content .nf-field-container.your-package .nf-field{
	height: 100%;
}

.nf-form-cont .nf-form-wrap .nf-form-layout .nf-form-content .nf-field-container.your-package .nf-field .field-wrap{
	height: 100%;
}

.nf-form-cont .nf-form-wrap .nf-form-layout .nf-form-content .nf-field-container.your-package .nf-field .field-wrap .nf-field-element{
	height: 100%;
}

.nf-form-cont .nf-form-wrap .nf-form-layout .nf-form-content .nf-field-container.your-package .nf-field .field-wrap .nf-field-element .ninja-forms-field{
	height: 100%;
}

/* =============================================
	Zweispaltiges Layout (gleich breite Hauptspalten) mit Zeit-Flex in rechter Spalte
	Umsetzung über 3 Grid-Spalten: 1fr .5fr .5fr -> Spalte2+3 zusammen = Breite von Spalte1
	So erhalten wir zwei optisch gleich breite Bereiche:
	  - Linker Bereich: Spalte 1
	  - Rechter Bereich: Spalten 2-3 (meist durch Span 2 / span 2)
	Uhrzeit von / bis besetzen einzeln Spalten 2 und 3 in Zeile 2 (50/50 innerhalb rechter Gesamtbreite)
	Nachricht spannt Rows 5-7 über Columns 2-3
	Responsive Fallback unter 780px: einspaltig
============================================= */

/* Grid auf nf-fields-wrap, damit wir fein steuern können */
.nf-form-cont .nf-form-wrap .nf-form-layout .nf-form-content nf-fields-wrap {
	display: grid;
	grid-template-columns: 1fr .5fr .5fr; /* zwei gleich breite Hauptbereiche via (1fr) und (.5fr+.5fr) */
	column-gap: 30px;
	row-gap: 18px;
}
.nf-form-cont .nf-form-wrap .nf-form-layout .nf-form-content nf-fields-wrap nf-field { display: contents; }

/* Zeile 1 */
nf-fields-wrap #nf-field-39-container { grid-column: 1; grid-row: 1; } /* Firma */
nf-fields-wrap #nf-field-46-container { grid-column: 2 / span 2; grid-row: 1; } /* Datum (über beide rechten Spalten) */
/* Zeile 2 */
nf-fields-wrap #nf-field-40-container { grid-column: 1; grid-row: 2; } /* Name */
nf-fields-wrap #nf-field-47-container { grid-column: 2; grid-row: 2; } /* Uhrzeit von */
nf-fields-wrap #nf-field-48-container { grid-column: 3; grid-row: 2; } /* bis */
/* Zeile 3 */
nf-fields-wrap #nf-field-41-container { grid-column: 1; grid-row: 3; } /* Straße */
nf-fields-wrap #nf-field-49-container { grid-column: 2 / span 2; grid-row: 3; } /* Gästezahl */
/* Zeile 4 */
nf-fields-wrap #nf-field-42-container { grid-column: 1; grid-row: 4; } /* PLZ */
nf-fields-wrap #nf-field-50-container { grid-column: 2 / span 2; grid-row: 4; } /* Paket */
/* Zeile 5-7 Nachricht + linke Felder */
nf-fields-wrap #nf-field-43-container { grid-column: 1; grid-row: 5; } /* Ort */
nf-fields-wrap #nf-field-44-container { grid-column: 1; grid-row: 6; } /* Telefon */
nf-fields-wrap #nf-field-45-container { grid-column: 1; grid-row: 7; } /* Email */
nf-fields-wrap #nf-field-51-container { grid-column: 2 / span 2; grid-row: 5 / span 3; } /* Nachricht über drei Zeilen */
/* Volle Breite unten */
nf-fields-wrap #nf-field-52-container { grid-column: 1 / span 3; grid-row: 8; }
nf-fields-wrap #nf-field-53-container { grid-column: 1 / span 3; grid-row: 9; }

@media (max-width: 780px) {
    .nf-form-cont .nf-form-wrap .nf-form-layout .nf-form-content nf-fields-wrap { display: block; }
    nf-fields-wrap #nf-field-39-container,
    nf-fields-wrap #nf-field-46-container,
    nf-fields-wrap #nf-field-40-container,
    nf-fields-wrap #nf-field-47-container,
    nf-fields-wrap #nf-field-102-container,
    nf-fields-wrap #nf-field-41-container,
    nf-fields-wrap #nf-field-101-container,
    nf-fields-wrap #nf-field-94-container,
    nf-fields-wrap #nf-field-50-container,
    nf-fields-wrap #nf-field-43-container,
    nf-fields-wrap #nf-field-44-container,
    nf-fields-wrap #nf-field-45-container,
    nf-fields-wrap #nf-field-51-container,
    nf-fields-wrap #nf-field-52-container,
    nf-fields-wrap #nf-field-53-container { grid-column: auto !important; grid-row: auto !important; }
}