/* =====================================================================
   Herzbraut – Ergänzungen (Stand 2026-09)
   Logo, Suchergebnisse, Kleider-Übersicht (Etappen-Laden), Terminformular
   ===================================================================== */

/* ---------- Logo: PNG statt 650-KB-Inline-SVG, gleiche Größe wie zuvor ---------- */
.mainNavContainerDesktop .mainNavLogo a img.hbLogo {
    height: 54%;            /* Grafik nahm im alten SVG ~54 % der Boxhöhe ein */
    width: auto;
    max-width: 100%;
    margin: auto;
    display: block;
    transition: .5s ease-in-out;
}
/* Startseite ohne Scroll: Logo weiß (wie vorher per fill:white) */
body.page-id-2 #myHeader:not(.sticky) .mainNavLogo a img.hbLogo {
    filter: brightness(0) invert(1);
}
#myHeader.sticky .mainNavLogo img.hbLogo { max-width: 200px; }
/* Mobile-Logo und Preloader: width/height-Attribute gesetzt (CLS), Höhe muss mitskalieren */
.mobileNavColLogo img, .preload img { height: auto; }

/* ---------- Suche ---------- */
#myHeader #overlaySearch form.site-search { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; width: 90%; max-width: 900px; gap: 1rem; }
#myHeader #overlaySearch input#searchInput { flex: 1 1 320px; }
#myHeader #overlaySearch input#searchInput::placeholder { color: rgba(255,255,255,.55); font-weight: 300; }
.hbSearchHint { width: 100%; text-align: center; color: rgba(255,255,255,.7); font-family: "Mulish", sans-serif; font-size: .85rem; letter-spacing: .05rem; margin-top: .5rem; }

