/* coloring */
html {
    color: #000000;
}
body {
    background: url(https://journal.walisongo.ac.id/public/site/images/inzacky/bg-2018.png);
    background-repeat: no-repeat;
    background-size: inherit;
    background-attachment: inherit;
    background-position: center top;
    background-color: white;
}
#main, .main-full {
    padding-left: 0 !important;
    max-width: 1344px;
    margin: 0 auto;
    margin-top: -5px;
    background: #fff;
    box-shadow: 0 0 10px #d4c6c6;
}
#main a {
    color: #023b3c;
}
nav {
    background-color: #a33f7f;
}
nav .nav-wrapper {
    height: 100%;
    max-width: 1344px;
    margin: 0 auto;
}

.blockTitle {
    display: block;
    background: #a33f7f;
    padding: 10px;
    color: #fff;
    border-radius: 4px 4px 0 0;
    font-size: 1.2rem;
    margin: -10px -10px 5px -10px;
}
.instruct {
    font-size: 0.9rem;
    color: #333;
}
.nfile {
    background: #a33f7f;
}
div.panel-body a.title {
    font-size: 1rem;
}
.infoissue {
    background: #a33f7f;
    color: #ffffff;
}
.issuehome {
    background: #f4e7f7;
}
.issuecoverage, .issuecoverage-a  {
    background: #7d84b5 !important;
    color: #fff !important;
    font-weight: 500;
}
.issuecoverage {
    padding: 10px 10px;
    border-radius: 0 0 5px 5px;
    /* font-size: 15px!important; */
}
.issuecoverage-a {
    padding: 2px 25px;
    display: table;
    border-radius: 5px;
    /* font-size: 15px!important; */
}
.TOC {
    border-bottom: 1px solid #f4e7f7;
}
.tocTitle a {
    color: #333333 !important;
    line-height: 130%;
    font-weight: 600;
    font-family: 'Open Sans', sans-serif;
    font-size: 14px;
    display: inline-block;
}
.tocAuthors, .tocAuthors a, .tocPages, .well, #principalContact {
    color: #524f4f !important;
}
.nfile, header.header_view {
    color: #fff !important;
    background: #a33f7f !important;
}
.nfile:hover, header.header_view:hover {
    background: #a33f7f !important;
}
.sidemenu li {
    background: #f2f0f0;
    border-bottom: 1px solid #b0e4e4;
    margin: -10px -10px 10px -10px;
    padding: 10px;
}

.block a, .sidemenu li a {
    color: #333 !important;
    font-weight: 600 !important;
}
.sidemenu li:hover {
    background: #f4e7f7;
}
.footertop {
    background: #f2a7d8;
    padding: 10px;
    color: #000000;
    border-bottom: 5px solid #ce70ad;
}
.page-footer {
    background: #a33f7f;
    color: #fff;
}
.page-footer a {
    color: #fff !important;
}
.credit {
    font-size: 0.8rem;
    color: #fff !important;
    opacity: 1;
}
#horizontal-nav ul li a i, #horizontal-nav ul li a span {
    color: #5a5858;
    font-weight: 700;
}
.brand-logo {
    border-radius: 25px;
}
.tidakfull {
    max-width: 1344px;
    margin: 0 auto !important;
}
.footer-copyright {
    max-width: 1344px;
    margin: 0 auto;
}
.metriknya {
    text-align: center;
}

