/*
 * 0.66.54 · Dashboard Kompetisi selaras dengan Manajemen Event.
 * Hanya tampilan. Markup dan logika PHP tidak diubah. Dimuat setelah competition-manage.css.
 */

/* Header: hero teal seperti Manajemen Event */
html body .beeang-event-module--competition .beeang-event-module__header--competition {
	position: relative;
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	margin: 0 0 18px;
	padding: 26px 30px;
	border-radius: 20px;
	background: linear-gradient(135deg, #0b3343 0%, #0a6b78 55%, #0e8a9a 100%);
	color: #fff;
	box-shadow: 0 18px 40px -30px rgba(11, 51, 67, .6);
}
html body .beeang-event-module--competition .beeang-event-module__header--competition h1,
html body .beeang-event-module--competition .beeang-event-module__header--competition h2 {
	margin: 0;
	color: #fff;
	font-size: clamp(24px, 2.6vw, 30px);
	font-weight: 800;
	line-height: 1.2;
}
html body .beeang-event-module--competition .beeang-event-module__header--competition p {
	margin: 6px 0 0;
	color: rgba(255, 255, 255, .82);
	font-size: 14px;
	line-height: 1.55;
}
html body .beeang-event-module--competition .beeang-event-module__header--competition .beeang-event-module__icon {
	display: none;
}
html body .beeang-event-module--competition .beeang-comp-head__action {
	flex: none;
	display: inline-flex;
	align-items: center;
	height: 44px;
	padding: 0 20px;
	border-radius: 999px;
	background: #fff;
	color: #0a6b78;
	font-size: 14px;
	font-weight: 700;
	text-decoration: none;
	box-shadow: 0 6px 16px -10px rgba(0, 0, 0, .4);
}
html body .beeang-event-module--competition .beeang-comp-head__action:hover {
	background: #e9f6f8;
}

/* Kartu statistik: netral, satu kartu aktif */
html body .beeang-event-module--competition .beeang-competition-overview__cards {
	gap: 14px;
}
html body .beeang-event-module--competition .beeang-competition-overview__card {
	border: 1px solid var(--ce-line, #dfe8ee);
	border-top: 1px solid var(--ce-line, #dfe8ee);
	border-radius: 16px;
	background: #fff;
	box-shadow: none;
	padding: 18px 20px;
}
html body .beeang-event-module--competition .beeang-competition-overview__card span {
	color: var(--ce-muted, #5b7080);
	font-size: 12.5px;
	font-weight: 700;
}
html body .beeang-event-module--competition .beeang-competition-overview__card strong {
	color: var(--ce-navy, #0b3343);
	font-size: 32px;
	font-weight: 800;
}
html body .beeang-event-module--competition .beeang-competition-overview__card small {
	color: var(--ce-muted, #5b7080);
	font-size: 12px;
}
html body .beeang-event-module--competition .beeang-competition-overview__card:nth-child(1) {
	border-color: transparent;
	background: linear-gradient(135deg, #0b3343, #0e8a9a);
}
html body .beeang-event-module--competition .beeang-competition-overview__card:nth-child(1) span,
html body .beeang-event-module--competition .beeang-competition-overview__card:nth-child(1) strong,
html body .beeang-event-module--competition .beeang-competition-overview__card:nth-child(1) small {
	color: #fff;
}

/* Daftar kompetisi: kartu terisi penuh dalam grid */
html body .beeang-event-module--competition .beeang-comp-list__grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
	gap: 16px;
}
html body .beeang-event-module--competition .beeang-comp-card {
	width: 100%;
	max-width: none;
	gap: 10px;
	padding: 20px;
	border: 1px solid var(--ce-line, #dfe8ee);
	border-radius: 18px;
	background: #fff;
	box-shadow: none;
}
html body .beeang-event-module--competition .beeang-comp-card h3 {
	margin: 0;
	color: var(--ce-navy, #0b3343);
	font-size: 17px;
	font-weight: 800;
	line-height: 1.3;
}
html body .beeang-event-module--competition .beeang-comp-card__meta {
	margin: 0;
	color: var(--ce-muted, #5b7080);
	font-size: 12.5px;
	line-height: 1.5;
}
/* Tombol Kelola: teal standar */
html body .beeang-event-module--competition .beeang-comp-card__go {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 42px;
	margin-top: auto;
	border-radius: 999px;
	background: var(--ce-teal, #0e8a9a);
	color: #fff;
	font-size: 14px;
	font-weight: 700;
	text-decoration: none;
}
html body .beeang-event-module--competition .beeang-comp-card__go:hover {
	background: var(--ce-teal-d, #0a6b78);
	color: #fff;
}
@media (max-width: 640px) {
	html body .beeang-event-module--competition .beeang-event-module__header--competition {
		flex-direction: column;
		align-items: flex-start;
		padding: 20px;
	}
	html body .beeang-event-module--competition .beeang-comp-list__grid {
		grid-template-columns: 1fr;
	}
}

/* 0.66.55 · Penyesuaian: aturan dark theme memakai !important, jadi override juga memakai !important.
 * Lebar kartu dibatasi 380 px dan rata kiri. Poster tampil utuh di kartu.
 */
html body .beeang-event-module--competition .beeang-event-module__header--competition {
	background: linear-gradient(135deg, #0b3343 0%, #0a6b78 55%, #0e8a9a 100%) !important;
}
html body .beeang-event-module--competition .beeang-comp-head__action,
html body .beeang-event-module--competition .beeang-comp-head__action:is(:link, :visited, :hover, :focus) {
	background: #fff !important;
	color: #0a6b78 !important;
	-webkit-text-fill-color: #0a6b78 !important;
}
html body .beeang-event-module--competition .beeang-competition-overview__card:nth-child(n+3) {
	border-top: 1px solid transparent !important;
	border-top-color: var(--bp-line, #dfe8ee) !important;
}
html body .beeang-event-module--competition .beeang-comp-list__grid {
	grid-template-columns: repeat(auto-fill, minmax(300px, 380px)) !important;
	justify-content: start;
	justify-items: stretch;
}
html body .beeang-event-module--competition .beeang-comp-card {
	width: 100% !important;
	max-width: 380px !important;
	min-width: 0;
	justify-self: start;
}
html body .beeang-event-module--competition .beeang-comp-card__poster {
	margin: -20px -20px 4px;
	height: 260px;
	aspect-ratio: auto;
	overflow: hidden;
	border-radius: 18px 18px 0 0;
	background: var(--ce-soft, #f4f8fa);
	display: flex;
	align-items: center;
	justify-content: center;
}
html body .beeang-event-module--competition .beeang-comp-card__poster img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
}