/* BEEang PWA + penyempurnaan mobile (0.9.92). Dimuat setelah mobile.css. */
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { -webkit-tap-highlight-color: transparent; }
img, video, svg { max-width: 100%; }

/* Layar berponi / bilah gestur saat dipasang sebagai aplikasi. */
@media (display-mode: standalone) {
	body { padding-bottom: env(safe-area-inset-bottom, 0); overscroll-behavior-y: contain; }
	body.beeang-hub-workspace-page .bh-top { padding-top: calc(10px + env(safe-area-inset-top, 0px)) !important; }
}

/* iOS memperbesar layar bila font input < 16px; cegah di layar sentuh. */
@media (max-width: 860px) {
	input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
	select, textarea { font-size: 16px !important; }
	button, .button, [type="submit"], .beeang-learning__button, .bh-menu-btn { min-height: 44px; }
	/* Tabel lebar boleh digulir di dalam kartu, bukan melebarkan seluruh halaman. */
	.beeang-hub table, .beeang-learning table, .beeang-event-shell table { display: block; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
}

/* Spanduk pasang / pembaruan / offline. */
.bpwa-bar, .bpwa-offline {
	position: fixed; left: 12px; right: 12px; z-index: 99999;
	bottom: calc(12px + env(safe-area-inset-bottom, 0px));
	display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
	max-width: 560px; margin: 0 auto; padding: 12px 14px;
	border-radius: 16px; background: #18364b; color: #fff;
	font: 14px/1.4 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	box-shadow: 0 10px 30px rgba(10, 30, 45, .28);
}
.bpwa-offline { bottom: auto; top: calc(10px + env(safe-area-inset-top, 0px)); background: #8a6500; justify-content: center; text-align: center; }
.bpwa-msg { flex: 1 1 200px; }
.bpwa-actions { display: inline-flex; gap: 8px; }
.bpwa-btn {
	min-height: 40px; padding: 8px 16px; border: 0; border-radius: 999px; cursor: pointer;
	background: #01688e; color: #fff; font: inherit; font-weight: 600;
}
.bpwa-ghost { background: transparent; color: #fff; border: 1px solid rgba(255, 255, 255, .45); }
@media print { .bpwa-bar, .bpwa-offline { display: none !important; } }

/* 0.9.319: pop-up pengumuman baru di tengah layar. */
.bpwa-modal-wrap{position:fixed;inset:0;z-index:100000;display:flex;align-items:center;justify-content:center;padding:20px;background:rgba(10,30,45,.45);font:14px/1.45 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
.bpwa-modal{width:100%;max-width:480px;max-height:calc(100vh - 40px);overflow:auto;background:#fff;color:#191970;border-radius:20px;padding:26px 26px 22px;box-shadow:0 24px 60px rgba(10,30,45,.35);box-sizing:border-box}
.bpwa-modal__eyebrow{font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#01688e}
.bpwa-modal__title{margin:6px 0 14px;font-size:22px;font-weight:800;color:#191970;line-height:1.25}
.bpwa-modal__list{list-style:none;margin:0 0 20px;padding:0;display:grid;gap:8px}
.bpwa-modal__item{padding:12px 14px;border-radius:12px;background:#F3F6F9;color:#191970;font-weight:600;overflow-wrap:anywhere}
.bpwa-modal__more{padding:4px 14px;font-size:13px;color:#708090}
.bpwa-modal__actions{display:flex;justify-content:flex-end;gap:10px;flex-wrap:wrap}
.bpwa-modal .bpwa-btn{background:#191970;color:#fff}
.bpwa-modal .bpwa-ghost{background:transparent;color:#191970;border:1px solid #C5CFD9}
@media (max-width:480px){.bpwa-modal{padding:20px}.bpwa-modal__actions .bpwa-btn{flex:1 1 auto}}

/* 0.9.319: lonceng topbar. Aturan di sini berlaku di semua halaman Hub (termasuk Pengumuman),
   tidak bergantung pada wrapper .beeang-hub--workspace. Panel tertutup saat atribut hidden ada. */
.bh-bellwrap{position:relative;display:inline-block}
.bh-bell{position:relative;width:40px;height:40px;display:inline-grid;place-items:center;padding:0;border:1px solid var(--line,#DCE3EA);border-radius:12px;background:var(--card,#fff);color:var(--ink,#191970);cursor:pointer}
.bh-bell svg{width:20px;height:20px;stroke:currentColor}
.bh-bell__badge{position:absolute;top:-6px;right:-6px;min-width:19px;height:19px;padding:0 5px;border-radius:99px;background:#E5484D;color:#fff;font-size:10.5px;font-weight:800;display:grid;place-items:center;line-height:1}
.bh-bell__panel[hidden]{display:none !important}
.bh-bell__panel{position:absolute;top:calc(100% + 8px);right:0;width:300px;max-width:calc(100vw - 32px);box-sizing:border-box;background:var(--card,#fff);color:var(--ink,#191970);border:1px solid var(--line,#DCE3EA);border-radius:14px;box-shadow:0 12px 32px rgba(10,30,45,.18);padding:12px;z-index:60;text-align:left;font:14px/1.4 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
.bh-bell__hd{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:4px 4px 10px;margin-bottom:6px;border-bottom:1px solid var(--line,#DCE3EA)}
.bh-bell__hd b{font-weight:700}
.bh-bell__hd span{font-size:12px;color:var(--mut,#708090);white-space:nowrap}
.bh-bell__it{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px;border-radius:10px;color:var(--ink,#191970);font-size:13px;font-weight:600;text-decoration:none}
.bh-bell__it:hover{background:var(--soft,#F3F6F9);color:var(--teal,#01688e)}
.bh-bell__it span{text-decoration:none}
.bh-bell__it em{font-style:normal;font-size:11px;font-weight:800;padding:2px 9px;border-radius:99px;background:rgba(226,114,91,.15);color:#9E3F2A;white-space:nowrap}
.bh-bell__empty{margin:0;padding:14px 8px;text-align:center;color:var(--mut,#708090);font-size:13px}

/* 0.9.321: kotak konfirmasi (hapus). */
.bpwa-modal--sm{max-width:400px}
.bpwa-modal__text{margin:0 0 20px;font-size:15px;line-height:1.5;color:#191970}
.bpwa-modal .bpwa-btn.bpwa-btn--danger{background:#9E3F2A;color:#fff;border:0}
