/* =====================================================
   CUSTOM JOURNAL THEME
   Style  : Formal Modern
   Colors : Navy Blue, Brown Accent, White
   Theme  : OJS Default Theme
===================================================== */


/* =====================================================
   1. GLOBAL STYLE
===================================================== */
body {
    font-family: "Source Sans Pro", "Segoe UI", Arial, sans-serif;
    color: #1f2933;
    background-color: #f8f9fa;
}


/* =====================================================
   2. HEADER & LOGO
===================================================== */
.pkp_site_name_wrapper {
    background-color: #0f2a44;      /* Navy Blue */
    padding: 18px 0;
    border-bottom: 4px solid #8b5a2b; /* Brown Accent */
}

.pkp_site_name img {
    max-width: 320px;   /* Logo lebar */
    height: auto;
}

.pkp_site_name a {
    color: #ffffff !important;
    font-weight: 600;
    letter-spacing: 0.5px;
}


/* =====================================================
   3. PRIMARY NAVIGATION
===================================================== */
.pkp_navigation_primary {
    background-color: #ffffff;
    border-bottom: 1px solid #e5e7eb;
}

.pkp_navigation_primary > li > a {
    color: #0f2a44;
    font-weight: 500;
    padding: 12px 18px;
}

.pkp_navigation_primary > li > a:hover {
    color: #8b5a2b;
}


/* =====================================================
   4. MAIN CONTENT AREA
===================================================== */
.pkp_structure_main {
    background-color: #ffffff;
    padding: 30px;
    border-radius: 6px;
}


/* =====================================================
   5. BUTTONS & FORMS
===================================================== */
.pkp_button,
button,
input[type="submit"] {
    background-color: #0f2a44;
    border: none;
    border-radius: 4px;
    color: #ffffff;
    font-weight: 500;
}

.pkp_button:hover,
button:hover,
input[type="submit"]:hover {
    background-color: #8b5a2b;
}


/* =====================================================
   6. LINKS
===================================================== */
a {
    color: #0f2a44;
}

a:hover {
    color: #8b5a2b;
}


/* =====================================================
   7. FOOTER
===================================================== */
.pkp_structure_footer {
    background-color: #0f2a44;
    color: #ffffff;
    margin-top: 40px;
}

.pkp_structure_footer a {
    color: #d6c4a8;
}

.pkp_structure_footer a:hover {
    color: #ffffff;
}


/* =====================================================
   8. RESPONSIVE ADJUSTMENT (MOBILE)
===================================================== */
@media (max-width: 768px) {

    .pkp_site_name img {
        max-width: 240px; /* Logo lebih kecil di HP */
    }

    .pkp_structure_main {
        padding: 20px;
    }

    .pkp_navigation_primary > li > a {
        padding: 10px 14px;
    }
}
/* =====================================================
   FIX BACKGROUND PALING BELAKANG (PUTIH)
===================================================== */
html,
body {
    background-color: #ffffff !important;
}


/* =====================================================
   HEADER FULL WIDTH + TEKS TIDAK TERPOTONG
===================================================== */

/* Container paling luar header */
.pkp_site_name_wrapper {
    width: 100%;
}

/* Container dalam header (pembatas biru kiri-kanan) */
.pkp_site_name {
    max-width: 100% !important;
    padding-left: 40px;
    padding-right: 40px;
}

/* Logo / tulisan jurnal agar FULL */
.pkp_site_name img {
    max-width: 100% !important; /* biar tidak kepotong */
}

/* Kalau jurnal pakai teks, bukan gambar */
.pkp_site_name a {
    white-space: normal;
}