.btn-large:hover, .btn-small:hover, .btn:hover, .btnlink:hover, .button:hover, .action:hover {
    background: #651e73;
    color: #fff !important;
}
.btnlink, .btn-large, .btn-small, .btn, .button, .action {
    background: #a33f7f;
    color: #fff !important;
    text-align: center;
    border: 0px solid gray;
    min-width: 100px;
    display: inline-block;
    box-shadow: 0px 0px 0px grey;
    border-radius: 3px;
}
label {
    color: #333;
}
.published {
    display: block; /* ganti none jika tidak dimunculkan */
}
.submitted {
    display: none; /* ganti none jika tidak dimunculkan */
}
#profilePicContent {
    margin: 20px 16px 60px 16px;
}
#mainNavbar, #mainmenu, #pageFooter {
    color: #fff !important;
    background: #7b3489 !important;
    border: none;
    border-radius: 0px;
}
#pageFooter a, #pageFooter a:hover, #pageFooter a:visited {
    color: #fff !important;
}
#container > #body > #main {
    box-shadow: none;
}
.btn-floating.btn-large {
    background: #a33f7f !important;
}
.btn-floating.btn-large:hover {
    background: #a33f7f !important;
}
.homecontent {
    box-shadow: none;
    background: #fff;
}
#sidebarUser > strong {
    background: #a33f7f;
    color: #fff;
}
#headerTitle > h1 {
    color: #fff;
    background: #7b3489;
}
#header > #headerTitle > h1 {
    background: #fff;
    color: #222222;
}
#container {
    display: block !important;
}
kategori {
    display: none;
}

/* Kolom gambar dengan gembok */
.image-column {
    flex: 1; /* Proporsi lebih kecil untuk gambar */
    text-align: center;
    position: relative; /* Untuk positioning gembok */
}

.img-lock {
    width: 20px !important; /* Ukuran eksplisit dengan prioritas tinggi */
    height: auto;
    margin-bottom: 10px; /* Jarak antara gembok dan cover */
    position: absolute; /* Memungkinkan penyesuaian posisi */
    top: 10px; /* Atur posisi vertikal */
    left: 10px; /* Atur posisi horizontal */
}

/* Cover gambar */
.cover-img {
    max-width: 100%;
    height: auto;
    border: 1px solid #ccc;
    border-radius: 5px;
}

/* Kolom tabel */
.table-column {
    flex: 2;
}

/* Tabel dan warnanya */
.rajawalitable {
    width: 100%;
    border-collapse: collapse !important;
    background-color: #fff !important; /* Warna tabel eksplisit */
    border-spacing: 0 !important; /* Menghapus jarak antar sel tabel */
}

.rajawalitable th {
    text-align: left !important;
    font-weight: bold !important;
    line-height: 1 !important; /* Mengurangi jarak antar baris teks */
    background-color: #f5f5f5 !important; /* Warna header eksplisit */
    width: 175px !important; /* Lebar otomatis sesuai isi */
}

.rajawalitable td {
    line-height: 1 !important; /* Mengurangi jarak antar baris teks */
}

/* Panel utama */
.row.card-panel {
    display: flex;
    gap: 20px;
    background-color: #ffe0b2 !important; /* Warna latar kolom tidak bisa diubah */
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.1); /* Bayangan lembut */
}

/* Menambahkan CSS untuk gambar tertentu */
img[src="/public/site/images/helmi/OA-png_trans.png"] {
    width: 75px; /* Ukuran gambar */
    height: auto; /* Mempertahankan proporsi */
    position: absolute; /* Agar bisa diatur posisinya */
    top: 125px; /* Jarak dari atas */
    right: 325px; /* Jarak dari kanan */
    z-index: 10; /* Agar tetap di atas elemen lainnya */
}

/* Mengurangi margin kanan dan kiri */
#main, .main-full, .tidakfull {
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding-left: 15px !important;
    padding-right: 15px !important;
}
/* Menghapus warna tabel */
.rajawalitable {
    background-color: transparent !important; /* Menghilangkan warna tabel */
}

.rajawalitable th {
    background-color: transparent !important; /* Menghilangkan warna header tabel */
}

/* Mengubah warna latar belakang dari oranye ke warna lebih muda */
.row.card-panel {
    background-color: #fff6e5 !important; /* Warna krem muda */
}

/* Geser gambar ke kiri */
.image-column {
    margin-left: 0 !important; /* Menghilangkan margin kiri gambar */
    margin-right: 10px !important; /* Jarak kecil ke tabel */
    padding: 0 !important; /* Menghapus padding internal */
}

/* Perlebar tabel ke kanan */
.table-column {
    flex: 4 !important; /* Perbesar proporsi kolom tabel */
    padding: 0 !important; /* Hapus padding tambahan di sekitar tabel */
}

