/* ═══════════════════════════════════════════════════════════════════════════
   BELLE STAY — Detail Page
   Unterkunftsdetailseite: Gallery, Content, Booking Widget, Map
   Tokens kommen aus bellestay-design-system.css
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Reset für Plugin-Bereich ── */
.bst-detail *,
.bst-detail *::before,
.bst-detail *::after {
    box-sizing: border-box !important;
}

.bst-detail {
    font-family: var(--bst-font) !important;
    color: var(--bst-text) !important;
    line-height: var(--bst-line-height) !important;
    -webkit-font-smoothing: antialiased;
}

.bst-detail h1,
.bst-detail h2,
.bst-detail h3 {
    padding: 0 !important;
    border: 0 !important;
    background: none !important;
}

.bst-detail__section .bst-detail h1, .bst-detail__section .bst-detail h2, .bst-detail__section .bst-detail h3 {
    padding: 0 !important;
    border-bottom: 1px solid #e4e4e4 !important;
    padding-bottom: 15px !important;
    background: none !important;
}


/* ═══════════════════════════════════════════════
   1. GALLERY
   ═══════════════════════════════════════════════ */

/* Desktop Gallery */
.bst-detail__gallery {
    max-width: 100% !important;
    margin: 0 auto var(--bst-space-6) !important;
    padding: 0 !important;
}

.bst-gallery {
    display: grid !important;
    grid-template-columns: 2fr 1fr !important;
    gap: 6px !important;
    border-radius: var(--bst-radius-md) !important;
    overflow: hidden !important;
    height: 500px !important;
}

.bst-gallery__main {
    position: relative !important;
    overflow: hidden !important;
    min-height: 0 !important;
}

.bst-gallery__main img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    cursor: pointer !important;
    transition: transform 0.4s ease !important;
}

.bst-gallery__main img:hover {
    transform: scale(1.02) !important;
}

.bst-gallery__thumbs {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    grid-template-rows: 1fr 1fr !important;
    gap: 6px !important;
    position: relative !important;
    min-height: 0 !important;
}

.bst-gallery__thumbs a {
    overflow: hidden !important;
    display: block !important;
}

.bst-gallery__thumbs img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    cursor: pointer !important;
    transition: transform 0.3s ease, opacity 0.3s !important;
}

.bst-gallery__thumbs img:hover {
    transform: scale(1.05) !important;
    opacity: 0.9 !important;
}

.bst-gallery__show-all {
    position: absolute !important;
    bottom: 12px !important;
    right: 12px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 8px 16px !important;
    background: var(--bst-bg) !important;
    border: 1px solid var(--bst-border) !important;
    border-radius: var(--bst-radius-sm) !important;
    font-family: var(--bst-font) !important;
    font-size: var(--bst-font-size-sm) !important;
    font-weight: 600 !important;
    color: var(--bst-text) !important;
    cursor: pointer !important;
    transition: var(--bst-transition-fast) !important;
    -webkit-appearance: none !important;
    appearance: none !important;
    z-index: 2 !important;
}

.bst-gallery__show-all:hover {
    background: var(--bst-bg-alt) !important;
}

/* Mobile Gallery (Swipe) */
.bst-gallery-mobile {
    display: none !important;
    overflow-x: auto !important;
    scroll-snap-type: x mandatory !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: none !important;
    position: relative !important;
}

.bst-gallery-mobile::-webkit-scrollbar {
    display: none !important;
}

.bst-gallery-mobile__slide {
    flex-shrink: 0 !important;
    width: 100% !important;
    scroll-snap-align: start !important;
    display: block !important;
}

.bst-gallery-mobile__slide img {
    width: 100% !important;
    height: 280px !important;
    object-fit: cover !important;
}

.bst-gallery-mobile__counter {
    position: absolute !important;
    bottom: 12px !important;
    right: 12px !important;
    padding: 4px 12px !important;
    background: rgba(0, 0, 0, 0.6) !important;
    color: #fff !important;
    border-radius: var(--bst-radius-full) !important;
    font-size: var(--bst-font-size-xs) !important;
    font-weight: 600 !important;
    font-family: var(--bst-font) !important;
    z-index: 2 !important;
}


/* ═══════════════════════════════════════════════
   2. CONTENT GRID
   ═══════════════════════════════════════════════ */

.bst-detail__content {
    max-width: var(--bst-max-width) !important;
    margin: 0 auto !important;
    padding: 0 0 var(--bst-space-8) !important;
    display: grid !important;
    grid-template-columns: 1fr 380px !important;
    gap: var(--bst-space-7) !important;
    align-items: start !important;
}

.bst-detail__main {
    min-width: 0 !important;
}


/* ── Header ── */
.bst-detail__header {
    margin-bottom: var(--bst-space-6) !important;
}

.bst-detail__location {
    font-family: var(--bst-font-accent) !important;
    font-size: 36px !important;
    color: var(--bst-gold-dark) !important;
    display: block !important;
    line-height: 1 !important;
    margin-bottom: 4px !important;
}

.bst-detail__title {
    font-family: var(--bst-font-title) !important;
    font-size: var(--bst-font-size-3xl) !important;
    font-weight: 600 !important;
    color: var(--bst-text) !important;
    line-height: var(--bst-line-height-tight) !important;
    margin-bottom: var(--bst-space-3) !important;
}

.bst-detail__header .bst-badge {
    margin-top: var(--bst-space-2) !important;
}


/* ── Quick Facts (Airbnb-style horizontal pills) ── */
.bst-detail__facts {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: var(--bst-space-3) !important;
    padding: var(--bst-space-5) 0 !important;
    border-top: 1px solid var(--bst-border-light) !important;
    border-bottom: 1px solid var(--bst-border-light) !important;
    margin-bottom: var(--bst-space-6) !important;
}

.bst-detail__fact {
    display: flex !important;
    align-items: center !important;
    gap: var(--bst-space-2) !important;
    padding: 10px 18px !important;
    background: var(--bst-bg-alt) !important;
    border-radius: var(--bst-radius-sm) !important;
    border: 1px solid var(--bst-border-light) !important;
}

