/**
 * @file
 * HABD personal profile. Library beauty/habd.profile.personal, theme group,
 * weight 44. Only what differs from the kit (css/habd/habd-profile.css).
 *
 * THE BREAKOUT. User pages carry legacy padding for the old absolute header:
 * style.css:18825 (180px 20px 100px on path-user), custom.css:4385 (140px
 * on phones), and the dashboard's cream panel (custom.css:3792, 3893,
 * 4432). The legacy profile cancelled them only through its own .bp-revamp
 * :has() rules. These cancel them wherever this article is on the page, so
 * login, register, password and edit pages keep their padding.
 */
:is(body.path-user, body.path-dashboard) .js-quickedit-main-content:has(article.habd-profile--personal) {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
:is(body.path-user, body.path-dashboard) .js-quickedit-main-content:has(article.habd-profile--personal) > .row {
  margin-right: 0 !important;
  margin-left: 0 !important;
}
:is(body.path-user, body.path-dashboard) .js-quickedit-main-content:has(article.habd-profile--personal) > .row > section,
:is(body.path-user, body.path-dashboard) .js-quickedit-main-content:has(article.habd-profile--personal) .region.region-content,
:is(body.path-user, body.path-dashboard) .js-quickedit-main-content:has(article.habd-profile--personal) .region.region-highlighted {
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  background: none !important;
}
/* Tabs and messages above the hero keep a gutter. */
:is(body.path-user, body.path-dashboard) .js-quickedit-main-content:has(article.habd-profile--personal) :is(#block-beauty-local-tasks, .region-highlighted > *) {
  padding: 12px var(--habd-gutter) !important;
}

/* A portrait is larger than a business logo. */
.habd-profile--personal .habd-hero-profile__logo {
  width: 148px;
  height: 148px;
}
@media (max-width: 1024px) {
  .habd-profile--personal .habd-hero-profile__logo {
    width: 112px;
    height: 112px;
  }
}
@media (max-width: 640px) {
  .habd-profile--personal .habd-hero-profile__logo {
    width: 88px;
    height: 88px;
  }
}

/* A member's first work photo is often a graphic with text in it, so the
   background sits further back than a salon photo (brief 1.3: 40-62%). */
.habd.habd .habd-profile--personal .habd-hero-profile__media img,
.habd-profile--personal .habd.habd .habd-hero-profile__media img {
  opacity: 0.4;
}
@media (max-width: 640px) {
  .habd.habd .habd-profile--personal .habd-hero-profile__media img,
  .habd-profile--personal .habd.habd .habd-hero-profile__media img {
    opacity: 0.16;
  }
}