/* Custom CSS Override - CIL Marketplace TAD Hack Desember 2025. Menghilangkan branding CIL */
/* Silakan isi styling baru di bawah ini */

/* TAD Hack: Sembunyikan Section 'Program Tersedia' */
/* Penjelasan: Pilih elemen #blog yang posisinya persis SETELAH #cta */
#cta + #blog {
    display: none !important;
}

/* TAD Hack: Sembunyikan Judul di Section Blog Kedua (Mata Kuliah) */
/* Selector: Elemen .section-title di dalam #blog yang didahului oleh <hr> */
hr + #blog .section-title {
    display: none !important;
}

/* TAD Hack: Hapus Top Bar (Universitas Indonesia & Sosmed) */
#topbar {
    display: none !important;
}

/* --- TAD HACK: GANTI LOGO EKSTERNAL --- */
/* Selector menargetkan gambar di dalam class .logo */
.logo img {
    /* 1. Timpa gambar asli dengan URL eksternal baru */
    content: url('https://i0.wp.com/dppd.ui.ac.id/wp-content/uploads/2025/03/LOGO-DPPDwhite-04.png?fit=16724%2C4922&ssl=1') !important;

    /* 2. PENTING: Atur ukuran. Gambar sumber sangat besar, harus dibatasi */
    width: auto !important;      /* Biarkan lebar menyesuaikan */
    height: 60px !important;     /* Kita kunci tingginya agar header rapi (sesuaikan jika perlu, misal 50px - 80px) */
    max-width: 300px !important; /* Jaga-jaga agar tidak terlalu melebar */

    
    /* 3. OPSIONAL: Jika header aslinya putih, logo putih tidak akan terlihat. 
       Jika perlu background gelap sementara, uncomment baris di bawah ini: */
    /* background-color: #333 !important; padding: 5px !important; border-radius: 5px !important; */
}

/* --- TAD HACK: Header Style (Dark Gray + Texture) --- */
#header {
    /* 1. Warna Dasar: Abu-abu Gelap (Solid) */
    background-color: #2c2c2c !important; 

    /* 2. Tekstur Garis Diagonal (Efek Arsiran) */
    /* Penjelasan: Garis putih transparan selebar 1px, jarak antar garis 6px */
    background-image: repeating-linear-gradient(
        45deg,
        rgba(255, 255, 255, 0.03) 0px,
        rgba(255, 255, 255, 0.03) 1px,
        transparent 1px,
        transparent 6px
    ) !important;

    /* Opsional: Memberi border bawah tipis agar batasnya tegas */
    border-bottom: 1px solid #444 !important;
    
    /* Opsional: Memastikan teks menu di dalamnya menjadi putih agar terbaca */
    color: #ffffff !important;
}

/* Memastikan link menu juga berwarna putih */
#header .navbar a {
    color: #dddddd !important;
}
#header .navbar a:hover, #header .navbar .active, #header .navbar .active:focus {
    color: #ffffff !important;
}

/* --- TAD HACK: PREMIUM TYPOGRAPHY & COLORS --- */

/* 1. Global Font Upgrade */
/* Menggunakan Poppins untuk judul agar terlihat modern/tech */
h1, h2, h3, h4, h5, h6, .navbar a, .logo {
    font-family: 'Poppins', sans-serif !important;
    letter-spacing: -0.5px; /* Sedikit dirapatkan agar tegas */
}
/* Menggunakan Open Sans untuk teks bacaan agar mata nyaman */
body, p, td, th, li, span {
    font-family: 'Open Sans', sans-serif !important;
}

/* 2. Hero Section (Area Selamat Datang) */
#cta {
    padding: 60px 0 !important; /* Memberi ruang napas atas-bawah */
    background-color: #ffffff !important; /* Latar bersih */
}

/* Judul Utama */
#cta h3, #cta h3 span {
    color: #d4a017 !important; /* GANTI KUNING NEON JADI EMAS MEWAH */
    font-weight: 700 !important;
    font-size: 32px !important; /* Ukuran diperbesar */
    text-transform: capitalize !important; /* Huruf besar di awal kata */
    margin-bottom: 20px !important;
    text-shadow: 0px 1px 1px rgba(0,0,0,0.1); /* Bayangan tipis agar tajam */
}

/* Teks Deskripsi */
#cta p {
    font-size: 16px !important; /* Ukuran bacaan ideal */
    line-height: 1.8 !important; /* Jarak antar baris lega */
    color: #444444 !important; /* Abu-abu tua (bukan hitam pekat) agar elegan */
    font-weight: 400 !important;
    max-width: 900px; /* Batasi lebar agar mata tidak lelah membaca ke samping */
    margin: 0 auto !important; /* Posisi tengah */
}

/* 3. Tabel Modern (Matching dengan Header Gelap) */
/* Kepala Tabel jadi Hitam Elegan */
.table thead th {
    background-color: #2c2c2c !important; /* Samakan dengan Header Atas */
    color: #ffffff !important;
    font-weight: 600 !important;
    text-transform: uppercase;
    font-size: 13px !important;
    letter-spacing: 1px;
    border: none !important;
    padding: 15px !important;
}

/* Isi Tabel */
.table tbody td {
    vertical-align: middle !important;
    padding: 15px !important; /* Spasi sel lebih lega */
    color: #333 !important;
    font-size: 14px !important;
    border-bottom: 1px solid #eee !important;
}
/* Baris Zebra (Selang-seling) yang halus */
.table-striped tbody tr:nth-of-type(odd) {
    background-color: #f9f9f9 !important;
}

/* 4. Footer Refinement */
#footer {
    background-color: #1a1a1a !important; /* Hitam soft */
    padding-top: 40px !important;
}
#footer h3, #footer h4 {
    color: #d4a017 !important; /* Judul Footer jadi Emas */
    font-size: 18px !important;
    font-weight: 600 !important;
    margin-bottom: 20px !important;
}
#footer p, #footer a {
    color: #cccccc !important; /* Teks footer abu-abu terang */
    font-size: 14px !important;
}

/* --- TAD HACK: Subtitle Marketplace --- */

/* 1. Set Link Logo sebagai Acuan Posisi */
.logo a {
    position: relative !important;
    display: inline-block !important; /* Agar kotak mengikuti ukuran gambar */
}

/* 2. Suntikkan Teks "Marketplace" */
.logo a::after {
    content: "Marketplace";      /* Teks yang akan muncul */
    position: absolute;          /* Posisi bebas tapi nempel di logo */
    
    /* --- ATUR POSISI DI SINI --- */
    left: 68px;      /* Geser Kanan (Melewati logo Makara Kuning) */
    bottom: -7px;    /* Geser Bawah/Atas (Sesuaikan agar pas di bawah tulisan DPPD) */
    
    /* --- GAYA TEKS --- */
    color: #ffffff;              /* Warna Putih (Bisa ganti #d4a017 untuk Emas) */
    font-family: 'Poppins', sans-serif;
    font-size: 16px;             /* Ukuran huruf */
    font-weight: 300;            /* Ketebalan: 300 (Tipis) - 700 (Tebal) */
    letter-spacing: 3px;         /* Jarak antar huruf biar renggang/elegan */
    text-transform: uppercase;   /* Huruf Besar Semua */
    opacity: 0.9;                /* Sedikit transparan biar menyatu */
    pointer-events: none;        /* Agar klik tetap tembus ke logo */
}