@charset "UTF-8";
/* =============================================================== *\
   Reset & Base
\* =============================================================== */
/* =============================================================== *\
   CSS-Reset
\* =============================================================== */
*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html,
body {
  margin: 0;
  padding: 0;
  height: 100%;
  -webkit-font-smoothing: subpixel-antialiased; /* Safari, Chrome */
  -moz-osx-font-smoothing: auto; /* Firefox (kein subpixel support, aber auto ≈ subpixel) */
  text-rendering: optimizeLegibility; /* Optional: bessere Kerning/Lesbarkeit */
  text-size-adjust: 100%;
  line-height: 1.5;
}

body {
  line-height: inherit;
}

img,
picture,
video,
canvas,
svg {
  display: block;
  max-width: 100%;
}

button,
input,
textarea,
select {
  font: inherit;
  margin: 0;
}

textarea {
  resize: vertical;
}

button {
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
}

a {
  text-decoration: none;
  color: inherit;
}

ul[role=list],
ol[role=list] {
  list-style: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

h1, h2, h3, h4, h5, h6, p, ul, ol, figure, blockquote, dl, dd {
  margin: 0;
  padding: 0;
}

strong {
  font-weight: bold;
}

hr {
  border: none;
  height: 1px;
  background-color: currentColor;
}

blockquote {
  margin: 0;
  padding-left: 1.5rem;
  border-left: 4px solid currentColor;
}

:focus {
  outline: 2px solid #000;
  outline-offset: 2px;
}

:focus:not(:focus-visible) {
  outline: none;
}

/* =============================================================== *\ 
   Input-Elemente
\* =============================================================== */
/* Entfernt die Autofill-Hintergrundfarbe und -Textfarbe, um den Stil des Inputs zu übernehmen */
input:-webkit-autofill {
  -webkit-box-shadow: 0 0 0 30px transparent inset !important; /* Setzt den Autofill-Hintergrund auf transparent */
  -webkit-text-fill-color: inherit !important; /* Vererbt die Textfarbe */
}

/* Entfernt die Pfeile (Spinners) in WebKit-basierten Browsern (Chrome, Safari, Edge) */
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Entfernt die Pfeile in Firefox */
input[type=number] {
  -moz-appearance: textfield;
}

/* Dropdown-Pfeil bei select-Elementen */
/* Entfernt den Standard-Pfeil in WebKit-basierten Browsern */
select::-webkit-inner-spin-button,
select::-webkit-appearance {
  -webkit-appearance: none;
}

/* Entfernt den Standard-Pfeil in Firefox */
select {
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
}

html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  /*font-size: 100%;"*/
  vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block;
}

body {
  /*line-height: 1;*/
}

ol,
ul {
  list-style: none;
}

