/*!
 * Harian Aceh Member Hub — pil notifikasi berita terbaru (publik).
 * Mandiri (tidak bergantung pada CSS tema), mendukung mode gelap.
 */
.hamh-nw {
	--nw-bg: rgba(255, 255, 255, .94);
	--nw-solid: #ffffff;
	--nw-ink: #1e2a4a;
	--nw-ink-2: #5a6385;
	--nw-line: rgba(30, 42, 74, .1);
	--nw-accent: #e2463c;
	--nw-btn: #1e2a4a;
	--nw-btn-ink: #ffffff;
	--nw-hover: #f3f5fb;
	--nw-shadow: 0 18px 44px -18px rgba(30, 42, 74, .45), 0 2px 6px rgba(30, 42, 74, .06);
	position: fixed; left: 50%; top: 14px; z-index: 1000001;
	width: max-content; max-width: min(560px, calc(100vw - 24px));
	transform: translateX(-50%);
	font: 400 14px/1.4 "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
	color: var(--nw-ink);
	-webkit-font-smoothing: antialiased;
	color-scheme: light;
}
.admin-bar .hamh-nw { top: 46px; }
.hamh-nw[hidden] { display: none !important; }
.hamh-nw.is-dark {
	--nw-bg: rgba(23, 28, 43, .92);
	--nw-solid: #171c2b;
	--nw-ink: #eef0f8;
	--nw-ink-2: #a7aecb;
	--nw-line: rgba(255, 255, 255, .09);
	--nw-btn: #eef0f8;
	--nw-btn-ink: #121625;
	--nw-hover: #1f2538;
	--nw-shadow: 0 22px 50px -18px rgba(0, 0, 0, .85), 0 0 0 1px rgba(255, 255, 255, .05);
	color-scheme: dark;
}
.hamh-nw *, .hamh-nw *::before, .hamh-nw *::after { box-sizing: border-box; }
.hamh-nw.is-in { animation: hamh-nw-in .55s cubic-bezier(.2, .9, .3, 1.25); }
@keyframes hamh-nw-in { from { opacity: 0; transform: translate(-50%, -24px) scale(.96); } to { opacity: 1; transform: translate(-50%, 0) scale(1); } }

