/*!
 * Name : MagiaCSS Layout
 * Author : Nanranikano
*/

@import url('font.css');
@import url('root.css');

/* REPLACEMENT WAJIB */
.btn{border-radius:12px}
.btn>span:not([class]){padding-bottom:1px}
.btn-36>span:not([class]){padding-bottom:1px}
/* MAGIA */
body{cursor:initial}
.formatting h2{font-size:24px}
.formatting h3{font-size:18px}
.formatting h4{font-size:16px}
.formatting h5{font-size:14px}
.formatting ul li::before{top:10px}
.formatting a:hover{text-underline-offset:6px}
.formatting img{border-radius:0!important}
.btn-outline.btn-doi{border-color:#fcb425!important;color:var(--dark)!important}
.btn-outline.btn-doi:hover{background-color:#fcb42525!important}
.dropdown-doi [dropdown=content]{border-color:#fcb425}
.dropdown-doi [dropdown=content] nav .btn:hover{background-color:#fcb42515;color:#DC9303!important}
.dropdown-doi [dropdown=content] nav .btn.active{color:#fcb425!important}
.dropdown-doi [dropdown=content] nav .btn::after{background-color:#fcb425}
.form-control{padding-bottom:1px}
[class*=form-opt-] span:not([class]){margin-top:2px}
.hidden{display:none!important}
/* SEBATIK */
.container{max-width:1108px;padding-right:24px;padding-left:24px}
.header{padding-top:24px;border-top:3px solid var(--primary);border-bottom:1px solid var(--g3x)}
/* FOOTER */
.footer{position:relative;margin-top:auto;border-top:1px solid var(--g3x);border-bottom:3px solid var(--primary)}
.footer::before{content:' ';display:block;position:absolute;top:240px;bottom:0;left:0;right:0;background-color:var(--dark)}
.footer::after{content:' ';display:block;position:absolute;top:240px;bottom:0;left:0;right:0;opacity:.15;background-image:url(../img/pattern.webp);background-position:center;background-size:240px}
.footer .widgets{min-height:240px;padding:48px;background-color:var(--bg);border:2px solid var(--primary);border-radius:16px}
.footer .copykanan{position:relative;z-index:1;padding:24px 0;color:var(--bg)}
.footer .copykanan a{color:var(--bg)}
.footer .copykanan a.btn:hover{color:var(--primary)!important}
.copykanan b{display:block;margin-bottom:4px}
/* WRAPPER */
.maindesu{position:relative}
.wrapper{padding-top:24px;padding-bottom:24px}
.wrapper-left.wide,.wrapper-right.wide{grid-column:span 3}
.wrapper-right [aria-label=Sidebar] h2{position:relative;margin-bottom:12px;padding-left:33px;font-size:14px;font-weight:var(--font-semibold);text-transform:uppercase}
.wrapper-right [aria-label=Sidebar] h2::before{font-variation-settings:'FILL'1;content:'\e6b7';position:absolute;top:-1px;left:2px;font-size:20px;font-family:var(--font-msr);font-weight:normal;line-height:1;color:var(--primary)}
.wrapper-right [aria-label=Sidebar]>div{font-size:12px}
.wrapper-right [aria-label=Sidebar] .material-symbol{font-variation-settings:'FILL'1;font-size:20px}
.wrapper-right [aria-label=Sidebar]>div:nth-child(n+2){margin-top:24px}
/* SIDEBAR BLOCK */
.block_make_submission h2{display:none}
.block_make_submission a{display:block;position:relative;height:48px;padding:0 20px;background-color:var(--primary3);border:1px solid transparent;border-radius:12px;font-size:14px;font-weight:var(--font-semibold);line-height:46px;color:var(--primary);text-transform:uppercase}
.block_make_submission a::after{font-variation-settings:'FILL'1;content:'\f88c';position:absolute;top:50%;right:16px;transform:translateY(-50%);font-size:24px;font-family:var(--font-msr);font-weight:normal;line-height:1;color:var(--primary)}
.block_make_submission a:hover{box-shadow:0 0 0 4px var(--primary1);border-color:var(--primary)}
[aria-label=Sidebar] [id*=-menu] ul li a{display:block;position:relative;padding:8px 16px;padding-left:15px;background-color:var(--g0x);border-radius:6px}
[aria-label=Sidebar] [id*=-menu] ul li a:hover::before{content:' ';display:block;position:absolute;top:0;bottom:0;left:-25px;background-color:var(--primary);border-left:2px solid var(--primary)}
[aria-label=Sidebar] [id*=-menu] ul li a:hover{background-color:var(--g1x)}
[aria-label=Sidebar] [id*=-menu] ul li:nth-child(n+2){margin-top:2px}
[aria-label=Sidebar] [id*=-issn] .card{overflow:hidden;padding:0;padding-bottom:8px}
/* HOMEPAGE */
.homepage{display:flex;flex-direction:column;gap:24px}
.homepage>*{margin:0}
[class*=table-info-] tr td{border:0;vertical-align:top}
[class*=table-info-] tr td:first-child{width:200px!important}
[class*=table-info-] tr td a{text-underline-offset:6px;color:var(--primary)}
[class*=table-info-] tr td a:hover{text-decoration:underline}
.table-info-jurnal{position:relative;overflow:hidden;padding:24px 28px;border:1px solid var(--primary);border-radius:12px;line-height:1.6}
.table-info-jurnal::before{content:' ';display:block;position:absolute;top:0;bottom:0;left:0;right:0;background-image:url(../img/pattern_color.webp);background-position:center;background-size:240px}
.table-info-jurnal:not(:has(table)){display:flex;flex-direction:column}
.table-info-jurnal tr:first-child td{padding-top:0}
.table-info-jurnal tr td{padding-bottom:0}
.table-info-jurnal tr td:last-child{font-weight:var(--font-semibold)}
.table-info-jurnal p{display:flex;flex-wrap:wrap;gap:16px;position:relative;z-index:1}
.table-info-jurnal p:nth-child(n+2){margin-top:12px}
.table-info-jurnal p a{color:var(--primary)}
.table-info-jurnal p a:hover{text-underline-offset:6px;text-decoration:underline}
.table-info-jurnal p i,.table-info-jurnal p em{width:200px;font-style:normal}
.table-info-jurnal p b,.table-info-jurnal p strong{flex:1}
.table-info-jurnal p:nth-child(1){order:1}
.table-info-jurnal p:nth-child(2){order:2}
.table-info-jurnal p:nth-child(3){order:4}
.table-info-jurnal p:nth-child(4){order:5}
.table-info-jurnal p:nth-child(5){order:7}
.table-info-jurnal p:nth-child(6){order:3}
.table-info-jurnal p:nth-child(7){order:6}
.table-info-jurnal p:nth-child(8){order:8}
.table-info-terbitan tr td:first-child{width:140px!important}
.table-info-artikel tr td:first-child{width:100px!important}
/* INDEXING */
.indexing-site{display:grid;gap:12px;grid-template-columns:repeat(5,1fr);margin:0 0 24px!important;padding:0!important}
.indexing-site li{margin:0!important;padding:0!important}
.indexing-site li::before{display:none}
.indexing-site li a{height:48px;padding:0 16px}
.indexing-site li img{box-shadow:unset!important;max-width:100%;max-height:48px;margin:auto!important;padding:4px 0}
.indexing-site li a{box-shadow:0 0 0 0 transparent;display:flex;transition:.15s ease;background-color:var(--bg);border:1px solid var(--g3x);border-radius:8px}
.indexing-site li a:hover{box-shadow:0 0 0 6px var(--primary3);border-color:var(--primary)}
.indexing-site li:has([href*=sinta]){display:flex;grid-row:span 2;grid-column:span 2}
.indexing-site li:has([href*=sinta]) a{flex:1;height:100%}
.indexing-site li [href*=sinta] img{max-height:80px}
[aria-label=Sidebar] .indexing-site{grid-template-columns:repeat(1,1fr)}
[aria-label=Sidebar] .indexing-site li:has([href*=sinta]){grid-row:unset;grid-column:unset}
[aria-label=Sidebar] .indexing-site li [href*=sinta]{width:auto;max-height:48px}
/* PAPER CARD */
.papers .card{display:flex;flex-direction:column;flex-wrap:wrap;gap:16px;position:relative;overflow:hidden;min-width:0;padding:22px 24px;border-radius:12px!important;counter-increment:num}
.papers .card::before{content:counter(num);position:absolute;top:-10px;left:0;opacity:.075;font-size:4rem;font-family:var(--font-2);font-style:italic;font-weight:var(--font-bold);line-height:1}
.papers .card h5{font-size:16px}
.papers .card h6{margin-top:-8px;font-size:14px;font-weight:normal}
.papers .card p{color:var(--g4x)}
.papers .card .btn{overflow:unset;margin-right:auto;border-radius:0;font-family:var(--font-2);font-style:italic;font-weight:var(--font-bold);color:var(--txt)!important}
.papers .card .btn span:not([class]){padding-bottom:0}
.papers .card .btn:after{content:' ';display:block;position:absolute;bottom:-5px;left:3px;right:0;opacity:0;height:6px;transition:.15s ease;border-bottom:1px solid var(--primary)}
.papers .card .btn:hover:after{opacity:1}
.papersection{display:flex;gap:12px;margin-bottom:16px;padding-left:4px;font-size:16px}
.papersection span{flex:1;margin:auto 0}
.papersection::before{font-variation-settings:'FILL'1;content:'\e866';margin:auto 0;font-size:24px;font-family:var(--font-msr);color:var(--primary)}
.papersection:nth-of-type(n+2){margin-top:24px}
.papers:not(:has(.papersection:nth-of-type(n+2))) .papersection:nth-child(1){display:none}
/* PAGE TITLE */
.page-title{display:flex;flex-direction:column;position:relative;margin-bottom:24px;border-bottom:2px solid var(--primary)}
.page-title h1{padding-top:2px;font-size:28px}
.page-title h4{margin-top:8px;font-size:18px;font-weight:normal;color:var(--g5x)}
.page-title .breadcrumb{margin:16px 0 27px;font-size:12px}
.page-title .breadcrumb>li+li:before{font-size:16px}
.page-title .breadcrumb>li:nth-child(1) .material-symbol{position:relative;top:-1px}
.page-title .breadcrumb>li:nth-child(n+2){padding-left:20px}
.page-title .btn-edit{position:absolute;bottom:calc(-24px / 2);right:0;background-color:var(--bg)!important;border-width:2px}
.btn-edit{font-weight:normal}
/* ISSUES */
.issueArchive .card{padding:0;border:0;text-align:center}
.issueArchive .card b{display:block;margin:12px 0 0;font-size:16px}
.issueArchive .card>div:not([class]){display:none}
.issueArchive .card .img-thumb,#data-journal .card .img-thumb{background-color:var(--dark)}
.issueArchive .card .img-thumb span,#data-journal .card .img-thumb span{font-variation-settings:'FILL'1;position:absolute;z-index:1;top:50%;left:50%;transform:translate(-50%,-50%);background-color:var(--dark);border-radius:8px;font-size:3.5rem;color:var(--g6x)}
.issueArchive .card .img-thumb img,#data-journal .card .img-thumb img{position:relative;z-index:2}
.issueArchive .card .img-thumb img+img,#data-journal .card .img-thumb img+img{position:absolute;top:0;bottom:0;left:0;right:0}
.issueArchive .card .img-thumb::after{content:' ';display:block;position:absolute;z-index:0;top:0;bottom:0;left:0;right:0;opacity:.35;background-image:url(../img/pattern.webp);background-position:center;background-size:200px}
/* ARTICLE */
.page-article .ccbadge{display:flex;flex-direction:column}
.page-article [rel=license]{margin-right:auto}
.page-article [rel=license] img{margin:0!important}
.page-article p:empty{display:none}
.article-author ul li *:not(b){font-size:12px;line-height:1.4}
.article-author ul li b,.article-author ul li span{display:block}
.article-author ul li b:not(:last-child){margin-bottom:-4px}
.article-author ul li span{color:var(--g4x)}
#citationOutput{resize:none!important;overflow:hidden;width:100%;height:auto}
#citationOutput *{display:inline}
#citationOutput *::after{content:' '}
[aria-controls=citationOutput].btn-primary{border:1px solid transparent!important}
/* SEARCH */
.page-search{grid-template-columns:repeat(5,1fr);margin-bottom:24px;padding-bottom:24px;border-bottom:1px solid var(--g3x)}
.page-search>*{margin:0!important}
.page-search>*:nth-child(1){order:1;grid-column:span 3}
.page-search>*:nth-child(2){order:3;grid-column:span 3}
.page-search>*:nth-child(3){order:2;grid-column:span 2}
.page-search>*:nth-child(4){order:4;grid-column:span 2}
.page-search>*:nth-child(5){order:5;grid-column:span 5}
/* ANNOUCEMENT */
.bewara{margin-top:24px;border-color:var(--info)}
.bewara .card-header{position:relative;border-bottom-color:var(--info)}
.bewara .card-header::after{content:' ';display:block;position:absolute;top:50%;left:-3px;transform:translateY(-50%);width:5px;height:24px;background-color:var(--info);border-radius:8px}
.bewara .cardset .card{padding:20px 0;border-top-style:dashed}
.bewara .cardset .card .summary{line-height:1.8}
.page-bewara .cardset .card{padding:24px 0}
/* PORTAL */
.portal{background-image:url(../img/pattern_color.webp);background-repeat:repeat;background-attachment:fixed;background-size:240px}
.portal .container{max-width:1248px}
.portal .navbar{padding:36px 0;background-color:var(--bg);border-top:3px solid var(--primary);border-bottom:1px solid var(--g3x)}
.portal .navbar>*:first-child{z-index:99}
.portal .navbar hr.solid-v{width:auto;height:24px;margin:auto 0;border-left:1px solid var(--g3x)}
.portal .navbar:has(.collapse.expand) a[collapse-id=about]{color:var(--primary)}
.portal [collapse-id=about] h1{margin-bottom:24px;font-size:28px}
.portal-footer{min-height:unset;margin-top:auto;padding:24px;background-color:var(--bg);border-top:1px solid var(--g3x)}
#data-journal .card .formatting{-webkit-box-orient:vertical;-webkit-line-clamp:3;line-clamp:3;display:-webkit-box;overflow:hidden;line-height:1.6;text-overflow:ellipsis}
#data-journal .card .formatting *{font-style:normal;font-weight:normal;text-decoration:none!important;padding:0}
#data-journal .card .formatting p,#data-journal .card .formatting ul:not(.indexing-site),#data-journal .card .formatting ol{display:inline}
#data-journal .card .formatting li:before,#data-journal .card .formatting .info-jurnal-v2{display:none!important}
#data-journal .card .formatting p a{pointer-events:none}
#data-journal .card .formatting br,#data-journal .card .formatting h1,#data-journal .card .formatting h2,#data-journal .card .formatting h3,#data-journal .card .formatting h4,#data-journal .card .formatting h5,#data-journal .card .formatting h6{display:none}
#data-journal .card h6{margin-bottom:12px}
#data-journal .card .indexing-site{display:flex;margin:0 0 12px 0!important}
#data-journal .card .indexing-site li a{box-shadow:unset;padding:0;background-color:unset;border:unset;border-radius:0}
#data-journal .card .indexing-site li a img{max-height:48px;padding:0}
#data-journal .card .indexing-site li:nth-child(n+2){display:none}
#data-journal #noResult{grid-column:span 2;background-color:var(--bg)!important}
/* MEMBER */
.myaccount{z-index:1;margin:auto 0;padding:24px}
.myaccount::before{content:' ';display:block;position:fixed;z-index:1;top:0;bottom:0;left:0;right:0;opacity:.75;background-image:url(../img/pattern_color2.webp);background-repeat:repeat;background-attachment:fixed;background-size:360px}
.myaccount::after{content:' ';display:block;position:fixed;z-index:1;top:0;bottom:0;left:0;right:0;background-color:var(--backdrop)}
.myaccount .container{box-shadow:var(--shadow-2);z-index:2;max-width:400px!important;padding:40px;padding-bottom:0;background-color:var(--bg);border-radius:24px}
.myaccount .container .logo-logo{display:flex;height:36px;margin:0 auto}
.myaccount .container .logo-logo+b{margin:20px 0 32px}
.myaccount .form-control{box-shadow:unset;border-radius:12px}
.myaccount .form-cta:last-child{flex-direction:unset;margin:0;padding:32px 0 36px}
.myaccount .form-cta:last-child a{color:var(--txt)}
.myaccount .form-cta:last-child u{height:16px;margin:auto 8px;border-left:1px solid var(--g3x)}
.myaccount .g-recaptcha{display:flex;flex-direction:column}
.myaccount .g-recaptcha>*{margin:auto}
.myaccount [class*=form-opt-] span:not([class]) a{text-underline-offset:6px;color:var(--primary)}
.myaccount [class*=form-opt-] span:not([class]) a:hover{text-decoration:underline}
.myRegister .container{max-width:640px!important}
.interestInput #reviewerInterests{display:none}
.interestInput:has(.showInterestInput:checked) #reviewerInterests{display:flex}
/* PKP */
#pkpDefaultNav li{position:relative}
#pkpDefaultNav li a{line-height:48px}
#pkpDefaultNav li ul{box-shadow:var(--shadow);display:none;flex-direction:column;gap:0;position:absolute;z-index:98;top:100%;min-width:280px;margin-top:calc(8px + 24px);padding:16px;background-color:var(--bg)!important;border:2px solid var(--primary);border-radius:12px;font-size:14px;color:var(--txt)!important}
#pkpDefaultNav li ul::before{content:' ';display:block;position:absolute;top:-10px;left:0;right:0;height:8px}
#pkpDefaultNav li:hover ul{display:flex;margin-top:8px}
#pkpDefaultNav li ul li a{width:100%;height:40px;padding:0 16px;border-radius:6px;line-height:40px}
#pkpDefaultNav li ul li a:hover{background-color:var(--primary2);color:var(--primary)}
#pkpDefaultNav li ul li a::after{pointer-events:none;content:' ';display:block;position:absolute;top:50%;left:calc(-16px);opacity:0;transform:translateY(-50%);width:2px;height:24px;transition:.15s ease;background-color:var(--primary);border-radius:0 6px 6px 0}
#pkpDefaultNav li ul li a:hover:after{opacity:1}
.navbar>.container,.navbar>.fluid,.navbar nav ul{gap:32px}
.journalRegist [class*=form-opt-]{min-height:unset}
.journalRegist [class*=form-opt-] span:not([class]){margin-top:unset}
.journalRegist [class*=form-opt-] .mark{top:2px}
.journalRegist [class*=form-opt-] .mark,.journalRegist [class*=form-opt-] .mark::before,.journalRegist [class*=form-opt-] .mark::after{width:16px;height:16px;border-radius:6px}
.journalRegist [class*=form-opt-] .mark::before{font-size:17px}
/* MENU MOB */
.popup[pop-id=menu] [dropdown=toggle]{font-size:16px;font-weight:var(--font-semibold)}
.popup[pop-id=menu] [dropdown=content]{box-shadow:unset;position:relative;visibility:unset;opacity:1;margin:0;margin-top:12px;padding:0;border:0}
.popup[pop-id=menu] [dropdown=content] hr{border-top:0}
.popup[pop-id=menu] .popup-content{display:flex;flex-direction:column;gap:20px}
.popup[pop-id=menu] .popup-content li:last-child nav{gap:8px}
.popup[pop-id=menu] .popup-content li:last-child nav a{display:flex}
.popup[pop-id=menu] .popup-content li:last-child nav a span{margin:auto}
.popup[pop-id=menu] .caret{display:none}
.header+.popup[pop-id=menu] [dropdown=toggle]{pointer-events:none;font-size:14px}
.header+.popup[pop-id=menu] [dropdown=content]{margin:0;margin-bottom:16px;padding:16px;border:1px solid var(--primary)}
.header+.popup[pop-id=menu] nav{flex-direction:column;gap:0!important}
.header+.popup[pop-id=menu] nav>ul:last-child{margin-top:24px;padding-top:24px;border-top:1px dashed var(--g3x)}
.header+.popup[pop-id=menu] nav li{padding:0!important;border-top:0!important}
.header+.popup[pop-id=menu] nav li>a{display:flex;gap:12px;position:relative;height:40px;padding:0 16px;border-radius:8px}
.header+.popup[pop-id=menu] nav li>a:hover{background-color:var(--primary2)}
.header+.popup[pop-id=menu] nav li>a span:not(.caret){display:flex!important;margin:auto 0}

@media (max-width:1199.98px){
    .portal .container{max-width:720px}
    .portal .navbar{padding:24px 0}
    .portal .navbar>*{gap:24px}
    .portal .navbar nav.left:nth-child(1){display:flex!important}
    .portal .navbar nav.center{display:none}
    .portal [collapse-id=about] h1{font-size:24px}
    .portal .navbar .sortFilter{gap:24px;row-gap:12px;margin-top:24px!important}
    .portal .navbar .sortFilter>hr{width:100%;height:unset;margin:0;border:0}
    .header .navbar nav ul{gap:24px!important}
    .header .navbar nav.left{display:none}
    .header .navbar nav.hidden{display:flex!important}
    .wrapper,#data-journal{grid-template-columns:repeat(1,1fr)}
    .wrapper .wide{grid-column:auto;padding:0;border:0}
    .wrapper-right{position:relative;padding-top:25px}
    .wrapper-right::before{content:'Sidebar Section';margin-bottom:24px;font-size:24px}
    .wrapper-right::after{content:' ';display:block;position:absolute;top:0;left:-100%;right:-100%;border-top:1px solid var(--g3x)}
    .table-info-jurnal p i,.table-info-jurnal p em{width:160px}
    .homepage .indexing-site{grid-template-columns:repeat(4,1fr)}
    .issueArchive{grid-template-columns:repeat(3,1fr)}
    .page-title h1{font-size:24px}
    .page-title h4{font-size:16px}
    .footer .flex:first-child{gap:0!important;padding:24px 0!important}
    .footer .flex:first-child>*:nth-child(2){flex:unset!important;width:100%;margin:16px 0 12px}
    .footer .flex:first-child>*:nth-child(n+3){text-align:left!important}
}

@media (max-width:720px){
    .myaccount{margin-top:0;padding:16px}
    .myaccount .container{border-radius:12px}
    [pop-id=menu] [dropdown=content]{display:block;min-width:unset!important}
}

@media (max-width:640px){
    .container{padding-right:16px;padding-left:16px}
    .header{padding-top:16px}
    .portal [collapse-id=about] .formatting{padding-top:24px!important}
    .portal [collapse-id=about] h1{margin-bottom:0;font-size:20px}
    .portal .navbar{padding-bottom:4px;border-bottom:0}
    .portal .navbar .container{gap:16px}
    .portal .feed{position:relative}
    .portal .feed::after{content:' ';display:block;position:absolute;z-index:0;top:-25px;left:0;right:0;height:120px;background:linear-gradient(to top,transparent 0,var(--bg) 100%)}
    .portal .feed .container{z-index:1}
    .portal .navbar nav.right ul>div,.portal .navbar .sortFilter #data-filter [dropdown=toggle] span:not(.material-symbol),.portal .navbar .sortFilter #data-sort [dropdown=toggle] span:not(.material-symbol),.header .navbar nav.right ul>div{display:none}
    .portal .navbar nav.right ul>.hidden,.portal .navbar .sortFilter #data-sort [dropdown=toggle] span.material-symbol,.header .navbar nav.right ul>.hidden{display:flex!important}
    .portal .navbar .sortFilter>*:nth-child(n+5){margin-right:20px}
    #data-journal .card .flex-1{flex:unset!important;width:100%}
    #data-journal .card .img-thumb{margin:0 auto}
    #data-journal .card .j-fluid{flex-direction:column}
    #data-journal .card .j-fluid>*{flex:unset!important}
    .myaccount .container{padding-right:24px;padding-left:24px}
    .myRegister .container{max-width:400px!important}
    .myRegister .grid{grid-template-columns:repeat(1,1fr)}
    .table-info-jurnal p i,.table-info-jurnal p em{width:120px}
    .homepage .indexing-site{grid-template-columns:repeat(3,1fr)}
    .issue_toc>.img-thumb{margin:0 auto}
    .issue_toc>.flex-1{flex:unset!important}
    .page-title h1{font-size:20px}
    .articleMetadata{grid-template-columns:repeat(1,1fr)}
    .article-author{margin:-26px -16px 0;padding:24px 16px 24px;background-color:var(--primary2);border-top:2px solid var(--primary);border-bottom:1px solid var(--primary)}
    .banner{border-radius:8px!important}
}

@media (max-width:480px){
    .issueArchive{grid-template-columns:repeat(2,1fr)}
}