/**
 * Sisfo — peningkatan tipografi, menu tab, dan tombol (override tema legacy)
 * Muat setelah index.css & ddcolortabs.css
 */

:root {
  --sisfo-font: "Segoe UI", system-ui, -apple-system, "Roboto", "Helvetica Neue", Arial, sans-serif;
  --sisfo-brand: #7b0f0f;
  --sisfo-brand-mid: #9a2525;
  --sisfo-brand-light: #c94a2a;
  --sisfo-text: #1f2937;
  --sisfo-text-muted: #4b5563;
  --sisfo-link: #0b4f8f;
  --sisfo-radius: 10px;
  --sisfo-radius-sm: 8px;
  --sisfo-shadow: 0 2px 10px rgba(17, 24, 39, 0.08);
  --sisfo-shadow-btn: 0 2px 6px rgba(123, 15, 15, 0.22);
}

html {
  font-size: 100%;
  box-sizing: border-box;
}

body {
  font-family: var(--sisfo-font) !important;
  font-size: 15px !important;
  line-height: 1.55 !important;
  color: var(--sisfo-text) !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

#main_container .isi,
#main_container .MenuDirectory,
#main_container .NamaLogin,
#main_container .WaktuServer {
  font-family: var(--sisfo-font);
  font-size: 0.95rem;
}

#main_container .MenuDirectory,
#main_container .NamaLogin,
#main_container .WaktuServer {
  color: var(--sisfo-text-muted);
}

/* ---------- Menu horizontal (ddcolortabs) ---------- */
.ddcolortabs {
  margin-bottom: 0;
  padding: 4px 4px 0;
}

