/* ==========================================
   SALUS JURIS
   Journal of Health Law & Bioethics
   PRIMARY COLOR: #1B4F82
========================================== */


/* ==========================================
   1. PENGATURAN WARNA LATAR (BACKGROUND)
========================================== */

/* Background utama halaman */
html,
body {
    background-color: #F4F8FB !important;
    margin: 0 !important;
    padding: 0 !important;
}


/* Background halaman OJS */
.pkp_structure_page {
    background-color: #F4F8FB !important;
    border-bottom: none !important;
}


/* ==========================================
   2. HEADER & BANNER
========================================== */

/* Header utama */
.pkp_structure_head {
    background-color: transparent !important;
    padding: 0 !important;
    border: none !important;
    border-bottom: none !important;
    position: relative;
}


/* Wrapper header full width */
.pkp_head_wrapper {
    padding: 0 !important;
    margin: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
    display: block !important;
}


/* ==========================================
   2.1 SITE NAME / BANNER
========================================== */

.pkp_site_name_wrapper,
.pkp_site_name {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}


/* Container gambar header */
.pkp_site_name .is_img {
    display: block;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}


/* Banner header Salus Juris */
.pkp_site_name .is_img img {
    content: url(
        'https://journal.denashurya.com/public/journals/10/pageHeaderLogoImage_en.png'
    ) !important;

    width: 100% !important;
    max-width: 100% !important;

    height: auto !important;
    max-height: none !important;

    object-fit: cover !important;

    display: block !important;

    margin: 0 !important;
}


/* ==========================================
   3. MENU REGISTER & LOGIN
========================================== */

/* Menu user mengambang di atas banner */
.pkp_navigation_user_wrapper {
    position: absolute;
    top: 15px;
    right: 20px;
    z-index: 99;
}


/* Tombol Register / Login */
.pkp_navigation_user li a {
    background-color: rgba(255, 255, 255, 0.95);

    padding: 6px 14px;

    border-radius: 5px;

    color: #1B4F82 !important;

    font-weight: 600;

    box-shadow:
        0 2px 6px rgba(27, 79, 130, 0.15);

    border: 1px solid rgba(27, 79, 130, 0.12);

    transition:
        background-color 0.2s ease,
        color 0.2s ease,
        box-shadow 0.2s ease;
}


/* Hover Register / Login */
.pkp_navigation_user li a:hover {
    background-color: #1B4F82 !important;
    color: #ffffff !important;

    box-shadow:
        0 3px 8px rgba(27, 79, 130, 0.25);
}


/* ==========================================
   4. FOOTER
   SALUS JURIS SOFT NAVY BLUE
========================================== */

/*
   Warna:
   #F0F6FA = sangat soft
   #DCEBF4 = soft blue
*/

.pkp_structure_footer {
    background: linear-gradient(
        135deg,
        #F0F6FA 0%,
        #DCEBF4 100%
    ) !important;

    color: #163A5C !important;

    padding: 40px 20px !important;

    margin: 0 !important;

    width: 100% !important;
    max-width: 100% !important;

    border-top: 1px solid #C9DDEB !important;
}


/* ==========================================
   4.1 WARNA TEKS FOOTER
========================================== */

.pkp_structure_footer p,
.pkp_structure_footer h2,
.pkp_structure_footer h3,
.pkp_structure_footer h4,
.pkp_structure_footer span,
.pkp_structure_footer div,
.pkp_structure_footer a {
    color: #163A5C !important;
}


/* ==========================================
   4.2 HOVER LINK FOOTER
========================================== */

.pkp_structure_footer a:hover {
    color: #1B4F82 !important;
    text-decoration: underline;
}


/* ==========================================
   4.3 BLOK CUSTOM HTML FOOTER
========================================== */

.pkp_structure_footer .pkp_block {
    background-color: transparent !important;

    border-radius: 0 !important;

    box-shadow: none !important;

    padding: 0 !important;
}


/* ==========================================
   4.4 LOGO OJS / PKP
========================================== */

/* Logo PKP jika masih aktif */
.pkp_brand_footer {
    filter: brightness(0.2);
}


/* ==========================================
   5. PENGHAPUSAN SISA ELEMEN BAWAAN OJS
========================================== */

html,
body,
.pkp_structure_page {
    background-color: #F4F8FB !important;

    border-bottom: none !important;
}


/* ==========================================
   5.1 FOOTER WRAPPER
========================================== */

.pkp_structure_footer_wrapper,
.pkp_structure_footer {
    background: linear-gradient(
        135deg,
        #F0F6FA 0%,
        #DCEBF4 100%
    ) !important;

    border-bottom: none !important;
}


/* ==========================================
   5.2 MENYEMBUNYIKAN LOGO OJS / PKP
========================================== */

.pkp_brand_footer {
    display: none !important;
}


/* ==========================================
   5.3 MEMATIKAN DEKORASI BAWAAN TEMA OJS
========================================== */

.pkp_structure_page::after,
.pkp_structure_page::before {
    display: none !important;
}


/* ==========================================
   6. PERBAIKAN TATA LETAK AREA KONTEN
   FINAL KARTU PUTIH
========================================== */

/* Wadah utama menjadi kartu putih */

.pkp_structure_content {
    background-color: #FFFFFF !important;

    margin-top: 30px !important;
    margin-bottom: 40px !important;

    border-radius: 12px;

    box-shadow:
        0 4px 15px rgba(27, 79, 130, 0.07);
}


/* ==========================================
   6.1 AREA KONTEN UTAMA
========================================== */