.hamh-nw-pill {
	display: flex; align-items: center; gap: 6px; padding: 6px;
	background: var(--nw-bg); border: 1px solid var(--nw-line); border-radius: 999px;
	box-shadow: var(--nw-shadow);
	-webkit-backdrop-filter: blur(14px) saturate(1.4); backdrop-filter: blur(14px) saturate(1.4);
}
.hamh-nw button { font: inherit; color: inherit; margin: 0; letter-spacing: 0; text-transform: none; line-height: 1.2; box-shadow: none; min-height: 0; min-width: 0; }
.hamh-nw .hamh-nw-main {
	display: flex; align-items: center; gap: 10px; min-width: 0; flex: 1 1 auto;
	padding: 4px 10px 4px 6px; border: 0; border-radius: 999px; background: transparent; cursor: pointer; text-align: left;
}
.hamh-nw .hamh-nw-main:hover { background: var(--nw-hover); }
.hamh-nw-live { position: relative; flex: none; width: 10px; height: 10px; margin-left: 6px; border-radius: 50%; background: var(--nw-accent); }
.hamh-nw-live::after { content: ""; position: absolute; inset: -4px; border-radius: 50%; border: 2px solid var(--nw-accent); opacity: 0; animation: hamh-nw-ping 1.8s ease-out infinite; }
@keyframes hamh-nw-ping { 0% { transform: scale(.5); opacity: .8; } 100% { transform: scale(1.6); opacity: 0; } }
.hamh-nw-thumbs { display: flex; flex: none; }
.hamh-nw-thumbs i { display: grid; place-items: center; width: 32px; height: 32px; margin-left: -10px; border-radius: 50%; overflow: hidden; background: var(--nw-hover); border: 2px solid var(--nw-solid); font-style: normal; font-size: 15px; }
.hamh-nw-thumbs i:first-child { margin-left: 0; }
.hamh-nw-thumbs img { width: 100%; height: 100%; object-fit: cover; display: block; }
.hamh-nw-txt { display: grid; min-width: 0; }
.hamh-nw-txt b { font-weight: 700; font-size: 14px; white-space: nowrap; }
.hamh-nw-txt small { font-size: 12px; color: var(--nw-ink-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 300px; }
.hamh-nw-chev { flex: none; opacity: .55; transition: transform .25s; }
.hamh-nw.is-open .hamh-nw-chev { transform: rotate(180deg); }
.hamh-nw .hamh-nw-go {
	position: relative; overflow: hidden; flex: none; display: inline-flex; align-items: center; gap: 6px;
	height: 38px; padding: 0 16px; border: 0; border-radius: 999px; cursor: pointer;
	background: var(--nw-btn); color: var(--nw-btn-ink); font-weight: 700; font-size: 13.5px;
	transition: transform .15s, opacity .2s;
}
.hamh-nw .hamh-nw-go:hover { transform: translateY(-1px); }
.hamh-nw .hamh-nw-go:active { transform: scale(.96); }
.hamh-nw .hamh-nw-go svg { transition: transform .5s; }
.hamh-nw .hamh-nw-go:hover svg { transform: rotate(180deg); }
.hamh-nw.is-count .hamh-nw-go { background: var(--nw-accent); color: #fff; }
.hamh-nw.is-count .hamh-nw-go svg { animation: hamh-nw-spin 1s linear infinite; }
@keyframes hamh-nw-spin { to { transform: rotate(360deg); } }
.hamh-nw .hamh-nw-x { flex: none; width: 30px; height: 30px; padding: 0; border: 0; border-radius: 50%; background: transparent; cursor: pointer; font-size: 20px; line-height: 1; color: var(--nw-ink-2); }
.hamh-nw .hamh-nw-x:hover { background: var(--nw-hover); color: var(--nw-ink); }

.hamh-nw-panel {
	margin-top: 8px; padding: 6px; max-height: min(64vh, 460px); overflow: auto; overscroll-behavior: contain;
	background: var(--nw-solid); border: 1px solid var(--nw-line); border-radius: 22px; box-shadow: var(--nw-shadow);
	animation: hamh-nw-drop .22s ease;
}
.hamh-nw-panel[hidden] { display: none !important; }
@keyframes hamh-nw-drop { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
.hamh-nw a.hamh-nw-item { display: flex; gap: 12px; align-items: center; padding: 9px; border-radius: 15px; color: var(--nw-ink); text-decoration: none; transition: background .2s; }
.hamh-nw a.hamh-nw-item:hover { background: var(--nw-hover); color: var(--nw-ink); }
.hamh-nw-img { flex: none; display: grid; place-items: center; width: 64px; height: 48px; border-radius: 11px; overflow: hidden; background: var(--nw-hover); font-size: 20px; }
.hamh-nw-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.hamh-nw-it { display: grid; gap: 3px; min-width: 0; }
.hamh-nw-it small { font-size: 11.5px; font-weight: 600; color: var(--nw-accent); letter-spacing: .02em; }
.hamh-nw-it b { font-size: 14.5px; font-weight: 650; line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.hamh-nw-more { margin: 4px 10px 6px; font-size: 12.5px; color: var(--nw-ink-2); }
.hamh-nw-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 4px; padding: 10px 10px 6px; border-top: 1px solid var(--nw-line); font-size: 12px; color: var(--nw-ink-2); }
.hamh-nw-opt { display: inline-flex; align-items: center; gap: 7px; cursor: pointer; }
.hamh-nw-opt[hidden] { display: none; }
.hamh-nw-opt input { margin: 0; accent-color: var(--nw-accent); width: 15px; height: 15px; }
.hamh-nw-brand { font-weight: 700; opacity: .7; margin-left: auto; }

/* Sorotan berita baru setelah dimuat ulang */
a.hamh-nw-hl { position: relative; border-radius: 6px; box-shadow: 0 0 0 3px rgba(226, 70, 60, .35); animation: hamh-nw-glow 1.6s ease-in-out 3; transition: box-shadow 1.2s; }
a.hamh-nw-hl::before { content: "BARU"; position: absolute; z-index: 3; top: -9px; left: -4px; padding: 2px 6px; border-radius: 6px; background: #e2463c; color: #fff; font: 800 9.5px/1.3 system-ui, sans-serif; letter-spacing: .08em; pointer-events: none; transition: opacity 1.2s; }
a.hamh-nw-hl.is-fade { box-shadow: 0 0 0 3px rgba(226, 70, 60, 0); }
a.hamh-nw-hl.is-fade::before { opacity: 0; }
@keyframes hamh-nw-glow { 50% { box-shadow: 0 0 0 7px rgba(226, 70, 60, .12); } }

.hamh-nw-done {
	position: fixed; left: 50%; top: 16px; z-index: 1000001; transform: translateX(-50%);
	display: flex; align-items: center; gap: 8px; padding: 10px 18px; border-radius: 999px;
	background: #1e2a4a; color: #fff; font: 600 13.5px/1.2 "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	box-shadow: 0 16px 40px -16px rgba(30, 42, 74, .6); animation: hamh-nw-in .5s cubic-bezier(.2, .9, .3, 1.25); transition: opacity .35s, transform .35s;
}
.hamh-nw-done.is-dark { background: #eef0f8; color: #121625; }
.hamh-nw-done span { display: grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; background: #22a06b; color: #fff; font-size: 12px; }
.hamh-nw-done.is-out { opacity: 0; transform: translate(-50%, -10px); }
.admin-bar .hamh-nw-done { top: 48px; }

@media (max-width: 600px) {
	/* Di atas layar: tidak bertabrakan dengan widget melayang tema (bahasa, chat, kembali-ke-atas) di bawah. */
	.hamh-nw { top: calc(10px + env(safe-area-inset-top)); left: 10px; right: 10px; width: auto; max-width: none; transform: none; z-index: 2147483000; }
	.admin-bar .hamh-nw { top: 56px; }
	.hamh-nw.is-in { animation-name: hamh-nw-down; }
	@keyframes hamh-nw-down { from { opacity: 0; transform: translateY(-26px); } to { opacity: 1; transform: none; } }
	.hamh-nw-pill { border-radius: 22px; }
	.hamh-nw-txt small { max-width: none; }
	.hamh-nw-thumbs i:nth-child(n+3) { display: none; }
	.hamh-nw .hamh-nw-go { padding: 0 13px; }
	.hamh-nw-panel { max-height: 62vh; }
	.hamh-nw-done { top: calc(12px + env(safe-area-inset-top)); white-space: nowrap; }
	.admin-bar .hamh-nw-done { top: 58px; }
}
@media (prefers-reduced-motion: reduce) {
	.hamh-nw, .hamh-nw *, .hamh-nw-done, a.hamh-nw-hl { animation: none !important; transition: none !important; }
}
@media print { .hamh-nw, .hamh-nw-done { display: none !important; } }
