/*
 * 0.9.95 · Sidebar EO mengikuti gaya sidebar Peserta: kartu profil, menu lipat, item aktif dengan ikon kuning.
 * Diturunkan dari bagian 11a dan 14 participant-redesign.css; dibatasi ke .beeang-account-sidebar--organizer
 * sehingga berlaku di dashboard EO dan di halaman Kelola Pelatihan/Materi tanpa bergantung pada kelas body.
 */
/* 11a. (0.9.74) Sidebar peserta: tombol lipat plain untuk BEEang Learning dan Akun; item aktif transparan dengan ikon kuning. */
body .beeang-account-sidebar--organizer .beeang-account-sidebar__fold {
	margin: 10px 0 4px;
}

body .beeang-account-sidebar--organizer .beeang-account-sidebar__fold-toggle {
	display: flex;
	align-items: center;
	justify-content: space-between;
	min-height: 38px;
	margin: 0 0 4px;
	padding: 9px 12px;
	border-radius: 10px;
	background: rgba(255, 255, 255, .07);
	color: #fff;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .02em;
	cursor: pointer;
	list-style: none;
}

body .beeang-account-sidebar--organizer .beeang-account-sidebar__fold-toggle::-webkit-details-marker {
	display: none;
}

body .beeang-account-sidebar--organizer .beeang-account-sidebar__fold-toggle::after {
	content: "";
	flex: 0 0 auto;
	width: 6px;
	height: 6px;
	margin-left: 10px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	opacity: .8;
	transform: rotate(45deg);
	transition: transform .2s ease;
}

body .beeang-account-sidebar--organizer .beeang-account-sidebar__fold-toggle:hover {
	background: rgba(255, 255, 255, .12);
}

body .beeang-account-sidebar--organizer .beeang-account-sidebar__fold:not([open]) > .beeang-account-sidebar__fold-toggle::after {
	transform: rotate(-45deg);
}

body .beeang-account-sidebar.beeang-account-sidebar--organizer .beeang-account-sidebar__body > a,
body .beeang-account-sidebar.beeang-account-sidebar--organizer .beeang-account-sidebar__body > .beeang-account-sidebar__item {
	display: flex;
	min-height: 42px;
	align-items: center;
	gap: 12px;
	margin: 0 0 2px;
	padding: 0 12px;
	border-radius: 10px;
	color: #fff;
	font-size: 13px;
	font-weight: 600;
	text-decoration: none;
}

body .beeang-account-sidebar.beeang-account-sidebar--organizer .beeang-account-sidebar__body > .beeang-account-sidebar__item {
	color: rgba(255, 255, 255, .56);
}

body .beeang-account-sidebar.beeang-account-sidebar--organizer .beeang-account-sidebar__body > a:hover {
	background: rgba(255, 255, 255, .08);
}

/* ============================================================
   14. (0.9.77) Kartu profil di atas sidebar peserta: foto, nama, email, ikon kamera.
   ============================================================ */
body .beeang-account-sidebar--organizer .beeang-account-sidebar__profile {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 4px;
	margin: 0 6px 14px;
	padding: 6px 8px 18px;
	border-bottom: 1px solid rgba(255, 255, 255, .15);
	text-align: center;
}

body .beeang-account-sidebar--organizer .beeang-account-sidebar__avatar {
	position: relative;
	width: 88px;
	height: 88px;
	margin-bottom: 8px;
}

body .beeang-account-sidebar--organizer .beeang-account-sidebar__avatar-img {
	display: block;
	width: 88px;
	height: 88px;
	border: 3px solid rgba(255, 255, 255, .85);
	border-radius: 50%;
	background: #dbeaf0;
	object-fit: cover;
	box-shadow: 0 6px 16px rgba(0, 0, 0, .22);
}

body .beeang-account-sidebar--organizer .beeang-account-sidebar__avatar-edit {
	position: absolute;
	right: -2px;
	bottom: 2px;
	display: grid;
	width: 28px;
	height: 28px;
	place-items: center;
	border: 2px solid #124863;
	border-radius: 50%;
	background: #f2be1d;
	color: #124863;
	text-decoration: none;
}

body .beeang-account-sidebar--organizer .beeang-account-sidebar__avatar-edit .dashicons {
	width: 15px;
	height: 15px;
	font-size: 15px;
}

body .beeang-account-sidebar--organizer .beeang-account-sidebar__avatar-edit:hover,
body .beeang-account-sidebar--organizer .beeang-account-sidebar__avatar-edit:focus-visible {
	background: #fff;
}

body .beeang-account-sidebar--organizer .beeang-account-sidebar__name {
	max-width: 100%;
	overflow: hidden;
	color: #fff;
	font-size: 16px;
	font-weight: 800;
	text-overflow: ellipsis;
	white-space: nowrap;
}

body .beeang-account-sidebar--organizer .beeang-account-sidebar__email {
	max-width: 100%;
	overflow: hidden;
	color: rgba(255, 255, 255, .7);
	font-size: 12px;
	text-overflow: ellipsis;
	white-space: nowrap;
}


