/* CSS untuk background aestetik biru tua dan emas pada header */
.pkp_structure_head {
    position: relative;
    background: linear-gradient(135deg, #0c1a3a 0%, #1a365f 30%, #2d538f 70%, #b8860b 100%);
    overflow: visible !important;
    min-height: 200px;
}

/* Background pattern aestetik dengan gradien biru-emas */
.pkp_structure_head::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: 
        radial-gradient(circle at 20% 20%, rgba(184, 134, 11, 0.3) 0%, transparent 50%),
        radial-gradient(circle at 80% 80%, rgba(218, 165, 32, 0.4) 0%, transparent 50%),
        radial-gradient(circle at 40% 70%, rgba(26, 54, 95, 0.6) 0%, transparent 50%),
        radial-gradient(circle at 70% 30%, rgba(12, 26, 58, 0.7) 0%, transparent 50%),
        linear-gradient(45deg, transparent 40%, rgba(255,215,0,0.1) 50%, transparent 60%);
    background-size: 
        400px 400px,
        350px 350px,
        300px 300px,
        320px 320px,
        100% 100%;
    z-index: 1;
}

/* Islamic geometric pattern dengan warna emas */
.pkp_structure_head::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: 
        url("data:image/svg+xml,%3Csvg width='150' height='150' viewBox='0 0 150 150' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M75 25c27.614 0 50 22.386 50 50s-22.386 50-50 50-50-22.386-50-50 22.386-50 50-50zm0 15c-19.33 0-35 15.67-35 35s15.67 35 35 35 35-15.67 35-35-15.67-35-35-35z' fill='%23daa520' fill-opacity='0.15'/%3E%3Cpath d='M60 45c8.284 0 15 6.716 15 15s-6.716 15-15 15-15-6.716-15-15 6.716-15 15-15zm30 30c8.284 0 15 6.716 15 15s-6.716 15-15 15-15-6.716-15-15 6.716-15 15-15zM60 105c8.284 0 15 6.716 15 15s-6.716 15-15 15-15-6.716-15-15 6.716-15 15-15zM30 75c8.284 0 15 6.716 15 15s-6.716 15-15 15-15-6.716-15-15 6.716-15 15-15z' fill='%23ffd700' fill-opacity='0.2'/%3E%3C/svg%3E"),
        url("data:image/svg+xml,%3Csvg width='100' height='100' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M50 10c22.091 0 40 17.909 40 40s-17.909 40-40 40-40-17.909-40-40 17.909-40 40-40zm0 10c-16.542 0-30 13.458-30 30s13.458 30 30 30 30-13.458 30-30-13.458-30-30-30z' fill='%23b8860b' fill-opacity='0.1'/%3E%3Cpath d='M35 35l15 15 15-15-15 15 15 15-15-15-15 15 15-15z' fill='%23ffd700' fill-opacity='0.25'/%3E%3C/svg%3E");
    background-size: 150px 150px, 100px 100px;
    background-position: 10% 20%, 90% 80%;
    opacity: 0.8;
    z-index: 1;
}

/* Pastikan konten header tetap di atas background */
.pkp_head_wrapper {
    position: relative;
    z-index: 2;
    min-height: 200px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

/* Style untuk logo agar kontras dengan background */
.pkp_site_name_wrapper {
    padding: 5px 0;
    text-align: center;
}

.pkp_site_name img {
    filter: 
        drop-shadow(0 4px 8px rgba(0,0,0,0.6))
        brightness(1.1)
        contrast(1.2);
    background: linear-gradient(135deg, rgba(255,215,0,0.1) 0%, rgba(184,134,11,0.2) 100%);
    backdrop-filter: blur(5px);
    border-radius: 8px;
    padding: 12px;
    border: 1px solid rgba(255, 215, 0, 0.3);
    max-height: 140px;
    width: auto;
}


.pkp_search {
    background: linear-gradient(135deg, #daa520 0%, #b8860b 100%) !important;
    color: #1a365f !important;
    font-weight: 700;
    padding: 12px 25px !important;
    border-radius: 25px;
    text-decoration: none;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(184, 134, 11, 0.3);
    border: none;
}

.pkp_search:hover {
    background: linear-gradient(135deg, #ffd700 0%, #daa520 100%) !important;
    color: #0c1a3a !important;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(184, 134, 11, 0.4);
}

.cmp_skip_to_content a:hover {
    background: linear-gradient(135deg, #b8860b 0%, #1a365f 100%);
    transform: translateY(-2px);
}

/* Menu toggle button styling */
.pkp_site_nav_toggle {
    background: linear-gradient(135deg, #daa520 0%, #b8860b 100%);
    color: #1a365f !important;
    border: 1px solid #daa520;
    border-radius: 8px;
    font-weight: 600;
    padding: 10px 15px;
    transition: all 0.3s ease;
}

.pkp_site_nav_toggle:hover {
    background: linear-gradient(135deg, #ffd700 0%, #daa520 100%);
    color: #0c1a3a !important;
    transform: translateY(-2px);
}

/* Responsive design */
@media (max-width: 768px) {
    .pkp_structure_head {
        min-height: 160px;
    }
    
    .pkp_head_wrapper {
        min-height: 160px;
    }
    
    .pkp_site_name img {
        max-height: 100px;
        padding: 8px;
    }
    
    .pkp_site_nav_menu {
        margin: 0 15px;
        border-radius: 15px 15px 0 0;
        padding: 0 15px;
    }
    
  
    .pkp_search {
        padding: 10px 18px !important;
        font-size: 0.9em;
    }
    
    .pkp_structure_head::before {
        background-size: 
            250px 250px,
            200px 200px,
            180px 180px,
            200px 200px,
            100% 100%;
    }
}

@media (max-width: 480px) {
    .pkp_structure_head {
        min-height: 140px;
    }
    
    .pkp_head_wrapper {
        min-height: 140px;
    }
    
    .pkp_site_name img {
        max-height: 80px;
        padding: 6px;
    }
    
    .pkp_site_nav_menu {
        margin: 0 10px;
        padding: 0 10px;
    }
  }

/* Animasi subtle untuk background */
@keyframes goldShimmer {
    0%, 100% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
}

.pkp_structure_head::before {
    animation: goldShimmer 20s ease infinite;
    background-size: 400px 400px, 350px 350px, 300px 300px, 320px 320px, 200% 200%;
}

/* Efek glitter emas subtle */
@keyframes goldGlitter {
    0%, 100% { opacity: 0.3; }
    50% { opacity: 0.6; }
}

.pkp_structure_head::after {
    animation: goldGlitter 8s ease-in-out infinite;
}

/* ===== HEADER STYLING ===== */
.pkp_site_name .is_img img {
  max-width: 100%;
  max-height: 100%;
  display: block;
}

.pkp_structure_head::before {
  background: url(https://cdn.discordapp.com/attachments/1234947940850729043/1431676164706930718/Grey_Green_Modern_Business_Email_Header.png?ex=68fe47d4&is=68fcf654&hm=6ebd62ec3c89cfd302579651f2a40ff376cb53aa1a613816e2408b0f9658fbaa&)
    #36c center center;
  opacity: 20%;
  box-shadow: inset 8px 3px 20px 1px rgba(0, 0, 0, 0.75);
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: -1;
}

/* ===== SIDEBAR STYLING ===== */
.pkp_structure_sidebar {
  width: 300px;
  background: #f8f9fa;
  border-radius: 12px;
  padding: 15px 15px 15px 20px;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
  font-family: "Poppins", sans-serif;
}

/* ===== STYLE DASAR SEMUA MENU ===== */
.pkp_structure_sidebar .content .submit-btn,
.pkp_structure_sidebar .content .menu-btn,
.pkp_structure_sidebar .content .title-btn {
  margin: 8px 0;
  padding: 12px 15px;
  border-radius: 8px;
  text-align: center;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.3s ease;
  font-size: 14px;
}

/* Pastikan link mengikuti parent */
.pkp_structure_sidebar .content .submit-btn a,
.pkp_structure_sidebar .content .menu-btn a,
.pkp_structure_sidebar .content .title-btn a {
  color: inherit !important;
  text-decoration: none !important;
  display: block;
  width: 100%;
  height: 100%;
}

/* ===== WARNA EMAS (UNGGAH ARTIKEL / TITLE) ===== */
.pkp_structure_sidebar .content .submit-btn,
.pkp_structure_sidebar .content .title-btn {
  background: linear-gradient(135deg, #d4af37, #f7d774);
  color: #333;
  font-weight: 700;
}

/* ===== WARNA BIRU TUA (MENU BIASA) ===== */
.pkp_structure_sidebar .content .menu-btn {
  background: linear-gradient(135deg, #1c2e4a, #2f4b7c);
  color: #ffffff;
}

/* ===== HOVER EFFECT (BERLAKU UNTUK SEMUA) ===== */
.pkp_structure_sidebar .content .submit-btn:hover,
.pkp_structure_sidebar .content .menu-btn:hover,
.pkp_structure_sidebar .content .title-btn:hover {
  transform: translateY(-3px);
  box-shadow: 0 6px 15px rgba(0, 0, 0, 0.2);
  text-decoration: underline;
  text-decoration-color: #d4af37;
  text-underline-offset: 4px;
}

/* ===== ACTIVE EFFECT ===== */
.pkp_structure_sidebar .content .submit-btn:active,
.pkp_structure_sidebar .content .menu-btn:active,
.pkp_structure_sidebar .content .title-btn:active {
  transform: translateY(-1px);
  box-shadow: 0 3px 8px rgba(0, 0, 0, 0.2);
}


/* ===== RESPONSIVE DESIGN ===== */
@media (max-width: 768px) {
  .pkp_structure_sidebar {
    width: 200px;
    margin: 10px;
    padding: 10px;
  }

  .pkp_structure_sidebar .content div {
    padding: 10px;
    font-size: 13px;
  }
}

@media (max-width: 480px) {
  .pkp_structure_sidebar {
    width: 100%;
    margin: 10px 0;
    border-radius: 0;
  }
}

/* CSS untuk background aestetik biru tua dan emas pada header */
.pkp_structure_head {
    position: relative;
    background: linear-gradient(135deg, #0c1a3a 0%, #1a365f 30%, #2d538f 70%, #b8860b 100%);
    overflow: visible !important;
    min-height: 200px;
}

/* Background pattern aestetik dengan gradien biru-emas */
.pkp_structure_head::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: 
        radial-gradient(circle at 20% 20%, rgba(184, 134, 11, 0.3) 0%, transparent 50%),
        radial-gradient(circle at 80% 80%, rgba(218, 165, 32, 0.4) 0%, transparent 50%),
        radial-gradient(circle at 40% 70%, rgba(26, 54, 95, 0.6) 0%, transparent 50%),
        radial-gradient(circle at 70% 30%, rgba(12, 26, 58, 0.7) 0%, transparent 50%),
        linear-gradient(45deg, transparent 40%, rgba(255,215,0,0.1) 50%, transparent 60%);
    background-size: 
        400px 400px,
        350px 350px,
        300px 300px,
        320px 320px,
        100% 100%;
    z-index: 1;
}

/* Islamic geometric pattern dengan warna emas */
.pkp_structure_head::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: 
        url("data:image/svg+xml,%3Csvg width='150' height='150' viewBox='0 0 150 150' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M75 25c27.614 0 50 22.386 50 50s-22.386 50-50 50-50-22.386-50-50 22.386-50 50-50zm0 15c-19.33 0-35 15.67-35 35s15.67 35 35 35 35-15.67 35-35-15.67-35-35-35z' fill='%23daa520' fill-opacity='0.15'/%3E%3Cpath d='M60 45c8.284 0 15 6.716 15 15s-6.716 15-15 15-15-6.716-15-15 6.716-15 15-15zm30 30c8.284 0 15 6.716 15 15s-6.716 15-15 15-15-6.716-15-15 6.716-15 15-15zM60 105c8.284 0 15 6.716 15 15s-6.716 15-15 15-15-6.716-15-15 6.716-15 15-15zM30 75c8.284 0 15 6.716 15 15s-6.716 15-15 15-15-6.716-15-15 6.716-15 15-15z' fill='%23ffd700' fill-opacity='0.2'/%3E%3C/svg%3E"),
        url("data:image/svg+xml,%3Csvg width='100' height='100' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M50 10c22.091 0 40 17.909 40 40s-17.909 40-40 40-40-17.909-40-40 17.909-40 40-40zm0 10c-16.542 0-30 13.458-30 30s13.458 30 30 30 30-13.458 30-30-13.458-30-30-30z' fill='%23b8860b' fill-opacity='0.1'/%3E%3Cpath d='M35 35l15 15 15-15-15 15 15 15-15-15-15 15 15-15z' fill='%23ffd700' fill-opacity='0.25'/%3E%3C/svg%3E");
    background-size: 150px 150px, 100px 100px;
    background-position: 10% 20%, 90% 80%;
    opacity: 0.8;
    z-index: 1;
}

/* Pastikan konten header tetap di atas background */
.pkp_head_wrapper {
    position: relative;
    z-index: 2;
    min-height: 200px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

/* Style untuk logo agar kontras dengan background */
.pkp_site_name_wrapper {
    padding: 5px 0;
    text-align: center;
}

.pkp_site_name img {
    filter: 
        drop-shadow(0 4px 8px rgba(0,0,0,0.6))
        brightness(1.1)
        contrast(1.2);
    background: linear-gradient(135deg, rgba(255,215,0,0.1) 0%, rgba(184,134,11,0.2) 100%);
    backdrop-filter: blur(5px);
    border-radius: 8px;
    padding: 12px;
    border: 1px solid rgba(255, 215, 0, 0.3);
    max-height: 140px;
    width: auto;
}


.cmp_skip_to_content a:hover {
    background: linear-gradient(135deg, #b8860b 0%, #1a365f 100%);
}

/* Menu toggle button styling */
.pkp_site_nav_toggle {
    background: rgba(255, 215, 0, 0.9);
    color: #1a365f !important;
    border: 1px solid #daa520;
}

.pkp_site_nav_toggle:hover {
    background: #ffd700;
    color: #0c1a3a !important;
}

/* Responsive design */
@media (max-width: 768px) {
    .pkp_structure_head {
        min-height: 160px;
    }
    
    .pkp_head_wrapper {
        min-height: 160px;
    }
    
    .pkp_site_name img {
        max-height: 100px;
        padding: 8px;
    }
    
    .pkp_site_nav_menu {
        margin: 0 15px;
        border-radius: 8px 8px 0 0;
    }
    
    
    .pkp_structure_head::before {
        background-size: 
            250px 250px,
            200px 200px,
            180px 180px,
            200px 200px,
            100% 100%;
    }
}

@media (max-width: 480px) {
    .pkp_structure_head {
        min-height: 140px;
    }
    
    .pkp_head_wrapper {
        min-height: 140px;
    }
    
    .pkp_site_name img {
        max-height: 80px;
        padding: 6px;
    }
    
    .pkp_site_nav_menu {
        margin: 0 10px;
    }
  }

/* Animasi subtle untuk background */
@keyframes goldShimmer {
    0%, 100% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
}

.pkp_structure_head::before {
    animation: goldShimmer 20s ease infinite;
    background-size: 400px 400px, 350px 350px, 300px 300px, 320px 320px, 200% 200%;
}

/* Efek glitter emas subtle */
@keyframes goldGlitter {
    0%, 100% { opacity: 0.3; }
    50% { opacity: 0.6; }
}

.pkp_structure_head::after {
    animation: goldGlitter 8s ease-in-out infinite;
}

.pkp_navigation_primary_wrapper {
    padding-left: 15px;
    padding-right: 0;
}

@media (min-width: 992px) {
    .pkp_navigation_search_wrapper a {
        margin: .300rem .0;
        padding: .357rem .5em calc(.714rem - 2px);
        border-bottom: 1px solid transparent;
        color: #fff;
        text-decoration: none;
        padding-right: 10px;
    }
}

@media (min-width: 992px) {
    .pkp_navigation_search_wrapper {
        float: right;
        margin: 0;
        padding: 0;
        border: none;
        padding-right: 10px;
    }
}

@media (min-width: 992px) {
    .pkp_block {
        padding: 0.143rem;
    }
}

.pkp_site_nav_menu .pkp_nav_list {
    padding-left: 0;
    margin-left: 0;
    padding-top: 6px;
}



/* ===== VARIABLES & RESET ===== */
:root {
    --primary-blue: #1e3a8a;
    --dark-blue: #1e40af;
    --light-blue: #3b82f6;
    --accent-gold: #f59e0b;
    --light-gold: #fbbf24;
    --white: #ffffff;
    --light-gray: #f8fafc;
    --text-dark: #1f2937;
    --text-light: #6b7280;
    --shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
    --transition: all 0.3s ease;
}

/* ===== BACKGROUND WITH DIAGONAL LINES ===== */
.journal-container {
    background: 
        linear-gradient(135deg, var(--primary-blue) 0%, var(--dark-blue) 100%),
        repeating-linear-gradient(
            45deg,
            transparent,
            transparent 10px,
            rgba(255, 255, 255, 0.03) 10px,
            rgba(255, 255, 255, 0.03) 20px
        );
    min-height: 100vh;
    padding: 2rem;
    position: relative;
    overflow: hidden;
}

.journal-container::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: 
        repeating-linear-gradient(
            -45deg,
            transparent,
            transparent 15px,
            rgba(255, 255, 255, 0.05) 15px,
            rgba(255, 255, 255, 0.05) 30px
        );
    pointer-events: none;
}

/* ===== MAIN CONTENT CARD ===== */
.journal-card {
    background: var(--white);
    border-radius: 20px;
    box-shadow: var(--shadow);
    padding: 3rem;
    max-width: 1200px;
    margin: 0 auto;
    position: relative;
    z-index: 2;
    border: 1px solid rgba(255, 255, 255, 0.2);
    backdrop-filter: blur(10px);
}

.journal-card::before {
    content: '';
    position: absolute;
    top: -2px;
    left: -2px;
    right: -2px;
    bottom: -2px;
    background: linear-gradient(45deg, var(--accent-gold), var(--light-blue), var(--accent-gold));
    border-radius: 22px;
    z-index: -1;
    opacity: 0.1;
}

/* ===== JOURNAL HEADER ===== */
.journal-header {
    text-align: center;
    margin-bottom: 3rem;
    padding-bottom: 2rem;
    border-bottom: 2px solid var(--light-gray);
    position: relative;
}

.journal-title {
    font-size: 2.5rem;
    font-weight: 700;
    color: var(--primary-blue);
    margin-bottom: 1rem;
    text-transform: uppercase;
    letter-spacing: 2px;
    position: relative;
    display: inline-block;
}

.journal-title::after {
    content: '';
    position: absolute;
    bottom: -10px;
    left: 50%;
    transform: translateX(-50%);
    width: 100px;
    height: 3px;
    background: linear-gradient(90deg, var(--accent-gold), var(--light-blue));
    border-radius: 2px;
}

.journal-subtitle {
    font-size: 1.2rem;
    color: var(--text-light);
    font-weight: 300;
    margin-top: 1rem;
}

/* ===== METRICS SECTION ===== */
.journal-metrics {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 2rem;
    margin-bottom: 3rem;
}

.metric-card {
    background: var(--light-gray);
    padding: 2rem;
    border-radius: 15px;
    border-left: 4px solid var(--accent-gold);
    transition: var(--transition);
    position: relative;
    overflow: hidden;
}

.metric-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
}

.metric-card::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 60px;
    height: 60px;
    background: linear-gradient(45deg, transparent 40%, rgba(245, 158, 11, 0.1) 100%);
    border-radius: 0 15px 0 0;
}

.metric-value {
    font-size: 2rem;
    font-weight: 700;
    color: var(--primary-blue);
    margin-bottom: 0.5rem;
}

.metric-label {
    font-size: 0.9rem;
    color: var(--text-light);
    text-transform: uppercase;
    letter-spacing: 1px;
    font-weight: 600;
}

/* ===== PUBLISHER INFO ===== */
.publisher-info {
    background: linear-gradient(135deg, var(--light-gray), var(--white));
    padding: 2rem;
    border-radius: 15px;
    margin-bottom: 2rem;
    border: 1px solid rgba(59, 130, 246, 0.1);
}

.info-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1.5rem;
}

.info-item {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.info-icon {
    width: 40px;
    height: 40px;
    background: linear-gradient(135deg, var(--accent-gold), var(--light-gold));
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--white);
    font-weight: bold;
}

.info-content h4 {
    margin: 0;
    color: var(--primary-blue);
    font-size: 1rem;
    font-weight: 600;
}

.info-content p {
    margin: 0.2rem 0 0 0;
    color: var(--text-light);
    font-size: 0.9rem;
}

/* ===== INDEXED BY SECTION ===== */
.indexed-section {
    margin: 3rem 0;
}

.section-title {
    font-size: 1.5rem;
    color: var(--primary-blue);
    margin-bottom: 1.5rem;
    text-align: center;
    position: relative;
}

.section-title::after {
    content: '';
    position: absolute;
    bottom: -8px;
    left: 50%;
    transform: translateX(-50%);
    width: 60px;
    height: 2px;
    background: var(--accent-gold);
}

.indexed-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 1.5rem;
    margin-top: 2rem;
}

.index-item {
    background: var(--white);
    padding: 1.5rem;
    border-radius: 12px;
    text-align: center;
    border: 2px solid transparent;
    background-clip: padding-box;
    position: relative;
    transition: var(--transition);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.08);
}

.index-item:hover {
    transform: translateY(-3px);
    border-color: var(--accent-gold);
}

.index-item::before {
    content: '';
    position: absolute;
    top: -2px;
    left: -2px;
    right: -2px;
    bottom: -2px;
    background: linear-gradient(45deg, var(--accent-gold), var(--light-blue));
    border-radius: 14px;
    z-index: -1;
    opacity: 0;
    transition: var(--transition);
}

.index-item:hover::before {
    opacity: 1;
}

/* ===== ACTION BUTTONS ===== */
.action-buttons {
    display: flex;
    gap: 1rem;
    justify-content: center;
    margin-top: 3rem;
    flex-wrap: wrap;
}

.btn {
    padding: 1rem 2rem;
    border: none;
    border-radius: 50px;
    font-weight: 600;
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: 1px;
    transition: var(--transition);
    position: relative;
    overflow: hidden;
    cursor: pointer;
}

.btn-primary {
    background: linear-gradient(135deg, var(--accent-gold), var(--light-gold));
    color: var(--white);
}

.btn-secondary {
    background: transparent;
    color: var(--primary-blue);
    border: 2px solid var(--primary-blue);
}

.btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
}

.btn:active {
    transform: translateY(0);
}

/* ===== SEARCH BAR ===== */
.search-section {
    background: var(--light-gray);
    padding: 2rem;
    border-radius: 15px;
    margin: 2rem 0;
    text-align: center;
}

.search-box {
    max-width: 500px;
    margin: 0 auto;
    position: relative;
}

.search-input {
    width: 100%;
    padding: 1rem 1.5rem;
    border: 2px solid transparent;
    border-radius: 50px;
    background: var(--white);
    font-size: 1rem;
    transition: var(--transition);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

.search-input:focus {
    outline: none;
    border-color: var(--accent-gold);
    box-shadow: 0 5px 20px rgba(245, 158, 11, 0.3);
}

/* ===== RESPONSIVE DESIGN ===== */
@media (max-width: 768px) {
    .journal-container {
        padding: 1rem;
    }
    
    .journal-card {
        padding: 2rem 1.5rem;
    }
    
    .journal-title {
        font-size: 2rem;
    }
    
    .journal-metrics {
        grid-template-columns: 1fr;
    }
    
    .action-buttons {
        flex-direction: column;
        align-items: center;
    }
    
    .btn {
        width: 100%;
        max-width: 300px;
    }
}

/* ===== ANIMATIONS ===== */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.journal-card {
    animation: fadeInUp 0.8s ease;
}

.metric-card {
    animation: fadeInUp 0.8s ease 0.2s both;
}

.index-item {
    animation: fadeInUp 0.8s ease 0.4s both;
}

/* ===== DECORATIVE ELEMENTS ===== */
.floating-elements {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    pointer-events: none;
    z-index: 1;
}

.floating-element {
    position: absolute;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 50%;
    animation: float 6s ease-in-out infinite;
}

.floating-element:nth-child(1) {
    width: 100px;
    height: 100px;
    top: 10%;
    left: 5%;
    animation-delay: 0s;
}

.floating-element:nth-child(2) {
    width: 150px;
    height: 150px;
    top: 60%;
    right: 10%;
    animation-delay: 2s;
}

.floating-element:nth-child(3) {
    width: 80px;
    height: 80px;
    bottom: 20%;
    left: 15%;
    animation-delay: 4s;
}

@keyframes float {
    0%, 100% {
        transform: translateY(0) rotate(0deg);
    }
    50% {
        transform: translateY(-20px) rotate(180deg);
    }
}


/* ==== NAVIGATION TRANSPARANT + BOLD + GLASS HOVER ==== */

/* Navbar transparan */
.pkp_site_nav_menu,
.pkp_navigation_primary {
    background: transparent !important;
    box-shadow: none !important;
}

/* Teks menu lebih tebal */
.pkp_navigation_primary > li > a,
.pkp_navigation_primary > li > span {
    font-weight: 700 !important;
    color: #ffffff !important; /* jika ingin putih, bisa diganti */
}

/* Efek kaca saat hover */
.pkp_navigation_primary > li > a:hover,
.pkp_navigation_primary > li > span:hover {
    background: rgba(255, 255, 255, 0.18) !important; /* transparan */
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    border-radius: 6px;
    padding: 6px 12px;
    transition: all 0.25s ease-in-out;
}

/* Efek kaca untuk menu yang sedang aktif */
.pkp_navigation_primary > li.current > a,
.pkp_navigation_primary > li.current > span {
    background: rgba(255, 255, 255, 0.22) !important;
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    border-radius: 6px;
}

/* Dropdown tetap terlihat rapi */
.pkp_navigation_primary .dropdown-menu {
    background: rgba(255, 255, 255, 0.85) !important;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border-radius: 8px;
    border: 1px solid rgba(255,255,255,0.35);
    box-shadow: 0 6px 18px rgba(0,0,0,0.18);
}

/* Hover untuk item dropdown */
.pkp_navigation_primary .dropdown-menu a:hover {
    background: rgba(255,255,255,0.35) !important;
    color: #0c1a3a !important;
    border-radius: 4px;
}


/* ==== CLEAN ELEGANT DROPDOWN – NO GOLD HOVER ==== */

.pkp_navigation_primary .dropdown-menu {
    background: rgba(12, 38, 68, 0.55) !important; /* biru transparan */
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-radius: 12px;
    border: 1px solid rgba(255, 255, 255, 0.25);
    padding: 12px 0;
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.25);
}

/* teks lebih jelas & kontras */
.pkp_navigation_primary .dropdown-menu a {
    color: #ffffff !important;  /* putih jelas */
    font-weight: 600;
    padding: 10px 20px;
    display: block;
    border-radius: 6px;
    transition: 0.25s ease;
}

/* hover elegan tanpa warna kuning */
.pkp_navigation_primary .dropdown-menu a:hover {
    background: rgba(255, 255, 255, 0.22) !important; /* glass white highlight */
    color: #0c1a3a !important; /* biru gelap kontras */
    transform: translateX(5px);
}

/* separator halus */
.pkp_navigation_primary .dropdown-menu a + a {
    border-top: 1px solid rgba(255, 255, 255, 0.08);
}

/* indikator segitiga tanpa aksen emas */
.pkp_navigation_primary .dropdown-menu::before {
    content: "";
    position: absolute;
    top: -6px;
    left: 40px;
    width: 12px;
    height: 12px;
    background: rgba(12, 38, 68, 0.55);
    border-left: 1px solid rgba(255, 255, 255, 0.25);
    border-top: 1px solid rgba(255, 255, 255, 0.25);
    transform: rotate(45deg);
}


/* ==== ACADEMIC CROSS DIAGONAL BACKGROUND (STRONGER & CLEAN) ==== */
body {
  background-image: linear-gradient(
      297deg,
      transparent 0%,
      transparent 34%,
      rgba(178, 178, 178, 0.02) 34%,
      rgba(178, 178, 178, 0.02) 53%,
      transparent 53%,
      transparent 100%
    ),
    linear-gradient(
      222deg,
      transparent 0%,
      transparent 30%,
      rgba(202, 216, 243, 0.24) 30%,
      rgba(202, 216, 243, 0.24) 58%,
      transparent 58%,
      transparent 100%
    ),
    linear-gradient(
      352deg,
      transparent 0%,
      transparent 25%,
      rgba(204, 217, 247, 0.11) 25%,
      rgba(204, 217, 247, 0.11) 57%,
      transparent 57%,
      transparent 100%
    ),
    linear-gradient(90deg, rgb(255, 255, 255), rgb(255, 255, 255));
}

/* =======================================================
   MOBILE SINGLE-PANEL MENU WITH GLASS EFFECT – OJS 3.3
   ======================================================= */
@media (max-width: 900px) {

  /* Panel menu utama menjadi satu kotak */
  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen {
      background: rgba(12, 38, 68, 0.55) !important;
      backdrop-filter: blur(14px);
      -webkit-backdrop-filter: blur(14px);
      border-radius: 16px;
      border: 1px solid rgba(255, 255, 255, 0.22);
      padding: 18px 0 24px 0 !important;
      width: 92% !important;
      margin: 0 auto !important;
      top: 75px !important; /* JARAK DARI HEADER / IKON X */
      box-shadow: 0 18px 45px rgba(0,0,0,0.28);
      position: absolute !important;
      left: 0; right: 0;
  }

  /* MENU UTAMA */
  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen .pkp_navigation_primary > li > a {
      color: #ffffff !important;
      font-weight: 700;
      padding: 12px 26px !important;
      display: block;
  }

  /* SUBMENU NAVIGASI (jadi bagian dari panel yang sama) */
  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen .pkp_navigation_primary > li > ul {
      background: transparent !important;
      border: none !important;
      padding: 6px 0 6px 0 !important;
      margin-left: 10px !important;
  }

  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen .pkp_navigation_primary > li > ul a {
      color: #ffffff !important;
      font-weight: 500;
      padding: 10px 32px !important;
      display: block;
  }

  /* PEMBATAS ANTARA NAVIGASI & USER */
  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen .pkp_navigation_user_wrapper {
      margin-top: 16px;
      padding-top: 16px;
      border-top: 1px solid rgba(255,255,255,0.25);
  }

  /* USER MENU ITEM */
  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen .pkp_navigation_user > li > a,
  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen .pkp_navigation_user > li > ul a {
      color: #ffffff !important;
      font-weight: 500;
      padding: 10px 26px !important;
      display: block;
  }

  /* HOVER */
  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen a:hover {
      background: rgba(255, 255, 255, 0.22) !important;
      color: #0c1a3a !important;
      transform: translateX(5px);
      border-radius: 6px;
  }

  /* Hilangkan kotak-kotak submenu terpisah */
  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen ul ul {
      box-shadow: none !important;
      border: none !important;
      background: transparent !important;
  }
}

/* =======================================================
   FORCE MOBILE MENU STYLE EVEN IF DESKTOP SITE IS ENABLED
   ======================================================= */
@media (max-width: 1280px), (pointer: coarse), (hover: none) {

  /* Panel menu utama menjadi satu kotak */
  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen {
      background: rgba(12, 38, 68, 0.55) !important;
      backdrop-filter: blur(14px);
      -webkit-backdrop-filter: blur(14px);
      border-radius: 16px;
      border: 1px solid rgba(255, 255, 255, 0.22);
      padding: 18px 0 24px 0 !important;
      width: 92% !important;
      margin: 0 auto !important;
      top: 75px !important;
      box-shadow: 0 18px 45px rgba(0,0,0,0.28);
      position: absolute !important;
      left: 0; right: 0;
      z-index: 9999 !important;
  }

  /* MENU UTAMA */
  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen .pkp_navigation_primary > li > a {
      color: #ffffff !important;
      font-weight: 700;
      padding: 12px 26px !important;
      display: block;
  }

  /* SUBMENU */
  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen .pkp_navigation_primary > li > ul,
  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen .pkp_navigation_user > li > ul {
      background: transparent !important;
      border: none !important;
      padding: 6px 0 6px 0 !important;
      margin-left: 10px !important;
  }

  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen ul ul a {
      color: #ffffff !important;
      font-weight: 500;
      padding: 10px 32px !important;
      display: block;
  }

  /* USER PANEL SEPARATOR */
  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen .pkp_navigation_user_wrapper {
      margin-top: 16px !important;
      padding-top: 16px !important;
      border-top: 1px solid rgba(255,255,255,0.25) !important;
  }

  /* HOVER */
  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen a:hover {
      background: rgba(255, 255, 255, 0.22) !important;
      color: #0c1a3a !important;
      transform: translateX(5px);
      border-radius: 6px;
  }
}

/* ============================================
   SHIFT USER MENU TEXT TO THE RIGHT (DESKTOP)
   ============================================ */
@media (min-width: 901px) {
  #navigationUser.pkp_navigation_user {
      padding-left: 18px !important; /* geser kanan */
      margin-left: 12px !important;
  }

  /* item link di dalam menu user */
  #navigationUser.pkp_navigation_user > li > a {
      padding-left: 12px !important;
      padding-right: 12px !important;
  }
}

/* =======================================================
   SHIFT USER SECTION IN MOBILE PANEL
   ======================================================= */
@media (max-width: 1280px), (pointer: coarse), (hover: none) {
  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen .pkp_navigation_user > li > a {
      padding-left: 36px !important; /* lebih ke kanan */
  }
  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen .pkp_navigation_user > li > ul a {
      padding-left: 42px !important; /* submenu lebih masuk */
  }
}

/* =======================================================
   FIX USER MENU POSITION ON MID DESKTOP RESOLUTIONS
   (e.g., 1024–1280px including 1100px case)
   ======================================================= */
@media (min-width: 1025px) and (max-width: 1280px) {
  #navigationUserWrapper,
  #navigationUser {
      margin-left: 24px !important; /* geser kanan */
      padding-left: 12px !important;
  }

  #navigationUser > li > a {
      padding-left: 14px !important;
      padding-right: 14px !important;
  }

  /* ensure search button and user menu don't overlap */
  .pkp_navigation_search_wrapper {
      margin-right: 24px !important;
  }
}


