/**
 * Athena Media — utilitaires autour des CDN (icônes, emoji, drapeaux, gif, animations).
 */
:root {
  --athena-media-gif-radius: 0.75rem;
  --athena-media-emoji-size: 1.25em;
  --athena-media-flag-size: 1.125em;
}

/* Emoji Twemoji */
img.emoji,
.athena-emoji img.emoji {
  height: var(--athena-media-emoji-size);
  width: var(--athena-media-emoji-size);
  margin: 0 0.05em 0 0.1em;
  vertical-align: -0.15em;
  display: inline-block;
}

.athena-emoji {
  display: inline;
  line-height: 1;
}

/* Drapeaux */
.athena-flag,
.fi.athena-flag {
  font-size: var(--athena-media-flag-size);
  line-height: 1;
  border-radius: 2px;
  box-shadow: 0 0 0 1px rgba(15, 23, 42, 0.08);
}

.athena-flag--img {
  display: inline-block;
  vertical-align: middle;
  border-radius: 2px;
  object-fit: cover;
}

/* GIF */
.athena-gif,
img[data-athena-gif] {
  display: block;
  max-width: 100%;
  height: auto;
  border-radius: var(--athena-media-gif-radius);
}

.athena-gif-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
  gap: 0.5rem;
}

.athena-gif-grid button {
  appearance: none;
  border: 1px solid #e2e8f0;
  background: #f8fafc;
  padding: 0;
  border-radius: var(--athena-media-gif-radius);
  overflow: hidden;
  cursor: pointer;
  transition: border-color 140ms ease, transform 140ms ease;
}

.athena-gif-grid button:hover,
.athena-gif-grid button:focus-visible {
  border-color: #059669;
  outline: none;
  transform: translateY(-1px);
}

.athena-gif-grid img {
  display: block;
  width: 100%;
  height: 100px;
  object-fit: cover;
}

/* Icônes Lucide / Iconify */
[data-lucide],
iconify-icon {
  display: inline-block;
  vertical-align: middle;
  flex-shrink: 0;
}

iconify-icon {
  color: currentColor;
}

/* Lottie host */
[data-athena-lottie] {
  display: block;
  width: 100%;
  max-width: 240px;
  margin-inline: auto;
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
  .animate__animated,
  [data-aos] {
    animation: none !important;
    transition: none !important;
  }
}