/* Tampilan — motion ringan lintas panel Filament (Admin/Guru/Siswa/Ortu/
   Eksekutif). Sengaja HANYA transisi CSS murni (hover/focus/perpindahan
   warna tema) — TIDAK ada JS animasi tambahan, supaya tetap ringan sesuai
   permintaan "jangan buat berat". */

:root {
  --tampilan-transition: 150ms cubic-bezier(0.4, 0, 0.2, 1);
}

.fi-sidebar-item,
.fi-sidebar-group-button,
.fi-btn,
.fi-icon-btn,
.fi-badge,
.fi-ta-row,
.fi-card {
  transition:
    background-color var(--tampilan-transition),
    color var(--tampilan-transition),
    border-color var(--tampilan-transition),
    box-shadow var(--tampilan-transition),
    transform var(--tampilan-transition);
}

.fi-btn:not(:disabled):hover,
.fi-icon-btn:not(:disabled):hover {
  transform: translateY(-1px);
}

.fi-sidebar-item-button:hover {
  transform: translateX(2px);
}

.fi-section,
.fi-wi-stats-overview-stat {
  transition: box-shadow var(--tampilan-transition), transform var(--tampilan-transition);
}

.fi-section:hover,
.fi-wi-stats-overview-stat:hover {
  box-shadow: 0 4px 12px rgb(0 0 0 / 0.08);
}

.fi-main {
  animation: tampilan-fade-in 200ms ease-out;
}

@keyframes tampilan-fade-in {
  from {
    opacity: 0;
    transform: translateY(4px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (prefers-reduced-motion: reduce) {
  .fi-sidebar-item,
  .fi-sidebar-group-button,
  .fi-btn,
  .fi-icon-btn,
  .fi-badge,
  .fi-ta-row,
  .fi-card,
  .fi-section,
  .fi-wi-stats-overview-stat,
  .fi-main {
    transition: none;
    animation: none;
  }
}

/* ------------------------------------------------------------------
   Perbaikan tampilan tabel custom (2026-08-29) — mencegah tabel meluber
   & teks terpotong di tepi layar (dilaporkan pemilik vault: kolom "Opsi"
   instrumen Diagnostik dengan teks panjang memaksa tabel super lebar).
   Aturan ini melengkapi pembungkus .overflow-x-auto di tiap halaman:
   - Teks panjang di sel tabel custom (.fi-ta-table) selalu wrap, tidak
     memaksa lebar tabel melebihi kontainer. Sel yang sengaja nowrap
     (white-space:nowrap) TIDAK terpengaruh (overflow-wrap diabaikan saat
     nowrap), jadi angka/tanggal/aksi tetap satu baris.
   - Header tabel custom tidak pecah asal-asalan.
   ------------------------------------------------------------------ */
.fi-ta-table td,
.fi-ta-table th {
  overflow-wrap: anywhere;
  word-break: break-word;
}

/* Kontainer scroll horizontal tidak pernah membuat SELURUH halaman ikut
   menggeser (isolasi scroll ke dalam kontainer tabelnya sendiri). */
.overflow-x-auto {
  max-width: 100%;
}