blockquote,
q {
  quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
  content: "";
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

/* =============================================================== *\ 
   Form-Reset
\* =============================================================== */
input,
select,
textarea,
button {
  margin: 0;
  padding: 0;
  background: none;
  border: none;
  font-family: inherit;
  font-size: 100%;
}

/* =============================================================== *\
   Basis HTML-Elemente
\* =============================================================== */
body {
  background-color: var(--background);
}

/* Formularfelder */
input,
textarea {
  margin: 10px 20px;
  padding: 10px 16px;
  border: none;
  line-height: 1em;
}

textarea {
  line-height: 1em;
}

/* Stil für den Placeholder-Text */
textarea::-webkit-input-placeholder,
input::-webkit-input-placeholder {
  /* Webkit-basierte Browser (Chrome, Safari, Edge) */
}

textarea::-moz-placeholder,
input::-moz-placeholder {
  /* Firefox 19+ */
}

textarea:-ms-input-placeholder,
input:-ms-input-placeholder {
  /* Internet Explorer und Microsoft Edge */
}

textarea:-moz-placeholder,
input:-moz-placeholder {
  /* Firefox 18- */
}

textarea:focus,
input:focus {
  outline: none; /* Entfernt den Standard-Fokus-Rahmen */
  border: none; /* Entfernt die eigene Border (falls vorhanden) */
}

input[type=submit] {
  cursor: pointer;
  border: 1px solid;
  border-radius: 100px;
  text-transform: uppercase;
  letter-spacing: 0.13em;
  padding: 0.7rem 1.4rem;
}

input[type=submit]:hover {
  cursor: pointer;
}

/* =============================================================== *\
   Layout & Struktur
\* =============================================================== */
.flatpickr-calendar {
  background: transparent;
  opacity: 0;
  display: none;
  text-align: center;
  visibility: hidden;
  padding: 0;
  -webkit-animation: none;
  animation: none;
  direction: ltr;
  border: 0;
  font-size: 14px;
  line-height: 24px;
  border-radius: 5px;
  position: absolute;
  width: 307.875px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -ms-touch-action: manipulation;
  touch-action: manipulation;
  background: #fff;
  -webkit-box-shadow: 1px 0 0 #e6e6e6, -1px 0 0 #e6e6e6, 0 1px 0 #e6e6e6, 0 -1px 0 #e6e6e6, 0 3px 13px rgba(0, 0, 0, 0.08);
  box-shadow: 1px 0 0 #e6e6e6, -1px 0 0 #e6e6e6, 0 1px 0 #e6e6e6, 0 -1px 0 #e6e6e6, 0 3px 13px rgba(0, 0, 0, 0.08);
}

.flatpickr-calendar.open, .flatpickr-calendar.inline {
  opacity: 1;
  max-height: 640px;
  visibility: visible;
}

.flatpickr-calendar.open {
  display: inline-block;
  z-index: 99999;
}

.flatpickr-calendar.animate.open {
  -webkit-animation: fpFadeInDown 300ms cubic-bezier(0.23, 1, 0.32, 1);
  animation: fpFadeInDown 300ms cubic-bezier(0.23, 1, 0.32, 1);
}

.flatpickr-calendar.inline {
  display: block;
  position: relative;
  top: 2px;
}

.flatpickr-calendar.static {
  position: absolute;
  top: calc(100% + 2px);
}

.flatpickr-calendar.static.open {
  z-index: 999;
  display: block;
}

.flatpickr-calendar.multiMonth .flatpickr-days .dayContainer:nth-child(n+1) .flatpickr-day.inRange:nth-child(7n+7) {
  -webkit-box-shadow: none !important;
  box-shadow: none !important;
}

.flatpickr-calendar.multiMonth .flatpickr-days .dayContainer:nth-child(n+2) .flatpickr-day.inRange:nth-child(7n+1) {
  -webkit-box-shadow: -2px 0 0 #e6e6e6, 5px 0 0 #e6e6e6;
  box-shadow: -2px 0 0 #e6e6e6, 5px 0 0 #e6e6e6;
}

.flatpickr-calendar .hasWeeks .dayContainer, .flatpickr-calendar .hasTime .dayContainer {
  border-bottom: 0;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}

.flatpickr-calendar .hasWeeks .dayContainer {
  border-left: 0;
}

.flatpickr-calendar.hasTime .flatpickr-time {
  height: 40px;
  border-top: 1px solid #e6e6e6;
}

.flatpickr-calendar.noCalendar.hasTime .flatpickr-time {
  height: auto;
}

.flatpickr-calendar:before, .flatpickr-calendar:after {
  position: absolute;
  display: block;
  pointer-events: none;
  border: solid transparent;
  content: "";
  height: 0;
  width: 0;
  left: 22px;
}

.flatpickr-calendar.rightMost:before, .flatpickr-calendar.arrowRight:before, .flatpickr-calendar.rightMost:after, .flatpickr-calendar.arrowRight:after {
  left: auto;
  right: 22px;
}

.flatpickr-calendar.arrowCenter:before, .flatpickr-calendar.arrowCenter:after {
  left: 50%;
  right: 50%;
}

.flatpickr-calendar:before {
  border-width: 5px;
  margin: 0 -5px;
}

.flatpickr-calendar:after {
  border-width: 4px;
  margin: 0 -4px;
}

.flatpickr-calendar.arrowTop:before, .flatpickr-calendar.arrowTop:after {
  bottom: 100%;
}

.flatpickr-calendar.arrowTop:before {
  border-bottom-color: #e6e6e6;
}

.flatpickr-calendar.arrowTop:after {
  border-bottom-color: #fff;
}

.flatpickr-calendar.arrowBottom:before, .flatpickr-calendar.arrowBottom:after {
  top: 100%;
}

.flatpickr-calendar.arrowBottom:before {
  border-top-color: #e6e6e6;
}

.flatpickr-calendar.arrowBottom:after {
  border-top-color: #fff;
}

.flatpickr-calendar:focus {
  outline: 0;
}

.flatpickr-wrapper {
  position: relative;
  display: inline-block;
}

.flatpickr-months {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.flatpickr-months .flatpickr-month {
  background: transparent;
  color: rgba(0, 0, 0, 0.9);
  fill: rgba(0, 0, 0, 0.9);
  height: 34px;
  line-height: 1;
  text-align: center;
  position: relative;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  overflow: hidden;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
}

.flatpickr-months .flatpickr-prev-month, .flatpickr-months .flatpickr-next-month {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  text-decoration: none;
  cursor: pointer;
  position: absolute;
  top: 0;
  height: 34px;
  padding: 10px;
  z-index: 3;
  color: rgba(0, 0, 0, 0.9);
  fill: rgba(0, 0, 0, 0.9);
}

.flatpickr-months .flatpickr-prev-month.flatpickr-disabled, .flatpickr-months .flatpickr-next-month.flatpickr-disabled {
  display: none;
}

.flatpickr-months .flatpickr-prev-month i, .flatpickr-months .flatpickr-next-month i {
  position: relative;
}

.flatpickr-months .flatpickr-prev-month.flatpickr-prev-month, .flatpickr-months .flatpickr-next-month.flatpickr-prev-month { /*
/*rtl:begin:ignore*/
  left: 0;
} /*
/*rtl:begin:ignore*/
/*
      /*rtl:end:ignore*/
.flatpickr-months .flatpickr-prev-month.flatpickr-next-month, .flatpickr-months .flatpickr-next-month.flatpickr-next-month { /*
/*rtl:begin:ignore*/
  right: 0;
} /*
/*rtl:begin:ignore*/
/*
      /*rtl:end:ignore*/
.flatpickr-months .flatpickr-prev-month:hover, .flatpickr-months .flatpickr-next-month:hover {
  color: #959ea9;
}

.flatpickr-months .flatpickr-prev-month:hover svg, .flatpickr-months .flatpickr-next-month:hover svg {
  fill: #f64747;
}

.flatpickr-months .flatpickr-prev-month svg, .flatpickr-months .flatpickr-next-month svg {
  width: 14px;
  height: 14px;
}

.flatpickr-months .flatpickr-prev-month svg path, .flatpickr-months .flatpickr-next-month svg path {
  -webkit-transition: fill 0.1s;
  transition: fill 0.1s;
  fill: inherit;
}

.numInputWrapper {
  position: relative;
  height: auto;
}

.numInputWrapper input, .numInputWrapper span {
  display: inline-block;
}

.numInputWrapper input {
  width: 100%;
}

.numInputWrapper input::-ms-clear {
  display: none;
}

.numInputWrapper input::-webkit-outer-spin-button, .numInputWrapper input::-webkit-inner-spin-button {
  margin: 0;
  -webkit-appearance: none;
}

.numInputWrapper span {
  position: absolute;
  right: 0;
  width: 14px;
  padding: 0 4px 0 2px;
  height: 50%;
  line-height: 50%;
  opacity: 0;
  cursor: pointer;
  border: 1px solid rgba(57, 57, 57, 0.15);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.numInputWrapper span:hover {
  background: rgba(0, 0, 0, 0.1);
}

.numInputWrapper span:active {
  background: rgba(0, 0, 0, 0.2);
}

.numInputWrapper span:after {
  display: block;
  content: "";
  position: absolute;
}

.numInputWrapper span.arrowUp {
  top: 0;
  border-bottom: 0;
}

.numInputWrapper span.arrowUp:after {
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-bottom: 4px solid rgba(57, 57, 57, 0.6);
  top: 26%;
}

.numInputWrapper span.arrowDown {
  top: 50%;
}

.numInputWrapper span.arrowDown:after {
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 4px solid rgba(57, 57, 57, 0.6);
  top: 40%;
}

.numInputWrapper span svg {
  width: inherit;
  height: auto;
}

.numInputWrapper span svg path {
  fill: rgba(0, 0, 0, 0.5);
}

.numInputWrapper:hover {
  background: rgba(0, 0, 0, 0.05);
}

.numInputWrapper:hover span {
  opacity: 1;
}

.flatpickr-current-month {
  font-size: 135%;
  line-height: inherit;
  font-weight: 300;
  color: inherit;
  position: absolute;
  width: 75%;
  left: 12.5%;
  padding: 7.48px 0 0 0;
  line-height: 1;
  height: 34px;
  display: inline-block;
  text-align: center;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

.flatpickr-current-month span.cur-month {
  font-family: inherit;
  font-weight: 700;
  color: inherit;
  display: inline-block;
  margin-left: 0.5ch;
  padding: 0;
}

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

.flatpickr-current-month .numInputWrapper {
  width: 6ch;
  width: 7ch\0 ;
  display: inline-block;
}

.flatpickr-current-month .numInputWrapper span.arrowUp:after {
  border-bottom-color: rgba(0, 0, 0, 0.9);
}

.flatpickr-current-month .numInputWrapper span.arrowDown:after {
  border-top-color: rgba(0, 0, 0, 0.9);
}

.flatpickr-current-month input.cur-year {
  background: transparent;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  color: inherit;
  cursor: text;
  padding: 0 0 0 0.5ch;
  margin: 0;
  display: inline-block;
  font-size: inherit;
  font-family: inherit;
  font-weight: 300;
  line-height: inherit;
  height: auto;
  border: 0;
  border-radius: 0;
  vertical-align: initial;
  -webkit-appearance: textfield;
  -moz-appearance: textfield;
  appearance: textfield;
}

.flatpickr-current-month input.cur-year:focus {
  outline: 0;
}

.flatpickr-current-month input.cur-year[disabled], .flatpickr-current-month input.cur-year[disabled]:hover {
  font-size: 100%;
  color: rgba(0, 0, 0, 0.5);
  background: transparent;
  pointer-events: none;
}

.flatpickr-current-month .flatpickr-monthDropdown-months {
  appearance: menulist;
  background: transparent;
  border: none;
  border-radius: 0;
  box-sizing: border-box;
  color: inherit;
  cursor: pointer;
  font-size: inherit;
  font-family: inherit;
  font-weight: 300;
  height: auto;
  line-height: inherit;
  margin: -1px 0 0 0;
  outline: none;
  padding: 0 0 0 0.5ch;
  position: relative;
  vertical-align: initial;
  -webkit-box-sizing: border-box;
  -webkit-appearance: menulist;
  -moz-appearance: menulist;
  width: auto;
}

.flatpickr-current-month .flatpickr-monthDropdown-months:focus, .flatpickr-current-month .flatpickr-monthDropdown-months:active {
  outline: none;
}

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

.flatpickr-current-month .flatpickr-monthDropdown-months .flatpickr-monthDropdown-month {
  background-color: transparent;
  outline: none;
  padding: 0;
}

.flatpickr-weekdays {
  background: transparent;
  text-align: center;
  overflow: hidden;
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  height: 28px;
}

.flatpickr-weekdays .flatpickr-weekdaycontainer {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
}

span.flatpickr-weekday {
  cursor: default;
  font-size: 90%;
  background: transparent;
  color: rgba(0, 0, 0, 0.54);
  line-height: 1;
  margin: 0;
  text-align: center;
  display: block;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  font-weight: bolder;
}

.dayContainer, .flatpickr-weeks {
  padding: 1px 0 0 0;
}

.flatpickr-days {
  position: relative;
  overflow: hidden;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  width: 307.875px;
}

.flatpickr-days:focus {
  outline: 0;
}

.dayContainer {
  padding: 0;
  outline: 0;
  text-align: left;
  width: 307.875px;
  min-width: 307.875px;
  max-width: 307.875px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: inline-block;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-around;
  justify-content: space-around;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  opacity: 1;
}

.dayContainer + .dayContainer {
  -webkit-box-shadow: -1px 0 0 #e6e6e6;
  box-shadow: -1px 0 0 #e6e6e6;
}

.flatpickr-day {
  background: none;
  border: 1px solid transparent;
  border-radius: 150px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  color: #393939;
  cursor: pointer;
  font-weight: 400;
  width: 14.2857143%;
  -webkit-flex-basis: 14.2857143%;
  -ms-flex-preferred-size: 14.2857143%;
  flex-basis: 14.2857143%;
  max-width: 39px;
  height: 39px;
  line-height: 39px;
  margin: 0;
  display: inline-block;
  position: relative;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  text-align: center;
}

.flatpickr-day.inRange, .flatpickr-day.prevMonthDay.inRange, .flatpickr-day.nextMonthDay.inRange, .flatpickr-day.today.inRange, .flatpickr-day.prevMonthDay.today.inRange, .flatpickr-day.nextMonthDay.today.inRange, .flatpickr-day:hover, .flatpickr-day.prevMonthDay:hover, .flatpickr-day.nextMonthDay:hover, .flatpickr-day:focus, .flatpickr-day.prevMonthDay:focus, .flatpickr-day.nextMonthDay:focus {
  cursor: pointer;
  outline: 0;
  background: #e6e6e6;
  border-color: #e6e6e6;
}

.flatpickr-day.today {
  border-color: #959ea9;
}

.flatpickr-day.today:hover, .flatpickr-day.today:focus {
  border-color: #959ea9;
  background: #959ea9;
  color: #fff;
}

.flatpickr-day.selected, .flatpickr-day.startRange, .flatpickr-day.endRange, .flatpickr-day.selected.inRange, .flatpickr-day.startRange.inRange, .flatpickr-day.endRange.inRange, .flatpickr-day.selected:focus, .flatpickr-day.startRange:focus, .flatpickr-day.endRange:focus, .flatpickr-day.selected:hover, .flatpickr-day.startRange:hover, .flatpickr-day.endRange:hover, .flatpickr-day.selected.prevMonthDay, .flatpickr-day.startRange.prevMonthDay, .flatpickr-day.endRange.prevMonthDay, .flatpickr-day.selected.nextMonthDay, .flatpickr-day.startRange.nextMonthDay, .flatpickr-day.endRange.nextMonthDay {
  background: #569ff7;
  -webkit-box-shadow: none;
  box-shadow: none;
  color: #fff;
  border-color: #569ff7;
}

.flatpickr-day.selected.startRange, .flatpickr-day.startRange.startRange, .flatpickr-day.endRange.startRange {
  border-radius: 50px 0 0 50px;
}

.flatpickr-day.selected.endRange, .flatpickr-day.startRange.endRange, .flatpickr-day.endRange.endRange {
  border-radius: 0 50px 50px 0;
}

.flatpickr-day.selected.startRange + .endRange:not(:nth-child(7n+1)), .flatpickr-day.startRange.startRange + .endRange:not(:nth-child(7n+1)), .flatpickr-day.endRange.startRange + .endRange:not(:nth-child(7n+1)) {
  -webkit-box-shadow: -10px 0 0 #569ff7;
  box-shadow: -10px 0 0 #569ff7;
}

.flatpickr-day.selected.startRange.endRange, .flatpickr-day.startRange.startRange.endRange, .flatpickr-day.endRange.startRange.endRange {
  border-radius: 50px;
}

.flatpickr-day.inRange {
  border-radius: 0;
  -webkit-box-shadow: -5px 0 0 #e6e6e6, 5px 0 0 #e6e6e6;
  box-shadow: -5px 0 0 #e6e6e6, 5px 0 0 #e6e6e6;
}

.flatpickr-day.flatpickr-disabled, .flatpickr-day.flatpickr-disabled:hover, .flatpickr-day.prevMonthDay, .flatpickr-day.nextMonthDay, .flatpickr-day.notAllowed, .flatpickr-day.notAllowed.prevMonthDay, .flatpickr-day.notAllowed.nextMonthDay {
  color: rgba(57, 57, 57, 0.3);
  background: transparent;
  border-color: transparent;
  cursor: default;
}

.flatpickr-day.flatpickr-disabled, .flatpickr-day.flatpickr-disabled:hover {
  cursor: not-allowed;
  color: rgba(57, 57, 57, 0.1);
}

.flatpickr-day.week.selected {
  border-radius: 0;
  -webkit-box-shadow: -5px 0 0 #569ff7, 5px 0 0 #569ff7;
  box-shadow: -5px 0 0 #569ff7, 5px 0 0 #569ff7;
}

.flatpickr-day.hidden {
  visibility: hidden;
}

.rangeMode .flatpickr-day {
  margin-top: 1px;
}

.flatpickr-weekwrapper {
  float: left;
}

.flatpickr-weekwrapper .flatpickr-weeks {
  padding: 0 12px;
  -webkit-box-shadow: 1px 0 0 #e6e6e6;
  box-shadow: 1px 0 0 #e6e6e6;
}

.flatpickr-weekwrapper .flatpickr-weekday {
  float: none;
  width: 100%;
  line-height: 28px;
}

.flatpickr-weekwrapper span.flatpickr-day, .flatpickr-weekwrapper span.flatpickr-day:hover {
  display: block;
  width: 100%;
  max-width: none;
  color: rgba(57, 57, 57, 0.3);
  background: transparent;
  cursor: default;
  border: none;
}

.flatpickr-innerContainer {
  display: block;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  overflow: hidden;
}

.flatpickr-rContainer {
  display: inline-block;
  padding: 0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.flatpickr-time {
  text-align: center;
  outline: 0;
  display: block;
  height: 0;
  line-height: 40px;
  max-height: 40px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  overflow: hidden;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.flatpickr-time:after {
  content: "";
  display: table;
  clear: both;
}

.flatpickr-time .numInputWrapper {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  width: 40%;
  height: 40px;
  float: left;
}

.flatpickr-time .numInputWrapper span.arrowUp:after {
  border-bottom-color: #393939;
}

.flatpickr-time .numInputWrapper span.arrowDown:after {
  border-top-color: #393939;
}

.flatpickr-time.hasSeconds .numInputWrapper {
  width: 26%;
}

.flatpickr-time.time24hr .numInputWrapper {
  width: 49%;
}

.flatpickr-time input {
  background: transparent;
  -webkit-box-shadow: none;
  box-shadow: none;
  border: 0;
  border-radius: 0;
  text-align: center;
  margin: 0;
  padding: 0;
  height: inherit;
  line-height: inherit;
  color: #393939;
  font-size: 14px;
  position: relative;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-appearance: textfield;
  -moz-appearance: textfield;
  appearance: textfield;
}

.flatpickr-time input.flatpickr-hour {
  font-weight: bold;
}

.flatpickr-time input.flatpickr-minute, .flatpickr-time input.flatpickr-second {
  font-weight: 400;
}

.flatpickr-time input:focus {
  outline: 0;
  border: 0;
}

.flatpickr-time .flatpickr-time-separator, .flatpickr-time .flatpickr-am-pm {
  height: inherit;
  float: left;
  line-height: inherit;
  color: #393939;
  font-weight: bold;
  width: 2%;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-align-self: center;
  -ms-flex-item-align: center;
  align-self: center;
}

.flatpickr-time .flatpickr-am-pm {
  outline: 0;
  width: 18%;
  cursor: pointer;
  text-align: center;
  font-weight: 400;
}

.flatpickr-time input:hover, .flatpickr-time .flatpickr-am-pm:hover, .flatpickr-time input:focus, .flatpickr-time .flatpickr-am-pm:focus {
  background: #eee;
}

.flatpickr-input[readonly] {
  cursor: pointer;
}

@-webkit-keyframes fpFadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes fpFadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
#ud-notes-modal .ud-notes-list .ud-notes-item {
  position: relative;
  padding: 0.44rem;
  border-radius: 12px;
  padding: 0;
  background-color: white;
  margin-bottom: 1rem;
}
#ud-notes-modal .ud-notes-list .ud-notes-item .ud-note {
  background: var(--neutral-200);
  padding: 5px 10px;
  border-radius: 8px;
  line-height: 1.25rem;
}
#ud-notes-modal .ud-notes-list .ud-notes-item .ud-note-replies {
  margin-left: 1.5rem;
}
#ud-notes-modal .ud-notes-list .ud-notes-item .ud-note-replies .ud-note-reply {
  background: var(--neutral-200);
  margin-top: 0.5rem;
  padding: 5px 10px;
  border-radius: 8px;
}
#ud-notes-modal .ud-notes-list .ud-notes-item .ud-note-reply-field {
  margin: 0;
  background: white;
  width: 100%;
  margin-top: 1rem;
  border-radius: 8px;
  margin-left: 1.5rem;
  width: calc(100% - 1.5rem);
  margin-top: 0.5rem;
  border: 1px solid var(--neutral-600);
}
#ud-notes-modal .ud-notes-list .ud-notes-item:last-child {
  margin-bottom: 2rem;
}
#ud-notes-modal .ud-note-actions .ud-note-buttons {
  display: flex;
  justify-content: flex-end;
  gap: 0.6rem;
}
#ud-notes-modal .ud-note-actions .ud-note-buttons button {
  padding: 0.5rem 0.75rem;
  border-radius: 100px;
  transition: all 0.2s;
}
#ud-notes-modal .ud-note-actions .ud-note-buttons .ud-note-reply-btn {
  opacity: 0;
  display: none;
  pointer-events: none;
  background: var(--wp--preset--color--theme-300);
  color: var(--wp--preset--color--theme-600);
}
#ud-notes-modal .ud-note-actions .ud-note-buttons .ud-note-reply-btn:hover {
  background: var(--wp--preset--color--theme-400);
  color: var(--wp--preset--color--theme-700);
}
#ud-notes-modal .ud-note-actions .ud-note-buttons .ud-note-done {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  padding: 4px 10px 4px 6px;
  background: var(--wp--preset--color--theme-300);
  color: var(--wp--preset--color--theme-600);
}
#ud-notes-modal .ud-note-actions .ud-note-buttons .ud-note-done svg path {
  fill: var(--wp--preset--color--theme-600);
}
#ud-notes-modal .ud-note-actions .ud-note-buttons .ud-note-done:hover {
  background: var(--wp--preset--color--theme-400);
  color: var(--wp--preset--color--theme-700);
}
#ud-notes-modal .ud-note-actions .ud-note-buttons .ud-note-done:hover svg path {
  fill: var(--wp--preset--color--theme-700);
}
#ud-notes-modal .ud-note-actions {
  /* Wenn Text vorhanden: Reply zeigen, Done ausblenden */
}
#ud-notes-modal .ud-note-actions .ud-note-reply-field:not(:placeholder-shown) + .ud-note-buttons .ud-note-reply-btn {
  opacity: 1;
  pointer-events: auto;
  display: initial;
}
#ud-notes-modal .ud-note-actions .ud-note-reply-field:not(:placeholder-shown) + .ud-note-buttons .ud-note-done {
  opacity: 0;
  display: none;
  pointer-events: none;
}
#ud-notes-modal .ud-notes-input {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.5rem;
}
#ud-notes-modal .ud-notes-input .ud-notes-new {
  background: var(--neutral-200);
  border: 1px solid var(--neutral-400);
  border-radius: 8px;
  width: calc(100% - 0px);
  margin: 0 0;
}

