/*** Dashboard Theme for Competition Pages ***/
@font-face {
	font-family: "Plus Jakarta Sans SemiBold";
	src: url("../fonts/PlusJakartaSans-SemiBold.ttf") format("truetype");
	font-weight: 600;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Solomon Sans';
	src: url("../fonts/Solomon Sans Normal.otf");
}

body {
	--bs-primary: #4C41A9;
	--bs-secondary: #160840;
	--bs-dark: #160840;
	--bs-light: #FFFFFF;
	--bs-info: #4C41A9;
	--bs-danger: #4C41A9;
	--bs-warning: #4C41A9;
	--dashboard-surface: #FFFFFF;
	--dashboard-dark: #160840;
	--dashboard-gradient-start: #160840;
	--dashboard-gradient-stop: #4C41A9;
	--dashboard-nav-height: 96px;
	--dashboard-nav-padding: 1.25rem;
	font-family: "Plus Jakarta Sans SemiBold", "Plus Jakarta Sans", "Rubik", sans-serif;
	font-weight: 600;
	background: linear-gradient(180deg, #160840 43%, #4C41A9 100%);
	color: var(--dashboard-dark);
	min-height: 100vh;
	position: relative;
	overflow-x: hidden;
}

body::after {
	content: "";
	position: fixed;
	inset: 0;
	background-repeat: no-repeat;
	background-position: center top;
	background-size: cover;
	opacity: 0.25;
	pointer-events: none;
	z-index: 0;
}

@media (max-width: 992px) {
	body {
		--dashboard-nav-height: 80px;
		--dashboard-nav-padding: 0.9rem;
	}
}

/* Competition specific fonts */
h1,
h2,
h3 {
	font-family: 'Solomon Sans', "Plus Jakarta Sans SemiBold", "Plus Jakarta Sans", sans-serif;
}

h4,
h5,
h6,
p,
a,
label,
button {
	font-family: "Plus Jakarta Sans SemiBold", "DM Sans", sans-serif;
}

#compe-title {
	font-family: 'Solomon Sans';
	font-weight: bold;
}

/* Update navbar styling */
.navbar {
	background: #FFFFFF !important;
	box-shadow: 0 20px 60px rgba(8, 5, 41, 0.25);
	z-index: 10;
	position: relative;
	min-height: var(--dashboard-nav-height);
	padding-top: var(--dashboard-nav-padding) !important;
	padding-bottom: var(--dashboard-nav-padding) !important;
}

.navbar::before {
	content: "";
	position: absolute;
	inset: 0;
	background-color: #FFFFFF;
	z-index: -1;
}

.navbar .navbar-brand img {
	display: block;
}

.navbar .navbar-nav .nav-link {
	color: var(--dashboard-dark) !important;
	font-weight: 600;
	padding: 0.5rem 1.25rem;
	border-radius: 999px;
	transition: background-color .3s ease, color .3s ease;
}

.navbar .navbar-nav .nav-link.active,
.navbar .navbar-nav .nav-link:focus,
.navbar .navbar-nav .nav-link:hover {
	color: #FFFFFF !important;
	background-color: var(--bs-primary);
}

/* Competition specific button styles */
#hero-register {
	border-color: var(--bs-primary);
	color: var(--bs-primary) !important;
	font-weight: 600;
	background-color: transparent;
	box-shadow: 0 10px 20px rgba(76, 65, 169, 0.15);
	border-radius: 999px;
	transition: all 0.3s ease;
}

#hero-register:hover {
	background-color: var(--bs-primary) !important;
	color: #FFFFFF !important;
	transform: translateY(-2px);
	box-shadow: 0 12px 25px rgba(76, 65, 169, 0.25);
}

#hero-guide-book {
	background: linear-gradient(135deg, var(--dashboard-gradient-start), var(--dashboard-gradient-stop));
	border-color: var(--dashboard-gradient-stop);
	color: #FFFFFF !important;
	font-weight: 600;
	box-shadow: 0 12px 30px rgba(76, 65, 169, 0.25);
	border-radius: 999px;
	transition: all 0.3s ease;
}

#hero-guide-book:hover {
	transform: translateY(-2px);
	S box-shadow: 0 15px 35px rgba(76, 65, 169, 0.35);
}

.hero {
	position: relative;
	/* container untuk pseudo-element */
	z-index: 1;
}

.hero::after {
	content: "";
	position: absolute;
	inset: 0;
	background-repeat: no-repeat;
	background-position: center top;
	background-size: cover;
	opacity: 0.25;
	pointer-events: none;
	z-index: 0;
}

/* Fix blockquote footer */
body:not(.dashboard-theme) .blockquote-footer {
	color: rgba(255, 255, 255, 0.7) !important;
}

/* Footer - gaya umum untuk halaman competition (dark background) */
body:not(.dashboard-theme) footer {
	background-color: #10053C !important;
	position: relative;
	z-index: 1;
}

