/* CompanyMove's slate motif belongs to the platform shell. Client-facing pages
   keep their production company's identity and never receive these accents. */
body[data-platform-brand="true"] {
  --companymove-stripe: url("/assets/companymove-stripe.svg");
  --companymove-lime: #c5f45b;
}

.slate-loading-mark {
  display: none;
}

/* Use the existing delayed, request-counted indicator. Fixed positioning keeps
   it visible above dialogs without shifting content or suggesting a percent. */
body[data-platform-brand="true"] #loading {
  top: 50%;
  left: 50%;
  right: auto;
  width: clamp(112px, 20vw, 168px);
  height: auto;
  aspect-ratio: 784 / 76;
  transform: translate(-50%, -50%);
  overflow: visible;
  background: transparent;
}

body[data-platform-brand="true"] #loading::after {
  content: none;
}

body[data-platform-brand="true"] #loading .slate-loading-mark {
  display: block;
  width: 100%;
  height: 100%;
  filter: drop-shadow(0 1px 2px #0008);
}

body[data-platform-brand="true"]
  :where(
    #app > .page-heading > div:first-child,
    .crew-call-header .page-heading > div:first-child,
    .login-form,
    dialog .modal-head > h2,
    dialog > .section-heading > h2
  )::before {
  content: "";
  display: block;
  width: 62px;
  height: 6px;
  margin-bottom: 16px;
  background: var(--companymove-lime);
  -webkit-mask: var(--companymove-stripe) center / contain no-repeat;
  mask: var(--companymove-stripe) center / contain no-repeat;
  pointer-events: none;
}

body[data-platform-brand="true"]
  dialog
  :is(.modal-head, .section-heading)
  > h2::before {
  width: 44px;
  height: 5px;
  margin-bottom: 12px;
}

body[data-platform-brand="true"]
  :is(
    .dashboard-projects > .section-heading > h2,
    .my-work > .sheet-section-title > h2
  )::before {
  content: "";
  display: inline-block;
  flex: 0 0 33px;
  width: 33px;
  height: 4px;
  margin: 0 12px 3px 0;
  background: var(--companymove-lime);
  -webkit-mask: var(--companymove-stripe) center / contain no-repeat;
  mask: var(--companymove-stripe) center / contain no-repeat;
  pointer-events: none;
}

@media print {
  body[data-platform-brand="true"]
    :is(
      .page-heading > div:first-child,
      .section-heading > h2,
      .modal-head > h2,
      .login-form,
      .empty
    )::before {
    display: none;
  }
}