#ud-notes-modal .ud-notes-input button.button-save {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  padding: 7px 10px 7px 8px;
  border-radius: 100px;
  background-color: var(--wp--preset--color--theme-300) !important;
  color: var(--wp--preset--color--theme-600);
  transition: all 0.2s;
}
#ud-notes-modal .ud-notes-input button.button-save svg {
  width: 18px;
  height: 18px;
}
#ud-notes-modal .ud-notes-input button.button-save svg path {
  fill: var(--wp--preset--color--theme-600);
}
#ud-notes-modal .ud-notes-input button.button-save:hover {
  background: var(--wp--preset--color--theme-400) !important;
  color: var(--wp--preset--color--theme-700);
}
#ud-notes-modal .ud-notes-input button.button-save:hover svg path {
  fill: var(--wp--preset--color--theme-700);
}

.ud-notes-progress-ring {
  width: 18px;
  height: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.ud-notes-progress-ring svg {
  width: 100%;
  height: 100%;
}
.ud-notes-progress-ring .bg {
  stroke: transparent;
  stroke-width: 3;
  fill: none;
}
.ud-notes-progress-ring .indicator {
  stroke: var(--error-500);
  stroke-width: 3;
  fill: none;
  opacity: 0; /* wird aktiv wenn neue Nachrichten */
  transition: opacity 0.2s;
}

/* =============================================================== *\
   Variablen (Farben, Spacing, Radius, Shadow)
\* =============================================================== */
:root {
  --wp--preset--color--neutral-100: #f2f2f2; /* sehr hell, fast weißlich mit Hauch Farbe */
  --wp--preset--color--neutral-200: #d9e1e0; /* zartes Grau */
  --wp--preset--color--neutral-300: #bfc7c6; /* helles Grau */
  --wp--preset--color--neutral-400: #9ea5a4; /* mittleres Grau */
  --wp--preset--color--neutral-500: #7f8685; /* gedecktes Grau */
  --wp--preset--color--neutral-600: #5f6564; /* dunkleres Grau */
  --wp--preset--color--neutral-700: #3e3e3e; /* dunkelgrau (dein Wert) */
  --wp--preset--color--neutral-800: #383838; /* fast schwarz (dein Wert) */
  --wp--preset--color--neutral-900: #2c2c2c; /* near-black */
  --neutral-100: #f8f9fa;
  --neutral-200: #f1f3f5;
  --neutral-300: #e9ecef;
  --neutral-400: #dee2e6;
  --neutral-500: #ced4da;
  --neutral-600: #adb5bd;
  --neutral-700: #868e96;
  --neutral-800: #495057;
  --neutral-900: #343a40;
  --shadow-100: 0 1px 2px rgba(0, 0, 0, 0.06);
  --shadow-200: 0 1px 3px rgba(0, 0, 0, 0.08);
  --shadow-300: 0 2px 4px rgba(0, 0, 0, 0.1);
  --shadow-400: 0 3px 6px rgba(0, 0, 0, 0.12);
  --shadow-500: 0 4px 8px rgba(0, 0, 0, 0.14);
  --shadow-700: 0 6px 12px rgba(0, 0, 0, 0.18);
  --shadow-900: 0 8px 16px rgba(0, 0, 0, 0.22);
  --background: #fff9ec;
  --error-100: #fdecec;
  --error-200: #f9c8c8;
  --error-300: #f39797;
  --error-400: #ed6a6a;
  --error-500: #e53935;
  --error-600: #c62828;
  --error-700: #a31616;
  --error-800: #6f1111;
  --error-900: #3c0d0c;
  --partial-500: #FFC107;
}

/* =============================================================== *\
   Anpassungen für Mobile (Variablen)
\* =============================================================== */
/* ===========================================
   🧾 Kiosk-Layout für Reservationen
   =========================================== */
.hidden {
  display: none !important;
}

.page-template-kiosk header {
  height: 55px;
  overflow: visible;
}
.page-template-kiosk .entry-content {
  margin-top: 0;
}
.page-template-kiosk footer {
  position: fixed;
  bottom: 0;
}
.page-template-kiosk footer .reservieren_sie_unter {
  background: white;
  padding: 8px 18px;
  bottom: 12px;
  margin-bottom: 16px;
  box-shadow: var(--shadow-500);
  border-top-right-radius: 100px;
  border-bottom-right-radius: 100px;
}

/* ================================
   🧱 Kachel-Grid
================================ */
#ud-kiosk-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1.25rem;
  padding: 1rem;
  max-width: calc(100% - 80px);
  margin: auto;
}
#ud-kiosk-list[data-count="7"], #ud-kiosk-list[data-count="8"] {
  gap: 1rem;
}
#ud-kiosk-list[data-count="7"] .ud-kiosk-card, #ud-kiosk-list[data-count="8"] .ud-kiosk-card {
  max-width: calc(25% - 1rem);
  border-radius: 14px;
  padding: 8px;
}
#ud-kiosk-list[data-count="7"] .ud-kiosk-card h3, #ud-kiosk-list[data-count="8"] .ud-kiosk-card h3 {
  font-size: 0.9rem;
  line-height: 0.9rem;
}
#ud-kiosk-list[data-count="9"], #ud-kiosk-list[data-count="10"] {
  gap: 1rem;
}
#ud-kiosk-list[data-count="9"] .ud-kiosk-card, #ud-kiosk-list[data-count="10"] .ud-kiosk-card {
  border-radius: 12px;
  padding: 4px;
  max-width: calc(20% - 1rem);
}
#ud-kiosk-list[data-count="9"] .ud-kiosk-card h3, #ud-kiosk-list[data-count="10"] .ud-kiosk-card h3 {
  font-size: 0.9rem;
  line-height: 0.9rem;
}
#ud-kiosk-list[data-count="11"], #ud-kiosk-list[data-count="12"], #ud-kiosk-list[data-count="13"], #ud-kiosk-list[data-count="14"], #ud-kiosk-list[data-count="15"], #ud-kiosk-list[data-count="16"], #ud-kiosk-list[data-count="17"], #ud-kiosk-list[data-count="18"] {
  gap: 1rem;
}
#ud-kiosk-list[data-count="11"] .ud-kiosk-card, #ud-kiosk-list[data-count="12"] .ud-kiosk-card, #ud-kiosk-list[data-count="13"] .ud-kiosk-card, #ud-kiosk-list[data-count="14"] .ud-kiosk-card, #ud-kiosk-list[data-count="15"] .ud-kiosk-card, #ud-kiosk-list[data-count="16"] .ud-kiosk-card, #ud-kiosk-list[data-count="17"] .ud-kiosk-card, #ud-kiosk-list[data-count="18"] .ud-kiosk-card {
  max-width: calc(15% - 1rem);
}
#ud-kiosk-list[data-count="11"] .ud-kiosk-card .additional_info, #ud-kiosk-list[data-count="12"] .ud-kiosk-card .additional_info, #ud-kiosk-list[data-count="13"] .ud-kiosk-card .additional_info, #ud-kiosk-list[data-count="14"] .ud-kiosk-card .additional_info, #ud-kiosk-list[data-count="15"] .ud-kiosk-card .additional_info, #ud-kiosk-list[data-count="16"] .ud-kiosk-card .additional_info, #ud-kiosk-list[data-count="17"] .ud-kiosk-card .additional_info, #ud-kiosk-list[data-count="18"] .ud-kiosk-card .additional_info {
  gap: 0.3rem;
}
#ud-kiosk-list[data-count="11"] .ud-kiosk-card h3, #ud-kiosk-list[data-count="12"] .ud-kiosk-card h3, #ud-kiosk-list[data-count="13"] .ud-kiosk-card h3, #ud-kiosk-list[data-count="14"] .ud-kiosk-card h3, #ud-kiosk-list[data-count="15"] .ud-kiosk-card h3, #ud-kiosk-list[data-count="16"] .ud-kiosk-card h3, #ud-kiosk-list[data-count="17"] .ud-kiosk-card h3, #ud-kiosk-list[data-count="18"] .ud-kiosk-card h3 {
  font-size: 0.75rem;
  line-height: 0.75rem;
  margin-bottom: 0.3rem;
  padding: 4px 6px;
}
#ud-kiosk-list[data-count="11"] .ud-kiosk-card p, #ud-kiosk-list[data-count="12"] .ud-kiosk-card p, #ud-kiosk-list[data-count="13"] .ud-kiosk-card p, #ud-kiosk-list[data-count="14"] .ud-kiosk-card p, #ud-kiosk-list[data-count="15"] .ud-kiosk-card p, #ud-kiosk-list[data-count="16"] .ud-kiosk-card p, #ud-kiosk-list[data-count="17"] .ud-kiosk-card p, #ud-kiosk-list[data-count="18"] .ud-kiosk-card p {
  font-size: 0.75rem;
  line-height: 0.75rem;
  gap: 0rem;
  padding: 4px 6px;
}
#ud-kiosk-list[data-count="11"] .ud-kiosk-card svg, #ud-kiosk-list[data-count="12"] .ud-kiosk-card svg, #ud-kiosk-list[data-count="13"] .ud-kiosk-card svg, #ud-kiosk-list[data-count="14"] .ud-kiosk-card svg, #ud-kiosk-list[data-count="15"] .ud-kiosk-card svg, #ud-kiosk-list[data-count="16"] .ud-kiosk-card svg, #ud-kiosk-list[data-count="17"] .ud-kiosk-card svg, #ud-kiosk-list[data-count="18"] .ud-kiosk-card svg {
  display: none;
}

