/* BACKGROUND LUAR */
body{
  font-family:tahoma,geneva,sans-serif;
  background-color: #516f85;
    background-image: url("https://transparenttextures.com/patterns/wood-pattern.png");
}

/* CARD UTAMA WEBSITE */
.pkp_structure_page{
  max-width:1150px;
  margin:0px auto;
  background:#ffffff;
  border-radius:5px;
  box-shadow:0 8px 25px rgba(0,0,0,0.08);
  overflow:hidden;
}

/* HEADER */
.pkp_structure_head{
  background:linear-gradient(135deg,#fff,#0FA6DF);
  color:#fff;

}

/* LOGO */
.pkp_site_name .is_img img{
  margin-top: -35px;
  margin-bottom: -25px;
  max-height:421px;
  max-width:1150px;
}

/* MENU */
.pkp_navigation_primary_wrapper{
  
  padding: 5px;
  margin-top: 20px;
  margin-right: 20px;
  margin-left: 20px;

}

/* MENU LINK */
.pkp_navigation_primary > li > a{
  color:#fff;
  font-weight:600;
}

.pkp_navigation_primary > li > a:hover{
  background:rgba(255,255,255,0.15);
  border-radius:6px;
}

/* MENU USER*/
.pkp_navigation_user_wrapper{
  padding-top: 0px;
  padding-right: 60px;
  margin-right: 20px;

}

/* MENU USER LINK */
.pkp_navigation_user > li > a{
  color:#fff;
  font-weight:600;
}

.pkp_navigation_user > li > a:hover{
  background:rgba(255,255,255,0.15);
  border-radius:6px;
}

/* CONTENT */
.pkp_structure_content{
  padding:0px;
}


/* ============================= */
/* HILANGKAN JUDUL ABOUT JOURNAL */
/* ============================= */

.page_index_journal .homepage_about h2{
  display:none;
  content:"Selamat Datang di Al-Khidmah: Jurnal Pengabdian Kepada Masyarakat";
}


/* ============================= */
/* ABOUT JOURNAL CARD STYLE */
/* ============================= */

.homepage_about{
  background:#ffffff;
  padding:10px; 
  border-radius:6px;
  /*margin:25px;*/
  margin-top:25px;
  box-shadow:0 6px 20px rgba(0,0,0,0.06);
  border-left:6px solid #0FA6DF;
  position:relative;
}

.homepage_about:before{
  content:"";
  position:absolute;
  width:60px;
  height:60px;
  background:rgba(15,166,223,0.08);
  border-radius:50%;
  right:20px;
  top:10px;
}



/* ============================= */
/* LIST ARTIKEL ORNAMEN */
/* ============================= */

.cmp_article_list articles,
.obj_article_summary{
  background:#ffffff;
  border-radius:6px;
  padding:18px;
  margin-bottom:18px;
  box-shadow:0 6px 15px rgba(0,0,0,0.06);
  border-left:5px solid #0FA6DF;
  position:relative;
  transition:all .3s ease;
}

/* ORNAMEN IKON */
.obj_article_summary:before{
  content:"📖";
  position:absolute;
  font-size:18px;
  left:-12px;
  top:18px;
  background:#0FA6DF;
  color:#fff;
  width:28px;
  height:28px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow:0 3px 8px rgba(0,0,0,0.2);
}

/* HOVER EFFECT */
.obj_article_summary:hover{
  transform:translateY(-3px);
  box-shadow:0 10px 25px rgba(0,0,0,0.12);
  border-left-color:#0b7aa4;
}


/* JUDUL ARTIKEL */
.obj_article_summary .title a{
  font-weight:700;
  color:#0f172a;
  font-size:16px;
}

.obj_article_summary .title a:hover{
  color:#0FA6DF;
}


/* ABSTRACT */
.obj_article_details .abstract{
  text-align:justify;
}


/* FOOTER */
.pkp_structure_footer_wrapper{
  background:linear-gradient(135deg,#1e293b,#0f172a);
  color:#fff;
  padding:10px;
}

/* FOOTER TEXT */
.pkp_structure_footer{
  color:#e5e7eb;
}

/* ============================= */
/* TERBITAN / ISSUE STYLE */
/* ============================= */

/* CARD ISSUE */
.obj_issue_summary{
  background:#ffffff;
  border-radius:6px;
  padding:18px;
  margin-bottom:20px;
  box-shadow:0 6px 18px rgba(0,0,0,0.07);
  border-left:5px solid #0FA6DF;
  position:relative;
  transition:all .3s ease;
}

/* HOVER EFFECT */
.obj_issue_summary:hover{
  transform:translateY(-4px);
  box-shadow:0 12px 28px rgba(0,0,0,0.12);
}

/* COVER ISSUE */
.obj_issue_summary .cover img{
  border-radius:4px;
  box-shadow:0 4px 12px rgba(0,0,0,0.15);
}

/* JUDUL TERBITAN */
.obj_issue_summary .title{
  font-weight:700;
  font-size:17px;
  color:#0f172a;
}

.obj_issue_summary .title a{
  color:#0f172a;
}

.obj_issue_summary .title a:hover{
  color:#0FA6DF;
}

/* BADGE VOLUME */
/* Label utama "Terbitan" */
.obj_issue_summary:before {
  content: "Terbitan";
  position: absolute;
  top: -10px;
  right: 15px;
  background: #0FA6DF;
  color: #fff;
  font-size: 11px;
  padding: 4px 10px;
  border-radius: 20px;
  letter-spacing: .5px;
  box-shadow: 0 3px 8px rgba(0,0,0,0.2);
}



/* INFO ISSUE */
.obj_issue_summary .series{
  font-size:13px;
  color:#64748b;
}

/* GARIS PEMISAH ARTIKEL DI ISSUE */
.issue_toc_section{
  border-top:2px dashed #e2e8f0;
  margin-top:15px;
  padding-top:10px;
}

/* JUDUL SECTION (Artikel / Research dll) */
.issue_toc_section h2{
  font-size:14px;
  font-weight:700;
  color:#0FA6DF;
  text-transform:uppercase;
  letter-spacing:1px;
}

/* ARTIKEL DALAM TERBITAN */
.issue_toc .obj_article_summary{
  border-left:4px solid #0FA6DF;
  padding-left:14px;
}

/* ============================= */
/* SIDEBAR STYLE */
/* ============================= */

.pkp_structure_sidebar{
  padding:20px 15px;
}

/* BOX SIDEBAR */
.pkp_block{
  background:#ffffff;
  border-radius:6px;
  box-shadow:0 5px 18px rgba(0,0,0,0.06);
  margin-bottom:20px;
  overflow:hidden;
  border-top:3px solid #0FA6DF;
}

/* JUDUL SIDEBAR */
.pkp_block .title{
  background:linear-gradient(135deg,#0FA6DF,#0b7aa4);
  color:#fff;
  font-weight:700;
  font-size:14px;
  padding:10px 14px;
  letter-spacing:.5px;
}

/* ISI SIDEBAR */
.pkp_block .content{
  padding:0px 0px;
}


/* ============================= */
/* MENU LINK SIDEBAR */
/* ============================= */

.pkp_block .content ul{
  list-style:none;
  padding:0;
  margin:0;
}

.pkp_block .content li{
  border-bottom:1px solid #eef2f7;
}

.pkp_block .content li:last-child{
  border-bottom:none;
}

.pkp_block .content a{
  display:block;
  padding:5px 5px;
  color:#334155;
  font-size:14px;
  text-decoration:none;
  border-radius:4px;
  transition:all .25s ease;
}

/* ICON OTOMATIS */
.pkp_block .content a:before{
  content:"";
  font-size:12px;
  color:#0FA6DF;
  margin-right:8px;
}

/* HOVER */
.pkp_block .content a:hover{
  background:#f1f7fb;
  color:#0FA6DF;
  padding-left:14px;
}


/* ============================= */
/* SEARCH BOX SIDEBAR */
/* ============================= */

.pkp_block.block_make_submission,
.pkp_block.block_information{
  border-top:3px solid #22c55e;
}


/* ============================= */
/* BUTTON SUBMISSION */
/* ============================= */

.block_make_submission a{
  display:block;
  background:#22c55e;
  color:#fff !important;
  text-align:center;
  padding:10px;
  border-radius:4px;
  font-weight:700;
  margin-top:8px;
  transition:.3s;
}

.block_make_submission a:hover{
  background:#16a34a;
}


/* ============================= */
/* BADGE TANGGAL TERBIT */
/* ============================= */

.obj_article_summary .heading{
  display:flex;
  align-items:center;
  margin-top:6px;
}

/* BOX TANGGAL */
.obj_article_summary .published{
  background:#f1f7fb;
  border-left:3px solid #0FA6DF;
  padding:4px 10px;
  border-radius:4px;
  font-size:12px;
  color:#475569;
  display:inline-flex;
  align-items:center;
  gap:4px;
}

/* ICON */
.obj_article_summary .published:before{
  content:"📅";
  margin-right:3px;
}

/* LABEL */
.obj_article_summary .published .label{
  font-weight:600;
  color:#334155;
}

/* VALUE */
.obj_article_summary .published .value{
  color:#0FA6DF;
  font-weight:600;
}

/* HOVER */
.obj_article_summary:hover .published{
  background:#e6f4fb;
}

/* RESPONSIVE */
@media (max-width:768px){

  .pkp_structure_page{
    margin:5px;
  }

  .pkp_structure_content{
    padding:10px;
  }
  
  .pkp_site_name .is_img img {
    max-width: 100%;   /* tidak melebihi lebar layar */
    margin-top: 0;
    margin-bottom: 0;
  }

}