/* =======================================================
   DESKTOP USER DROPDOWN GLASS STYLE (MATCH MAIN MENU)
   ======================================================= */
@media (min-width: 1025px) {

  .pkp_navigation_user .dropdown-menu,
  #navigationUser li ul {
      background: rgba(12, 38, 68, 0.55) !important;
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
      border-radius: 12px;
      border: 1px solid rgba(255, 255, 255, 0.25);
      padding: 12px 0 !important;
      box-shadow: 0 12px 28px rgba(0, 0, 0, 0.25);
  }

  #navigationUser li ul a {
      color: #ffffff !important;
      font-weight: 600;
      padding: 10px 20px !important;
      display: block !important;
      border-radius: 6px;
      transition: 0.25s ease;
  }

  #navigationUser li ul a:hover {
      background: rgba(255, 255, 255, 0.22) !important;
      color: #0c1a3a !important;
      transform: translateX(5px);
  }

  #navigationUser li ul a + a {
      border-top: 1px solid rgba(255, 255, 255, 0.08);
  }
}

/* =======================================================
   DESKTOP RESET & POSITIONING (≥ 992px)
   ======================================================= */
@media (min-width: 992px) {

    /* Reset panel mobile agar tidak terbawa ke desktop */
    nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen {
        background: transparent !important;
        backdrop-filter: none !important;
        border: none !important;
        margin: 0 !important;
        padding: 0 !important;
        width: auto !important;
        height: auto !important;
        position: static !important;
        box-shadow: none !important;
    }

    /* Wrapper menu utama kembali BLOCK seperti default OJS */
    .pkp_navigation_primary_wrapper {
        display: block !important;
        width: 100% !important;
    }

    /* Tombol search tetap di kanan */
    .pkp_navigation_search_wrapper {
        float: right !important;
        margin-right: 10px !important;
        position: relative !important;
        top: -5px !important; /* sejajarkan vertikal */
    }

    /* Kembalikan user menu ke TOP BAR */
    #navigationUserWrapper,
    #navigationUser {
        position: static !important;
        float: right !important;
        margin: 0 !important;
        padding: 0 !important;
        display: block !important;
    }

    /* Tempatkan user menu sejajar dengan search */
    .pkp_head_wrapper #navigationUserWrapper {
        position: absolute !important;
        top: 5px !important;
        z-index: 9999 !important;
    }

    /* Hilangkan padding bawaan agar tidak turun */
    #navigationUserWrapper a {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }
}

/* ===== ANIMATIONS (FIX) ===== */
.pkp_structure_sidebar .content .submit-btn,
.pkp_structure_sidebar .content .menu-btn,
.pkp_structure_sidebar .content .title-btn {
  animation: fadeIn 0.5s ease-out;
}

.pkp_structure_sidebar .content .submit-btn {
  animation-delay: 0.1s;
}

.pkp_structure_sidebar .content .menu-btn:nth-of-type(2) {
  animation-delay: 0.2s;
}
.pkp_structure_sidebar .content .menu-btn:nth-of-type(3) {
  animation-delay: 0.3s;
}
.pkp_structure_sidebar .content .menu-btn:nth-of-type(4) {
  animation-delay: 0.4s;
}

/* ===== FIX LINK SIDEBAR (OVERRIDE INLINE) ===== */
.pkp_structure_sidebar .content .submit-btn a,
.pkp_structure_sidebar .content .menu-btn a,
.pkp_structure_sidebar .content .title-btn a {
  color: inherit !important;
  text-decoration: none !important;
  display: block;
  width: 100%;
  height: 100%;
}

/* Khusus UNGGAH ARTIKEL (emas) */
.pkp_structure_sidebar .content .submit-btn a {
  color: #333 !important;
  font-weight: 700;
}


/* =======================================================
   SAKINAH SIDEBAR - PREMIUM BLUE GOLD STYLE
   ======================================================= */

/* Wrapper sidebar */
.pkp_structure_sidebar {
  background: transparent !important;
  padding: 18px 14px !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  font-family: "Poppins", Arial, sans-serif;
}

/* Hilangkan style bawaan block OJS agar custom card lebih bersih */
.pkp_structure_sidebar .pkp_block {
  padding: 0 !important;
  margin: 0 0 16px 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

/* Card utama */
.sakinah-sidebar-card {
  background: rgba(255, 255, 255, 0.96);
  border: 1px solid rgba(22, 50, 100, 0.10);
  border-radius: 16px;
  padding: 14px;
  margin-bottom: 18px;
  box-shadow: 0 10px 26px rgba(16, 39, 77, 0.13);
  overflow: hidden;
  transition: all 0.28s ease;
}

.sakinah-sidebar-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 34px rgba(16, 39, 77, 0.18);
}

/* Judul setiap block */
.sakinah-sidebar-title {
  position: relative;
  min-height: 44px;
  display: flex;
  align-items: center;
  padding: 0 16px 0 48px;
  margin: -2px -2px 14px -2px;
  border-radius: 12px;
  background: linear-gradient(135deg, #d7a91d 0%, #f1cf63 52%, #c99510 100%);
  color: #143264;
  font-size: 13px;
  font-weight: 800;
  line-height: 1.25;
  text-transform: uppercase;
  letter-spacing: 1.4px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.45);
}

/* Icon judul via CSS, tidak perlu span di HTML */
.sakinah-sidebar-title::before {
  content: "i";
  position: absolute;
  left: 14px;
  top: 50%;
  width: 24px;
  height: 24px;
  transform: translateY(-50%);
  border-radius: 50%;
  background: #173565;
  color: #f4ca4f;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: Georgia, serif;
  font-size: 15px;
  font-weight: 800;
  text-transform: none;
  letter-spacing: 0;
}

/* Icon berbeda per block */
.sakinah-template-card .sakinah-sidebar-title::before {
  content: "▣";
  font-family: Arial, sans-serif;
  font-size: 13px;
}

.sakinah-tools-card .sakinah-sidebar-title::before {
  content: "✣";
  font-family: Arial, sans-serif;
  font-size: 15px;
}

.sakinah-stat-card .sakinah-sidebar-title::before {
  content: "▥";
  font-family: Arial, sans-serif;
  font-size: 14px;
}

/* =======================================================
   MENU INFORMASI JURNAL
   ======================================================= */

.sakinah-info-menu {
  padding-bottom: 10px;
}

.sakinah-info-menu .sakinah-sidebar-menu {
  margin: 0;
  padding: 0;
  border-bottom: 1px solid rgba(20, 50, 100, 0.10);
}

.sakinah-info-menu .sakinah-sidebar-menu:last-child {
  border-bottom: none;
}

.sakinah-info-menu .sakinah-sidebar-menu a {
  position: relative;
  display: block;
  padding: 10px 28px 10px 10px;
  color: #163264 !important;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.35;
  text-decoration: none !important;
  border-radius: 9px;
  transition: all 0.25s ease;
}

/* Panah kanan */
.sakinah-info-menu .sakinah-sidebar-menu a::after {
  content: "›";
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  color: #c99510;
  font-size: 22px;
  font-weight: 800;
  line-height: 1;
  transition: all 0.25s ease;
}

/* Garis aksen hover */
.sakinah-info-menu .sakinah-sidebar-menu a::before {
  content: "";
  position: absolute;
  left: 0;
  top: 8px;
  bottom: 8px;
  width: 0;
  border-radius: 6px;
  background: #d7a91d;
  transition: all 0.25s ease;
}

/* Hover menu */
.sakinah-info-menu .sakinah-sidebar-menu a:hover {
  color: #0f2a58 !important;
  background: linear-gradient(90deg, rgba(245, 210, 102, 0.22), rgba(255,255,255,0.82));
  padding-left: 18px;
  transform: translateX(4px);
  box-shadow: 0 8px 18px rgba(16, 39, 77, 0.10);
}

.sakinah-info-menu .sakinah-sidebar-menu a:hover::before {
  width: 4px;
}

.sakinah-info-menu .sakinah-sidebar-menu a:hover::after {
  right: 7px;
  color: #a87906;
}

/* =======================================================
   TEMPLATE ARTIKEL
   ======================================================= */

.sakinah-template-card img {
  display: block;
  width: 100%;
  max-width: 300px;
  height: auto;
  margin: 4px auto 2px;
  border-radius: 12px;
  transition: all 0.28s ease;
}

.sakinah-template-card img:hover {
  transform: translateY(-4px) scale(1.02);
  box-shadow: 0 12px 24px rgba(16, 39, 77, 0.18);
}

/* =======================================================
   APLIKASI PENDUKUNG
   Catatan: sementara tetap mengakomodasi HTML lama
   yang membungkus gambar dengan .sakinah-sidebar-title.
   ======================================================= */

.sakinah-tools-card .sakinah-sidebar-title:not(:first-child) {
  min-height: auto;
  display: block;
  padding: 0;
  margin: 10px 0 0 0;
  background: transparent;
  box-shadow: none;
  border-radius: 12px;
  letter-spacing: 0;
}

.sakinah-tools-card .sakinah-sidebar-title:not(:first-child)::before {
  display: none;
}

.sakinah-tools-card img {
  display: block;
  width: 100%;
  max-width: 300px;
  height: auto;
  margin: 8px auto;
  padding: 8px 12px;
  background: #ffffff;
  border-radius: 13px;
  box-shadow: 0 6px 16px rgba(16, 39, 77, 0.10);
  transition: all 0.28s ease;
}

.sakinah-tools-card img:hover {
  transform: translateY(-4px) scale(1.025);
  box-shadow: 0 14px 28px rgba(16, 39, 77, 0.18);
}

/* =======================================================
   STATISTIK KUNJUNGAN
   ======================================================= */

.sakinah-stat-card a {
  display: block;
  text-decoration: none !important;
}

.sakinah-stat-card img {
  display: block;
  width: 100%;
  max-width: 300px;
  height: auto;
  margin: 6px auto 0;
  padding: 8px 12px;
  background: #ffffff;
  border-radius: 13px;
  box-shadow: 0 6px 16px rgba(16, 39, 77, 0.10);
  transition: all 0.28s ease;
}

/* Sembunyikan tracking gif Histats 0.gif */
.sakinah-stat-card img[src*="0.gif"] {
  display: none !important;
}

.sakinah-stat-card img:hover {
  transform: translateY(-4px) scale(1.025);
  box-shadow: 0 14px 28px rgba(16, 39, 77, 0.18);
}

/* =======================================================
   RESPONSIVE
   ======================================================= */

@media (max-width: 900px) {
  .pkp_structure_sidebar {
    width: auto !important;
    padding: 16px 12px !important;
    margin: 0 !important;
  }

  .sakinah-sidebar-card {
    margin-bottom: 16px;
    border-radius: 15px;
  }

  .sakinah-sidebar-title {
    min-height: 42px;
    font-size: 12px;
    letter-spacing: 1.1px;
  }

  .sakinah-info-menu .sakinah-sidebar-menu a {
    font-size: 13px;
    padding-top: 11px;
    padding-bottom: 11px;
  }
}

@media (max-width: 480px) {
  .sakinah-sidebar-card {
    padding: 12px;
  }

  .sakinah-sidebar-title {
    padding-left: 44px;
  }

  .sakinah-sidebar-title::before {
    left: 12px;
  }
}

/* =======================================================
   SAKINAH FOOTER - FULL BLEED LIKE HEADER
   ======================================================= */

/* Paksa footer keluar dari container OJS agar selebar layar */
.pkp_structure_footer_wrapper {
  width: 100vw !important;
  max-width: none !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  margin-top: 42px !important;
  background: transparent !important;
}

/* Footer dibuat sama konsepnya seperti header: full background */
.pkp_structure_footer {
  position: relative;
  width: 100% !important;
  max-width: none !important;
  min-height: 120px;
  margin: 0 !important;
  padding: 26px 0 !important;
  overflow: hidden;
  background:
    radial-gradient(circle at 18% 25%, rgba(212, 175, 55, 0.16) 0%, transparent 30%),
    radial-gradient(circle at 86% 75%, rgba(231, 200, 90, 0.14) 0%, transparent 34%),
    linear-gradient(135deg, #0d2343 0%, #173565 52%, #10284d 100%);
  border-top: 4px solid #d4af37;
  box-shadow: 0 -8px 24px rgba(13, 35, 67, 0.14);
}

/* Pattern halus supaya nyambung dengan header */
.pkp_structure_footer::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    radial-gradient(circle, rgba(231, 200, 90, 0.13) 0 2px, transparent 3px),
    radial-gradient(circle, rgba(255, 255, 255, 0.06) 0 8px, transparent 9px);
  background-size: 78px 78px, 120px 120px;
  background-position: 0 0, 34px 22px;
  opacity: 0.36;
  pointer-events: none;
}

/* Garis emas highlight */
.pkp_structure_footer::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(231, 200, 90, 0.95),
    transparent
  );
}

/* Area brand OJS/PKP */
.pkp_brand_footer {
  position: relative;
  z-index: 2;
  width: min(980px, calc(100% - 36px));
  margin: 0 auto !important;
  padding: 0 !important;
  min-height: 68px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  text-align: right;
}

/* Link logo tanpa container/kotak */
.pkp_brand_footer a {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  text-decoration: none !important;
}

/* Pastikan tidak ada label tambahan dobel */
.pkp_brand_footer a::before {
  display: none !important;
  content: none !important;
}

/* Logo OJS/PKP dibuat lebih kecil */
.pkp_brand_footer img {
  display: block;
  width: auto !important;
  max-width: 112px !important;
  height: auto !important;
  opacity: 0.88;
  border-radius: 0 !important;
  filter:
    brightness(0)
    invert(1)
    sepia(12%)
    saturate(240%)
    hue-rotate(185deg)
    brightness(1.05);
  transition: all 0.25s ease;
}

/* Hover logo */
.pkp_brand_footer a:hover img {
  opacity: 1;
  transform: translateY(-2px);
  filter:
    brightness(0)
    invert(1)
    sepia(35%)
    saturate(520%)
    hue-rotate(350deg)
    brightness(1.12);
}

/* =======================================================
   SUPAYA HEADER DAN FOOTER SAMA-SAMA FULL BLEED
   ======================================================= */

.pkp_structure_head {
  width: 100vw !important;
  max-width: none !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
}

/* Isi header tetap dibatasi agar logo/nav tidak melebar liar */
.pkp_head_wrapper {
  width: min(980px, calc(100% - 36px));
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Responsive */
@media (max-width: 768px) {
  .pkp_structure_footer {
    min-height: 105px;
    padding: 24px 0 !important;
  }

  .pkp_brand_footer {
    justify-content: center;
    min-height: 58px;
  }

  .pkp_brand_footer img {
    max-width: 96px !important;
  }

  .pkp_head_wrapper {
    width: min(100%, calc(100% - 24px));
  }
}

@media (max-width: 480px) {
  .pkp_structure_footer {
    min-height: 96px;
    padding: 22px 0 !important;
  }

  .pkp_brand_footer img {
    max-width: 88px !important;
  }
}

/* =======================================================
   SAKINAH FOOTER - SAFE COMPACT VERSION
   Tidak mengubah header dan body
   ======================================================= */

.pkp_structure_footer_wrapper {
  width: 100% !important;
  margin-top: 34px !important;
  background: transparent !important;
}

.pkp_structure_footer {
  position: relative;
  overflow: hidden;
  margin: 0 !important;
  padding: 18px 0 14px !important;
  background:
    radial-gradient(circle at 16% 20%, rgba(212, 175, 55, 0.14) 0%, transparent 30%),
    radial-gradient(circle at 86% 78%, rgba(231, 200, 90, 0.12) 0%, transparent 34%),
    linear-gradient(135deg, #0d2343 0%, #173565 55%, #10284d 100%);
  border-top: 3px solid #d4af37;
  color: #f8f3e6;
  box-shadow: 0 -8px 22px rgba(13, 35, 67, 0.14);
}

.pkp_structure_footer::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    radial-gradient(circle, rgba(231, 200, 90, 0.12) 0 2px, transparent 3px),
    radial-gradient(circle, rgba(255,255,255,0.05) 0 8px, transparent 9px);
  background-size: 78px 78px, 120px 120px;
  background-position: 0 0, 34px 22px;
  opacity: 0.28;
  pointer-events: none;
}

/* Konten footer saja yang dibatasi, header/body tidak disentuh */
.pkp_footer_content {
  position: relative;
  z-index: 2;
  width: min(960px, calc(100% - 36px)) !important;
  margin: 0 auto !important;
  padding: 0 !important;
}

.sakinah-footer-content {
  display: grid;
  grid-template-columns: 1.35fr 0.9fr;
  gap: 28px;
  align-items: start;
}

.sakinah-footer-logo {
  display: block;
  width: 165px !important;
  max-width: 100%;
  height: auto;
  margin: 0 0 9px 0 !important;
}

.sakinah-footer-content h3 {
  margin: 0 0 7px 0 !important;
  color: #e7c85a;
  font-size: 14px !important;
  font-weight: 800;
  line-height: 1.35;
}

.sakinah-footer-content p {
  margin: 0 0 6px 0 !important;
  color: rgba(248, 243, 230, 0.9);
  font-size: 11.5px !important;
  line-height: 1.55 !important;
}

.sakinah-footer-content strong {
  color: #ffffff;
  font-weight: 800;
}

.sakinah-footer-content a {
  color: #e7c85a !important;
  font-weight: 700;
  text-decoration: none !important;
}

.sakinah-footer-content a:hover {
  color: #ffffff !important;
  text-decoration: underline !important;
  text-underline-offset: 4px;
}

/* Lisensi */
.sakinah-footer-license {
  margin-top: 9px !important;
  padding-top: 9px !important;
  border-top: 1px solid rgba(231, 200, 90, 0.22);
}

.sakinah-footer-license img {
  display: block;
  width: 64px !important;
  height: auto;
  margin: 0 0 6px 0 !important;
  border-radius: 3px;
}

.sakinah-footer-license p {
  margin-bottom: 0 !important;
  font-size: 11px !important;
}

/* Maps */
.sakinah-footer-location h3 {
  font-size: 14px !important;
}

.sakinah-footer-map {
  width: 100%;
  overflow: hidden;
  border-radius: 10px;
  border: 1px solid rgba(231, 200, 90, 0.28);
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.22);
  background: rgba(255,255,255,0.08);
}

.sakinah-footer-map iframe {
  display: block;
  width: 100% !important;
  height: 130px !important;
  border: 0 !important;
}

/* OJS/PKP bawaan */
.pkp_brand_footer {
  position: relative;
  z-index: 2;
  width: min(960px, calc(100% - 36px)) !important;
  margin: 10px auto 0 !important;
  padding: 8px 0 0 !important;
  border-top: 1px solid rgba(231, 200, 90, 0.16);
  display: flex;
  justify-content: flex-end;
}

.pkp_brand_footer a {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
}

.pkp_brand_footer a::before {
  display: none !important;
  content: none !important;
}

.pkp_brand_footer img {
  display: block;
  width: auto !important;
  max-width: 76px !important;
  height: auto !important;
  opacity: 0.82;
  filter:
    brightness(0)
    invert(1)
    sepia(10%)
    saturate(220%)
    hue-rotate(185deg)
    brightness(1.05);
  transition: all 0.25s ease;
}

.pkp_brand_footer a:hover img {
  opacity: 1;
  transform: translateY(-2px);
}

