/* Shared public/admin loading feedback. */
.is-loading {
  cursor: wait;
  opacity: 0.8;
  min-width: 8rem;
}
.button-spinner {
  display: inline-block;
  flex: 0 0 auto;
  width: 1em;
  height: 1em;
  border: 2px solid currentColor;
  border-right-color: transparent;
  border-radius: 50%;
  animation: ebi-spin 0.8s linear infinite;
}
.loading-state {
  width: 100%;
  padding: 1.5rem 0;
  grid-column: 1 / -1;
}
.loading-brand {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.8rem;
  color: #0f3d2e;
  font: inherit;
  margin-bottom: 1.5rem;
}
.loading-brand img {
  animation: ebi-breathe 1.4s ease-in-out infinite;
}
.skeleton-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.2rem;
}
.skeleton-card {
  padding: 1rem;
  border-radius: 18px;
  background: #fff;
  border: 1px solid #eee7dc;
}
.skeleton {
  background: linear-gradient(100deg, #eee9df 25%, #faf7f1 45%, #eee9df 65%);
  background-size: 220% 100%;
  animation: ebi-shimmer 1.6s linear infinite;
  border-radius: 9px;
}
.skeleton-picture {
  height: 145px;
  margin-bottom: 1rem;
}
.skeleton-line {
  height: 15px;
  margin: 0.7rem 0;
}
.skeleton-line--short {
  width: 65%;
}
.loading-error {
  padding: 1.5rem;
  border-radius: 16px;
  background: #faf6ef;
  color: #0f3d2e;
  grid-column: 1 / -1;
}
.loading-error .btn {
  margin-top: 1rem;
}
@keyframes ebi-spin {
  to {
    transform: rotate(360deg);
  }
}
@keyframes ebi-breathe {
  50% {
    opacity: 0.45;
    transform: scale(0.94);
  }
}
@keyframes ebi-shimmer {
  to {
    background-position: -220% 0;
  }
}
@media (max-width: 700px) {
  .skeleton-grid {
    grid-template-columns: 1fr;
  }
  .skeleton-card:nth-child(n + 3) {
    display: none;
  }
}
@media (prefers-reduced-motion: reduce) {
  .button-spinner,
  .loading-brand img,
  .skeleton {
    animation: none;
  }
}