/* Logo choice follows the active appearance, including visitor/admin theme changes. */
[data-store-brand] { --brand-logo-width:180px; --brand-logo-height:40px; display:inline-flex; align-items:center; min-width:0; max-width:100%; vertical-align:middle; }
[data-store-brand][data-brand-has-logo="true"] { max-width:min(var(--brand-logo-width), 100%); }
[data-store-brand] > .store-brand-fallback { display:inline-flex; align-items:center; min-width:0; max-width:100%; white-space:nowrap; }
[data-store-brand] .store-brand-name { min-width:0; overflow:hidden; text-overflow:ellipsis; }
[data-store-brand] .brand-mark { flex-shrink:0; }
[data-store-brand] > .store-brand-logo { display:none; width:auto; height:auto; min-width:0; max-width:100%; max-height:var(--brand-logo-height); object-fit:contain; object-position:left center; }
[data-store-brand][data-brand-has-logo="true"] > [data-brand-fallback] { display:none; }
[data-store-brand][data-brand-has-logo="true"] > [data-brand-logo="light"] { display:block; }
body[data-color="dark"] [data-store-brand][data-brand-has-logo="true"] > [data-brand-logo="light"] { display:none; }
body[data-color="dark"] [data-store-brand][data-brand-has-logo="true"] > [data-brand-logo="dark"] { display:block; }
.admin-wordmark [data-brand-fallback] { gap:10px; }
@media(max-width:760px) {
  [data-store-brand] { --brand-logo-width:132px; --brand-logo-height:32px; }
}
body.admin-ui [data-store-brand] { --brand-logo-width:160px; --brand-logo-height:36px; }
/* The admin preference is known in <head>, before its body attribute is synced. */
html[data-admin-color="light"] body.admin-ui [data-store-brand][data-brand-has-logo="true"] > [data-brand-logo="light"],
html[data-admin-color="dark"] body.admin-ui [data-store-brand][data-brand-has-logo="true"] > [data-brand-logo="dark"] { display:block; }
html[data-admin-color="light"] body.admin-ui [data-store-brand][data-brand-has-logo="true"] > [data-brand-logo="dark"],
html[data-admin-color="dark"] body.admin-ui [data-store-brand][data-brand-has-logo="true"] > [data-brand-logo="light"] { display:none; }
