/* Custom Header Logo Wrapper */
.custom-header-logo-wrapper {
    display: inline-block;
    vertical-align: middle;
}

.custom-header-logo-wrapper .custom-logo-link {
    display: inline-block;
    text-decoration: none;
    line-height: 1;
}

.custom-header-logo-wrapper .logo-img {
    height: var(--custom-logo-height, auto);
    width: auto;
    max-width: 100%;
    display: block;
    transition: opacity 0.2s ease-in-out, transform 0.2s ease-in-out;
}

/* Responsive logo height for mobile (under 768px) */
@media (max-width: 767px) {
    .custom-header-logo-wrapper .logo-img {
        height: var(--custom-logo-height-mobile, auto);
    }
}

/* Normal state: Show normal logo, hide transparent logo */
.custom-header-logo-wrapper .logo-normal {
    display: block;
}
.custom-header-logo-wrapper .logo-transparent {
    display: none;
}

/* Transparent Header Active (Desktop and Mobile) */
.transparent-header .custom-header-logo-wrapper .logo-normal,
.mobile-transparent-header .custom-header-logo-wrapper .logo-normal {
    display: none;
}
.transparent-header .custom-header-logo-wrapper .logo-transparent,
.mobile-transparent-header .custom-header-logo-wrapper .logo-transparent {
    display: block;
}

/* Sticky Header Override: When scrolled/fixed, we want the Normal logo (solid background) */
.transparent-header .kadence-sticky-header.item-is-fixed:not(.item-at-start) .custom-header-logo-wrapper .logo-normal,
.mobile-transparent-header .kadence-sticky-header.item-is-fixed:not(.item-at-start) .custom-header-logo-wrapper .logo-normal,
.transparent-header .item-is-fixed:not(.item-at-start) .custom-header-logo-wrapper .logo-normal,
.mobile-transparent-header .item-is-fixed:not(.item-at-start) .custom-header-logo-wrapper .logo-normal,
.item-is-fixed:not(.item-at-start) .custom-header-logo-wrapper .logo-normal {
    display: block !important;
}

.transparent-header .kadence-sticky-header.item-is-fixed:not(.item-at-start) .custom-header-logo-wrapper .logo-transparent,
.mobile-transparent-header .kadence-sticky-header.item-is-fixed:not(.item-at-start) .custom-header-logo-wrapper .logo-transparent,
.transparent-header .item-is-fixed:not(.item-at-start) .custom-header-logo-wrapper .logo-transparent,
.mobile-transparent-header .item-is-fixed:not(.item-at-start) .custom-header-logo-wrapper .logo-transparent,
.item-is-fixed:not(.item-at-start) .custom-header-logo-wrapper .logo-transparent {
    display: none !important;
}