:root {
  --mbk-accent: #ff5a1f;
  --mbk-accent-light: #ffe3d0;
  --mbk-bg: #fff;
  --mbk-surface: #fafbfc;
  --mbk-border: #ecedf1;
  --mbk-muted: #72777e;
  --mbk-radius-lg: 20px;
  --mbk-radius-md: 12px;
  --mbk-gap: 32px;
  --mbk-shadow: 0 8px 32px rgba(44,51,73,.08);
  --mbk-day-size: 56px;
  --mbk-day-font: 19px;
  --mbk-month-font: 18px;
  --mbk-transition: .2s cubic-bezier(.4,0,.2,1);
}

body { background: #f6f7fb; }

.mbk-widget { width: 100%; }
.mbk-grid {
  display: grid;
  grid-template-columns: 1.25fr 1fr;
  gap: var(--mbk-gap);
  align-items: flex-start;
}
@media (max-width: 900px) { .mbk-grid { grid-template-columns: 1fr; } }

.mbk-left, .mbk-right {
  background: var(--mbk-bg);
  border-radius: var(--mbk-radius-lg);
  padding: 32px 28px 24px 28px;
  box-shadow: var(--mbk-shadow);
}

.mbk-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 18px;
}
.mbk-title { margin: 0; font-weight: 700; font-size: 1.22rem; }
.mbk-baseprice { color: var(--mbk-muted); font-size: 1.04rem; }

/* Kalender */
.litepicker { --litepicker-radius: var(--mbk-radius-lg); }
.litepicker .container__main {
  border-radius: var(--mbk-radius-lg);
  border: none;
  box-shadow: var(--mbk-shadow);
}
.litepicker .month-item-name,
.litepicker .month-item-weekdays-row > div {
  font-size: var(--mbk-month-font);
  font-weight: 600;
  color: #23232b;
}
.litepicker .container__days .day-item {
  width: var(--mbk-day-size);
  height: var(--mbk-day-size);
  font-size: var(--mbk-day-font);
  line-height: var(--mbk-day-size);
  border-radius: 11px;
  margin: 2px;
  font-weight: 600;
  color: #23232b;
  transition: background var(--mbk-transition), color var(--mbk-transition), box-shadow var(--mbk-transition);
  position: relative;
  z-index: 1;
}
.litepicker .is-start-date,
.litepicker .is-end-date {
  background: var(--mbk-accent) !important;
  color: #fff !important;
  box-shadow: 0 2px 8px rgba(255,90,31,.14);
}
.litepicker .is-in-range {
  background: var(--mbk-accent-light) !important;
  color: #23232b;
}
.litepicker .day-item:hover:not(.is-locked):not(.is-start-date):not(.is-end-date) {
  background: #ffd6bb !important;
  color: var(--mbk-accent);
}
.litepicker .day-item.is-locked,
.litepicker .day-item.is-previous-month,
.litepicker .day-item.is-next-month {
  color: #bbb !important;
  background: #f0f0f0 !important;
  text-decoration: line-through;
  pointer-events: none;
}

/* Zusammenfassung */
.mbk-summary {
  margin-top: 18px;
  background: var(--mbk-surface);
  border: 1.2px dashed var(--mbk-border);
  border-radius: var(--mbk-radius-md);
  padding: 14px 18px;
  color: var(--mbk-muted);
  font-size: 1.07rem;
  font-weight: 500;
}

/* ==== Card-Look für Optionen ==== */
.mbk-card {
  background: var(--mbk-surface);
  border-radius: var(--mbk-radius-lg);
  padding: 18px 16px 12px 16px;
  margin-bottom: var(--mbk-gap);
  border: none;
  box-shadow: 0 1px 7px rgba(50,50,70,0.07);
}

.mbk-card legend {
  font-size: 1.08rem;
  font-weight: 600;
  color: #212127;
  margin-bottom: 7px;
  border: none;
  letter-spacing: .01em;
}

/* Auswahl-Button-Look für Karten */
.mbk-option {
  display: flex;
  align-items: center;
  gap: 16px;
  background: #fff;
  border-radius: var(--mbk-radius-md);
  border: 2px solid transparent;
  margin-bottom: 10px;
  position: relative;
  box-shadow: 0 2px 8px rgba(80,90,110,0.045);
  padding: 16px 18px 15px 22px;
  transition: border-color var(--mbk-transition), background var(--mbk-transition), box-shadow var(--mbk-transition);
  cursor: pointer;
  min-height: 54px;
  outline: none;
  user-select: none;
}
.mbk-option:last-child { margin-bottom: 0; }
.mbk-option input[type="radio"] {
  display: none;
}

