/* ==========================================================
   OJS THEME: LAW FACULTY / PRODI HUKUM (PREMIUM INTERNATIONAL)
   Warna: Crimson Red & Classic Gold
   Fitur: Full Responsive, Modern Navbar (No Scroll), Bootstrap Icons, 
   Smooth Animations, & Elegant Serif Typography.
   ========================================================== */

:root {
  /* Nuansa Merah Hukum (Crimson / Maroon) */
  --law-red-950: #2b0408;
  --law-red-900: #4a060d;
  --law-red-800: #7a0914;
  --law-red-700: #a30e1b; /* Warna Utama */
  --law-red-600: #c91828;
  --law-red-500: #e02436;
  --law-red-100: #fce8ea;
  --law-red-050: #fff5f6;
  
  /* Akses Emas Klasik (Justice Gold) */
  --law-gold-600: #b8962e;
  --law-gold-500: #d4af37; /* Aksen Mewah */
  --law-gold-100: #fcf6e8;

  /* Warna Teks & Latar */
  --law-ink-900: #1a1a1a;
  --law-ink-700: #333333;
  --law-muted: #666666;
  --law-bg: #f8f9fa;
  --law-card: #ffffff;
  --law-border: rgba(163, 14, 27, 0.15);
  
  /* Bayangan & Radius Minimalis Modern */
  --law-shadow-sm: 0 4px 15px rgba(0, 0, 0, 0.05);
  --law-shadow-md: 0 12px 30px rgba(163, 14, 27, 0.08);
  --law-radius-md: 10px;
  --law-radius-lg: 16px;
  
  /* Tipografi */
  --law-font-sans: 'Inter', 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --law-font-serif: 'Lora', 'Merriweather', 'Playfair Display', Georgia, serif;
  
  /* Transisi */
  --law-speed: 0.3s;
  --law-ease: cubic-bezier(0.25, 0.8, 0.25, 1);
}

/* ==========================================================
   1. ANIMASI & BASE STYLES
   ========================================================== */
@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes headerGlow {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

html { scroll-behavior: smooth; }

body {
  background-color: var(--law-bg) !important;
  color: var(--law-ink-900) !important;
  font-family: var(--law-font-sans) !important;
  line-height: 1.7 !important;
}

a {
  color: var(--law-red-700) !important;
  text-decoration: none !important;
  transition: all var(--law-speed) var(--law-ease) !important;
}
a:hover { color: var(--law-red-500) !important; }

/* Tipografi Judul berwibawa (Serif) */
h1, h2, h3, .pkp_site_name .is_text, .obj_article_summary .title, .pkp_block .title {
  font-family: var(--law-font-serif) !important;
  font-weight: 700 !important;
  color: var(--law-ink-900) !important;
}

/* ==========================================================
   2. HEADER & LOGO
   ========================================================== */
.pkp_structure_head {
  background: linear-gradient(135deg, var(--law-red-950) 0%, var(--law-red-800) 50%, var(--law-red-700) 100%) !important;
  background-size: 200% 200% !important;
  animation: headerGlow 15s ease infinite !important;
  border-bottom: 4px solid var(--law-gold-500) !important;
  box-shadow: 0 10px 30px rgba(0,0,0,0.3) !important;
  position: relative !important;
  z-index: 1000 !important;
}

.pkp_head_wrapper { padding: 40px 15px 25px 15px !important; }

.pkp_site_name .is_text {
  color: #ffffff !important;
  font-size: clamp(26px, 4vw, 42px) !important;
  text-shadow: 2px 2px 8px rgba(0,0,0,0.5) !important;
  letter-spacing: 0.5px !important;
}

/* ==========================================================
   3. MENU USER (TOP RIGHT)
   ========================================================== */
.pkp_navigation_user_wrapper {
  position: absolute !important; top: 12px !important; right: 24px !important; z-index: 30000 !important;
}
.pkp_navigation_user { display: flex !important; gap: 8px !important; margin: 0 !important; padding: 0 !important; list-style: none !important; }
.pkp_navigation_user > li > a {
  display: inline-flex !important; align-items: center !important; gap: 8px !important;
  padding: 8px 16px !important; border: 1px solid rgba(255, 255, 255, 0.2) !important;
  border-radius: 50px !important; background: rgba(0, 0, 0, 0.2) !important;
  color: #ffffff !important; font-size: 13px !important; font-weight: 600 !important;
  backdrop-filter: blur(8px); transition: all 0.3s ease !important;
}
.pkp_navigation_user > li > a:hover {
  background: var(--law-gold-500) !important; color: var(--law-red-950) !important; 
  border-color: var(--law-gold-500) !important; transform: translateY(-2px);
}
.pkp_navigation_user > li > a::before {
  content: "" !important; display: inline-block !important; width: 14px !important; height: 14px !important;
  background-color: currentColor !important;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M11 6a3 3 0 1 1-6 0 3 3 0 0 1 6 0z'/%3E%3Cpath fill-rule='evenodd' d='M0 8a8 8 0 1 1 16 0A8 8 0 0 1 0 8zm8-7a7 7 0 0 0-5.468 11.37C3.242 11.226 4.805 10 8 10s4.757 1.225 5.468 2.37A7 7 0 0 0 8 1z'/%3E%3C/svg%3E") no-repeat center / contain !important;
}

/* ==========================================================
   4. PRIMARY NAVBAR (FULL WIDTH, NO SCROLL, MODERN WHITE)
   ========================================================== */
.pkp_navigation_primary_wrapper {
  position: relative !important; 
  z-index: 10001 !important; 
  margin-top: 30px !important;
  padding: 5px 15px !important; 
  background: #ffffff !important; /* Putih profesional */
  border: 1px solid var(--law-border) !important;
  border-radius: 12px !important; /* Sudut halus */
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08) !important;
  width: 100% !important; 
  max-width: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  box-sizing: border-box !important;
  min-height: 60px !important;
}

