/* =========================================================================
   Custom OJS 3 – Tema "Pink–Yellow Floral"
   Basis  : Default Theme OJS
   Target : OJS 3.3.x – 3.5.x
   Owner  : anwar dani
   Lisensi: GPL
   Catatan: Dominasi gradasi merah muda -> kuning + ornamen bunga di background
            (SVG ditanam langsung, tanpa file/gambar eksternal).
   ========================================================================= */

@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css');
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;600;700&family=Poppins:wght@500;600;700&display=swap');

/* ----------------------------- VARIABEL WARNA --------------------------- */
:root {
  --pk-pink:        #ec4899;   /* merah muda utama          */
  --pk-pink-deep:   #be185d;   /* rose tua (judul/aksen)    */
  --pk-pink-soft:   #fbcfe8;   /* pink muda                 */
  --pk-yellow:      #fbbf24;   /* kuning                    */
  --pk-yellow-soft: #fef08a;   /* kuning muda               */
  --pk-text:        #4a2235;   /* teks utama (plum gelap)   */
  --pk-muted:       #9b6b80;   /* teks sekunder             */
  --pk-line:        #f7d6e6;   /* garis halus               */

  /* gradasi merah muda -> kuning */
  --pk-grad:     linear-gradient(120deg, #e84393 0%, #fd79a8 35%, #fdcb6e 75%, #ffeaa7 100%);
  --pk-grad-bar: linear-gradient(120deg, #e84393 0%, #f368a0 45%, #f6a93b 100%);
  --pk-grad-soft:linear-gradient(120deg, #fbcfe8 0%, #fde6c0 60%, #fef08a 100%);
}

/* ------------------------------- TIPOGRAFI ------------------------------ */
html, body, * {
  font-family: 'Open Sans', Helvetica, Arial, sans-serif;
}
body {
  color: var(--pk-text);
  line-height: 1.6;
  /* ornamen bunga + warna dasar lembut */
  background:
    url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%27160%27%20height%3D%27160%27%20viewBox%3D%270%200%20160%20160%27%3E%20%3Cg%20opacity%3D%270.55%27%3E%20%3Cg%20transform%3D%27translate%2838%2C40%29%27%3E%20%3Ccircle%20cx%3D%270%27%20cy%3D%27-12%27%20r%3D%279%27%20fill%3D%27%23f9a8d4%27%2F%3E%20%3Ccircle%20cx%3D%2711%27%20cy%3D%27-4%27%20r%3D%279%27%20fill%3D%27%23f9a8d4%27%2F%3E%20%3Ccircle%20cx%3D%277%27%20cy%3D%2710%27%20r%3D%279%27%20fill%3D%27%23f9a8d4%27%2F%3E%20%3Ccircle%20cx%3D%27-7%27%20cy%3D%2710%27%20r%3D%279%27%20fill%3D%27%23f9a8d4%27%2F%3E%20%3Ccircle%20cx%3D%27-11%27%20cy%3D%27-4%27%20r%3D%279%27%20fill%3D%27%23f9a8d4%27%2F%3E%20%3Ccircle%20cx%3D%270%27%20cy%3D%270%27%20r%3D%276.5%27%20fill%3D%27%23fde047%27%2F%3E%20%3C%2Fg%3E%20%3Cg%20transform%3D%27translate%28120%2C112%29%20scale%280.85%29%27%3E%20%3Ccircle%20cx%3D%270%27%20cy%3D%27-12%27%20r%3D%279%27%20fill%3D%27%23fcd34d%27%2F%3E%20%3Ccircle%20cx%3D%2711%27%20cy%3D%27-4%27%20r%3D%279%27%20fill%3D%27%23fcd34d%27%2F%3E%20%3Ccircle%20cx%3D%277%27%20cy%3D%2710%27%20r%3D%279%27%20fill%3D%27%23fcd34d%27%2F%3E%20%3Ccircle%20cx%3D%27-7%27%20cy%3D%2710%27%20r%3D%279%27%20fill%3D%27%23fcd34d%27%2F%3E%20%3Ccircle%20cx%3D%27-11%27%20cy%3D%27-4%27%20r%3D%279%27%20fill%3D%27%23fcd34d%27%2F%3E%20%3Ccircle%20cx%3D%270%27%20cy%3D%270%27%20r%3D%276.5%27%20fill%3D%27%23f9a8d4%27%2F%3E%20%3C%2Fg%3E%20%3Cg%20transform%3D%27translate%28110%2C30%29%20scale%280.5%29%27%3E%20%3Ccircle%20cx%3D%270%27%20cy%3D%27-12%27%20r%3D%279%27%20fill%3D%27%23fbcfe8%27%2F%3E%20%3Ccircle%20cx%3D%2711%27%20cy%3D%27-4%27%20r%3D%279%27%20fill%3D%27%23fbcfe8%27%2F%3E%20%3Ccircle%20cx%3D%277%27%20cy%3D%2710%27%20r%3D%279%27%20fill%3D%27%23fbcfe8%27%2F%3E%20%3Ccircle%20cx%3D%27-7%27%20cy%3D%2710%27%20r%3D%279%27%20fill%3D%27%23fbcfe8%27%2F%3E%20%3Ccircle%20cx%3D%27-11%27%20cy%3D%27-4%27%20r%3D%279%27%20fill%3D%27%23fbcfe8%27%2F%3E%20%3Ccircle%20cx%3D%270%27%20cy%3D%270%27%20r%3D%276.5%27%20fill%3D%27%23fef08a%27%2F%3E%20%3C%2Fg%3E%20%3Cg%20transform%3D%27translate%2828%2C120%29%20scale%280.55%29%27%3E%20%3Ccircle%20cx%3D%270%27%20cy%3D%27-12%27%20r%3D%279%27%20fill%3D%27%23fef08a%27%2F%3E%20%3Ccircle%20cx%3D%2711%27%20cy%3D%27-4%27%20r%3D%279%27%20fill%3D%27%23fef08a%27%2F%3E%20%3Ccircle%20cx%3D%277%27%20cy%3D%2710%27%20r%3D%279%27%20fill%3D%27%23fef08a%27%2F%3E%20%3Ccircle%20cx%3D%27-7%27%20cy%3D%2710%27%20r%3D%279%27%20fill%3D%27%23fef08a%27%2F%3E%20%3Ccircle%20cx%3D%27-11%27%20cy%3D%27-4%27%20r%3D%279%27%20fill%3D%27%23fef08a%27%2F%3E%20%3Ccircle%20cx%3D%270%27%20cy%3D%270%27%20r%3D%276.5%27%20fill%3D%27%23f9a8d4%27%2F%3E%20%3C%2Fg%3E%20%3C%2Fg%3E%20%3C%2Fsvg%3E") repeat,
    linear-gradient(180deg, #fff5fa 0%, #fffdf2 100%) fixed !important;
}
h1, h2, h3, h4, h5, h6 {
  font-family: 'Poppins', 'Open Sans', sans-serif;
  color: var(--pk-pink-deep);
  font-weight: 600;
}
a { color: var(--pk-pink); transition: color .15s ease; }
a:hover, a:focus { color: var(--pk-pink-deep); }

/* -------------------------- STRUKTUR HALAMAN ---------------------------- */
.pkp_structure_page {
  margin: auto;
  width: 1170px;
  max-width: 100%;
  padding-bottom: 0 !important;
  /* sedikit transparan agar bunga di background tetap terlihat di tepi */
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 0 30px rgba(190, 24, 93, .12);
}
.pkp_structure_content { padding-top: 25px; }

/* ------------------------- HEADER / NAMA SITUS -------------------------- */
.pkp_head_wrapper {
  background: var(--pk-grad-soft);
  border-bottom: 3px solid var(--pk-pink);
}
.pkp_site_name_wrapper { padding-left: 0; padding-right: 0; }
.pkp_site_name { padding-top: 8px; padding-bottom: 8px; }
.pkp_site_name .is_img img {
  display: block; max-height: 90px; width: auto; height: auto;
}

/* -------------------- NAV ATAS (USER: register/login) ------------------ */
.pkp_navigation_user_wrapper { padding: 0; background: var(--pk-pink-deep); }
.pkp_navigation_user { border-bottom: none; }
.pkp_navigation_user > li > a,
.pkp_navigation_user > li.in_focus > a,
.pkp_navigation_user > li > a:hover,
.pkp_navigation_user > li > a:focus,
.pkp_navigation_user > li.profile > a {
  color: #fff !important; font-weight: 600; line-height: 38px; padding: 0 14px;
}
.pkp_navigation_user > li > a:hover { background: rgba(255,255,255,.15); }
.pkp_navigation_user_wrapper .pkp_navigation_user > li.profile > ul.dropdown-menu {
  border-radius: 4px !important; overflow: hidden;
}

/* ---------------------- NAV UTAMA (BAR GRADASI) ------------------------- */
.pkp_navigation_primary_row { background: var(--pk-grad-bar) !important; border: none; }
.pkp_navigation_primary_row .pkp_navigation_primary_wrapper ul li {
  padding: 0 !important; margin: 0 !important;
}
.pkp_navigation_primary_row .pkp_navigation_primary_wrapper ul li a {
  margin: 0 !important; padding: 0 16px !important; line-height: 46px !important;
  font-family: 'Poppins', sans-serif; font-weight: 500 !important; font-size: 14px;
  color: #fff !important; letter-spacing: .2px;
  text-shadow: 0 1px 2px rgba(140, 20, 70, .35);
}
.pkp_navigation_primary_row .pkp_navigation_primary_wrapper ul li a:hover,
.pkp_navigation_primary_row .pkp_navigation_primary_wrapper ul li.in_focus > a {
  background: rgba(190, 24, 93, .35) !important;
}
.pkp_navigation_primary_row .pkp_navigation_primary_wrapper ul li ul {
  background: var(--pk-pink-deep) !important;
  border-radius: 0 0 4px 4px !important;
  box-shadow: 0 6px 14px rgba(190, 24, 93, .25);
}
.pkp_navigation_primary_row .pkp_navigation_primary_wrapper ul li ul li {
  border-bottom: solid 1px rgba(255,255,255,.18) !important;
}
.pkp_navigation_primary_row .pkp_navigation_primary_wrapper ul li ul li:last-child {
  border-bottom: none !important;
}
.pkp_navigation_primary_row .pkp_search.is_open input[type="text"] {
  font-family: 'Open Sans', sans-serif; border-radius: 4px;
}

/* -------------------------- HERO / HOMEPAGE --------------------------- */
.pkp_page_index .homepage_image {
  margin-top: 20px; border-radius: 8px; overflow: hidden;
  box-shadow: 0 4px 16px rgba(190, 24, 93, .12);
}

/* ----------------------- DAFTAR / KARTU ARTIKEL ------------------------ */
.obj_article_summary {
  border: 1px solid var(--pk-line);
  border-left: 4px solid transparent;
  border-image: var(--pk-grad) 1;
  padding: 18px 20px; border-radius: 8px;
  background: rgba(255,255,255,0.96);
  box-shadow: 0 2px 10px rgba(190, 24, 93, .07);
  transition: box-shadow .18s ease, transform .18s ease;
  margin-bottom: 18px;
}
.obj_article_summary:hover {
  box-shadow: 0 8px 22px rgba(236, 72, 153, .22);
  transform: translateY(-2px);
}
.obj_article_summary .title a {
  color: var(--pk-pink-deep); font-family: 'Poppins', sans-serif; font-weight: 600;
}
.obj_article_summary .title a:hover { color: var(--pk-pink); }
.obj_article_summary .authors { color: var(--pk-muted); font-size: 14px; }
.obj_article_summary .item.doi .label { background: none; color: var(--pk-pink); font-weight: 600; }
.obj_article_summary .item.doi .value a { color: var(--pk-muted); }

.obj_article_summary .item.stats .abstract,
.obj_article_summary .item.stats .galley { position: relative; color: var(--pk-muted); }
.obj_article_summary .item.stats .abstract { margin-left: 22px; margin-right: 12px; }
.obj_article_summary .item.stats .galley { margin-left: 26px; }
.obj_article_summary .item.stats .abstract:before,
.obj_article_summary .item.stats .galley:before {
  font-family: "Font Awesome 5 Free"; font-weight: 900;
  left: -16px; position: absolute; top: 0; color: var(--pk-pink);
}
.obj_article_summary .item.stats .abstract:before { content: "\f06e"; }
.obj_article_summary .item.stats .galley:before  { content: "\f1c1"; }

/* -------------------------- TOMBOL & GALLEY ---------------------------- */
.cmp_button,
.cmp_button_wire,
.obj_galley_link,
.pkp_block.block_make_submission .content a {
  background: var(--pk-grad-bar);
  border: none;
  color: #fff !important; border-radius: 6px;
  font-family: 'Poppins', sans-serif; font-weight: 500; padding: 8px 18px;
  text-shadow: 0 1px 2px rgba(140,20,70,.3);
  transition: filter .15s ease, transform .15s ease;
}
.cmp_button:hover,
.cmp_button_wire:hover,
.obj_galley_link:hover,
.pkp_block.block_make_submission .content a:hover {
  filter: brightness(1.06); transform: translateY(-1px); color: #fff !important;
}

/* --------------------------- SIDEBAR / BLOK ---------------------------- */
.pkp_block { margin: 0 0 20px !important; padding: 0; }
.pkp_structure_sidebar .pkp_block .title {
  font-family: 'Poppins', sans-serif; background: var(--pk-grad-bar);
  color: #fff; padding: 9px 12px; border-radius: 6px 6px 0 0; margin: 0; font-size: 15px;
  text-shadow: 0 1px 2px rgba(140,20,70,.3);
}
.pkp_structure_sidebar .pkp_block .content {
  border: 1px solid var(--pk-line); border-top: none; padding: 12px;
  border-radius: 0 0 6px 6px; background: rgba(255,255,255,0.96);
}
.pkp_block.block_make_submission .content { border: none; text-align: center !important; padding: 0 !important; }
.pkp_block.block_make_submission .content a { display: block; }

#customblock-Sidebar_menu.pkp_block ul,
#customblock-Sidebar_menu.pkp_block ul li { margin: 0 !important; padding: 0 !important; list-style: none; }
#customblock-Sidebar_menu.pkp_block ul li a {
  background: var(--pk-pink-soft) !important; display: block; line-height: 42px;
  padding: 0 12px 0 18px; color: var(--pk-pink-deep) !important;
  border-bottom: solid 1px #fff; font-weight: 600;
}
#customblock-Sidebar_menu.pkp_block ul li a:hover {
  background: var(--pk-pink) !important; color: #fff !important;
}
.sidebar-block {
  background: var(--pk-grad-soft);
  border-left: 3px solid var(--pk-pink);
  padding: 8px 12px; color: var(--pk-pink-deep); margin: 12px 0; border-radius: 6px;
}

/* ----------------------------- PENGUMUMAN ------------------------------ */
.cmp_announcements .obj_announcement_summary.full_width { width: 100% !important; }
.cmp_announcements .obj_announcement_summary .summary p { line-height: 1.45em; margin: 0 0 1em !important; }

/* ------------------------------ FOOTER --------------------------------- */
.pkp_structure_footer_wrapper { border-bottom: none !important; }
.pkp_structure_footer,
.pkp_structure_footer_wrapper { background: var(--pk-pink-deep); }
.pkp_structure_footer .pkp_footer_content {
  background: var(--pk-pink-deep); color: #ffe6f1; padding: 28px 20px !important;
}
.pkp_structure_footer .pkp_footer_content a { color: #ffd9ea; }
.pkp_structure_footer .pkp_footer_content a:hover { color: #fff; }
.pkp_structure_footer .pkp_footer_content h2,
.pkp_structure_footer .pkp_footer_content h3 {
  color: #fff; font-size: 16px; border-bottom: 2px solid var(--pk-yellow);
  padding-bottom: 6px; margin-bottom: 12px; display: inline-block;
}
.pkp_structure_footer .pkp_footer_content p { margin: 0 0 8px; }
.pkp_structure_footer .pkp_footer_content img { max-width: 100%; height: auto; }
.pkp_structure_footer .pkp_brand_footer,
.pkp_brand_footer { display: none; }

/* ------------------------------ RESPONSIVE ----------------------------- */
@media (max-width: 1199px) { .pkp_structure_page { width: 100%; } }
@media (max-width: 991px) {
  .pkp_navigation_primary_row .pkp_navigation_primary_wrapper ul li a { line-height: 40px !important; }
  .pkp_page_index .homepage_image,
  .pkp_page_index .additional_content { margin-left: 0; margin-right: 0; }
}
@media (max-width: 767px) {
  .pkp_structure_footer .pkp_footer_content { text-align: left; }
  .obj_article_summary { padding: 14px 16px; }
}