/*
 * zkoss_popup_menu_fix.css
 * Patch global untuk popup submenu ZKoss 5.5.
 *
 * Beberapa theme lama mengatur menu/sidebar dengan selector global seperti
 * .z-menubar-ver div dan .z-menu-item-cnt. Saat ZK membuat submenu popup,
 * rule tersebut ikut membuat popup melebar sampai hampir seluruh layar.
 * File ini harus dimuat paling akhir melalui MyThemeProvider.
 */

.z-menu-popup,
.z-menupopup {
	width: auto !important;
	min-width: 220px !important;
	max-width: 360px !important;
	left: auto;
	right: auto;
	box-sizing: border-box !important;
	overflow: hidden !important;
	z-index: 88000 !important;
}

.z-menu-popup .z-menu-popup-cnt,
.z-menupopup .z-menupopup-cnt,
.z-menu-popup-cnt {
	width: auto !important;
	min-width: 220px !important;
	max-width: 360px !important;
	box-sizing: border-box !important;
	overflow-x: hidden !important;
	overflow-y: auto !important;
	-webkit-overflow-scrolling: touch;
	overscroll-behavior: contain;
	touch-action: pan-y;
}

.z-menu-popup-cnt .z-menu,
.z-menu-popup-cnt .z-menu-item,
.z-menu-popup-cnt .z-menu-body,
.z-menu-popup-cnt .z-menu-item-body,
.z-menu-popup-cnt .z-menu-inner-m,
.z-menu-popup-cnt .z-menu-item-inner-m,
.z-menu-popup-cnt .z-menu-cnt,
.z-menu-popup-cnt .z-menu-item-cnt,
.z-menu-popup-cnt .z-menu-btn,
.z-menu-popup-cnt .z-menu-item-btn,
.z-menu-popup-cnt span:not(.z-menu-img):not(.z-menu-item-img),
.z-menu-popup-cnt a,
.z-menu-popup-cnt div {
	width: auto !important;
	max-width: 100% !important;
	box-sizing: border-box !important;
}

.z-menu-popup-cnt .z-menu .z-menu-img,
.z-menu-popup-cnt .z-menu-item .z-menu-item-img,
.z-menu-popup-cnt .z-menu-img,
.z-menu-popup-cnt .z-menu-item-img {
	display: inline-block !important;
	width: 14px !important;
	min-width: 14px !important;
	max-width: 14px !important;
	height: 14px !important;
	min-height: 14px !important;
	max-height: 14px !important;
	margin-left: -20px !important;
	margin-right: 6px !important;
	vertical-align: -2px !important;
	background-repeat: no-repeat !important;
	background-position: center center !important;
	background-size: 13px 13px !important;
}

.z-menu-popup-cnt .z-menu a.z-menu-cnt,
.z-menu-popup-cnt .z-menu-item a.z-menu-item-cnt,
.z-menu-popup-cnt .z-menu-btn,
.z-menu-popup-cnt .z-menu-item-btn {
	display: block !important;
	min-width: 220px !important;
	max-width: 360px !important;
	min-height: 27px !important;
	height: 27px !important;
	line-height: 25px !important;
	padding: 0 12px 0 28px !important;
	margin: 1px 0 !important;
	box-sizing: border-box !important;
	white-space: nowrap !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
	text-align: left !important;
	border: 1px solid rgba(255, 255, 255, 0.15) !important;
	border-radius: 5px !important;
	background: rgba(255, 255, 255, 0.10) !important;
	color: #ffffff !important;
	text-decoration: none !important;
}

.z-menu-popup-cnt .z-menu,
.z-menu-popup-cnt .z-menu-item {
	margin: 0 !important;
	padding: 0 !important;
	border-left: 0 !important;
	border-right: 0 !important;
}

/*
 * State hover/aktif diletakkan di berkas ini karena stylesheet ini dimuat
 * setelah CSS tenant. Latar gelap transparan menjaga kontras pada semua warna
 * tema dan indikator kiri memberi fokus tanpa menggeser ukuran item.
 */
