/* Sync CSS color-scheme with Mantine so light-dark() in inline styles follows the toggle. */
html[data-mantine-color-scheme="dark"] {
  color-scheme: dark;
}

html[data-mantine-color-scheme="light"] {
  color-scheme: light;
}

/* Brand hero frost: same 120deg wash as legacy _app `.brand-hero` (light scheme only). */
[data-mantine-color-scheme="light"] .tm-frosted-paper.tm-brand-hero {
  background-image: linear-gradient(
    120deg,
    color-mix(in srgb, var(--mantine-color-orange-1) 40%, transparent) 0%,
    color-mix(in srgb, var(--mantine-color-gray-0) 34%, transparent) 45%,
    color-mix(in srgb, var(--mantine-color-yellow-1) 42%, transparent) 100%
  );
}

[data-mantine-color-scheme="dark"] .tm-frosted-paper.tm-brand-hero {
  background-image: none;
}

.tm-frosted-paper,
.tm-attention-modal-paper {
  /* Mantine Paper rounds corners with overflow hidden; that clips backdrop-filter. */
  overflow: visible !important;
  -webkit-backdrop-filter: blur(var(--tm-frost-blur-light, 16px)) !important;
  backdrop-filter: blur(var(--tm-frost-blur-light, 16px)) !important;
}

html[data-mantine-color-scheme="dark"] .tm-frosted-paper,
html[data-mantine-color-scheme="dark"] .tm-attention-modal-paper {
  -webkit-backdrop-filter: blur(var(--tm-frost-blur-dark, 18px)) !important;
  backdrop-filter: blur(var(--tm-frost-blur-dark, 18px)) !important;
}

.tm-frosted-paper:not(.tm-frosted-standup-finished),
.tm-attention-modal-paper:not(.tm-frosted-standup-finished) {
  transform: translateY(0) scale(1);
  animation: tm-frosted-standup-in 460ms cubic-bezier(0.2, 0.7, 0.2, 1) forwards;
  transition: transform 250ms ease, box-shadow 250ms ease, border-color 250ms ease;
}

.tm-frosted-paper.tm-frosted-standup-finished,
.tm-attention-modal-paper.tm-frosted-standup-finished {
  animation: none;
  transition: transform 250ms ease, box-shadow 250ms ease, border-color 250ms ease;
}

@keyframes tm-frosted-standup-in {
  0% {
    transform: translateY(10px) scale(0.985);
  }

  55% {
    transform: translateY(-2px) scale(1.01);
  }

  100% {
    transform: translateY(0) scale(1);
  }
}

.tm-frosted-paper:hover,
.tm-frosted-paper:focus-within,
.tm-frosted-paper[aria-selected="true"],
.tm-frosted-paper[data-selected="true"],
.tm-attention-modal-paper:hover,
.tm-attention-modal-paper:focus-within,
.tm-attention-modal-paper[aria-selected="true"],
.tm-attention-modal-paper[data-selected="true"] {
  transform: translateY(-2px) scale(1.01);
}

@media (prefers-reduced-motion: reduce) {
  .tm-frosted-paper:not(.tm-frosted-standup-finished),
  .tm-attention-modal-paper:not(.tm-frosted-standup-finished) {
    animation: none !important;
  }

  .tm-frosted-paper,
  .tm-attention-modal-paper {
    transition: none !important;
  }
}
