/* Enhance supplies identity assets only. Colors remain the original MVO palette.
 * A reseller logo has its own proportions; never squeeze it into MVO's ratio. */
@media screen {
  html.mvo-branded .mvo-brand-mark { display: inline-flex; align-items: center; justify-content: center; min-width: 0; border: 0; padding: 0; }
  html.mvo-branded .mvo-brand-name { font-size: 1.2rem; font-weight: 800; line-height: 1.25; overflow-wrap: anywhere; }
  html.mvo-branded .mvo-brand-mark img { display: block; object-fit: contain; object-position: center; }
  html.mvo-branded body:not(.task-login):not(.action-print) #layout-menu .mvo-brand { width: 100%; }
  html.mvo-branded body:not(.task-login):not(.action-print) #layout-menu .mvo-brand > a { width: 100%; max-width: 100%; min-width: 0; padding: 4px; }
  html.mvo-branded body:not(.task-login):not(.action-print) #layout-menu .mvo-brand .mvo-brand-mark { width: 100%; }
  html.mvo-branded body:not(.task-login):not(.action-print) #layout-menu .mvo-brand img { width: auto; height: auto; max-width: 100%; max-height: 44px; }
  html.mvo-branded #layout-menu .mvo-brand-name { font-size: .75rem; max-height: 3.6em; overflow: hidden; text-align: center; }

  html.mvo-branded .mvo-login-brand { max-width: 100%; }
  html.mvo-branded .mvo-login-brand > .mvo-brand-mark { border: 0; padding: 0; max-width: min(260px, 65%); }
  html.mvo-branded .mvo-login-brand .mvo-brand-image { width: auto; height: auto; max-width: 100%; max-height: 64px; }
  html.mvo-branded .mvo-access-brand-name { font-weight: 700; text-align: right; overflow-wrap: anywhere; }

  @media (max-width: 760px) {
    html.mvo-branded .mvo-mobile-brand .mvo-brand-mark,
    html.mvo-branded .mvo-mobile-brand .mvo-brand-name { border: 0; padding: 0; }
    html.mvo-branded .mvo-mobile-brand .mvo-brand-mark { max-width: min(220px, 65%); }
    html.mvo-branded .mvo-mobile-brand .mvo-brand-image { width: auto; height: auto; max-width: 100%; max-height: 56px; }
    html.mvo-branded .mvo-access-top > .mvo-access-brand-name { display: block; }
  }
  @media (max-width: 1024px) and (min-width: 481px) {
    html.mvo-branded body:not(.task-login):not(.action-print) #layout-menu > .popover-header { padding-left: 4px; padding-right: 4px; }
    html.mvo-branded #layout-menu .mvo-brand-name { font-size: .6rem; }
  }
  @media (max-width: 480px) {
    html.mvo-branded body:not(.task-login):not(.action-print) #layout-menu .mvo-brand { width: auto; max-width: calc(100% - 56px); }
    html.mvo-branded body:not(.task-login):not(.action-print) #layout-menu .mvo-brand img { max-width: 180px; }
    html.mvo-branded #layout-menu .mvo-brand-name { font-size: 1rem; text-align: left; }
  }
}