/* Olivet Assembly — estilos do app (complementa Tailwind CDN).
   Mantém a paleta da marca: brand #2A5ED0 · navy #0F2350 · gold #C9A24E */

/* ---------- Player de áudio: barra de busca ---------- */
input[type="range"].seek {
  -webkit-appearance: none;
  appearance: none;
  height: 6px;
  border-radius: 9999px;
  background: rgba(255, 255, 255, 0.18);
  outline: none;
  cursor: pointer;
}
input[type="range"].seek::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 16px;
  height: 16px;
  border-radius: 9999px;
  background: #D8BB6F;
  border: 2px solid #fff;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.35);
}
input[type="range"].seek::-moz-range-thumb {
  width: 14px;
  height: 14px;
  border-radius: 9999px;
  background: #D8BB6F;
  border: 2px solid #fff;
}
input[type="range"].seek::-moz-range-track {
  height: 6px;
  border-radius: 9999px;
  background: rgba(255, 255, 255, 0.18);
}
input[type="range"].seek:focus-visible {
  box-shadow: 0 0 0 3px rgba(216, 187, 111, 0.45);
}

/* ---------- Plyr: cores da marca ---------- */
.player-video .plyr {
  --plyr-color-main: #2A5ED0;
  --plyr-video-control-color: #fff;
  --plyr-menu-background: #0F2350;
  --plyr-menu-color: #fff;
  --plyr-tooltip-background: #0F2350;
  --plyr-tooltip-color: #fff;
  border-radius: 1rem;
  font-family: Inter, system-ui, sans-serif;
}

/* ---------- Conversa com o tutor ---------- */
.msg { max-width: 88%; border-radius: 1rem; padding: 0.5rem 0.75rem; font-size: 0.875rem; line-height: 1.45; }
.msg-est   { margin-left: auto; background: #EEF3FC; color: #0F2350; border-bottom-right-radius: 0.25rem; }
.msg-tutor { margin-right: auto; background: #0F2350; color: #fff; border-bottom-left-radius: 0.25rem; }
.msg-tutor .msg-meta { color: rgba(255, 255, 255, 0.6); }
.msg-est   .msg-meta { color: rgba(15, 35, 80, 0.55); }

/* ---------- Modal simples (histórico de reflexão) ---------- */
.olv-overlay {
  position: fixed; inset: 0; z-index: 90;
  display: flex; align-items: flex-end; justify-content: center;
  background: rgba(8, 19, 48, 0.55);
  backdrop-filter: blur(2px);
  padding: 1rem;
}
@media (min-width: 640px) { .olv-overlay { align-items: center; } }
.olv-modal {
  width: 100%; max-width: 34rem; max-height: 82vh; overflow: auto;
  background: #fff; border-radius: 1.25rem;
  box-shadow: 0 24px 60px rgba(8, 19, 48, 0.35);
  animation: olv-up 0.22s cubic-bezier(0.16, 1, 0.3, 1);
}
@keyframes olv-up { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }

/* ---------- Animações discretas ---------- */
.fade-in { animation: olv-fade 0.3s ease-out both; }
@keyframes olv-fade { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

@media (prefers-reduced-motion: reduce) {
  .olv-modal, .fade-in { animation: none !important; }
  * { scroll-behavior: auto !important; }
}