/* Optimalisasi tata letak */
.row.card-panel {
    display: flex !important; /* Pastikan tata letak menggunakan flexbox */
    align-items: flex-start; /* Menjaga posisi elemen di bagian atas */
    gap: 10px; /* Jarak antara gambar dan tabel */
}

/* Tabel lebih fleksibel */
.rajawalitable {
    width: 100%; /* Pastikan tabel mengambil seluruh lebar kolomnya */
    table-layout: auto; /* Sesuaikan lebar kolom tabel dengan isi */
}

.rajawalitable td, .rajawalitable th {
    padding: 3px 10px !important; /* Jarak internal lebih kecil */
    word-wrap: break-word; /* Hindari teks memanjang ke luar kolom */
}
.pkp_block {
    margin-bottom: 10px; /* Mengatur jarak antar custom block */
    margin-left: 5px;
    padding: 0; /* Opsional, untuk memastikan tidak ada padding ekstra */
}

.pkp_block:last-child {
    margin-bottom: 0; /* Menghilangkan margin dari elemen terakhir */
}

.pkp_brand_footer{
    display: none;
}

/* Mengatur header secara keseluruhan */
header.pkp_structure_head {
    min-height: 180px; /* Tambahkan tinggi minimum */
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between; /* Memastikan elemen berada pada posisi yang sesuai */
    padding: 20px; /* Beri jarak ekstra */
    background-color: #your-color; /* Sesuaikan dengan kebutuhan */
    box-sizing: border-box;
}

/* Mengatur wrapper untuk judul situs */
.pkp_site_name_wrapper {
    width: 100%;
    text-align: center;
    margin-bottom: 15px; /* Beri jarak ekstra untuk navigasi */
}

.pkp_site_name a {
    font-size: 28px; /* Tingkatkan ukuran font */
    font-weight: bold;
    color: #your-color;
    text-decoration: none;
}

/* Mengatur menu navigasi */
.pkp_navigation_primary_row {
    text-align:left;
    padding-left:15px;
}

.pkp_navigation_primary_wrapper {
    display: flex; /* Ubah wrapper navigasi menjadi flexbox */
    align-items: center; /* Rata tengah secara vertikal */
}

.pkp_nav_list {
    display: flex; /* Atur elemen ul menjadi flexbox */
    margin: 0;
    padding: 0;
    list-style: none; /* Hilangkan bullet point */
}

.pkp_nav_list > li {
    margin: 0 10px; /* Tambahkan jarak antar menu */
}

.pkp_navigation_search_wrapper {
    margin-left: auto; /* Letakkan elemen Search di sisi kanan */
    display: flex;
    align-items: center; /* Rata tengah secara vertikal */
}

.pkp_navigation_search_wrapper a {
    text-decoration: none;
    font-size: 16px;
    color: inherit; /* Gunakan warna asli */
    display: flex;
    align-items: center; /* Rata tengah ikon dan teks */
}

.pkp_navigation_search_wrapper a .fa-search {
    margin-right: 5px; /* Beri jarak antara ikon dan teks */
}

.pkp_site_name_wrapper {
    width: 100%;
    text-align: center;
    margin-bottom: 15px;
    padding: 0; /* Pastikan tidak ada padding yang menghalangi lebar penuh */
}

.pkp_site_name, .is_img {
    width: 100%;
}

.pkp_site_name .is_img img {
    display: block;
    max-height: 200px;
    width: 100%;  /* Mengisi lebar kontainer */
    height: auto; /* Menjaga rasio gambar */
}


.pkp_navigation_user_wrapper {
    position: absolute; /* Atau gunakan 'fixed' jika ingin tetap di posisi ini saat scroll */
    top: 0; /* Posisikan di bagian atas */
    right: 0; /* Posisikan di bagian kanan */
    left: 1035px;
    margin: 0px; /* Tambahkan sedikit jarak dari tepi */
}

.pkp_navigation_user_wrapper ul {
    list-style: none; /* Menghilangkan bullet pada list */
    padding: 0;
    margin: 0;
    display: flex; /* Membuat elemen dalam list menjadi horizontal */
    gap: 10px; /* Beri jarak antar item */
}