.pkp_structure_main {
    background-color: transparent !important;

    box-shadow: none !important;

    border: none !important;
}


/* ==========================================
   6.2 SIDEBAR
========================================== */

.pkp_structure_sidebar {
    border-left: none !important;
}


/* ==========================================
   6.3 MENGHILANGKAN GARIS DEKORASI
========================================== */

.pkp_structure_main::before,
.pkp_structure_main::after {
    display: none !important;
}


/* ==========================================
   7. WARNA UTAMA JURNAL
   SALUS JURIS
   #1B4F82
========================================== */


/* ==========================================
   7.1 LINK UMUM
========================================== */

a {
    color: #1B4F82;
}


a:hover {
    color: #12395F;
}


/* ==========================================
   7.2 TOMBOL UTAMA OJS
========================================== */

button,
.button,
.pkp_button,
.btn-primary {
    background-color: #1B4F82 !important;

    border-color: #1B4F82 !important;

    color: #FFFFFF !important;

    transition:
        background-color 0.2s ease,
        border-color 0.2s ease,
        box-shadow 0.2s ease;
}


/* ==========================================
   7.3 HOVER TOMBOL
========================================== */

button:hover,
.button:hover,
.pkp_button:hover,
.btn-primary:hover {
    background-color: #12395F !important;

    border-color: #12395F !important;

    color: #FFFFFF !important;

    box-shadow:
        0 3px 8px rgba(27, 79, 130, 0.20);
}


/* ==========================================
   7.4 TOMBOL OUTLINE
========================================== */

.btn-outline-primary,
.button--outline {
    background-color: transparent !important;

    border-color: #1B4F82 !important;

    color: #1B4F82 !important;
}


.btn-outline-primary:hover,
.button--outline:hover {
    background-color: #1B4F82 !important;

    border-color: #1B4F82 !important;

    color: #FFFFFF !important;
}


/* ==========================================
   8. AKSEN WARNA PRIMARY
========================================== */


/* ==========================================
   8.1 TEKS PRIMARY
========================================== */

.text-primary {
    color: #1B4F82 !important;
}


/* ==========================================
   8.2 BACKGROUND PRIMARY
========================================== */

.bg-primary {
    background-color: #1B4F82 !important;
}


/* ==========================================
   8.3 BORDER PRIMARY
========================================== */

.border-primary {
    border-color: #1B4F82 !important;
}


/* ==========================================
   9. FORM INPUT
========================================== */

input:focus,
textarea:focus,
select:focus {
    border-color: #1B4F82 !important;

    box-shadow:
        0 0 0 2px rgba(27, 79, 130, 0.12) !important;

    outline: none !important;
}


/* ==========================================
   10. CHECKBOX & RADIO
========================================== */

input[type="checkbox"]:checked,
input[type="radio"]:checked {
    accent-color: #1B4F82 !important;
}


/* ==========================================
   11. HEADING
========================================== */

h1,
h2,
h3,
h4,
h5,
h6 {
    color: #163A5C;
}


/* ==========================================
   12. MENU NAVIGASI
========================================== */

.pkp_navigation_primary {
    background-color: #FFFFFF !important;
}


.pkp_navigation_primary > li > a {
    color: #163A5C !important;
}


.pkp_navigation_primary > li > a:hover {
    color: #1B4F82 !important;
}


/* ==========================================
   12.1 MENU AKTIF
========================================== */

.pkp_navigation_primary > li.current > a,
.pkp_navigation_primary > li.active > a {
    color: #1B4F82 !important;

    border-bottom-color: #1B4F82 !important;
}


/* ==========================================
   13. SIDEBAR BLOCK
========================================== */

.pkp_block {
    border-color: #C9DDEB;
}


.pkp_block .title {
    color: #1B4F82 !important;
}


/* ==========================================
   14. PAGINATION
========================================== */

.pagination > li > a,
.pagination > li > span {
    color: #1B4F82 !important;

    border-color: #C9DDEB !important;

    background-color: #FFFFFF !important;
}


.pagination > li > a:hover,
.pagination > li > span:hover {
    background-color: #EAF3F9 !important;

    color: #12395F !important;

    border-color: #1B4F82 !important;
}


.pagination > .active > a,
.pagination > .active > span {
    background-color: #1B4F82 !important;

    border-color: #1B4F82 !important;

    color: #FFFFFF !important;
}


/* ==========================================
   15. BADGE / LABEL
========================================== */

.label-primary,
.badge-primary {
    background-color: #1B4F82 !important;

    color: #FFFFFF !important;
}


/* ==========================================
   16. TABLE
========================================== */

table thead th {
    background-color: #EAF3F9 !important;

    color: #163A5C !important;

    border-color: #C9DDEB !important;
}


table td {
    border-color: #DCE7EF !important;
}


/* ==========================================
   17. ALERT / INFO
========================================== */

.alert-info {
    background-color: #EAF3F9 !important;

    border-color: #C9DDEB !important;

    color: #163A5C !important;
}


/* ==========================================
   18. SELECTION
========================================== */

::selection {
    background-color: #1B4F82;

    color: #FFFFFF;
}


/* ==========================================
   19. SCROLLBAR
========================================== */

::-webkit-scrollbar {
    width: 8px;
}


::-webkit-scrollbar-track {
    background: #F0F5F9;
}


::-webkit-scrollbar-thumb {
    background: #9DBBD2;

    border-radius: 10px;
}


::-webkit-scrollbar-thumb:hover {
    background: #1B4F82;
}