.bst-detail__fact-icon {
    width: 20px !important;
    height: 20px !important;
    flex-shrink: 0 !important;
    color: var(--bst-gold) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.bst-detail__fact-icon svg {
    width: 18px !important;
    height: 18px !important;
}

.bst-detail__fact-value {
    font-size: var(--bst-font-size-base) !important;
    font-weight: 700 !important;
    color: var(--bst-text) !important;
    line-height: 1.2 !important;
}

.bst-detail__fact-label {
    font-size: var(--bst-font-size-sm) !important;
    color: var(--bst-text-muted) !important;
    font-weight: 500 !important;
}


/* ── Facts Grid Card (Variante B) ── */
.bst-facts-grid {
    display: grid !important;
    border: 1px solid #e8e8e8 !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    background: #fff !important;
}

.bst-facts-grid__item {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 12px 16px !important;
    border-right: 1px solid #f0f0f0 !important;
}

.bst-facts-grid__item:last-child {
    border-right: none !important;
}

.bst-facts-grid__icon {
    display: flex !important;
    color: var(--bst-gold, #ccb66e) !important;
    flex-shrink: 0 !important;
}

.bst-facts-grid__icon svg {
    width: 20px !important;
    height: 20px !important;
}

.bst-facts-grid__text {
    white-space: nowrap !important;
    line-height: 1.2 !important;
}

.bst-facts-grid__value {
    font-family: 'Playfair Display', var(--bst-font-title), serif !important;
    font-size: 24px !important;
    font-weight: 500 !important;
    color: var(--bst-text, #222) !important;
}

.bst-facts-grid__label {
    font-size: 11px !important;
    white-space: nowrap !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    color: #999 !important;
    font-weight: 600 !important;
}

@media (max-width: 768px) {
    .bst-facts-grid {
        grid-template-columns: repeat(3, 1fr) !important;
    }
    .bst-facts-grid__item {
        padding: 16px 8px !important;
    }
    .bst-facts-grid__item:nth-child(3) {
        border-right: none !important;
    }
    .bst-facts-grid__item:nth-child(n+4) {
        border-top: 1px solid #f0f0f0 !important;
    }
    .bst-facts-grid__value {
        font-size: 22px !important;
    }
}

/* ── Sections ── */
.bst-detail__section {
    margin-bottom: var(--bst-space-7) !important;
}

/* ── Section Headers (Titel + Full-Width Linie + Icon-Badge rechts) ── */

.bst-section-header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    margin-bottom: 24px !important;
    padding-bottom: 16px !important;
    border-bottom: none !important;
    background-image: linear-gradient(90deg, var(--bst-gold, #ccb66e), transparent) !important;
    background-size: 100% 1px !important;
    background-repeat: no-repeat !important;
    background-position: bottom !important;
}

.bst-section-header__title {
    font-family: 'Playfair Display', var(--bst-font-title), serif !important;
    font-size: 22px !important;
    font-weight: 500 !important;
    color: var(--bst-text, #222) !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    line-height: 1.3 !important;
    flex: 1 !important;
}

/* Runder Icon-Badge rechts */
.bst-section-icon-badge {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 36px !important;
    height: 36px !important;
    flex-shrink: 0 !important;
    background: rgba(204, 182, 110, 0.08) !important;
    border: 1px solid rgba(204, 182, 110, 0.2) !important;
    border-radius: 50% !important;
    color: var(--bst-gold, #ccb66e) !important;
}

.bst-section-icon-badge svg {
    width: 16px !important;
    height: 16px !important;
}

.bst-detail__lead {
    font-size: var(--bst-font-size-lg) !important;
    font-weight: 500 !important;
    color: var(--bst-text) !important;
    line-height: var(--bst-line-height) !important;
    margin: 0 0 var(--bst-space-4) !important;
}


/* ── Amenities (Airbnb-Style) ── */
.bst-amenities {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 0 var(--bst-space-5) !important;
}

.bst-amenities__item {
    display: flex !important;
    align-items: center !important;
    gap: var(--bst-space-3) !important;
    padding: var(--bst-space-3) 0 !important;
    border-bottom: 1px solid var(--bst-border-light) !important;
    font-size: var(--bst-font-size-base) !important;
    color: var(--bst-text) !important;
}

.bst-amenities__item--hidden {
    display: none !important;
}

.bst-amenities.expanded .bst-amenities__item--hidden {
    display: flex !important;
}

.bst-amenities__icon {
    width: 24px !important;
    height: 24px !important;
    flex-shrink: 0 !important;
    color: var(--bst-gold) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.bst-amenities__icon svg {
    width: 20px !important;
    height: 20px !important;
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 1.5 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
}

.bst-amenities__toggle {
    margin-top: var(--bst-space-5) !important;
}


/* ── Map ── */
.bst-detail__map {
    width: 100% !important;
    height: 300px !important;
    border-radius: var(--bst-radius-md) !important;
    overflow: hidden !important;
    border: 1px solid var(--bst-border-light) !important;
}

.bst-detail__map-subtitle {
    font-size: var(--bst-font-size-base) !important;
    color: var(--bst-text-light) !important;
    margin: 0 0 var(--bst-space-3) !important;
}

.bst-detail__map-note {
    font-size: var(--bst-font-size-sm) !important;
    color: var(--bst-text-muted) !important;
    margin: var(--bst-space-3) 0 0 !important;
}

.bst-detail__location-description {
    margin-top: var(--bst-space-5) !important;
    padding-top: var(--bst-space-5) !important;
    border-top: 1px solid #e1e1e1 !important;
}


/* ═══════════════════════════════════════════════
   3. BOOKING WIDGET (Sidebar, sticky)
   ═══════════════════════════════════════════════ */

/* Sidebar sticky wird per JS gesteuert (Elementor overflow:hidden bricht CSS sticky) */
.bst-detail__sidebar {
    align-self: start !important;
    height: fit-content !important;
    z-index: 10 !important;
}

.bst-booking-widget {
    background: var(--bst-bg) !important;
    border: 1px solid var(--bst-border) !important;
    border-radius: var(--bst-radius-md) !important;
    box-shadow: var(--bst-shadow-lg) !important;
    padding: var(--bst-space-5) !important;
}

.bst-booking-widget__price {
    display: flex !important;
    align-items: baseline !important;
    gap: 4px !important;
    margin-bottom: var(--bst-space-5) !important;
    font-family: var(--bst-font) !important;
}

.bst-booking-widget__price-label {
    font-size: var(--bst-font-size-sm) !important;
    color: var(--bst-text-muted) !important;
}

.bst-booking-widget__price-value {
    font-size: var(--bst-font-size-2xl) !important;
    font-weight: 800 !important;
    color: var(--bst-text) !important;
}

.bst-booking-widget__price-unit {
    font-size: var(--bst-font-size-sm) !important;
    color: var(--bst-text-muted) !important;
}

.bst-booking-widget__fields {
    display: flex !important;
    flex-direction: column !important;
    gap: var(--bst-space-3) !important;
    margin-bottom: var(--bst-space-4) !important;
}

.bst-booking-widget__dates {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: var(--bst-space-3) !important;
}

.bst-booking-widget__guests {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: var(--bst-space-3) !important;
}

.bst-booking-widget__field label {
    display: block !important;
    font-family: var(--bst-font) !important;
    font-size: var(--bst-font-size-xs) !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    color: var(--bst-text-muted) !important;
    margin-bottom: var(--bst-space-1) !important;
}

.bst-booking-widget__field .bst-input {
    font-size: 16px !important; /* iOS zoom prevention */
    padding: 10px 12px !important;
    height: 44px !important;
}

.bst-booking-widget__field .bst-stepper {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    border: 1px solid var(--bst-border) !important;
    border-radius: var(--bst-radius-sm) !important;
    padding: 4px !important;
    height: 44px !important;
}

.bst-booking-widget__field .bst-stepper__btn {
    width: 32px !important;
    height: 32px !important;
    border: none !important;
    background: var(--bst-bg-alt) !important;
    border-radius: var(--bst-radius-sm) !important;
    font-size: 16px !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: var(--bst-transition-fast) !important;
    -webkit-appearance: none !important;
    appearance: none !important;
    color: var(--bst-text) !important;
    padding: 0 !important;
    line-height: 1 !important;
}

.bst-booking-widget__field .bst-stepper__btn:hover {
    background: var(--bst-gold-bg) !important;
    color: var(--bst-gold-dark) !important;
}

.bst-booking-widget__field .bst-stepper input {
    width: 40px !important;
    text-align: center !important;
    border: none !important;
    font-family: var(--bst-font) !important;
    font-size: var(--bst-font-size-base) !important;
    font-weight: 600 !important;
    color: var(--bst-text) !important;
    background: transparent !important;
    -webkit-appearance: none !important;
    -moz-appearance: textfield !important;
    padding: 0 !important;
    margin: 0 !important;
}

.bst-booking-widget__summary {
    padding: var(--bst-space-4) 0 !important;
    border-top: 1px solid var(--bst-border-light) !important;
    margin-bottom: var(--bst-space-4) !important;
}

.bst-booking-widget__summary--top {
    padding-top: 0 !important;
    border-top: none !important;
    margin-top: -8px !important;
}

.bst-booking-widget__summary-row {
    display: flex !important;
    justify-content: space-between !important;
    font-family: var(--bst-font) !important;
    font-size: var(--bst-font-size-base) !important;
    font-weight: 600 !important;
    color: var(--bst-text) !important;
}

.bst-booking-widget__cta {
    width: 100% !important;
    transition: background 0.2s, opacity 0.2s !important;
}

.bst-booking-widget__cta:disabled {
    opacity: 0.6 !important;
    cursor: not-allowed !important;
}

.bst-booking-widget__cta.bst-btn--unavailable {
    background: var(--bst-text-muted) !important;
    border-color: var(--bst-text-muted) !important;
    opacity: 0.7 !important;
}

.bst-booking-widget__price--static {
    margin-bottom: var(--bst-space-4) !important;
}

.bst-booking-widget__widget-title {
    font-family: var(--bst-font-title, var(--bst-font)) !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    color: var(--bst-text) !important;
    margin-bottom: var(--bst-space-4) !important;
}

.bst-booking-widget__beds24-shell {
    margin-bottom: var(--bst-space-4) !important;
    padding: 32px 28px !important;
    border: 1px solid #d8d8d8 !important;
    box-shadow: 10px 12px 24px rgba(0, 0, 0, 0.18) !important;
    background: #ffffff !important;
}

.bst-booking-widget__beds24 {
    min-height: 300px !important;
    width: 100% !important;
}

.bst-booking-widget__beds24 iframe,
.bst-booking-widget__beds24 > div {
    width: 100% !important;
    max-width: 100% !important;
}

#bst-beds24-booking-widget form {
    margin: 0 !important;
}

/* Beds24 BookingBox: 2-Spalten-Grid, Labels über den Inputs */
#bst-beds24-booking-widget .book-form-horizontal {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 8px 12px !important;
}

/* Widget-Titel + Nächte-Zeile auf Desktop ausblenden — Preis steht groß drüber */
.bst-booking-widget__widget-title,
.bst-booking-widget__summary--top,
#bst-beds24-booking-widget .book-form-title {
    display: none !important;
}

/* Jede form-group = 1 Spalte */
#bst-beds24-booking-widget .book-form-group {
    margin-bottom: 0 !important;
    overflow: visible !important;
}

/* Submit-Button Container über volle Breite */
#bst-beds24-booking-widget .book-form-group:last-child,
#bst-beds24-booking-widget .book-form-group:has(.bookbutton),
#bst-beds24-booking-widget .book-form-group:has(button[type="submit"]),
#bst-beds24-booking-widget .book-form-group:has(input[type="submit"]) {
    grid-column: 1 / -1 !important;
    margin-top: 4px !important;
}

/* Label: über dem Input, klein wie auf Suchseite */
#bst-beds24-booking-widget .book-widget .book-control-label,
#bst-beds24-booking-widget .book-form-horizontal .book-control-label,
#bst-beds24-booking-widget .book-control-label {
    display: block !important;
    width: 100% !important;
    float: none !important;
    text-align: left !important;
    padding: 0 !important;
    margin: 0 0 4px !important;
    font-size: 9px !important;
    font-weight: 700 !important;
    color: var(--bst-text-muted) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.8px !important;
    line-height: 1 !important;
}

/* Offset für Button-Gruppe entfernen */
#bst-beds24-booking-widget .book-col-offset-5 {
    margin-left: 0 !important;
}