.site-content-search h1 { margin-bottom: .5rem; }
.hbSearchSummary { font-family: "Mulish", sans-serif; color: #555; margin-bottom: 2.5rem; }
.hbSearchSummary a { color: #1b3f3a; }
.hbSearchGroup { margin-bottom: 4rem; }
.hbSearchGroup h2 { font-size: 1.35rem; margin: 0 0 1.5rem; padding-bottom: .5rem; border-bottom: 1px solid #e6dfd9; display: flex; align-items: baseline; gap: .75rem; }
.hbSearchGroup h2 .hbCount { font-family: "Mulish", sans-serif; font-size: .8rem; letter-spacing: .1rem; color: #8d6641; text-transform: uppercase; }
.hbCardGrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 1.5rem; }
.hbCard { position: relative; background: #fff; display: flex; flex-direction: column; }
.hbCard .hbCardImg { position: relative; overflow: hidden; aspect-ratio: 550 / 800; background: #f0ece9; }
.hbCard .hbCardImg img { width: 100%; height: 100%; object-fit: cover; display: block; transition: opacity 1s ease-in-out; }
.hbCard .hbCardImg img.hbCardImgAlt { position: absolute; inset: 0; opacity: 0; }
.hbCard:hover .hbCardImg img.hbCardImgAlt { opacity: 1; }
.hbCard .hbCardImg .hbCardNoImg { display: flex; align-items: center; justify-content: center; height: 100%; color: #ad9989; font-family: "Playfair Display", serif; font-size: 2.5rem; }
.hbCard .heartIcon { position: absolute; top: 1rem; right: 1rem; color: #fff; font-size: 1.5rem; z-index: 2; cursor: pointer; text-shadow: 0 1px 4px rgba(0,0,0,.35); }
.hbCard .hbCardBody { padding: 1rem .25rem 0; text-align: center; }
.hbCard .hbCardBody h3 { font-size: 1.05rem; text-transform: uppercase; margin: 0 0 .35rem; line-height: 1.3; }
.hbCard .hbCardBody h3 a { color: #000; text-decoration: none; }
.hbCard .hbCardMeta { font-family: "Mulish", sans-serif; font-size: .8rem; color: #666; margin: 0 0 .75rem; line-height: 1.5; }
.hbCard .hbCardMeta mark { background: #e9f5f3; color: #153f3a; padding: 0 .2rem; }
.hbCard .hbCardBody p.hbCardText { font-family: "Mulish", sans-serif; font-size: .85rem; color: #444; margin: 0 0 .75rem; }
.hbCard .btn.hbBtnSmall { line-height: 1.2; padding: .7rem 1.1rem; font-size: .7rem; margin: 0 0 1rem; display: inline-block; }
.hbCard .btn.hbBtnOutline { background: transparent; border: 1px solid #000; }
.hbSearchNone { background: #f0ece9; padding: 2rem; font-family: "Mulish", sans-serif; }
.hbSearchNone ul { margin: .5rem 0 0 1.2rem; }
.hbSearchNone a { color: #1b3f3a; }
.hbSearchTerms { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1rem; }
.hbSearchTerms a { font-family: "Mulish", sans-serif; font-size: .75rem; letter-spacing: .08rem; text-transform: uppercase; text-decoration: none; border: 1px solid #89ccc5; color: #153f3a; padding: .4rem .8rem; }
.hbSearchTerms a:hover { background: #89ccc5; }

/* ---------- Kleider-Detailseite ---------- */
.hbDetail .hbRelated { margin-top: 3rem; }
/* Globale Regel "h1 { display: none }" im Bestand – die Kleider-Überschrift muss sichtbar bleiben,
   sonst fällt der Kopfbereich zusammen und die Buttons überlagern die Optionen */
.hbDetail .container-header h1.heading { display: block; margin-top: 0; margin-bottom: 0; text-transform: uppercase; }
.hbDetailFallback h1, main.site-main > .row h1, .site-content-search h1 { display: block; }
.hbDetail .hbRelated h2 { text-transform: uppercase; }
.hbDetailFallback img.card-img { width: 100%; height: auto; margin-bottom: 1rem; }
.hbDetailFallback h1 { margin-top: 0; }


/* ---------- Kategorie-Seiten (taxonomy.php): Kartenlayout wie auf den Übersichten (dort an page-id gebunden) ---------- */
body.hbCollectionTax .site-content .col-md-4 { display: flex; position: relative; overflow: hidden; transition: .5s ease-in-out; max-height: 525px; margin-bottom: 1.5rem; justify-content: center; }
@media screen and (min-width: 656px) { body.hbCollectionTax .site-content .col-md-4 { justify-content: flex-start; } }
body.hbCollectionTax .site-content .col-md-4 .weddingdressContent { position: absolute; bottom: -21.5%; transform: translateY(21.5%); left: 0; text-align: center; width: 100%; background: rgba(255,255,255,.5); transition: .75s ease-in-out; z-index: 2; }
body.hbCollectionTax .site-content .col-md-4 .weddingdressContent h2 { margin-bottom: 5rem; margin-top: 1.5rem; transition: .5s ease-in-out; }
body.hbCollectionTax .site-content .col-md-4 .weddingdressContent p { margin-top: 1rem; transition: .5s ease-in-out; }
body.hbCollectionTax .site-content .col-md-4 .weddingdressContent .btn { margin-bottom: 1.5rem; transition: .5s ease-in-out; line-height: 25px; }
body.hbCollectionTax .site-content .col-md-4 .weddingdressImage { overflow: hidden; position: relative; }
body.hbCollectionTax .site-content .col-md-4 .weddingdressImage img { transition: 1.25s ease-in-out; width: 100%; height: 100%; }
body.hbCollectionTax .site-content .col-md-4 .weddingdressImage img.secondWeddingDressImage { position: absolute; left: 0; opacity: 0; top: 0; }
body.hbCollectionTax .site-content .col-md-4:hover { cursor: pointer; }
body.hbCollectionTax .site-content .col-md-4:hover .weddingdressContent { bottom: -3%; transform: translateY(3%); }
body.hbCollectionTax .site-content .col-md-4:hover .weddingdressContent h2 { margin-bottom: 1rem; }
body.hbCollectionTax .site-content .col-md-4:hover .weddingdressImage img:not(.secondWeddingDressImage) { opacity: 0; }
body.hbCollectionTax .site-content .col-md-4:hover .weddingdressImage img.secondWeddingDressImage { opacity: 1; }
body.hbCollectionTax .site-content .col-md-4 div.fade { position: relative; max-width: 100%; }
body.hbCollectionTax .site-content .noFilterCol { display: flex; justify-content: center; }
body.hbCollectionTax .site-content .noFilterCol .noFilterContentContainer { max-width: 950px; background: #bee3df; padding: 1rem 2rem; }

/* ---------- Kleider-Übersicht: Etappen-Laden ---------- */
.hbDressStatus { text-align: center; font-family: "Mulish", sans-serif; color: #666; margin: 0 0 1.5rem; min-height: 1.5rem; }
.hbDressMore { text-align: center; margin: 1rem 0 4rem; }
.hbDressMore .btn[disabled] { opacity: .5; cursor: default; }
.hbDressMore .btn.hbLoading::after { content: " …"; }
[data-hb-dresses] .weddingdress.hbHidden { display: none; }
[data-hb-dresses] .weddingdressImage img { aspect-ratio: 550 / 800; object-fit: cover; }
[data-hb-dresses].hbBusy { opacity: .6; transition: opacity .2s; }
.hbFilterSummary { text-align: center; font-family: "Mulish", sans-serif; font-size: .85rem; color: #666; margin: -1rem 0 2rem; }

/* Terminformular: siehe customCSS/hb-termin.css (nur auf der Terminseite geladen) */