.ddcolortabs a span {
  font-family: var(--sisfo-font);
  font-size: 0.9rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  padding: 8px 16px !important;
  border-radius: var(--sisfo-radius-sm) var(--sisfo-radius-sm) 0 0 !important;
  border: 1px solid rgba(17, 24, 39, 0.12) !important;
  border-bottom: none !important;
  background: linear-gradient(180deg, #f3f4f6 0%, #e5e7eb 100%) !important;
  color: var(--sisfo-text) !important;
  box-shadow: none;
  transition: background 0.15s ease, color 0.15s ease, transform 0.12s ease;
}

.ddcolortabs a {
  color: inherit !important;
  text-decoration: none !important;
}

.ddcolortabs a:hover span {
  background: linear-gradient(180deg, #fff7ed 0%, #ffedd5 100%) !important;
  color: var(--sisfo-brand) !important;
}

.ddcolortabs .selected a span,
.ddcolortabs .selected a {
  background: linear-gradient(180deg, var(--sisfo-brand-mid) 0%, var(--sisfo-brand) 100%) !important;
  color: #fff !important;
  border-color: rgba(123, 15, 15, 0.5) !important;
  box-shadow: var(--sisfo-shadow-btn);
}

.ddcolortabs a:hover {
  background: transparent !important;
}

/* ---------- Dropdown modul ---------- */
.dropmenudiv_a {
  font-family: var(--sisfo-font) !important;
  font-size: 0.875rem !important;
  line-height: 1.45 !important;
  border-radius: 0 0 var(--sisfo-radius-sm) var(--sisfo-radius-sm);
  border-color: rgba(11, 79, 143, 0.25) !important;
  box-shadow: var(--sisfo-shadow);
}

.dropmenudiv_a a {
  padding: 8px 10px !important;
  color: var(--sisfo-text) !important;
  border-bottom-color: rgba(11, 79, 143, 0.12) !important;
  transition: background 0.12s ease, color 0.12s ease;
}

.dropmenudiv_a a:hover {
  background: linear-gradient(90deg, #eff6ff 0%, #dbeafe 100%) !important;
  color: var(--sisfo-link) !important;
}

/* ---------- Pagination global (dwolister) ---------- */
.dw-pagination {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.35rem 0.45rem;
  border: 1px solid #e5e7eb;
  border-radius: 999px;
  background: #ffffff;
  box-shadow: 0 1px 3px rgba(17, 24, 39, 0.08);
}

.dw-pagination .dw-page-list {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
}

.dw-pagination .dw-page-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.9rem;
  height: 1.9rem;
  padding: 0 0.55rem;
  border-radius: 999px;
  border: 1px solid transparent;
  font-size: 0.85rem;
  font-weight: 600;
  line-height: 1;
  color: #0b4f8f !important;
  text-decoration: none !important;
  background: #f8fafc;
}

.dw-pagination .dw-page-link:hover {
  background: #eaf2ff;
  border-color: #bfdbfe;
}

.dw-pagination .dw-page-link.is-current {
  color: #ffffff !important;
  background: linear-gradient(180deg, var(--sisfo-brand-mid) 0%, var(--sisfo-brand) 100%);
  border-color: rgba(123, 15, 15, 0.35);
  box-shadow: var(--sisfo-shadow-btn);
}

.dw-pagination .dw-page-link.is-disabled {
  color: #9ca3af !important;
  background: #f3f4f6;
  border-color: #e5e7eb;
}

.dw-pagination .dw-page-dropdown {
  display: inline-flex;
  align-items: center;
}

.dw-pagination .dw-page-select {
  height: 1.9rem;
  border-radius: 999px;
  border: 1px solid #d1d5db;
  background: #ffffff;
  color: #1f2937;
  font-size: 0.84rem;
  font-weight: 600;
  padding: 0 0.7rem;
}

/* ---------- Menu tab sekunder (.menuitem / .menuaktif) ---------- */
.menu {
  font-family: var(--sisfo-font) !important;
  font-size: 0.9rem !important;
  margin-top: 4px;
}

.menuitem,
.menuaktif {
  font-weight: 500;
  padding: 6px 12px !important;
  border-radius: var(--sisfo-radius-sm) !important;
  margin-right: 4px;
  transition: background 0.12s ease, border-color 0.12s ease;
}

.menuitem {
  background: #f9fafb;
  border-color: #e5e7eb !important;
}

.menuaktif {
  background: linear-gradient(180deg, #fff7ed 0%, #ffedd5 100%);
  border-color: rgba(123, 15, 15, 0.25) !important;
}

.menuaktif a {
  color: var(--sisfo-brand) !important;
  font-weight: 600;
}

/* ---------- Judul halaman modul ---------- */
.Judul,
.JudulBesar {
  font-family: var(--sisfo-font) !important;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: #374151 !important;
}

.Judul {
  font-size: 1.35rem !important;
  padding: 10px 8px !important;
  border-bottom: 1px solid #e5e7eb !important;
}

/* ---------- Tabel — header lebih modern ---------- */
.ttl,
.ttlin {
  font-family: var(--sisfo-font) !important;
  font-size: 0.8125rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.03em;
  text-transform: none;
  color: #ffffff !important;
  /* Hex langsung (bukan var): hindari latar invalid sehingga hanya teks putih yang menang */
  background-color: #7b0f0f !important;
  background-image: linear-gradient(180deg, #9a2525 0%, #7b0f0f 100%) !important;
  border: none !important;
  border-bottom: 2px solid rgba(0, 0, 0, 0.12) !important;
  padding: 10px 8px !important;
}

/* Halaman pembayaran: baris data biaya sedikit lebih lapang */
table.bayarmhsw-bipot td.ul,
table.bayarmhsw-bipot td.ul1,
table.bayarmhsw-bipot td.inp {
  padding-top: 0.55rem !important;
  padding-bottom: 0.55rem !important;
}

/* HER pembayaran: header tabel biaya/potongan — teks tengah, font sedikit lebih besar dari .ttl global */
#main_container table.bayarmhsw-bipot > tbody > tr > th.ttl,
#main_container table.bayarmhsw-bipot > tbody > tr > th.ttlin,
table.bayarmhsw-bipot > tbody > tr > th.ttl,
table.bayarmhsw-bipot > tbody > tr > th.ttlin {
  text-align: center !important;
  vertical-align: middle !important;
  font-size: 0.9375rem !important;
}

.inp {
  font-family: var(--sisfo-font) !important;
  font-size: 0.875rem !important;
  font-weight: 600 !important;
  color: #374151 !important;
  background: #f3f4f6 !important;
  border-bottom: 1px solid #e5e7eb !important;
}

.ul1,
.ul {
  font-size: 0.9rem;
}

/* ---------- Tombol: .buttons + input native ---------- */
.buttons,
input[type="button"],
input[type="submit"],
input[type="reset"] {
  font-family: var(--sisfo-font) !important;
  font-size: 0.9rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em;
  line-height: 1.3;
  padding: 0.45rem 1rem !important;
  min-height: 2.25rem;
  border-radius: var(--sisfo-radius-sm) !important;
  cursor: pointer !important;
  transition: transform 0.1s ease, box-shadow 0.15s ease, filter 0.12s ease, border-color 0.12s ease;
  background-image: none !important;
}

/* Utama: simpan / cari / aksi positif */
.buttons,
input[type="submit"],
input[type="button"]:not([name="Batal"]):not([value="Batal"]):not([value="Batalkan"]):not([value="Kembali"]):not([value="Tutup"]) {
  color: #fff !important;
  border: 1px solid rgba(90, 10, 10, 0.45) !important;
  background: linear-gradient(180deg, var(--sisfo-brand-light) 0%, var(--sisfo-brand) 100%) !important;
  box-shadow: var(--sisfo-shadow-btn);
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.15);
}

.buttons:hover,
input[type="submit"]:hover,
input[type="button"]:not([name="Batal"]):not([value="Batal"]):not([value="Batalkan"]):not([value="Kembali"]):not([value="Tutup"]):hover {
  filter: brightness(1.05);
  box-shadow: 0 4px 12px rgba(123, 15, 15, 0.28);
}

.buttons:active,
input[type="submit"]:active,
input[type="button"]:active {
  transform: translateY(1px);
}

/* Sekunder: batal / kembali / tutup */
input[type="reset"],
input[name="Batal"],
input[value="Batal"],
input[value="Batalkan"],
input[value="Kembali"],
input[value="Tutup"] {
  color: var(--sisfo-text) !important;
  background: linear-gradient(180deg, #fff 0%, #f3f4f6 100%) !important;
  border: 1px solid #d1d5db !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
  text-shadow: none;
}

input[type="reset"]:hover,
input[name="Batal"]:hover,
input[value="Batal"]:hover,
input[value="Batalkan"]:hover,
input[value="Kembali"]:hover,
input[value="Tutup"]:hover {
  background: #e5e7eb !important;
  border-color: #9ca3af !important;
}

/* Fokus keyboard */
.buttons:focus-visible,
input[type="button"]:focus-visible,
input[type="submit"]:focus-visible,
input[type="reset"]:focus-visible {
  outline: 2px solid rgba(11, 79, 143, 0.55);
  outline-offset: 2px;
}

/* Tautan isi konten */
#main_container .isi a:link,
#main_container .isi a:visited {
  color: var(--sisfo-link);
  font-weight: 500;
}

#main_container .isi a:hover {
  color: #063666;
  text-decoration: underline;
}

/* Box konten */
#main_container .box {
  border-radius: var(--sisfo-radius-sm);
  border-color: #e5e7eb !important;
}

/* === Header baris tabel global (#main_container) — th + td.ttl (legacy Sisfo) === */
#main_container table th {
  background-color: #0f172a !important;
  background-image: linear-gradient(180deg, #1e3a5f 0%, #0f172a 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border-color: rgba(255, 255, 255, 0.14) !important;
}

#main_container table td.ttl,
#main_container table td.ttlin {
  background-color: #0f172a !important;
  background-image: linear-gradient(180deg, #1e3a5f 0%, #0f172a 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

#main_container table th.ttl,
#main_container table th.ttlin {
  background-color: #7b0f0f !important;
  background-image: linear-gradient(180deg, #9a2525 0%, #7b0f0f 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

/* Ringkasan BIPOT/bayar: baris judul = td.inp / td.inp2 */
#main_container table.sisfo-keu-summary > tbody > tr:first-child > td {
  background-color: #14532d !important;
  background-image: linear-gradient(180deg, #166534 0%, #14532d 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-weight: 600 !important;
}

#main_container table.sisfo-keu-summary > tbody > tr:nth-child(2) > td {
  padding-top: 0.55rem !important;
  padding-bottom: 0.55rem !important;
}

/* Fallback global: header tabel .box (login Konfirmasi, popup) — tidak bergantung #main_container */
table.box > tbody > tr:first-child > th,
table.box th.ttl,
table.box th.ttlin {
  background-color: #7b0f0f !important;
  background-image: linear-gradient(180deg, #9a2525 0%, #7b0f0f 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

/* Dialog Konfirmasi — th “kosong”, latar & teks pada .sisfo-th-hdr */
#main_container table th.sisfo-th-wrap {
  padding: 0 !important;
  background: transparent !important;
  background-image: none !important;
  border: none !important;
  color: inherit !important;
  -webkit-text-fill-color: inherit !important;
}

table th.sisfo-th-wrap {
  padding: 0 !important;
  background: transparent !important;
  background-image: none !important;
  border: none !important;
}

.sisfo-th-hdr {
  background-color: #7b0f0f !important;
  background-image: linear-gradient(180deg, #9a2525 0%, #7b0f0f 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  padding: 10px 12px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
  display: block !important;
}

/* ---------- Layout responsif (lebar jendela / viewport) ---------- */
*,
*::before,
*::after {
  box-sizing: inherit;
}

#main_container {
  width: min(100%, calc(100vw - 24px)) !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}

/* Banner header mengikuti lebar kontainer */
#main_container .header0 {
  width: 100%;
  max-width: 100%;
}

#main_container .header1 {
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: clamp(72px, 22vw, 140px);
  background-size: cover !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  box-sizing: border-box;
}

#main_container .headerImg {
  max-width: 100%;
}