.pkp_navigation_primary { 
  display: flex !important; 
  flex-wrap: wrap !important; /* HILANGKAN SCROLL, biarkan menu menyusun alami */
  align-items: center !important; 
  gap: 5px !important; 
  list-style: none !important; 
  margin: 0 !important; 
  padding: 0 !important; 
  flex: 1 !important;
}

.pkp_navigation_primary > li > a {
  display: inline-flex !important; 
  align-items: center !important; 
  gap: 8px !important;
  padding: 10px 18px !important; 
  border-radius: 8px !important; 
  color: var(--law-red-900) !important; /* Warna teks gelap tegas */
  font-size: 14px !important; 
  font-weight: 700 !important; 
  white-space: nowrap !important;
  transition: all 0.3s ease !important;
}

.pkp_navigation_primary > li > a:hover {
  background: var(--law-red-050) !important; 
  color: var(--law-red-600) !important; 
}

.pkp_navigation_primary > li[aria-current="page"] > a,
.pkp_navigation_primary > li.current > a {
  background: var(--law-gold-500) !important; 
  color: #ffffff !important;
  box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4) !important; 
  transform: translateY(-2px);
}

/* --- BOOTSTRAP ICONS (FIXED & VISIBLE) --- */
.pkp_navigation_primary > li > a::before, 
.pkp_navigation_primary ul a::before {
  content: "" !important; 
  display: inline-block !important; 
  width: 16px !important; 
  height: 16px !important; 
  background-color: currentColor !important; 
  flex-shrink: 0 !important;
}

