/* BVB Touristik – Ergänzungen zum Design-System (tokens.css + bundle.css).
   Vorlagenklassen nur in Media Queries unterhalb 1440 px anpassen. */
:root {
  --sk-period-primary: #14213D; --sk-period-text: #14213D; --sk-period-muted: #4A5163; --sk-period-line: #D9D2C7; --sk-period-surface: #FFFFFF; --sk-period-radius: 10px;
  --sk-select-primary: #14213D; --sk-select-text: #14213D; --sk-select-muted: #4A5163; --sk-select-line: #D9D2C7; --sk-select-surface: #FFFFFF; --sk-select-radius: 16px;
  --sk-dates-primary: #14213D; --sk-dates-text: #4A5163; --sk-dates-muted: #4A5163; --sk-dates-line: #D9D2C7; --sk-dates-surface: #FFFFFF; --sk-dates-radius: 16px;
  --sk-price-accent: #EF7D00; --sk-price-line: #D9D2C7; --sk-price-surface: #FFFFFF; --sk-price-radius: 10px;
  --sk-participants-primary: #14213D; --sk-participants-text: #14213D; --sk-participants-muted: #4A5163; --sk-participants-line: #D9D2C7; --sk-participants-surface: #FFFFFF; --sk-participants-radius: 10px;
  --sk-booking-primary: #EF7D00; --sk-booking-text: #14213D; --sk-booking-muted: #4A5163; --sk-booking-line: #D9D2C7; --sk-booking-surface: #FFFFFF; --sk-booking-radius: 20px; --sk-booking-button-text: #14213D; --sk-booking-discount-surface: #FDE8CC; --sk-booking-discount-text: #14213D;
  --sk-calendar-primary: #14213D; --sk-calendar-text: #14213D; --sk-calendar-muted: #4A5163; --sk-calendar-line: #D9D2C7; --sk-calendar-surface: #FFFFFF; --sk-calendar-soft: #FBF8F3; --sk-calendar-radius: 20px;
  --sk-lightbox-overlay: rgba(20, 33, 61, .92);
}
html, body { margin: 0; }
body { background: #FFFFFF; overflow-x: hidden; }
main:focus { outline: none; }
.sk-travel-period, .sk-search-select, .sk-travel-dates, .sk-booking, .sk-travel-calendar { font-family: var(--font-body, "Atkinson Hyperlegible", Verdana, sans-serif); }

/* Kopf: Mega-Menü, mobiles Menü, Lupe */
.bvb-nav__link[aria-expanded="true"] .bvb-icon { transform: rotate(180deg); }
.bvb-header__actions { position: relative; }
.menu-search { margin: 0; flex-shrink: 0; }
.menu-search .sk-destination-menu[data-select-ready] { display: inline-flex; }
.menu-search .sk-destination-menu .sk-select-trigger { width: 48px; height: 48px; min-height: 48px; padding: 0; border: 2px solid transparent; border-radius: 50%; background: transparent; color: #14213D; box-shadow: none; display: inline-flex; align-items: center; justify-content: center; }
.menu-search .sk-destination-menu .sk-select-trigger:hover { background: #F3EEE6; }
.menu-search .sk-select-trigger svg { display: none; }
.menu-search .sk-destination-menu .sk-select-trigger::before { content: ""; width: 24px; height: 24px; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E") center / contain no-repeat; }
.bvb-mnav { display: none; }
.bvb-mnav > summary { list-style: none; }
.bvb-mnav > summary::-webkit-details-marker { display: none; }
.bvb-mnav[open] > summary { background: #FDE8CC; }
.bvb-mnav > .bvb-mmenu { position: absolute; right: 0; top: calc(100% + 12px); width: min(360px, calc(100vw - 32px)); max-height: calc(100vh - 140px); overflow-y: auto; border: 1px solid #D9D2C7; border-radius: 20px; box-shadow: 0 12px 32px rgba(20,33,61,.14); z-index: 60; }
.bvb-mmenu details > summary .bvb-icon { width: 20px; height: 20px; }
.bvb-mmenu details[open] > summary .bvb-icon { transform: rotate(180deg); }
.bvb-footer__consent button, .bvb-footer__consent a { min-height: 44px; padding: 0; border: 0; background: none; color: #FFFFFF; font: inherit; cursor: pointer; }
.bvb-footer__consent button:hover { text-decoration: underline; color: #FFC98A; }

/* Dropdown-Filter (Reiseart/Reiseziel) */
.bvb-dd { position: relative; min-width: 0; }
.bvb-dd__trigger { text-align: left; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bvb-dd__trigger span { display: block; overflow: hidden; text-overflow: ellipsis; }
.bvb-dd__panel { margin: 8px 0 0; padding: 16px; border: 1px solid #D9D2C7; border-radius: 16px; background: #FFFFFF; min-width: 0; }
.bvb-dd__list { display: flex; flex-direction: column; gap: 2px; max-height: 320px; overflow-y: auto; }
.bvb-dd__list .bvb-check { align-items: center; padding: 4px 8px; border-radius: 8px; }
.bvb-dd__list .bvb-check:hover { background: #FBF8F3; }
.bvb-dd__list .bvb-check input { margin: 0; }
.bvb-dd__count { margin-left: auto; color: #4A5163; font-size: 15px; }
.bvb-dd__foot { display: none; }
.js .bvb-dd__panel { display: none; position: absolute; left: 0; top: 100%; z-index: 40; width: max(100%, 320px); box-shadow: 0 12px 32px rgba(20,33,61,.14); }
.js .bvb-dd.is-open .bvb-dd__panel { display: block; }
.js .bvb-dd__foot { display: flex; justify-content: space-between; gap: 8px; margin-top: 12px; padding-top: 12px; border-top: 1px solid #D9D2C7; }

/* Zeitraum-Feld der Suchleiste im Look von .bvb-select */
.bvb-field--period { min-width: 0; }
.bvb-period .sk-period-trigger { width: 100%; min-height: 52px; padding: 12px 52px 12px 16px; border: 2px solid #737B8C; border-radius: 10px; background: #FFFFFF linear-gradient(45deg, transparent 50%, #14213D 50%) calc(100% - 26px) 52% / 6px 6px no-repeat; background-image: linear-gradient(45deg, transparent 50%, #14213D 50%), linear-gradient(135deg, #14213D 50%, transparent 50%); background-position: calc(100% - 26px) 52%, calc(100% - 20px) 52%; background-size: 6px 6px, 6px 6px; background-repeat: no-repeat; color: #14213D; font: 400 18px/24px var(--font-body, "Atkinson Hyperlegible", sans-serif); text-align: left; box-shadow: none; }
.bvb-period .sk-period-trigger { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bvb-field--price .sk-price-range { font-size: 17px; }
.bvb-period .sk-period-trigger:hover { border-color: #14213D; }
.bvb-period .sk-period-trigger svg { display: none; }

/* Reise-Karten */
.bvb-trip-card__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.bvb-trip-card__fav[aria-pressed="true"] svg { fill: #EF7D00; stroke: #14213D; }
.bvb-trip-card .sk-travel-dates { position: relative; z-index: 2; display: inline-flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; color: #4A5163; font-size: 16px; line-height: 24px; }
.bvb-trip-card .sk-travel-dates__next, .bvb-trip-card .sk-travel-dates__single { display: inline-flex; align-items: center; gap: 6px; color: #4A5163; font-weight: 400; }
.bvb-trip-card .sk-travel-dates__trigger { min-height: 44px; padding: 0; border: 0; background: none; color: #4A5163; font: inherit; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.bvb-trip-card .sk-travel-dates__trigger:hover { color: #14213D; }
.bvb-trip-card .sk-travel-dates svg { width: 20px; height: 20px; }
.bvb-cards-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr)); gap: 24px; }
.bvb-empty { padding: 32px; border-radius: 20px; background: #FFFFFF; border: 1px solid #D9D2C7; }
.bvb-teaser img { width: 100%; aspect-ratio: 16 / 10; height: auto; object-fit: cover; }
.bvb-mega-tile img { width: 100%; aspect-ratio: 16 / 10; height: auto; object-fit: cover; border-radius: 12px; }

.bvb-hero__media { position: relative; overflow: hidden; background: #E6EAF2; }
.bvb-hero__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

/* Suche */
.bvb-search-layout { padding-block: 0; }
.bvb-filter-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.bvb-filter-head .bvb-link { font-size: 16px; }
.bvb-more > summary { display: inline-flex; min-height: 44px; align-items: center; cursor: pointer; list-style: none; font-size: 17px; }
.bvb-more > summary::-webkit-details-marker { display: none; }
.bvb-more[open] > summary { display: none; }
.bvb-more__list { display: flex; flex-direction: column; gap: 12px; }
.bvb-fieldset .bvb-check { align-items: center; }
.bvb-fieldset .bvb-dd__count { font-size: 15px; }
.bvb-search-aside .sk-price-range { font-family: var(--font-body, "Atkinson Hyperlegible", sans-serif); }

/* Detailseite */
.bvb-gallery__item { position: relative; display: block; overflow: hidden; border-radius: 20px; background: #E6EAF2; min-height: 0; }
.bvb-gallery__item img { width: 100%; height: 100%; object-fit: cover; }
.bvb-gallery__all { position: absolute; right: 16px; bottom: 16px; background: #FFFFFF; }
.bvb-gallery--single { grid-template-columns: 1fr !important; grid-template-rows: 476px !important; }
.bvb-span-2 { grid-column: span 2; }
.bvb-anchor { scroll-margin-top: 24px; }
.bvb-richtext p + p { margin-top: 12px; }
.bvb-richtext strong, .bvb-richtext b { font-weight: 700; }
.bvb-richtext em, .bvb-richtext i { font-style: italic; }
.bvb-richtext u { text-decoration: underline; }
.bvb-richtext a { color: #A85300; text-decoration: underline; text-underline-offset: 3px; }
.bvb-richtext ul ul, .bvb-richtext li ul { margin: 6px 0 0 1.25em; padding: 0; list-style: disc; }
.bvb-richtext ul:not(.bvb-checklist) { padding-left: 1.25em; }
.bvb-checklist li ul li { padding-left: 0; }
.bvb-checklist li ul li::before, .bvb-checklist li ul li::after { content: none; }
.bvb-table-wrap { overflow-x: auto; }
.bvb-tabs a.bvb-tab { display: inline-flex; align-items: center; text-decoration: none; }
.bvb-tabs a.bvb-tab[aria-current="true"] { color: #14213D; border-bottom-color: #EF7D00; }
/* Reiseverlauf aus dem Textfeld (Tagesmarken der Redaktion) als Zeitleiste der Vorlage */
.bvb-verlauf { margin-left: 7px; padding-left: 33px; border-left: 4px dotted #EF7D00; }
.bvb-verlauf p:has(> .Head_1) { position: relative; margin-top: 28px; font-family: var(--font-display, "Bricolage Grotesque", sans-serif); font-size: 22px; line-height: 30px; font-weight: 700; }
.bvb-verlauf p:has(> .Head_1):first-child { margin-top: 0; }
.bvb-verlauf p:has(> .Head_1)::before { content: ""; position: absolute; left: -46px; top: 5px; width: 18px; height: 18px; border-radius: 50%; border: 4px solid #EF7D00; background: #FFFFFF; box-sizing: border-box; }
.bvb-verlauf p:has(> .Head_1):first-child::before { background: #EF7D00; }
.bvb-verlauf .Head_1::after { content: " · "; }
.bvb-verlauf p:has(> .Head_1) + p { margin-top: 6px; }
.bvb-booking .sk-booking__contact a, .bvb-booking a:not([class]) { color: #A85300; }
@media (max-width: 560px) { .bvb-verlauf p:has(> .Head_1) { font-size: 20px; line-height: 28px; } }
.bvb-booking .sk-booking__button { border-radius: 999px; min-height: 56px; font-size: 20px; font-weight: 700; }
.bvb-booking { --sk-booking-radius: 10px; }
.bvb-detail-aside .bvb-filterbar > .sk-booking { margin: 0; }

.bvb-searchbar--compact { grid-template-columns: minmax(0, 1fr) auto !important; box-shadow: none; border: 1px solid #D9D2C7; }
.bvb-prose h3 { margin-top: 12px; }

/* Breadcrumb */
.bvb-crumbs { padding-block: 16px 0; }

/* Responsiv */
@media (max-width: 1180px) {
  .bvb-nav__link { padding: 10px 8px; font-size: 17px; }
  .bvb-topbar__muted { display: none; }
}
@media (max-width: 1024px) {
  .bvb-nav, .bvb-mega { display: none !important; }
  .bvb-mnav { display: block; }
  .bvb-header__inner { min-height: 72px; justify-content: space-between; }
  .bvb-header__actions { margin-left: auto; gap: 4px; }
  .bvb-logo img { height: 44px !important; }
  .bvb-searchbar { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 768px) {
  .bvb-topbar__links { display: none; }
  .bvb-hero__media { min-height: 260px !important; }
  .bvb-searchbar { grid-template-columns: 1fr; padding: 20px; }
  .bvb-cta-band__actions .bvb-btn { width: 100%; white-space: normal; }
  .bvb-steps li::after { display: none; }
  .bvb-stat__value { font-size: 44px; line-height: 48px; }
}
@media (max-width: 560px) {
  .bvb-hero__grid { gap: 32px !important; }
  .bvb-section-head .bvb-link--arrow { align-self: flex-start; }
  .js .bvb-dd__panel { width: auto; right: 0; }
  .bvb-usp-bar { grid-template-columns: 1fr !important; }
  .bvb-gallery { grid-template-columns: 1fr 1fr !important; grid-template-rows: 220px 120px !important; gap: 8px !important; }
  .bvb-gallery__item--main { grid-row: auto !important; grid-column: span 2; }
  .bvb-gallery--single { grid-template-rows: 240px !important; }
  .bvb-span-2 { grid-column: auto; }
  .bvb-table th, .bvb-table td { padding: 12px 10px; }
  .bvb-footer__bottom ul { gap: 0 20px; }
}