/* Pastikan hampir semua teks footer berwarna putih untuk kontras */
body:not(.dashboard-theme) footer,
body:not(.dashboard-theme) footer h1,
body:not(.dashboard-theme) footer h2,
body:not(.dashboard-theme) footer h3,
body:not(.dashboard-theme) footer h4,
body:not(.dashboard-theme) footer h5,
body:not(.dashboard-theme) footer h6,
body:not(.dashboard-theme) footer p,
body:not(.dashboard-theme) footer span,
body:not(.dashboard-theme) footer .lead,
body:not(.dashboard-theme) footer .fs-6,
body:not(.dashboard-theme) footer li,
body:not(.dashboard-theme) footer [style*="color"] {
	color: #FFFFFF !important;
}

/* Override agresif untuk elemen non-link (bi = icon, link-info = warna link khusus) */
body:not(.dashboard-theme) footer *:not(a):not(.bi):not(.link-info) {
	color: #FFFFFF !important;
}

/* Spesifik untuk header/h5 di kolom kontak/email */
body:not(.dashboard-theme) footer .col-md-12 h5,
body:not(.dashboard-theme) footer ul li h5,
body:not(.dashboard-theme) footer .col-md-12 ul li h5.fs-6 {
	color: #FFFFFF !important;
}

/* Kembalikan warna link dan link-info */
body:not(.dashboard-theme) footer a {
	color: #FFFFFF !important;
}

body:not(.dashboard-theme) footer .link-info {
	color: #A0D2EB !important;
}

body:not(.dashboard-theme) footer .link-info:hover {
	color: #FFFFFF !important;
}

/* Ikon sosial - warna dan efek hover */
body:not(.dashboard-theme) footer .bi-instagram,
body:not(.dashboard-theme) footer .bi-tiktok,
body:not(.dashboard-theme) footer .bi-line,
body:not(.dashboard-theme) footer .bi-linkedin {
	color: #FFFFFF !important;
	font-size: 1.2rem;
	transition: color 0.3s ease;
}

body:not(.dashboard-theme) footer .bi-instagram:hover,
body:not(.dashboard-theme) footer .bi-tiktok:hover,
body:not(.dashboard-theme) footer .bi-line:hover,
body:not(.dashboard-theme) footer .bi-linkedin:hover {
	color: rgba(255, 255, 255, 0.8) !important;
}

/* Border dan logo di footer */
body:not(.dashboard-theme) footer .border-top {
	border-color: rgba(255, 255, 255, 0.2) !important;
}

body:not(.dashboard-theme) footer img {
	filter: brightness(0) invert(1);
	transition: opacity 0.3s ease;
}

body:not(.dashboard-theme) footer img:hover {
	opacity: 0.8;
}

/* Styling untuk kotak latar belakang teks transparan */
.text-background-box {
	/* Menggunakan RGBA untuk transparansi. (0.9 = 90% opacity) */
	background-color: rgba(255, 255, 255, 0.9);
	/* Efek blur untuk latar belakang di baliknya */
	backdrop-filter: blur(8px);
	padding: 30px;
	border-radius: 15px;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
	color: var(--bs-dark);
	position: relative;
	z-index: 2;
	/* Border tipis agar tetap terlihat jelas */
	border: 1px solid rgba(255, 255, 255, 0.18);
}

/* Pastikan elemen di dalam kotak putih memiliki warna teks gelap */
.text-background-box h1,
.text-background-box p {
	color: var(--bs-dark) !important;
}

/* Khusus untuk span IPFEST 2025 agar warnanya sesuai */
.text-background-box h1 span {
	color: var(--bs-primary) !important;
}

/* --- PERBAIKAN TIMELINE (LEBIH KUAT) --- */
/* 1. Netralkan background item timeline */
.text-background-box .timeline-text {
	background: rgba(255, 255, 255, 0.1) !important;
	/* Hapus gradient */
	backdrop-filter: blur(2px) !important;
	border: 1px solid rgba(0, 0, 0, 0.05) !important;
}

/* 2. Paksa *semua* teks di dalam item timeline jadi gelap (agar terbaca) */
.text-background-box .timeline-text,
.text-background-box .timeline-text * {
	color: var(--bs-dark) !important;
	opacity: 1 !important;
	/* Hapus semua efek transparan/fade */
}

/* 3. KEMBALIKAN warna merah HANYA untuk judul item */
.text-background-box .timeline-text .lead {
	color: #bc2300 !important;
	/* Warna merah */
	font-weight: 600 !important;
	/* Buat lebih tebal */
}

/* 4. Atur ulang warna tanggal agar sedikit berbeda */
.text-background-box .timeline-date {
	color: var(--bs-primary) !important;
	/* Warna ungu */
	font-weight: 500 !important;
	opacity: 0.8 !important;
}