/* Header logo slot — ONE logical brand mark. Light/Dark/Sticky are alternatives for the same slot, never siblings side-by-side. Must load from (not @push after @stack('styles')). */ .ag-dh-header > .ag-dh-wrap > .ag-dh-logo, .ag-dh-header-main > .ag-dh-logo[data-header-logo] { position: relative; } .ag-dh-logo-picture, .ag-dh-logo-img { display: block; width: auto; height: auto; max-width: var(--ag-sf-logo-max-width, 134px); max-height: var(--ag-sf-logo-height, 30px); object-fit: contain; } @media (max-width: 767px) { .ag-dh-logo-img { max-width: min(var(--ag-sf-logo-max-width, 134px), 120px); max-height: min(var(--ag-sf-logo-height, 30px), 28px); } } /* Default: light slot visible; dark + sticky alternatives hidden */ .ag-dh-logo-picture--dark, .ag-dh-logo-img--sticky { display: none !important; } html.ag-theme-dark .ag-dh-logo-picture--light { display: none !important; } html.ag-theme-dark .ag-dh-logo-picture--dark { display: block !important; } /* Sticky replaces the active theme picture — never beside it */ .ag-dh-logo.is-scrolled[data-logo-sticky-swap] .ag-dh-logo-picture { display: none !important; } .ag-dh-logo.is-scrolled[data-logo-sticky-swap] .ag-dh-logo-img--sticky { display: block !important; } @media (max-width: 767px) { .ag-dh-logo[style*="--ag-logo-rw"] { max-width: var(--ag-logo-rw) !important; } .ag-dh-logo[style*="--ag-logo-rh"] { max-height: var(--ag-logo-rh) !important; } }