/* Kartenstil */
.ud-kiosk-header {
  text-align: center;
  margin-top: 2rem;
  margin-bottom: 1rem;
}
.ud-kiosk-header .ud-kiosk-suppe {
  position: fixed;
  top: 10px;
  left: 74px;
  font-size: 1.5rem;
  font-weight: 500;
  color: var(--wp--preset--color--theme-100);
}
.ud-kiosk-header .ud-kiosk-suppe span {
  font-weight: 700;
}
.ud-kiosk-header .ud-kiosk-title {
  font-size: 1.8rem;
  font-weight: 600;
  color: var(--neutral-900);
}

.ud-kiosk-card {
  /*background: var(--wp--preset--color--theme-200);
  	border-radius: 16px;
  	padding: 12px;
  	width: 100%;
  	max-width: 230px;
  	box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
  	transition: transform 0.2s ease, box-shadow 0.2s ease;
  	border: 2px solid transparent;
  	text-align: left;
  */
  background: var(--wp--preset--color--theme-200);
  border-radius: 16px;
  padding: 12px;
  width: 100%;
  max-width: 230px;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
  border: 2px solid transparent;
  text-align: left;
}
.ud-kiosk-card h3 {
  font-size: 1.1rem;
  line-height: 1.1rem;
  font-weight: 700;
  margin-bottom: 0.5rem;
  background-color: white;
  padding: 6px 8px;
  border-radius: 8px;
}
.ud-kiosk-card .additional_info {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.ud-kiosk-card .additional_info p {
  font-size: 0.9rem;
  line-height: 1rem;
  display: flex;
  gap: 0.6rem;
  background: var(--wp--preset--color--theme-100);
  padding: 6px 8px;
  border-radius: 8px;
}
.ud-kiosk-card .additional_info svg {
  height: 16px;
}
.ud-kiosk-card.is-present {
  background: var(--wp--preset--color--theme-300);
  border-color: var(--wp--preset--color--theme-600);
}

/* =======================================================
   🔴 Ausverkauft-Badge (für [ud_kiosk_ausverkauf])
======================================================= */
.ud-kiosk-soldout {
  position: fixed;
  top: 0;
  right: 0;
  z-index: 9999;
  padding: 17px 15px 10px 21px;
  font-size: 1.3rem;
  font-weight: 600;
  line-height: 1;
  text-transform: uppercase;
  opacity: 0;
  pointer-events: none;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  height: 55px;
  letter-spacing: 0.1rem;
  background: var(--error-600);
  color: var(--error-100);
}
.ud-kiosk-soldout.visible {
  opacity: 1;
}
.ud-kiosk-soldout span {
  display: inline-block;
}

.wp-block-ud-fade-slider-block .sponsor figure {
  width: 100%;
}
.wp-block-ud-fade-slider-block .sponsor figure img {
  max-height: 300px;
  width: auto;
  height: auto;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

/* =============================================================== *\
   Layout-Elemente
\* =============================================================== */
.entry-content {
  margin-top: 5vh;
}

/* =============================================================== *\
   Grosses Reservationen-Feld
\* =============================================================== */
#ud-reservation-form-root {
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
  padding: 20px;
  box-shadow: var(--shadow-500);
  border-radius: 16px;
  max-width: 863px;
  height: calc(100vh - (220px + 5vh));
}
#ud-reservation-form-root .ud-res-header .ud-res-controls {
  gap: 2rem;
}
#ud-reservation-form-root .ud-res-header .ud-res-controls .toggle-wrapper {
  gap: 1rem;
}
#ud-reservation-form-root .ud-res-header h2 {
  font-weight: 300;
}
#ud-reservation-form-root .ud-res-date {
  position: fixed;
  top: 12px;
  left: 80px;
}
#ud-reservation-form-root .ud-res-date input[type=date] {
  border: 0;
  color: white;
}
#ud-reservation-form-root .ud-res-date #reservation-date-label {
  color: white;
  font-weight: 300;
}
#ud-reservation-form-root #reservation-list {
  max-height: 600px;
  overflow: scroll;
  overflow-y: scroll;
  overflow-x: hidden;
}
#ud-reservation-form-root #reservation-list .ud-res-list-flex {
  margin-top: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: calc(100% - 10px);
  /* =============================================================== *\
              einzelne Reservations-Zeile
           \* =============================================================== */
}
#ud-reservation-form-root #reservation-list .ud-res-list-flex .ud-res-item {
  display: grid;
  grid-template-columns: minmax(140px, 2fr) 70px 90px minmax(140px, 2fr) auto auto;
  align-items: stretch;
  gap: 0.6rem;
  gap: 0;
}
#ud-reservation-form-root #reservation-list .ud-res-list-flex .ud-res-item .ud-res-name {
  padding: 0.5rem 0.8rem;
  border-top-left-radius: 8px;
  border-bottom-left-radius: 8px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  font-weight: 400;
  color: var(--neutral-900);
  background-color: var(--neutral-100);
  border-color: var(--neutral-400);
  border-width: 1px;
  border-style: solid;
  border-right: none;
}
#ud-reservation-form-root #reservation-list .ud-res-list-flex .ud-res-item .ud-res-meta {
  display: contents;
}
#ud-reservation-form-root #reservation-list .ud-res-list-flex .ud-res-item .ud-res-meta .ud-anzahl-personen,
#ud-reservation-form-root #reservation-list .ud-res-list-flex .ud-res-item .ud-res-meta .ud-uhrzeit,
#ud-reservation-form-root #reservation-list .ud-res-list-flex .ud-res-item .ud-res-meta .ud-supplement {
  color: var(--neutral-900);
  display: flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.5rem 0.8rem;
  white-space: nowrap;
  border-color: var(--neutral-400);
  border-width: 1px;
  border-style: solid;
  border-left: none;
  border-right: none;
  background-color: var(--neutral-100);
}
#ud-reservation-form-root #reservation-list .ud-res-list-flex .ud-res-item .ud-res-meta .ud-anzahl-personen svg,
#ud-reservation-form-root #reservation-list .ud-res-list-flex .ud-res-item .ud-res-meta .ud-uhrzeit svg,
#ud-reservation-form-root #reservation-list .ud-res-list-flex .ud-res-item .ud-res-meta .ud-supplement svg {
  width: 1em;
  height: 1em;
  flex-shrink: 0;
}
#ud-reservation-form-root #reservation-list .ud-res-list-flex .ud-res-item .ud-res-meta .ud-anzahl-personen,
#ud-reservation-form-root #reservation-list .ud-res-list-flex .ud-res-item .ud-res-meta .ud-uhrzeit {
  justify-content: center;
  text-align: center;
  font-variant-numeric: tabular-nums;
}
#ud-reservation-form-root #reservation-list .ud-res-list-flex .ud-res-item .ud-res-meta .ud-anzahl-personen {
  justify-content: space-between;
}
#ud-reservation-form-root #reservation-list .ud-res-list-flex .ud-res-item .ud-res-meta .ud-supplement {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  border-top-right-radius: 8px;
  border-bottom-right-radius: 9px;
  border-right: 1px;
  border-style: solid;
  border-left: 0;
  border-color: var(--neutral-400);
}
#ud-reservation-form-root #reservation-list .ud-res-list-flex .ud-res-item.is-present .ud-res-name,
#ud-reservation-form-root #reservation-list .ud-res-list-flex .ud-res-item.is-present .ud-anzahl-personen,
#ud-reservation-form-root #reservation-list .ud-res-list-flex .ud-res-item.is-present .ud-uhrzeit,
#ud-reservation-form-root #reservation-list .ud-res-list-flex .ud-res-item.is-present .ud-supplement {
  border-color: var(--wp--preset--color--theme-500);
  background-color: var(--wp--preset--color--theme-100);
}
#ud-reservation-form-root #reservation-list .ud-res-list-flex .ud-res-item .ud-res-status {
  white-space: nowrap;
  text-align: center;
  padding: 0.4rem 1rem;
  border-radius: 8px;
  min-width: 90px;
  font-weight: 400;
  height: 100%;
  margin-right: 12px;
  margin-left: 12px;
}
#ud-reservation-form-root #reservation-list .ud-res-list-flex .ud-res-item .ud-res-actions {
  display: flex;
  justify-content: flex-end;
  gap: 0.4rem;
  aspect-ratio: 1/1;
  width: 100%;
  height: 100%;
}
#ud-reservation-form-root #reservation-modal .ud-modal-content {
  padding: 24px;
  max-width: 415px;
}
#ud-reservation-form-root #reservation-modal .ud-modal-content #reservation-edit-form label {
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--neutral-900);
}
#ud-reservation-form-root #reservation-modal .ud-modal-content #reservation-edit-form label input[type=text],
#ud-reservation-form-root #reservation-modal .ud-modal-content #reservation-edit-form label input[type=number],
#ud-reservation-form-root #reservation-modal .ud-modal-content #reservation-edit-form label input[type=time] {
  flex-basis: 220px;
  margin-left: auto;
  background: var(--neutral-100);
  border: 1.5px solid var(--neutral-100);
  transition: all 0.2s;
}
#ud-reservation-form-root #reservation-modal .ud-modal-content #reservation-edit-form label input[type=text]:focus,
#ud-reservation-form-root #reservation-modal .ud-modal-content #reservation-edit-form label input[type=number]:focus,
#ud-reservation-form-root #reservation-modal .ud-modal-content #reservation-edit-form label input[type=time]:focus {
  border-color: var(--wp--preset--color--theme-500);
}
#ud-reservation-form-root #reservation-modal .ud-modal-content #reservation-edit-form label.ud-checkbox {
  flex-direction: row-reverse !important;
  justify-content: flex-end !important;
}
#ud-reservation-form-root #reservation-modal .ud-modal-content #reservation-edit-form label.ud-checkbox input {
  margin-right: 202px;
  margin-left: auto;
}

