/*
 * 0.66.58 · Redesign halaman Kelola kompetisi, selaras dengan dashboard dan Manajemen Event.
 * Hanya tampilan. Markup, form, nama field, dan logika tidak diubah.
 * Warna teks memakai token tema (--bp-*) agar terbaca di light dan dark. Judul memakai !important
 * karena aturan dark theme lama memakai !important.
 */

/* Header detail: hero teal */
html body .beeang-event-module--competition .beeang-comp-head--detail {
	position: relative;
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 16px;
	margin: 0 0 18px;
	padding: 24px 28px;
	border-radius: 20px;
	background: linear-gradient(135deg, #0b3343 0%, #0a6b78 55%, #0e8a9a 100%) !important;
	box-shadow: 0 18px 40px -30px rgba(11, 51, 67, .6);
}
html body .beeang-event-module--competition .beeang-comp-head--detail h1,
html body .beeang-event-module--competition .beeang-comp-head--detail h2 {
	color: #fff !important;
	-webkit-text-fill-color: #fff !important;
}
html body .beeang-event-module--competition .beeang-comp-head--detail .beeang-comp-back,
html body .beeang-event-module--competition .beeang-comp-head--detail .beeang-comp-crumb,
html body .beeang-event-module--competition .beeang-comp-head--detail .beeang-comp-crumb a {
	color: rgba(255, 255, 255, .85) !important;
	-webkit-text-fill-color: rgba(255, 255, 255, .85) !important;
}
html body .beeang-event-module--competition .beeang-comp-head--detail .beeang-comp-back {
	display: inline-flex;
	align-items: center;
	height: 36px;
	padding: 0 14px;
	border-radius: 999px;
	background: rgba(255, 255, 255, .14);
	text-decoration: none;
	font-weight: 700;
	font-size: 13px;
}

/* Stepper: kartu tunggal dengan tahap aktif teal */
html body .beeang-event-module--competition .beeang-comp-stepper {
	display: flex;
	align-items: stretch;
	gap: 0;
	margin: 14px 0 18px;
	padding: 12px 14px;
	border: 1px solid var(--bp-line, #dfe8ee);
	border-radius: 16px;
	background: var(--bp-card, #fff);
	list-style: none;
	overflow-x: auto;
}
html body .beeang-event-module--competition .beeang-comp-step {
	flex: 1 1 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 6px;
	min-width: 84px;
	padding: 4px 6px;
	text-align: center;
}
html body .beeang-event-module--competition .beeang-comp-step__num {
	display: inline-grid;
	place-items: center;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	background: var(--bp-soft, #eef3f6);
	color: var(--bp-mut, #64748b) !important;
	-webkit-text-fill-color: var(--bp-mut, #64748b) !important;
	font-size: 13px;
	font-weight: 800;
}
html body .beeang-event-module--competition .beeang-comp-step__label {
	color: var(--bp-mut, #64748b) !important;
	-webkit-text-fill-color: var(--bp-mut, #64748b) !important;
	font-size: 12.5px;
	font-weight: 700;
}
html body .beeang-event-module--competition .beeang-comp-step.is-active .beeang-comp-step__num {
	background: var(--ce-teal, #0e8a9a);
	color: #fff !important;
	-webkit-text-fill-color: #fff !important;
	box-shadow: 0 0 0 4px rgba(14, 138, 154, .18);
}
html body .beeang-event-module--competition .beeang-comp-step.is-active .beeang-comp-step__label {
	color: var(--bp-ink, #1f2937) !important;
	-webkit-text-fill-color: var(--bp-ink, #1f2937) !important;
}
html body .beeang-event-module--competition .beeang-comp-step.is-complete .beeang-comp-step__num {
	background: #12804f;
	color: #fff !important;
	-webkit-text-fill-color: #fff !important;
}

/* Tab: segmented control dalam satu kartu */
html body .beeang-event-module--competition .beeang-comp-tabs {
	display: flex;
	gap: 4px;
	margin: 0 0 16px;
	padding: 6px;
	border: 1px solid var(--bp-line, #dfe8ee);
	border-radius: 16px;
	background: var(--bp-card, #fff);
	overflow-x: auto;
}
html body .beeang-event-module--competition .beeang-comp-tabs__tab {
	flex: 1 0 auto;
	height: 40px;
	padding: 0 16px;
	border: 0;
	border-radius: 12px;
	background: transparent;
	color: var(--bp-mut, #64748b) !important;
	-webkit-text-fill-color: var(--bp-mut, #64748b) !important;
	font-size: 13.5px;
	font-weight: 700;
	cursor: pointer;
	white-space: nowrap;
}
html body .beeang-event-module--competition .beeang-comp-tabs__tab:hover {
	background: var(--bp-soft, #f4f8fa);
}
html body .beeang-event-module--competition .beeang-comp-tabs__tab.is-active,
html body .beeang-event-module--competition .beeang-comp-tabs__tab[aria-selected="true"] {
	background: var(--ce-teal, #0e8a9a);
	color: #fff !important;
	-webkit-text-fill-color: #fff !important;
	box-shadow: 0 6px 14px -10px rgba(14, 138, 154, .7);
}

/* Panel dan kartu isi */
html body .beeang-event-module--competition .beeang-comp-tabs__panel,
html body .beeang-event-module--competition .beeang-comp-group,
html body .beeang-event-module--competition .beeang-comp-summary {
	border: 1px solid var(--bp-line, #dfe8ee);
	border-radius: 18px;
	background: var(--bp-card, #fff);
	padding: 22px 24px;
	box-shadow: none;
}
html body .beeang-event-module--competition .beeang-comp-tabs__panel h2,
html body .beeang-event-module--competition .beeang-comp-tabs__panel h3,
html body .beeang-event-module--competition .beeang-comp-tabs__panel h4,
html body .beeang-event-module--competition .beeang-comp-group h2,
html body .beeang-event-module--competition .beeang-comp-group h3,
html body .beeang-event-module--competition .beeang-comp-group h4,
html body .beeang-event-module--competition .beeang-comp-summary h4 {
	color: var(--bp-ink, #1f2937) !important;
	-webkit-text-fill-color: var(--bp-ink, #1f2937) !important;
	font-weight: 800;
}
html body .beeang-event-module--competition .beeang-comp-tabs__panel p,
html body .beeang-event-module--competition .beeang-comp-group p,
html body .beeang-event-module--competition .beeang-comp-summary p,
html body .beeang-event-module--competition .beeang-comp-summary small {
	color: var(--bp-mut, #64748b) !important;
	-webkit-text-fill-color: var(--bp-mut, #64748b) !important;
}

/* Kartu statistik ringkasan */
html body .beeang-event-module--competition .beeang-comp-summary__stat {
	border: 1px solid var(--bp-line, #dfe8ee);
	border-radius: 16px;
	background: var(--bp-soft, #f4f8fa);
	padding: 16px 18px;
}
html body .beeang-event-module--competition .beeang-comp-summary__stat span {
	color: var(--bp-mut, #64748b) !important;
	-webkit-text-fill-color: var(--bp-mut, #64748b) !important;
	font-size: 12.5px;
	font-weight: 700;
}
html body .beeang-event-module--competition .beeang-comp-summary__stat strong {
	color: var(--bp-ink, #1f2937) !important;
	-webkit-text-fill-color: var(--bp-ink, #1f2937) !important;
	font-size: 28px;
	font-weight: 800;
}

@media (max-width: 640px) {
	html body .beeang-event-module--competition .beeang-comp-head--detail {
		padding: 20px;
	}
	html body .beeang-event-module--competition .beeang-comp-tabs__panel,
	html body .beeang-event-module--competition .beeang-comp-group,
	html body .beeang-event-module--competition .beeang-comp-summary {
		padding: 18px;
	}
}

/* 0.66.59 · Perbaikan: border ganda di Ringkasan dan tampilan mobile (stepper dan hero) */
html body .beeang-event-module--competition .beeang-comp-tabs__panel > .beeang-comp-summary {
	border: 0;
	background: transparent;
	padding: 0;
	box-shadow: none;
}
@media (max-width: 640px) {
	/* Stepper jadi daftar vertikal agar label tidak terpotong */
	html body .beeang-event-module--competition .beeang-comp-stepper {
		flex-direction: column;
		gap: 8px;
		padding: 12px;
		overflow: visible;
	}
	html body .beeang-event-module--competition .beeang-comp-step {
		flex-direction: row;
		justify-content: flex-start;
		gap: 12px;
		min-width: 0;
		width: 100%;
		text-align: left;
		padding: 6px 8px;
		border-radius: 12px;
	}
	html body .beeang-event-module--competition .beeang-comp-step.is-active {
		background: var(--bp-soft, #f4f8fa);
	}
	/* Hero: tombol aksi memenuhi lebar, tidak terpotong */
	html body .beeang-event-module--competition .beeang-comp-head--detail {
		flex-direction: column;
		align-items: stretch;
	}
	html body .beeang-event-module--competition .beeang-comp-head--detail a {
		white-space: normal;
		max-width: 100%;
	}
	html body .beeang-event-module--competition .beeang-comp-head--detail h1 {
		font-size: 22px;
		line-height: 1.25;
	}
}

/* 0.66.60 · Mobile: stepper, pills, dan tombol hero tidak meluap */
@media (max-width: 640px) {
	html body .beeang-event-module--competition .beeang-comp-stepper,
	html body .beeang-event-module--competition .beeang-comp-step {
		max-width: 100%;
		box-sizing: border-box;
		overflow: hidden;
	}
	html body .beeang-event-module--competition .beeang-comp-step {
		flex-wrap: wrap;
		row-gap: 2px;
	}
	html body .beeang-event-module--competition .beeang-comp-step > span:not(.beeang-comp-step__num):last-child {
		margin-left: auto;
		white-space: nowrap;
	}
	/* Pills di hero: boleh turun ke baris berikutnya, tidak melebar */
	html body .beeang-event-module--competition .beeang-comp-head--detail > * {
		min-width: 0;
		max-width: 100%;
	}
	html body .beeang-event-module--competition .beeang-comp-head--detail .beeang-competition-overview__pill {
		max-width: 100%;
		white-space: normal;
	}
	/* Tombol aksi hero: sejajar dan sama tinggi */
	html body .beeang-event-module--competition .beeang-comp-head--detail a {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		min-height: 44px;
		box-sizing: border-box;
		flex: 1 1 0;
		text-align: center;
	}
}

/* 0.66.61 · Mobile: form Aturan tidak meluap (tanggal, waktu, textarea, dan tombol kalender) */
@media (max-width: 640px) {
	html body .beeang-event-module--competition form,
	html body .beeang-event-module--competition form * {
		max-width: 100%;
		box-sizing: border-box;
	}
	html body .beeang-event-module--competition form label,
	html body .beeang-event-module--competition form > div {
		min-width: 0;
	}
	/* Pasangan tanggal dan waktu, grid dua kolom, jadi satu kolom */
	html body .beeang-event-module--competition .beeang-event-form__grid,
	html body .beeang-event-module--competition .beeang-event-form__pair,
	html body .beeang-event-module--competition .beeang-event-competition__form > .beeang-event-form__pair {
		grid-template-columns: minmax(0, 1fr) !important;
	}
	html body .beeang-event-module--competition input,
	html body .beeang-event-module--competition select,
	html body .beeang-event-module--competition textarea {
		width: 100%;
		max-width: 100%;
		min-width: 0;
	}
	/* Tombol kalender tetap kecil, tidak melebar */
	html body .beeang-event-module--competition form button:not([type="submit"]) {
		flex: 0 0 auto;
		width: auto;
		min-width: 44px;
	}
}

/* 0.66.62 · Kontras dan kecocokan warna di seluruh halaman Kelola (light dan dark).
 * Semua teks memakai token tema; isian memakai latar dan garis yang sama dengan tema.
 */
html body .beeang-event-module--competition label,
html body .beeang-event-module--competition legend,
html body .beeang-event-module--competition label > span,
html body .beeang-event-module--competition h4,
html body .beeang-event-module--competition h5 {
	color: var(--bp-ink, #1f2937) !important;
	-webkit-text-fill-color: var(--bp-ink, #1f2937) !important;
}
html body .beeang-event-module--competition .description,
html body .beeang-event-module--competition small,
html body .beeang-event-module--competition .beeang-comp-group > p,
html body .beeang-event-module--competition p.description {
	color: var(--bp-mut, #64748b) !important;
	-webkit-text-fill-color: var(--bp-mut, #64748b) !important;
}
html body .beeang-event-module--competition input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="submit"]):not([type="button"]),
html body .beeang-event-module--competition select,
html body .beeang-event-module--competition textarea {
	background: var(--bp-input, #fff) !important;
	border: 1px solid var(--bp-input-line, #dce3ea) !important;
	color: var(--bp-ink, #1f2937) !important;
	-webkit-text-fill-color: var(--bp-ink, #1f2937) !important;
	color-scheme: inherit;
}
html body .beeang-event-module--competition input::placeholder,
html body .beeang-event-module--competition textarea::placeholder {
	color: var(--bp-mut, #64748b) !important;
	opacity: .85;
}
html body .beeang-event-module--competition select option {
	background: var(--bp-card, #fff);
	color: var(--bp-ink, #1f2937);
}
/* Isi di dalam kartu tidak boleh tertutup kontainer */
html body .beeang-event-module--competition .beeang-comp-group,
html body .beeang-event-module--competition .beeang-comp-tabs__panel {
	overflow: visible;
}

/* 0.66.63 · Isian tambahan formulir kirim karya: warna mengikuti tema, mobile lebih rapi */
html body #beeang-event-module .beeang-extras__hint,
html body #beeang-event-module .beeang-extras__count,
html body #beeang-event-module .beeang-extras__empty {
	color: var(--bp-mut, #64748b) !important;
	-webkit-text-fill-color: var(--bp-mut, #64748b) !important;
}
html body #beeang-event-module .beeang-extras__row {
	background: var(--bp-card, #fff) !important;
	border: 1px solid var(--bp-line, #dfe8ee) !important;
	border-radius: 14px;
	padding: 14px;
	gap: 12px;
}
html body #beeang-event-module .beeang-extras__num {
	background: var(--bp-soft, #eef3f6) !important;
	color: var(--ce-teal, #0e8a9a) !important;
	-webkit-text-fill-color: var(--ce-teal, #0e8a9a) !important;
}
html body #beeang-event-module .beeang-extras__req,
html body #beeang-event-module .beeang-extras__req * {
	color: var(--bp-ink, #1f2937) !important;
	-webkit-text-fill-color: var(--bp-ink, #1f2937) !important;
}
html body #beeang-event-module .beeang-extras__act button,
html body #beeang-event-module .beeang-extras__bar button {
	background: var(--bp-card, #fff) !important;
	border: 1px solid var(--bp-input-line, #dce3ea) !important;
	color: var(--bp-ink, #1f2937) !important;
	-webkit-text-fill-color: var(--bp-ink, #1f2937) !important;
	border-radius: 10px;
}
html body #beeang-event-module .beeang-extras__bar .beeang-extras__add {
	background: var(--ce-teal, #0e8a9a) !important;
	border-color: var(--ce-teal, #0e8a9a) !important;
	color: #fff !important;
	-webkit-text-fill-color: #fff !important;
}
html body #beeang-event-module .beeang-extras__count.is-over {
	color: #d64545 !important;
	-webkit-text-fill-color: #d64545 !important;
}
html body #beeang-event-module .beeang-extras__opts select {
	background: var(--bp-input, #fff) !important;
	border: 1px solid var(--bp-input-line, #dce3ea) !important;
	color: var(--bp-ink, #1f2937) !important;
	-webkit-text-fill-color: var(--bp-ink, #1f2937) !important;
	border-radius: 10px;
	height: 40px;
}
@media (max-width: 640px) {
	/* Baris: nomor di kiri, isian di kanan; tombol aksi turun ke bawah */
	html body #beeang-event-module .beeang-extras__row {
		grid-template-columns: 26px minmax(0, 1fr);
		padding: 12px;
	}
	html body #beeang-event-module .beeang-extras__num {
		margin-top: 8px;
	}
	html body #beeang-event-module .beeang-extras__act {
		grid-column: 2;
		justify-content: flex-end;
		padding-top: 4px;
		border-top: 1px dashed var(--bp-line, #dfe8ee);
	}
	html body #beeang-event-module .beeang-extras__opts {
		flex-direction: column;
		align-items: stretch;
		gap: 8px;
	}
	html body #beeang-event-module .beeang-extras__opts select {
		width: 100%;
	}
	html body #beeang-event-module .beeang-extras__bar {
		flex-direction: column;
		align-items: stretch;
	}
	html body #beeang-event-module .beeang-extras__bar button {
		width: 100%;
		min-height: 44px;
	}
	html body #beeang-event-module .beeang-extras__count {
		margin-left: 0;
		text-align: left;
	}
}

/* 0.66.64 · Checkbox dan label terlihat di light dan dark; baris isian mobile tidak melebihi kartu */
html body #beeang-event-module label:has(> input[type="checkbox"]),
html body #beeang-event-module .be-f--check,
html body #beeang-event-module .beeang-extras__req {
	background: var(--bp-card, #fff) !important;
	border: 1px solid var(--bp-line, #dfe8ee) !important;
	color: var(--bp-ink, #1f2937) !important;
	-webkit-text-fill-color: var(--bp-ink, #1f2937) !important;
	border-radius: 10px;
}
html body #beeang-event-module .beeang-extras__req {
	background: transparent !important;
	border: 0 !important;
	padding: 0 !important;
}
html body #beeang-event-module label:has(> input[type="checkbox"]) > *,
html body #beeang-event-module .be-f--check > * {
	color: var(--bp-ink, #1f2937) !important;
	-webkit-text-fill-color: var(--bp-ink, #1f2937) !important;
}
html body #beeang-event-module input[type="checkbox"] {
	accent-color: var(--ce-teal, #0e8a9a);
	width: 18px;
	height: 18px;
}
@media (max-width: 640px) {
	html body #beeang-event-module .beeang-event-competition__form,
	html body #beeang-event-module .beeang-extras,
	html body #beeang-event-module .beeang-extras__list,
	html body #beeang-event-module .beeang-extras__row {
		width: 100%;
		max-width: 100%;
		min-width: 0;
		box-sizing: border-box;
		overflow-x: hidden;
	}
	html body #beeang-event-module .beeang-extras__row > * {
		min-width: 0;
	}
	html body #beeang-event-module .beeang-extras__main > * {
		max-width: 100%;
	}
	html body #beeang-event-module .beeang-extras__opts select,
	html body #beeang-event-module .beeang-extras__main > input[type="text"] {
		width: 100%;
		max-width: 100%;
	}
}

/* 0.66.65 · Mobile: semua isi baris isian tambahan pas di dalam kartu (tidak terpotong di kanan) */
@media (max-width: 640px) {
	html body #beeang-event-module .beeang-extras__row select,
	html body #beeang-event-module .beeang-extras__row input,
	html body #beeang-event-module .beeang-extras__row textarea,
	html body #beeang-event-module .beeang-extras__row label {
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
		box-sizing: border-box;
	}
	html body #beeang-event-module .beeang-extras__row label.beeang-extras__req,
	html body #beeang-event-module .beeang-extras__row .beeang-extras__req {
		width: auto !important;
		max-width: 100% !important;
		display: inline-flex;
	}
	html body #beeang-event-module .beeang-extras__row .beeang-extras__main {
		grid-template-columns: minmax(0, 1fr);
		width: 100%;
		min-width: 0;
	}
	html body #beeang-event-module .beeang-extras__row .beeang-extras__opts {
		width: 100%;
		min-width: 0;
	}
}

/* 0.66.66 · Panel tab tidak lagi berbingkai ganda; kartu di dalamnya diberi jarak */
html body .beeang-event-module--competition .beeang-comp-tabs__panel {
	border: 0 !important;
	background: transparent !important;
	padding: 0 !important;
	box-shadow: none !important;
}
/* Jarak antar-kartu lewat margin, tanpa mengubah display (panel tidak aktif tetap tersembunyi) */
html body .beeang-event-module--competition .beeang-comp-tabs__panel > * + * {
	margin-top: 16px;
}
html body .beeang-event-module--competition .beeang-comp-tabs__panel[hidden],
html body .beeang-event-module--competition [data-comp-tabs] [hidden] {
	display: none !important;
}
@media (max-width: 640px) {
	html body .beeang-event-module--competition .beeang-comp-tabs__panel > * + * {
		margin-top: 14px;
	}
}
