/*! Copyright 2026 Fonticons, Inc. - https://webawesome.com/license */
import { css } from "lit";
var skeleton_styles_default = css`:host {
  --color: var(--wa-color-neutral-fill-normal);
  --sheen-color: color-mix(in oklab, var(--color), var(--wa-color-surface-raised));
  display: flex;
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 1rem;
}
.indicator {
  flex: 1 1 auto;
  background: var(--color);
  border-radius: var(--wa-border-radius-pill);
}
:host([effect="sheen"]) .indicator {
  background:
    linear-gradient(
      270deg,
      var(--sheen-color),
      var(--color),
      var(--color),
      var(--sheen-color));
  background-size: 400% 100%;
  animation: sheen 8s ease-in-out infinite;
}
:host([effect="pulse"]) .indicator {
  animation: pulse 2s ease-in-out 0.5s infinite;
}
@media (forced-colors: active) {
  :host {
    --color: GrayText;
  }
}
@keyframes sheen {
  0% {
    background-position: 200% 0;
  }
  to {
    background-position: -200% 0;
  }
}
@keyframes pulse {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0.4;
  }
  100% {
    opacity: 1;
  }
}
`;
export {
  skeleton_styles_default as default
};