/* =============================================================== *\
   Modal
\* =============================================================== */
.ud-modal[hidden] {
  display: none !important;
}

.ud-modal {
  position: fixed;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1000;
  backdrop-filter: blur(2px);
}
.ud-modal.hidden {
  display: none;
}

.ud-modal-content {
  position: relative;
  padding: 24px;
  border-radius: 16px;
}

.ud-modal .ud-inner-group {
  background-color: var(--wp--preset--color--theme-100);
  border: 0px solid black;
  display: flex;
  flex-direction: column;
  gap: 0;
}
.ud-modal .ud-inner-group h4 {
  font-weight: 600;
  color: var(--wp--preset--color--theme-500);
}
.ud-modal .ud-inner-group .rows {
  background: white;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: 8px;
  border-radius: 8px;
}
.ud-modal .ud-inner-group .rows .row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
}
.ud-modal .ud-inner-group input {
  background-color: var(--neutral-100);
  flex-basis: 220px;
  width: 220px;
  margin: 0;
  margin-left: auto;
  background: var(--neutral-100);
  border: 1.5px solid var(--neutral-100);
  transition: all 0.2s;
  border-radius: 4px;
  padding: 0.5em 0.6em;
}
.ud-modal .ud-inner-group input:focus {
  border-color: var(--wp--preset--color--theme-500);
}

