/* ============================================================================
   Lumen — override tampilan OHIF Viewer (image resmi ohif/app, TIDAK di-fork
   atau dibangun ulang dari sumber). File ini disuntik lewat nginx sub_filter
   di deploy/nginx/viewer.conf (<link> ditambah sebelum </head> pada respons
   index.html), jadi upgrade OHIF_VERSION cukup pull image baru -- tidak
   butuh proses build terpisah untuk viewer.

   OHIF tidak menyediakan nama kelas semantik atau data-attribute untuk
   elemen di bawah, jadi target-nya lewat kombinasi kelas utility Tailwind
   OHIF sendiri. PENTING: kombinasi kelas ini bisa berubah kalau
   OHIF_VERSION naik dan komponennya di-refactor upstream. Kalau override
   di bawah berhenti berlaku setelah upgrade versi, cek ulang lewat DevTools
   pada elemen yang bersangkutan, lalu bandingkan dengan backup CSS asli di
   deploy/ohif/backup-css-original/ (lihat README di folder itu).
   ========================================================================= */

/* --- 1. Peringatan "investigational use only" -- dibikin lebih soft ---
   Warna aslinya pakai token --popover (hsl 219 90% 15%, biru jenuh) di atas
   background hitam pekat -- kontras tinggi, kesannya alert/urgent padahal
   isinya cuma disclaimer standar. Diganti ke token --muted (permukaan
   redup yang sudah dipakai OHIF sendiri untuk elemen kurang menonjol),
   border ditipiskan & dijernihkan, shadow dilembutkan. Lebar 90% layar
   terasa terlalu dominan, jadi dipersempit dan dipindah ke pojok kanan
   bawah supaya tidak menghalangi citra yang sedang dilihat. */
div[class~="fixed"][class~="bottom-2"][class~="justify-center"]{
  justify-content:flex-end !important;
  padding-right:16px;
}
div[class~="bg-popover"][class~="border-muted"][class~="shadow-lg"]{
  width:auto !important;
  max-width:400px;
  background:hsl(var(--muted) / .96) !important;
  border-color:hsl(0 0% 100% / .08) !important;
  border-width:1px !important;
  box-shadow:0 4px 20px rgba(0,0,0,.4) !important;
}

/* Judul disclaimer aslinya text-[19px] -- kepanjangan, bikin kartu jadi
   3 baris dan lebih dominan dari yang perlu. Dikecilkan, dan ikonnya
   (SVG 68x68 bawaan) ikut dikecilkan proporsional. */
div[class~="bg-popover"][class~="border-muted"][class~="shadow-lg"] div[class~="text-foreground"][class~="text-[19px]"]{
  font-size:13px !important;
  line-height:1.35;
}
div[class~="bg-popover"][class~="border-muted"][class~="shadow-lg"] svg{
  width:36px !important;
  height:36px !important;
}
div[class~="bg-popover"][class~="border-muted"][class~="shadow-lg"] a{
  font-size:12px !important;
}
div[class~="bg-popover"][class~="border-muted"][class~="shadow-lg"] > button{
  font-size:13px !important;
}

/* --- 2. Rapikan di layar sempit (mobile) --- */
@media (max-width:640px){
  /* Tinggi wrapper luar di-hardcode 86px oleh OHIF. Di layar sempit teks
     disclaimer di atas bisa perlu 3-4 baris dan bertabrakan dengan tombol
     "Confirm and hide" (terverifikasi lewat screenshot mobile viewport).
     Disusun ulang jadi kolom & tinggi mengikuti isi. */
  div[class~="fixed"][class~="bottom-2"][class~="justify-center"]{
    height:auto !important;
    justify-content:center !important;
    padding-right:0;
  }
  div[class~="bg-popover"][class~="border-muted"][class~="shadow-lg"]{
    flex-direction:column !important;
    align-items:flex-start !important;
    gap:10px;
    width:92vw !important;
    max-width:92vw;
  }
  div[class~="bg-popover"][class~="border-muted"][class~="shadow-lg"] > button{
    align-self:flex-end;
  }

  /* Wordmark "Lumen" custom kita (lihat whiteLabeling.createLogoComponentFn
     di app-config.js) bertabrakan dengan ikon toolbar di layar sempit --
     disembunyikan; di layar sekecil ini ikon lebih penting dipakai
     daripada logo. */
  .lumen-wordmark{ display:none !important; }
}