body .beeang-account-sidebar--organizer .beeang-account-sidebar__role {
	display: inline-block;
	margin-top: 8px;
	padding: 3px 12px;
	border-radius: 999px;
	background: rgba(242, 189, 24, .16);
	color: #f2bd18;
	font-size: 11px;
	font-weight: 800;
	letter-spacing: .04em;
}
body .beeang-account-sidebar--organizer .beeang-account-sidebar__body {
	display: grid;
	gap: 0;
	padding: 2px 0 0;
}

/* 0.9.101 · Item tingkat atas (Dashboard, Buat Event, Event Saya, Kompetisi, Keluar) disamakan dengan item di dalam menu lipat:
   ukuran huruf 13px, tinggi 42px, jarak ikon 12px, serta ikon kuning saat aktif. */
body .beeang-account-sidebar.beeang-account-sidebar--organizer nav > a:not(.beeang-account-sidebar__logout),
body .beeang-account-sidebar.beeang-account-sidebar--organizer nav > .beeang-account-sidebar__item {
	display: flex;
	min-height: 42px;
	align-items: center;
	gap: 12px;
	margin: 0 0 2px;
	padding: 0 12px;
	border-radius: 10px;
	color: #fff;
	font-size: 13px;
	font-weight: 600;
	text-decoration: none;
}

body .beeang-account-sidebar.beeang-account-sidebar--organizer nav > a:not(.beeang-account-sidebar__logout):hover {
	background: rgba(255, 255, 255, .08);
}

body .beeang-account-sidebar.beeang-account-sidebar--organizer nav > a.is-active,
body .beeang-account-sidebar.beeang-account-sidebar--organizer .beeang-account-sidebar__body > a.is-active {
	background: transparent;
	color: #fff;
	font-weight: 700;
}

body .beeang-account-sidebar.beeang-account-sidebar--organizer nav > a.is-active svg,
body .beeang-account-sidebar.beeang-account-sidebar--organizer nav > a.is-active .dashicons,
body .beeang-account-sidebar.beeang-account-sidebar--organizer .beeang-account-sidebar__body > a.is-active svg,
body .beeang-account-sidebar.beeang-account-sidebar--organizer .beeang-account-sidebar__body > a.is-active .dashicons {
	color: #f2bd18;
}

body .beeang-account-sidebar.beeang-account-sidebar--organizer nav > a.beeang-account-sidebar__logout {
	display: flex;
	min-height: 42px;
	align-items: center;
	gap: 12px;
	padding: 14px 12px 0;
	font-size: 13px;
	font-weight: 600;
}

/* 0.9.102 · Halaman EO di luar Dashboard (Profil Penyelenggara, Kelola Pelatihan/Materi, dst.) memakai kerangka yang sama
   dengan Dashboard EO dan Profil Peserta: kontainer 1560px, sidebar 272px, header sejajar dengan kontainer.
   Sebelumnya halaman ini jatuh ke aturan dasar (kontainer 1240px, sidebar 230px) sehingga tampak lebih sempit. */
@media (min-width: 651px) {
	body.beeang-hub-auth-page:has(.beeang-account-layout--organizer) .beeang-account-dashboard {
		width: min(1360px, calc(100% - 48px));
	}

	body.beeang-hub-auth-page:has(.beeang-account-layout--organizer) .beeang-site-header__inner {
		width: min(1360px, calc(100% - 48px));
		max-width: none;
	}
}

/* 0.9.103 · Profil Penyelenggara: kartu profil memenuhi lebar konten (tanpa batas 1060px dan tengah otomatis),
   sehingga tidak ada celah antara sidebar dan konten; sama seperti Profil Peserta. */
body.beeang-hub-auth-page:has(.beeang-account-layout--organizer) .beeang-profile-editor {
	max-width: none;
	margin: 0;
}

/* ============================================================
   0.9.106 · SATU SPESIFIKASI SIDEBAR untuk Peserta dan EO, di semua halaman (/akun/, Profil, Kelola Pelatihan/Materi).
   Sebelumnya tiap halaman memakai aturan berbeda (lebar 230/272/280px, padding 22/24px, static vs sticky, warna datar vs gradasi),
   sehingga tampilan berubah-ubah. Selektor #beeang-account-sidebar sengaja dipakai agar menang atas aturan per-halaman lama.
   Nilai: lebar kolom 272px, jarak 24px, padding 24px 12px, radius 24px, gradasi navy, statis (ikut scroll halaman bersama konten, tanpa scroll sendiri).
   ============================================================ */
@media (min-width: 901px) {
	html body.beeang-hub-auth-page .beeang-account-layout[class*="beeang-account-layout--"] {
		grid-template-columns: 272px minmax(0, 1fr);
		gap: 24px;
		align-items: start;
	}
}

@media (min-width: 651px) {
	html body.beeang-hub-auth-page .beeang-account-dashboard {
		width: min(1360px, calc(100% - 48px));
	}

	html body #beeang-account-sidebar {
		position: static;
		top: auto;
		align-self: start;
		box-sizing: border-box;
		height: auto;
		min-height: 0;
		max-height: none;
		overflow: visible;
		padding: 24px 12px;
		border: 0;
		border-radius: 24px;
		background:
			radial-gradient(120% 60% at 0% 0%, rgba(79, 208, 222, .14), transparent 55%),
			linear-gradient(180deg, #114960 0%, #0c3a4e 100%);
		box-shadow: 0 18px 40px -20px rgba(9, 40, 56, .55);
	}
}