/* RQI V4.4.16 - Ejaan Jari SIBI */

.rqi-sibi-controls {
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  padding:10px 16px;
  background:#eaf5ee;
}

.rqi-sibi-controls button,
.rqi-sibi-tabs button {
  padding:8px 12px;
  border:1px solid #a9cfb8;
  border-radius:8px;
  background:white;
  color:#195b3d;
  cursor:pointer;
}

.rqi-sibi-spelling {
  display:none;
  align-items:center;
  flex-wrap:wrap;
  gap:1px;
  margin-top:3px;
  line-height:1;
}

.rqi-sibi-enabled .rqi-sibi-spelling {
  display:flex;
}

.rqi-sibi-spelling img {
  display:block;
  width:20px;
  height:24px;
  object-fit:contain;
  border:0;
  padding:0;
  background:transparent;
}

.rqi-sibi-space {
  width:7px;
  height:1px;
}

.rqi-sibi-large .rqi-sibi-spelling img {
  width:40px;
  height:48px;
}

.rqi-sibi-large .rqi-sibi-space {
  width:14px;
}

.rqi-sibi-tabs {
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin:16px 0;
}

.rqi-sibi-dictionary {
  display:grid;
  grid-template-columns:
    repeat(auto-fill,minmax(95px,1fr));
  gap:12px;
}

.rqi-sibi-letter {
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:5px;
  padding:12px;
  border:1px solid #d5e5da;
  border-radius:9px;
  background:white;
}

.rqi-sibi-letter img {
  width:65px;
  height:78px;
  object-fit:contain;
}

@media(max-width:600px) {
  .rqi-sibi-controls {
    padding:8px;
  }
  .rqi-sibi-spelling img {
    width:18px;
    height:22px;
  }
  .rqi-sibi-large .rqi-sibi-spelling img {
    width:36px;
    height:44px;
  }
}


/* RQI — Kontrol SIBI modern */

.rqi-sibi-controls {
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:10px !important;
  flex-wrap:wrap !important;
  padding:14px 20px !important;
  background:#f0f8f3 !important;
  border-bottom:1px solid #d6e9dc;
}

.rqi-sibi-controls::before {
  content:"Ejaan Jari SIBI";
  font-size:15px;
  font-weight:700;
  color:#195b3d;
  margin-right:auto;
}

.rqi-sibi-controls button {
  border:1px solid #b8d6c3 !important;
  border-radius:999px !important;
  padding:10px 18px !important;
  font-size:13px !important;
  font-weight:700 !important;
  cursor:pointer;
  transition:background .2s,color .2s;
}

.rqi-sibi-toggle {
  background:#fff !important;
  color:#195b3d !important;
}

.rqi-sibi-toggle[aria-pressed="true"] {
  background:#17613f !important;
  color:white !important;
}

.rqi-sibi-zoom {
  background:white !important;
  color:#195b3d !important;
}

.rqi-sibi-zoom:disabled {
  opacity:.45;
  cursor:not-allowed;
}

@media(max-width:600px) {
  .rqi-sibi-controls {
    justify-content:center !important;
    padding:12px !important;
  }
  .rqi-sibi-controls::before {
    width:100%;
    text-align:center;
  }
}


/* Perapian ejaan jari */
.rqi-sibi-spelling {
  max-width:100%;
  overflow-wrap:anywhere;
}

nav .rqi-sibi-spelling img {
  width:16px;
  height:19px;
}

.rqi-sibi-large nav .rqi-sibi-spelling img {
  width:32px;
  height:38px;
}

main p .rqi-sibi-spelling {
  margin-top:4px;
}

@media(max-width:600px) {
  nav .rqi-sibi-spelling img {
    width:14px;
    height:17px;
  }
}


/* RQI — Sembunyikan toolbar Isyarat lama */
.rqt-isyarat-toolbar {
    display: none !important;
}


/* RQI — Navigasi dan Ejaan Jari terpisah */

/* Ejaan jari tidak boleh menutupi teks navigasi */
nav .rqi-sibi-spelling {
  pointer-events:none !important;
}

/* Ketika nonaktif, hanya gambar SIBI disembunyikan */
body:not(.rqi-sibi-enabled) .rqi-sibi-spelling {
  display:none !important;
}

/* Teks dan tombol navigasi tetap tersedia */
nav a,
nav button {
  visibility:visible;
}

/* Status aktif mengikuti atribut navigasi */
nav a[aria-current="page"] {
  font-weight:700;
}


/* RQI — Bersihkan label isyarat lama */

/* Hilangkan kotak Isyarat lama di navigasi */
header .rqt-sign-v29,
header .rqt-sign-trigger,
header .rqt-isyarat-badge {
  display: none !important;
}

/* Hilangkan tulisan Ejaan Jari SIBI */
.rqi-sibi-controls::before {
  content: none !important;
  display: none !important;
}

/* Pertahankan tombol di sisi kanan */
.rqi-sibi-controls {
  justify-content: flex-end !important;
}

/* Tombol baru tetap tersedia */
.rqi-sibi-controls button {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
}