#ud-verpflegung-modal.ud-modal .ud-modal-content {
  max-width: fit-content;
}
#ud-verpflegung-modal.ud-modal .ud-modal-content .verpflegung-group {
  display: flex;
  flex-direction: column;
}

#ud-produktion-modal .ud-modal-content {
  max-width: 700px;
}
#ud-produktion-modal .ud-modal-content .produktion-gesamt {
  display: flex;
}
#ud-produktion-modal .ud-modal-content .produktion-gesamt label {
  font-weight: 600;
}
#ud-produktion-modal .ud-modal-content .ud-inner-group {
  gap: 1rem;
}
#ud-produktion-modal .ud-modal-content .ud-produktion-table {
  background-color: white;
  border-radius: 8px;
  overflow: hidden;
}
#ud-produktion-modal .ud-modal-content .ud-produktion-table th {
  background-color: var(--neutral-100);
  text-align: right;
  padding: 10px 16px 10px 0;
}
#ud-produktion-modal .ud-modal-content .ud-produktion-table th:first-of-type {
  text-align: left;
  padding-left: 20px;
}
#ud-produktion-modal .ud-modal-content .ud-produktion-table tr td:first-of-type {
  width: 170px;
}
#ud-produktion-modal .ud-modal-content .ud-produktion-table tbody td {
  padding: 0px 8px; /* Innenabstand im Body */
}
#ud-produktion-modal .ud-modal-content .ud-produktion-table td select {
  padding: 0.5rem;
  margin: 0.5rem;
  width: 130px;
  border: 1px solid var(--neutral-500);
  border-radius: 8px;
}
#ud-produktion-modal .ud-modal-content .ud-produktion-table td.verkauf-cell {
  display: flex;
  gap: 6px;
}
#ud-produktion-modal .ud-modal-content .ud-produktion-table tr.total-row {
  background: var(--neutral-100);
}
#ud-produktion-modal .ud-modal-content .ud-produktion-table tr.total-row td {
  padding: 10px;
}
#ud-produktion-modal .ud-modal-content .ud-produktion-table tr.total-row td.total-label {
  padding-left: 20px;
}
#ud-produktion-modal .ud-modal-content .ud-produktion-table tr.total-row td.total-retouren, #ud-produktion-modal .ud-modal-content .ud-produktion-table tr.total-row td.total-verkauf {
  text-align: right;
  padding-right: 16px;
}
#ud-produktion-modal .ud-modal-content .ud-produktion-table input {
  width: 100px;
}
#ud-produktion-modal .ud-modal-content .ud-produktion-table .ud-modal-close {
  position: relative;
  top: 6px;
  right: 0;
}