/* Mobile */
@media (max-width: 768px) {
  .pkp_structure_footer {
    padding: 20px 0 16px !important;
  }

  .sakinah-footer-content {
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .sakinah-footer-logo {
    width: 155px !important;
  }

  .sakinah-footer-map iframe {
    height: 160px !important;
  }

  .pkp_brand_footer {
    justify-content: flex-start;
  }

  .pkp_brand_footer img {
    max-width: 72px !important;
  }
}

/* =======================================================
   SAKINAH FOOTER - ALIGN WITH HEADER WIDTH
   ======================================================= */

/* Lebarkan area isi footer agar sejajar dengan header */
.pkp_footer_content,
.pkp_brand_footer {
  width: min(1150px, calc(100% - 40px)) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Atur ulang komposisi 2 kolom agar tidak terlalu menumpuk di tengah */
.sakinah-footer-content {
  grid-template-columns: 1.15fr 0.85fr !important;
  gap: 56px !important;
  align-items: start !important;
}

/* Kolom lokasi tetap di kanan */
.sakinah-footer-location {
  justify-self: end;
  width: 100%;
  max-width: 420px;
}

/* Map jangan terlalu kecil */
.sakinah-footer-map iframe {
  height: 135px !important;
}

/* OJS/PKP tetap rata kanan mengikuti lebar footer */
.pkp_brand_footer {
  justify-content: flex-end !important;
}

/* Responsive */
@media (max-width: 768px) {
  .pkp_footer_content,
  .pkp_brand_footer {
    width: min(100%, calc(100% - 28px)) !important;
  }

  .sakinah-footer-content {
    grid-template-columns: 1fr !important;
    gap: 18px !important;
  }

  .sakinah-footer-location {
    justify-self: stretch;
    max-width: none;
  }

  .pkp_brand_footer {
    justify-content: flex-start !important;
  }
}

/* =======================================================
   SAKINAH MOBILE JOURNAL INFO CARD
   Membuat card homepage rapi seperti layout Jurnal Nalar
   ======================================================= */

@media (max-width: 768px) {

  /* Card informasi jurnal di additional content */
  .page_index_journal .additional_content section.additional_content > div {
    display: block !important;
    max-width: 92% !important;
    margin: 18px auto 24px !important;
    padding: 22px 18px !important;
    border-radius: 16px !important;
    background: linear-gradient(135deg, #ffffff 0%, #eef5ff 48%, #d8e8fb 100%) !important;
    box-shadow: 0 10px 26px rgba(16, 39, 77, 0.16) !important;
    border: 1px solid rgba(22, 50, 100, 0.12) !important;
    text-align: center !important;
  }

  /* Wrapper cover */
  .page_index_journal .additional_content section.additional_content > div > div:first-child {
    margin: 0 auto 18px !important;
    flex-shrink: 1 !important;
    text-align: center !important;
  }

  /* Cover jurnal */
  .page_index_journal .additional_content section.additional_content > div > div:first-child img {
    width: 50% !important;
    max-width: 200px !important;
    height: auto !important;
    margin: 0 auto !important;
    display: block !important;
    border-radius: 10px !important;
    box-shadow: 0 8px 18px rgba(16, 39, 77, 0.18) !important;
  }

  /* Area teks kanan di desktop menjadi normal di mobile */
  .page_index_journal .additional_content section.additional_content > div > div:nth-child(2) {
    max-height: none !important;
    overflow: visible !important;
    text-align: center !important;
    font-size: 13px !important;
    line-height: 1.65 !important;
    color: #38465a !important;
  }

  /* Judul jurnal */
  .page_index_journal .additional_content section.additional_content h1 {
    margin: 0 0 14px !important;
    color: #173565 !important;
    font-size: 16px !important;
    line-height: 1.35 !important;
    font-weight: 800 !important;
    text-align: center !important;
  }

  /* Metadata */
  .page_index_journal .additional_content section.additional_content p {
    margin: 6px 0 !important;
    color: #3f4a5a !important;
    font-size: 13px !important;
    line-height: 1.55 !important;
    text-align: center !important;
  }

  .page_index_journal .additional_content section.additional_content p strong {
    display: inline-block !important;
    color: #333333 !important;
    font-weight: 800 !important;
  }

  /* Link kepala redaksi */
  .page_index_journal .additional_content section.additional_content a {
    color: #006b9a !important;
    font-weight: 600 !important;
  }

  /* Tombol unggah naskah */
  .page_index_journal .additional_content section.additional_content .btn-submit {
    display: inline-block !important;
    margin-top: 10px !important;
    padding: 10px 18px !important;
    border-radius: 7px !important;
    background: linear-gradient(135deg, #d4af37 0%, #e6c45a 48%, #c99510 100%) !important;
    color: #173565 !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    box-shadow: 0 8px 18px rgba(16, 39, 77, 0.18) !important;
    text-decoration: none !important;
  }

  .page_index_journal .additional_content section.additional_content .btn-submit:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 24px rgba(16, 39, 77, 0.22) !important;
  }

  /* Narasi di bawah card */
  .page_index_journal > .additional_content > p {
    max-width: 92% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    font-size: 14px !important;
    line-height: 1.75 !important;
    text-align: justify !important;
  }
}

/* =======================================================
   FIX MOBILE SIDEBAR TITLE ICON - SAKINAH
   ======================================================= */

@media (max-width: 768px) {

  .sakinah-sidebar-title {
    min-height: 42px !important;
    padding: 0 14px 0 48px !important;
    margin: -2px -2px 14px -2px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    overflow: visible !important;
    white-space: normal !important;
    word-break: normal !important;
    color: #143264 !important;
    font-size: 12px !important;
    line-height: 1.25 !important;
    letter-spacing: 1px !important;
    text-align: left !important;
  }

  .sakinah-sidebar-title::before {
    left: 14px !important;
    top: 50% !important;
    width: 24px !important;
    height: 24px !important;
    min-width: 24px !important;
    transform: translateY(-50%) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    font-size: 13px !important;
    line-height: 1 !important;
  }

  .sakinah-template-card .sakinah-sidebar-title,
  .sakinah-tools-card .sakinah-sidebar-title,
  .sakinah-stat-card .sakinah-sidebar-title {
    padding-left: 50px !important;
  }
}

/* =======================================================
   FIX ICON MUNCUL DI LOGO TOOLS
   karena gambar masih dibungkus .sakinah-sidebar-title
   ======================================================= */

.sakinah-tools-card .sakinah-sidebar-title:not(:first-child) {
  min-height: auto !important;
  display: block !important;
  padding: 0 !important;
  margin: 10px 0 0 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  letter-spacing: 0 !important;
}

.sakinah-tools-card .sakinah-sidebar-title:not(:first-child)::before {
  display: none !important;
  content: none !important;
}

.sakinah-tools-card .sakinah-sidebar-title:not(:first-child) img {
  display: block !important;
  width: 100% !important;
  max-width: 300px !important;
  height: auto !important;
  margin: 8px auto !important;
  padding: 8px 12px !important;
  background: #ffffff !important;
  border-radius: 13px !important;
  box-shadow: 0 6px 16px rgba(16, 39, 77, 0.10) !important;
  transition: all 0.28s ease !important;
}

.sakinah-tools-card .sakinah-sidebar-title:not(:first-child) a:hover img {
  transform: translateY(-4px) scale(1.025);
  box-shadow: 0 14px 28px rgba(16, 39, 77, 0.18) !important;
}

/* =======================================================
   HIDE BODY SEPARATOR LINES - SAKINAH
   ======================================================= */

/* Hilangkan garis vertikal antara main content dan sidebar */
.pkp_structure_content,
.pkp_structure_main,
.pkp_structure_sidebar {
  border-left: none !important;
  border-right: none !important;
}

/* Jika theme membuat garis lewat pseudo element */
.pkp_structure_content::before,
.pkp_structure_content::after,
.pkp_structure_main::before,
.pkp_structure_main::after,
.pkp_structure_sidebar::before,
.pkp_structure_sidebar::after {
  display: none !important;
  content: none !important;
}

/* Hilangkan garis horizontal tipis di atas body jika masih muncul */
.pkp_structure_content {
  border-top: none !important;
}

/* Hilangkan separator bawaan tambahan di area konten */
.page_index_journal,
.page_index_journal .additional_content,
.pkp_page_index .pkp_structure_main {
  border-top: none !important;
  border-bottom: none !important;
}


/* =======================================================
   SAKINAH BODY + SIDEBAR CARD - STABLE DESKTOP VERSION
   Pakai ini untuk membungkus main + sidebar dalam satu card
   ======================================================= */

@media (min-width: 901px) {

  /* Card besar pembungkus main + sidebar */
  .pkp_structure_content.has_sidebar {
    width: min(1150px, calc(100% - 42px)) !important;
    max-width: none !important;
    margin: 34px auto 40px !important;
    padding: 28px 28px 30px !important;

    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 300px !important;
    column-gap: 30px !important;
    align-items: start !important;

    background: rgba(255, 255, 255, 0.72) !important;
    border: 1px solid rgba(22, 50, 100, 0.09) !important;
    border-radius: 22px !important;
    box-shadow: 0 18px 42px rgba(16, 39, 77, 0.12) !important;
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
    box-sizing: border-box !important;
    overflow: visible !important;
  }

  /* Reset bawaan OJS agar main/sidebar ikut grid */
  .pkp_structure_content.has_sidebar .pkp_structure_main,
  .pkp_structure_content.has_sidebar .pkp_structure_sidebar {
    float: none !important;
    clear: none !important;
    position: static !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 !important;
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
  }

  /* Main content */
  .pkp_structure_content.has_sidebar .pkp_structure_main {
    grid-column: 1 !important;
    padding: 0 !important;
  }

  /* Sidebar */
  .pkp_structure_content.has_sidebar .pkp_structure_sidebar {
    grid-column: 2 !important;
    padding: 0 !important;
  }

  /* Block sidebar jangan menambah jarak berlebihan */
  .pkp_structure_content.has_sidebar .pkp_structure_sidebar .pkp_block {
    margin-bottom: 14px !important;
  }

  /* Card sidebar tetap mengikuti lebar kolom */
  .pkp_structure_content.has_sidebar .sakinah-sidebar-card {
    width: 100% !important;
    box-sizing: border-box !important;
  }

  /* Konten homepage jangan terlalu mepet */
  .pkp_structure_content.has_sidebar .page_index_journal {
    padding: 0 !important;
  }

  /* Card info jurnal tetap center di kolom main */
  .pkp_structure_content.has_sidebar .page_index_journal .additional_content section.additional_content > div {
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  /* Hilangkan separator bawaan */
  .pkp_structure_content.has_sidebar::before,
  .pkp_structure_content.has_sidebar::after,
  .pkp_structure_main::before,
  .pkp_structure_main::after,
  .pkp_structure_sidebar::before,
  .pkp_structure_sidebar::after {
    display: none !important;
    content: none !important;
  }
}

/* =======================================================
   MOBILE: Jangan pakai card wrapper besar
   Biar tetap natural dan rapi vertikal
   ======================================================= */

@media (max-width: 900px) {
  .pkp_structure_content.has_sidebar {
    display: block !important;
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 12px 26px !important;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  .pkp_structure_content.has_sidebar .pkp_structure_main,
  .pkp_structure_content.has_sidebar .pkp_structure_sidebar {
    width: 100% !important;
    float: none !important;
    clear: both !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
  }
}


/* =======================================================
   SAKINAH BREADCRUMB - ELEGANT BLUE GOLD STYLE
   ======================================================= */

/* Wrapper breadcrumb */
.cmp_breadcrumbs {
  margin: 0 0 24px 0 !important;
  padding: 0 !important;
  border: none !important;
}

/* List breadcrumb */
.cmp_breadcrumbs ol,
.cmp_breadcrumbs ul {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 0 !important;
  padding: 10px 14px !important;
  list-style: none !important;
  background: rgba(255, 255, 255, 0.76) !important;
  border: 1px solid rgba(22, 50, 100, 0.10) !important;
  border-radius: 14px !important;
  box-shadow: 0 10px 24px rgba(16, 39, 77, 0.08) !important;
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
}

/* Item breadcrumb */
.cmp_breadcrumbs li {
  display: inline-flex !important;
  align-items: center !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #6b7280 !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
}

/* Link breadcrumb */
.cmp_breadcrumbs a {
  display: inline-flex !important;
  align-items: center !important;
  padding: 6px 10px !important;
  color: #173565 !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  line-height: 1.4 !important;
  text-decoration: none !important;
  border-radius: 10px !important;
  transition: all 0.24s ease;
}

/* Hover link */
.cmp_breadcrumbs a:hover {
  color: #0d2343 !important;
  background: linear-gradient(135deg, rgba(212, 175, 55, 0.22), rgba(255, 255, 255, 0.70)) !important;
  transform: translateY(-1px);
}

/* Separator bawaan */
.cmp_breadcrumbs .separator {
  color: #d4af37 !important;
  font-weight: 800 !important;
  opacity: 1 !important;
  margin: 0 2px !important;
}

/* Jika separator berupa slash text biasa */
.cmp_breadcrumbs li:not(:last-child)::after {
  content: "›";
  margin-left: 8px;
  color: #d4af37;
  font-size: 18px;
  font-weight: 900;
  line-height: 1;
}

/* Hindari dobel separator jika OJS sudah punya .separator */
.cmp_breadcrumbs li .separator {
  display: none !important;
}

/* Item terakhir/current */
.cmp_breadcrumbs li:last-child {
  padding: 6px 10px !important;
  color: #6f7785 !important;
  background: rgba(255, 255, 255, 0.48) !important;
  border-radius: 10px !important;
  font-weight: 700 !important;
}

/* Mobile */
@media (max-width: 768px) {
  .cmp_breadcrumbs {
    margin-bottom: 18px !important;
  }

  .cmp_breadcrumbs ol,
  .cmp_breadcrumbs ul {
    padding: 9px 10px !important;
    gap: 5px !important;
    border-radius: 12px !important;
  }

  .cmp_breadcrumbs a,
  .cmp_breadcrumbs li,
  .cmp_breadcrumbs li:last-child {
    font-size: 12px !important;
  }

  .cmp_breadcrumbs a,
  .cmp_breadcrumbs li:last-child {
    padding: 5px 8px !important;
  }

  .cmp_breadcrumbs li:not(:last-child)::after {
    margin-left: 5px;
    font-size: 16px;
  }
}


/* =======================================================
   SAKINAH BODY TEXT JUSTIFY
   ======================================================= */

/* Paragraf utama di area body */
.pkp_structure_main p,
.page_index_journal p,
.page_about p,
.page_static p,
.obj_issue_toc .description,
.obj_galley_link + p {
  text-align: justify !important;
  text-justify: inter-word;
}

/* Khusus narasi homepage */
.page_index_journal > .additional_content > p,
.page_index_journal .additional_content > p {
  text-align: justify !important;
  text-justify: inter-word;
}

/* Jangan justify area yang memang harus center/khusus */
.pkp_structure_main .cmp_breadcrumbs *,
.pkp_structure_main .btn-submit,
.pkp_structure_main .pkp_screen_reader,
.pkp_structure_main .sakinah-footer-content p,
.pkp_structure_main .sakinah-sidebar-card p,
.page_index_journal section.additional_content p {
  text-align: initial !important;
}

/* Mobile: justify tetap aktif untuk narasi, tapi jangan terlalu memaksa elemen pendek */
@media (max-width: 768px) {
  .pkp_structure_main p,
  .page_index_journal > .additional_content > p,
  .page_index_journal .additional_content > p {
    text-align: justify !important;
    line-height: 1.75 !important;
  }

  .page_index_journal section.additional_content p {
    text-align: center !important;
  }
}

/* =======================================================
   AICIEF / PROCEEDINGS UNZAH
   FINAL OVERRIDE: BACKGROUND HEADER + FOOTER ONLY
   Tidak mengubah poster, navigasi, Search, atau Register/Login.
   ======================================================= */

:root {
  --aicief-teal-950: #022c2a;
  --aicief-teal-900: #043a36;
  --aicief-teal-800: #075047;
  --aicief-copper: #c88a3d;
  --aicief-copper-light: #dda85d;
  --aicief-ivory: #fbf8f1;
}

/* HEADER BACKGROUND ONLY */
.pkp_structure_head {
  position: relative !important;
  isolation: isolate;
  background: linear-gradient(
    135deg,
    var(--aicief-teal-950) 0%,
    var(--aicief-teal-900) 54%,
    var(--aicief-teal-800) 100%
  ) !important;
}

.pkp_structure_head::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  pointer-events: none !important;
  background-image:
    linear-gradient(
      180deg,
      rgba(2,39,37,.44) 0%,
      rgba(3,52,48,.50) 55%,
      rgba(2,38,36,.60) 100%
    ),
    url("https://proceeding.unzah.ac.id/public/site/images/admin/header-background.png") !important;
  background-repeat: no-repeat, no-repeat !important;
  background-position: center center, 45% 50% !important;
  background-size: 100% 100%, 110% auto !important;
  opacity: .50 !important;
  filter: saturate(.80) contrast(.94) brightness(.82);
  box-shadow:
    inset 0 -42px 60px rgba(1,30,28,.24),
    inset 0 24px 42px rgba(1,30,28,.16) !important;
  will-change: background-position, background-size, opacity, filter;
  animation: aiciefHeaderBackgroundDrift 16s ease-in-out infinite alternate !important;
}

.pkp_structure_head::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  pointer-events: none !important;
  background:
    radial-gradient(
      circle at 14% 18%,
      rgba(221,168,93,.18) 0%,
      rgba(221,168,93,.06) 20%,
      transparent 40%
    ),
    linear-gradient(
      110deg,
      transparent 0%,
      transparent 35%,
      rgba(255,255,255,.025) 43%,
      rgba(221,168,93,.14) 49%,
      rgba(255,255,255,.04) 54%,
      transparent 63%,
      transparent 100%
    ) !important;
  background-repeat: no-repeat, no-repeat !important;
  background-size: 100% 100%, 230% 100% !important;
  background-position: center center, 135% 0 !important;
  opacity: .52 !important;
  will-change: background-position, opacity;
  animation: aiciefHeaderCopperSweep 11s ease-in-out infinite !important;
}

@keyframes aiciefHeaderBackgroundDrift {
  0% {
    background-position: center center, 43% 50%;
    background-size: 100% 100%, 108% auto;
    opacity: .46;
    filter: saturate(.76) contrast(.93) brightness(.79);
  }
  50% {
    background-position: center center, 50% 49%;
    background-size: 100% 100%, 112% auto;
    opacity: .53;
    filter: saturate(.84) contrast(.96) brightness(.86);
  }
  100% {
    background-position: center center, 57% 51%;
    background-size: 100% 100%, 109% auto;
    opacity: .48;
    filter: saturate(.80) contrast(.94) brightness(.82);
  }
}

@keyframes aiciefHeaderCopperSweep {
  0%, 18% {
    background-position: center center, 135% 0;
    opacity: .34;
  }
  50% {
    background-position: center center, 45% 0;
    opacity: .62;
  }
  82%, 100% {
    background-position: center center, -35% 0;
    opacity: .34;
  }
}

/* FOOTER BACKGROUND ONLY */
.pkp_structure_footer {
  position: relative !important;
  overflow: hidden !important;
  background:
    radial-gradient(circle at 15% 20%, rgba(221,168,93,.12) 0%, transparent 30%),
    radial-gradient(circle at 88% 78%, rgba(200,138,61,.09) 0%, transparent 34%),
    linear-gradient(135deg, #022b29 0%, #043a36 54%, #022f2d 100%) !important;
  border-top: 3px solid var(--aicief-copper) !important;
  color: var(--aicief-ivory) !important;
  box-shadow: 0 -8px 24px rgba(2,39,37,.18) !important;
}

.pkp_structure_footer::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  pointer-events: none !important;
  background-image:
    linear-gradient(
      180deg,
      rgba(2,43,41,.64),
      rgba(2,42,40,.78)
    ),
    url("https://proceeding.unzah.ac.id/public/site/images/admin/header-background.png") !important;
  background-repeat: no-repeat, no-repeat !important;
  background-position: center center, center center !important;
  background-size: 100% 100%, cover !important;
  opacity: .24 !important;
  filter: saturate(.68) brightness(.66) contrast(.92);
}

.pkp_structure_footer::after {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: auto !important;
  z-index: 1 !important;
  height: 1px !important;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(221,168,93,.96),
    transparent
  ) !important;
}

.pkp_footer_content,
.pkp_brand_footer {
  position: relative !important;
  z-index: 2 !important;
}

.sakinah-footer-content h3,
.sakinah-footer-content a {
  color: var(--aicief-copper-light) !important;
}

.sakinah-footer-content p {
  color: rgba(251,248,241,.90) !important;
}

.sakinah-footer-content strong {
  color: #fff !important;
}

.sakinah-footer-license {
  border-top-color: rgba(221,168,93,.22) !important;
}

.sakinah-footer-map {
  border-color: rgba(221,168,93,.30) !important;
  background: rgba(255,255,255,.06) !important;
}

@media (max-width: 768px) {
  .pkp_structure_head::before {
    background-position: center center, center center !important;
    background-size: 100% 100%, auto 112% !important;
    opacity: .44 !important;
    animation-duration: 20s !important;
  }

  .pkp_structure_head::after {
    opacity: .42 !important;
    animation-duration: 14s !important;
  }

  .pkp_structure_footer::before {
    opacity: .20 !important;
    background-size: 100% 100%, auto 115% !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .pkp_structure_head::before,
  .pkp_structure_head::after {
    animation: none !important;
  }
}

/* =======================================================
   AICIEF FINAL V2
   1. Register/Login putih dan lebih tebal
   2. Animasi "knowledge constellation" diadaptasi dari portal
   3. Tidak mengubah ukuran/posisi poster atau navigasi
   ======================================================= */

/* USER NAVIGATION: warna saja, tanpa mengubah posisi/layout */
#navigationUserWrapper a,
#navigationUserWrapper a:visited,
#navigationUser.pkp_navigation_user > li > a,
#navigationUser.pkp_navigation_user > li > a:visited {
  color: rgba(255, 255, 255, 0.98) !important;
  font-weight: 700 !important;
  text-shadow: 0 2px 5px rgba(0, 0, 0, 0.52) !important;
  transition:
    color 0.22s ease,
    text-shadow 0.22s ease,
    opacity 0.22s ease !important;
}

#navigationUserWrapper a:hover,
#navigationUserWrapper a:focus,
#navigationUser.pkp_navigation_user > li > a:hover,
#navigationUser.pkp_navigation_user > li > a:focus {
  color: #efc27f !important;
  text-shadow:
    0 2px 6px rgba(0, 0, 0, 0.48),
    0 0 12px rgba(221, 168, 93, 0.24) !important;
}

/*
 * Knowledge constellation dibuat hanya melalui pseudo-element,
 * sehingga tidak membutuhkan perubahan HTML/template OJS.
 * Poster dan seluruh menu tetap memakai aturan CSS Sakinah asli.
 */
.pkp_structure_head::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  pointer-events: none !important;

  background-image:
    /* glow utama */
    radial-gradient(
      ellipse at 50% 45%,
      rgba(221, 168, 93, 0.12) 0%,
      rgba(7, 80, 71, 0.06) 34%,
      transparent 66%
    ),

    /* node kiri */
    radial-gradient(
      circle at 4% 18%,
      rgba(255,255,255,0.92) 0 2px,
      rgba(221,168,93,0.82) 2.5px 4px,
      rgba(221,168,93,0.12) 4.5px 10px,
      transparent 11px
    ),
    radial-gradient(
      circle at 8% 72%,
      rgba(255,255,255,0.82) 0 2px,
      rgba(221,168,93,0.72) 2.5px 4px,
      rgba(221,168,93,0.10) 4.5px 9px,
      transparent 10px
    ),
    radial-gradient(
      circle at 18% 90%,
      rgba(255,255,255,0.78) 0 1.5px,
      rgba(221,168,93,0.66) 2px 3.5px,
      transparent 8px
    ),

    /* node kanan */
    radial-gradient(
      circle at 96% 20%,
      rgba(255,255,255,0.92) 0 2px,
      rgba(221,168,93,0.82) 2.5px 4px,
      rgba(221,168,93,0.12) 4.5px 10px,
      transparent 11px
    ),
    radial-gradient(
      circle at 92% 70%,
      rgba(255,255,255,0.84) 0 2px,
      rgba(221,168,93,0.74) 2.5px 4px,
      rgba(221,168,93,0.10) 4.5px 9px,
      transparent 10px
    ),
    radial-gradient(
      circle at 80% 91%,
      rgba(255,255,255,0.76) 0 1.5px,
      rgba(221,168,93,0.64) 2px 3.5px,
      transparent 8px
    ),

    /* garis koneksi samar */
    linear-gradient(
      16deg,
      transparent 0%,
      transparent 10%,
      rgba(221,168,93,0.00) 10.2%,
      rgba(221,168,93,0.15) 10.5%,
      rgba(255,255,255,0.08) 10.7%,
      transparent 11%,
      transparent 100%
    ),
    linear-gradient(
      -14deg,
      transparent 0%,
      transparent 88.8%,
      rgba(255,255,255,0.08) 89.1%,
      rgba(221,168,93,0.15) 89.3%,
      transparent 89.7%,
      transparent 100%
    ),

    /* light sweep */
    linear-gradient(
      112deg,
      transparent 0%,
      transparent 37%,
      rgba(255,255,255,0.025) 43%,
      rgba(221,168,93,0.16) 49%,
      rgba(255,255,255,0.045) 54%,
      transparent 62%,
      transparent 100%
    ) !important;

  background-repeat: no-repeat !important;
  background-size:
    100% 100%,
    100% 100%,
    100% 100%,
    100% 100%,
    100% 100%,
    100% 100%,
    100% 100%,
    100% 100%,
    100% 100%,
    235% 100% !important;

  background-position:
    center center,
    center center,
    center center,
    center center,
    center center,
    center center,
    center center,
    center center,
    center center,
    135% 0 !important;

  opacity: 0.58 !important;
  transform: translate3d(0, 0, 0);
  transform-origin: center center;
  will-change: transform, opacity, background-position;

  animation:
    aiciefKnowledgeFloat 8s ease-in-out infinite,
    aiciefKnowledgePulse 4.8s ease-in-out infinite,
    aiciefKnowledgeSweep 11s ease-in-out infinite !important;
}

@keyframes aiciefKnowledgeFloat {
  0%,
  100% {
    transform: translate3d(0, 0, 0) scale(1);
  }

  50% {
    transform: translate3d(5px, -5px, 0) scale(1.008);
  }
}

@keyframes aiciefKnowledgePulse {
  0%,
  100% {
    opacity: 0.42;
    filter: brightness(0.92);
  }

  50% {
    opacity: 0.68;
    filter: brightness(1.12);
  }
}

