/* Component-local styles. Theme values inherit from the host design system. */
@import url('./native-glass/style.css');

.di4-material-root {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  contain: paint;
  isolation: isolate;
  pointer-events: none;
  color: var(--di4-material-fg, var(--glass-text-primary, var(--glass-text, inherit)));
  border-radius: inherit;
}
.di4-material-base,
.di4-material-light,
.di4-material-ground,
.di4-material-canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.di4-material-base,
.di4-material-light,
.di4-material-ground {
  background-repeat: repeat;
  background-position: 0 0;
}
.di4-material-base,
.di4-material-ground {
  background-color: var(--di4-material-underlay, var(--glass-bg-page, var(--glass-bg, transparent)));
}
.di4-material-light {
  opacity: 0;
  animation: di4-material-crossfade 8000ms ease-in-out infinite;
}
.di4-material-root[data-paused="true"] .di4-material-light {
  animation-play-state: paused;
}
.di4-material-canvas { display: block; }
@keyframes di4-material-crossfade {
  0%, 100% { opacity: 0; }
  50% { opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
  .di4-material-light { display: none; animation: none; }
}