.pkp_navigation_user_wrapper a {
    text-decoration: none; /* Menghilangkan garis bawah pada link */
    color: #ffff; /* Warna teks */
    font-size: 14px; /* Ukuran font */
}

/* Menghilangkan background pada elemen navigasi breadcrumbs */
.cmp_breadcrumbs {
    background-color: transparent !important; /* Hilangkan background warna */
    border: none; /* Hilangkan border jika ada */
    box-shadow: none; /* Hilangkan bayangan jika ada */
}

/* Opsional: Mengatur padding atau margin */
.cmp_breadcrumbs ol {
    margin: 0;
    padding: 0;
}

/* Styling teks jika dibutuhkan */
.cmp_breadcrumbs a {
    color: #000; /* Warna teks link */
    text-decoration: none;
}

.cmp_breadcrumbs a:hover {
    color: #007BFF; /* Warna teks saat hover */
}

.cmp_breadcrumbs .current {
    color: #555; /* Warna untuk elemen aktif */
}

.pkp_structure_footer_wrapper {
    background-color: #f2a7d8 !important; /* Ungu muda */
}

.pkp_structure_footer {
    background-color: #f2a7d8 !important; /* Ungu muda */
    color: #333; /* Warna teks */
}

.pkp_footer_content div {
    background-color: #f2a7d8 !important; /* Pastikan elemen teks juga berubah */
    color: #333; /* Warna teks */
}

/* Styling tabel About the Journal */
.about-journal-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 10px;
    font-family: 'Open Sans', sans-serif;
    font-size: 14px;
    color: #333;
}

.about-journal-table th,
.about-journal-table td {
    padding: 8px 12px;
    vertical-align: top;
}

.about-journal-table th {
    text-align: left;
    font-weight: 600;
    width: 180px;
    color: #111;
    background-color: #f4f4f4;
    border-bottom: 1px solid #e0dede;
}

.about-journal-table td {
    border-bottom: 1px solid #f2f2f2;
}

/* Responsive dan fleksibel */
@media screen and (max-width: 768px) {
    .about-journal-table,
    .about-journal-table tbody,
    .about-journal-table tr,
    .about-journal-table td,
    .about-journal-table th {
        display: block;
        width: 100%;
    }

    .about-journal-table th {
        background-color: transparent;
        border: none;
        padding-top: 15px;
    }

    .about-journal-table td {
        padding-bottom: 15px;
    }
}

/* Gaya umum untuk tabel */
.rajawalitable {
  width: 100%;
  border-collapse: collapse;
  font-family: 'Segoe UI', 'Roboto', 'Arial', sans-serif;
  font-size: 14px;
  color: #333;
  background-color: #fff;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
  margin-top: 10px;
}

/* Gaya untuk sel header */
.rajawalitable th {
  width: 30%;
  background-color: #f2f2f2;
  font-weight: 600;
  padding: 10px 15px;
  border-bottom: 1px solid #ddd;
  text-align: left;
  vertical-align: top;
}

/* Gaya untuk sel isi */
.rajawalitable td {
  padding: 10px 15px;
  border-bottom: 1px solid #eee;
  text-align: left;
  vertical-align: top;
}

/* Tautan dalam sel */
.rajawalitable td a {
  color: #0066cc;
  text-decoration: none;
}

.rajawalitable td a:hover {
  text-decoration: underline;
}

/* Responsif jika diperlukan */
@media screen and (max-width: 768px) {
  .rajawalitable th,
  .rajawalitable td {
    display: block;
    width: 100%;
  }

  .rajawalitable th {
    background-color: #fafafa;
    border-bottom: none;
  }
}

.rajawalitable td p {
  margin: 0;
  padding: 0;
}

/* Deteksi baris yang hanya punya satu kolom (td saja tanpa th), lalu beri padding kiri */
.rajawalitable tr td:only-child {
  padding-left: 175px !important; /* Sesuaikan dengan lebar th yang normal */
  background-color: #fff6e5; /* Biar tidak menghilang */
  display: block; /* Paksa blok agar turun */
}