.ud-reinigung-modal-content {
  max-width: 900px;
}
.ud-reinigung-modal-content #ud-reinigung-checklisten {
  background: var(--wp--preset--color--theme-100);
  padding: 12px;
  border-radius: 12px;
}
.ud-reinigung-modal-content .ud-reinigung-sidebar {
  padding: 0;
}
.ud-reinigung-modal-content .ud-reinigung-sidebar #ud-reinigung-sections {
  background-color: var(--wp--preset--color--theme-200);
  border-radius: 8px;
  padding: 12px;
}
.ud-reinigung-modal-content .ud-reinigung-sidebar #ud-reinigung-sections > li {
  background-color: white;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.8rem 1rem;
  border-radius: 8px;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s;
}
.ud-reinigung-modal-content .ud-reinigung-sidebar #ud-reinigung-sections > li.active {
  font-weight: 600;
}
.ud-reinigung-modal-content .ud-reinigung-sidebar #ud-reinigung-sections > li .status {
  width: 14px;
  height: 14px;
  aspect-ratio: 1/1;
  border-radius: 50%;
  border: 2px solid var(--neutral-500);
  margin-left: 8px;
}
.ud-reinigung-modal-content .ud-reinigung-sidebar #ud-reinigung-sections > li .status.done {
  background: var(--wp--preset--color--theme-500);
  border-color: var(--wp--preset--color--theme-500);
}
.ud-reinigung-modal-content .ud-reinigung-sidebar #ud-reinigung-sections > li .status.partial {
  background: var(--partial-500);
  border-color: var(--partial-500);
}
.ud-reinigung-modal-content .ud-reinigung-sidebar #ud-reinigung-sections li + li {
  margin-top: 0.6rem;
}
.ud-reinigung-modal-content .ud-reinigung-modal-body {
  overflow: scroll;
}
.ud-reinigung-modal-content .ud-reinigung-ui {
  gap: 20px;
  min-height: unset;
}
.ud-reinigung-modal-content .ud-reinigung-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  overflow-y: auto;
  padding: 0;
  background: var(--wp--preset--color--theme-100);
  border-top-right-radius: 8px;
}
.ud-reinigung-modal-content .ud-reinigung-content h3 {
  margin: 0.25rem 0 0.75rem 0;
  font-size: 1.1rem;
  line-height: 1.1rem;
  font-weight: 600;
}
.ud-reinigung-modal-content .ud-reinigung-content .ud-checklist-item {
  display: flex;
  align-items: center;
  margin-bottom: 0.6rem;
  padding: 4px 0.8rem;
  border-radius: 8px;
  background: #fff;
  cursor: pointer;
  transition: all 0.2s;
  border-width: 1px;
  border-style: solid;
  color: var(--neutral-700);
  border-color: white;
}
.ud-reinigung-modal-content .ud-reinigung-content .ud-checklist-item input {
  margin: 0;
  margin-right: 0.6rem;
  accent-color: var(--wp--preset--color--theme-600);
  transform: scale(1.1);
}
.ud-reinigung-modal-content .ud-reinigung-content .ud-checklist-item span {
  flex: 1;
}
.ud-reinigung-modal-content .ud-reinigung-content .ud-checklist-item.checked {
  color: var(--wp--preset--color--theme-600);
  font-weight: 500;
  background: var(--wp--preset--color--theme-200);
  border-color: var(--wp--preset--color--theme-600);
}
.ud-reinigung-modal-content .ud-reinigung-footer {
  padding: 0.5rem 0;
  font-size: 0.8rem;
  font-style: italic;
  color: var(--wp--preset--color--theme-600);
}
.ud-reinigung-modal-content .ud-checklist-section {
  padding: 12px;
  border-radius: 8px;
  background: white;
}
.ud-reinigung-modal-content .ud-checklist-section h3 {
  margin-bottom: 0.8rem;
  font-size: 1.1rem;
  line-height: 1.1rem;
}
.ud-reinigung-modal-content .ud-checklist-section textarea {
  width: 100%;
  padding: 0.8rem;
  margin: 0;
  border: 1px solid var(--neutral-500);
  border-radius: 8px;
  resize: vertical;
  font-family: inherit;
  font-size: 0.95rem;
  min-height: 100px;
}

/* =============================================================== *\
   Backdrop
\* =============================================================== */
.ud-modal-backdrop {
  position: absolute;
  inset: 0;
  background: var(--wp--preset--color--theme-300);
  animation: fadeBackdrop 0.25s ease both;
}

@keyframes fadeBackdrop {
  from {
    opacity: 0;
  }
  to {
    opacity: 0.8;
  }
}
/* =============================================================== *\
    Button-Bar:
    - Reinigung
    - Produktion + Verkauf
    - Verpflegung
\* =============================================================== */
#ud-button-bar {
  position: fixed;
  bottom: 40px;
  display: flex;
  justify-content: center;
  width: 100%;
  gap: 24px;
}

/* =============================================================== *\
   Header
\* =============================================================== */
header .wp-block-site-logo.is-default-size img {
  width: 60px;
  height: auto;
  filter: drop-shadow(2px 4px 6px rgba(0, 0, 0, 0.2));
}
header .balken {
  background: var(--wp--preset--color--theme-500);
  width: 100%;
  position: fixed;
  height: 55px;
  top: 0;
  z-index: -1;
}

/* =============================================================== *\
   Footer
\* =============================================================== */
/* =============================================================== *\
   Page-Styles
\* =============================================================== */
/* =============================================================== *\
   Datum
\* =============================================================== */
#ud-reservation-form-root .ud-res-date {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-weight: 500;
  /* Das sichtbare Format-Label */
}
#ud-reservation-form-root .ud-res-date #reservation-date-label {
  display: inline-block;
  padding: 0.5em 1em 0.5em 0.75em;
  background: transparent;
  border: 0px solid #ccc;
  border-radius: 6px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
  user-select: none;
  min-width: 220px;
  text-align: left;
  position: relative;
  z-index: 0;
}
#ud-reservation-form-root .ud-res-date {
  /* Unsichtbares, aber klickbares Datepicker-Feld */
}
#ud-reservation-form-root .ud-res-date input[type=date] {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: 1;
  cursor: pointer;
  z-index: 13;
  border: 1px solid yellow;
  width: 100%;
  height: 50px;
}
#ud-reservation-form-root .ud-res-date {
  /* Hover/Focus states */
}
#ud-reservation-form-root .ud-res-date:hover #reservation-date-label,
#ud-reservation-form-root .ud-res-date input[type=date]:focus + #reservation-date-label {
  border-color: #999;
  box-shadow: 0 0 0 2px rgba(52, 168, 83, 0.15); /* sanfter Akzent */
}

/* =============================================================== *\
   Flatpickr
\* =============================================================== */
.ud-res-date {
  width: 100%;
  justify-content: flex-start;
}

/* Kalender-Icon (z. B. Font Awesome oder Inline-SVG) */
.ud-flatpickr-alt-input {
  display: block;
  width: 300px;
  box-sizing: border-box;
  font: inherit;
  line-height: 1;
  padding: 0px;
  color: white;
  margin: 0;
  font-size: 20px;
  font-weight: 200;
  letter-spacing: 0.025rem;
  cursor: pointer;
}

.calendar_icon {
  cursor: pointer;
  transition: all 0.2s;
}
.calendar_icon circle {
  fill: var(--wp--preset--color--theme-500);
  transition: all 0.2s;
}
.calendar_icon:hover {
  transform: scale(1.05);
}
.calendar_icon:hover circle {
  fill: var(--wp--preset--color--theme-600);
}

.flatpickr-calendar {
  border: none !important;
  box-shadow: var(--shadow-500) !important;
  margin-top: 1em;
  border-radius: 12px;
}

/* =============================================================== *\
   Allgemeine Call-to-Action Buttons
\* =============================================================== */
.ud-modal button.ud-modal-close:hover {
  background: var(--error-200);
  transform: scale(1.05);
}
.ud-modal button.ud-modal-close svg {
  width: 19px;
}
.ud-modal button.ud-modal-close svg:hover {
  transform: scale(1.05);
}
.ud-modal button.ud-modal-close svg path {
  fill: var(--error-500);
}

.actions,
.ud-produktion-modal .right-actions,
#reservation-modal .right-actions {
  display: flex;
  justify-content: flex-end;
  gap: 0.6rem;
}

.ud-produktion-modal .actions,
#reservation-modal .actions {
  justify-content: space-between;
}

