/* Home header status dashboard (2026-05-23)
   Loaded after the current home repair layers. */

body.home-page .hm-header-dashboard {
  display: none;
}

body.home-page .hm-header-dashboard__item {
  min-width: 0;
  color: inherit;
  text-decoration: none;
}

body.home-page .hm-header-dashboard__label,
body.home-page .hm-header-dashboard__value {
  display: inline;
}

@media (min-width: 901px) {
  body.home-page .site-header .nav {
    min-width: 0;
  }

  body.home-page .site-header.is-scrolled .nav-list {
    display: none !important;
  }

  body.home-page .site-header.is-scrolled .hm-header-dashboard {
    display: flex;
    flex: 1 1 auto;
    align-items: center;
    justify-content: center;
    gap: clamp(16px, 2vw, 30px);
    min-width: 0;
    margin: 0 clamp(16px, 2vw, 28px);
    color: var(--text);
    font-family: var(--font-body, var(--font-base));
    font-size: clamp(12px, 1vw, 14px);
    font-weight: 760;
    line-height: 1;
    letter-spacing: 0;
    white-space: nowrap;
  }

  body.home-page .hm-header-dashboard__item {
    position: relative;
    display: inline-flex;
    align-items: baseline;
    gap: 5px;
    min-height: 36px;
    padding: 12px 0;
    transition: color 0.18s var(--ease), opacity 0.18s var(--ease);
  }

  body.home-page .hm-header-dashboard__item + .hm-header-dashboard__item::before {
    content: "/";
    position: absolute;
    left: calc(clamp(16px, 2vw, 30px) * -0.65);
    color: color-mix(in srgb, var(--text) 28%, transparent);
    font-weight: 520;
  }

  body.home-page .hm-header-dashboard__label {
    color: color-mix(in srgb, var(--text) 54%, transparent);
    font-weight: 820;
  }

  body.home-page .hm-header-dashboard__label::after {
    content: ":";
  }

  body.home-page .hm-header-dashboard__value {
    color: var(--text);
    font-weight: 800;
  }

  body.home-page .hm-header-dashboard__item:hover,
  body.home-page .hm-header-dashboard__item:focus-visible {
    color: var(--accent);
  }

  body.home-page .hm-header-dashboard__item:hover .hm-header-dashboard__label,
  body.home-page .hm-header-dashboard__item:focus-visible .hm-header-dashboard__label,
  body.home-page .hm-header-dashboard__item:hover .hm-header-dashboard__value,
  body.home-page .hm-header-dashboard__item:focus-visible .hm-header-dashboard__value {
    color: var(--accent);
  }
}

@media (max-width: 900px) {
  body.home-page .site-header.is-scrolled .header-brand {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }

  body.home-page .site-header.is-scrolled .hm-header-dashboard {
    display: none !important;
  }
}