.mbk-option::before {
  content: "";
  flex-shrink: 0;
  width: 23px; height: 23px;
  border-radius: 50%;
  border: 2.2px solid #dadbe2;
  background: #fafbfc;
  margin-right: 2px;
  box-shadow: 0 1px 3px rgba(44,51,73,.09);
  transition: border-color var(--mbk-transition), background var(--mbk-transition);
}

.mbk-option input[type="radio"]:checked ~ .mbk-option-main::before,
.mbk-option input[type="radio"]:checked ~ .mbk-option-title::before {
  border-color: var(--mbk-accent);
  background: var(--mbk-accent);
  box-shadow: 0 0 0 4px var(--mbk-accent-light);
}
.mbk-option input[type="radio"]:checked ~ .mbk-option-main:after,
.mbk-option input[type="radio"]:checked ~ .mbk-option-title:after {
  content: "";
  position: absolute;
  left: 19px; top: 50%;
  transform: translateY(-50%);
  width: 11px; height: 11px;
  border-radius: 50%;
  background: #fff;
  z-index: 2;
  opacity: 1;
}

.mbk-option input[type="radio"]:checked ~ .mbk-option-main,
.mbk-option input[type="radio"]:checked ~ .mbk-option-title {
  color: var(--mbk-accent);
  font-weight: 700;
}
.mbk-option input[type="radio"]:checked ~ .mbk-option-price {
  color: var(--mbk-accent);
  font-weight: 700;
}
.mbk-option input[type="radio"]:checked ~ .mbk-badge {
  filter: saturate(1.2);
}

/* Aktive Karte: Akzentfarbiger Rand/Hintergrund */
.mbk-option input[type="radio"]:checked ~ .mbk-option-main,
.mbk-option input[type="radio"]:checked ~ .mbk-option-title {
  color: var(--mbk-accent);
}
.mbk-option input[type="radio"]:checked ~ .mbk-option-main,
.mbk-option input[type="radio"]:checked ~ .mbk-option-title {
  font-weight: 700;
}
.mbk-option input[type="radio"]:checked ~ .mbk-option-price {
  color: var(--mbk-accent);
  font-weight: 700;
}
.mbk-option input[type="radio"]:checked ~ .mbk-badge--incl {
  background: #eafaea;
  color: #2ea13d;
}
.mbk-option input[type="radio"]:checked ~ .mbk-badge--hot {
  background: #ffe7cf;
  color: #ff5a1f;
}

.mbk-option:hover, .mbk-option:focus-within {
  border-color: var(--mbk-accent-light);
  background: var(--mbk-accent-light);
}

.mbk-option input[type="radio"]:checked ~ .mbk-option-main {
  color: var(--mbk-accent);
  font-weight: 700;
}
.mbk-option-main {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 600;
  font-size: 1.07rem;
}
.mbk-option-title { font-weight: 700; font-size: 1.04rem; }
.mbk-option-sub   { color: var(--mbk-muted); font-size: 0.97rem; margin: 2px 0 0 0; }
.mbk-option-price { color: var(--mbk-muted); font-size: 1rem; margin-left: auto; }
.mbk-badge {
  display: inline-block;
  font-size: 0.82rem;
  padding: 2px 13px;
  border-radius: 999px;
  margin-left: 11px;
  background: #e9ecef;
}
.mbk-badge--incl { background: #eafaea; color: #2ea13d; }
.mbk-badge--hot  { background: #ffe7cf; color: #ff5a1f; }

/* Gesamt + CTA */
.mbk-total-card {
  background: var(--mbk-surface);
  border-radius: var(--mbk-radius-lg);
  padding: 24px;
  position: sticky;
  bottom: 18px;
  box-shadow: 0 2px 10px rgba(50,50,70,0.04);
}
.mbk-total-row { display: flex; justify-content: space-between; font-size: 1.13rem; margin-bottom: 18px; }

.mbk-cta {
  width: 100%;
  border: none;
  border-radius: var(--mbk-radius-md);
  padding: 18px 0;
  font-weight: 700;
  background: var(--mbk-accent);
  color: #fff;
  cursor: pointer;
  font-size: 1.11rem;
  box-shadow: 0 4px 18px rgba(255,90,31,.11);
  transition: filter .14s, transform .13s;
}
.mbk-cta:hover { filter: brightness(.95); transform: translateY(-1.5px); }