/* Form-Groups nicht overflow hidden — Inputs begrenzen */
#bst-beds24-booking-widget .book-form-group {
    max-width: 100% !important;
    box-sizing: border-box !important;
}

/* Kalender-Icon (::after / .input-group-addon) neben Date-Inputs ausblenden */
#bst-beds24-booking-widget .input-group-addon,
#bst-beds24-booking-widget .book-input-group-addon {
    display: none !important;
}

/* Input-Container: volle Breite */
#bst-beds24-booking-widget .book-col-7 {
    width: 100% !important;
    float: none !important;
    padding: 0 !important;
}

/* Label-Container: volle Breite, kein Float */
#bst-beds24-booking-widget .book-col-5 {
    width: 100% !important;
    float: none !important;
    padding: 0 !important;
}

#bst-beds24-booking-widget .form-control,
#bst-beds24-booking-widget input[type="text"],
#bst-beds24-booking-widget select {
    width: 100% !important;
    min-height: 48px !important;
    border: 1px solid var(--bst-border) !important;
    border-radius: var(--bst-radius-sm) !important;
    background: #fff !important;
    box-shadow: none !important;
    font-family: var(--bst-font) !important;
    font-size: 16px !important;
    color: var(--bst-text) !important;
}

#bst-beds24-booking-widget .form-control:focus,
#bst-beds24-booking-widget input:focus,
#bst-beds24-booking-widget select:focus {
    outline: none !important;
    border-color: var(--bst-gold) !important;
    box-shadow: 0 0 0 3px rgba(204, 182, 110, 0.14) !important;
}

#bst-beds24-booking-widget [data-check-in="1"],
#bst-beds24-booking-widget [data-check-out="1"] {
    cursor: pointer !important;
}

#bst-beds24-booking-widget .bookbutton,
#bst-beds24-booking-widget button[type="submit"],
#bst-beds24-booking-widget input[type="submit"] {
    width: 100% !important;
    min-height: 58px !important;
    margin-top: 8px !important;
    border: none !important;
    border-radius: var(--bst-radius-sm) !important;
    background: linear-gradient(135deg, var(--bst-gold), var(--bst-gold-dark)) !important;
    color: #fff !important;
    font-family: var(--bst-font) !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
    box-shadow: none !important;
    cursor: pointer !important;
    appearance: none !important;
    -webkit-appearance: none !important;
}

#bst-beds24-booking-widget .bookbutton:hover,
#bst-beds24-booking-widget button[type="submit"]:hover,
#bst-beds24-booking-widget input[type="submit"]:hover {
    filter: brightness(0.98) !important;
}

.bst-booking-widget__price-unavailable {
    font-size: var(--bst-font-size-base) !important;
    font-weight: 600 !important;
    color: var(--bst-error) !important;
}


/* ═══════════════════════════════════════════════
   4. MOBILE STICKY CTA
   ═══════════════════════════════════════════════ */

.bst-detail__sticky-cta {
    display: none !important; /* Hidden by default, shown via JS + media query */
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 999999 !important;
    background: var(--bst-bg) !important;
    border-top: 1px solid var(--bst-border) !important;
    box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.08) !important;
    padding: var(--bst-space-3) var(--bst-space-4) !important;
    /* Safe area for iPhone notch */
    padding-bottom: max(var(--bst-space-3), env(safe-area-inset-bottom)) !important;
}

.bst-detail__sticky-cta.visible {
    display: block !important;
}

.bst-detail__sticky-cta-inner {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: var(--bst-space-4) !important;
    max-width: var(--bst-max-width) !important;
    margin: 0 auto !important;
}

.bst-detail__sticky-price {
    display: flex !important;
    align-items: baseline !important;
    gap: 4px !important;
    font-family: var(--bst-font) !important;
    min-width: 0 !important;
}

.bst-detail__sticky-price strong {
    font-size: var(--bst-font-size-lg) !important;
    font-weight: 800 !important;
    color: var(--bst-text) !important;
}

.bst-detail__sticky-label,
.bst-detail__sticky-unit {
    font-size: var(--bst-font-size-sm) !important;
    color: var(--bst-text-muted) !important;
}

.bst-detail__sticky-left {
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
    min-width: 0 !important;
}

/* Tappable date display in sticky CTA — plain text style */
.bst-detail__sticky-dates {
    display: inline-flex !important;
    align-items: center !important;
    gap: 0 !important;
    background: none !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 2px 0 !important;
    font-family: var(--bst-font) !important;
    font-size: 12px !important;
    color: var(--bst-primary) !important;
    cursor: pointer !important;
    transition: color 0.2s ease !important;
    white-space: nowrap !important;
    text-decoration: underline !important;
    text-underline-offset: 2px !important;
}