@keyframes aiciefKnowledgeSweep {
  0%,
  16% {
    background-position:
      center center,
      center center,
      center center,
      center center,
      center center,
      center center,
      center center,
      center center,
      center center,
      135% 0;
  }

  50% {
    background-position:
      center center,
      center center,
      center center,
      center center,
      center center,
      center center,
      center center,
      center center,
      center center,
      42% 0;
  }

  84%,
  100% {
    background-position:
      center center,
      center center,
      center center,
      center center,
      center center,
      center center,
      center center,
      center center,
      center center,
      -35% 0;
  }
}

@media (max-width: 768px) {
  .pkp_structure_head::after {
    opacity: 0.42 !important;
    animation:
      aiciefKnowledgeFloat 11s ease-in-out infinite,
      aiciefKnowledgePulse 6s ease-in-out infinite,
      aiciefKnowledgeSweep 15s ease-in-out infinite !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .pkp_structure_head::after {
    animation: none !important;
    opacity: 0.44 !important;
  }
}

/* =======================================================
   AICIEF FINAL V3
   NAVIGATION + DROPDOWN THEME FIX
   -------------------------------------------------------
   - Tidak mengubah ukuran/posisi poster header
   - Tidak mengubah posisi menu utama, Search, atau user menu
   - Menghilangkan hover kaca Sakinah
   - Hover cukup mengubah teks menjadi emas
   - Dropdown memakai warna hijau AICIEF
   - Dropdown dinaikkan agar tidak tertimpa area konten
   ======================================================= */

:root {
  --aicief-nav-deep: #032f2c;
  --aicief-nav-deeper: #022724;
  --aicief-nav-mid: #075047;
  --aicief-nav-gold: #e0ad52;
  --aicief-nav-gold-light: #f0c775;
  --aicief-nav-white: #ffffff;
}

/* Stacking order saja, tanpa mengubah tata letak */
.pkp_structure_head {
  z-index: 1000 !important;
  overflow: visible !important;
}

.pkp_structure_content {
  position: relative;
  z-index: 1 !important;
}

.pkp_head_wrapper,
.pkp_site_nav_menu,
.pkp_navigation_primary_row,
.pkp_navigation_primary_wrapper,
.pkp_navigation_primary,
.pkp_navigation_primary > li,
#navigationUserWrapper,
#navigationUser,
#navigationUser > li {
  overflow: visible !important;
}

/* =======================================================
   MENU UTAMA: TANPA GLASS HOVER
   ======================================================= */

@media (min-width: 992px) {

  .pkp_navigation_primary > li > a,
  .pkp_navigation_primary > li > span {
    padding: 6px 12px !important;
    color: var(--aicief-nav-white) !important;
    font-weight: 700 !important;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    transform: none !important;
    text-shadow: 0 2px 5px rgba(0, 0, 0, 0.40) !important;
    transition:
      color 0.22s ease,
      text-shadow 0.22s ease !important;
  }

  .pkp_navigation_primary > li > a:hover,
  .pkp_navigation_primary > li > a:focus,
  .pkp_navigation_primary > li > span:hover,
  .pkp_navigation_primary > li > span:focus {
    padding: 6px 12px !important;
    color: var(--aicief-nav-gold-light) !important;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    transform: none !important;
    text-shadow:
      0 2px 5px rgba(0, 0, 0, 0.42),
      0 0 12px rgba(224, 173, 82, 0.18) !important;
  }

  /* Menu aktif juga dibuat elegan tanpa kotak kaca */
  .pkp_navigation_primary > li.current > a,
  .pkp_navigation_primary > li.current > span,
  .pkp_navigation_primary > li[aria-current="page"] > a {
    color: var(--aicief-nav-gold-light) !important;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
}

/* =======================================================
   DROPDOWN MENU UTAMA
   ======================================================= */

.pkp_navigation_primary .dropdown-menu,
.pkp_navigation_primary > li > ul,
.pkp_navigation_primary li ul {
  z-index: 50000 !important;
  min-width: 245px !important;
  margin-top: 8px !important;
  padding: 9px 0 !important;
  overflow: visible !important;

  background:
    linear-gradient(
      145deg,
      rgba(3, 47, 44, 0.985) 0%,
      rgba(2, 39, 36, 0.985) 100%
    ) !important;

  border: 1px solid rgba(224, 173, 82, 0.48) !important;
  border-radius: 12px !important;
  box-shadow:
    0 18px 38px rgba(0, 24, 22, 0.38),
    inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;

  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Segitiga dropdown mengikuti warna AICIEF */
.pkp_navigation_primary .dropdown-menu::before,
.pkp_navigation_primary > li > ul::before {
  background: var(--aicief-nav-deep) !important;
  border-left: 1px solid rgba(224, 173, 82, 0.48) !important;
  border-top: 1px solid rgba(224, 173, 82, 0.48) !important;
}

/* Teks dropdown */
.pkp_navigation_primary .dropdown-menu a,
.pkp_navigation_primary > li > ul a,
.pkp_navigation_primary li ul a {
  display: block !important;
  margin: 0 !important;
  padding: 10px 18px !important;

  color: rgba(255, 255, 255, 0.96) !important;
  font-weight: 650 !important;
  line-height: 1.4 !important;
  text-decoration: none !important;

  background: transparent !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  transform: none !important;

  transition:
    color 0.20s ease,
    padding-left 0.20s ease !important;
}

/* Hover dropdown: hanya teks emas, tanpa kaca */
.pkp_navigation_primary .dropdown-menu a:hover,
.pkp_navigation_primary .dropdown-menu a:focus,
.pkp_navigation_primary > li > ul a:hover,
.pkp_navigation_primary > li > ul a:focus,
.pkp_navigation_primary li ul a:hover,
.pkp_navigation_primary li ul a:focus {
  padding: 10px 18px !important;
  color: var(--aicief-nav-gold-light) !important;

  background: transparent !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  transform: none !important;

  text-shadow:
    0 2px 5px rgba(0, 0, 0, 0.38),
    0 0 10px rgba(224, 173, 82, 0.16) !important;
}

/* Separator halus antaritem */
.pkp_navigation_primary .dropdown-menu li + li,
.pkp_navigation_primary > li > ul li + li,
.pkp_navigation_primary li ul li + li {
  border-top: 1px solid rgba(224, 173, 82, 0.12) !important;
}

/* =======================================================
   USER NAVIGATION + USER DROPDOWN
   ======================================================= */

/* Hanya warna dan bobot, posisi tetap mengikuti CSS yang sudah benar */
#navigationUserWrapper a,
#navigationUserWrapper a:visited,
#navigationUser.pkp_navigation_user > li > a,
#navigationUser.pkp_navigation_user > li > a:visited {
  color: rgba(255, 255, 255, 0.98) !important;
  font-weight: 700 !important;
  background: transparent !important;
  box-shadow: none !important;
  text-shadow: 0 2px 5px rgba(0, 0, 0, 0.50) !important;
}

#navigationUserWrapper > ul > li > a:hover,
#navigationUserWrapper > ul > li > a:focus,
#navigationUser.pkp_navigation_user > li > a:hover,
#navigationUser.pkp_navigation_user > li > a:focus {
  color: var(--aicief-nav-gold-light) !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
  text-shadow:
    0 2px 5px rgba(0, 0, 0, 0.46),
    0 0 12px rgba(224, 173, 82, 0.20) !important;
}

/* Panel dropdown user */
.pkp_navigation_user .dropdown-menu,
#navigationUser li ul {
  z-index: 60000 !important;
  min-width: 190px !important;
  padding: 9px 0 !important;
  overflow: visible !important;

  background:
    linear-gradient(
      145deg,
      rgba(3, 47, 44, 0.99) 0%,
      rgba(2, 39, 36, 0.99) 100%
    ) !important;

  border: 1px solid rgba(224, 173, 82, 0.48) !important;
  border-radius: 12px !important;
  box-shadow:
    0 18px 38px rgba(0, 24, 22, 0.40),
    inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;

  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.pkp_navigation_user .dropdown-menu::before,
#navigationUser li ul::before {
  background: var(--aicief-nav-deep) !important;
  border-left: 1px solid rgba(224, 173, 82, 0.48) !important;
  border-top: 1px solid rgba(224, 173, 82, 0.48) !important;
}

/* Item dropdown user */
.pkp_navigation_user .dropdown-menu a,
#navigationUser li ul a {
  display: block !important;
  margin: 0 !important;
  padding: 11px 18px !important;

  color: rgba(255, 255, 255, 0.96) !important;
  font-weight: 650 !important;
  line-height: 1.35 !important;
  text-decoration: none !important;

  background: transparent !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  transform: none !important;

  transition:
    color 0.20s ease,
    text-shadow 0.20s ease !important;
}

/* Hover dropdown user: teks emas saja */
.pkp_navigation_user .dropdown-menu a:hover,
.pkp_navigation_user .dropdown-menu a:focus,
#navigationUser li ul a:hover,
#navigationUser li ul a:focus {
  padding: 11px 18px !important;
  color: var(--aicief-nav-gold-light) !important;

  background: transparent !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  transform: none !important;

  text-shadow:
    0 2px 5px rgba(0, 0, 0, 0.40),
    0 0 10px rgba(224, 173, 82, 0.18) !important;
}

.pkp_navigation_user .dropdown-menu li + li,
#navigationUser li ul li + li {
  border-top: 1px solid rgba(224, 173, 82, 0.12) !important;
}

/* Mobile panel tetap utuh, tetapi palet disesuaikan */
@media (max-width: 991px) {
  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen {
    background: rgba(3, 47, 44, 0.97) !important;
    border-color: rgba(224, 173, 82, 0.42) !important;
  }

  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen a:hover,
  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen a:focus {
    color: var(--aicief-nav-gold-light) !important;
    background: transparent !important;
    transform: none !important;
    box-shadow: none !important;
  }
}

/* =======================================================
   AICIEF FINAL V4
   PREMIUM INDEXING LOGO PANEL
   -------------------------------------------------------
   Target HTML:
   .page_index_journal .page_about > p + table
   Dibuat khusus agar tidak mengubah tabel OJS lainnya.
   ======================================================= */

:root {
  --aicief-index-deep: #022c29;
  --aicief-index-mid: #06483f;
  --aicief-index-gold: #d9a64c;
  --aicief-index-gold-light: #efc875;
  --aicief-index-ivory: #fbf8f0;
  --aicief-index-ink: #183a34;
}

/* Judul "Indexed by:" */
.page_index_journal .page_about > p:has(+ table),
.page_index_journal .page_about > p:nth-of-type(2) {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  margin: 30px 0 13px !important;
  padding: 0 !important;
  text-align: left !important;
}

.page_index_journal .page_about > p:has(+ table)::after,
.page_index_journal .page_about > p:nth-of-type(2)::after {
  content: "" !important;
  display: block !important;
  flex: 1 1 auto;
  height: 1px;
  background:
    linear-gradient(
      90deg,
      rgba(217, 166, 76, 0.82),
      rgba(217, 166, 76, 0.18),
      transparent
    );
}

.page_index_journal .page_about > p:has(+ table) strong,
.page_index_journal .page_about > p:nth-of-type(2) strong {
  position: relative;
  display: inline-flex !important;
  align-items: center;
  gap: 9px;
  min-height: 34px;
  padding: 7px 15px 7px 38px;
  border: 1px solid rgba(217, 166, 76, 0.74);
  border-radius: 999px;
  background:
    linear-gradient(
      135deg,
      var(--aicief-index-gold-light) 0%,
      var(--aicief-index-gold) 100%
    );
  color: var(--aicief-index-deep) !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  box-shadow:
    0 8px 18px rgba(2, 44, 41, 0.16),
    inset 0 1px 0 rgba(255,255,255,0.48);
}

.page_index_journal .page_about > p:has(+ table) strong::before,
.page_index_journal .page_about > p:nth-of-type(2) strong::before {
  content: "✦";
  position: absolute;
  left: 13px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--aicief-index-deep);
  font-size: 14px;
  line-height: 1;
}

/* Panel utama indexing */
.page_index_journal .page_about > table {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 0 28px !important;
  padding: 19px !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  border: 1px solid rgba(217, 166, 76, 0.62) !important;
  border-radius: 20px !important;
  overflow: hidden !important;

  background:
    radial-gradient(
      circle at 8% 12%,
      rgba(239, 200, 117, 0.16) 0%,
      transparent 26%
    ),
    radial-gradient(
      circle at 92% 88%,
      rgba(217, 166, 76, 0.12) 0%,
      transparent 30%
    ),
    linear-gradient(
      145deg,
      #032f2c 0%,
      #06483f 54%,
      #022925 100%
    ) !important;

  box-shadow:
    0 18px 38px rgba(1, 34, 31, 0.20),
    0 3px 10px rgba(1, 34, 31, 0.12),
    inset 0 1px 0 rgba(255,255,255,0.06) !important;
}

/* Ubah struktur tabel menjadi grid logo */
.page_index_journal .page_about > table > tbody {
  display: block !important;
  width: 100% !important;
}

.page_index_journal .page_about > table > tbody > tr {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 12px !important;
  width: 100% !important;
}

/* Card setiap logo */
.page_index_journal .page_about > table td {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 0 !important;
  min-height: 88px !important;
  margin: 0 !important;
  padding: 14px 11px !important;
  overflow: hidden !important;
  vertical-align: middle !important;

  border: 1px solid rgba(217, 166, 76, 0.36) !important;
  border-radius: 14px !important;
  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,0.985) 0%,
      rgba(251,248,240,0.955) 100%
    ) !important;

  box-shadow:
    0 8px 18px rgba(0, 25, 23, 0.15),
    inset 0 1px 0 rgba(255,255,255,0.95) !important;

  transition:
    transform 0.26s ease,
    border-color 0.26s ease,
    box-shadow 0.26s ease,
    background 0.26s ease !important;
}

/* Garis emas halus pada bagian atas card */
.page_index_journal .page_about > table td::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 18% !important;
  right: 18% !important;
  height: 2px !important;
  border-radius: 0 0 999px 999px;
  background:
    linear-gradient(
      90deg,
      transparent,
      var(--aicief-index-gold-light),
      transparent
    );
  opacity: 0.78;
}

/* Kilau premium saat hover */
.page_index_journal .page_about > table td::after {
  content: "" !important;
  position: absolute !important;
  top: -35% !important;
  bottom: -35% !important;
  left: -55% !important;
  width: 36% !important;
  transform: skewX(-18deg) translateX(-180%);
  background:
    linear-gradient(
      90deg,
      transparent,
      rgba(255,255,255,0.64),
      transparent
    );
  opacity: 0;
  pointer-events: none !important;
  transition:
    transform 0.58s ease,
    opacity 0.25s ease !important;
}

.page_index_journal .page_about > table td:hover {
  transform: translateY(-5px) !important;
  border-color: rgba(239, 200, 117, 0.86) !important;
  background:
    linear-gradient(
      145deg,
      #ffffff 0%,
      #fffaf0 100%
    ) !important;
  box-shadow:
    0 15px 30px rgba(0, 25, 23, 0.23),
    0 0 0 1px rgba(217, 166, 76, 0.08),
    inset 0 1px 0 rgba(255,255,255,1) !important;
}

.page_index_journal .page_about > table td:hover::after {
  opacity: 0.76;
  transform: skewX(-18deg) translateX(540%);
}

/* Logo */
.page_index_journal .page_about > table td img {
  position: relative !important;
  z-index: 2 !important;
  display: block !important;
  width: auto !important;
  height: auto !important;
  max-width: 100% !important;
  max-height: 54px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  object-fit: contain !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;

  filter:
    saturate(0.94)
    contrast(1.02)
    drop-shadow(0 3px 5px rgba(2, 44, 41, 0.10));

  transition:
    transform 0.28s ease,
    filter 0.28s ease !important;
}

.page_index_journal .page_about > table td:hover img {
  transform: scale(1.045);
  filter:
    saturate(1)
    contrast(1.04)
    drop-shadow(0 5px 8px rgba(2, 44, 41, 0.16));
}

/* Tablet */
@media (max-width: 900px) {
  .page_index_journal .page_about > table {
    padding: 16px !important;
    border-radius: 18px !important;
  }

  .page_index_journal .page_about > table > tbody > tr {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  .page_index_journal .page_about > table td {
    min-height: 86px !important;
  }
}

/* Mobile */
@media (max-width: 600px) {
  .page_index_journal .page_about > p:has(+ table),
  .page_index_journal .page_about > p:nth-of-type(2) {
    margin-top: 24px !important;
  }

  .page_index_journal .page_about > table {
    padding: 13px !important;
    border-radius: 16px !important;
  }

  .page_index_journal .page_about > table > tbody > tr {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }

  .page_index_journal .page_about > table td {
    min-height: 80px !important;
    padding: 12px 9px !important;
    border-radius: 12px !important;
  }

  .page_index_journal .page_about > table td img {
    max-height: 48px !important;
  }
}

@media (max-width: 390px) {
  .page_index_journal .page_about > table > tbody > tr {
    grid-template-columns: 1fr !important;
  }

  .page_index_journal .page_about > table td {
    min-height: 76px !important;
  }

  .page_index_journal .page_about > table td img {
    max-width: 150px !important;
  }
}

/* Aksesibilitas: kurangi gerakan jika diminta perangkat */
@media (prefers-reduced-motion: reduce) {
  .page_index_journal .page_about > table td,
  .page_index_journal .page_about > table td::after,
  .page_index_journal .page_about > table td img {
    transition: none !important;
  }

  .page_index_journal .page_about > table td:hover {
    transform: none !important;
  }
}

/* =======================================================
   AICIEF FINAL V5
   SIMPLE INDEXING PANEL
   -------------------------------------------------------
   Label "Indexed by" tetap memakai desain V4.
   Panel logo dibuat lebih sederhana, ringan, dan elegan.
   ======================================================= */

/* Panel utama: putih/ivory, tanpa blok hijau gelap */
.page_index_journal .page_about > table {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 0 26px !important;
  padding: 14px !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  border: 1px solid rgba(217, 166, 76, 0.42) !important;
  border-radius: 16px !important;
  overflow: hidden !important;

  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,0.98) 0%,
      rgba(251,248,240,0.96) 100%
    ) !important;

  box-shadow:
    0 10px 24px rgba(2, 44, 41, 0.10) !important;
}

/* Grid logo tetap rapi */
.page_index_journal .page_about > table > tbody {
  display: block !important;
  width: 100% !important;
}

.page_index_journal .page_about > table > tbody > tr {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 10px !important;
  width: 100% !important;
}

/* Card logo lebih sederhana */
.page_index_journal .page_about > table td {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 0 !important;
  min-height: 76px !important;
  margin: 0 !important;
  padding: 10px !important;
  overflow: hidden !important;
  vertical-align: middle !important;

  border: 1px solid rgba(6, 72, 63, 0.16) !important;
  border-radius: 12px !important;

  background: #ffffff !important;

  box-shadow:
    0 4px 12px rgba(2, 44, 41, 0.07) !important;

  transition:
    transform 0.22s ease,
    border-color 0.22s ease,
    box-shadow 0.22s ease !important;
}

/* Hilangkan garis emas dan efek kilau V4 */
.page_index_journal .page_about > table td::before,
.page_index_journal .page_about > table td::after {
  display: none !important;
  content: none !important;
}

/* Hover ringan */
.page_index_journal .page_about > table td:hover {
  transform: translateY(-3px) !important;
  border-color: rgba(217, 166, 76, 0.66) !important;
  background: #fffdf8 !important;

  box-shadow:
    0 8px 18px rgba(2, 44, 41, 0.12) !important;
}

/* Logo */
.page_index_journal .page_about > table td img {
  position: relative !important;
  z-index: 2 !important;
  display: block !important;
  width: auto !important;
  height: auto !important;
  max-width: 100% !important;
  max-height: 50px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  object-fit: contain !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;

  filter:
    saturate(0.96)
    contrast(1.01);

  transition:
    transform 0.22s ease !important;
}

.page_index_journal .page_about > table td:hover img {
  transform: scale(1.025);
}

