/* Palimpseste — feuille custom (étend les utilitaires Tailwind CDN). */

/* Alpine x-cloak : règle indispensable pour éviter le FOUC. Sans elle,
   les éléments avec x-cloak restent visibles tant qu'Alpine n'a pas
   évalué x-show ; on voit donc flasher les blocs cachés au chargement. */
[x-cloak] { display: none !important; }

/* ===== Refonte panneau IA split-screen post-FIAB =====
   Layout flex à 2 colonnes : main (flex-1) + ai-resizer (6px) + aside.
   Largeur de l'aside ajustable au drag, mémorisée en localStorage.
   Min 20%, max 60%, default 35%. Cf base.html paliLayout(). */
.palimp-layout {
  min-height: calc(100vh - 4rem);
}
.ai-resizer {
  width: 6px;
  background: rgb(231 229 228); /* stone-200 */
  cursor: col-resize;
  flex-shrink: 0;
  transition: background-color 0.15s ease;
}
.ai-resizer:hover,
.ai-resizer:active {
  background: rgb(168 162 158); /* stone-400 */
}
.ai-panel-split {
  flex-shrink: 0;
  background: white;
  border-left: 1px solid rgb(231 229 228);
  display: flex;
  flex-direction: column;
  /* La hauteur suit le viewport ; le contenu interne scroll. */
  max-height: 100vh;
  overflow: hidden;
}

/* Fallback responsive : sur viewport < 1024px (mobile/tablette) le drag
   ne tient pas. On force l'aside en overlay full-width temporaire. */
@media (max-width: 1023px) {
  .palimp-layout {
    flex-direction: column;
  }
  .ai-resizer {
    display: none;
  }
  .ai-panel-split {
    width: 100% !important;
    position: fixed;
    top: 0; right: 0; bottom: 0; left: 0;
    z-index: 50;
    border-left: none;
  }
}

@keyframes shimmer {
  0%   { background-position: 0% 50%; }
  50%  { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

.animate-shimmer {
  background-size: 200% 100%;
  animation: shimmer 6s ease-in-out infinite;
}

/* Sprint 5c UI : score circulaire fidélité voix.
   --score est l'angle du cercle (0..360deg). Couleur du remplissage selon
   palier : rouge < 50, ambre < 80, vert >= 80.
   Implémentation conic-gradient : fill jusqu'à --score, reste en stone-100. */
.voice-score-ring {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background:
    conic-gradient(var(--ring-color, #10b981) 0deg var(--score, 0deg),
                   #f5f5f4 var(--score, 0deg) 360deg);
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  flex-shrink: 0;
}
.voice-score-ring::before {
  content: "";
  position: absolute;
  inset: 6px;
  background: white;
  border-radius: 50%;
}
.voice-score-value {
  position: relative;
  font-size: 1rem;
  color: #44403c;
  font-weight: 500;
}

/* Sprint 4c (TODO) : highlights annotations par kind. */
mark.annotation-note { background: #fef3c7; }
mark.annotation-correction { background: #fed7aa; }
mark.annotation-redirect { background: #ddd6fe; }
mark.annotation-cut { background: #fecaca; text-decoration: line-through; }
mark.annotation-expand { background: #bbf7d0; }