/* Remove all icons from sticky date button — plain text only */
.bst-detail__sticky-dates svg,
.bst-detail__sticky-dates i,
.bst-detail__sticky-dates .dashicons {
    display: none !important;
}

.bst-detail__sticky-dates:hover,
.bst-detail__sticky-dates:active {
    color: var(--bst-text) !important;
    background: none !important;
}

/* ═══════════════════════════════════════════════
   5b. MOBILE DATE/GUEST PICKER (Bottom Sheet)
   ═══════════════════════════════════════════════ */

.bst-mobile-booking-overlay {
    position: fixed !important;
    inset: 0 !important;
    z-index: 99999999 !important;
    background: rgba(26, 26, 26, 0.5) !important;
    backdrop-filter: blur(6px) !important;
    -webkit-backdrop-filter: blur(6px) !important;
    display: none !important;
    align-items: flex-end !important;
    justify-content: center !important;
    padding: 0 !important;
}

.bst-mobile-booking-overlay.active {
    display: flex !important;
}

.bst-mobile-booking-sheet {
    background: var(--bst-bg) !important;
    border-radius: 20px 20px 0 0 !important;
    width: 100% !important;
    max-width: 600px !important;
    max-height: 85dvh !important;
    overflow-y: auto !important;
    animation: bstSheetUp 0.3s ease !important;
}

@keyframes bstSheetUp {
    from { transform: translateY(100%); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
}

.bst-mobile-booking-sheet__header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: var(--bst-space-4) var(--bst-space-4) var(--bst-space-3) !important;
    border-bottom: 1px solid var(--bst-border) !important;
}

.bst-mobile-booking-sheet__header h3 {
    font-family: var(--bst-font-heading) !important;
    font-size: var(--bst-font-size-lg) !important;
    font-weight: 700 !important;
    color: var(--bst-text) !important;
    margin: 0 !important;
}

.bst-mobile-booking-sheet__body {
    padding: var(--bst-space-4) !important;
}

/* Date chips row — ausgeblendet, Beds24 Widget hat eigene Anreise/Abreise */
.bst-mobile-booking-sheet__date-chips {
    display: none !important;
}

.bst-mobile-date-chip {
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
    padding: 10px 14px !important;
    border: 2px solid var(--bst-border) !important;
    border-radius: var(--bst-radius-sm) !important;
    background: var(--bst-bg) !important;
    cursor: pointer !important;
    transition: border-color 0.2s ease !important;
}

.bst-mobile-date-chip--active {
    border-color: var(--bst-text) !important;
}

.bst-mobile-date-chip--filled .bst-mobile-date-chip__value {
    color: var(--bst-text) !important;
    font-weight: 600 !important;
}

.bst-mobile-date-chip__label {
    font-family: var(--bst-font) !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    color: var(--bst-text-muted) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}

.bst-mobile-date-chip__value {
    font-family: var(--bst-font) !important;
    font-size: var(--bst-font-size-base) !important;
    color: var(--bst-text-muted) !important;
}

/* Inline calendar container */
.bst-mobile-booking-sheet__calendar {
    margin-bottom: var(--bst-space-3) !important;
    overflow: hidden !important;
}

.bst-mobile-booking-sheet__calendar .litepicker {
    width: 100% !important;
    box-shadow: none !important;
    border: none !important;
    font-family: var(--bst-font) !important;
}

.bst-mobile-booking-sheet__calendar .litepicker .container__months {
    width: 100% !important;
    box-shadow: none !important;
    border: none !important;
    background: transparent !important;
}

.bst-mobile-booking-sheet__calendar .litepicker .container__months .month-item {
    width: 100% !important;
}

.bst-mobile-booking-sheet__calendar .litepicker .container__days .day-item {
    cursor: pointer !important;
    height: 40px !important;
    line-height: 40px !important;
}

/* Beds24 widget inside mobile sheet */
.bst-mobile-booking-sheet__beds24-container {
    margin-bottom: var(--bst-space-3) !important;
}

.bst-mobile-booking-sheet__beds24-container .bst-booking-widget__beds24 {
    width: 100% !important;
}

/* Price display inside mobile sheet */
.bst-mobile-booking-sheet__price {
    padding: 0 0 var(--bst-space-3) !important;
    text-align: center !important;
}

.bst-mobile-booking-sheet__price .bst-booking-widget__price-value {
    font-size: 24px !important;
    font-weight: 800 !important;
}

.bst-mobile-booking-sheet__price .bst-booking-widget__price-avg {
    display: block !important;
    font-size: 13px !important;
    color: var(--bst-text-muted) !important;
}

/* Legacy field styles (kept for non-calendar inputs) */
.bst-mobile-booking-sheet__field label {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    font-family: var(--bst-font) !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    color: var(--bst-text-muted) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    margin-bottom: 6px !important;
}

.bst-mobile-booking-sheet__field input {
    width: 100% !important;
    padding: 10px 12px !important;
    border: 1px solid var(--bst-border) !important;
    border-radius: var(--bst-radius-sm) !important;
    font-family: var(--bst-font) !important;
    font-size: var(--bst-font-size-base) !important;
    color: var(--bst-text) !important;
    background: var(--bst-bg) !important;
    cursor: pointer !important;
}

.bst-mobile-booking-sheet__guests {
    border-top: 1px solid var(--bst-border) !important;
    padding-top: var(--bst-space-4) !important;
}

.bst-mobile-booking-sheet__guest-row {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: var(--bst-space-3) 0 !important;
    font-family: var(--bst-font) !important;
    font-size: var(--bst-font-size-base) !important;
    color: var(--bst-text) !important;
}

.bst-mobile-booking-sheet__guest-row + .bst-mobile-booking-sheet__guest-row {
    border-top: 1px solid var(--bst-border-light, rgba(0,0,0,0.06)) !important;
}

.bst-mobile-booking-sheet__guest-row .bst-stepper {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
}

.bst-mobile-booking-sheet__guest-row .bst-stepper__btn {
    width: 36px !important;
    height: 36px !important;
    border-radius: 50% !important;
    border: 1px solid var(--bst-border) !important;
    background: var(--bst-bg) !important;
    font-size: 18px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    color: var(--bst-text) !important;
}

.bst-mobile-booking-sheet__guest-row .bst-stepper input {
    width: 36px !important;
    text-align: center !important;
    border: none !important;
    font-family: var(--bst-font) !important;
    font-size: var(--bst-font-size-base) !important;
    font-weight: 600 !important;
    background: transparent !important;
    color: var(--bst-text) !important;
}

.bst-mobile-booking-sheet__footer {
    padding: var(--bst-space-3) var(--bst-space-4) !important;
    padding-bottom: max(var(--bst-space-4), env(safe-area-inset-bottom)) !important;
    border-top: 1px solid var(--bst-border) !important;
}

.bst-mobile-booking-sheet__footer .bst-btn {
    width: 100% !important;
}


/* ═══════════════════════════════════════════════
   5. BOOKING MODAL
   ═══════════════════════════════════════════════ */

.bst-booking-modal-overlay {
    position: fixed !important;
    inset: 0 !important;
    z-index: 99999999 !important;
    background: rgba(26, 26, 26, 0.5) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: var(--bst-space-5) !important;
    opacity: 0 !important;
    visibility: hidden !important;
    transition: opacity 0.3s, visibility 0.3s !important;
}

.bst-booking-modal-overlay.active {
    opacity: 1 !important;
    visibility: visible !important;
}