.z-menu-popup-cnt .z-menu-over > .z-menu-cl > .z-menu-cr > .z-menu-cm > .z-menu-cnt,
.z-menu-popup-cnt .z-menu-item-over > .z-menu-item-cl > .z-menu-item-cr > .z-menu-item-cm > .z-menu-item-cnt,
.z-menu-popup-cnt .z-menu-over > .z-menu-body .z-menu-btn,
.z-menu-popup-cnt .z-menu-item-over > .z-menu-item-body .z-menu-item-btn,
.z-menu-popup-cnt .z-menu-body-over .z-menu-btn,
.z-menu-popup-cnt .z-menu-item-body-over .z-menu-item-btn,
.z-menu-popup-cnt .z-menu-cnt:hover,
.z-menu-popup-cnt .z-menu-item-cnt:hover,
.z-menu-popup-cnt .z-menu-btn:hover,
.z-menu-popup-cnt .z-menu-item-btn:hover,
.z-menu-popup-cnt .z-menu-over a.z-menu-cnt,
.z-menu-popup-cnt .z-menu-item-over a.z-menu-item-cnt,
.z-menu-popup-cnt li:hover a.z-menu-cnt,
.z-menu-popup-cnt li:hover a.z-menu-item-cnt,
.z-menu-popup-cnt .z-menu-over .z-menu-btn,
.z-menu-popup-cnt .z-menu-item-over .z-menu-item-btn,
.z-menu-popup-cnt .z-menu-body-seld .z-menu-btn,
.z-menu-popup-cnt .z-menu-body-clk .z-menu-btn,
.z-menu-popup .z-menu-over > .z-menu-cl > .z-menu-cr > .z-menu-cm > .z-menu-cnt,
.z-menu-popup .z-menu-item-over > .z-menu-item-cl > .z-menu-item-cr > .z-menu-item-cm > .z-menu-item-cnt,
.z-menu-popup .z-menu-cnt:hover,
.z-menu-popup .z-menu-item-cnt:hover {
	min-height: 27px !important;
	height: 27px !important;
	line-height: 25px !important;
	padding: 0 12px 0 28px !important;
	margin: 1px 0 !important;
	box-sizing: border-box !important;
	background-color: rgba(15, 23, 42, 0.48) !important;
	background-image: none !important;
	border: 1px solid rgba(255, 255, 255, 0.42) !important;
	border-radius: 5px !important;
	box-shadow: inset 3px 0 0 rgba(255, 255, 255, 0.92) !important;
	color: #ffffff !important;
	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.38) !important;
	transform: none !important;
}

.z-menu-popup-cnt .z-menu-over .z-menu-cnt,
.z-menu-popup-cnt .z-menu-item-over .z-menu-item-cnt,
.z-menu-popup-cnt .z-menu-over .z-menu-btn,
.z-menu-popup-cnt .z-menu-item-over .z-menu-item-btn,
.z-menu-popup-cnt .z-menu-over .z-label,
.z-menu-popup-cnt .z-menu-item-over .z-label {
	color: #ffffff !important;
}

@media (max-width: 480px) {
	.z-menu-popup,
	.z-menupopup,
	.z-menu-popup .z-menu-popup-cnt,
	.z-menupopup .z-menupopup-cnt,
	.z-menu-popup-cnt {
		min-width: 210px !important;
		max-width: 92vw !important;
		max-height: 68vh !important;
	}

	.z-menu-popup-cnt .z-menu a.z-menu-cnt,
	.z-menu-popup-cnt .z-menu-item a.z-menu-item-cnt,
	.z-menu-popup-cnt .z-menu-btn,
	.z-menu-popup-cnt .z-menu-item-btn {
		min-width: 210px !important;
		max-width: 92vw !important;
		touch-action: manipulation;
	}
}

