/* Frontdesk developer credit: approved artwork for each appearance mode. */
.app-shell[data-nav-compact='false'] .sidebar .sidebar-brand,
.app-shell .sidebar[data-open='true'] .sidebar-brand {
  height: auto;
  min-height: 140px;
  padding: 16px 8px 12px;
  grid-template-columns: minmax(0, 1fr);
  align-items: start;
  gap: 0;
}
.app-shell .sidebar .sidebar-identity {
  grid-column: 1 / -1;
  width: 100%;
  gap: 8px;
}
.app-shell .sidebar-identity .sidebar-wordmark {
  content: url('/brand/frontdesk-corium-claro-20261017.png');
  aspect-ratio: 2098 / 749;
  width: 100%;
  height: auto;
  max-height: none;
}
html[data-fd-theme='dark'] .app-shell .sidebar-identity .sidebar-wordmark {
  content: url('/brand/frontdesk-corium-oscuro-20261017.png');
  aspect-ratio: 2100 / 749;
}
.app-shell .sidebar .sidebar-tagline {
  max-width: calc(100% - 50px);
  margin-left: 6px;
}
.app-shell[data-nav-compact='false'] .sidebar .sidebar-fold,
.app-shell .sidebar[data-open='true'] .sidebar-close {
  position: absolute;
  top: auto;
  right: 8px;
  bottom: 12px;
}

/* Give the expanded desktop brand ten percent more room. */
@media screen and (min-width: 1101px) {
  .app-shell[data-nav-compact='false'] {
    --fd-rail-width: 236px;
    --rail-open-width: 236px;
  }
}

/* Match the developer credit to the supplied magenta without changing the logo. */
.app-shell .sidebar .sidebar-identity {
  position: relative;
  --fd-credit-mask: url('/brand/frontdesk-corium-claro-20261017.png');
  --fd-credit-ratio: 2098 / 749;
}
html[data-fd-theme='dark'] .app-shell .sidebar .sidebar-identity {
  --fd-credit-mask: url('/brand/frontdesk-corium-oscuro-20261017.png');
  --fd-credit-ratio: 2100 / 749;
}
.app-shell .sidebar-identity .sidebar-wordmark {
  clip-path: inset(0 0 25% 0);
}
.app-shell .sidebar .sidebar-identity::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  aspect-ratio: var(--fd-credit-ratio);
  background-color: #ca1779;
  -webkit-mask-image: var(--fd-credit-mask);
  mask-image: var(--fd-credit-mask);
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  clip-path: inset(75% 0 0 0);
  pointer-events: none;
}