/* Tablet */
@media (max-width: 900px) {
  .page_index_journal .page_about > table {
    padding: 12px !important;
  }

  .page_index_journal .page_about > table > tbody > tr {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

/* Mobile */
@media (max-width: 600px) {
  .page_index_journal .page_about > table {
    padding: 10px !important;
    border-radius: 14px !important;
  }

  .page_index_journal .page_about > table > tbody > tr {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }

  .page_index_journal .page_about > table td {
    min-height: 70px !important;
    padding: 9px !important;
    border-radius: 10px !important;
  }

  .page_index_journal .page_about > table td img {
    max-height: 46px !important;
  }
}

@media (max-width: 390px) {
  .page_index_journal .page_about > table > tbody > tr {
    grid-template-columns: 1fr !important;
  }

  .page_index_journal .page_about > table td img {
    max-width: 150px !important;
  }
}

/* =======================================================
   AICIEF FINAL V6: SIDEBAR + ARTICLE CARDS
   ======================================================= */
:root{
  --aicief-deep:#032f2c;
  --aicief-dark:#05453e;
  --aicief-mid:#0a6258;
  --aicief-gold:#d9a64c;
  --aicief-gold-light:#efc875;
  --aicief-ivory:#fbf8f0;
  --aicief-muted:#667873;
}

/* 1. SIDEBAR */
@media (min-width:901px){
  .pkp_structure_content.has_sidebar .pkp_structure_sidebar .sakinah-sidebar-card{
    width:calc(100% - 10px)!important;
    margin-left:10px!important;
    margin-right:0!important;
    box-sizing:border-box!important;
  }
}

.sakinah-sidebar-card{
  border:1px solid rgba(3,72,63,.12)!important;
  background:linear-gradient(145deg,rgba(255,255,255,.99),rgba(251,248,240,.96))!important;
  box-shadow:0 12px 28px rgba(2,44,41,.10),inset 0 1px 0 rgba(255,255,255,.92)!important;
}
.sakinah-sidebar-card:hover{
  transform:translateY(-2px)!important;
  border-color:rgba(217,166,76,.34)!important;
  box-shadow:0 16px 34px rgba(2,44,41,.14),inset 0 1px 0 rgba(255,255,255,.96)!important;
}
.sakinah-sidebar-title{
  color:var(--aicief-gold-light)!important;
  background:linear-gradient(135deg,var(--aicief-deep),var(--aicief-dark) 58%,#073a35)!important;
  border:1px solid rgba(217,166,76,.42)!important;
  box-shadow:0 7px 17px rgba(2,44,41,.18),inset 0 1px 0 rgba(255,255,255,.07)!important;
  text-shadow:0 2px 5px rgba(0,0,0,.26)!important;
}
.sakinah-sidebar-title::before{
  background:linear-gradient(135deg,var(--aicief-gold-light),var(--aicief-gold))!important;
  color:var(--aicief-deep)!important;
  box-shadow:0 4px 10px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.45)!important;
}
.sakinah-info-menu .sakinah-sidebar-menu{border-bottom-color:rgba(3,72,63,.10)!important;}
.sakinah-info-menu .sakinah-sidebar-menu a{
  color:#074d45!important;
  font-weight:750!important;
  text-shadow:none!important;
}
.sakinah-info-menu .sakinah-sidebar-menu a::after{color:var(--aicief-gold)!important;}
.sakinah-info-menu .sakinah-sidebar-menu a::before{
  background:linear-gradient(180deg,var(--aicief-gold-light),var(--aicief-gold))!important;
}
.sakinah-info-menu .sakinah-sidebar-menu a:hover,
.sakinah-info-menu .sakinah-sidebar-menu a:focus{
  color:var(--aicief-deep)!important;
  padding-left:17px!important;
  background:linear-gradient(90deg,rgba(217,166,76,.15),rgba(255,255,255,.78))!important;
  box-shadow:none!important;
  transform:translateX(3px)!important;
}

/* 2. LABEL ARTICLES */
.page_index_journal .current_issue .sections .section{
  position:relative!important;
  padding-top:4px!important;
}
.page_index_journal .current_issue .sections .section::before{
  content:""!important;
  position:absolute!important;
  top:24px!important;
  left:0!important;
  right:0!important;
  height:1px!important;
  z-index:0!important;
  background:linear-gradient(90deg,rgba(217,166,76,.80),rgba(217,166,76,.18),transparent)!important;
}
.page_index_journal .current_issue .sections .section>h3{
  position:relative!important;
  z-index:2!important;
  display:inline-flex!important;
  align-items:center!important;
  width:auto!important;
  min-height:36px!important;
  margin:0 0 18px!important;
  padding:8px 16px 8px 39px!important;
  color:var(--aicief-deep)!important;
  font-size:12px!important;
  font-weight:900!important;
  line-height:1!important;
  letter-spacing:.10em!important;
  text-transform:uppercase!important;
  border:1px solid rgba(217,166,76,.74)!important;
  border-radius:999px!important;
  background:linear-gradient(135deg,var(--aicief-gold-light),var(--aicief-gold))!important;
  box-shadow:0 8px 18px rgba(2,44,41,.15),inset 0 1px 0 rgba(255,255,255,.48)!important;
}
.page_index_journal .current_issue .sections .section>h3::before{
  content:"✦"!important;
  position:absolute!important;
  left:14px!important;
  top:50%!important;
  transform:translateY(-50%)!important;
  color:var(--aicief-deep)!important;
  font-size:14px!important;
}

/* 3. ARTICLE CARDS: tetap list vertikal */
.page_index_journal .current_issue .cmp_article_list.articles{
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:15px!important;
  margin:0!important;
  padding:0!important;
  list-style:none!important;
}
.page_index_journal .current_issue .cmp_article_list.articles>li{
  margin:0!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
}
.page_index_journal .current_issue .obj_article_summary{
  position:relative!important;
  min-height:0!important;
  margin:0!important;
  padding:19px 21px 17px 24px!important;
  overflow:hidden!important;
  border:1px solid rgba(3,72,63,.13)!important;
  border-left:4px solid var(--aicief-gold)!important;
  border-radius:15px!important;
  background:radial-gradient(circle at 96% 12%,rgba(217,166,76,.10),transparent 27%),linear-gradient(145deg,rgba(255,255,255,.99),rgba(251,248,240,.94))!important;
  box-shadow:0 8px 21px rgba(2,44,41,.075),inset 0 1px 0 rgba(255,255,255,.94)!important;
  transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease!important;
}
.page_index_journal .current_issue .obj_article_summary::before{
  content:""!important;
  position:absolute!important;
  top:0!important;
  left:24px!important;
  right:24px!important;
  height:1px!important;
  background:linear-gradient(90deg,transparent,rgba(217,166,76,.60),transparent)!important;
}
.page_index_journal .current_issue .obj_article_summary:hover{
  transform:translateY(-3px)!important;
  border-color:rgba(217,166,76,.45)!important;
  border-left-color:var(--aicief-gold-light)!important;
  box-shadow:0 14px 30px rgba(2,44,41,.13),inset 0 1px 0 rgba(255,255,255,.98)!important;
}
.page_index_journal .current_issue .obj_article_summary .title{
  margin:0 0 9px!important;
  padding:0!important;
  font-size:15px!important;
  line-height:1.48!important;
  font-weight:800!important;
}
.page_index_journal .current_issue .obj_article_summary .title a,
.page_index_journal .current_issue .obj_article_summary .title a:visited{
  color:#075047!important;
  font-weight:800!important;
  text-decoration:none!important;
  text-shadow:none!important;
  transition:color .20s ease,text-shadow .20s ease!important;
}
.page_index_journal .current_issue .obj_article_summary .title a:hover,
.page_index_journal .current_issue .obj_article_summary .title a:focus{
  color:#a36f18!important;
  text-decoration:none!important;
  text-shadow:0 0 10px rgba(217,166,76,.12)!important;
}
.page_index_journal .current_issue .obj_article_summary .meta{
  position:static!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  flex-wrap:wrap!important;
  gap:8px 14px!important;
  margin:0 0 12px!important;
  padding:0!important;
  color:var(--aicief-muted)!important;
  font-size:12.5px!important;
  line-height:1.55!important;
}
.page_index_journal .current_issue .obj_article_summary .authors{
  color:#526762!important;
  font-weight:600!important;
}
.page_index_journal .current_issue .obj_article_summary .pages{
  position:static!important;
  display:inline-flex!important;
  align-items:center!important;
  min-height:25px!important;
  margin:0!important;
  padding:4px 10px!important;
  color:#7a571a!important;
  font-size:11px!important;
  font-weight:800!important;
  line-height:1!important;
  border:1px solid rgba(217,166,76,.34)!important;
  border-radius:999px!important;
  background:rgba(217,166,76,.10)!important;
}
.page_index_journal .current_issue .obj_article_summary .galleys_links{
  display:flex!important;
  align-items:center!important;
  flex-wrap:wrap!important;
  gap:8px!important;
  margin:0!important;
  padding:0!important;
  list-style:none!important;
}
.page_index_journal .current_issue .obj_article_summary .galleys_links>li{
  margin:0!important;
  padding:0!important;
}
.page_index_journal .current_issue .obj_galley_link.pdf{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:7px!important;
  min-height:36px!important;
  margin:0!important;
  padding:8px 15px!important;
  color:var(--aicief-gold-light)!important;
  font-size:12px!important;
  font-weight:850!important;
  line-height:1!important;
  letter-spacing:.04em!important;
  text-decoration:none!important;
  border:1px solid rgba(217,166,76,.62)!important;
  border-radius:9px!important;
  background:linear-gradient(135deg,var(--aicief-deep),var(--aicief-dark))!important;
  box-shadow:0 6px 14px rgba(2,44,41,.16),inset 0 1px 0 rgba(255,255,255,.06)!important;
  transition:transform .22s ease,color .22s ease,background .22s ease,box-shadow .22s ease!important;
}
.page_index_journal .current_issue .obj_galley_link.pdf:hover,
.page_index_journal .current_issue .obj_galley_link.pdf:focus{
  color:var(--aicief-deep)!important;
  border-color:var(--aicief-gold-light)!important;
  background:linear-gradient(135deg,var(--aicief-gold-light),var(--aicief-gold))!important;
  transform:translateY(-2px)!important;
  box-shadow:0 9px 18px rgba(2,44,41,.19),inset 0 1px 0 rgba(255,255,255,.42)!important;
}

/* 4. VIEW ALL ISSUES: hanya tampilan. Teks dan href tetap. */
.page_index_journal .current_issue>.read_more{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:39px!important;
  margin-top:20px!important;
  padding:9px 17px!important;
  color:var(--aicief-deep)!important;
  font-size:12px!important;
  font-weight:850!important;
  text-decoration:none!important;
  border:1px solid rgba(217,166,76,.68)!important;
  border-radius:999px!important;
  background:linear-gradient(135deg,var(--aicief-gold-light),var(--aicief-gold))!important;
  box-shadow:0 7px 16px rgba(2,44,41,.13),inset 0 1px 0 rgba(255,255,255,.42)!important;
  transition:transform .22s ease,box-shadow .22s ease!important;
}
.page_index_journal .current_issue>.read_more:hover,
.page_index_journal .current_issue>.read_more:focus{
  transform:translateY(-2px)!important;
  box-shadow:0 10px 20px rgba(2,44,41,.18),inset 0 1px 0 rgba(255,255,255,.48)!important;
}

@media (max-width:768px){
  .page_index_journal .current_issue .obj_article_summary{
    padding:17px 16px 15px 18px!important;
    border-radius:13px!important;
  }
  .page_index_journal .current_issue .obj_article_summary .title{
    font-size:13.5px!important;
    line-height:1.48!important;
  }
  .page_index_journal .current_issue .obj_article_summary .meta{
    align-items:flex-start!important;
    flex-direction:column!important;
    gap:7px!important;
  }
}

@media (prefers-reduced-motion:reduce){
  .sakinah-sidebar-card,
  .sakinah-info-menu .sakinah-sidebar-menu a,
  .page_index_journal .current_issue .obj_article_summary,
  .page_index_journal .current_issue .obj_galley_link.pdf,
  .page_index_journal .current_issue>.read_more{
    transition:none!important;
  }
}

/* =======================================================
   AICIEF FINAL V7
   ARTICLE DETAIL: TWO-COLUMN CONTENT + STICKY METADATA
   -------------------------------------------------------
   - Sidebar digeser sedikit ke kiri
   - Main article dan entry_details dipaksa menjadi 2 kolom
   - PDF, Published, Issue, Section, Citation, Copyright,
     dan metadata tambahan tetap di kolom kanan
   - Kolom kanan dibuat sticky agar tidak ikut turun sampai
     bagian references
   - Garis pembatas diganti panel premium teal-copper
   ======================================================= */

:root {
  --aicief-detail-deep: #032f2c;
  --aicief-detail-dark: #05453e;
  --aicief-detail-mid: #0a6258;
  --aicief-detail-gold: #d9a64c;
  --aicief-detail-gold-light: #efc875;
  --aicief-detail-ivory: #fbf8f0;
  --aicief-detail-white: #ffffff;
  --aicief-detail-text: #2a403b;
  --aicief-detail-muted: #6b7d78;
}

/* =======================================================
   1. SIDEBAR: GESER SEDIKIT KE KIRI
   ======================================================= */

@media (min-width: 901px) {
  .pkp_structure_content.has_sidebar .pkp_structure_sidebar {
    position: relative !important;
    left: -10px !important;
  }

  /* Batalkan pergeseran card ke kanan dari V6 */
  .pkp_structure_content.has_sidebar
  .pkp_structure_sidebar
  .sakinah-sidebar-card {
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}

/* =======================================================
   2. ARTICLE PAGE FOUNDATION
   ======================================================= */

body.pkp_page_article .page_article {
  overflow: visible !important;
}

body.pkp_page_article .obj_article_details {
  overflow: visible !important;
}

/* Judul artikel */
body.pkp_page_article .obj_article_details > .page_title {
  position: relative !important;
  margin: 4px 0 24px !important;
  padding: 20px 22px 19px 26px !important;

  color: var(--aicief-detail-deep) !important;
  font-size: clamp(19px, 2vw, 25px) !important;
  font-weight: 850 !important;
  line-height: 1.35 !important;
  letter-spacing: -0.015em !important;

  border: 1px solid rgba(3, 72, 63, 0.13) !important;
  border-left: 5px solid var(--aicief-detail-gold) !important;
  border-radius: 16px !important;

  background:
    radial-gradient(
      circle at 94% 12%,
      rgba(217, 166, 76, 0.11) 0%,
      transparent 27%
    ),
    linear-gradient(
      145deg,
      rgba(255,255,255,0.99) 0%,
      rgba(251,248,240,0.96) 100%
    ) !important;

  box-shadow:
    0 10px 24px rgba(2,44,41,0.08),
    inset 0 1px 0 rgba(255,255,255,0.96) !important;
}

/* =======================================================
   3. MAIN ENTRY + ENTRY DETAILS MENJADI DUA KOLOM
   ======================================================= */

body.pkp_page_article
.obj_article_details > .row {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(210px, 230px) !important;
  column-gap: 28px !important;
  align-items: start !important;
  width: 100% !important;
  margin: 0 !important;
  overflow: visible !important;
}

body.pkp_page_article
.obj_article_details > .row > .main_entry,
body.pkp_page_article
.obj_article_details > .row > .entry_details {
  float: none !important;
  clear: none !important;
  width: auto !important;
  max-width: none !important;
  min-width: 0 !important;
  margin: 0 !important;
  box-sizing: border-box !important;
}

body.pkp_page_article
.obj_article_details > .row > .main_entry {
  grid-column: 1 !important;
  padding: 0 !important;
  border: 0 !important;
}

/*
 * Semua metadata di kanan:
 * PDF, Published, Issue, Section, Citation, Copyright,
 * dan elemen tambahan OJS yang berada di .entry_details.
 */
body.pkp_page_article
.obj_article_details > .row > .entry_details {
  grid-column: 2 !important;
  align-self: start !important;
  position: sticky !important;
  top: 20px !important;
  z-index: 4 !important;

  padding: 14px !important;
  overflow: visible !important;

  border: 1px solid rgba(217,166,76,0.48) !important;
  border-left: 4px solid var(--aicief-detail-gold) !important;
  border-radius: 16px !important;

  background:
    radial-gradient(
      circle at 100% 0%,
      rgba(217,166,76,0.13) 0%,
      transparent 35%
    ),
    linear-gradient(
      150deg,
      rgba(255,255,255,0.99) 0%,
      rgba(251,248,240,0.97) 100%
    ) !important;

  box-shadow:
    0 14px 30px rgba(2,44,41,0.12),
    inset 0 1px 0 rgba(255,255,255,0.96) !important;
}

/* Heading visual kolom metadata */
body.pkp_page_article
.obj_article_details > .row > .entry_details::before {
  content: "ARTICLE INFORMATION" !important;
  display: flex !important;
  align-items: center !important;
  min-height: 34px !important;
  margin: -2px -2px 12px !important;
  padding: 8px 11px !important;

  color: var(--aicief-detail-gold-light) !important;
  font-size: 10px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  letter-spacing: 0.10em !important;

  border: 1px solid rgba(217,166,76,0.36) !important;
  border-radius: 10px !important;
  background:
    linear-gradient(
      135deg,
      var(--aicief-detail-deep),
      var(--aicief-detail-dark)
    ) !important;

  box-shadow:
    0 6px 14px rgba(2,44,41,0.16),
    inset 0 1px 0 rgba(255,255,255,0.06) !important;
}

/* =======================================================
   4. MAIN ARTICLE CONTENT
   ======================================================= */

body.pkp_page_article
.obj_article_details .main_entry > .item {
  margin: 0 0 22px !important;
  padding: 0 0 20px !important;
  border-bottom: 1px solid rgba(3,72,63,0.10) !important;
}

body.pkp_page_article
.obj_article_details .main_entry > .item:last-child {
  border-bottom: 0 !important;
}

/* Authors */
body.pkp_page_article
.obj_article_details .main_entry .item.authors {
  padding: 17px 18px !important;
  border: 1px solid rgba(3,72,63,0.11) !important;
  border-radius: 13px !important;
  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,0.98),
      rgba(251,248,240,0.88)
    ) !important;
}

body.pkp_page_article
.obj_article_details .main_entry ul.authors {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 13px !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

body.pkp_page_article
.obj_article_details .main_entry ul.authors > li {
  margin: 0 !important;
  padding: 0 0 0 13px !important;
  border-left: 3px solid rgba(217,166,76,0.74) !important;
}

body.pkp_page_article
.obj_article_details .main_entry .authors .name {
  display: block !important;
  color: var(--aicief-detail-deep) !important;
  font-weight: 800 !important;
}

body.pkp_page_article
.obj_article_details .main_entry .authors .affiliation {
  display: block !important;
  margin-top: 3px !important;
  color: var(--aicief-detail-muted) !important;
  font-size: 11px !important;
  line-height: 1.45 !important;
}

/* Label Keywords dan Abstract */
body.pkp_page_article
.obj_article_details .main_entry .item > .label {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 31px !important;
  margin: 0 0 12px !important;
  padding: 7px 13px !important;

  color: var(--aicief-detail-deep) !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;

  border: 1px solid rgba(217,166,76,0.54) !important;
  border-radius: 999px !important;
  background:
    linear-gradient(
      135deg,
      var(--aicief-detail-gold-light),
      var(--aicief-detail-gold)
    ) !important;

  box-shadow:
    0 5px 12px rgba(2,44,41,0.10),
    inset 0 1px 0 rgba(255,255,255,0.42) !important;
}

body.pkp_page_article
.obj_article_details .main_entry .item.keywords .value {
  color: #526762 !important;
  font-size: 12px !important;
  line-height: 1.65 !important;
}

body.pkp_page_article
.obj_article_details .main_entry .item.abstract p {
  margin: 0 !important;
  color: var(--aicief-detail-text) !important;
  font-size: 13px !important;
  line-height: 1.85 !important;
  text-align: justify !important;
  text-justify: inter-word !important;
}

/* References dan item tambahan yang mungkin diaktifkan */
body.pkp_page_article
.obj_article_details .main_entry .item.references,
body.pkp_page_article
.obj_article_details .main_entry .item.reference,
body.pkp_page_article
.obj_article_details .main_entry .item.citations {
  padding: 18px !important;
  border: 1px solid rgba(3,72,63,0.11) !important;
  border-radius: 13px !important;
  background: rgba(255,255,255,0.76) !important;
}

/* =======================================================
   5. ENTRY DETAILS / ARTICLE INFORMATION
   ======================================================= */

body.pkp_page_article
.obj_article_details .entry_details > .item {
  margin: 0 !important;
  padding: 12px 3px !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(3,72,63,0.11) !important;
  background: transparent !important;
}

body.pkp_page_article
.obj_article_details .entry_details > .item:last-child {
  border-bottom: 0 !important;
}

body.pkp_page_article
.obj_article_details .entry_details .sub_item {
  margin: 0 !important;
  padding: 0 !important;
}

body.pkp_page_article
.obj_article_details .entry_details .sub_item + .sub_item {
  margin-top: 12px !important;
  padding-top: 12px !important;
  border-top: 1px dashed rgba(217,166,76,0.36) !important;
}

/* Label metadata */
body.pkp_page_article
.obj_article_details .entry_details .label {
  display: block !important;
  margin: 0 0 7px !important;
  color: #9b6b18 !important;
  font-size: 9.5px !important;
  font-weight: 900 !important;
  line-height: 1.2 !important;
  letter-spacing: 0.09em !important;
  text-transform: uppercase !important;
}

/* Value metadata */
body.pkp_page_article
.obj_article_details .entry_details .value {
  color: var(--aicief-detail-text) !important;
  font-size: 11.5px !important;
  font-weight: 650 !important;
  line-height: 1.55 !important;
}

body.pkp_page_article
.obj_article_details .entry_details .value a,
body.pkp_page_article
.obj_article_details .entry_details .value a:visited {
  color: #075047 !important;
  font-weight: 750 !important;
  text-decoration: none !important;
}

body.pkp_page_article
.obj_article_details .entry_details .value a:hover,
body.pkp_page_article
.obj_article_details .entry_details .value a:focus {
  color: #a36f18 !important;
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
}

/* Tombol PDF penuh di kolom metadata */
body.pkp_page_article
.obj_article_details .entry_details .galleys_links {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

body.pkp_page_article
.obj_article_details .entry_details .galleys_links > li {
  margin: 0 !important;
  padding: 0 !important;
}

body.pkp_page_article
.obj_article_details .entry_details .obj_galley_link.pdf {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 10px 14px !important;

  color: var(--aicief-detail-gold-light) !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  letter-spacing: 0.06em !important;
  text-decoration: none !important;

  border: 1px solid rgba(217,166,76,0.64) !important;
  border-radius: 10px !important;
  background:
    linear-gradient(
      135deg,
      var(--aicief-detail-deep),
      var(--aicief-detail-dark)
    ) !important;

  box-shadow:
    0 7px 16px rgba(2,44,41,0.18),
    inset 0 1px 0 rgba(255,255,255,0.06) !important;

  transition:
    transform 0.22s ease,
    color 0.22s ease,
    background 0.22s ease,
    box-shadow 0.22s ease !important;
}

body.pkp_page_article
.obj_article_details .entry_details .obj_galley_link.pdf:hover,
body.pkp_page_article
.obj_article_details .entry_details .obj_galley_link.pdf:focus {
  color: var(--aicief-detail-deep) !important;
  border-color: var(--aicief-detail-gold-light) !important;
  background:
    linear-gradient(
      135deg,
      var(--aicief-detail-gold-light),
      var(--aicief-detail-gold)
    ) !important;
  transform: translateY(-2px) !important;
  box-shadow:
    0 10px 20px rgba(2,44,41,0.21),
    inset 0 1px 0 rgba(255,255,255,0.42) !important;
}

/* Sitasi/copyright yang diaktifkan nanti otomatis mengikuti panel */
body.pkp_page_article
.obj_article_details .entry_details .citation,
body.pkp_page_article
.obj_article_details .entry_details .how_to_cite,
body.pkp_page_article
.obj_article_details .entry_details .copyright,
body.pkp_page_article
.obj_article_details .entry_details .permissions {
  color: var(--aicief-detail-text) !important;
  font-size: 11px !important;
  line-height: 1.6 !important;
}

body.pkp_page_article
.obj_article_details .entry_details textarea,
body.pkp_page_article
.obj_article_details .entry_details input,
body.pkp_page_article
.obj_article_details .entry_details select {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  border: 1px solid rgba(3,72,63,0.18) !important;
  border-radius: 8px !important;
  background: #fff !important;
  color: var(--aicief-detail-text) !important;
}

/* =======================================================
   6. RESPONSIVE
   ======================================================= */

/* Desktop menengah: kolom metadata dibuat sedikit lebih kecil */
@media (min-width: 901px) and (max-width: 1180px) {
  body.pkp_page_article
  .obj_article_details > .row {
    grid-template-columns: minmax(0, 1fr) minmax(180px, 195px) !important;
    column-gap: 18px !important;
  }

  body.pkp_page_article
  .obj_article_details > .row > .entry_details {
    padding: 11px !important;
  }

  body.pkp_page_article
  .obj_article_details > .row > .entry_details::before {
    font-size: 9px !important;
    letter-spacing: 0.07em !important;
  }
}

/* Mobile/tablet: ditumpuk secara natural */
@media (max-width: 900px) {
  .pkp_structure_content.has_sidebar .pkp_structure_sidebar {
    left: auto !important;
  }

  body.pkp_page_article
  .obj_article_details > .row {
    display: block !important;
  }

  body.pkp_page_article
  .obj_article_details > .row > .main_entry,
  body.pkp_page_article
  .obj_article_details > .row > .entry_details {
    width: 100% !important;
  }

  body.pkp_page_article
  .obj_article_details > .row > .entry_details {
    position: relative !important;
    top: auto !important;
    margin-top: 20px !important;
  }

  body.pkp_page_article
  .obj_article_details .main_entry ul.authors {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 600px) {
  body.pkp_page_article .obj_article_details > .page_title {
    padding: 17px 16px 16px 19px !important;
    border-radius: 13px !important;
    font-size: 17px !important;
  }

  body.pkp_page_article
  .obj_article_details .main_entry .item.authors {
    padding: 14px !important;
  }

  body.pkp_page_article
  .obj_article_details .main_entry .item.abstract p {
    font-size: 12.5px !important;
    line-height: 1.78 !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.pkp_page_article
  .obj_article_details .entry_details .obj_galley_link.pdf {
    transition: none !important;
  }

  body.pkp_page_article
  .obj_article_details .entry_details .obj_galley_link.pdf:hover {
    transform: none !important;
  }
}

/* =======================================================
   AICIEF FINAL V8
   ISSUE PAGE + ARTICLE DETAIL REFINEMENT
   -------------------------------------------------------
   1. Author grid aman untuk jumlah penulis ganjil/banyak
   2. Article information tidak lagi sticky
   3. Card artikel berlaku juga pada halaman issue
   4. Border emas gambar aplikasi pendukung dihilangkan
   5. Breadcrumb diselaraskan dengan tema AICIEF
   6. Outer card indexing dihilangkan
   7. View All Issues dan ikon panah tidak bertumpuk
   ======================================================= */

:root {
  --aicief-v8-deep: #032f2c;
  --aicief-v8-dark: #05453e;
  --aicief-v8-mid: #0a6258;
  --aicief-v8-gold: #d9a64c;
  --aicief-v8-gold-light: #efc875;
  --aicief-v8-ivory: #fbf8f0;
  --aicief-v8-text: #29423c;
  --aicief-v8-muted: #667873;
}

/* =======================================================
   1. AUTHOR GRID
   Dua kolom pada desktop.
   Jika jumlah penulis ganjil, penulis terakhir melebar penuh.
   ======================================================= */

body.pkp_page_article
.obj_article_details .main_entry ul.authors {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 13px 16px !important;
}

body.pkp_page_article
.obj_article_details .main_entry ul.authors > li:last-child:nth-child(odd) {
  grid-column: 1 / -1 !important;
}

/* Penulis terakhir yang melebar tetap nyaman dibaca */
body.pkp_page_article
.obj_article_details .main_entry ul.authors > li:last-child:nth-child(odd) {
  max-width: none !important;
}

/* =======================================================
   2. ARTICLE INFORMATION MENJADI STATIS
   ======================================================= */

body.pkp_page_article
.obj_article_details > .row > .entry_details {
  position: relative !important;
  top: auto !important;
}

/* =======================================================
   3. ARTICLE LIST DI HALAMAN ISSUE
   Struktur page source:
   body.pkp_page_issue .page_issue .obj_issue_toc
   ======================================================= */

/* Label "Articles" pada halaman issue */
body.pkp_page_issue
.page_issue .obj_issue_toc .sections .section {
  position: relative !important;
  padding-top: 4px !important;
}

body.pkp_page_issue
.page_issue .obj_issue_toc .sections .section::before {
  content: "" !important;
  position: absolute !important;
  top: 24px !important;
  left: 0 !important;
  right: 0 !important;
  height: 1px !important;
  z-index: 0 !important;
  background:
    linear-gradient(
      90deg,
      rgba(217,166,76,.80),
      rgba(217,166,76,.18),
      transparent
    ) !important;
}

body.pkp_page_issue
.page_issue .obj_issue_toc .sections .section > h2 {
  position: relative !important;
  z-index: 2 !important;
  display: inline-flex !important;
  align-items: center !important;
  width: auto !important;
  min-height: 36px !important;
  margin: 0 0 18px !important;
  padding: 8px 16px 8px 39px !important;

  color: var(--aicief-v8-deep) !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  letter-spacing: .10em !important;
  text-transform: uppercase !important;

  border: 1px solid rgba(217,166,76,.74) !important;
  border-radius: 999px !important;
  background:
    linear-gradient(
      135deg,
      var(--aicief-v8-gold-light),
      var(--aicief-v8-gold)
    ) !important;

  box-shadow:
    0 8px 18px rgba(2,44,41,.15),
    inset 0 1px 0 rgba(255,255,255,.48) !important;
}

body.pkp_page_issue
.page_issue .obj_issue_toc .sections .section > h2::before {
  content: "✦" !important;
  position: absolute !important;
  left: 14px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  color: var(--aicief-v8-deep) !important;
  font-size: 14px !important;
  line-height: 1 !important;
}

/* List artikel halaman issue */
body.pkp_page_issue
.page_issue .cmp_article_list.articles {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 15px !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

body.pkp_page_issue
.page_issue .cmp_article_list.articles > li {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

body.pkp_page_issue
.page_issue .obj_article_summary {
  position: relative !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 19px 21px 17px 24px !important;
  overflow: hidden !important;

  border: 1px solid rgba(3,72,63,.13) !important;
  border-left: 4px solid var(--aicief-v8-gold) !important;
  border-radius: 15px !important;

  background:
    radial-gradient(
      circle at 96% 12%,
      rgba(217,166,76,.10) 0%,
      transparent 27%
    ),
    linear-gradient(
      145deg,
      rgba(255,255,255,.99) 0%,
      rgba(251,248,240,.94) 100%
    ) !important;

  box-shadow:
    0 8px 21px rgba(2,44,41,.075),
    inset 0 1px 0 rgba(255,255,255,.94) !important;

  transition:
    transform .24s ease,
    border-color .24s ease,
    box-shadow .24s ease !important;
}

body.pkp_page_issue
.page_issue .obj_article_summary::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 24px !important;
  right: 24px !important;
  height: 1px !important;
  background:
    linear-gradient(
      90deg,
      transparent,
      rgba(217,166,76,.60),
      transparent
    ) !important;
}

body.pkp_page_issue
.page_issue .obj_article_summary:hover {
  transform: translateY(-3px) !important;
  border-color: rgba(217,166,76,.45) !important;
  border-left-color: var(--aicief-v8-gold-light) !important;
  box-shadow:
    0 14px 30px rgba(2,44,41,.13),
    inset 0 1px 0 rgba(255,255,255,.98) !important;
}

body.pkp_page_issue
.page_issue .obj_article_summary .title {
  margin: 0 0 9px !important;
  padding: 0 !important;
  font-size: 15px !important;
  line-height: 1.48 !important;
  font-weight: 800 !important;
}

body.pkp_page_issue
.page_issue .obj_article_summary .title a,
body.pkp_page_issue
.page_issue .obj_article_summary .title a:visited {
  color: #075047 !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  transition:
    color .20s ease,
    text-shadow .20s ease !important;
}

body.pkp_page_issue
.page_issue .obj_article_summary .title a:hover,
body.pkp_page_issue
.page_issue .obj_article_summary .title a:focus {
  color: #a36f18 !important;
  text-decoration: none !important;
  text-shadow: 0 0 10px rgba(217,166,76,.12) !important;
}

body.pkp_page_issue
.page_issue .obj_article_summary .meta {
  position: static !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 8px 14px !important;
  margin: 0 0 12px !important;
  padding: 0 !important;
  color: var(--aicief-v8-muted) !important;
  font-size: 12.5px !important;
  line-height: 1.55 !important;
}

body.pkp_page_issue
.page_issue .obj_article_summary .authors {
  color: #526762 !important;
  font-weight: 600 !important;
}

body.pkp_page_issue
.page_issue .obj_article_summary .pages {
  position: static !important;
  display: inline-flex !important;
  align-items: center !important;
  min-height: 25px !important;
  margin: 0 !important;
  padding: 4px 10px !important;

  color: #7a571a !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  line-height: 1 !important;

  border: 1px solid rgba(217,166,76,.34) !important;
  border-radius: 999px !important;
  background: rgba(217,166,76,.10) !important;
}

body.pkp_page_issue
.page_issue .obj_article_summary .galleys_links {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

body.pkp_page_issue
.page_issue .obj_article_summary .galleys_links > li {
  margin: 0 !important;
  padding: 0 !important;
}

body.pkp_page_issue
.page_issue .obj_galley_link.pdf {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  min-height: 36px !important;
  margin: 0 !important;
  padding: 8px 15px !important;

  color: var(--aicief-v8-gold-light) !important;
  font-size: 12px !important;
  font-weight: 850 !important;
  line-height: 1 !important;
  letter-spacing: .04em !important;
  text-decoration: none !important;

  border: 1px solid rgba(217,166,76,.62) !important;
  border-radius: 9px !important;
  background:
    linear-gradient(
      135deg,
      var(--aicief-v8-deep),
      var(--aicief-v8-dark)
    ) !important;

  box-shadow:
    0 6px 14px rgba(2,44,41,.16),
    inset 0 1px 0 rgba(255,255,255,.06) !important;

  transition:
    transform .22s ease,
    color .22s ease,
    background .22s ease,
    box-shadow .22s ease !important;
}

body.pkp_page_issue
.page_issue .obj_galley_link.pdf:hover,
body.pkp_page_issue
.page_issue .obj_galley_link.pdf:focus {
  color: var(--aicief-v8-deep) !important;
  border-color: var(--aicief-v8-gold-light) !important;
  background:
    linear-gradient(
      135deg,
      var(--aicief-v8-gold-light),
      var(--aicief-v8-gold)
    ) !important;
  transform: translateY(-2px) !important;
  box-shadow:
    0 9px 18px rgba(2,44,41,.19),
    inset 0 1px 0 rgba(255,255,255,.42) !important;
}

/* =======================================================
   4. HILANGKAN GARIS/BORDER EMAS PADA APLIKASI PENDUKUNG
   ======================================================= */

.sakinah-tools-card > .sakinah-sidebar-title:not(:first-child) {
  display: block !important;
  margin: 8px 0 0 !important;
  padding: 0 !important;

  color: inherit !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  text-shadow: none !important;
}

.sakinah-tools-card > .sakinah-sidebar-title:not(:first-child)::before,
.sakinah-tools-card > .sakinah-sidebar-title:not(:first-child)::after {
  display: none !important;
  content: none !important;
}

.sakinah-tools-card > .sakinah-sidebar-title:not(:first-child) > a {
  display: block !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.sakinah-tools-card > .sakinah-sidebar-title:not(:first-child) img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;

  border: 0 !important;
  outline: 0 !important;
  border-radius: 8px !important;
  box-shadow: 0 5px 13px rgba(2,44,41,.08) !important;

  background: #fff !important;
}

/* =======================================================
   5. BREADCRUMB AICIEF
   ======================================================= */

.cmp_breadcrumbs {
  border-color: rgba(3,72,63,.13) !important;
  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,.99),
      rgba(251,248,240,.94)
    ) !important;
  box-shadow:
    0 7px 18px rgba(2,44,41,.07) !important;
}

.cmp_breadcrumbs a,
.cmp_breadcrumbs a:visited {
  color: #075047 !important;
  font-weight: 750 !important;
  text-decoration: none !important;
}

.cmp_breadcrumbs a:hover,
.cmp_breadcrumbs a:focus {
  color: #a36f18 !important;
  text-decoration: none !important;
}

.cmp_breadcrumbs .current,
.cmp_breadcrumbs .current span,
.cmp_breadcrumbs [aria-current="page"] {
  color: #526762 !important;
  font-weight: 700 !important;
}

.cmp_breadcrumbs .separator {
  color: var(--aicief-v8-gold) !important;
  font-weight: 900 !important;
}

/* =======================================================
   6. INDEXING: HAPUS OUTER CARD
   Card per-logo tetap dipertahankan dan dipercantik.
   ======================================================= */

.page_index_journal .page_about > table {
  margin: 0 0 26px !important;
  padding: 0 !important;

  border: 0 !important;
  border-radius: 0 !important;
  overflow: visible !important;

  background: transparent !important;
  box-shadow: none !important;
}

.page_index_journal .page_about > table td {
  border: 1px solid rgba(3,72,63,.16) !important;
  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,.99),
      rgba(251,248,240,.94)
    ) !important;
  box-shadow:
    0 7px 17px rgba(2,44,41,.09) !important;
}

.page_index_journal .page_about > table td:hover {
  border-color: rgba(217,166,76,.58) !important;
  box-shadow:
    0 11px 22px rgba(2,44,41,.13) !important;
}

/* =======================================================
   7. VIEW ALL ISSUES: PISAHKAN TEKS DAN PANAH
   ======================================================= */

.page_index_journal .current_issue > .read_more {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 0 !important;

  min-width: 0 !important;
  padding:
    10px 42px
    10px 17px !important;

  white-space: nowrap !important;
  overflow: visible !important;
}

.page_index_journal .current_issue > .read_more::after {
  content: "›" !important;
  position: absolute !important;
  top: 50% !important;
  right: 15px !important;
  left: auto !important;

  display: block !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;

  color: var(--aicief-v8-deep) !important;
  font-size: 22px !important;
  font-weight: 900 !important;
  line-height: 1 !important;

  transform: translateY(-52%) !important;
  transition: right .20s ease !important;
}

.page_index_journal .current_issue > .read_more:hover::after,
.page_index_journal .current_issue > .read_more:focus::after {
  right: 12px !important;
}

/* Hilangkan panah bawaan lain jika memakai pseudo-element before */
.page_index_journal .current_issue > .read_more::before {
  display: none !important;
  content: none !important;
}

/* =======================================================
   RESPONSIVE
   ======================================================= */

@media (max-width: 768px) {
  body.pkp_page_issue
  .page_issue .obj_article_summary {
    padding: 17px 16px 15px 18px !important;
    border-radius: 13px !important;
  }

  body.pkp_page_issue
  .page_issue .obj_article_summary .title {
    font-size: 13.5px !important;
    line-height: 1.48 !important;
  }

  body.pkp_page_issue
  .page_issue .obj_article_summary .meta {
    align-items: flex-start !important;
    flex-direction: column !important;
    gap: 7px !important;
  }

  body.pkp_page_article
  .obj_article_details .main_entry ul.authors {
    grid-template-columns: 1fr !important;
  }

  body.pkp_page_article
  .obj_article_details .main_entry ul.authors > li:last-child:nth-child(odd) {
    grid-column: auto !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.pkp_page_issue .page_issue .obj_article_summary,
  body.pkp_page_issue .page_issue .obj_galley_link.pdf,
  .page_index_journal .current_issue > .read_more::after {
    transition: none !important;
  }

  body.pkp_page_issue .page_issue .obj_article_summary:hover,
  body.pkp_page_issue .page_issue .obj_galley_link.pdf:hover {
    transform: none !important;
  }
}

/* =======================================================
   AICIEF FINAL V9
   SIDEBAR MEDIA + ARCHIVE LINKS + ARTICLE SEPARATOR + AUTH
   -------------------------------------------------------
   1. Semua gambar/sidebar media menyatu dengan card cream
   2. Daftar issue/archive memakai teal-copper premium card
   3. Separator di atas penulis pada detail artikel dihapus
   4. Login dan Register diselaraskan dengan tema AICIEF
   ======================================================= */

:root {
  --aicief-v9-deep: #032f2c;
  --aicief-v9-dark: #05453e;
  --aicief-v9-mid: #0a6258;
  --aicief-v9-gold: #d9a64c;
  --aicief-v9-gold-light: #efc875;
  --aicief-v9-cream: #f8f4e9;
  --aicief-v9-cream-soft: #fcfaf4;
  --aicief-v9-white: #ffffff;
  --aicief-v9-text: #29423c;
  --aicief-v9-muted: #687a75;
  --aicief-v9-line: rgba(3,72,63,.13);
}

/* =======================================================
   1. SIDEBAR MEDIA / IMAGE SYSTEM
   ======================================================= */

/* Area media di semua card sidebar */
.sakinah-template-card > a,
.sakinah-tools-card > .sakinah-sidebar-title:not(:first-child) > a,
.sakinah-stat-card > a:not([href*="histats.com/viewstats"]),
.sakinah-stat-card > img:not([src*="0.gif"]),
.sakinah-stat-card > a[href*="histats.com/viewstats"] + img {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  margin: 8px 0 0 !important;
  padding: 8px !important;
  box-sizing: border-box !important;

  border: 1px solid rgba(3,72,63,.12) !important;
  border-radius: 11px !important;
  background:
    linear-gradient(
      145deg,
      rgba(248,244,233,.98),
      rgba(252,250,244,.98)
    ) !important;

  box-shadow:
    0 5px 14px rgba(2,44,41,.07),
    inset 0 1px 0 rgba(255,255,255,.80) !important;

  overflow: hidden !important;
  text-decoration: none !important;
}

/* Hindari style ganda pada gambar statistik yang langsung menjadi elemen */
.sakinah-stat-card > img:not([src*="0.gif"]) {
  height: auto !important;
}

/* Semua gambar sidebar dibuat menyatu */
.sakinah-template-card img,
.sakinah-tools-card img,
.sakinah-stat-card img:not([src*="0.gif"]) {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  margin: 0 auto !important;
  padding: 0 !important;

  object-fit: contain !important;

  border: 0 !important;
  outline: 0 !important;
  border-radius: 7px !important;

  background: transparent !important;
  box-shadow: none !important;

  filter:
    saturate(.96)
    contrast(1.01)
    brightness(.99);

  transition:
    transform .22s ease,
    filter .22s ease !important;
}

.sakinah-template-card > a:hover img,
.sakinah-tools-card > .sakinah-sidebar-title:not(:first-child) > a:hover img,
.sakinah-stat-card > a:hover img {
  transform: scale(1.018) !important;
  filter:
    saturate(1)
    contrast(1.02)
    brightness(1.01);
}

/* Tool rows tidak lagi dianggap sebagai title bar */
.sakinah-tools-card > .sakinah-sidebar-title:not(:first-child) {
  margin: 8px 0 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.sakinah-tools-card > .sakinah-sidebar-title:not(:first-child)::before,
.sakinah-tools-card > .sakinah-sidebar-title:not(:first-child)::after {
  display: none !important;
  content: none !important;
}

/* Histats hidden counter tetap benar-benar tersembunyi */
.sakinah-stat-card img[src*="0.gif"] {
  display: none !important;
}

/* =======================================================
   2. ARCHIVE / ISSUE LIST LINKS
   ======================================================= */

body.pkp_page_issue.pkp_op_archive
.page_issue_archive > h1 {
  color: var(--aicief-v9-deep) !important;
  font-weight: 850 !important;
  letter-spacing: -.015em !important;
}

body.pkp_page_issue.pkp_op_archive
.issues_archive {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 15px !important;
  margin: 18px 0 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

body.pkp_page_issue.pkp_op_archive
.issues_archive > li {
  position: relative !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

/* Card setiap issue */
body.pkp_page_issue.pkp_op_archive
.obj_issue_summary {
  position: relative !important;
  margin: 0 !important;
  padding: 20px 22px 19px 25px !important;
  overflow: hidden !important;

  border: 1px solid var(--aicief-v9-line) !important;
  border-left: 4px solid var(--aicief-v9-gold) !important;
  border-radius: 15px !important;

  background:
    radial-gradient(
      circle at 96% 12%,
      rgba(217,166,76,.10) 0%,
      transparent 28%
    ),
    linear-gradient(
      145deg,
      rgba(255,255,255,.99),
      rgba(248,244,233,.93)
    ) !important;

  box-shadow:
    0 9px 22px rgba(2,44,41,.08),
    inset 0 1px 0 rgba(255,255,255,.94) !important;

  transition:
    transform .23s ease,
    border-color .23s ease,
    box-shadow .23s ease !important;
}

body.pkp_page_issue.pkp_op_archive
.obj_issue_summary::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 24px !important;
  right: 24px !important;
  height: 1px !important;
  background:
    linear-gradient(
      90deg,
      transparent,
      rgba(217,166,76,.58),
      transparent
    ) !important;
}

body.pkp_page_issue.pkp_op_archive
.obj_issue_summary:hover {
  transform: translateY(-3px) !important;
  border-color: rgba(217,166,76,.44) !important;
  box-shadow:
    0 14px 30px rgba(2,44,41,.13),
    inset 0 1px 0 rgba(255,255,255,.98) !important;
}

body.pkp_page_issue.pkp_op_archive
.obj_issue_summary h2 {
  margin: 0 !important;
  padding: 0 !important;
}

body.pkp_page_issue.pkp_op_archive
.obj_issue_summary a.title,
body.pkp_page_issue.pkp_op_archive
.obj_issue_summary a.title:visited {
  color: #075047 !important;
  font-size: 16px !important;
  font-weight: 850 !important;
  line-height: 1.4 !important;
  text-decoration: none !important;
  transition:
    color .20s ease,
    text-shadow .20s ease !important;
}

body.pkp_page_issue.pkp_op_archive
.obj_issue_summary a.title:hover,
body.pkp_page_issue.pkp_op_archive
.obj_issue_summary a.title:focus {
  color: #a36f18 !important;
  text-decoration: none !important;
  text-shadow: 0 0 10px rgba(217,166,76,.12) !important;
}

body.pkp_page_issue.pkp_op_archive
.obj_issue_summary .series {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 26px !important;
  margin-top: 8px !important;
  padding: 5px 10px !important;

  color: #6e5a2f !important;
  font-size: 11px !important;
  font-weight: 750 !important;
  line-height: 1 !important;

  border: 1px solid rgba(217,166,76,.28) !important;
  border-radius: 999px !important;
  background: rgba(217,166,76,.09) !important;
}

/* Divider archive lama dihapus */
body.pkp_page_issue.pkp_op_archive
.issues_archive > li + li {
  border-top: 0 !important;
}

/* =======================================================
   3. DETAIL ARTICLE: HILANGKAN GARIS DI ATAS PENULIS
   ======================================================= */

body.pkp_page_article
.obj_article_details > .row {
  border-top: 0 !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
}

body.pkp_page_article
.obj_article_details > .row::before,
body.pkp_page_article
.obj_article_details > .row::after {
  display: none !important;
  content: none !important;
}

body.pkp_page_article
.obj_article_details .main_entry {
  border-top: 0 !important;
}

body.pkp_page_article
.obj_article_details .main_entry > .item.authors {
  margin-top: 0 !important;
}

/* =======================================================
   4. LOGIN + REGISTER / AUTH PAGES
   ======================================================= */

body.pkp_page_login .page_login,
body.pkp_page_user .page_register,
body.pkp_page_user .page_user {
  position: relative !important;
  max-width: 720px !important;
  margin: 0 auto !important;
  padding: 0 0 8px !important;
}

/* Judul halaman */
body.pkp_page_login .page_login > h1,
body.pkp_page_user .page_register > h1,
body.pkp_page_user .page_user > h1 {
  margin: 22px 0 8px !important;
  color: var(--aicief-v9-deep) !important;
  font-size: 27px !important;
  font-weight: 850 !important;
  letter-spacing: -.02em !important;
}

/* Keterangan required */
body.pkp_page_login .page_login > p,
body.pkp_page_user .page_register > p,
body.pkp_page_user .page_user > p {
  margin: 0 0 17px !important;
  color: var(--aicief-v9-muted) !important;
  font-size: 12.5px !important;
  line-height: 1.6 !important;
}

/* Form card */
body.pkp_page_login .cmp_form.login,
body.pkp_page_user .cmp_form.register,
body.pkp_page_user .page_register .cmp_form,
body.pkp_page_user .page_user .cmp_form {
  position: relative !important;
  margin: 0 !important;
  padding: 24px !important;

  border: 1px solid rgba(3,72,63,.14) !important;
  border-left: 4px solid var(--aicief-v9-gold) !important;
  border-radius: 17px !important;

  background:
    radial-gradient(
      circle at 96% 4%,
      rgba(217,166,76,.11) 0%,
      transparent 30%
    ),
    linear-gradient(
      145deg,
      rgba(255,255,255,.99),
      rgba(248,244,233,.94)
    ) !important;

  box-shadow:
    0 15px 34px rgba(2,44,41,.11),
    inset 0 1px 0 rgba(255,255,255,.96) !important;
}

/* Ornamen garis atas */
body.pkp_page_login .cmp_form.login::before,
body.pkp_page_user .cmp_form.register::before,
body.pkp_page_user .page_register .cmp_form::before,
body.pkp_page_user .page_user .cmp_form::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 28px !important;
  right: 28px !important;
  height: 1px !important;
  background:
    linear-gradient(
      90deg,
      transparent,
      rgba(217,166,76,.70),
      transparent
    ) !important;
}

/* Fields layout */
body.pkp_page_login .cmp_form .fields,
body.pkp_page_user .cmp_form .fields {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

body.pkp_page_login .cmp_form .fields > div,
body.pkp_page_user .cmp_form .fields > div {
  margin: 0 0 16px !important;
  padding: 0 !important;
}

/* Labels */
body.pkp_page_login .cmp_form label > .label,
body.pkp_page_user .cmp_form label > .label,
body.pkp_page_user .cmp_form .label {
  color: var(--aicief-v9-deep) !important;
  font-size: 12px !important;
  font-weight: 800 !important;
}

/* Inputs */
body.pkp_page_login .cmp_form input[type="text"],
body.pkp_page_login .cmp_form input[type="password"],
body.pkp_page_login .cmp_form input[type="email"],
body.pkp_page_user .cmp_form input[type="text"],
body.pkp_page_user .cmp_form input[type="password"],
body.pkp_page_user .cmp_form input[type="email"],
body.pkp_page_user .cmp_form select,
body.pkp_page_user .cmp_form textarea {
  width: 100% !important;
  min-height: 44px !important;
  box-sizing: border-box !important;
  margin-top: 7px !important;
  padding: 10px 12px !important;

  color: var(--aicief-v9-text) !important;
  font-size: 13px !important;

  border: 1px solid rgba(3,72,63,.22) !important;
  border-radius: 10px !important;
  background: rgba(255,255,255,.96) !important;

  box-shadow:
    inset 0 1px 2px rgba(2,44,41,.04) !important;

  transition:
    border-color .20s ease,
    box-shadow .20s ease,
    background .20s ease !important;
}

body.pkp_page_login .cmp_form input:focus,
body.pkp_page_user .cmp_form input:focus,
body.pkp_page_user .cmp_form select:focus,
body.pkp_page_user .cmp_form textarea:focus {
  outline: 0 !important;
  border-color: rgba(217,166,76,.86) !important;
  background: #fff !important;
  box-shadow:
    0 0 0 4px rgba(217,166,76,.12),
    inset 0 1px 2px rgba(2,44,41,.03) !important;
}

/* Required */
body.pkp_page_login .required,
body.pkp_page_user .required {
  color: #b04f3e !important;
}

/* Forgot password dan link form */
body.pkp_page_login .cmp_form a,
body.pkp_page_user .cmp_form a,
body.pkp_page_login .cmp_form a:visited,
body.pkp_page_user .cmp_form a:visited {
  color: #075047 !important;
  font-weight: 700 !important;
  text-decoration: none !important;
}

body.pkp_page_login .cmp_form a:hover,
body.pkp_page_login .cmp_form a:focus,
body.pkp_page_user .cmp_form a:hover,
body.pkp_page_user .cmp_form a:focus {
  color: #a36f18 !important;
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
}

/* Checkbox */
body.pkp_page_login .cmp_form .checkbox label,
body.pkp_page_user .cmp_form .checkbox label {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  color: var(--aicief-v9-text) !important;
}

body.pkp_page_login .cmp_form input[type="checkbox"],
body.pkp_page_user .cmp_form input[type="checkbox"] {
  width: 16px !important;
  height: 16px !important;
  margin: 0 !important;
  accent-color: var(--aicief-v9-mid);
}

/* Action row */
body.pkp_page_login .cmp_form .buttons,
body.pkp_page_user .cmp_form .buttons {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  margin-top: 8px !important;
  padding-top: 16px !important;
  border-top: 1px solid rgba(3,72,63,.10) !important;
}

/* Primary submit */
body.pkp_page_login .cmp_form button.submit,
body.pkp_page_user .cmp_form button.submit,
body.pkp_page_user .cmp_form button[type="submit"],
body.pkp_page_user .cmp_form input[type="submit"] {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 42px !important;
  padding: 10px 20px !important;

  color: var(--aicief-v9-gold-light) !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  letter-spacing: .04em !important;

  border: 1px solid rgba(217,166,76,.58) !important;
  border-radius: 10px !important;
  background:
    linear-gradient(
      135deg,
      var(--aicief-v9-deep),
      var(--aicief-v9-dark)
    ) !important;

  box-shadow:
    0 7px 16px rgba(2,44,41,.17),
    inset 0 1px 0 rgba(255,255,255,.06) !important;

  transition:
    transform .20s ease,
    color .20s ease,
    background .20s ease,
    box-shadow .20s ease !important;
}

body.pkp_page_login .cmp_form button.submit:hover,
body.pkp_page_login .cmp_form button.submit:focus,
body.pkp_page_user .cmp_form button.submit:hover,
body.pkp_page_user .cmp_form button.submit:focus,
body.pkp_page_user .cmp_form button[type="submit"]:hover,
body.pkp_page_user .cmp_form input[type="submit"]:hover {
  color: var(--aicief-v9-deep) !important;
  border-color: var(--aicief-v9-gold-light) !important;
  background:
    linear-gradient(
      135deg,
      var(--aicief-v9-gold-light),
      var(--aicief-v9-gold)
    ) !important;
  transform: translateY(-2px) !important;
  box-shadow:
    0 10px 20px rgba(2,44,41,.20),
    inset 0 1px 0 rgba(255,255,255,.42) !important;
}

/* Secondary register link on login page */
body.pkp_page_login .cmp_form .buttons a.register {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 42px !important;
  padding: 10px 17px !important;

  color: var(--aicief-v9-deep) !important;
  font-size: 12px !important;
  font-weight: 850 !important;
  text-decoration: none !important;

  border: 1px solid rgba(3,72,63,.22) !important;
  border-radius: 10px !important;
  background: rgba(255,255,255,.76) !important;
}

body.pkp_page_login .cmp_form .buttons a.register:hover,
body.pkp_page_login .cmp_form .buttons a.register:focus {
  color: #a36f18 !important;
  border-color: rgba(217,166,76,.60) !important;
  background: rgba(248,244,233,.94) !important;
  text-decoration: none !important;
}

/* =======================================================
   RESPONSIVE
   ======================================================= */

@media (max-width: 768px) {
  body.pkp_page_issue.pkp_op_archive
  .obj_issue_summary {
    padding: 17px 16px 16px 19px !important;
    border-radius: 13px !important;
  }

  body.pkp_page_login .cmp_form.login,
  body.pkp_page_user .cmp_form.register,
  body.pkp_page_user .page_register .cmp_form,
  body.pkp_page_user .page_user .cmp_form {
    padding: 18px 16px !important;
    border-radius: 14px !important;
  }

  body.pkp_page_login .cmp_form .buttons,
  body.pkp_page_user .cmp_form .buttons {
    align-items: stretch !important;
    flex-direction: column-reverse !important;
  }

  body.pkp_page_login .cmp_form .buttons > *,
  body.pkp_page_user .cmp_form .buttons > * {
    width: 100% !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .sakinah-template-card img,
  .sakinah-tools-card img,
  .sakinah-stat-card img,
  body.pkp_page_issue.pkp_op_archive .obj_issue_summary,
  body.pkp_page_login .cmp_form button.submit,
  body.pkp_page_user .cmp_form button.submit {
    transition: none !important;
  }

  body.pkp_page_issue.pkp_op_archive .obj_issue_summary:hover,
  body.pkp_page_login .cmp_form button.submit:hover,
  body.pkp_page_user .cmp_form button.submit:hover {
    transform: none !important;
  }
}

/* =======================================================
   AICIEF FINAL V10
   CLEAN LOGIN + SIMPLE ARCHIVE + BLENDED SIDEBAR MEDIA
   -------------------------------------------------------
   1. Login/Register tanpa card besar
   2. Archive tanpa card dan separator bawaan
   3. Logo aplikasi/statistik menyatu dengan background cream
   ======================================================= */

:root {
  --aicief-v10-deep: #032f2c;
  --aicief-v10-dark: #05453e;
  --aicief-v10-mid: #0a6258;
  --aicief-v10-gold: #d9a64c;
  --aicief-v10-gold-light: #efc875;
  --aicief-v10-cream: #f8f4e9;
  --aicief-v10-cream-soft: #fcfaf4;
  --aicief-v10-text: #29423c;
  --aicief-v10-muted: #687a75;
}

/* =======================================================
   1. LOGIN / REGISTER: TANPA CARD BESAR
   ======================================================= */

body.pkp_page_login .page_login,
body.pkp_page_user .page_register,
body.pkp_page_user .page_user {
  max-width: 640px !important;
  margin: 0 auto !important;
  padding: 0 0 24px !important;
}

/* Hapus card besar dari form */
body.pkp_page_login .cmp_form.login,
body.pkp_page_user .cmp_form.register,
body.pkp_page_user .page_register .cmp_form,
body.pkp_page_user .page_user .cmp_form {
  margin: 0 !important;
  padding: 0 !important;

  border: 0 !important;
  border-left: 0 !important;
  border-radius: 0 !important;

  background: transparent !important;
  box-shadow: none !important;
}

/* Hapus ornamen garis card */
body.pkp_page_login .cmp_form.login::before,
body.pkp_page_login .cmp_form.login::after,
body.pkp_page_user .cmp_form.register::before,
body.pkp_page_user .cmp_form.register::after,
body.pkp_page_user .page_register .cmp_form::before,
body.pkp_page_user .page_register .cmp_form::after,
body.pkp_page_user .page_user .cmp_form::before,
body.pkp_page_user .page_user .cmp_form::after {
  display: none !important;
  content: none !important;
}

/* Form dibuat ringkas */
body.pkp_page_login .cmp_form .fields,
body.pkp_page_user .cmp_form .fields {
  max-width: 420px !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Field spacing */
body.pkp_page_login .cmp_form .fields > div,
body.pkp_page_user .cmp_form .fields > div {
  margin: 0 0 16px !important;
  padding: 0 !important;
}

/* Labels */
body.pkp_page_login .cmp_form label > .label,
body.pkp_page_user .cmp_form label > .label,
body.pkp_page_user .cmp_form .label {
  color: var(--aicief-v10-deep) !important;
  font-size: 12px !important;
  font-weight: 800 !important;
}

/* Inputs lebih elegan, tanpa efek card */
body.pkp_page_login .cmp_form input[type="text"],
body.pkp_page_login .cmp_form input[type="password"],
body.pkp_page_login .cmp_form input[type="email"],
body.pkp_page_user .cmp_form input[type="text"],
body.pkp_page_user .cmp_form input[type="password"],
body.pkp_page_user .cmp_form input[type="email"],
body.pkp_page_user .cmp_form select,
body.pkp_page_user .cmp_form textarea {
  width: 100% !important;
  min-height: 43px !important;
  box-sizing: border-box !important;
  margin-top: 7px !important;
  padding: 10px 12px !important;

  color: var(--aicief-v10-text) !important;
  font-size: 13px !important;

  border: 1px solid rgba(3,72,63,.20) !important;
  border-radius: 9px !important;
  background: rgba(255,255,255,.96) !important;

  box-shadow:
    inset 0 1px 2px rgba(2,44,41,.04) !important;
}

body.pkp_page_login .cmp_form input:focus,
body.pkp_page_user .cmp_form input:focus,
body.pkp_page_user .cmp_form select:focus,
body.pkp_page_user .cmp_form textarea:focus {
  outline: 0 !important;
  border-color: rgba(217,166,76,.86) !important;
  box-shadow:
    0 0 0 4px rgba(217,166,76,.11) !important;
}

/* Link auth */
body.pkp_page_login .cmp_form a,
body.pkp_page_user .cmp_form a,
body.pkp_page_login .cmp_form a:visited,
body.pkp_page_user .cmp_form a:visited {
  color: #075047 !important;
  font-weight: 700 !important;
  text-decoration: none !important;
}

body.pkp_page_login .cmp_form a:hover,
body.pkp_page_login .cmp_form a:focus,
body.pkp_page_user .cmp_form a:hover,
body.pkp_page_user .cmp_form a:focus {
  color: #a36f18 !important;
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
}

/* Tombol login/register satu baris, sederhana */
body.pkp_page_login .cmp_form .buttons,
body.pkp_page_user .cmp_form .buttons {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  flex-wrap: wrap !important;
  gap: 10px !important;

  max-width: 420px !important;
  margin-top: 8px !important;
  padding-top: 14px !important;

  border-top: 1px solid rgba(3,72,63,.09) !important;
}

body.pkp_page_login .cmp_form button.submit,
body.pkp_page_user .cmp_form button.submit,
body.pkp_page_user .cmp_form button[type="submit"],
body.pkp_page_user .cmp_form input[type="submit"] {
  min-height: 40px !important;
  padding: 9px 18px !important;

  color: var(--aicief-v10-gold-light) !important;
  font-size: 12px !important;
  font-weight: 900 !important;

  border: 1px solid rgba(217,166,76,.58) !important;
  border-radius: 9px !important;
  background:
    linear-gradient(
      135deg,
      var(--aicief-v10-deep),
      var(--aicief-v10-dark)
    ) !important;

  box-shadow:
    0 6px 14px rgba(2,44,41,.16) !important;
}

body.pkp_page_login .cmp_form button.submit:hover,
body.pkp_page_login .cmp_form button.submit:focus,
body.pkp_page_user .cmp_form button.submit:hover,
body.pkp_page_user .cmp_form button.submit:focus {
  color: var(--aicief-v10-deep) !important;
  background:
    linear-gradient(
      135deg,
      var(--aicief-v10-gold-light),
      var(--aicief-v10-gold)
    ) !important;
  transform: translateY(-2px) !important;
}

body.pkp_page_login .cmp_form .buttons a.register {
  min-height: 40px !important;
  padding: 9px 16px !important;

  color: var(--aicief-v10-deep) !important;
  font-size: 12px !important;
  font-weight: 850 !important;
  text-decoration: none !important;

  border: 1px solid rgba(3,72,63,.20) !important;
  border-radius: 9px !important;
  background: rgba(255,255,255,.82) !important;
}

body.pkp_page_login .cmp_form .buttons a.register:hover,
body.pkp_page_login .cmp_form .buttons a.register:focus {
  color: #a36f18 !important;
  border-color: rgba(217,166,76,.55) !important;
  background: var(--aicief-v10-cream-soft) !important;
  text-decoration: none !important;
}

/* =======================================================
   2. ARCHIVE: SIMPLE, TANPA CARD
   ======================================================= */

/* Hilangkan separator tepat di bawah judul Archives */
body.pkp_page_issue.pkp_op_archive
.page_issue_archive > h1 {
  margin-bottom: 22px !important;
  padding-bottom: 0 !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
}

body.pkp_page_issue.pkp_op_archive
.page_issue_archive > h1::before,
body.pkp_page_issue.pkp_op_archive
.page_issue_archive > h1::after {
  display: none !important;
  content: none !important;
}

/* List issue sederhana */
body.pkp_page_issue.pkp_op_archive
.issues_archive {
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

body.pkp_page_issue.pkp_op_archive
.issues_archive > li {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

/* Hilangkan card issue */
body.pkp_page_issue.pkp_op_archive
.obj_issue_summary {
  position: relative !important;
  margin: 0 !important;
  padding: 17px 0 19px !important;

  border: 0 !important;
  border-left: 0 !important;
  border-radius: 0 !important;

  background: transparent !important;
  box-shadow: none !important;

  transform: none !important;
}

/* Separator elegan hanya di bawah item */
body.pkp_page_issue.pkp_op_archive
.obj_issue_summary::before {
  display: none !important;
  content: none !important;
}

body.pkp_page_issue.pkp_op_archive
.obj_issue_summary::after {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  height: 1px !important;

  background:
    linear-gradient(
      90deg,
      rgba(217,166,76,.52),
      rgba(3,72,63,.13),
      transparent
    ) !important;
}

/* Tidak ada efek card saat hover */
body.pkp_page_issue.pkp_op_archive
.obj_issue_summary:hover {
  transform: none !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* Judul issue */
body.pkp_page_issue.pkp_op_archive
.obj_issue_summary a.title,
body.pkp_page_issue.pkp_op_archive
.obj_issue_summary a.title:visited {
  color: #075047 !important;
  font-size: 16px !important;
  font-weight: 850 !important;
  text-decoration: none !important;
}

body.pkp_page_issue.pkp_op_archive
.obj_issue_summary a.title:hover,
body.pkp_page_issue.pkp_op_archive
.obj_issue_summary a.title:focus {
  color: #a36f18 !important;
  text-decoration: none !important;
}

/* Series tetap halus, bukan card mencolok */
body.pkp_page_issue.pkp_op_archive
.obj_issue_summary .series {
  display: inline-flex !important;
  align-items: center !important;
  min-height: auto !important;
  margin: 5px 0 0 8px !important;
  padding: 3px 8px !important;

  color: #7a642f !important;
  font-size: 10.5px !important;
  font-weight: 750 !important;

  border: 1px solid rgba(217,166,76,.26) !important;
  border-radius: 999px !important;
  background: rgba(217,166,76,.07) !important;
}

/* =======================================================
   3. SIDEBAR LOGOS: MENYATU DENGAN BACKGROUND CREAM
   ======================================================= */

/* Wrapper Mendeley, Turnitin, Grammarly tanpa border/card putih */
.sakinah-tools-card > .sakinah-sidebar-title:not(:first-child),
.sakinah-tools-card > .sakinah-sidebar-title:not(:first-child) > a {
  display: block !important;
  width: 100% !important;
  margin: 7px 0 0 !important;
  padding: 0 !important;

  border: 0 !important;
  outline: 0 !important;
  border-radius: 0 !important;

  background: transparent !important;
  box-shadow: none !important;
}

/* Logo tools menyatu ke cream memakai blend mode */
.sakinah-tools-card > .sakinah-sidebar-title:not(:first-child) img {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  margin: 0 auto !important;
  padding: 5px 4px !important;

  object-fit: contain !important;

  border: 0 !important;
  outline: 0 !important;
  border-radius: 8px !important;

  background: transparent !important;
  box-shadow: none !important;

  mix-blend-mode: multiply !important;
  filter:
    saturate(.98)
    contrast(1.01)
    brightness(1.01);
}

/* Statistik juga dibuat menyatu */
.sakinah-stat-card > a:not([href*="histats.com/viewstats"]),
.sakinah-stat-card > img:not([src*="0.gif"]),
.sakinah-stat-card > a[href*="histats.com/viewstats"] + img {
  display: block !important;
  width: 100% !important;
  margin: 7px 0 0 !important;
  padding: 4px !important;

  border: 0 !important;
  border-radius: 0 !important;

  background: transparent !important;
  box-shadow: none !important;
}

.sakinah-stat-card img:not([src*="0.gif"]) {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 auto !important;
  padding: 4px !important;

  border: 0 !important;
  border-radius: 8px !important;

  background: transparent !important;
  box-shadow: none !important;

  mix-blend-mode: multiply !important;
}

/* Template article dipertahankan seperti sekarang */
.sakinah-template-card > a {
  border-color: rgba(3,72,63,.12) !important;
  background:
    linear-gradient(
      145deg,
      rgba(248,244,233,.98),
      rgba(252,250,244,.98)
    ) !important;
}

/* =======================================================
   RESPONSIVE
   ======================================================= */

@media (max-width: 768px) {
  body.pkp_page_login .cmp_form .fields,
  body.pkp_page_user .cmp_form .fields,
  body.pkp_page_login .cmp_form .buttons,
  body.pkp_page_user .cmp_form .buttons {
    max-width: 100% !important;
  }

  body.pkp_page_login .cmp_form .buttons,
  body.pkp_page_user .cmp_form .buttons {
    flex-direction: column !important;
    align-items: stretch !important;
  }

  body.pkp_page_login .cmp_form .buttons > *,
  body.pkp_page_user .cmp_form .buttons > * {
    width: 100% !important;
  }

  body.pkp_page_issue.pkp_op_archive
  .obj_issue_summary {
    padding: 15px 0 17px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.pkp_page_login .cmp_form button.submit,
  body.pkp_page_user .cmp_form button.submit,
  .sakinah-tools-card img,
  .sakinah-stat-card img {
    transition: none !important;
  }

  body.pkp_page_login .cmp_form button.submit:hover,
  body.pkp_page_user .cmp_form button.submit:hover {
    transform: none !important;
  }
}

/* =======================================================
   AICIEF FINAL V12
   MOBILE MENU MENYATU DENGAN HEADER
   -------------------------------------------------------
   Adaptasi prinsip:
   - Panel masuk ke alur header, bukan overlay/fixed drawer
   - Hamburger tetap di tengah vertikal seperti NALAR
   - Banner benar-benar center
   - Menu utama, submenu, search, dan user navigation
     berada dalam satu bidang header
   - Desktop tidak diubah
   ======================================================= */

:root {
  --aicief-m12-deep: #032f2c;
  --aicief-m12-dark: #022724;
  --aicief-m12-mid: #075047;
  --aicief-m12-gold: #d9a64c;
  --aicief-m12-gold-light: #efc875;
  --aicief-m12-cream: #f8f4e9;
  --aicief-m12-text: #29423c;
}

@media (max-width: 991px) {

  html,
  body,
  .pkp_structure_page {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
  }

  /* =====================================================
     HEADER MOBILE
     ===================================================== */

  .pkp_structure_head {
    position: relative !important;
    z-index: 1000 !important;
    display: block !important;
    width: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
  }

  .pkp_head_wrapper {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    background: transparent !important;
  }

  /* Baris poster/header */
  .pkp_site_name_wrapper {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-height: 112px !important;
    margin: 0 !important;
    padding: 14px 58px !important;
    box-sizing: border-box !important;
    overflow: visible !important;
  }

  .pkp_site_name {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 auto !important;
    padding: 0 !important;
    text-align: center !important;
    transform: none !important;
  }

  .pkp_site_name a.is_img {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    margin: 0 auto !important;
    padding: 0 !important;
  }

  .pkp_site_name a.is_img img,
  .pkp_site_name img {
    display: block !important;
    width: 100% !important;
    max-width: 620px !important;
    height: auto !important;
    max-height: none !important;
    margin: 0 auto !important;
    padding: 0 !important;
    object-fit: contain !important;
    object-position: center center !important;
    transform: none !important;
  }

  /* =====================================================
     HAMBURGER DI TENGAH VERTIKAL
     ===================================================== */

  .pkp_site_nav_toggle {
    position: absolute !important;
    top: 50% !important;
    left: 9px !important;
    right: auto !important;
    z-index: 10020 !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    margin: 0 !important;
    padding: 0 !important;

    border: 1px solid rgba(3,72,63,.30) !important;
    border-radius: 11px !important;
    background:
      linear-gradient(
        135deg,
        var(--aicief-m12-gold-light),
        var(--aicief-m12-gold)
      ) !important;

    color: var(--aicief-m12-deep) !important;
    box-shadow:
      0 7px 17px rgba(2,44,41,.21),
      inset 0 1px 0 rgba(255,255,255,.45) !important;

    transform: translateY(-50%) !important;
    transition:
      background .20s ease,
      box-shadow .20s ease !important;
  }

  /* Sembunyikan teks bawaan, ikon digambar melalui pseudo-element */
  .pkp_site_nav_toggle > span {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    clip: rect(1px, 1px, 1px, 1px) !important;
    white-space: nowrap !important;
  }

  .pkp_site_nav_toggle::before {
    content: "☰" !important;
    display: block !important;
    color: var(--aicief-m12-deep) !important;
    font-family: Arial, sans-serif !important;
    font-size: 25px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    transform: translateY(-1px) !important;
  }

  .pkp_site_nav_toggle.pkp_site_nav_toggle--transform::before,
  .pkp_site_nav_toggle[aria-expanded="true"]::before {
    content: "×" !important;
    font-size: 31px !important;
    font-weight: 500 !important;
    transform: translateY(-2px) !important;
  }

  .pkp_site_nav_toggle:hover,
  .pkp_site_nav_toggle:focus {
    background:
      linear-gradient(
        135deg,
        #f3d18b,
        #dfa943
      ) !important;
    box-shadow:
      0 9px 20px rgba(2,44,41,.25),
      inset 0 1px 0 rgba(255,255,255,.50) !important;
    transform: translateY(-50%) !important;
  }

  /* =====================================================
     PANEL NAVIGASI MENYATU DENGAN HEADER
     Kunci perbedaannya: position static, bukan fixed/absolute.
     ===================================================== */

  nav.pkp_site_nav_menu {
    float: none !important;
  }

  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen {
    position: static !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    z-index: 1 !important;

    display: block !important;
    width: 100% !important;
    max-width: none !important;
    height: auto !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 10px 20px 18px !important;
    box-sizing: border-box !important;

    overflow: visible !important;

    border: 0 !important;
    border-top: 1px solid rgba(217,166,76,.26) !important;
    border-bottom: 2px solid rgba(217,166,76,.74) !important;
    border-radius: 0 !important;

    background:
      radial-gradient(
        circle at 100% 0%,
        rgba(217,166,76,.10) 0%,
        transparent 32%
      ),
      linear-gradient(
        180deg,
        rgba(3,47,44,.985) 0%,
        rgba(2,39,36,.995) 100%
      ) !important;

    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;

    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.035) !important;
  }

  /* Semua wrapper masuk satu alur */
  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen
  .pkp_navigation_primary_row,
  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen
  .pkp_navigation_primary_wrapper,
  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen
  .pkp_navigation_user_wrapper,
  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen
  .pkp_navigation_search_wrapper {
    position: static !important;
    display: block !important;
    float: none !important;
    clear: both !important;
    width: 100% !important;
    max-width: none !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen
  .pkp_navigation_primary,
  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen
  .pkp_navigation_user {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
  }

  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen
  .pkp_navigation_primary > li,
  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen
  .pkp_navigation_user > li {
    position: static !important;
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    border-bottom: 1px solid rgba(255,255,255,.065) !important;
  }

  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen
  .pkp_navigation_primary > li:last-child,
  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen
  .pkp_navigation_user > li:last-child {
    border-bottom: 0 !important;
  }

  /* Primary links */
  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen
  .pkp_navigation_primary > li > a,
  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen
  .pkp_navigation_primary > li > span {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    min-height: 46px !important;
    margin: 0 !important;
    padding: 0 7px !important;
    box-sizing: border-box !important;

    color: rgba(255,255,255,.96) !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    line-height: 1.35 !important;
    text-decoration: none !important;

    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    transform: none !important;
  }

  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen
  .pkp_navigation_primary > li > a:hover,
  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen
  .pkp_navigation_primary > li > a:focus,
  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen
  .pkp_navigation_primary > li > span:hover {
    color: var(--aicief-m12-gold-light) !important;
    padding-left: 12px !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
  }

  /* Submenu tetap bagian dari panel yang sama */
  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen
  .pkp_navigation_primary > li > ul,
  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen
  .pkp_navigation_user > li > ul,
  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen
  ul ul {
    position: static !important;
    float: none !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    margin: 0 0 8px 10px !important;
    padding: 2px 0 3px 17px !important;

    border: 0 !important;
    border-left: 1px solid rgba(217,166,76,.31) !important;
    border-radius: 0 !important;

    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
    overflow: visible !important;
  }

  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen
  ul ul::before,
  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen
  ul ul::after {
    display: none !important;
    content: none !important;
  }

  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen
  ul ul li {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(255,255,255,.045) !important;
    background: transparent !important;
  }

  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen
  ul ul li:last-child {
    border-bottom: 0 !important;
  }

  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen
  ul ul a {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    min-height: 38px !important;
    margin: 0 !important;
    padding: 0 7px !important;

    color: rgba(255,255,255,.80) !important;
    font-size: 13.5px !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;
    text-decoration: none !important;

    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    transform: none !important;
  }

  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen
  ul ul a:hover,
  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen
  ul ul a:focus {
    color: var(--aicief-m12-gold-light) !important;
    padding-left: 12px !important;
    background: transparent !important;
  }

  /* Search menyatu dan lebih ringkas */
  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen
  .pkp_navigation_search_wrapper {
    margin-top: 14px !important;
    padding-top: 14px !important;
    border-top: 1px solid rgba(255,255,255,.08) !important;
  }

  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen
  .pkp_search {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-height: 44px !important;
    margin: 0 !important;
    padding: 10px 16px !important;
    box-sizing: border-box !important;

    color: var(--aicief-m12-deep) !important;
    font-size: 14px !important;
    font-weight: 900 !important;

    border: 1px solid rgba(3,72,63,.18) !important;
    border-radius: 11px !important;
    background:
      linear-gradient(
        135deg,
        var(--aicief-m12-gold-light),
        var(--aicief-m12-gold)
      ) !important;

    box-shadow:
      0 7px 16px rgba(0,24,22,.20),
      inset 0 1px 0 rgba(255,255,255,.42) !important;
  }

  /* User navigation menjadi bagian terakhir */
  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen
  .pkp_navigation_user_wrapper {
    margin-top: 13px !important;
    padding-top: 11px !important;
    border-top: 1px solid rgba(217,166,76,.22) !important;
  }

  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen
  .pkp_navigation_user > li > a {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    min-height: 43px !important;
    margin: 0 !important;
    padding: 0 7px !important;

    color: rgba(255,255,255,.94) !important;
    font-size: 14px !important;
    font-weight: 760 !important;
    line-height: 1.35 !important;
    text-decoration: none !important;

    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    transform: none !important;
  }

  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen
  .pkp_navigation_user > li > a:hover,
  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen
  .pkp_navigation_user > li > a:focus {
    color: var(--aicief-m12-gold-light) !important;
    padding-left: 12px !important;
    background: transparent !important;
  }

  /* =====================================================
     CARD DESKRIPSI JURNAL MOBILE
     ===================================================== */

  .page_index_journal
  .additional_content
  section.additional_content > div {
    display: block !important;
    width: auto !important;
    max-width: 94% !important;
    margin: 22px auto 26px !important;
    padding: 20px 17px !important;
    box-sizing: border-box !important;

    border: 1px solid rgba(3,72,63,.15) !important;
    border-top: 3px solid var(--aicief-m12-gold) !important;
    border-radius: 17px !important;

    background:
      radial-gradient(
        circle at 96% 5%,
        rgba(217,166,76,.11) 0%,
        transparent 30%
      ),
      linear-gradient(
        145deg,
        rgba(252,250,244,.99) 0%,
        rgba(248,244,233,.96) 100%
      ) !important;

    box-shadow:
      0 14px 30px rgba(2,44,41,.11),
      inset 0 1px 0 rgba(255,255,255,.94) !important;

    text-align: center !important;
  }

  .page_index_journal
  .additional_content
  section.additional_content > div > div:first-child {
    width: 100% !important;
    margin: 0 auto 18px !important;
    text-align: center !important;
  }

  .page_index_journal
  .additional_content
  section.additional_content > div > div:first-child img {
    display: block !important;
    width: 48% !important;
    max-width: 190px !important;
    height: auto !important;
    margin: 0 auto !important;

    border: 1px solid rgba(217,166,76,.30) !important;
    border-radius: 12px !important;

    box-shadow:
      0 12px 24px rgba(2,44,41,.16) !important;
  }

  .page_index_journal
  .additional_content
  section.additional_content > div > div:nth-child(2) {
    max-height: none !important;
    overflow: visible !important;
    color: var(--aicief-m12-text) !important;
    font-size: 13px !important;
    line-height: 1.68 !important;
    text-align: center !important;
  }

  .page_index_journal
  .additional_content
  section.additional_content h1 {
    margin: 0 0 15px !important;
    color: var(--aicief-m12-deep) !important;
    font-size: 17px !important;
    font-weight: 850 !important;
    line-height: 1.38 !important;
    text-align: center !important;
  }

  .page_index_journal
  .additional_content
  section.additional_content p {
    margin: 6px 0 !important;
    color: #465d57 !important;
    font-size: 13px !important;
    line-height: 1.58 !important;
    text-align: center !important;
  }

  .page_index_journal
  .additional_content
  section.additional_content p strong {
    color: var(--aicief-m12-deep) !important;
    font-weight: 850 !important;
  }

  .page_index_journal
  .additional_content
  section.additional_content .btn-submit {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 43px !important;
    margin-top: 12px !important;
    padding: 10px 17px !important;

    color: var(--aicief-m12-gold-light) !important;
    font-size: 13px !important;
    font-weight: 900 !important;
    text-decoration: none !important;

    border: 1px solid rgba(217,166,76,.58) !important;
    border-radius: 10px !important;
    background:
      linear-gradient(
        135deg,
        var(--aicief-m12-deep),
        var(--aicief-m12-mid)
      ) !important;

    box-shadow:
      0 8px 18px rgba(2,44,41,.18),
      inset 0 1px 0 rgba(255,255,255,.06) !important;
  }
}

@media (max-width: 430px) {
  .pkp_site_name_wrapper {
    min-height: 96px !important;
    padding: 12px 50px !important;
  }

  .pkp_site_nav_toggle {
    left: 5px !important;
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    min-height: 42px !important;
  }

  .pkp_site_nav_toggle::before {
    font-size: 23px !important;
  }

  .pkp_site_nav_toggle.pkp_site_nav_toggle--transform::before,
  .pkp_site_nav_toggle[aria-expanded="true"]::before {
    font-size: 29px !important;
  }

  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen {
    padding-right: 16px !important;
    padding-left: 16px !important;
  }

  .page_index_journal
  .additional_content
  section.additional_content > div {
    max-width: 96% !important;
    padding: 18px 14px !important;
  }

  .page_index_journal
  .additional_content
  section.additional_content > div > div:first-child img {
    width: 54% !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .pkp_site_nav_toggle,
  nav.pkp_site_nav_menu.pkp_site_nav_menu--isOpen a,
  .page_index_journal
  .additional_content
  section.additional_content .btn-submit {
    transition: none !important;
  }
}

/* =======================================================
   AICIEF FINAL V13 - COMPACT JOURNAL PROFILE
   ======================================================= */

:root {
  --aicief-profile-deep: #032f2c;
  --aicief-profile-mid: #075047;
  --aicief-profile-gold: #d9a64c;
  --aicief-profile-gold-light: #efc875;
  --aicief-profile-text: #405852;
}

.aicief-journal-profile {
  margin: 22px 0 26px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

.aicief-journal-profile__inner {
  position: relative !important;
  display: grid !important;
  grid-template-columns: 150px minmax(0, 1fr) !important;
  gap: 20px !important;
  align-items: center !important;
  width: 100% !important;
  max-width: 820px !important;
  margin: 0 auto !important;
  padding: 18px !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  border: 1px solid rgba(3,72,63,.14) !important;
  border-top: 3px solid var(--aicief-profile-gold) !important;
  border-radius: 16px !important;
  background:
    radial-gradient(circle at 96% 5%, rgba(217,166,76,.12) 0%, transparent 27%),
    linear-gradient(145deg, rgba(255,255,255,.99) 0%, rgba(248,244,233,.96) 100%) !important;
  box-shadow:
    0 13px 28px rgba(2,44,41,.10),
    inset 0 1px 0 rgba(255,255,255,.95) !important;
}

.aicief-journal-profile__inner::after {
  content: "" !important;
  position: absolute !important;
  top: -58px !important;
  right: -52px !important;
  width: 145px !important;
  height: 145px !important;
  border: 20px solid rgba(217,166,76,.075) !important;
  border-radius: 50% !important;
  pointer-events: none !important;
}

.aicief-journal-profile__cover {
  position: relative !important;
  z-index: 2 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 150px !important;
  margin: 0 !important;
  padding: 9px !important;
  box-sizing: border-box !important;
  border: 1px solid rgba(217,166,76,.28) !important;
  border-radius: 12px !important;
  background: linear-gradient(145deg, rgba(3,47,44,.98), rgba(7,80,71,.94)) !important;
  box-shadow: 0 10px 21px rgba(2,44,41,.16) !important;
}

.aicief-journal-profile__cover img {
  display: block !important;
  width: 100% !important;
  max-width: 130px !important;
  height: auto !important;
  margin: 0 auto !important;
  border: 0 !important;
  border-radius: 7px !important;
  box-shadow: 0 7px 17px rgba(0,0,0,.18) !important;
}

.aicief-journal-profile__content {
  position: relative !important;
  z-index: 2 !important;
  min-width: 0 !important;
  color: var(--aicief-profile-text) !important;
}

.aicief-journal-profile__eyebrow {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  min-height: 27px !important;
  margin: 0 0 9px !important;
  padding: 6px 11px !important;
  color: var(--aicief-profile-deep) !important;
  font-size: 9px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  letter-spacing: .09em !important;
  text-transform: uppercase !important;
  border: 1px solid rgba(217,166,76,.62) !important;
  border-radius: 999px !important;
  background: linear-gradient(135deg, var(--aicief-profile-gold-light), var(--aicief-profile-gold)) !important;
  box-shadow:
    0 5px 11px rgba(2,44,41,.10),
    inset 0 1px 0 rgba(255,255,255,.44) !important;
}

.aicief-journal-profile__title {
  margin: 0 !important;
  padding: 0 !important;
  color: var(--aicief-profile-deep) !important;
  font-size: 18px !important;
  font-weight: 900 !important;
  line-height: 1.34 !important;
  letter-spacing: -.012em !important;
  text-align: left !important;
}

.aicief-journal-profile__separator {
  width: 100% !important;
  height: 1px !important;
  margin: 11px 0 10px !important;
  background: linear-gradient(90deg, rgba(217,166,76,.72), rgba(3,72,63,.12), transparent) !important;
}

.aicief-journal-profile__meta {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

.aicief-journal-profile__meta-item,
.aicief-journal-profile__meta-item--wide {
  display: grid !important;
  grid-template-columns: 100px minmax(0, 1fr) !important;
  align-items: start !important;
  gap: 9px !important;
  grid-column: auto !important;
  margin: 0 !important;
  padding: 5px 0 !important;
  border-bottom: 1px solid rgba(3,72,63,.08) !important;
}

.aicief-journal-profile__meta-item:last-child {
  border-bottom: 0 !important;
}

.aicief-journal-profile__meta dt {
  margin: 0 !important;
  color: var(--aicief-profile-mid) !important;
  font-size: 11.5px !important;
  font-weight: 850 !important;
  line-height: 1.45 !important;
}

.aicief-journal-profile__meta dd {
  min-width: 0 !important;
  margin: 0 !important;
  color: #526762 !important;
  font-size: 11.5px !important;
  font-weight: 600 !important;
  line-height: 1.45 !important;
  overflow-wrap: anywhere !important;
}

.aicief-journal-profile__meta a,
.aicief-journal-profile__meta a:visited {
  color: var(--aicief-profile-mid) !important;
  font-weight: 800 !important;
  text-decoration: none !important;
}

.aicief-journal-profile__meta a:hover,
.aicief-journal-profile__meta a:focus {
  color: #a36f18 !important;
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
}

.aicief-journal-profile__actions {
  margin-top: 11px !important;
}

.aicief-journal-profile__submit {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  min-height: 37px !important;
  padding: 8px 14px !important;
  color: var(--aicief-profile-gold-light) !important;
  font-size: 11.5px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  border: 1px solid rgba(217,166,76,.58) !important;
  border-radius: 9px !important;
  background: linear-gradient(135deg, var(--aicief-profile-deep), var(--aicief-profile-mid)) !important;
  box-shadow:
    0 6px 14px rgba(2,44,41,.16),
    inset 0 1px 0 rgba(255,255,255,.06) !important;
}

.aicief-journal-profile__submit:hover,
.aicief-journal-profile__submit:focus {
  color: var(--aicief-profile-deep) !important;
  background: linear-gradient(135deg, var(--aicief-profile-gold-light), var(--aicief-profile-gold)) !important;
  transform: translateY(-2px) !important;
}

@media (max-width: 760px) {
  .aicief-journal-profile__inner {
    grid-template-columns: 128px minmax(0, 1fr) !important;
    gap: 16px !important;
    padding: 15px !important;
  }

  .aicief-journal-profile__cover {
    width: 128px !important;
  }

  .aicief-journal-profile__cover img {
    max-width: 110px !important;
  }

  .aicief-journal-profile__title {
    font-size: 16px !important;
  }

  .aicief-journal-profile__meta-item,
  .aicief-journal-profile__meta-item--wide {
    grid-template-columns: 88px minmax(0, 1fr) !important;
  }
}

@media (max-width: 560px) {
  .aicief-journal-profile {
    margin: 18px 0 22px !important;
  }

  .aicief-journal-profile__inner {
    display: grid !important;
    grid-template-columns: 105px minmax(0, 1fr) !important;
    gap: 13px !important;
    width: calc(100% - 16px) !important;
    margin: 0 auto !important;
    padding: 13px !important;
    border-radius: 14px !important;
    text-align: left !important;
  }

  .aicief-journal-profile__cover {
    width: 105px !important;
    margin: 0 !important;
    padding: 7px !important;
  }

  .aicief-journal-profile__cover img {
    max-width: 91px !important;
  }

  .aicief-journal-profile__eyebrow {
    min-height: 24px !important;
    margin: 0 0 7px !important;
    padding: 5px 9px !important;
    font-size: 8px !important;
  }

  .aicief-journal-profile__title {
    font-size: 14px !important;
    line-height: 1.35 !important;
    text-align: left !important;
  }

  .aicief-journal-profile__separator {
    margin: 8px 0 7px !important;
  }

  .aicief-journal-profile__meta-item,
  .aicief-journal-profile__meta-item--wide {
    grid-template-columns: 72px minmax(0, 1fr) !important;
    gap: 6px !important;
    padding: 3px 0 !important;
  }

  .aicief-journal-profile__meta dt,
  .aicief-journal-profile__meta dd {
    font-size: 9.8px !important;
    line-height: 1.35 !important;
    text-align: left !important;
  }

  .aicief-journal-profile__actions {
    margin-top: 8px !important;
  }

  .aicief-journal-profile__submit {
    width: auto !important;
    min-height: 33px !important;
    padding: 7px 10px !important;
    font-size: 9.8px !important;
  }

  .aicief-journal-profile__inner::after {
    top: -42px !important;
    right: -40px !important;
    width: 100px !important;
    height: 100px !important;
    border-width: 14px !important;
  }
}

@media (max-width: 390px) {
  .aicief-journal-profile__inner {
    display: block !important;
    padding: 14px !important;
    text-align: center !important;
  }

  .aicief-journal-profile__cover {
    width: 118px !important;
    margin: 0 auto 13px !important;
  }

  .aicief-journal-profile__cover img {
    max-width: 102px !important;
  }

  .aicief-journal-profile__eyebrow {
    margin-right: auto !important;
    margin-left: auto !important;
  }

  .aicief-journal-profile__title {
    text-align: center !important;
  }

  .aicief-journal-profile__meta-item,
  .aicief-journal-profile__meta-item--wide {
    grid-template-columns: 1fr !important;
    gap: 1px !important;
    text-align: center !important;
  }

  .aicief-journal-profile__meta dt,
  .aicief-journal-profile__meta dd {
    text-align: center !important;
  }

  .aicief-journal-profile__submit {
    width: 100% !important;
    box-sizing: border-box !important;
  }
}

/* =======================================================
   AICIEF FINAL V14
   METADATA ALIGNMENT FIX
   -------------------------------------------------------
   DOI Prefix, Editor in Chief, dan Publisher dipaksa
   tetap sejajar horizontal dengan nilainya.
   ======================================================= */

.aicief-journal-profile__meta {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Gunakan flex agar nilai tidak turun ke baris baru */
.aicief-journal-profile__meta-item,
.aicief-journal-profile__meta-item--wide {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  gap: 12px !important;

  width: 100% !important;
  margin: 0 !important;
  padding: 6px 0 !important;
  box-sizing: border-box !important;

  border-bottom: 1px solid rgba(3,72,63,.08) !important;
}

.aicief-journal-profile__meta-item:last-child,
.aicief-journal-profile__meta-item--wide:last-child {
  border-bottom: 0 !important;
}

/* Label dibuat cukup lebar agar tidak pecah */
.aicief-journal-profile__meta dt {
  flex: 0 0 112px !important;
  width: 112px !important;
  min-width: 112px !important;
  max-width: 112px !important;

  margin: 0 !important;
  padding: 0 !important;

  color: var(--aicief-profile-mid) !important;
  font-size: 11.5px !important;
  font-weight: 850 !important;
  line-height: 1.45 !important;
  white-space: nowrap !important;
}

/* Nilai selalu melanjutkan ke samping */
.aicief-journal-profile__meta dd {
  flex: 1 1 auto !important;
  min-width: 0 !important;

  margin: 0 !important;
  padding: 0 !important;

  color: #526762 !important;
  font-size: 11.5px !important;
  font-weight: 600 !important;
  line-height: 1.45 !important;

  overflow-wrap: break-word !important;
  word-break: normal !important;
}

/* Publisher tetap satu baris label + isi */
.aicief-journal-profile__meta-item--wide dt {
  flex-basis: 112px !important;
}

.aicief-journal-profile__meta-item--wide dd {
  flex: 1 1 auto !important;
}

/* Tablet */
@media (max-width: 760px) {
  .aicief-journal-profile__meta-item,
  .aicief-journal-profile__meta-item--wide {
    gap: 9px !important;
    padding: 5px 0 !important;
  }

  .aicief-journal-profile__meta dt {
    flex-basis: 96px !important;
    width: 96px !important;
    min-width: 96px !important;
    max-width: 96px !important;
    font-size: 10.8px !important;
  }

  .aicief-journal-profile__meta dd {
    font-size: 10.8px !important;
  }
}

/* Mobile */
@media (max-width: 560px) {
  .aicief-journal-profile__meta-item,
  .aicief-journal-profile__meta-item--wide {
    gap: 7px !important;
    padding: 4px 0 !important;
  }

  .aicief-journal-profile__meta dt {
    flex-basis: 76px !important;
    width: 76px !important;
    min-width: 76px !important;
    max-width: 76px !important;

    font-size: 9.5px !important;
    line-height: 1.35 !important;
    white-space: normal !important;
  }

  .aicief-journal-profile__meta dd {
    font-size: 9.5px !important;
    line-height: 1.35 !important;
  }
}

/* Sangat kecil: baru ditumpuk agar tidak sesak */
@media (max-width: 390px) {
  .aicief-journal-profile__meta-item,
  .aicief-journal-profile__meta-item--wide {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 1px !important;
    text-align: center !important;
  }

  .aicief-journal-profile__meta dt,
  .aicief-journal-profile__meta dd {
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    text-align: center !important;
    white-space: normal !important;
  }
}

/* =======================================================
   AICIEF FINAL V15
   BODY AMBIENT ACCENT
   -------------------------------------------------------
   Adaptasi konsep geometri diagonal dan dot field Portal
   UNZAH menjadi identitas AICIEF:
   - ivory conference canvas
   - teal ambient glow
   - copper/gold Islamic rings
   - subtle knowledge-network nodes
   - lebih banyak aksen pada sisi dan sepanjang halaman
   - tidak mengubah layout, card, header, atau footer
   ======================================================= */

:root {
  --aicief-body-bg-top: #f7f9f7;
  --aicief-body-bg-bottom: #f1f5f3;
  --aicief-body-teal: #075047;
  --aicief-body-teal-deep: #032f2c;
  --aicief-body-copper: #d9a64c;
  --aicief-body-copper-light: #efc875;
}

/* Base canvas */
html {
  background: var(--aicief-body-bg-bottom) !important;
}

body {
  position: relative !important;
  isolation: isolate !important;
  min-height: 100vh !important;

  background-color: var(--aicief-body-bg-bottom) !important;
  background-image:
    radial-gradient(
      circle at 14% 7%,
      rgba(239, 200, 117, 0.15) 0%,
      rgba(239, 200, 117, 0.055) 16%,
      transparent 34%
    ),
    radial-gradient(
      circle at 88% 18%,
      rgba(7, 80, 71, 0.11) 0%,
      rgba(7, 80, 71, 0.035) 18%,
      transparent 38%
    ),
    radial-gradient(
      circle at 8% 72%,
      rgba(217, 166, 76, 0.10) 0%,
      rgba(217, 166, 76, 0.035) 19%,
      transparent 39%
    ),
    radial-gradient(
      circle at 92% 88%,
      rgba(3, 47, 44, 0.09) 0%,
      rgba(3, 47, 44, 0.025) 21%,
      transparent 42%
    ),
    linear-gradient(
      180deg,
      var(--aicief-body-bg-top) 0%,
      #f5f8f6 46%,
      var(--aicief-body-bg-bottom) 100%
    ) !important;

  background-attachment:
    fixed,
    fixed,
    fixed,
    fixed,
    fixed !important;

  overflow-x: hidden !important;
}

/*
 * Layer 1:
 * dot field + diagonal knowledge grid + small nodes.
 */
body::before {
  content: "" !important;
  display: block !important;

  position: fixed !important;
  inset: 0 !important;
  z-index: 0 !important;

  pointer-events: none !important;

  background-image:
    /* node glows */
    radial-gradient(
      circle at 6% 19%,
      rgba(239, 200, 117, 0.76) 0 1.5px,
      rgba(217, 166, 76, 0.18) 2px 7px,
      transparent 8px
    ),
    radial-gradient(
      circle at 17% 44%,
      rgba(7, 80, 71, 0.50) 0 1.5px,
      rgba(7, 80, 71, 0.10) 2px 6px,
      transparent 7px
    ),
    radial-gradient(
      circle at 8% 81%,
      rgba(239, 200, 117, 0.64) 0 1.5px,
      rgba(217, 166, 76, 0.14) 2px 7px,
      transparent 8px
    ),
    radial-gradient(
      circle at 94% 25%,
      rgba(239, 200, 117, 0.72) 0 1.5px,
      rgba(217, 166, 76, 0.16) 2px 7px,
      transparent 8px
    ),
    radial-gradient(
      circle at 84% 58%,
      rgba(7, 80, 71, 0.48) 0 1.5px,
      rgba(7, 80, 71, 0.10) 2px 6px,
      transparent 7px
    ),
    radial-gradient(
      circle at 96% 84%,
      rgba(239, 200, 117, 0.62) 0 1.5px,
      rgba(217, 166, 76, 0.13) 2px 7px,
      transparent 8px
    ),

    /* diagonal connection lines */
    linear-gradient(
      16deg,
      transparent 0%,
      transparent 11.8%,
      rgba(217, 166, 76, 0.055) 11.95%,
      rgba(217, 166, 76, 0.055) 12.05%,
      transparent 12.2%,
      transparent 100%
    ),
    linear-gradient(
      -14deg,
      transparent 0%,
      transparent 87.7%,
      rgba(7, 80, 71, 0.045) 87.85%,
      rgba(7, 80, 71, 0.045) 87.95%,
      transparent 88.1%,
      transparent 100%
    ),

    /* subtle conference grid */
    repeating-linear-gradient(
      45deg,
      transparent 0 52px,
      rgba(3, 47, 44, 0.018) 53px 54px,
      transparent 55px 108px
    ),
    repeating-linear-gradient(
      -45deg,
      transparent 0 58px,
      rgba(217, 166, 76, 0.017) 59px 60px,
      transparent 61px 120px
    ),

    /* fine dot matrix */
    radial-gradient(
      circle,
      rgba(7, 80, 71, 0.095) 0 0.85px,
      transparent 1.2px
    ) !important;

  background-size:
    100% 100%,
    100% 100%,
    100% 100%,
    100% 100%,
    100% 100%,
    100% 100%,
    100% 100%,
    100% 100%,
    auto,
    auto,
    27px 27px !important;

  background-position:
    center,
    center,
    center,
    center,
    center,
    center,
    center,
    center,
    center,
    center,
    center !important;

  opacity: 0.72 !important;

  mask-image:
    linear-gradient(
      to bottom,
      transparent 0%,
      #000 8%,
      #000 92%,
      transparent 100%
    ) !important;

  -webkit-mask-image:
    linear-gradient(
      to bottom,
      transparent 0%,
      #000 8%,
      #000 92%,
      transparent 100%
    ) !important;
}

/*
 * Layer 2:
 * large Islamic ring ornaments on four page zones.
 * These remain at the edges and never obstruct text.
 */
body::after {
  content: "" !important;
  display: block !important;

  position: fixed !important;
  inset: -18px !important;
  z-index: 0 !important;

  pointer-events: none !important;

  background:
    /* upper-left rings */
    radial-gradient(
      circle at -1% 16%,
      transparent 0 58px,
      rgba(217, 166, 76, 0.16) 59px 61px,
      transparent 62px 79px,
      rgba(7, 80, 71, 0.075) 80px 82px,
      transparent 83px 102px,
      rgba(217, 166, 76, 0.075) 103px 105px,
      transparent 106px
    ),

    /* upper-right rings */
    radial-gradient(
      circle at 101% 31%,
      transparent 0 68px,
      rgba(7, 80, 71, 0.105) 69px 71px,
      transparent 72px 92px,
      rgba(217, 166, 76, 0.14) 93px 95px,
      transparent 96px 117px,
      rgba(7, 80, 71, 0.055) 118px 120px,
      transparent 121px
    ),

    /* lower-left rings */
    radial-gradient(
      circle at 1% 69%,
      transparent 0 76px,
      rgba(7, 80, 71, 0.095) 77px 79px,
      transparent 80px 102px,
      rgba(217, 166, 76, 0.13) 103px 105px,
      transparent 106px 130px,
      rgba(7, 80, 71, 0.05) 131px 133px,
      transparent 134px
    ),

    /* lower-right rings */
    radial-gradient(
      circle at 99% 87%,
      transparent 0 61px,
      rgba(217, 166, 76, 0.145) 62px 64px,
      transparent 65px 84px,
      rgba(7, 80, 71, 0.085) 85px 87px,
      transparent 88px 109px,
      rgba(217, 166, 76, 0.06) 110px 112px,
      transparent 113px
    ),

    /* side diamonds inspired by portal geometry */
    linear-gradient(
      45deg,
      transparent 0%,
      transparent 9%,
      rgba(217, 166, 76, 0.027) 9.2%,
      rgba(217, 166, 76, 0.027) 12.5%,
      transparent 12.7%,
      transparent 100%
    ),
    linear-gradient(
      -45deg,
      transparent 0%,
      transparent 86.7%,
      rgba(7, 80, 71, 0.024) 86.9%,
      rgba(7, 80, 71, 0.024) 90.1%,
      transparent 90.3%,
      transparent 100%
    ) !important;

  opacity: 0.90 !important;

  transform: translate3d(0, 0, 0) scale(1.01);
  transform-origin: center center;

  will-change: transform, opacity;

  animation:
    aiciefBodyOrnamentDrift 34s ease-in-out infinite alternate !important;
}

/* Keep every OJS page above ambient layers */
.pkp_structure_page {
  position: relative !important;
  z-index: 2 !important;
  background: transparent !important;
}

/* Content stays readable while ambient accents remain visible outside */
.pkp_structure_content {
  position: relative !important;
  z-index: 2 !important;
}

/* Slightly warmer glass on desktop main wrapper */
@media (min-width: 901px) {
  .pkp_structure_content.has_sidebar {
    background:
      linear-gradient(
        145deg,
        rgba(255, 255, 255, 0.78) 0%,
        rgba(252, 250, 244, 0.70) 100%
      ) !important;

    border-color: rgba(3, 72, 63, 0.10) !important;

    box-shadow:
      0 20px 46px rgba(2, 44, 41, 0.105),
      inset 0 1px 0 rgba(255, 255, 255, 0.88) !important;

    backdrop-filter: blur(3px) saturate(1.03) !important;
    -webkit-backdrop-filter: blur(3px) saturate(1.03) !important;
  }
}

@keyframes aiciefBodyOrnamentDrift {
  0% {
    transform: translate3d(-4px, 3px, 0) scale(1.005);
    opacity: 0.82;
  }

  50% {
    transform: translate3d(5px, -4px, 0) scale(1.015);
    opacity: 0.96;
  }

  100% {
    transform: translate3d(2px, 5px, 0) scale(1.008);
    opacity: 0.86;
  }
}

/* Tablet: accents remain visible but calmer */
@media (max-width: 992px) {
  body::before {
    opacity: 0.50 !important;
  }

  body::after {
    opacity: 0.66 !important;
  }
}

/* Mobile: fewer visual distractions */
@media (max-width: 768px) {
  body {
    background-image:
      radial-gradient(
        circle at 15% 7%,
        rgba(239, 200, 117, 0.11) 0%,
        transparent 30%
      ),
      radial-gradient(
        circle at 88% 80%,
        rgba(7, 80, 71, 0.07) 0%,
        transparent 38%
      ),
      linear-gradient(
        180deg,
        #f7f9f7 0%,
        #f2f6f4 100%
      ) !important;
  }

  body::before {
    opacity: 0.30 !important;
    background-size:
      100% 100%,
      100% 100%,
      100% 100%,
      100% 100%,
      100% 100%,
      100% 100%,
      100% 100%,
      100% 100%,
      auto,
      auto,
      32px 32px !important;
  }

  body::after {
    inset: -30px !important;
    opacity: 0.42 !important;
  }
}

@media (max-width: 480px) {
  body::before {
    opacity: 0.22 !important;
  }

  body::after {
    opacity: 0.30 !important;
  }
}

/* Accessibility */
@media (prefers-reduced-motion: reduce) {
  body::after {
    animation: none !important;
    transform: none !important;
  }
}

@media (prefers-reduced-transparency: reduce) {
  body::before,
  body::after {
    opacity: 0.16 !important;
  }

  @media (min-width: 901px) {
    .pkp_structure_content.has_sidebar {
      background: rgba(255, 255, 255, 0.94) !important;
      backdrop-filter: none !important;
      -webkit-backdrop-filter: none !important;
    }
  }
}

/* =======================================================
   AICIEF FINAL V16
   MOBILE JOURNAL PROFILE COLOUR + HOVER FIX
   -------------------------------------------------------
   Memperbaiki konflik selector lama pada additional_content:
   - warna judul dan metadata
   - warna link ISSN
   - warna tombol submit
   - hover tombol dan link
   - hover card/cover yang lebih halus
   ======================================================= */

:root {
  --aicief-profile16-deep: #032f2c;
  --aicief-profile16-mid: #075047;
  --aicief-profile16-gold: #d9a64c;
  --aicief-profile16-gold-light: #efc875;
  --aicief-profile16-text: #405852;
  --aicief-profile16-muted: #667873;
}

/* Berlaku umum agar desktop dan mobile konsisten */
.page_index_journal
.additional_content
section.additional_content
.aicief-journal-profile__title {
  color: var(--aicief-profile16-deep) !important;
  text-shadow: none !important;
}

.page_index_journal
.additional_content
section.additional_content
.aicief-journal-profile__meta dt {
  color: var(--aicief-profile16-mid) !important;
  font-weight: 850 !important;
}

.page_index_journal
.additional_content
section.additional_content
.aicief-journal-profile__meta dd {
  color: var(--aicief-profile16-text) !important;
  font-weight: 600 !important;
}

/* Link ISSN mengalahkan aturan link generic additional_content */
.page_index_journal
.additional_content
section.additional_content
.aicief-journal-profile__meta a,
.page_index_journal
.additional_content
section.additional_content
.aicief-journal-profile__meta a:visited {
  color: var(--aicief-profile16-mid) !important;
  font-weight: 850 !important;
  text-decoration: none !important;
  text-decoration-color: transparent !important;
  text-underline-offset: 3px !important;
  transition:
    color .20s ease,
    text-decoration-color .20s ease,
    text-shadow .20s ease !important;
}

.page_index_journal
.additional_content
section.additional_content
.aicief-journal-profile__meta a:hover,
.page_index_journal
.additional_content
section.additional_content
.aicief-journal-profile__meta a:focus {
  color: #a36f18 !important;
  text-decoration: underline !important;
  text-decoration-color: rgba(217,166,76,.78) !important;
  text-shadow: 0 0 10px rgba(217,166,76,.12) !important;
}

/* Eyebrow */
.page_index_journal
.additional_content
section.additional_content
.aicief-journal-profile__eyebrow {
  color: var(--aicief-profile16-deep) !important;
  background:
    linear-gradient(
      135deg,
      var(--aicief-profile16-gold-light),
      var(--aicief-profile16-gold)
    ) !important;
}

/* Tombol submit: selector dibuat lebih kuat daripada selector lama */
.page_index_journal
.additional_content
section.additional_content
.aicief-journal-profile__submit,
.page_index_journal
.additional_content
section.additional_content
.aicief-journal-profile__submit:visited {
  color: var(--aicief-profile16-gold-light) !important;
  text-decoration: none !important;
  text-decoration-color: transparent !important;

  border-color: rgba(217,166,76,.62) !important;
  background:
    linear-gradient(
      135deg,
      var(--aicief-profile16-deep) 0%,
      var(--aicief-profile16-mid) 100%
    ) !important;

  box-shadow:
    0 7px 16px rgba(2,44,41,.18),
    inset 0 1px 0 rgba(255,255,255,.06) !important;
}

/* Pastikan ikon dan seluruh span mengikuti warna tombol */
.page_index_journal
.additional_content
section.additional_content
.aicief-journal-profile__submit *,
.page_index_journal
.additional_content
section.additional_content
.aicief-journal-profile__submit::before,
.page_index_journal
.additional_content
section.additional_content
.aicief-journal-profile__submit::after {
  color: inherit !important;
  text-decoration: none !important;
}

.page_index_journal
.additional_content
section.additional_content
.aicief-journal-profile__submit:hover,
.page_index_journal
.additional_content
section.additional_content
.aicief-journal-profile__submit:focus {
  color: var(--aicief-profile16-deep) !important;
  text-decoration: none !important;

  border-color: var(--aicief-profile16-gold-light) !important;
  background:
    linear-gradient(
      135deg,
      var(--aicief-profile16-gold-light) 0%,
      var(--aicief-profile16-gold) 100%
    ) !important;

  transform: translateY(-2px) !important;

  box-shadow:
    0 10px 21px rgba(2,44,41,.22),
    inset 0 1px 0 rgba(255,255,255,.44) !important;
}

/* Hover card dan cover dibuat halus */
.aicief-journal-profile__inner {
  transition:
    border-color .24s ease,
    box-shadow .24s ease,
    transform .24s ease !important;
}

.aicief-journal-profile__cover,
.aicief-journal-profile__cover img {
  transition:
    transform .24s ease,
    box-shadow .24s ease,
    filter .24s ease !important;
}

@media (hover: hover) and (pointer: fine) {
  .aicief-journal-profile__inner:hover {
    border-color: rgba(217,166,76,.52) !important;
    box-shadow:
      0 17px 34px rgba(2,44,41,.13),
      inset 0 1px 0 rgba(255,255,255,.98) !important;
  }

  .aicief-journal-profile__inner:hover
  .aicief-journal-profile__cover {
    transform: translateY(-2px) !important;
    box-shadow:
      0 13px 25px rgba(2,44,41,.20) !important;
  }

  .aicief-journal-profile__inner:hover
  .aicief-journal-profile__cover img {
    transform: scale(1.015) !important;
    filter: saturate(1.02) contrast(1.01) !important;
  }
}

/* Mobile-specific visual balance */
@media (max-width: 560px) {
  .page_index_journal
  .additional_content
  section.additional_content
  .aicief-journal-profile__title {
    color: var(--aicief-profile16-deep) !important;
    font-weight: 900 !important;
    letter-spacing: -.008em !important;
  }

  .page_index_journal
  .additional_content
  section.additional_content
  .aicief-journal-profile__meta dt {
    color: var(--aicief-profile16-mid) !important;
  }

  .page_index_journal
  .additional_content
  section.additional_content
  .aicief-journal-profile__meta dd {
    color: #465d57 !important;
  }

  .page_index_journal
  .additional_content
  section.additional_content
  .aicief-journal-profile__submit,
  .page_index_journal
  .additional_content
  section.additional_content
  .aicief-journal-profile__submit:visited {
    color: var(--aicief-profile16-gold-light) !important;
    font-weight: 900 !important;
  }

  .page_index_journal
  .additional_content
  section.additional_content
  .aicief-journal-profile__submit:active {
    color: var(--aicief-profile16-deep) !important;
    background:
      linear-gradient(
        135deg,
        var(--aicief-profile16-gold-light),
        var(--aicief-profile16-gold)
      ) !important;
    transform: translateY(0) scale(.985) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .aicief-journal-profile__inner,
  .aicief-journal-profile__cover,
  .aicief-journal-profile__cover img,
  .page_index_journal
  .additional_content
  section.additional_content
  .aicief-journal-profile__submit {
    transition: none !important;
  }
}