.bst-booking-modal {
    position: relative !important;
    background: rgba(255, 255, 255, 0.94) !important;
    backdrop-filter: blur(24px) !important;
    -webkit-backdrop-filter: blur(24px) !important;
    border-radius: var(--bst-radius-xl, 20px) !important;
    box-shadow: 0 24px 64px rgba(0, 0, 0, 0.15) !important;
    width: 94vw !important;
    max-width: 1100px !important;
    height: 90vh !important;
    max-height: 90vh !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
    transform: translateY(20px) scale(0.97) !important;
    transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.bst-booking-modal-overlay.active .bst-booking-modal {
    transform: translateY(0) scale(1) !important;
}

.bst-booking-modal__header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 8px 20px !important;
    background: #1d1814 !important;
    border-bottom: none !important;
    flex-shrink: 0 !important;
}

.bst-booking-modal__logo {
    filter: brightness(0) invert(1) !important;
}

.bst-booking-modal__logo {
    width: 36px !important;
    height: 36px !important;
    border-radius: 50% !important;
    object-fit: cover !important;
}

.bst-booking-modal__title {
    font-family: var(--bst-font) !important;
    font-size: var(--bst-font-size-lg) !important;
    font-weight: 700 !important;
    color: var(--bst-text) !important;
}

.bst-booking-modal__body {
    flex: 1 !important;
    overflow: auto !important;
    -webkit-overflow-scrolling: touch !important;
    min-height: 0 !important;
}

.bst-booking-modal__body iframe {
    width: 100% !important;
    height: 100% !important;
    min-height: 720px !important;
    max-height: none !important;
    border: none !important;
    overflow: auto !important;
    display: block !important;
}


/* ═══════════════════════════════════════════════
   LITEPICKER THEME (Gold Design System)
   Identisch mit Search — einheitliches Kalender-Design
   ═══════════════════════════════════════════════ */

.litepicker .container__months {
    font-family: var(--bst-font) !important;
    border-radius: 12px !important;
    box-shadow: 0 12px 48px rgba(0, 0, 0, 0.15) !important;
    border: 1px solid var(--bst-glass-border) !important;
    background: #fff !important;
}

.litepicker .container__months .month-item-header {
    padding: 12px 8px !important;
    font-weight: 700 !important;
}

.litepicker .container__months .month-item-header div > .month-item-name {
    font-weight: 700 !important;
    font-size: 15px !important;
}

.litepicker .container__months .month-item-header div > .month-item-year {
    font-weight: 600 !important;
    font-size: 15px !important;
    color: var(--bst-text-muted) !important;
}

.litepicker .container__months .month-item-weekdays-row > div {
    font-size: 11px !important;
    font-weight: 700 !important;
    color: var(--bst-text-muted) !important;
}

.litepicker .container__days .day-item {
    border-radius: 8px !important;
    font-weight: 500 !important;
    font-size: 14px !important;
    transition: all 0.15s ease !important;
    color: var(--bst-text) !important;
    cursor: pointer !important;
    position: relative !important;
}

.litepicker .container__days .day-item:hover {
    background: rgba(204, 182, 110, 0.18) !important;
}

.litepicker .container__days .day-item.is-start-date,
.litepicker .container__days .day-item.is-end-date,
.litepicker .container__days .day-item.is-selected {
    background: linear-gradient(135deg, var(--bst-gold), var(--bst-gold-dark)) !important;
    color: #fff !important;
    box-shadow: 0 2px 8px rgba(204, 182, 110, 0.35) !important;
}

.litepicker .container__days .day-item.is-in-range {
    background: rgba(204, 182, 110, 0.1) !important;
    border-radius: 0 !important;
}

.litepicker .container__days .day-item.is-today:not(.is-selected):not(.is-start-date):not(.is-end-date) {
    color: var(--bst-gold) !important;
    font-weight: 700 !important;
    border: 1px solid var(--bst-gold) !important;
}

.litepicker .container__days .day-item.is-locked,
.litepicker .container__days .day-item.is-booked,
.litepicker .container__days .day-item.bst-day-blocked {
    color: var(--bst-text-muted) !important;
    opacity: 0.45 !important;
    text-decoration: line-through !important;
    cursor: not-allowed !important;
}

.litepicker .container__days .day-item.is-locked::after,
.litepicker .container__days .day-item.is-booked::after,
.litepicker .container__days .day-item.bst-day-blocked::after {
    content: '' !important;
    position: absolute !important;
    left: 16% !important;
    right: 16% !important;
    top: 50% !important;
    height: 1.5px !important;
    background: currentColor !important;
    transform: rotate(-16deg) !important;
    opacity: 0.9 !important;
    pointer-events: none !important;
}

.litepicker .container__days .day-item.is-locked:hover,
.litepicker .container__days .day-item.is-booked:hover,
.litepicker .container__days .day-item.bst-day-blocked:hover {
    background: transparent !important;
}

.litepicker .container__months .button-previous-month,
.litepicker .container__months .button-next-month {
    cursor: pointer !important;
    transition: all 0.2s !important;
    width: 32px !important;
    height: 32px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 50% !important;
    border: 1px solid rgba(0, 0, 0, 0.1) !important;
    background: #fff !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06) !important;
}

.litepicker .container__months .button-previous-month:hover,
.litepicker .container__months .button-next-month:hover {
    background: var(--bst-gold-bg, #faf5eb) !important;
    border-color: var(--bst-gold, #ccb66e) !important;
}

.litepicker .container__months .button-previous-month svg,
.litepicker .container__months .button-next-month svg {
    width: 14px !important;
    height: 14px !important;
    fill: var(--bst-text, #1a1a1a) !important;
}

/* Price Skeleton — shimmer placeholder while fetching price */
.bst-price-skeleton {
    display: inline-block !important;
    width: 80px !important;
    height: 24px !important;
    background: linear-gradient(90deg, var(--bst-border-light, #e0e0e0) 25%, var(--bst-bg-alt, #f0f0f0) 50%, var(--bst-border-light, #e0e0e0) 75%) !important;
    background-size: 200% 100% !important;
    animation: bst-price-shimmer 1.5s ease-in-out infinite !important;
    border-radius: var(--bst-radius-sm, 4px) !important;
    vertical-align: middle !important;
}

@keyframes bst-price-shimmer {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

/* Preis-Lade-Skeleton (Klassen-basiert) — auf den Preis-Container legen.
   Versteckt den echten Inhalt (visibility -> Höhe bleibt, kein Layout-Sprung)
   und legt einen klaren animierten Shimmer drüber. Kein innerHTML-Austausch:
   kein DOM-Churn, kein Durchblitzen des alten/Per-Nacht-Preises. */
.bst-price-loading {
    position: relative !important;
    min-height: 2em !important;
    pointer-events: none !important;
}
.bst-price-loading > * {
    visibility: hidden !important;
}
.bst-price-loading::after {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    width: 62% !important;
    max-width: 180px !important;
    height: 1.6em !important;
    border-radius: var(--bst-radius-sm, 6px) !important;
    /* Solider grauer Block + heller Lichtbalken, der klar durchwandert = eindeutig
       erkennbarer Ladevorgang (deutlich mehr Kontrast als der alte, kaum sichtbare
       Shimmer). background-repeat:no-repeat -> genau EIN durchlaufender Balken. */
    background-color: #d8d8d8 !important;
    background-image: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.9) 50%, rgba(255, 255, 255, 0) 100%) !important;
    background-size: 150px 100% !important;
    background-repeat: no-repeat !important;
    /* KEIN !important auf background-position — sonst schlägt es laut CSS-Spec die
       Animation und der Lichtbalken bleibt stehen. Die Keyframes steuern die Position. */
    background-position: -150px 0;
    animation: bst-skeleton-sweep 1.15s ease-in-out infinite !important;
}
@keyframes bst-skeleton-sweep {
    0%   { background-position: -150px 0; }
    100% { background-position: calc(150px + 100%) 0; }
}
/* Reduced-Motion: statt wanderndem Balken ein sanftes Pulsieren (bleibt „lädt"-Signal). */
@keyframes bst-skeleton-pulse {
    0%, 100% { opacity: 1; }
    50%      { opacity: 0.45; }
}
@media (prefers-reduced-motion: reduce) {
    .bst-price-loading::after {
        background-image: none !important;
        animation: bst-skeleton-pulse 1.4s ease-in-out infinite !important;
    }
}
/* Sticky-Bar + Mobile-Sheet sind kompakter — kleineres Skeleton. */
.bst-detail__sticky-price.bst-price-loading {
    min-height: 1.2em !important;
    min-width: 90px !important;
}
.bst-detail__sticky-price.bst-price-loading::after {
    height: 1.1em !important;
    width: 90px !important;
}

/* Durchschnittspreis in Booking Widget */
.bst-booking-widget__price-avg {
    display: block !important;
    font-size: var(--bst-font-size-sm) !important;
    color: var(--bst-text-muted) !important;
    font-weight: 400 !important;
    margin-top: 4px !important;
}

/* jQuery UI datepicker for Beds24 widget — compact size matching Litepicker */
#ui-datepicker-div.bst-widget-datepicker,
#ui-datepicker-div.ui-datepicker {
    z-index: 999999999 !important;
    border: 1px solid rgba(0, 0, 0, 0.08) !important;
    border-radius: 12px !important;
    box-shadow: 0 12px 48px rgba(0, 0, 0, 0.15) !important;
    padding: 12px 10px 8px !important;
    background: #fff !important;
    width: 280px !important;
    font-family: var(--bst-font) !important;
}

#ui-datepicker-div.ui-datepicker .ui-datepicker-header {
    background: transparent !important;
    border: none !important;
    padding: 0 0 8px !important;
}

#ui-datepicker-div.ui-datepicker .ui-datepicker-title {
    font-size: 15px !important;
    font-weight: 700 !important;
    color: var(--bst-text) !important;
    line-height: 32px !important;
}

#ui-datepicker-div.ui-datepicker .ui-datepicker-month,
#ui-datepicker-div.ui-datepicker .ui-datepicker-year {
    font-size: 15px !important;
}