#ud-reservation-form-root #reservation-add,
.ud-modal .actions button,
#ud-notes-modal .ud-notes-list button,
#ud-notes-modal .ud-notes-input button {
  font-weight: 300;
  border-radius: 8px;
  background-color: var(--wp--preset--color--theme-500);
  transition: all 0.2s;
  padding: 12px 16px;
  font-size: 16px;
  line-height: 16px;
  color: white;
}
#ud-reservation-form-root #reservation-add:hover,
.ud-modal .actions button:hover,
#ud-notes-modal .ud-notes-list button:hover,
#ud-notes-modal .ud-notes-input button:hover {
  background-color: var(--wp--preset--color--theme-600);
  transform: scale(1.025);
}
#ud-reservation-form-root #reservation-add.is-disabled,
.ud-modal .actions button.is-disabled,
#ud-notes-modal .ud-notes-list button.is-disabled,
#ud-notes-modal .ud-notes-input button.is-disabled {
  background-color: var(--neutral-100);
  color: var(--neutral-500);
}
#ud-reservation-form-root #reservation-add.button-cancel,
.ud-modal .actions button.button-cancel,
#ud-notes-modal .ud-notes-list button.button-cancel,
#ud-notes-modal .ud-notes-input button.button-cancel {
  background-color: transparent;
  border: 1px solid var(--neutral-400);
  color: var(--neutral-600);
}
#ud-reservation-form-root #reservation-add.button-cancel:hover,
.ud-modal .actions button.button-cancel:hover,
#ud-notes-modal .ud-notes-list button.button-cancel:hover,
#ud-notes-modal .ud-notes-input button.button-cancel:hover {
  color: var(--error-500);
  border: 1px solid var(--error-500);
  background-color: var(--neutral-100);
}
#ud-reservation-form-root #reservation-add.button-save,
.ud-modal .actions button.button-save,
#ud-notes-modal .ud-notes-list button.button-save,
#ud-notes-modal .ud-notes-input button.button-save {
  background-color: var(--wp--preset--color--theme-500);
}
#ud-reservation-form-root #reservation-add.button-save:hover,
.ud-modal .actions button.button-save:hover,
#ud-notes-modal .ud-notes-list button.button-save:hover,
#ud-notes-modal .ud-notes-input button.button-save:hover {
  background-color: var(--wp--preset--color--theme-600);
}
#ud-reservation-form-root #reservation-add.button-delete,
.ud-modal .actions button.button-delete,
#ud-notes-modal .ud-notes-list button.button-delete,
#ud-notes-modal .ud-notes-input button.button-delete {
  color: var(--error-500);
  background: var(--error-100);
}
#ud-reservation-form-root #reservation-add.button-delete.hidden,
.ud-modal .actions button.button-delete.hidden,
#ud-notes-modal .ud-notes-list button.button-delete.hidden,
#ud-notes-modal .ud-notes-input button.button-delete.hidden {
  display: none;
}
#ud-reservation-form-root #reservation-add.button-delete:hover,
.ud-modal .actions button.button-delete:hover,
#ud-notes-modal .ud-notes-list button.button-delete:hover,
#ud-notes-modal .ud-notes-input button.button-delete:hover {
  background: var(--error-200);
}
#ud-reservation-form-root #reservation-add.button-add,
.ud-modal .actions button.button-add,
#ud-notes-modal .ud-notes-list button.button-add,
#ud-notes-modal .ud-notes-input button.button-add {
  background-color: transparent;
  border: 1px solid var(--neutral-600);
  color: var(--neutral-600);
}

/* =============================================================== *\
   Reservations-Liste
\* =============================================================== */
#ud-reservation-form-root .ud-res-status {
  cursor: pointer;
  transition: all 0.2s;
  background-color: var(--neutral-100);
  color: var(--neutral-500);
}
#ud-reservation-form-root .ud-res-status:hover {
  transform: scale(1.05);
  background: var(--wp--preset--color--theme-200);
  color: var(--wp--preset--color--theme-500);
}
#ud-reservation-form-root .ud-res-status.is-present {
  color: var(--wp--preset--color--theme-500);
  background: var(--wp--preset--color--theme-100);
}
#ud-reservation-form-root .ud-anzahl-personen path,
#ud-reservation-form-root .ud-uhrzeit path {
  stroke: var(--neutral-700);
}
#ud-reservation-form-root .ud-supplement path {
  fill: var(--neutral-700);
}

/* =============================================================== *\
   Edit-Button bei Reservations-liste
\* =============================================================== */
#ud-reservation-form-root .ud-res-actions button {
  aspect-ratio: 1/1;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 100px;
  border: 0px solid var(--wp--preset--color--theme-500);
  background: var(--wp--preset--color--theme-100);
  cursor: pointer;
  width: 100%;
  height: 100%;
  transition: all 0.2s;
}
#ud-reservation-form-root .ud-res-actions button svg {
  width: 1rem;
  height: 1rem;
}
#ud-reservation-form-root .ud-res-actions button svg path {
  fill: var(--wp--preset--color--theme-600);
}
#ud-reservation-form-root .ud-res-actions button:hover {
  transform: scale(1.05);
  background-color: var(--wp--preset--color--theme-200);
}

/* =============================================================== *\
   Modals
\* =============================================================== */
#reservation-modal button.button-cancel {
  display: none;
}

/* =============================================================== *\
   Modal-Title
\* =============================================================== */
.ud-modal-content .ud-modal-title {
  font-weight: 300;
  font-size: 24px;
  margin-bottom: 1rem;
}

/* =============================================================== *\
   Modal: Close-Button
\* =============================================================== */
.ud-modal-content .ud-modal-close {
  position: absolute;
  top: 10px;
  right: 10px;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 26px;
  aspect-ratio: 1/1;
  border-radius: 100px;
  border: none;
  box-sizing: border-box;
  background: var(--neutral-200);
  color: var(--wp--preset--color--theme-500);
  font-size: 26px;
  font-weight: 200;
  line-height: 26px;
  cursor: pointer;
  transition: all 0.2s ease;
}
.ud-modal-content .ud-modal-close:hover {
  color: var(--error-500);
}

/* =============================================================== *\
   Button-Bar-Buttons
    - Verpflegung erfassen
    - Produktion + Verkauf
    - Reinigung
\* =============================================================== */
.ud-button-bar-button {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  gap: 0.8rem;
  padding: 0.6rem 1rem;
  border: 1.5px solid var(--wp--preset--color--theme-500);
  border-radius: 12px;
  background: white;
  cursor: pointer;
  transition: all 0.25s ease;
  box-shadow: var(--shadow-500);
  min-width: 240px;
  margin-left: 0 !important;
  margin-right: 0 !important;
  transition: all 0.2s;
}
.ud-button-bar-button:hover {
  background: var(--wp--preset--color--theme-200);
  transform: scale(1.025);
}
.ud-button-bar-button .button-content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.ud-button-bar-button .button-content .label {
  font-size: 1rem;
  font-weight: 600;
}
.ud-button-bar-button .progress-ring {
  display: flex;
  align-items: center;
  width: 20px;
  height: 20px;
}
.ud-button-bar-button .progress-ring circle.bg {
  stroke: var(--neutral-300);
}
.ud-button-bar-button .progress-ring circle.progress {
  stroke: var(--wp--preset--color--theme-500);
}
.ud-button-bar-button .progress-text {
  font-size: 0.9rem;
  color: var(--neutral-700) !important;
  line-height: 1.2;
}

/* =============================================================== *\
   Formular-Elemente
\* =============================================================== */
.ud-modal label.ud-checkbox input[type=checkbox] {
  accent-color: var(--wp--preset--color--theme-300);
}

/* =============================================================== *\
   Title
\* =============================================================== */
.flatpickr-day.selected,
.flatpickr-day.startRange,
.flatpickr-day.endRange,
.flatpickr-day.selected.inRange,
.flatpickr-day.startRange.inRange,
.flatpickr-day.endRange.inRange,
.flatpickr-day.selected:focus,
.flatpickr-day.startRange:focus,
.flatpickr-day.endRange:focus,
.flatpickr-day.selected:hover,
.flatpickr-day.startRange:hover,
.flatpickr-day.endRange:hover,
.flatpickr-day.selected.prevMonthDay,
.flatpickr-day.startRange.prevMonthDay,
.flatpickr-day.endRange.prevMonthDay,
.flatpickr-day.selected.nextMonthDay,
.flatpickr-day.startRange.nextMonthDay,
.flatpickr-day.endRange.nextMonthDay {
  background-color: var(--wp--preset--color--theme-400);
}

.flatpickr-day.selected,
.flatpickr-day.startRange,
.flatpickr-day.endRange,
.flatpickr-day.selected.inRange,
.flatpickr-day.startRange.inRange,
.flatpickr-day.endRange.inRange,
.flatpickr-day.selected:focus,
.flatpickr-day.startRange:focus,
.flatpickr-day.endRange:focus,
.flatpickr-day.selected:hover,
.flatpickr-day.startRange:hover,
.flatpickr-day.endRange:hover,
.flatpickr-day.selected.prevMonthDay,
.flatpickr-day.startRange.prevMonthDay,
.flatpickr-day.endRange.prevMonthDay,
.flatpickr-day.selected.nextMonthDay,
.flatpickr-day.startRange.nextMonthDay,
.flatpickr-day.endRange.nextMonthDay {
  border-color: var(--wp--preset--color--theme-500);
}

.flatpickr-calendar.hasTime.noCalendar {
  display: none;
}

/* =============================================================== *\
   "Reinigung gespeichert"
\* =============================================================== */
.ud-toast {
  border-radius: 8px;
  color: #fff;
  font-size: 14px;
  box-shadow: var(--shadow-500);
  transition: all 0.2s;
}
.ud-toast--visible {
  opacity: 1;
  transform: translateY(0);
}
.ud-toast--success {
  background: var(--wp--preset--color--theme-500);
}
.ud-toast--error {
  background: var(--error-500);
}

/* =============================================================== *\
   Komponenten
\* =============================================================== */