/* Dasar halaman publik jalur rekrutmen (daftar lowongan & form lamaran):
   warna, huruf, dan pembersihan kerangka website bawaan Frappe.
   Dipakai bersama lowongan-publik.css dan lamaran-management.css. */

:root {
	--lp-maroon: #7b1e26;
	--lp-maroon-dark: #5c141a;
	--lp-oranye: #f5a623;
	--lp-oranye-deep: #e8890c;
	--lp-bg: #faf8f7;
	--lp-teks: #1f1b1b;
	--lp-teks-lembut: #4a4442;
	--lp-abu: #857e7b;
	--lp-abu-muda: #a8a19e;
	--lp-garis: #e7e2e0;
	--lp-isian-bg: #f4f0ee;
	--lp-merah: #c0392b;
	--lp-merah-logo: #a61d24;
	--lp-huruf: "Plus Jakarta Sans", Helvetica, Arial, sans-serif;
}

/* Navbar & footer bawaan disembunyikan, dan wadah bawaan (yang biasanya memberi
   lebar maksimum serta padding kiri-kanan) dinolkan supaya halaman bisa selebar
   layar. */
body.lp-body header.navbar,
body.lp-body nav.navbar,
body.lp-body footer,
body.lp-body .web-footer {
	display: none !important;
}

body.lp-body .page_content {
	padding: 0 !important;
}

/* !important karena jarak atas-bawahnya datang dari utility Bootstrap (.my-4)
   yang sendirinya sudah !important. */
body.lp-body main.container {
	max-width: none;
	padding: 0;
	margin: 0 !important;
}

body.lp-body {
	background: var(--lp-bg);
}

/* Topbar maroon dengan logo, dipakai halaman daftar lowongan. */
.lp-topbar {
	display: flex;
	align-items: center;
	padding: 14px 24px;
	background: var(--lp-maroon);
}

/* Lingkarannya merah: logo yang dipakai bertuliskan putih, jadi butuh alas
   gelap supaya terbaca - di atas topbar maroon warnanya sedikit lebih terang
   supaya lingkarannya tetap kelihatan. */
.lp-logo {
	width: 46px;
	height: 46px;
	border-radius: 50%;
	flex-shrink: 0;
	background: var(--lp-merah-logo);
	box-shadow: 0 6px 14px rgba(0, 0, 0, 0.35), 0 1px 2px rgba(0, 0, 0, 0.25);
	animation: lpLogoFloat 3s ease-in-out infinite;
}

/* Logo dimuat utuh (contain), bukan dipenuhkan ke lingkaran (cover) - tulisan
   di bagian bawah logo ikut terpotong kalau dipenuhkan. */
.lp-logo img {
	width: 100%;
	height: 100%;
	border-radius: 50%;
	object-fit: contain;
	padding: 7px;
	box-sizing: border-box;
	display: block;
}

.lp-topbar-nama {
	margin-left: 12px;
	font-size: 13px;
	font-weight: 700;
	color: #f2d9dc;
	letter-spacing: 0.03em;
	text-transform: uppercase;
}

@keyframes lpLogoFloat {
	0%, 100% { transform: translateY(0) rotate(0deg); }
	50% { transform: translateY(-3px) rotate(4deg); }
}

@media (prefers-reduced-motion: reduce) {
	.lp-logo { animation: none; }
}

@media (max-width: 600px) {
	.lp-topbar {
		padding: 12px 16px;
	}
}