#ui-datepicker-div.ui-datepicker .ui-datepicker-prev,
#ui-datepicker-div.ui-datepicker .ui-datepicker-next {
    top: 0 !important;
    width: 32px !important;
    height: 32px !important;
    border-radius: 50% !important;
    border: 1px solid rgba(0, 0, 0, 0.1) !important;
    background: #fff !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06) !important;
}

#ui-datepicker-div.ui-datepicker .ui-datepicker-prev-hover,
#ui-datepicker-div.ui-datepicker .ui-datepicker-next-hover {
    border-color: var(--bst-gold) !important;
    background: var(--bst-gold-bg, #faf5eb) !important;
}

#ui-datepicker-div.ui-datepicker table {
    margin: 0 !important;
    font-size: 13px !important;
}

#ui-datepicker-div.ui-datepicker th {
    padding: 4px 0 6px !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    color: var(--bst-text-muted) !important;
    text-transform: none !important;
}

#ui-datepicker-div.ui-datepicker td {
    padding: 1px !important;
}

#ui-datepicker-div.ui-datepicker td span,
#ui-datepicker-div.ui-datepicker td a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 34px !important;
    height: 32px !important;
    margin: 0 auto !important;
    border: none !important;
    border-radius: 8px !important;
    background: transparent !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    color: var(--bst-text) !important;
    text-align: center !important;
    padding: 0 !important;
    line-height: 32px !important;
}

#ui-datepicker-div.ui-datepicker td a:hover {
    background: rgba(204, 182, 110, 0.18) !important;
}

#ui-datepicker-div.ui-datepicker td .ui-state-active {
    background: linear-gradient(135deg, var(--bst-gold), var(--bst-gold-dark)) !important;
    color: #fff !important;
    box-shadow: 0 2px 8px rgba(204, 182, 110, 0.35) !important;
}

#ui-datepicker-div.ui-datepicker td.ui-state-disabled span,
#ui-datepicker-div.ui-datepicker td.ui-datepicker-unselectable span {
    color: rgba(26, 26, 26, 0.24) !important;
    text-decoration: line-through !important;
}

/* ═══════════════════════════════════════════════
   ELEMENTOR CSS ISOLATION
   Defensive Resets gegen Elementor Kit 3606
   ═══════════════════════════════════════════════ */

.bst-detail button,
.bst-detail a,
.bst-detail input,
.bst-detail select,
.bst-detail label {
    font-family: var(--bst-font) !important;
}

.bst-detail .bst-btn,
.bst-detail .bst-btn:hover,
.bst-detail .bst-btn:focus,
.bst-detail .bst-btn:active {
    font-family: var(--bst-font) !important;
    text-decoration: none !important;
    letter-spacing: 0.5px !important;
    line-height: 1 !important;
}

.elementor-kit-3606 .bst-detail .bst-btn,
.elementor-kit-3606 .bst-detail .bst-btn--primary,
.elementor-kit-3606 .bst-detail .bst-booking-widget__cta {
    background: linear-gradient(135deg, var(--bst-gold), var(--bst-gold-dark)) !important;
    color: #fff !important;
    border-radius: var(--bst-radius-sm) !important;
    border: none !important;
    font-family: var(--bst-font) !important;
    font-weight: 700 !important;
}


/* ── Fix Close Buttons on Detail Page ── */
.bst-detail .bst-modal__close,
.bst-mobile-booking-sheet .bst-modal__close,
.bst-booking-modal .bst-modal__close,
.bst-booking-modal-overlay .bst-modal__close {
    width: 38px !important;
    height: 38px !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    background: rgba(255, 255, 255, 0.1) !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
    border-radius: 50% !important;
    font-size: 18px !important;
    color: #fff !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: all 0.2s !important;
    padding: 0 !important;
    margin: 0 !important;
    line-height: 1 !important;
}

.bst-detail .bst-modal__close:hover,
.bst-mobile-booking-sheet .bst-modal__close:hover,
.bst-booking-modal .bst-modal__close:hover,
.bst-booking-modal-overlay .bst-modal__close:hover {
    background: rgba(255, 255, 255, 0.2) !important;
    color: #fff !important;
}


/* ═══════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════ */

@media (max-width: 1024px) {
    .bst-detail__content {
        grid-template-columns: 1fr !important;
    }

    .bst-detail__sidebar {
        position: static !important;
    }

    .bst-gallery {
        height: 400px !important;
    }
}

@media (max-width: 768px) {
    /* Gallery: Swipe statt Grid */
    .bst-gallery {
        display: none !important;
    }

    .bst-gallery-mobile {
        display: flex !important;
    }

    .bst-detail__gallery {
        margin-bottom: var(--bst-space-4) !important;
    }

    /* Content */
    .bst-detail__content {
        padding: 0 var(--bst-space-4) var(--bst-space-6) !important;
        gap: var(--bst-space-5) !important;
    }

    .bst-detail__location {
        font-size: 28px !important;
    }

    .bst-detail__title {
        font-size: var(--bst-font-size-2xl) !important;
    }

    .bst-detail__facts {
        gap: var(--bst-space-3) var(--bst-space-4) !important;
    }

    /* Amenities: 1 column on mobile */
    .bst-amenities {
        grid-template-columns: 1fr !important;
    }

    /* Sidebar → Booking Widget is hidden on mobile (use sticky CTA) */
    .bst-detail__sidebar {
        display: none !important;
    }

    /* Show Sticky CTA on mobile */
    .bst-detail__sticky-cta.visible {
        display: block !important;
    }

    /* Booking Modal fullscreen on mobile */
    .bst-booking-modal-overlay {
        padding: 0 !important;
    }

    .bst-booking-modal {
        width: 100vw !important;
        max-width: 100% !important;
        height: 100dvh !important;
        max-height: 100dvh !important;
        border-radius: 0 !important;
    }

    .bst-booking-modal__body iframe {
        height: 100% !important;
        min-height: 0 !important;
        max-height: none !important;
    }

    #ui-datepicker-div.bst-widget-datepicker,
    #ui-datepicker-div.ui-datepicker {
        width: min(92vw, 280px) !important;
    }

}

