html, body {  
    background-image: url("https://jejakdosen.com/wp-content/uploads/2024/12/motif.jpg");  
}

/* ========== WARNA UTAMA COKLAT ========== */
:root {
    --coklat-utama: #5D4037;    /* Coklat tua untuk header/footer utama */
    --coklat-terang: #8D6E63;   /* Coklat sedang untuk hover/aksen */
    --coklat-muda: #D7CCC8;     /* Coklat sangat muda untuk sub-menu */
    --putih: #FFFFFF;
    --teks-gelap: #3E2723;      /* Coklat sangat gelap untuk teks */
}

/* Header utama - ubah jadi coklat */
.pkp_navigation_primary_row {
    background: var(--coklat-utama) !important;
}

/* Sub menu background coklat muda */
.pkp_navigation_primary_row .pkp_navigation_primary_wrapper ul li ul {
    background: var(--coklat-muda) !important;
}

/* Warna teks menu utama */
.pkp_navigation_primary_row .pkp_navigation_primary_wrapper ul li a {
    color: var(--putih) !important;
}

/* Warna teks sub menu */
.pkp_navigation_primary_row .pkp_navigation_primary_wrapper ul li ul li a {
    color: var(--teks-gelap) !important;
}

/* Hover sub menu */
.pkp_navigation_primary_row .pkp_navigation_primary_wrapper ul li ul li a:hover {
    background: var(--coklat-terang) !important;
    color: var(--putih) !important;
}

/* ========== FIX LOGIN & REGISTER ========== */
/* Pastikan wrapper user menu terlihat */
.pkp_navigation_user_wrapper {
    background: transparent;
}

/* Tombol Login/Register */
.pkp_navigation_user.pkp_nav_list .profile a,
.pkp_navigation_user .dropdown .profile a {
    background: var(--coklat-utama) !important;
    color: var(--putih) !important;
    border-radius: 4px !important;
    padding: 5px 12px !important;
    margin: 5px 0 !important;
    display: inline-block !important;
    font-weight: bold !important;
}

.pkp_navigation_user.pkp_nav_list .profile a:hover,
.pkp_navigation_user .dropdown .profile a:hover {
    background: var(--coklat-terang) !important;
    color: var(--putih) !important;
    text-decoration: none !important;
}

/* Menu user (dropdown saat login) */
.pkp_navigation_user .dropdown_menu a {
    color: var(--teks-gelap) !important;
}

/* ========== FOOTER ========== */
.pkp_structure_footer .pkp_footer_content {
    background: var(--coklat-utama) !important;
    padding: 10px !important;
    color: var(--putih);
}

.pkp_structure_footer .pkp_brand_footer {
    background: var(--coklat-utama) !important;
}

/* ========== SISA ELEMEN LAINNYA ========== */
.pkp_structure_content {
    background: #ffffff;
}

/* Tombol submission */
.pkp_block.block_make_submission .content a {
    background: var(--coklat-utama);
    color: var(--putih);
}

.pkp_block.block_make_submission .content a:hover {
    background: var(--coklat-terang) !important;
    color: var(--putih);
}

/* Judul artikel */
.page_title, .name {
    color: var(--coklat-utama);
}

/* Sidebar block title */
.pkp_block .title {
    background-color: var(--coklat-utama);
    color: white;
}

/* Tautan umum */
a {
    color: var(--coklat-utama);
}

a:hover {
    color: var(--coklat-terang);
}

/* Tombol/galley link */
.cmp_button_wire,
.obj_galley_link {
    background: var(--coklat-utama);
    border: 1px solid var(--coklat-utama);
    color: #fff;
}

/* Ringkasan artikel */
.obj_article_summary {
    border: 1px solid var(--coklat-utama);
    box-shadow: 3px 3px var(--coklat-utama);
}

/* Search widget text color */
.pkp_navigation_search_wrapper .pkp_search {
    color: var(--putih);
}
.pkp_navigation_search_wrapper .pkp_search .fa-search {
    color: var(--putih);
}

/* Header logo spacing */
.pkp_site_name {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}
.pkp_site_name .is_img img {
    max-height: 200px !important;
}

/* Menu sidebar custom (jika ada) */
.head-menu {
    border-bottom: 3px var(--coklat-utama) solid;
}
.head-menu a {
    background-color: var(--coklat-utama);
    color: white;
}
.menu-sidebar li a:hover {
    background-color: var(--coklat-utama);
    border-left: 5px solid var(--coklat-terang);
    border-bottom: 5px solid var(--coklat-terang);
}

/* ========== MEDIA QUERIES ========== */
@media only screen and (min-width : 320px) {
    .pkp_site_name .is_img img {
        display: inline-block;
        max-height: 100%;
        max-width: 80%;
        width: auto;
        height: auto;
    }
}
@media only screen and (min-width : 768px) {
    .pkp_site_name .is_img img {
        max-height: 100% !important;
        max-width: 100% !important;
    }
}
@media only screen and (min-width : 992px) {
    .pkp_site_name .is_img img {
        max-height: 100% !important;
        max-width: 100% !important;
    }
}
@media only screen and (min-width : 1200px) {
    .pkp_site_name .is_img img {
        max-height: 100% !important;
        max-width: 100% !important;
    }
}