/* One bounded identity component for all logo aspect ratios and layouts. */
.brand-identity {
    display: inline-flex !important;
    align-items: center;
    gap: 10px;
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    vertical-align: middle;
    text-align: left;
    line-height: 1.2;
}
.brand-identity .bi-mark {
    display: block;
    flex: 0 1 var(--bi-width, 58px);
    width: var(--bi-width, 58px);
    max-width: 100%;
    min-width: 0;
    height: var(--bi-height, 58px);
    overflow: hidden;
}
.brand-identity .bi-mark picture { display: block; width: 100%; height: 100%; }
.brand-identity .bi-image {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    min-width: 0 !important;
    object-fit: contain !important;
    object-position: center;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
}
.brand-identity .bi-copy { display: block; min-width: 0; overflow: hidden; }
.brand-identity .bi-name {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    overflow-wrap: anywhere;
    font-size: 22px;
    font-weight: 750;
    letter-spacing: -.6px;
    line-height: 1.2;
}
.brand-identity .bi-caption { display: block; font-size: 9px; font-weight: 500; letter-spacing: .12em; margin-top: 5px; }
.brand-identity[data-brand-mode="stacked"] { flex-direction: column; gap: 6px; align-items: center; text-align: center; }
.brand-identity[data-brand-mode="stacked"] .bi-mark { flex-basis: auto; flex-shrink: 0; }
.brand-identity[data-brand-mode="logo_only"] .bi-copy,
.brand-identity[data-brand-mode="text_only"] .bi-mark { display: none; }
.brand-identity[data-brand-context="mobile"] .bi-name { font-size: 18px; }
.brand-identity[data-brand-context="dashboard"] .bi-name { font-size: 18px; }
.brand-identity[data-brand-context="footer"] .bi-name { font-size: 23px; }
.store-logo:has(.brand-identity) { min-width: 0; max-width: 34%; }
.mobile-menu-brand:has(.brand-identity) { display: block; overflow: hidden; }
.footer-brand-identity:has(.brand-identity) { max-width: 100%; }
.panel-nav-brand-link:has(.brand-identity) { min-width: 0; overflow: hidden; }
.panel-mobile-brand:has(.brand-identity) { min-width: 0; overflow: hidden; }
@media (max-width: 767px) {
    .brand-identity.bi-responsive { --bi-width: var(--bi-mobile-width) !important; --bi-height: var(--bi-mobile-height) !important; }
    .brand-identity.bi-responsive .bi-name { font-size: 18px; }
    .store-logo:has(.brand-identity) { max-width: 100%; }
    .store-header-main:has(.brand-identity[data-brand-mode="stacked"]) { padding-top: 12px; padding-bottom: 12px; }
}

.brand-identity .bi-name { white-space: normal; }
.panel-nav-brand:has(.brand-identity) { flex-shrink: 0; }
.panel-toolbar .brand-identity .bi-mark { height: min(var(--bi-height), 40px); }
.panel-toolbar .brand-identity .bi-caption { display: none; }
.panel-toolbar .brand-identity[data-brand-mode="stacked"] { gap: 3px; }
.panel-toolbar .brand-identity[data-brand-mode="stacked"] .bi-mark { height: 24px; width: min(var(--bi-width), 100px); }
.panel-toolbar .brand-identity[data-brand-mode="stacked"] .bi-name { font-size: 12px; -webkit-line-clamp: 1; }

@media (min-width: 768px) {
    .store-header .store-logo:has(.brand-identity[data-brand-mode="horizontal"]) { width: 200px; flex-basis: 200px; }
}