/* iOS Input Fixes — prevent zoom on focus (requires ≥16px font-size) */
@supports (-webkit-touch-callout: none) {
    .bst-booking-widget__field .bst-input,
    .bst-booking-widget__field input[readonly] {
        -webkit-appearance: none !important;
        appearance: none !important;
        background-color: var(--bst-bg) !important;
        color: var(--bst-text) !important;
        opacity: 1 !important;
        -webkit-text-fill-color: var(--bst-text) !important;
        border: 1px solid var(--bst-border) !important;
    }
}

/* Prevent mobile zoom on ALL inputs (iOS zooms when font-size < 16px) */
.book-widget input[type="text"],
.book-widget select,
.bst-mobile-booking-sheet input,
.bst-mobile-booking-sheet select,
#bst-beds24-booking-widget input[type="text"],
#bst-beds24-booking-widget select {
    font-size: 16px !important;
}

/* Booking widget inputs — match search form style */
.book-widget .book-form-control,
.book-widget input.datepicker {
    height: 46px !important;
    padding: 0 14px !important;
    border: 1px solid rgba(0, 0, 0, 0.1) !important;
    border-radius: 9px !important;
    background: rgba(255, 255, 255, 0.45) !important;
    font-family: var(--bst-font) !important;
    font-size: 16px !important;
    color: var(--bst-text) !important;
    box-shadow: none !important;
    outline: none !important;
}

.book-widget .book-form-control:focus,
.book-widget input.datepicker:focus {
    border-color: var(--bst-gold) !important;
    box-shadow: 0 0 0 3px rgba(204, 182, 110, 0.14) !important;
}

/* Booking widget labels — klein, uppercase */
.book-widget .book-control-label {
    font-family: var(--bst-font) !important;
    font-size: 9px !important;
    font-weight: 700 !important;
    color: var(--bst-text-muted) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.8px !important;
    margin-bottom: 4px !important;
}

/* Booking widget select — match search form */
.book-widget select {
    height: 46px !important;
    padding: 0 14px !important;
    border: 1px solid rgba(0, 0, 0, 0.1) !important;
    border-radius: 9px !important;
    background: rgba(255, 255, 255, 0.45) !important;
    font-family: var(--bst-font) !important;
    font-size: 16px !important;
    color: var(--bst-text) !important;
    -webkit-appearance: none !important;
    appearance: none !important;
}

/* Booking widget submit button — gold style */
.book-widget .bookbutton,
.book-widget button[type="submit"],
.book-widget input[type="submit"] {
    width: 100% !important;
    min-height: 52px !important;
    margin-top: 8px !important;
    border: none !important;
    border-radius: 9px !important;
    background: linear-gradient(135deg, var(--bst-gold), var(--bst-gold-dark)) !important;
    color: #fff !important;
    font-family: var(--bst-font) !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
}

/* Booking widget layout — 2 Spalten nebeneinander, Labels oben */
.book-widget .book-row {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    margin-bottom: 0 !important;
}

.book-widget .book-block {
    flex: 1 1 calc(50% - 5px) !important;
    min-width: 0 !important;
    padding: 0 !important;
    margin-bottom: 10px !important;
}

/* Submitbutton-Block immer volle Breite */
.book-widget .book-block:has(.bookbutton),
.book-widget .book-block:has(button[type="submit"]),
.book-widget .book-block:has(input[type="submit"]) {
    flex: 1 1 100% !important;
}

/* Label immer über dem Input */
.book-widget .book-control-label {
    display: block !important;
    width: 100% !important;
}

@media (max-width: 480px) {
    .bst-gallery-mobile__slide img {
        height: 240px !important;
    }

    .bst-detail__map {
        height: 220px !important;
    }

    .bst-detail__sticky-cta {
        padding: 12px 16px calc(12px + env(safe-area-inset-bottom)) !important;
    }

    .bst-detail__sticky-cta-inner {
        gap: 12px !important;
        align-items: stretch !important;
    }

    .bst-detail__sticky-left {
        min-width: 0 !important;
        flex: 1 !important;
    }

    .bst-detail__sticky-dates {
        width: auto !important;
        justify-content: flex-start !important;
        padding: 2px 0 !important;
    }

    #bst-sticky-reserve-btn {
        min-width: 148px !important;
        white-space: nowrap !important;
    }
}


/* ═══════════════════════════════════════════════
   Task 6: Mobile Sheet — Beds24 Widget Labels kleiner
   ═══════════════════════════════════════════════ */
.bst-mobile-booking-sheet__beds24-container label,
.bst-mobile-booking-sheet__beds24-container .book-control-label {
    font-size: 11px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    color: var(--bst-text-muted) !important;
}

/* Task 7: Doppelte Anreise/Abreise Felder im Mobile Sheet ausblenden
   Beds24 Widget rendert ggf. zusätzliche Date-Inputs nach dem Button */
.bst-mobile-booking-sheet__beds24-container .book-widget .book-row:last-child .book-block:has(input.datepicker) {
    display: none !important;
}

/* Fallback für Browser ohne :has() — verstecke extra date inputs nach dem Submit-Button */
.bst-mobile-booking-sheet__beds24-container .bookbutton ~ .book-row,
.bst-mobile-booking-sheet__beds24-container .bookbutton ~ .book-block,
.bst-mobile-booking-sheet__beds24-container form > .book-row:nth-child(n+5) input.datepicker {
    /* Nur ausblenden wenn sie nach dem Button kommen */
}


/* ═══════════════════════════════════════════════
   Task 9a: Box-Container um Sektionen
   ═══════════════════════════════════════════════ */
.bst-detail__section {
    background: var(--bst-bg) !important;
    border: 1px solid rgba(0, 0, 0, 0.08) !important;
    border-radius: 16px !important;
    padding: var(--bst-space-5) var(--bst-space-6) !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important;
    margin-bottom: var(--bst-space-6) !important;
}

.bst-detail__facts {
    background: var(--bst-bg) !important;
    border: 1px solid rgba(0, 0, 0, 0.08) !important;
    border-radius: 16px !important;
    padding: var(--bst-space-5) var(--bst-space-6) !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important;
    border-top: none !important;
    border-bottom: none !important;
}


/* ═══════════════════════════════════════════════
   Task 9b: Merkmale — Textlink statt Button
   ═══════════════════════════════════════════════ */
#bst-amenities-toggle,
#bst-amenities-toggle.bst-amenities__toggle-link,
#bst-amenities-toggle.bst-amenities__toggle,
button#bst-amenities-toggle {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    background: none !important;
    background-color: transparent !important;
    background-image: none !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin-top: var(--bst-space-4) !important;
    font-family: var(--bst-font) !important;
    font-size: var(--bst-font-size-base) !important;
    font-weight: 600 !important;
    color: #000 !important;
    cursor: pointer !important;
    text-decoration: none !important;
    text-transform: none !important;
    letter-spacing: normal !important;
    line-height: 1.4 !important;
    width: auto !important;
    min-height: 0 !important;
    min-width: 0 !important;
    transition: color 0.2s ease !important;
}

#bst-amenities-toggle:hover,
button#bst-amenities-toggle:hover {
    color: var(--bst-gold) !important;
    background: none !important;
    background-color: transparent !important;
    text-decoration: none !important;
}

.bst-amenities__toggle-link svg {
    width: 16px !important;
    height: 16px !important;
    transition: transform 0.3s ease !important;
    flex-shrink: 0 !important;
}

.bst-amenities.expanded .bst-amenities__toggle-link svg {
    transform: rotate(180deg) !important;
}