/* Home */
.pkp_navigation_primary > li > a[href*="current"]::before { -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4.5a.5.5 0 0 0 .5-.5v-4h2v4a.5.5 0 0 0 .5.5H14a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146zM2.5 14V7.707l5.5-5.5 5.5 5.5V14H10v-4a1.5 1.5 0 0 0-1.5-1.5h-1A1.5 1.5 0 0 0 6 10v4H2.5z'/%3E%3C/svg%3E") no-repeat center / contain !important; }
/* Archives */
.pkp_navigation_primary > li > a[href*="archive"]::before { -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M0 2a1 1 0 0 1 1-1h14a1 1 0 0 1 1 1v2a1 1 0 0 1-1 1v7.5a2.5 2.5 0 0 1-2.5 2.5h-9A2.5 2.5 0 0 1 1 12.5V5a1 1 0 0 1-1-1V2zm2 3v7.5A1.5 1.5 0 0 0 3.5 14h9a1.5 1.5 0 0 0 1.5-1.5V5H2zm13-3H1v2h14V2zM5 7.5a.5.5 0 0 1 .5-.5h5a.5.5 0 0 1 0 1h-5a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E") no-repeat center / contain !important; }
/* Announcements */
.pkp_navigation_primary > li > a[href*="announcement"]::before { -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M13 2.5a1.5 1.5 0 0 1 3 0v11a1.5 1.5 0 0 1-3 0zm-1 .724c-2.067.95-4.539 1.481-7 1.656v6.237a25.222 25.222 0 0 1 1.088.085c2.053.204 4.038.668 5.912 1.56zm-8 7.841V4.934c-.68.027-1.399.043-2.008.053A2.02 2.02 0 0 0 0 7v2c0 1.106.896 1.996 1.994 2.009.609.007 1.327.023 2.006.056M1.994 6C2.592 5.99 3.308 5.974 4 5.947v4.108c-.692-.027-1.408-.043-2.006-.053A1.02 1.02 0 0 1 1 9V7c0-.55.448-.99.994-1M8 12.5c0 .828-.895 1.5-2 1.5s-2-.672-2-1.5 0-1.5 2-1.5 2 .672 2 1.5'/%3E%3C/svg%3E") no-repeat center / contain !important; }
/* About */
.pkp_navigation_primary > li > a[href*="about"]::before { -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14zm0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16z'/%3E%3Cpath d='m8.93 6.588-2.29.287-.082.38.45.083c.294.07.352.176.288.469l-.738 3.468c-.194.897.105 1.319.808 1.319.545 0 1.178-.252 1.465-.598l.088-.416c-.2.176-.492.246-.686.246-.275 0-.375-.193-.304-.533zM9 4.5a1 1 0 1 1-2 0 1 1 0 0 1 2 0z'/%3E%3C/svg%3E") no-repeat center / contain !important; }
/* Chevron Down Dropdown */
.pkp_navigation_primary > li > a[aria-haspopup="true"]::after {
  content: "" !important; display: inline-block !important; width: 12px !important; height: 12px !important; margin-left: 4px !important; background-color: currentColor !important;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3E%3C/svg%3E") no-repeat center / contain !important;
  transition: transform 0.3s ease !important;
}
.pkp_navigation_primary > li:hover > a[aria-haspopup="true"]::after { transform: rotate(180deg) !important; }

/* Dropdown Menu */
.pkp_navigation_primary ul, .pkp_navigation_user ul {
  position: absolute !important; top: 120% !important; left: 0 !important; z-index: 20000 !important;
  min-width: 240px !important; padding: 12px !important; background: #ffffff !important; 
  border: 1px solid var(--law-border) !important; border-radius: 12px !important;
  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.15) !important; opacity: 0 !important; visibility: hidden !important;
  transform: translateY(15px) !important; transition: all 0.3s cubic-bezier(0.2, 0.8, 0.2, 1) !important;
}
.pkp_navigation_user ul { left: auto !important; right: 0 !important; }
.pkp_navigation_primary li:hover > ul, .pkp_navigation_user li:hover > ul {
  opacity: 1 !important; visibility: visible !important; transform: translateY(0) !important; top: 100% !important;
}
.pkp_navigation_primary ul a, .pkp_navigation_user ul a {
  display: flex !important; align-items: center !important; padding: 10px 16px !important;
  border-radius: 8px !important; color: var(--law-ink-900) !important; 
  font-weight: 600 !important; transition: all 0.2s ease !important;
}
.pkp_navigation_primary ul a:hover, .pkp_navigation_user ul a:hover {
  background: var(--law-red-050) !important; color: var(--law-red-700) !important; transform: translateX(6px) !important;
}

/* ==========================================================
   5. KOLOM PENCARIAN (MENEMPEL KANAN DI DALAM NAVBAR)
   ========================================================== */
.pkp_head_wrapper .pkp_search {
  position: relative !important; 
  margin-left: 15px !important;
  z-index: 10002 !important;
}

.pkp_head_wrapper .pkp_search .search_prompt { 
  display: inline-flex !important; 
  align-items: center !important; 
  gap: 8px !important;
  color: var(--law-red-800) !important; 
  padding: 10px 20px !important; 
  font-weight: 700 !important; 
  background: var(--law-red-050) !important; 
  border-radius: 8px !important;
  transition: all 0.3s ease !important;
}

.pkp_head_wrapper .pkp_search .search_prompt:hover { 
  background: var(--law-red-100) !important; 
  color: var(--law-red-900) !important; 
}

.pkp_head_wrapper .pkp_search .search_prompt::before {
  content: "" !important; display: inline-block !important; width: 16px !important; height: 16px !important; background-color: currentColor !important;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001c.03.04.062.078.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1.007 1.007 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0z'/%3E%3C/svg%3E") no-repeat center / contain !important;
}

.pkp_head_wrapper .pkp_search.is_open input[type="text"] {
  border-radius: 8px !important; padding: 10px 45px 10px 20px !important; background: #ffffff !important;
  color: var(--law-ink-900) !important; border: 2px solid var(--law-red-600) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15) !important; font-size: 14px !important;
}

/* ==========================================================
   6. MAIN LAYOUT & KARTU ARTIKEL (SHADOW & BORDER)
   ========================================================== */
.pkp_structure_main, .pkp_structure_sidebar { animation: fadeInUp 0.6s ease forwards !important; }
.pkp_structure_main {
  background: var(--law-card) !important; border: 1px solid var(--law-border) !important;
  border-radius: var(--law-radius-lg) !important; box-shadow: var(--law-shadow-sm) !important;
  padding: clamp(25px, 4vw, 40px) !important; margin-top: -30px !important; position: relative; z-index: 5;
}
.pkp_page_index .pkp_structure_main { background: transparent !important; border: none !important; box-shadow: none !important; margin-top: 0 !important; padding-top: 20px !important; }

/* Kartu Sidebar & Artikel */
.cmp_article_list > li, .obj_article_summary, .obj_issue_summary, .pkp_block {
  background: var(--law-card) !important; border: 1px solid var(--law-border) !important;
  border-radius: var(--law-radius-md) !important; padding: 25px !important; margin-bottom: 25px !important;
  box-shadow: var(--law-shadow-sm) !important; transition: all 0.3s ease !important;
  border-left: 4px solid var(--law-red-700) !important; /* Aksen merah ala jurnal elit */
}
.cmp_article_list > li:hover, .obj_article_summary:hover, .pkp_block:hover {
  transform: translateY(-4px) !important; box-shadow: var(--law-shadow-md) !important;
  border-left-color: var(--law-gold-500) !important; 
}

.pkp_block .title { border-bottom: 1px solid rgba(163, 14, 27, 0.2) !important; padding-bottom: 12px !important; color: var(--law-red-800) !important; font-size: 18px !important; }

/* Tombol (Galleys / PDF) */
.obj_galley_link, .cmp_button, .pkp_button, .button {
  display: inline-flex !important; align-items: center !important; gap: 8px !important;
  padding: 10px 20px !important; border-radius: 8px !important; color: #ffffff !important;
  background: linear-gradient(135deg, var(--law-red-800), var(--law-red-600)) !important;
  border: none !important; font-weight: 700 !important; letter-spacing: 0.5px !important;
  box-shadow: 0 4px 15px rgba(163, 14, 27, 0.3) !important; transition: all 0.3s ease !important;
}
.obj_galley_link:hover, .cmp_button:hover, .pkp_button:hover {
  background: linear-gradient(135deg, var(--law-red-900), var(--law-red-700)) !important;
  transform: translateY(-2px) !important; box-shadow: 0 8px 20px rgba(163, 14, 27, 0.4) !important;
}

/* ==========================================================
   7. TABEL & INPUT FORMS
   ========================================================== */
input[type="text"], input[type="email"], input[type="password"], textarea, select {
  border-radius: 8px !important; border: 1px solid rgba(0,0,0,0.2) !important; padding: 12px !important; transition: all 0.3s ease !important;
}
input:focus, textarea:focus, select:focus {
  border-color: var(--law-red-600) !important; box-shadow: 0 0 0 4px rgba(163, 14, 27, 0.15) !important; outline: none !important;
}

table {
  width: 100% !important; border-collapse: collapse !important; border-radius: 8px !important; overflow: hidden !important;
  display: block; overflow-x: auto; white-space: nowrap; box-shadow: var(--law-shadow-sm) !important;
}
table th { background: var(--law-red-800) !important; color: #ffffff !important; padding: 15px !important; font-family: var(--law-font-serif) !important; }
table td { border-bottom: 1px solid var(--law-border) !important; padding: 12px 15px !important; background: #ffffff !important; }

/* ==========================================================
   8. FOOTER ELEGAN
   ========================================================== */
.pkp_structure_footer_wrapper {
  margin-top: 60px !important; padding: 50px 0 !important;
  background: linear-gradient(135deg, var(--law-red-950), #1a0204) !important;
  border-top: 5px solid var(--law-gold-500) !important; color: rgba(255, 255, 255, 0.8) !important;
}
.pkp_structure_footer_wrapper a { color: var(--law-gold-500) !important; font-weight: bold !important; transition: color 0.3s ease !important; }
.pkp_structure_footer_wrapper a:hover { color: #ffffff !important; }
.pkp_structure_footer_wrapper h1, .pkp_structure_footer_wrapper h2 { color: #ffffff !important; }

/* ==========================================================
   9. MOBILE RESPONSIVE (SMARTPHONE)
   ========================================================== */
@media (max-width: 991px) {
  .pkp_head_wrapper { padding-top: 20px !important; padding-bottom: 20px !important; }
  .pkp_site_name .is_text { font-size: 28px !important; text-align: center !important; display: block !important; }
  
  /* Navbar menumpuk secara vertikal di HP */
  .pkp_navigation_primary_wrapper { 
    flex-direction: column !important; align-items: flex-start !important;
    padding: 15px !important; margin-top: 20px !important;
  }
  .pkp_navigation_primary { flex-direction: column !important; width: 100% !important; align-items: flex-start !important; }
  .pkp_navigation_primary > li { width: 100% !important; }
  .pkp_navigation_primary > li > a { width: 100% !important; padding: 12px 16px !important; }
  
  /* Dropdown HP turun ke bawah */
  .pkp_navigation_primary ul {
    position: relative !important; top: 0 !important; left: 0 !important; box-shadow: none !important;
    border: none !important; border-left: 3px solid var(--law-red-100) !important; border-radius: 0 !important;
    padding: 0 0 0 15px !important; margin: 5px 0 10px 15px !important; width: calc(100% - 15px) !important;
    display: none !important; background: transparent !important; transform: none !important;
  }
  .pkp_navigation_primary li:hover > ul { display: block !important; opacity: 1 !important; visibility: visible !important; }
  
  /* Posisi Search Mobile */
  .pkp_head_wrapper .pkp_search { 
    position: relative !important; margin-left: 0 !important; margin-top: 15px !important; width: 100% !important; 
  }
  .pkp_head_wrapper .pkp_search .search_prompt { width: 100% !important; justify-content: center !important; background: rgba(163, 14, 27, 0.08) !important; }
  
  .pkp_navigation_user_wrapper { position: relative !important; top: 0 !important; right: 0 !important; text-align: center !important; margin-top: 15px !important; display: flex !important; justify-content: center !important; }
  
  .pkp_structure_main { padding: 20px !important; margin-top: 10px !important; }
}

/* Custom Scrollbar */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: #f1f1f1; }
::-webkit-scrollbar-thumb { background: var(--law-red-700); border-radius: 10px; }
::-webkit-scrollbar-thumb:hover { background: var(--law-red-900); }

/* ==========================================================
   FIX ICON NAVBAR & DROPDOWN
   Catatan: hanya menambahkan fallback mask dan ikon default
   agar semua item menu, termasuk dropdown, tetap tampil ikon.
   ========================================================== */

/* Pastikan dropdown tetap punya anchor posisi tanpa mengubah layout utama */
.pkp_navigation_primary li,
.pkp_navigation_user li {
  position: relative !important;
}

/* Ikon default untuk item yang belum punya selector khusus */
.pkp_navigation_primary > li > a::before,
.pkp_navigation_primary ul a::before,
.pkp_navigation_user ul a::before {
  content: "" !important;
  display: inline-block !important;
  width: 16px !important;
  height: 16px !important;
  min-width: 16px !important;
  background-color: currentColor !important;
  flex-shrink: 0 !important;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2 2.5A1.5 1.5 0 0 1 3.5 1h9A1.5 1.5 0 0 1 14 2.5v11A1.5 1.5 0 0 1 12.5 15h-9A1.5 1.5 0 0 1 2 13.5v-11zM3.5 2a.5.5 0 0 0-.5.5v11a.5.5 0 0 0 .5.5h9a.5.5 0 0 0 .5-.5v-11a.5.5 0 0 0-.5-.5h-9z'/%3E%3Cpath d='M4.5 5.5A.5.5 0 0 1 5 5h6a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zm0 2A.5.5 0 0 1 5 7h6a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zm0 2A.5.5 0 0 1 5 9h4a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E") no-repeat center / contain !important;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2 2.5A1.5 1.5 0 0 1 3.5 1h9A1.5 1.5 0 0 1 14 2.5v11A1.5 1.5 0 0 1 12.5 15h-9A1.5 1.5 0 0 1 2 13.5v-11zM3.5 2a.5.5 0 0 0-.5.5v11a.5.5 0 0 0 .5.5h9a.5.5 0 0 0 .5-.5v-11a.5.5 0 0 0-.5-.5h-9z'/%3E%3Cpath d='M4.5 5.5A.5.5 0 0 1 5 5h6a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zm0 2A.5.5 0 0 1 5 7h6a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zm0 2A.5.5 0 0 1 5 9h4a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E") no-repeat center / contain !important;
}

/* Jarak ikon dropdown */
.pkp_navigation_primary ul a,
.pkp_navigation_user ul a {
  gap: 8px !important;
}

/* Fallback mask standar agar ikon tampil di browser selain WebKit */
.pkp_navigation_primary > li > a[href*="current"]::before {
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4.5a.5.5 0 0 0 .5-.5v-4h2v4a.5.5 0 0 0 .5.5H14a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146zM2.5 14V7.707l5.5-5.5 5.5 5.5V14H10v-4a1.5 1.5 0 0 0-1.5-1.5h-1A1.5 1.5 0 0 0 6 10v4H2.5z'/%3E%3C/svg%3E") no-repeat center / contain !important;
}

.pkp_navigation_primary > li > a[href*="archive"]::before,
.pkp_navigation_primary ul a[href*="archive"]::before {
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M0 2a1 1 0 0 1 1-1h14a1 1 0 0 1 1 1v2a1 1 0 0 1-1 1v7.5a2.5 2.5 0 0 1-2.5 2.5h-9A2.5 2.5 0 0 1 1 12.5V5a1 1 0 0 1-1-1V2zm2 3v7.5A1.5 1.5 0 0 0 3.5 14h9a1.5 1.5 0 0 0 1.5-1.5V5H2zm13-3H1v2h14V2zM5 7.5a.5.5 0 0 1 .5-.5h5a.5.5 0 0 1 0 1h-5a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E") no-repeat center / contain !important;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M0 2a1 1 0 0 1 1-1h14a1 1 0 0 1 1 1v2a1 1 0 0 1-1 1v7.5a2.5 2.5 0 0 1-2.5 2.5h-9A2.5 2.5 0 0 1 1 12.5V5a1 1 0 0 1-1-1V2zm2 3v7.5A1.5 1.5 0 0 0 3.5 14h9a1.5 1.5 0 0 0 1.5-1.5V5H2zm13-3H1v2h14V2zM5 7.5a.5.5 0 0 1 .5-.5h5a.5.5 0 0 1 0 1h-5a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E") no-repeat center / contain !important;
}

.pkp_navigation_primary > li > a[href*="announcement"]::before,
.pkp_navigation_primary ul a[href*="announcement"]::before {
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M13 2.5a1.5 1.5 0 0 1 3 0v11a1.5 1.5 0 0 1-3 0zm-1 .724c-2.067.95-4.539 1.481-7 1.656v6.237a25.222 25.222 0 0 1 1.088.085c2.053.204 4.038.668 5.912 1.56zm-8 7.841V4.934c-.68.027-1.399.043-2.008.053A2.02 2.02 0 0 0 0 7v2c0 1.106.896 1.996 1.994 2.009.609.007 1.327.023 2.006.056M1.994 6C2.592 5.99 3.308 5.974 4 5.947v4.108c-.692-.027-1.408-.043-2.006-.053A1.02 1.02 0 0 1 1 9V7c0-.55.448-.99.994-1M8 12.5c0 .828-.895 1.5-2 1.5s-2-.672-2-1.5 0-1.5 2-1.5 2 .672 2 1.5'/%3E%3C/svg%3E") no-repeat center / contain !important;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M13 2.5a1.5 1.5 0 0 1 3 0v11a1.5 1.5 0 0 1-3 0zm-1 .724c-2.067.95-4.539 1.481-7 1.656v6.237a25.222 25.222 0 0 1 1.088.085c2.053.204 4.038.668 5.912 1.56zm-8 7.841V4.934c-.68.027-1.399.043-2.008.053A2.02 2.02 0 0 0 0 7v2c0 1.106.896 1.996 1.994 2.009.609.007 1.327.023 2.006.056M1.994 6C2.592 5.99 3.308 5.974 4 5.947v4.108c-.692-.027-1.408-.043-2.006-.053A1.02 1.02 0 0 1 1 9V7c0-.55.448-.99.994-1M8 12.5c0 .828-.895 1.5-2 1.5s-2-.672-2-1.5 0-1.5 2-1.5 2 .672 2 1.5'/%3E%3C/svg%3E") no-repeat center / contain !important;
}

.pkp_navigation_primary > li > a[href*="about"]::before,
.pkp_navigation_primary ul a[href*="about"]::before {
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14zm0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16z'/%3E%3Cpath d='m8.93 6.588-2.29.287-.082.38.45.083c.294.07.352.176.288.469l-.738 3.468c-.194.897.105 1.319.808 1.319.545 0 1.178-.252 1.465-.598l.088-.416c-.2.176-.492.246-.686.246-.275 0-.375-.193-.304-.533zM9 4.5a1 1 0 1 1-2 0 1 1 0 0 1 2 0z'/%3E%3C/svg%3E") no-repeat center / contain !important;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14zm0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16z'/%3E%3Cpath d='m8.93 6.588-2.29.287-.082.38.45.083c.294.07.352.176.288.469l-.738 3.468c-.194.897.105 1.319.808 1.319.545 0 1.178-.252 1.465-.598l.088-.416c-.2.176-.492.246-.686.246-.275 0-.375-.193-.304-.533zM9 4.5a1 1 0 1 1-2 0 1 1 0 0 1 2 0z'/%3E%3C/svg%3E") no-repeat center / contain !important;
}

/* Ikon khusus untuk menu OJS yang umum muncul */
.pkp_navigation_primary > li > a[href*="submissions"]::before,
.pkp_navigation_primary ul a[href*="submissions"]::before {
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 1a.5.5 0 0 1 .5.5V11l2.146-2.146a.5.5 0 0 1 .708.708l-3 3a.5.5 0 0 1-.708 0l-3-3a.5.5 0 1 1 .708-.708L7.5 11V1.5A.5.5 0 0 1 8 1z'/%3E%3Cpath d='M3 14.5a.5.5 0 0 1 .5-.5h9a.5.5 0 0 1 0 1h-9a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E") no-repeat center / contain !important;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 1a.5.5 0 0 1 .5.5V11l2.146-2.146a.5.5 0 0 1 .708.708l-3 3a.5.5 0 0 1-.708 0l-3-3a.5.5 0 1 1 .708-.708L7.5 11V1.5A.5.5 0 0 1 8 1z'/%3E%3Cpath d='M3 14.5a.5.5 0 0 1 .5-.5h9a.5.5 0 0 1 0 1h-9a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E") no-repeat center / contain !important;
}

.pkp_navigation_primary > li > a[href*="contact"]::before,
.pkp_navigation_primary ul a[href*="contact"]::before {
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M0 4a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V4zm2-1a1 1 0 0 0-1 1v.217l7 4.2 7-4.2V4a1 1 0 0 0-1-1H2zm13 2.383-4.708 2.825L15 11.105V5.383zm-.034 6.876-5.64-3.471L8 9.583l-1.326-.795-5.64 3.47A1 1 0 0 0 2 13h12a1 1 0 0 0 .966-.741zM1 11.105l4.708-2.897L1 5.383v5.722z'/%3E%3C/svg%3E") no-repeat center / contain !important;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M0 4a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V4zm2-1a1 1 0 0 0-1 1v.217l7 4.2 7-4.2V4a1 1 0 0 0-1-1H2zm13 2.383-4.708 2.825L15 11.105V5.383zm-.034 6.876-5.64-3.471L8 9.583l-1.326-.795-5.64 3.47A1 1 0 0 0 2 13h12a1 1 0 0 0 .966-.741zM1 11.105l4.708-2.897L1 5.383v5.722z'/%3E%3C/svg%3E") no-repeat center / contain !important;
}

.pkp_navigation_primary > li > a[href*="editorial"]::before,
.pkp_navigation_primary ul a[href*="editorial"]::before,
.pkp_navigation_primary > li > a[href*="team"]::before,
.pkp_navigation_primary ul a[href*="team"]::before {
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M7 14s-1 0-1-1 1-4 5-4 5 3 5 4-1 1-1 1H7zm4-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6z'/%3E%3Cpath fill-rule='evenodd' d='M5.216 14A2.238 2.238 0 0 1 5 13c0-1.355.68-2.75 1.936-3.72A6.325 6.325 0 0 0 5 9c-4 0-5 3-5 4s1 1 1 1h4.216z'/%3E%3Cpath d='M4.5 8a2.5 2.5 0 1 0 0-5 2.5 2.5 0 0 0 0 5z'/%3E%3C/svg%3E") no-repeat center / contain !important;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M7 14s-1 0-1-1 1-4 5-4 5 3 5 4-1 1-1 1H7zm4-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6z'/%3E%3Cpath fill-rule='evenodd' d='M5.216 14A2.238 2.238 0 0 1 5 13c0-1.355.68-2.75 1.936-3.72A6.325 6.325 0 0 0 5 9c-4 0-5 3-5 4s1 1 1 1h4.216z'/%3E%3Cpath d='M4.5 8a2.5 2.5 0 1 0 0-5 2.5 2.5 0 0 0 0 5z'/%3E%3C/svg%3E") no-repeat center / contain !important;
}

.pkp_navigation_primary > li > a[href*="privacy"]::before,
.pkp_navigation_primary ul a[href*="privacy"]::before {
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M5.338 1.59a61.44 61.44 0 0 0-2.837.856.481.481 0 0 0-.328.39c-.554 4.157.726 7.19 2.253 9.188a10.725 10.725 0 0 0 2.287 2.233c.346.244.652.42.893.533.12.057.224.095.307.118a.55.55 0 0 0 .174.025.615.615 0 0 0 .174-.025c.083-.023.187-.061.307-.118.241-.113.547-.29.893-.533a10.726 10.726 0 0 0 2.287-2.233c1.527-1.997 2.807-5.031 2.253-9.188a.48.48 0 0 0-.328-.39c-.651-.213-1.75-.56-2.837-.855C9.552 1.29 8.531 1.067 8 1.067c-.53 0-1.552.223-2.662.524z'/%3E%3C/svg%3E") no-repeat center / contain !important;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M5.338 1.59a61.44 61.44 0 0 0-2.837.856.481.481 0 0 0-.328.39c-.554 4.157.726 7.19 2.253 9.188a10.725 10.725 0 0 0 2.287 2.233c.346.244.652.42.893.533.12.057.224.095.307.118a.55.55 0 0 0 .174.025.615.615 0 0 0 .174-.025c.083-.023.187-.061.307-.118.241-.113.547-.29.893-.533a10.726 10.726 0 0 0 2.287-2.233c1.527-1.997 2.807-5.031 2.253-9.188a.48.48 0 0 0-.328-.39c-.651-.213-1.75-.56-2.837-.855C9.552 1.29 8.531 1.067 8 1.067c-.53 0-1.552.223-2.662.524z'/%3E%3C/svg%3E") no-repeat center / contain !important;
}

/* ==========================================================
   FIX JARAK KONTEN & SIDEBAR SAJA
   Tidak mengubah posisi layout, hanya memberi ruang antara
   area konten utama dan menu sidebar.
   ========================================================== */

@media (min-width: 992px) {
  .pkp_structure_sidebar {
    padding-left: 32px !important;
    box-sizing: border-box !important;
  }
}

@media (max-width: 991px) {
  .pkp_structure_sidebar {
    padding-left: 0 !important;
    margin-top: 24px !important;
  }
}
