/* ============================================================================
   fewo-info.de · Modern Look & Feel 2026 — Detailseite
   Ergänzt fewoinfo-2026-modern.css
   ============================================================================ */
:root{--c-green-700:#4a9e22;}

/* ---------- Filter-Sidebar (wie Suchseite) ---------- */
.searchfilter{background:#fff!important;border:1px solid var(--c-line)!important;border-radius:14px!important;box-shadow:var(--sh)!important;overflow:hidden!important;}
.searchfilter > header{display:block!important;width:100%!important;background:var(--c-blue)!important;background-image:none!important;color:#fff!important;margin:0!important;padding:12px 18px!important;border:0!important;border-radius:0!important;transform:none!important;box-shadow:none!important;min-height:0!important;height:auto!important;}
.searchfilter > header h4{color:#fff!important;margin:0!important;font-weight:700!important;font-size:15px!important;}
.searchfilter > .articlebody{border:0!important;box-shadow:none!important;border-radius:0!important;background:transparent!important;padding:18px!important;}
.searchfilter h3{font-size:14px;font-weight:700;color:var(--c-ink);margin:0 0 10px;}
.btn-numberbox{border:1px solid var(--c-line-2)!important;background:#fff!important;color:var(--c-ink)!important;border-radius:8px!important;min-width:40px;font-weight:700;}
.btn-numberbox.active{background:var(--c-blue)!important;border-color:var(--c-blue)!important;color:#fff!important;}
.btn-checkbox{border:1px solid var(--c-line-2)!important;background:#fff!important;border-radius:6px!important;color:#fff!important;}
.btn-checkbox.active{background:var(--c-green)!important;border-color:var(--c-green)!important;}
.btn-checkbox .fa-check{color:#fff;}
.list-checkbox li{color:var(--c-ink);font-size:14px;margin-bottom:6px;}
.slider-selection{background:var(--c-green)!important;background-image:none!important;}
.slider-handle{background:#fff!important;background-image:none!important;border:2px solid var(--c-green-600);box-shadow:var(--sh);}
.slider-track{box-shadow:none!important;}
#preiswocheVal{color:var(--c-blue);font-weight:700;}

/* ---------- Galerie / Carousel: saubere Karte + gerundetes Bild + Thumbs ---------- */
/* Die GANZE Galerie-Sektion ist die moderne Karte (vorher: alter Schatten, kein Radius). */
#detailFotos{background:#fff!important;border:1px solid var(--c-line)!important;border-radius:var(--r)!important;box-shadow:var(--sh)!important;padding:16px!important;min-height:0!important;}
#detailFotos.fullheight{min-height:0!important;}
/* Titel steht bereits in der Datenbox rechts -> Overlay-Ribbon ausblenden
   (das war der "Verlauf von oben", der über die Karte hinausschoss). */
#detailFotos .articlebox--ribbon{display:none!important;}
#detailFotos #carousel-custom{background:transparent!important;box-shadow:none!important;border-radius:0!important;overflow:visible!important;}
/* Bildbereich = gerundetes Bild, KEIN eigener Schatten (sitzt schon in der Karte). */
#detailFotos .carousel-outer{position:relative;border-radius:11px;overflow:hidden;box-shadow:none;background:#0c141c;}
/* WICHTIG: Bildgröße NICHT überschreiben – das Original steuert sie via myresize(). */
#detailFotos .carousel-inner .item img{max-width:100%!important;}
/* Pfeile: runder (44x44), kontrastreicher Kreis – war eiförmig (44x42) & weiß auf weiß */
#detailFotos .carousel-control{background:none!important;width:auto!important;text-shadow:none!important;opacity:1;}
#detailFotos .carousel-control .fa{width:44px!important;height:44px!important;line-height:44px!important;font-size:22px!important;text-align:center!important;display:inline-block!important;background:rgba(15,23,30,.5)!important;color:#fff!important;border-radius:50%!important;box-shadow:0 2px 8px rgba(0,0,0,.3)!important;transition:background .2s;}
#detailFotos .carousel-control:hover .fa{background:rgba(15,23,30,.75)!important;}
/* Thumbnails liegen UNTER dem Bild auf dem Seitenhintergrund – kein schwarzer Kasten */
#detailFotos .carousel-indicators{position:static!important;margin:12px 0 0!important;display:flex;flex-wrap:wrap;gap:8px;width:auto!important;left:auto!important;transform:none!important;background:transparent!important;}
#detailFotos .carousel-indicators li{width:auto!important;height:auto!important;margin:0!important;border:0!important;text-indent:0!important;border-radius:8px;overflow:hidden;opacity:.6;transition:opacity .2s;background:none!important;}
#detailFotos .carousel-indicators li img{display:block;border-radius:8px;}
#detailFotos .carousel-indicators li.active{opacity:1;outline:2px solid var(--c-blue);outline-offset:-2px;}

/* ---------- Objekt-Datenbox ---------- */
#detailData{background:var(--c-surface)!important;border:1px solid var(--c-line)!important;border-radius:var(--r)!important;box-shadow:var(--sh)!important;padding:22px 24px!important;}
#detailData h2{font-size:20px!important;font-weight:800!important;color:var(--c-ink)!important;margin:0 0 4px!important;}
#detailData h4 a{color:var(--c-blue)!important;font-weight:600;}
#detailData h3{font-size:15px!important;font-weight:700!important;margin:14px 0 8px!important;color:var(--c-ink)!important;}
#detailData .list-unstyled.data li{display:flex;justify-content:space-between;align-items:center;padding:9px 0;border-bottom:1px solid var(--c-line);}
#detailData .list-unstyled.data li label{color:var(--c-muted);font-weight:500;margin:0;}
#detailData .list-unstyled.data li .numbers{color:var(--c-ink)!important;font-weight:700;}
#detailData .btn-fewogreen{width:100%;}

/* Galerie + Datenbox: keine gleiche Min-Höhe (erzeugt Leerraum in der Datenbox) */
#detailFotos.fullheight,#detailData.fullheight{min-height:0!important;height:auto!important;}
@media (min-width:992px){
  .ajaxinhalt > .row:first-child{display:flex!important;flex-wrap:wrap;align-items:flex-start!important;}
  .ajaxinhalt > .row:first-child > .fotos,.ajaxinhalt > .row:first-child > .details{float:none!important;}
  #detailData{position:sticky!important;top:16px;align-self:flex-start;}
}

/* Schwebende Buchungsleiste, wenn die Datenbox aus dem Sichtfeld scrollt */
#detailBookingBar{position:fixed;left:0;right:0;bottom:0;z-index:1040;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 16px;background:rgba(255,255,255,.97);border-top:1px solid var(--c-line);box-shadow:0 -8px 28px rgba(16,24,40,.12);transform:translateY(110%);transition:transform .25s ease;pointer-events:none;}
#detailBookingBar.is-visible{transform:translateY(0);pointer-events:auto;}
#detailBookingBar .detail-booking-bar__info{min-width:0;flex:1 1 auto;}
#detailBookingBar .detail-booking-bar__title{display:block;font-size:14px;font-weight:800;color:var(--c-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
#detailBookingBar .detail-booking-bar__location{display:block;font-size:12px;color:var(--c-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
#detailBookingBar .btn-fewogreen{flex:0 0 auto;white-space:nowrap;padding:12px 22px;font-size:15px;}
@media (min-width:768px){
  #detailBookingBar{padding:14px 24px;}
  #detailBookingBar .detail-booking-bar__title{font-size:15px;}
}

/* ---------- Tabs → ruhige Underline-Tabs ---------- */
.nav-tabs.nav-justified,.nav-tabs{border-bottom:1px solid var(--c-line-2)!important;background:transparent!important;}
.nav-tabs>li>a,.nav-tabs.nav-justified>li>a{background:transparent!important;background-image:none!important;border:0!important;border-bottom:2px solid transparent!important;border-radius:0!important;color:var(--c-muted)!important;font-weight:700;margin:0!important;padding:14px 8px!important;transition:color var(--t),border-color var(--t);}
.nav-tabs>li>a:hover{color:var(--c-blue)!important;border-bottom-color:var(--c-line-2)!important;background:transparent!important;}
.nav-tabs>li.active>a,.nav-tabs>li.active>a:hover,.nav-tabs>li.active>a:focus,.nav-tabs.nav-justified>li.active>a{color:var(--c-blue)!important;background:transparent!important;border:0!important;border-bottom:2px solid var(--c-green)!important;}
.tab-content{background:var(--c-surface);border:1px solid var(--c-line);border-top:0;border-radius:0 0 var(--r) var(--r);padding:24px 26px;}
.tab-content h3{font-weight:700;color:var(--c-ink);}
.fewoDesc b{display:block;margin:16px 0 4px;color:var(--c-ink);font-size:15px;}
.fewoDesc p{color:var(--c-muted);margin:0 0 4px;}
.tab-content .table-striped>tbody>tr:nth-child(odd)>td{background:#f6f8fb;}
.tab-content .table>tbody>tr>td{border-color:var(--c-line)!important;padding:9px 12px;color:var(--c-ink);}