/* ═══════════════════════════════════════════════
   Task 9c: Beschreibungstext Styling
   ═══════════════════════════════════════════════ */
.bst-body-text {
    font-family: var(--bst-font) !important;
    font-size: 15px !important;
    line-height: 1.7 !important;
    color: var(--bst-text) !important;
}

.bst-body-text p {
    margin-bottom: var(--bst-space-3) !important;
}

.bst-body-text p:last-child {
    margin-bottom: 0 !important;
}


/* ── Booking Button Hover Zoom ── */
.bst-detail .book-btn {
    transition: transform 0.25s ease !important;
}

.bst-detail .book-btn:hover {
    transform: scale(1.03) !important;
}

/* ═══════════════════════════════════════════════════════════════════════════
   Objektfakten (vorher inline via bellestay_objektfakten_css())
   ═══════════════════════════════════════════════════════════════════════════ */

.bellestay-objektfakten {
    display: grid;
    grid-template-columns: repeat(var(--bs-cols, 5), 1fr);
    gap: 0;
    background: #f5f5f3;
    border-radius: 0;
    overflow: hidden;
    width: 100%;
}
.bellestay-fakt {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 30px 15px;
    position: relative;
}
/* Vertikale Trennlinien */
.bellestay-fakt:not(:last-child)::after {
    content: "";
    position: absolute;
    right: 0;
    top: 20%;
    height: 60%;
    width: 1px;
    background: #ddd;
}
.bellestay-fakt__icon {
    width: 48px;
    height: 48px;
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.bellestay-fakt__icon svg {
    width: 42px;
    height: 42px;
    stroke: #1a1a1a;
    stroke-width: 1.5;
    fill: none;
}
.bellestay-fakt__label {
    font-family: "Montserrat", sans-serif;
    font-size: 11px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    color: #888;
    margin-bottom: 4px;
}
.bellestay-fakt__value {
    font-family: "Montserrat", sans-serif;
    font-size: 18px;
    font-weight: 700;
    color: #1a1a1a;
    line-height: 1.2;
}
/* Responsive: Tablet 3 Spalten */
@media (max-width: 1024px) {
    .bellestay-objektfakten {
        grid-template-columns: repeat(3, 1fr);
    }
}
/* Responsive: Mobil 2 Spalten */
@media (max-width: 600px) {
    .bellestay-objektfakten {
        grid-template-columns: repeat(2, 1fr);
    }
    .bellestay-fakt {
        padding: 22px 12px;
    }
    .bellestay-fakt__icon svg {
        width: 34px;
        height: 34px;
    }
    .bellestay-fakt__value {
        font-size: 16px;
    }
}

/* ═══════════════════════════════════════════════════════════════════════════
   Ausstattung / Merkmale (vorher inline via bellestay_ausstattung_css())
   ═══════════════════════════════════════════════════════════════════════════ */

.bellestay-ausstattung {
    display: grid;
    grid-template-columns: repeat(var(--bs-aus-cols, 3), 1fr);
    gap: 0;
    width: 100%;
}
.bellestay-merkmal {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 16px 20px;
    border-bottom: 1px solid #e8e8e8;
    transition: background .2s ease;
}
.bellestay-merkmal:hover {
    background: #fafaf8;
}
.bellestay-merkmal__icon {
    flex-shrink: 0;
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.bellestay-merkmal__icon svg {
    width: 24px;
    height: 24px;
    stroke: var(--bs-aus-color, #ccb66e);
    stroke-width: 1.8;
    fill: none;
}
.bellestay-merkmal__text {
    font-family: "Montserrat", sans-serif;
    font-size: 14px;
    font-weight: 500;
    color: #333;
    line-height: 1.3;
}
/* Responsive: Tablet 2 Spalten */
@media (max-width: 1024px) {
    .bellestay-ausstattung {
        grid-template-columns: repeat(2, 1fr);
    }
}
/* Responsive: Mobil 1 Spalte */
@media (max-width: 600px) {
    .bellestay-ausstattung {
        grid-template-columns: 1fr;
    }
    .bellestay-merkmal {
        padding: 14px 16px;
        gap: 12px;
    }
}

/* ── Reviews (Airbnb-Style) ─────────────────────────── */
.bst-reviews {
    padding: 32px 0 !important;
}

.bst-reviews__summary {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    margin-bottom: 28px !important;
}

.bst-reviews__star {
    color: var(--bst-text, #222) !important;
    width: 24px !important;
    height: 24px !important;
}

.bst-reviews__score {
    font-size: 22px !important;
    font-weight: 600 !important;
    color: var(--bst-text, #222) !important;
}

.bst-reviews__separator {
    font-size: 22px !important;
    color: var(--bst-text, #222) !important;
}

.bst-reviews__count {
    font-size: 16px !important;
    color: var(--bst-text-muted, #717171) !important;
}

/* Category bars - 2 column grid */
.bst-reviews__categories {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 16px 48px !important;
    margin-bottom: 32px !important;
    padding-bottom: 32px !important;
    border-bottom: 1px solid #ebebeb !important;
}

.bst-reviews__cat {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
}

.bst-reviews__cat-label {
    width: 120px !important;
    flex-shrink: 0 !important;
    font-size: 14px !important;
    color: var(--bst-text, #222) !important;
}

.bst-reviews__cat-bar {
    flex: 1 !important;
    height: 4px !important;
    background: #ddd !important;
    border-radius: 2px !important;
    overflow: hidden !important;
}

.bst-reviews__cat-fill {
    height: 100% !important;
    background: var(--bst-text, #222) !important;
    border-radius: 2px !important;
    transition: width 0.6s ease !important;
}

.bst-reviews__cat-value {
    width: 28px !important;
    text-align: right !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    color: var(--bst-text, #222) !important;
}

/* Review cards */
.bst-reviews__list {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 24px 48px !important;
}

.bst-review-card {
    padding: 0 0 24px !important;
}

.bst-review-card__header {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    margin-bottom: 12px !important;
}

.bst-review-card__avatar {
    width: 40px !important;
    height: 40px !important;
    border-radius: 50% !important;
    overflow: hidden !important;
    flex-shrink: 0 !important;
}

.bst-review-card__avatar svg {
    display: block !important;
}

.bst-review-card__meta {
    flex: 1 !important;
}

.bst-review-card__name {
    display: block !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    color: var(--bst-text, #222) !important;
}

.bst-review-card__date {
    display: block !important;
    font-size: 13px !important;
    color: var(--bst-text-muted, #717171) !important;
}

.bst-review-card__rating {
    display: flex !important;
    align-items: center !important;
    gap: 4px !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    color: var(--bst-text, #222) !important;
}

.bst-review-card__rating svg {
    width: 12px !important;
    height: 12px !important;
}

.bst-review-card__text {
    font-size: 15px !important;
    line-height: 1.5 !important;
    color: var(--bst-text, #222) !important;
}

.bst-review-card__more {
    background: none !important;
    border: none !important;
    font-weight: 600 !important;
    font-size: 15px !important;
    color: var(--bst-text, #222) !important;
    text-decoration: underline !important;
    cursor: pointer !important;
    padding: 0 !important;
    margin-top: 4px !important;
}

.bst-reviews__toggle {
    display: block !important;
    margin-top: 24px !important;
    padding: 12px 24px !important;
    border: 1px solid var(--bst-text, #222) !important;
    border-radius: 8px !important;
    background: transparent !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    color: var(--bst-text, #222) !important;
    cursor: pointer !important;
    transition: background 0.2s !important;
}

.bst-reviews__toggle:hover {
    background: #f7f7f7 !important;
}

.bst-review-card--hidden {
    display: none !important;
}

/* Reviews: Mobile 1 column */
@media (max-width: 768px) {
    .bst-reviews__categories {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }
    .bst-reviews__list {
        grid-template-columns: 1fr !important;
    }
}
