/* ========================================================= */
/* FILE: style.css - Styling Utama Halaman Publik (index, daftar) */
/* ========================================================= */

/* --- 1. RESET DAN FONT DASAR --- */
body {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    background-color: #f8f9fa; /* Latar belakang sangat terang */
    color: #343a40; /* Teks gelap standar */
    line-height: 1.6;
    margin: 0;
    padding: 0;
}

/* --- 2. HEADER UTAMA (.header-main) --- */
.header-main {
    background-color: #17a2b8; /* Warna primer (Biru Muda/Cyan - Profesional) */
    color: white;
    padding: 50px 20px;
    text-align: center;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.header-main img {
    border-radius: 50%; /* Logo dibuat lingkaran */
    background: rgba(255, 255, 255, 0.9);
    padding: 5px;
}

.header-main h1 {
    font-size: 2.8em;
    margin-bottom: 5px;
    font-weight: 700;
}

.header-main h2 {
    font-size: 1.5em;
    font-weight: 300;
}

/* --- 3. CONTAINER DAN SECTION --- */
.container {
    max-width: 900px;
    margin: 30px auto;
    padding: 30px;
    background: white;
    border-radius: 10px;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.05);
}

.section {
    margin-bottom: 30px;
    padding: 20px;
    border: 1px solid #e9ecef;
    border-radius: 6px;
    background-color: #ffffff;
    transition: box-shadow 0.3s;
}

.section:hover {
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
}

.section h2 {
    color: #17a2b8; /* Warna primer */
    border-bottom: 2px solid #e9ecef;
    padding-bottom: 10px;
    margin-bottom: 15px;
}

/* --- 4. TOMBOL (Pendaftaran) --- */
.btn-daftar { 
    display: inline-block; 
    padding: 15px 35px; 
    background-color: #28a745; /* Warna Sukses/Go */
    color: white; 
    text-decoration: none; 
    font-size: 1.3em; 
    font-weight: bold;
    border-radius: 8px; 
    margin-top: 20px;
    box-shadow: 0 4px #1e7e34;
    transition: all 0.2s;
}

.btn-daftar:hover { 
    background-color: #218838; 
    transform: translateY(2px);
    box-shadow: 0 2px #1e7e34;
}

/* --- 5. FORMULIR DAN INPUT (untuk daftar.php) --- */
.form-group {
    margin-bottom: 20px;
}

.form-group label {
    font-weight: 600;
    color: #495057;
    margin-bottom: 8px;
}

.form-control {
    width: 100%;
    padding: 12px;
    border: 1px solid #ced4da;
    border-radius: 4px;
    box-sizing: border-box;
    transition: border-color 0.2s, box-shadow 0.2s;
}

.form-control:focus {
    border-color: #17a2b8;
    box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.25);
    outline: none;
}

.btn-submit {
    background-color: #007bff; /* Warna Aksi Utama Form */
    color: white;
    padding: 12px 25px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    font-size: 17px;
    font-weight: 600;
    transition: background-color 0.3s;
}

.btn-submit:hover {
    background-color: #0056b3;
}

/* --- 6. ALERT/PESAN KESALAHAN --- */
.alert-error { 
    background-color: #f8d7da; 
    color: #721c24; 
    padding: 15px; 
    border-radius: 5px; 
    border: 1px solid #f5c6cb; 
    margin-bottom: 20px;
    text-align: center;
}

/* --- 7. FOOTER --- */
.footer {
    padding: 20px;
    background-color: #343a40;
    color: #f8f9fa;
    text-align: center;
    font-size: 0.9em;
}

/* --- 8. CETAK BUKTI (cetak_bukti.php) --- */

.bukti-container {
    max-width: 750px; 
    margin: 30px auto; 
    background: white; 
    padding: 40px; 
    border: 1px dashed #ced4da; /* Garis putus-putus untuk kesan dokumen */
    box-shadow: 0 0 8px rgba(0,0,0,0.05); 
}
.bukti-container .header { 
    border-bottom: 3px solid #17a2b8; 
    padding-bottom: 15px; 
    margin-bottom: 25px;
}
.bukti-container h1 {
    color: #17a2b8;
}
.nomor-urut { 
    font-size: 28px; 
    font-weight: 700; 
    color: #dc3545; /* Warna Merah/Penting */
    text-align: center; 
    margin: 25px 0; 
    border: 3px solid #dc3545; 
    padding: 10px; 
    display: inline-block;
    border-radius: 5px;
}
.info-penting { 
    background-color: #ffeeba; 
    border: 1px solid #ffc107; 
    color: #664d03; 
    padding: 15px; 
    margin-top: 25px; 
    text-align: center; 
    border-radius: 5px;
}
.btn-print { 
    background-color: #6c757d; /* Abu-abu untuk tombol non-aksi utama */
    display: block; 
    width: 250px; 
    margin: 20px auto; 
    padding: 12px 20px; 
    color: white; 
    border: none; 
    border-radius: 5px;
}
.btn-print:hover {
    background-color: #5a6268;
}

/* --- MEDIA PRINT (Untuk mencetak bukti pendaftaran) --- */
@media print {
    body { background-color: white; }
    .btn-print { display: none; }
    .bukti-container { box-shadow: none; border: none; margin: 0; padding: 0; }
    .footer { display: none; }
}