/* ======================================================================
   UKURAN KOTAK WAJIB SAMA DI SEMUA KEADAAN (patch 2026-09-17)

   Gejala: teks item menu TURUN beberapa piksel saat di-hover atau saat
   item sedang terpilih/terbuka.

   Sebab: CSS bawaan ZK (zul.jar -> web/js/zul/menu/css/menu.css.dsp)
   menukar padding dengan border antar-keadaan, dan pertukaran itu netral
   SELAMA keduanya utuh:
       .z-menu-popup-cnt .z-menu       { padding:1px; }            <- normal, tanpa border
       .z-menu-popup-cnt .z-menu-over  { padding:0; border:1px; }  <- hover
   Berkas ini (blok di atas) memaksa padding:0 pada KEDUA keadaan namun
   hanya menghapus border kiri-kanan, sehingga pada keadaan hover tersisa
   border ATAS dan BAWAH masing-masing 1px: item bertambah tinggi 2px dan
   isinya ikut turun.

   Perbaikan: border dinolkan di semua keadaan. Penanda fokus tetap ada
   lewat box-shadow inset pada blok hover di atas, yang tidak memakan
   ruang sehingga tidak menggeser apa pun.
   ====================================================================== */
.z-menu-popup-cnt .z-menu,
.z-menu-popup-cnt .z-menu-item,
.z-menu-popup-cnt .z-menu-separator,
.z-menu-popup-cnt .z-menu-over,
.z-menu-popup-cnt .z-menu-item-over,
.z-menu-popup-cnt .z-menu:hover,
.z-menu-popup-cnt .z-menu-item:hover,
html body .z-menu-popup-cnt li.z-menu,
html body .z-menu-popup-cnt li.z-menu-item,
html body .z-menu-popup-cnt li.z-menu-over,
html body .z-menu-popup-cnt li.z-menu-item-over,
html body .z-menu-popup-cnt li.z-menu:hover,
html body .z-menu-popup-cnt li.z-menu-item:hover,
.z-menu-popup-cnt .z-menu-cl,
.z-menu-popup-cnt .z-menu-cr,
.z-menu-popup-cnt .z-menu-cm,
.z-menu-popup-cnt .z-menu-item-cl,
.z-menu-popup-cnt .z-menu-item-cr,
.z-menu-popup-cnt .z-menu-item-cm {
	border: 0 !important;
	padding: 0 !important;
	margin: 0 !important;
	background: transparent !important;
	background-image: none !important;
	box-shadow: none !important;
}

/* Metrik vertikal tombol/tautan item popup identik di keadaan normal, hover,
   over, terpilih (-seld), dan sedang dibuka (-clk). */
.z-menu-popup-cnt .z-menu a.z-menu-cnt,
.z-menu-popup-cnt .z-menu-item a.z-menu-item-cnt,
.z-menu-popup-cnt .z-menu a.z-menu-cnt:hover,
.z-menu-popup-cnt .z-menu-item a.z-menu-item-cnt:hover,
.z-menu-popup-cnt .z-menu-over a.z-menu-cnt,
.z-menu-popup-cnt .z-menu-item-over a.z-menu-item-cnt,
.z-menu-popup-cnt .z-menu-btn,
.z-menu-popup-cnt .z-menu-item-btn,
.z-menu-popup-cnt .z-menu-btn:hover,
.z-menu-popup-cnt .z-menu-item-btn:hover,
.z-menu-popup-cnt .z-menu-over .z-menu-btn,
.z-menu-popup-cnt .z-menu-item-over .z-menu-item-btn,
.z-menu-popup-cnt .z-menu-body-over .z-menu-btn,
.z-menu-popup-cnt .z-menu-body-seld .z-menu-btn,
.z-menu-popup-cnt .z-menu-body-clk .z-menu-btn {
	min-height: 27px !important;
	height: 27px !important;
	line-height: 25px !important;
	padding: 0 12px 0 28px !important;
	border-width: 1px !important;
	margin: 1px 0 !important;
	box-sizing: border-box !important;
}

/* Mega menu (main-responsive-menu-popup, struktur z-menubar-ver): tombolnya
   memakai metrik ZK bawaan (padding-top:3px, padding-bottom:2px). Keadaan
   over/seld/clk tidak boleh mengubahnya. */