#main_container .headerImg img {
  max-width: 100%;
  height: auto;
}

/* Baris info login / menu: tidak overflow di layar sempit */
@media (max-width: 720px) {
  #main_container .NamaLogin,
  #main_container .WaktuServer,
  #main_container .MenuDirectory {
    float: none !important;
    width: 100%;
    max-width: 100%;
    text-align: center;
    margin-bottom: 6px;
  }
}

/* Konten modul: tabel lebar bisa scroll horizontal */
#main_container .isi {
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  box-sizing: border-box;
  padding-left: 2px;
  padding-right: 2px;
}

#main_container .isi center {
  display: block;
  max-width: 100%;
  overflow-x: auto;
}

#main_container .isi table,
#main_container .isi > table {
  max-width: 100% !important;
}

#main_container .isi table.box,
#main_container .isi table.bsc,
#main_container .isi table.menu {
  width: 100% !important;
  max-width: 100% !important;
  table-layout: auto;
  height: auto;
}

#main_container .isi table td,
#main_container .isi table th {
  overflow-wrap: anywhere;
  word-wrap: break-word;
}

/* Footer di luar #main_container */
body > .footer {
  width: 100%;
  max-width: 100vw;
  box-sizing: border-box;
}

/* ---------- BAA: Laporan Akademik (lapakd) ---------- */
#main_container .lapakd-modern .lapakd-list .lapakd-item {
  border-left: 3px solid transparent;
  transition: background-color 0.15s ease, border-color 0.15s ease;
}

