/*
 * Feedback placement polish.
 *
 * The home header intentionally floats over the photographic hero. Generic
 * in-flow feedback started at the same origin, so it sat underneath the menu,
 * centred logo and login control. Keep inner-page feedback in the document
 * flow and turn only home-page feedback into a compact toast below the header
 * controls.
 */
.home-page main > .flash-wrap {
  width: min(24rem, calc(100% - 1.875rem));
  position: absolute;
  z-index: 1550;
  top: 5.5rem;
  left: max(0.9375rem, calc(50% - 36.5625rem));
  margin: 0;
  pointer-events: none;
}

.home-page main > .flash-wrap .flash {
  grid-template-columns: 1.6rem minmax(0, 1fr) 2.25rem;
  gap: 0.55rem;
  min-height: 3.5rem;
  padding: 0.55rem 0.5rem 0.55rem 0.75rem;
  background: rgb(248 248 247 / 96%);
  border: 0;
  border-left: 0.25rem solid var(--success);
  box-shadow: 0 0.65rem 1.6rem rgb(30 30 30 / 22%);
  pointer-events: auto;
}

.home-page main > .flash-wrap .flash--error {
  border-left-color: var(--error);
}

.home-page main > .flash-wrap .flash-icon {
  width: 1.45rem;
  height: 1.45rem;
  font-size: 0.75rem;
}

.home-page main > .flash-wrap .flash p {
  min-width: 0;
  font-size: 0.82rem;
  line-height: 1.35;
}

.home-page main > .flash-wrap .flash button {
  width: 2.25rem;
  height: 2.25rem;
  align-self: center;
}

@media (max-width: 43.99rem) {
  .home-page main > .flash-wrap {
    width: auto;
    top: 5.75rem;
    right: 0.9375rem;
    left: 0.9375rem;
  }
}