html body .main-responsive-menu-popup .z-menubar-ver .z-menu-btn,
html body .main-responsive-menu-popup .z-menubar-ver .z-menu-item-btn,
html body .main-responsive-menu-popup .z-menubar-ver .z-menu-body-over .z-menu-btn,
html body .main-responsive-menu-popup .z-menubar-ver .z-menu-body-seld .z-menu-btn,
html body .main-responsive-menu-popup .z-menubar-ver .z-menu-body-clk .z-menu-btn,
html body .main-responsive-menu-popup .z-menubar-ver .z-menu-item-body-over .z-menu-item-btn {
	padding-top: 3px !important;
	padding-bottom: 2px !important;
	border-width: 0 !important;
	margin: 0 !important;
}

/* ZK menambah padding-right 3px -> 8px pada div pembungkus saat submenu
   dibuka (-clk), sehingga teks bergeser MENDATAR. Samakan juga. */
html body .main-responsive-menu-popup .z-menubar-ver .z-menu-inner-m > div,
html body .main-responsive-menu-popup .z-menubar-ver .z-menu-body-clk .z-menu-inner-m > div,
html body .main-responsive-menu-popup .z-menubar-ver .z-menu-body-clk-over .z-menu-inner-m > div {
	padding-right: 3px !important;
}

/* ======================================================================
   PATCH GLOBAL: Z-INDEX POPUP, BACKDROP, DAN MODAL DI ATAS HEADER
   File ini dimuat paling akhir oleh MyThemeProvider, sehingga aturan di bawah
   menang atas semua CSS tenant perguruan tinggi.
   ====================================================================== */
.ais-af-backdrop,
.ecampus-filter-popup-mask {
	z-index: 100001 !important;
}

.ais-af-panel,
.ais-filter-lanjut-overlay,
.ais-filter-lanjut-panel,
.ais-legacy-filter-overlay,
.ecampus-filter-popup-window {
	z-index: 100002 !important;
}

/* Di dalam overlay filter (.ais-legacy-filter-overlay & .ais-filter-lanjut-overlay):
   Backdrop berada di belakang form/kartu (z-index: 0),
   kartu/body form berada di depan (z-index: 1),
   dan tombol tutup berada di paling atas (z-index: 2). */
.ais-legacy-filter-backdrop,
.ais-filter-lanjut-backdrop {
	z-index: 0 !important;
}

.ais-legacy-filter-overlay > .ecampus-zul-filter-window-body,
.ais-legacy-filter-overlay > .z-vbox,
.ais-filter-lanjut-panel {
	z-index: 1 !important;
}

.ais-legacy-filter-close {
	z-index: 2 !important;
}

.z-modal-mask {
	z-index: 99990 !important;
}

.z-window-modal,
.z-window-highlighted,
.z-window-popup,
.z-window-overlapped {
	z-index: 99995 !important;
}

/* Panel dropdown pilihan (Combobox, Bandbox, Datebox, Timebox)
   harus selalu berada di atas overlay filter dan modal */
.z-bandbox-shadow,
.z-combobox-shadow,
.z-datebox-shadow,
.z-timebox-shadow,
.z-bandbox-pp,
.z-combobox-pp,
.z-datebox-pp,
.z-timebox-pp,
.z-bandpopup {
	z-index: 199999 !important;
}

/* Saat popup, filter lanjut, atau modal terbuka, turunkan z-index header */
body.ais-af-open .headerHbox,
body.ais-af-open .main-responsive-header,
body.ais-af-open .gridHeader,
body.ais-af-open .main-responsive-module-row,
body:has(.ais-af-panel.active) .main-responsive-header,
body:has(.ais-af-panel.active) .headerHbox,
body:has(.ais-filter-lanjut-panel.active) .main-responsive-header,
body:has(.ais-filter-lanjut-panel.active) .headerHbox,
body:has(.z-modal-mask) .main-responsive-header,
body:has(.z-modal-mask) .headerHbox,
body:has(.z-modal-mask) .gridHeader {
	z-index: 1 !important;
}

