/*
	Eprints free theme for branding your repository.
	Modified & Optimized by Jushadi Arman Saz
*/

/* --- OVERRIDE WARNA AKSEN BAWAAN & FIX GAP HEADER --- */
#header { 
    border-bottom: solid 5px #2ebaae !important; 
    padding-top: 1.5em !important; 
}
header.major > :last-child { border-bottom: solid 3px #2ebaae !important; }
#footer .copyright a { color: #2ebaae !important; }

/* --- FIX: MERAPATKAN IKON SOSIAL MEDIA (DESKTOP SAJA) --- */
.social-buttons { 
    display: flex; 
    justify-content: flex-end; 
    gap: 5px !important; 
    margin-top: 5px; 
}
.social-buttons a { 
    display: inline-block; 
    padding: 8px 10px !important; 
    border-radius: 5px; 
    font-size: 16px !important; 
    /* Transisi dengan timing kubik untuk efek memantul halus */
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) !important; 
}

.social-buttons a:hover { 
    /* Ikon naik ke atas 4px dan membesar 1.15 kali lipat */
    transform: translateY(-4px) scale(1.15) !important; 
    /* Memberikan efek bayangan jatuh agar terlihat timbul/3D */
    filter: drop-shadow(0 4px 6px rgba(0,0,0,0.2)) !important; 
}
.btn-fb { background-color: #3b5998; }
.btn-tiktok { background-color: #000000; }
.btn-yt { background-color: #ff0000; }
.btn-ig { background-color: #e1306c; }

/* --- HERO BANNER & SEARCH (HOMEPAGE) --- */
.hero-banner { 
    position: relative; 
    background-image: url('/images/hero-bg.jpg'); 
    background-size: cover; 
    background-position: center; 
    border-radius: 12px; 
    padding: 100px 20px; 
    text-align: center; 
    margin-bottom: 40px; 
    margin-top: -10px; 
    overflow: hidden; 
    box-shadow: 0 10px 30px rgba(0,0,0,0.1); 
}
.hero-overlay { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.65); z-index: 1; }
.hero-content { position: relative; z-index: 2; }
.hero-content h2 { color: #ffffff; font-size: 2.8em; font-weight: 600; margin-bottom: 15px; border-bottom: none; letter-spacing: 1px; }
.hero-content p { color: #e1e4e5; font-size: 1.2em; margin-bottom: 35px; }

/* Kotak Pencarian Raksasa */
.hero-search-box { display: flex; max-width: 650px; margin: 0 auto; background: #fff; border-radius: 50px; overflow: hidden; box-shadow: 0 5px 25px rgba(0,0,0,0.3); }
.hero-search-box input[type="text"] { flex: 1; border: none !important; padding: 18px 25px !important; font-size: 1.1em !important; outline: none !important; background: transparent !important; box-shadow: none !important; font-family: 'Montserrat', sans-serif; margin-bottom: 0 !important; }
.hero-search-box button { background-color: #2c3e50 !important; color: #fff !important; border: none !important; padding: 0 35px !important; font-size: 1.3em !important; cursor: pointer; transition: background 0.3s !important; border-radius: 0 !important; margin: 0 !important; }
.hero-search-box button:hover { background-color: #2ebaae !important; }

/* Styling Modern Grid untuk Halaman Depan */
.modern-grid-container { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 20px; margin: 20px 0; }
.modern-card { background: #ffffff; border: 1px solid rgba(0, 0, 0, 0.06); border-radius: 12px; padding: 25px; text-decoration: none; color: inherit; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.03); transition: all 0.3s ease; display: flex; flex-direction: column; position: relative; overflow: hidden; }
.modern-card:hover { transform: translateY(-5px); box-shadow: 0 10px 30px rgba(46, 186, 174, 0.15); border-color: #2ebaae; }
.modern-card .card-icon { font-size: 24px; color: #2ebaae; margin-bottom: 15px; background: rgba(46, 186, 174, 0.1); width: 50px; height: 50px; display: flex; align-items: center; justify-content: center; border-radius: 10px; }
.modern-card h3 { font-size: 1.1rem; font-weight: 700; color: #2c3e50; margin-bottom: 8px; text-transform: none; }
.modern-card p { font-size: 0.90rem; color: #7f8c8d; line-height: 1.5; margin: 0; }

/* --- OVERRIDE MODERNISASI FORM SEARCH & ADVANCED SEARCH EPRINTS --- */
table.ep_search_fields { width: 100%; max-width: 900px; margin: 0 auto; border-collapse: separate; border-spacing: 0 15px; }
table.ep_search_fields th { font-weight: 600; color: #2c3e50; padding: 10px 15px 10px 0; text-align: right; vertical-align: top; width: 25%; border-bottom: none; line-height: 2.5; }
table.ep_search_fields td { padding: 5px 10px; border-bottom: none; vertical-align: top; }
input.ep_form_text, input#q { width: 100%; max-width: 500px; padding: 12px 15px; border: 1px solid #d2d2d2; border-radius: 8px; font-family: 'Montserrat', sans-serif; font-size: 14px; color: #3c3b3b; background-color: #fafafa; transition: all 0.3s ease; display: inline-block; vertical-align: middle; }
select.ep_form_select, td.ep_multi_input select { padding: 11px 15px; border: 1px solid #d2d2d2; border-radius: 8px; font-family: 'Montserrat', sans-serif; font-size: 14px; background-color: #fafafa; display: inline-block; vertical-align: middle; margin-right: 8px; margin-bottom: 5px; }
select[multiple] { width: 100%; max-width: 600px; min-height: 180px; padding: 10px; }
input.ep_form_text:focus, input#q:focus, select:focus { border-color: #2ebaae; background-color: #ffffff; box-shadow: 0 0 8px rgba(46, 186, 174, 0.2); outline: none; }
td.ep_multi_input table td { padding: 5px 15px 5px 0 !important; }
input.ep_form_checkbox { transform: scale(1.2); margin-right: 8px; accent-color: #2ebaae; cursor: pointer; }
label { cursor: pointer; font-weight: 500; color: #555; }
.ep_form_action_button, input[type="submit"], input[type="button"] { background-color: #2ebaae !important; color: #ffffff !important; padding: 12px 25px !important; border-radius: 8px !important; border: none !important; font-family: 'Montserrat', sans-serif; font-weight: 600; font-size: 13px; letter-spacing: 1px; text-transform: uppercase; cursor: pointer; box-shadow: 0 4px 15px rgba(46, 186, 174, 0.2) !important; transition: all 0.3s ease !important; margin-right: 10px; margin-bottom: 10px; display: inline-block; }
.ep_form_action_button:hover, input[type="submit"]:hover { background-color: #24998f !important; transform: translateY(-2px); box-shadow: 0 6px 20px rgba(46, 186, 174, 0.3) !important; }
input[name="_action_newsearch"] { background-color: #7f8c8d !important; box-shadow: none !important; }
input[name="_action_newsearch"]:hover { background-color: #636e72 !important; }
.ep_search_buttons { text-align: center; margin: 25px 0; }

/* ----- Reset ----- */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, caption, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
body { line-height: 1; color: #5D5D5D; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
body { -webkit-text-size-adjust: none; }

/* ePrints Search Box */
.search-box{ width: 100%; height: 50px; }
.container-4{ overflow: hidden; width: 100%; vertical-align: middle; white-space: nowrap; }
.container-4 input#search{ width: 100%; height: 50px; border: 1px solid #d2d2d2; float: left; color: #3c3b3b; padding-left: 15px; padding-right: 60px; border-radius: 4px; font-size: 14px; font-weight: 400; font-family: 'Montserrat', sans-serif; letter-spacing: 0.07em; }
.container-4 button.icon{ border-top-right-radius: 4px; border-bottom-right-radius: 4px; border: none; background: #2ebaae; height: 50px; width: 50px; color: #fff; opacity: 0; font-size: 12pt; transition: all .55s ease; }
.container-4:hover button.icon, .container-4:active button.icon, .container-4:focus button.icon{ outline: none; opacity: 1; margin-left: -50px; }
.container-4:hover button.icon:hover{ background: #3c3b3b; }

/* Custom CSS */
.list-group { list-style: none; padding-left: 0; font-family: 'Raleway', sans-serif; font-size: 11px; font-weight: 800; letter-spacing: 0.35em; list-style: none; margin-bottom: 0; padding: 0; text-transform: uppercase; }
.list-group li { line-height: 40px; border-bottom: 1px solid #dbdfe1; }
.list-group-item { padding: 0 0 0 15px; }
.list-group-item a { color: #3c3b3b; }
.list-group-item a:hover { color: #2ebaae; }
.list-group-item.active a{ color: #fff; }
.list-group-item.active, .list-group-item.active:hover, .list-group-item.active:focus { text-transform: uppercase; background-color: #2ebaae; padding: 1em 0 1em 15px; color: #ffffff; line-height: 2em; }

/* Box Model & Basic */
*, *:before, *:after { box-sizing: border-box; }
@-ms-viewport { width: device-width; }
body { -ms-overflow-style: scrollbar; background: #ffffff; }

/* Type */
body, select, textarea { font-family: "Raleway", sans-serif; font-size: 14px; font-weight: 400; letter-spacing: 0.03em; line-height: 1.65; }
a { text-decoration: none; }
a:hover { color: #2ebaae; }
strong, b { color: #3d4449; font-weight: 600; }
em, i { font-style: italic; }
h1, h2, h3, h4, h5, h6 { color: #3d4449; font-family: "Raleway", sans-serif; font-weight: 500; line-height: 1.5; margin: 0 0 1em 0; }
h1 { font-size: 1em; margin: 0 0 0.5em 0; line-height: 1.3; text-align: none; }
h2 { font-size: 1.75em; }
h3 { font-size: 1.25em; }
h4 { font-size: 1.1em; }

header p { font-family: "Raleway", sans-serif; font-size: 1em; font-weight: 400; letter-spacing: 0.075em; margin-top: -0.5em; text-transform: uppercase; }
header.major > :last-child { border-bottom: solid 3px #f56a6a; display: inline-block; }

/* Wrapper */
#wrapper { display: flex; flex-direction: row-reverse; min-height: 100vh; }
#main { flex-grow: 1; flex-shrink: 1; width: 100%; margin-bottom: 50px; }
#main > .inner { padding: 0 6em 0.1em 6em ; margin: 0 auto; max-width: 110em; }

/* Sidebar */
#sidebar { flex-grow: 0; flex-shrink: 0; transition: margin-left 0.5s ease, box-shadow 0.5s ease; background-color: #f5f6f7; font-size: 0.9em; position: relative; width: 26em; }
#sidebar > .inner { padding: 2.22222em 2.22222em 2.44444em 2.22222em ; position: relative; width: 26em; }
#sidebar > .inner > * { padding: 0 0 25px 0; }
#sidebar > .inner > .alt { background-color: #eff1f2; border-bottom: 0; margin: -2.22222em 0 4.44444em -2.22222em; padding: 2.22222em; width: calc(100% + 4.44444em); }

/* Tombol Animasi Burger ke X (Desktop & Mobile) */
#sidebar .toggle { text-decoration: none; border: 0; display: block; height: 7.5em; left: 26em; line-height: 7.5em; outline: 0; overflow: hidden; position: absolute; text-align: center; text-indent: 7.5em; top: 0; width: 6em; z-index: 10000; }
#sidebar a.toggle:after { display: none !important; }
#sidebar a.toggle:before { font-family: FontAwesome; font-style: normal; font-weight: normal; text-transform: none !important; content: '\f00d' !important; color: #e74c3c !important; font-size: 1.8rem !important; margin-left: -0.0625em; margin-top: -0.25em; position: absolute; left: 0; top: 0; height: inherit; line-height: inherit; text-indent: 0; width: inherit; z-index: 1; transform: rotate(90deg); transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) !important; }
#sidebar.inactive a.toggle:before { content: '\f0c9' !important; color: #2ebaae !important; font-size: 1.6rem !important; transform: rotate(0deg); }
#sidebar.inactive { margin-left: -26em; }

@media screen and (max-width: 1680px) {
    #sidebar { width: 24em; }
    #sidebar > .inner { padding: 1.66667em 1.66667em 1.33333em 1.66667em ; width: 24em; }
    #sidebar > .inner > .alt { margin: -1.66667em 0 3.33333em -1.66667em; padding: 1.66667em; width: calc(100% + 3.33333em); }
    #sidebar .toggle { height: 6.25em; left: 24em; line-height: 6.25em; text-indent: 5em; width: 5em; }
    #sidebar.inactive { margin-left: -24em; }
}
@media screen and (max-width: 1280px) {
    #sidebar { box-shadow: 0 0 5em 0 rgba(0, 0, 0, 0.175); height: 100%; left: 0; position: fixed; top: 0; z-index: 10000; }
    #sidebar.inactive { box-shadow: none; }
    #sidebar > .inner { -webkit-overflow-scrolling: touch; height: 100%; left: 0; overflow-x: hidden; overflow-y: auto; position: absolute; top: 0; }
    #sidebar > .inner:after { content: ''; display: block; height: 4em; width: 100%; }
    #sidebar .toggle { text-indent: 6em; width: 6em; }
}

/* Header */
#header { display: flex; border-bottom: solid 5px #f56a6a; padding: 6em 0 1em 0; position: relative; margin-bottom: 20px; }
#header > * { flex: 1; margin-bottom: 0; }
#header .logo { border-bottom: 0; color: inherit; font-family: 'Raleway', sans-serif; font-size: 12px; font-weight: 800; letter-spacing: 0.35em; padding: 0; text-transform: uppercase; }

/* Menu Sidebar Kiri */
#menu ul { user-select: none; color: #3d4449; font-family: 'Raleway', sans-serif; font-size: 11px; font-weight: 800; letter-spacing: 0.35em; list-style: none; margin-bottom: 0; padding: 0; text-transform: uppercase; }		
#menu ul a, #menu ul span { border-bottom: 0; color: inherit; cursor: pointer; display: block; padding: 0.625em 0; }
#menu ul a.opener, #menu ul span.opener { transition: color 0.2s ease-in-out; text-decoration: none; position: relative; }
#menu ul a.opener:before, #menu ul span.opener:before { font-family: FontAwesome; transition: color 0.2s ease-in-out, transform 0.2s ease-in-out; color: #9fa3a6; content: '\f078'; position: absolute; right: 0; }
#menu ul a.opener.active + ul, #menu ul span.opener.active + ul { display: block; }
#menu ul a.opener.active:before, #menu ul span.opener.active:before { transform: rotate(-180deg); }
#menu > ul > li { border-top: solid 1px rgba(210, 215, 217, 0.75); padding: 1em 0 1em 15px; line-height: 1em; }
#menu > ul > li:last-child { border-bottom: solid 1px rgba(210, 215, 217, 0.75); }
#menu > ul > li > ul { color: #9fa3a6; display: none; margin: 0.5em 0 1.5em -1.5em; }
#menu > ul > li > ul a:before { content: "\f054"; font-family: FontAwesome; margin-right: 4px; color: #555555; font-size: 9px; position: relative; top: -1px; }
#menu > ul > li > ul a, #menu > ul > li > ul span { font-size: 11px; font-weight: 400; color: #3c3b3b; }
#menu > ul > li > ul > li { margin: 0.125em 0 0 0; padding: 1em 0 1em 25px; border-bottom: 1px solid; }
#menu > ul > li:first-child { border-top: 3px solid; margin-top: 0; padding-top: 1em; }

/* Footer */
#footer .copyright { color: #9fa3a6; font-size: 0.9em; }
#footer .copyright a { border-bottom: dotted 1px; color: #f56a6a; text-decoration: none; }

/* --- MODERNISASI KARTU BROWSE KHUSUS TAHUN (AGAR DIVISION & SUBJECT TIDAK RUSAK) --- */
/* ==========================================================
   1. BROWSE BY YEAR (KOTAK TAHUN SERAGAM & TOTAL ITEM MUNCUL)
   ========================================================== */
.ep_view_menu .ep_view_intro {
    font-size: 1.1em;
    color: #7f8c8d;
    margin-bottom: 25px;
    border-left: 4px solid #2ebaae;
    padding-left: 15px;
    font-family: 'Raleway', sans-serif;
}

.ep_view_menu > ul {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* Kotak Tahun (Hanya untuk level tunggal/tahun, tidak merusak Division/Subject) */
/* Pastikan seluruh elemen di dalam <li> (termasuk teks angka di luar <a>) ikut diatur ke dalam kotak */
.ep_view_menu > ul > li:not(:has(ul)) {
    flex: 0 0 190px !important;
    background: #fff;
    border: 1px solid #e1e4e5;
    border-radius: 8px;
    padding: 0 !important;
    box-shadow: 0 4px 10px rgba(0,0,0,0.03);
    transition: all 0.3s ease;
    
    /* Jadikan <li> sebagai Flexbox agar teks tahun dan angka di luarnya masuk ke dalam kotak */
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
}

.ep_view_menu > ul > li:not(:has(ul)):hover {
    box-shadow: 0 8px 25px rgba(46, 186, 174, 0.15);
    border-color: #2ebaae;
    transform: translateY(-3px);
}

/* Memaksa tautan (a) di dalam kotak mengambil ruang atas */
.ep_view_menu > ul > li:not(:has(ul)) > a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    padding: 15px 15px 5px 15px !important; /* Padding atas-samping besar, bawah tipis */
    color: #2c3e50 !important;
    font-family: 'Montserrat', sans-serif;
    font-size: 1.3em !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    text-align: center !important;
    transition: color 0.3s ease !important;
}

.ep_view_menu > ul > li:not(:has(ul)):hover > a {
    color: #2ebaae !important;
}

/* Mengatur teks angka total item yang ada di luar tag <a> agar masuk ke bagian bawah kotak */
.ep_view_menu > ul > li:not(:has(ul)) {
    font-family: 'Montserrat', sans-serif;
    font-size: 0.9em;
    color: #7f8c8d;
    padding-bottom: 12px !important; /* Memberikan ruang napas di bagian bawah kotak */
}

/* ==========================================================
   2. BROWSE BY AUTHOR & JUMP TO (HILANGKAN GARIS | & RAPATKAN)
   ========================================================== */
.ep_toolbox {
    background: #fff;
    border: 1px solid #e1e4e5;
    border-radius: 8px;
    padding: 0px;
    margin-bottom: 30px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.02);
}

/* Wadah Toolbox A-Z: Menyusun tombol secara rapat dan terpusat */
.ep_toolbox_content {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 6px !important; 
    font-size: 0 !important; /* Trik mutlak melenyapkan karakter teks mentah | */
}

/* Menghapus total elemen teks mentah yang tidak diinginkan (seperti sisa simbol |) */
.ep_toolbox_content > *:not(a):not(b):not(strong):not(span.ep_search_control) {
    display: none !important;
}

/* Tombol Huruf A-Z (Author & Jump To) */
.ep_toolbox_content a, 
.ep_toolbox_content b, 
.ep_toolbox_content strong,
.ep_toolbox_content span.ep_search_control,
.ep_view_jump_to a {
    font-size: 14px !important; 
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 38px !important;
    height: 38px !important;
    background: #f8f9fa !important;
    border: 1px solid #d2d2d2 !important;
    border-radius: 6px !important;
    color: #5D5D5D !important;
    text-decoration: none !important;
    font-weight: 700 !important;
    margin: 0 !important;
    transition: all 0.2s ease !important;
}

/* Efek Hover Tombol A-Z */
.ep_toolbox_content a:hover, .ep_view_jump_to a:hover {
    background: #2ebaae !important;
    color: #fff !important;
    border-color: #2ebaae !important;
    transform: translateY(-2px);
    box-shadow: 0 4px 10px rgba(46, 186, 174, 0.2);
}

/* Huruf abjad yang sedang aktif/dipilih */
.ep_toolbox_content b,
.ep_toolbox_content strong,
.ep_view_jump_to b, .ep_view_jump_to strong {
    background: #2ebaae !important;
    color: #fff !important;
    border-color: #2ebaae !important;
    box-shadow: 0 4px 10px rgba(46, 186, 174, 0.3);
}

/* Wadah Jump To (Navigasi Abjad Halaman View) */
.ep_view_jump, .irstats2_view_jump {
    background: #fff;
    border: 1px solid #e1e4e5;
    border-radius: 8px;
    padding: 20px;
    margin-bottom: 25px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.02);
    text-align: center;
}

.ep_view_jump_to {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 6px !important;
    font-size: 0 !important; /* Lenyapkan garis | di Jump To */
    margin-top: 10px;
}

.ep_view_jump_to > *:not(a):not(b):not(strong) {
    display: none !important;
}


/* ==========================================================
   3. PENGATURAN UMUM & CORPORATE FOOTER
   ========================================================== */
.ep_view_menu h2, .ep_view_page h2 { 
    font-family: 'Montserrat', sans-serif; color: #2c3e50; font-size: 1.8em; margin-top: 10px; margin-bottom: 25px; padding-bottom: 10px; border-bottom: 3px solid #2ebaae; display: inline-block; 
}

table.ep_view_cols { display: block; width: 100%; }
table.ep_view_cols tbody { display: block; width: 100%; }
table.ep_view_cols tr { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 15px; width: 100%; }
table.ep_view_cols td { display: block; width: 100% !important; }
.ep_view_cols ul { list-style: none !important; padding: 0 !important; margin: 0 !important; }
.ep_view_cols ul li { background: #fff; border: 1px solid #e1e4e5; padding: 12px 15px; margin-bottom: 10px; border-radius: 6px; transition: all 0.2s ease; color: #7f8c8d; font-size: 0.9em; display: flex; justify-content: space-between; align-items: center; }
.ep_view_cols ul li:hover { border-color: #2ebaae; box-shadow: 0 4px 12px rgba(46, 186, 174, 0.1); transform: translateX(5px); }
.ep_view_cols ul li a { color: #2c3e50; text-decoration: none; font-weight: 700; font-size: 1.1em; margin-right: 10px; }
.ep_view_cols ul li:hover a { color: #2ebaae; }

.ep_view_page p { background: #fff; border: 1px solid #e1e4e5; border-radius: 8px; padding: 18px 20px; margin-bottom: 15px; box-shadow: 0 2px 10px rgba(0,0,0,0.02); transition: all 0.2s ease; line-height: 1.6; color: #5D5D5D; }
.ep_view_page p:hover { box-shadow: 0 6px 18px rgba(46, 186, 174, 0.12); border-color: #2ebaae; transform: translateY(-2px); }
.ep_view_page p .person_name { font-weight: 700; color: #2c3e50; }
.ep_view_page p a { color: #2ebaae; font-weight: 600; text-decoration: none; font-family: 'Montserrat', sans-serif; display: inline-block; margin-top: 5px; margin-bottom: 5px; }
.ep_view_page p a:hover { color: #1b8279; text-decoration: underline; }

.ep_view_group_by, .ep_view_jump { background: #f8f9fa; border: 1px solid #d2d2d2; padding: 12px 20px; border-radius: 6px; margin-bottom: 15px; font-size: 0.95em; color: #7f8c8d; }
.ep_view_group_by_current { font-weight: 700; color: #2c3e50; background: #e1e4e5; padding: 4px 10px; border-radius: 4px; }

/* Corporate Footer */
.corporate-footer { background-color: #cdd6c5; padding: 50px 20px 20px 20px; margin-top: 40px; }
.corporate-footer-container { display: flex; flex-wrap: wrap; max-width: 1100px; margin: 0 auto; gap: 30px; }
.corporate-col { flex: 1; min-width: 250px; }
.corporate-col-50 { flex: 2; }
.corporate-col h4 { font-family: 'Montserrat', sans-serif; font-size: 1.2em; color: #2c3e50; margin-bottom: 25px; font-weight: 600; position: relative; padding-bottom: 12px; display: inline-block; cursor: pointer; }
.corporate-col h4::after { content: ""; position: absolute; left: 0; bottom: 0; width: 45px; height: 2px; background-color: #2c3e50; transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275); }
.corporate-col h4:hover::after { width: 100%; background-color: #2ebaae; }
.corporate-col h4:hover { color: #2ebaae; }
.corporate-col ul { list-style: none !important; padding: 0 !important; margin: 0 !important; }
.corporate-col ul li { margin-bottom: 18px; }
.corporate-col ul li a { color: #4a5568; text-decoration: none; font-size: 0.95em; display: flex; align-items: flex-start; gap: 12px; transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275); }
.corporate-col ul li a:hover { color: #2ebaae; transform: translateX(6px); }
.corporate-col ul li a i { margin-top: 4px; color: #2c3e50; font-size: 1.1em; min-width: 20px; text-align: center; transition: all 0.3s ease; }
.corporate-col ul li a:hover i { color: #2ebaae; transform: scale(1.2); }
.corporate-col img { max-width: 120px; height: auto; transition: all 0.3s ease; }
.corporate-col a:hover img { transform: scale(1.08) translateY(-3px); filter: drop-shad

/* ==========================================================
   DESKTOP VIEW: HASIL PENCARIAN (Nomor, Teks, PDF Sejajar)
   ========================================================== */
tr.ep_search_result {
    background: #fff;
    border: 1px solid #e1e4e5 !important;
    border-radius: 8px;
    padding: 20px !important;
    margin-bottom: 15px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.02);
    /* KUNCI DESKTOP: Flexbox dengan 'nowrap' agar dilarang turun baris */
    display: flex !important;
    flex-direction: row !important;
    align-items: flex-start !important; 
    flex-wrap: nowrap !important; 
}

tr.ep_search_result:hover {
    box-shadow: 0 6px 18px rgba(46, 186, 174, 0.12);
    border-color: #2ebaae !important;
    transform: translateY(-2px);
}

tr.ep_search_result td {
    display: block !important;
    border: none !important;
    padding: 0 !important;
    text-align: left !important; /* Mencegah rata tengah/kanan yang tidak disengaja */
}

/* 1. Nomor Urut */
tr.ep_search_result td:nth-child(1) {
    flex: 0 0 auto !important;
    margin-right: 10px !important;
    font-weight: bold;
}

/* 2. Teks Dokumen */
tr.ep_search_result td:nth-child(2) {
    flex: 1 1 auto !important; 
    line-height: 1.6;
}

/* 3. Ikon PDF Desktop -> Rata Kanan */
tr.ep_search_result td:nth-child(3) {
    flex: 0 0 auto !important; 
    margin-left: 20px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-end !important;
}

tr.ep_search_result td:nth-child(3) > div {
    display: flex !important;
    flex-direction: row !important;
    gap: 5px !important;
}

tr.ep_search_result a.ep_document_link, 
a.ep_document_link {
    display: inline-flex !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
}

tr.ep_search_result p { margin-bottom: 5px; }
tr.ep_search_result a, .ep_name_citation { color: #2c3e50; font-weight: 600; font-family: 'Montserrat', sans-serif; text-decoration: none; }
tr.ep_search_result a:hover { color: #2ebaae; }


/* ==========================================================
   MOBILE VIEW (MAX-WIDTH: 768PX)
   ========================================================== */
@media screen and (max-width: 768px) {
    
    /* 1. HEADER & LOGO RATA KANAN */
    #header .social-buttons { display: none !important; }
    #header { display: flex !important; justify-content: flex-end !important; align-items: center !important; padding-top: 1.5em !important; }
    #header .logo { flex: 0 0 auto !important; text-align: right !important; margin-right: 15px !important; }
    #header .logo img { max-width: 200px !important; }
    
    /* 2. BURGER MENU BUTTON POSITIONING DI MOBILE */
    #sidebar .toggle { text-indent: 7.25em; width: 7.25em; }

    /* 3. HERO BANNER MOBILE */
    .hero-banner { padding: 40px 15px !important; }
    .hero-content h2 { font-size: 1.6em !important; }
    .hero-search-box button { display: none !important; }
    .hero-search-box input[type="text"] { border-radius: 50px !important; text-align: center !important; }

    /* 4. TIPOGRAFI & PADDING MOBILE */
    h1.ep_tm_pagetitle, .ep_view_menu h2, .ep_view_page h2 { font-size: 1.5em !important; line-height: 1.3 !important; margin-bottom: 15px !important; }
    #main > .inner { padding: 0 15px 0.1em 15px !important; }
 
 
    /* FIX: HANYA ABSTRAK YANG RATA KIRI-KANAN (JUSTIFY), Hasil Pencarian Tetap Kiri */
    .ep_summary_content p { text-align: justify !important; }
    tr.ep_search_result td { text-align: left !important; }

    /* 5. HASIL PENCARIAN MOBILE (IKON PDF TURUN KE BAWAH TEKS) */
    tr.ep_search_result {
        flex-wrap: wrap !important; /* MOBILE KUNCI: IZINKAN TURUN BARIS */
        padding: 15px !important;
    }
    tr.ep_search_result td:nth-child(1) {
        flex: 0 0 auto !important;
        margin-right: 10px !important;
    }
    tr.ep_search_result td:nth-child(2) {
        flex: 1 1 0% !important;
        width: calc(100% - 30px) !important;
    }
    tr.ep_search_result td:nth-child(3) {
        flex: 0 0 100% !important; /* Paksa turun baris */
        margin-left: 0 !important;
        margin-top: 15px !important; /* Jarak antara teks dan ikon di bawahnya */
        align-items: flex-start !important; /* Rata Kiri di HP */
    }
    tr.ep_search_result td:nth-child(3) > div {
        justify-content: flex-start !important;
    }

    /* 6. FIX HALAMAN STATISTIK (IRSTATS 2) DI MOBILE */
    table.irstats2_view_Grid, 
    table.irstats2_view_Grid > tbody, 
    table.irstats2_view_Grid > tbody > tr, 
    table.irstats2_view_Grid > tbody > tr > td { 
        display: block !important; 
        width: 100% !important; 
    }
    table.irstats2_view_Grid > tbody > tr > td { margin-bottom: 25px !important; }
    .irstats2_view_content { max-width: 100% !important; overflow-x: auto !important; -webkit-overflow-scrolling: touch; }
    .irstats2_googlegraph { min-width: 600px !important; }
}
/* ==========================================================
   KONSISTENSI NAVIGASI JUMP TO (DIHAPUS GARIS PEMISAH |)
   ========================================================== */
.ep_view_jump, .irstats2_view_jump {
    background: #fff;
    border: 1px solid #e1e4e5;
    border-radius: 8px;
    padding: 20px;
    margin-bottom: 25px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.02);
    text-align: center;
}

/* Wadah utama Jump To */
.ep_view_jump_to {
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
    color: #7f8c8d;
    font-size: 0; /* Trik rahasia: Menyembunyikan teks polos penghubung (termasuk karakter |) */
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
    margin-top: 10px;
}

/* Memunculkan kembali teks di dalam tag a (huruf abjad) sekaligus menyulapnya jadi tombol */
.ep_view_jump_to a {
    font-size: 14px; 
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 38px;
    height: 38px;
    background: #f8f9fa;
    border: 1px solid #d2d2d2;
    border-radius: 6px;
    color: #5D5D5D;
    text-decoration: none;
    font-weight: 700;
    transition: all 0.2s ease;
}

/* Efek saat huruf disentuh kursor (Hover) */
.ep_view_jump_to a:hover {
    background: #2ebaae;
    color: #fff;
    border-color: #2ebaae;
    transform: translateY(-3px);
    box-shadow: 0 4px 10px rgba(46, 186, 174, 0.2);
}

/* Huruf yang sedang aktif/terpilih (jika ada class aktif) */
.ep_view_jump_to b, .ep_view_jump_to strong {
    font-size: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 38px;
    height: 38px;
    background: #2ebaae;
    color: #fff;
    border: 1px solid #2ebaae;
    border-radius: 6px;
    font-weight: 700;
    box-shadow: 0 4px 10px rgba(46, 186, 174, 0.3);
}
/* ==========================================================
   MENGALAHKAN STYLE INLINE PADA ABSTRAK (JUSTIFY)
   ========================================================== */
.ep_summary_content_main p[style*="text-align: left"] {
    text-align: justify !important;
}