/* ============================================================
   Flatpickr Custom Theme – Skip Intro
   Alle Farben über CSS-Variablen mit Fallback auf die Original-
   Werte, damit sie über die Modul-Einstellungen ("Frontend-
   Formular" → Datepicker) pflegbar sind, ohne diese Datei
   anfassen zu müssen.
   Zum Deaktivieren: Enqueue-Aufruf in class-frontend.php
   bei wp_enqueue_style( 'sit-tbk-flatpickr-theme', … ) auskommentieren.
   ============================================================ */

/* Kalender-Container */
.flatpickr-calendar {
	background: var( --sitr-cal-bg, #d5b36a );
	border: none;
	box-shadow: 0 6px 24px rgba(0, 0, 0, 0.35);
	border-radius: 6px;
	/* content-box: Padding wird zur fix berechneten Innenbreite addiert,
	   sonst schneidet .flatpickr-innerContainer (overflow:hidden) die
	   Sonntags-Spalte ab. */
	box-sizing: content-box !important;
	padding: 20px !important;
}

/* Trennlinien zwischen Zellen entfernen */
.flatpickr-calendar .dayContainer + .dayContainer {
	box-shadow: none;
}

/* Pfeil nach oben (Kalender öffnet unterhalb des Inputs) */
.flatpickr-calendar.arrowTop::before {
	border-bottom-color: var( --sitr-cal-accent, #c4a259 );
}
.flatpickr-calendar.arrowTop::after {
	border-bottom-color: var( --sitr-cal-bg, #d5b36a );
}

/* Pfeil nach unten (Kalender öffnet oberhalb des Inputs) */
.flatpickr-calendar.arrowBottom::before {
	border-top-color: var( --sitr-cal-accent, #c4a259 );
}
.flatpickr-calendar.arrowBottom::after {
	border-top-color: var( --sitr-cal-bg, #d5b36a );
}

/* ── Monats-Header ──────────────────────────────────────── */
.flatpickr-months {
	background: var( --sitr-cal-bg, #d5b36a );
	padding: 4px 0;
}

.flatpickr-months .flatpickr-month {
	color: var( --sitr-cal-text, #490c76 );
	fill: var( --sitr-cal-text, #490c76 );
}

/* Monatsname und Jahreszahl: nicht fett */
.flatpickr-current-month span.cur-month {
	color: var( --sitr-cal-text, #490c76 );
	font-weight: 300 !important;
}

.flatpickr-current-month input.cur-year {
	color: var( --sitr-cal-text, #490c76 );
	font-weight: 300 !important;
}

.flatpickr-current-month span.cur-month:hover,
.flatpickr-current-month .flatpickr-monthDropdown-months:hover {
	background: rgba(0, 0, 0, 0.08);
}

.flatpickr-current-month .flatpickr-monthDropdown-months {
	color: var( --sitr-cal-text, #490c76 );
	font-weight: 300 !important;
}

.flatpickr-current-month .flatpickr-monthDropdown-months .flatpickr-monthDropdown-month {
	background-color: var( --sitr-cal-bg, #d5b36a );
	color: var( --sitr-cal-text, #490c76 );
}

/* Jahr-Spinner Pfeile */
.flatpickr-current-month .numInputWrapper span.arrowUp::after {
	border-bottom-color: var( --sitr-cal-text, #490c76 );
}
.flatpickr-current-month .numInputWrapper span.arrowDown::after {
	border-top-color: var( --sitr-cal-text, #490c76 );
}
.flatpickr-current-month .numInputWrapper:hover {
	background: rgba(0, 0, 0, 0.08);
}

/* Prev/Next-Monat-Pfeile */
.flatpickr-months .flatpickr-prev-month,
.flatpickr-months .flatpickr-next-month {
	color: var( --sitr-cal-text, #490c76 );
	fill: var( --sitr-cal-text, #490c76 );
}
.flatpickr-months .flatpickr-prev-month svg,
.flatpickr-months .flatpickr-next-month svg {
	fill: var( --sitr-cal-text, #490c76 );
}
.flatpickr-months .flatpickr-prev-month:hover,
.flatpickr-months .flatpickr-next-month:hover {
	color: var( --sitr-cal-text, #490c76 );
}
.flatpickr-months .flatpickr-prev-month:hover svg,
.flatpickr-months .flatpickr-next-month:hover svg {
	fill: var( --sitr-cal-text, #490c76 );
}

/* ── Wochentag-Kopfzeile ────────────────────────────────── */
.flatpickr-weekdays {
	background: var( --sitr-cal-bg, #d5b36a );
}
span.flatpickr-weekday {
	background: var( --sitr-cal-bg, #d5b36a );
	color: var( --sitr-cal-text, #490c76 );
	font-weight: 700;
}

/* ── Tage allgemein: runde Borders entfernen ────────────── */
.flatpickr-day {
	border-radius: 0;
	border: none;
	border-bottom: 2px solid transparent;
	color: var( --sitr-cal-day, #3c3939 );
	font-weight: 700;
	background: transparent;
}

/* ── Hover & Focus: nur border-bottom, kein Background ──── */
.flatpickr-day:hover,
.flatpickr-day:focus,
.flatpickr-day.prevMonthDay:hover,
.flatpickr-day.nextMonthDay:hover,
.flatpickr-day.prevMonthDay:focus,
.flatpickr-day.nextMonthDay:focus {
	background: transparent !important;
	border-color: transparent;
	border-bottom: 2px solid var( --sitr-cal-text, #490c76 );
	color: var( --sitr-cal-day, #3c3939 );
	outline: none;
}

/* ── Heute ──────────────────────────────────────────────── */
.flatpickr-day.today {
	background: transparent !important;
	border-color: transparent;
	border-bottom: 2px solid var( --sitr-cal-text, #490c76 );
	color: var( --sitr-cal-text, #490c76 );
	font-weight: 700;
}
.flatpickr-day.today:hover,
.flatpickr-day.today:focus {
	background: transparent !important;
	border-color: transparent;
	border-bottom: 2px solid var( --sitr-cal-text, #490c76 );
	color: var( --sitr-cal-text, #490c76 );
}

/* ── Ausgewählt: Rahmen rundum ──────────────────────────── */
.flatpickr-day.selected,
.flatpickr-day.selected:hover,
.flatpickr-day.selected:focus,
.flatpickr-day.startRange,
.flatpickr-day.endRange {
	background: transparent !important;
	box-shadow: none;
	border: 2px solid var( --sitr-cal-text, #490c76 );
	border-radius: 3px;
	color: var( --sitr-cal-text, #490c76 );
	font-weight: 700;
}

/* ── Inaktive / gesperrte Tage ──────────────────────────── */
.flatpickr-day.flatpickr-disabled,
.flatpickr-day.flatpickr-disabled:hover,
.flatpickr-day.notAllowed,
.flatpickr-day.notAllowed.prevMonthDay,
.flatpickr-day.notAllowed.nextMonthDay {
	color: var( --sitr-cal-disabled, #957d4a );
	background: transparent !important;
	border-color: transparent;
	cursor: not-allowed;
	font-weight: 400;
}

/* ── Tage des Vormonats: inaktive Farbe ─────────────────── */
.flatpickr-day.prevMonthDay {
	color: var( --sitr-cal-disabled, #957d4a );
	font-weight: 400;
}

/* ── Tage des Folgemonats ───────────────────────────────── */
.flatpickr-day.nextMonthDay {
	color: var( --sitr-cal-next-month, #fff );
	font-weight: 400;
}