#main_container .lapakd-modern .lapakd-list .lapakd-item:hover {
  background-color: #f8fafc;
  border-left-color: var(--sisfo-brand);
}

#main_container .lapakd-modern .lapakd-idx {
  min-width: 1.5rem;
  text-align: right;
}

#main_container .lapakd-modern a.lapakd-title {
  color: var(--sisfo-link);
  font-weight: 500;
}

#main_container .lapakd-modern a.lapakd-title:hover {
  color: var(--sisfo-brand);
  text-decoration: underline !important;
}

#main_container .lapakd-modern .lapakd-print:hover {
  border-color: var(--sisfo-brand);
  color: var(--sisfo-brand);
}

/* ---------- Keu: Laporan Keuangan (lapkeu) ---------- */
#main_container .lapkeu-modern .lapkeu-list .lapkeu-item {
  border-left: 3px solid transparent;
  transition: background-color 0.15s ease, border-color 0.15s ease;
}

#main_container .lapkeu-modern .lapkeu-list .lapkeu-item:hover {
  background-color: #f8fafc;
  border-left-color: var(--sisfo-brand);
}

#main_container .lapkeu-modern .lapkeu-idx {
  min-width: 1.5rem;
  text-align: right;
}

#main_container .lapkeu-modern a.lapkeu-title {
  color: var(--sisfo-link);
  font-weight: 500;
}

