/* Pembaca PDF SIAKAD — STIKes Dharma Husada Bandung
   Hanya menata bingkai di sekeliling viewer; tampilan buku itu sendiri
   tetap milik dflip.css bawaan DearFlip, yang tidak disentuh. */

:root {
  color-scheme: light dark;

  /* Dua nilai per variabel lewat light-dark(): pertama untuk mode
     terang, kedua untuk gelap. Baris pendek di atas tiap pasangan
     adalah cadangan untuk browser lama — deklarasi yang tidak dipahami
     diabaikan, sehingga yang tersisa mode terang, sama seperti sebelum
     fitur ini ada. */

  --pv-bg: #e9edf1;
  --pv-bg: light-dark(#e9edf1, #0d1620);

  --pv-kop: #ffffff;
  --pv-kop: light-dark(#ffffff, #141f2b);

  --pv-line: #d3dae1;
  --pv-line: light-dark(#d3dae1, #26343f);

  --pv-ink: #16232f;
  --pv-ink: light-dark(#16232f, #e8eef4);

  --pv-ink-2: #55677a;
  --pv-ink-2: light-dark(#55677a, #a4b7c8);

  --pv-accent: #0d6e5c;
  --pv-accent: light-dark(#0d6e5c, #2fd6b0);

  --pv-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
             "Helvetica Neue", Arial, sans-serif;
}

:root[data-tema="terang"] { color-scheme: light; }
:root[data-tema="gelap"]  { color-scheme: dark; }

*, *::before, *::after { box-sizing: border-box; }

html, body {
  height: 100%;
  margin: 0;
}

body {
  display: flex;
  flex-direction: column;
  background: var(--pv-bg);
  color: var(--pv-ink);
  font-family: var(--pv-sans);
}

/* --- Kepala ----------------------------------------------------------- */

.pv-kop {
  display: flex;
  flex: none;
  gap: 1rem;
  align-items: center;
  justify-content: space-between;
  padding: .6rem .9rem;
  border-bottom: 1px solid var(--pv-line);
  background: var(--pv-kop);
}

.pv-judul {
  margin: 0;
  overflow: hidden;
  font-size: .95rem;
  font-weight: 700;
  letter-spacing: -.01em;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pv-aksi { display: flex; flex: none; gap: .45rem; }

.pv-tombol {
  padding: .35rem .8rem;
  border: 1px solid var(--pv-line);
  border-radius: 999px;
  background: transparent;
  color: var(--pv-ink-2);
  font-family: inherit;
  font-size: .72rem;
  font-weight: 650;
  letter-spacing: .03em;
  white-space: nowrap;
  cursor: pointer;
}

.pv-tombol:hover { border-color: var(--pv-accent); color: var(--pv-accent); }
.pv-tombol:focus-visible { outline: 2px solid var(--pv-accent); outline-offset: 2px; }

/* --- Wadah viewer ----------------------------------------------------- */

/* flex:1 dengan min-height:0 menggantikan height:100vh milik viewer
   lama. Pada ponsel, 100vh diukur terhadap layar penuh termasuk bilah
   alamat yang menyusut saat digulir, sehingga bagian bawah buku
   terpotong dan tombol navigasinya tidak bisa disentuh. Dengan flex,
   tingginya adalah sisa ruang yang benar-benar ada. */
.pv-wadah {
  flex: 1;
  min-height: 0;
}

/* --- Balik warna halaman ---------------------------------------------- */

/* invert + hue-rotate: teks hitam jadi putih tanpa membuat warna lain
   berubah rona. Diterapkan hanya pada kanvas halaman, bukan pada
   seluruh viewer, supaya tombol dan panel tetap terbaca normal. */
:root[data-balik="1"] .df-page canvas,
:root[data-balik="1"] .df-page img,
:root[data-balik="1"] canvas.df-page-canvas {
  filter: invert(1) hue-rotate(180deg);
}

/* --- Panel pesan ------------------------------------------------------ */

.pv-pesan {
  display: flex;
  flex: 1;
  align-items: center;
  justify-content: center;
  padding: 1.5rem;
}

.pv-panel {
  max-width: 32rem;
  padding: 1.4rem 1.5rem;
  border: 1px solid var(--pv-line);
  border-left: 4px solid var(--pv-accent);
  border-radius: 10px;
  background: var(--pv-kop);
}

.pv-panel h1,
.pv-panel h2 {
  margin: 0 0 .5rem;
  font-size: 1.15rem;
  font-weight: 750;
  letter-spacing: -.015em;
}

.pv-panel p {
  margin: 0;
  color: var(--pv-ink-2);
  font-size: .925rem;
  line-height: 1.55;
}

.pv-panel--sisip { margin: 1.5rem auto; }

@media (max-width: 480px) {
  .pv-kop { padding: .5rem .7rem; }
  .pv-judul { font-size: .85rem; }
  .pv-tombol { padding: .3rem .6rem; font-size: .68rem; }
}

@media (prefers-reduced-motion: reduce) {
  * { transition: none !important; }
}

/* --- Diagnosa administrator ------------------------------------------- */

.pv-diag {
  margin-top: 1rem;
  padding-top: .9rem;
  border-top: 1px solid var(--pv-line);
}

.pv-diag-label {
  display: block;
  margin-bottom: .35rem;
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--pv-accent);
}

.pv-diag p { font-size: .85rem; }

.pv-kode {
  margin-top: .5rem !important;
  padding: .5rem .65rem;
  border-radius: 6px;
  background: var(--pv-bg);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .75rem;
  overflow-wrap: anywhere;
}

/* --- Kendali baca nyaring & berbagi ------------------------------------ */

.pv-tombol--utama {
  border-color: var(--pv-accent);
  color: var(--pv-accent);
  font-weight: 700;
}

.pv-laju {
  display: flex;
  gap: .35rem;
  align-items: center;
  font-size: .7rem;
  color: var(--pv-ink-2);
}

.pv-laju-teks {
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.pv-pilih {
  padding: .3rem .4rem;
  border: 1px solid var(--pv-line);
  border-radius: 8px;
  background: var(--pv-kop);
  color: var(--pv-ink);
  font-family: inherit;
  font-size: .72rem;
}

.pv-pilih:focus-visible { outline: 2px solid var(--pv-accent); outline-offset: 1px; }

/* Bilah pesan. aria-live="polite" pada elemennya membuat pembaca layar
   ikut mengumumkan isinya — penting justru di sini, karena sebagian
   pesannya menjelaskan kenapa suara tidak keluar. */
.pv-pesan-bar {
  flex: none;
  margin: 0;
  padding: .55rem .9rem;
  border-bottom: 1px solid var(--pv-line);
  background: var(--pv-kop);
  color: var(--pv-ink-2);
  font-size: .82rem;
  line-height: 1.45;
}

.pv-pesan-bar--galat {
  border-left: 4px solid #8c2f2a;
  border-left-color: light-dark(#8c2f2a, #f0928c);
  color: #8c2f2a;
  color: light-dark(#8c2f2a, #f0928c);
}

.pv-tautan {
  flex: none;
  width: calc(100% - 1.8rem);
  margin: .5rem .9rem;
  padding: .5rem .65rem;
  border: 1px solid var(--pv-accent);
  border-radius: 8px;
  background: var(--pv-kop);
  color: var(--pv-ink);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .75rem;
}

/* Pada layar sempit deretan tombol dibiarkan menggulung mendatar
   daripada dipaksa turun baris — bilah atas tetap setipis mungkin
   supaya ruang baca tidak berkurang. */
@media (max-width: 640px) {
  .pv-kop { gap: .6rem; }
  .pv-aksi {
    overflow-x: auto;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }
  .pv-aksi::-webkit-scrollbar { display: none; }
  .pv-laju-teks { display: none; }
}

/* --- Lapis kedua untuk atribut style DearFlip -------------------------- */

/* DearFlip menyembunyikan kedua panel ini lewat atribut style="display:
   none;" di dalam string HTML-nya. Atribut semacam itu diblokir CSP,
   dan tanpa penggantinya panel akan tampil menutupi buku.

   CSP sudah mengizinkan nilai itu lewat hash (PDFV_HASH_STYLE), tetapi
   'unsafe-hashes' belum dikenal semua peramban. Aturan di bawah
   memberi hasil yang sama tanpa bergantung pada CSP sama sekali.

   Ini TIDAK menghalangi panel tampil saat dibuka: jQuery .show()
   menulis display lewat CSSOM, dan gaya inline selalu menang atas
   aturan stylesheet. */
.df-share-wrapper,
.df-popup-wrapper { display: none; }