/* Shared FrankenSPO documentation header. Preserve compact logos at any viewport width. */
:root { --bs-link-color-rgb: 166, 106, 255; }
header .navbar-brand img, header nav img, .navbar-brand img, .navbar-brand .logo { width: 32px !important; height: 32px !important; max-width: 32px !important; max-height: 32px !important; object-fit: contain; flex-shrink: 0; }
header .navbar-brand, header nav .navbar-brand { display: inline-flex; align-items: center; gap: .6rem; }
header .navbar-brand .name, header .navbar-brand span { overflow-wrap: normal; }

/* Accessible Sferix Family dropdown, next to DocFX theme switch. */
.sferix-family-nav { position: relative; align-self: center; margin-inline: .5rem; font-size: .875rem; flex-shrink: 0; z-index: 1050; }
.sferix-family-nav > summary { cursor: pointer; list-style: none; display: flex; align-items: center; gap: .45rem; padding: .45rem .65rem; border-radius: .5rem; color: var(--bs-body-color); white-space: nowrap; user-select: none; }
.sferix-family-nav > summary::-webkit-details-marker { display: none; }
.sferix-family-nav > summary:hover, .sferix-family-nav[open] > summary { background: var(--bs-tertiary-bg); }
.sferix-family-nav > summary:focus-visible { outline: 2px solid var(--bs-primary); outline-offset: 2px; }
.sferix-chevron { opacity: .65; font-size: .75rem; }
.sferix-family-menu { position: absolute; top: calc(100% + .5rem); right: 0; width: min(330px, 90vw); padding: .4rem; border-radius: .7rem; border: 1px solid var(--bs-border-color); background: var(--bs-body-bg); box-shadow: 0 10px 32px rgba(0,0,0,.18); }
.sferix-family-item { display: flex; align-items: center; gap: .8rem; text-decoration: none; color: var(--bs-body-color); padding: .65rem .7rem; border-radius: .45rem; line-height: 1.3; }
.sferix-family-item:hover, .sferix-family-item:focus-visible { background: var(--bs-tertiary-bg); color: var(--bs-body-color); }
.sferix-family-item img { width: 24px !important; height: 24px !important; max-width: 24px !important; max-height: 24px !important; flex-shrink: 0; object-fit: contain; }
@media (max-width: 700px) { .sferix-family-nav { margin-inline: .15rem; } .sferix-family-nav > summary { padding-inline: .3rem; } }