#main_container .lapkeu-modern a.lapkeu-title:hover {
  color: var(--sisfo-brand);
  text-decoration: underline !important;
}

#main_container .lapkeu-modern .lapkeu-print:hover {
  border-color: var(--sisfo-brand);
  color: var(--sisfo-brand);
}

#main_container .lapkeu-modern .lapkeu-acc-link:hover .lapkeu-acc-img {
  opacity: 0.92;
  transform: scale(1.03);
}

#main_container .lapkeu-modern .lapkeu-acc-img {
  transition: opacity 0.15s ease, transform 0.15s ease;
}

/* ---------- Hondok: Honor Dosen (tinggi baris + tengah vertikal, teks tidak terpotong) ---------- */
#main_container table.hondok-honor td,
#main_container table.hondok-honor th {
  vertical-align: middle;
}

#main_container table.hondok-honor .hondok-honor-row td.inp,
#main_container table.hondok-honor .hondok-honor-row td.ul {
  box-sizing: border-box;
  overflow: visible;
}

#main_container table.hondok-honor .hondok-honor-dosen {
  min-height: 5.5rem;
}

#main_container table.hondok-honor .hondok-honor-meta sup {
  line-height: 1.25;
  vertical-align: baseline;
}

#main_container table.hondok-honor .hondok-honor-nama {
  display: inline-block;
  padding-top: 2px;
}

/* Daftar TA (jur/ta): gelar & tanggal tanpa <sup> agar baris tidak bertumpuk */
#main_container table.box td .ta-cell-doc,
table.box td .ta-cell-doc {
  line-height: 1.45;
  min-width: 0;
  box-sizing: border-box;
}

#main_container table.box td .ta-cell-doc .ta-datum,
table.box td .ta-cell-doc .ta-datum {
  color: #d90606;
  font-size: 0.95em;
}

#main_container table.box td .ta-cell-doc .ta-gelar,
table.box td .ta-cell-doc .ta-gelar {
  color: #d90606;
  font-size: 0.9em;
  font-weight: normal;
  white-space: normal;
}

#main_container table.box td .ta-date-line,
table.box td .ta-date-line {
  display: block;
  line-height: 1.4;
  margin: 0.12em 0;
}

#main_container table.box td .ta-pemb-line,
table.box td .ta-pemb-line {
  display: block;
  line-height: 1.42;
  margin: 0.15em 0 0.2em;
}

#main_container table.box td .ta-pemb-extra,
table.box td .ta-pemb-extra {
  display: block;
  line-height: 1.45;
  margin: 0.15em 0 0.35em;
}

#main_container table.box td .ta-cell-doc hr,
table.box td .ta-cell-doc hr {
  margin: 0.35em 0;
}
