/* =========================================================
   ANGGUN LIBRARY REPOSITORY
   FULL FINAL CSS
   ========================================================= */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,500;0,600;0,700;1,500&family=DM+Sans:wght@300;400;500;600&display=swap');

:root{
    --green-dark:#315F4C;
    --green:#638675;
    --sage:#C8D8CE;
    --sage-light:#EAF1ED;

    --pink:#EFC5C5;
    --pink-dark:#C8878B;
    --pink-light:#F8E5E3;

    --ivory:#FAF8F4;
    --cream:#FFFDFC;

    --text:#42584D;
    --line:rgba(49,95,76,.14);
}


/* =========================================================
   RESET
   ========================================================= */

*{
    box-sizing:border-box;
}

html{
    scroll-behavior:smooth;
}

body{
    margin:0 !important;
    padding:0 !important;

    min-height:100vh;
    overflow-x:hidden;

    font-family:"DM Sans",Arial,sans-serif !important;
    color:var(--text) !important;

    background:var(--ivory) !important;
}


/* =========================================================
   HILANGKAN SKIP LINK
   ========================================================= */

.skip-link,
a[href="#content"]{
    position:absolute !important;
    left:-99999px !important;
}


/* =========================================================
   HEADER
   ========================================================= */

header{
    width:100% !important;
    max-width:none !important;

    margin:0 !important;
    padding:22px 5% !important;

    display:flex !important;
    align-items:center !important;

    background:rgba(250,248,244,.98) !important;

    border:0 !important;
    border-bottom:1px solid rgba(49,95,76,.12) !important;

    box-shadow:none !important;

    position:relative !important;
    z-index:20 !important;
}


/* =========================================================
   NAMA WEBSITE
   ========================================================= */

header h1,
header h1 a,
header .site-title,
header .site-title a{
    margin:0 !important;
    padding:0 !important;

    font-family:"Cormorant Garamond",Georgia,serif !important;

    font-size:29px !important;
    line-height:1 !important;
    font-weight:700 !important;

    color:var(--green-dark) !important;

    text-decoration:none !important;

    border:0 !important;
    background:none !important;
}


/* =========================================================
   HAPUS KOTAK KECIL DI SEBELAH JUDUL
   ========================================================= */

header > button,
header > .button,
header .menu-toggle,
header .menu-button,
header .hamburger,
header .mobile-menu,
header .nav-toggle,
header .navigation-toggle,
#menu-button,
#nav-toggle,
#top-nav > button,
#top-nav .menu-toggle{
    display:none !important;

    width:0 !important;
    height:0 !important;

    margin:0 !important;
    padding:0 !important;

    border:0 !important;

    overflow:hidden !important;
}


/* =========================================================
   NAVIGASI
   ========================================================= */

header nav,
#top-nav{
    flex:1 !important;

    margin:0 !important;
    padding:0 30px !important;

    background:transparent !important;

    border:0 !important;
}

header nav ul,
#top-nav ul{
    display:flex !important;

    align-items:center !important;
    justify-content:center !important;

    flex-wrap:wrap !important;

    gap:31px !important;

    margin:0 !important;
    padding:0 !important;

    list-style:none !important;
}

header nav li,
#top-nav li{
    margin:0 !important;
    padding:0 !important;

    background:transparent !important;

    border:0 !important;
}

header nav a,
#top-nav a{
    position:relative !important;

    display:block !important;

    margin:0 !important;
    padding:6px 0 !important;

    font-family:"Cormorant Garamond",Georgia,serif !important;

    font-size:17px !important;
    font-weight:600 !important;

    color:var(--green-dark) !important;

    background:transparent !important;

    text-decoration:none !important;
}

header nav a:hover,
#top-nav a:hover{
    color:var(--pink-dark) !important;
}


/* =========================================================
   SEARCH
   ========================================================= */

#search{
    width:255px !important;
    max-width:255px !important;

    margin:0 !important;
    padding:0 !important;

    float:none !important;
}

#search form{
    position:relative !important;

    display:flex !important;
    align-items:center !important;

    width:100% !important;
    height:39px !important;

    margin:0 !important;
    padding:0 !important;

    background:rgba(255,255,255,.55) !important;

    border:1px solid rgba(49,95,76,.20) !important;

    border-radius:2px !important;

    box-shadow:none !important;

    overflow:hidden !important;
}

#search input[type="text"],
#search input[type="search"]{
    width:100% !important;
    height:38px !important;

    margin:0 !important;
    padding:0 43px 0 15px !important;

    font-family:"Cormorant Garamond",Georgia,serif !important;

    font-size:14px !important;

    color:var(--green-dark) !important;

    background:transparent !important;

    border:0 !important;
    outline:0 !important;

    box-shadow:none !important;
}

#search button,
#search button[type="submit"]{
    position:absolute !important;

    right:0 !important;
    top:0 !important;

    width:40px !important;
    height:38px !important;
    min-width:40px !important;

    margin:0 !important;
    padding:0 !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    color:var(--green-dark) !important;

    background:transparent !important;

    border:0 !important;
    border-radius:0 !important;

    box-shadow:none !important;
}


/* =========================================================
   AREA UTAMA
   ========================================================= */

#content{
    position:relative !important;

    width:100% !important;
    max-width:none !important;

    margin:0 !important;

    padding:70px 9% 90px !important;

    min-height:680px !important;

    background:
        linear-gradient(
            110deg,
            rgba(234,241,237,.94) 0%,
            rgba(250,248,244,.94) 50%,
            rgba(248,229,227,.94) 100%
        ) !important;

    border:0 !important;
    border-radius:0 !important;

    box-shadow:none !important;

    overflow:hidden !important;
}


/* =========================================================
   HAPUS TEKS DEKORASI TENGAH
   ========================================================= */

#content::before{
    display:none !important;
    content:none !important;
}


/* =========================================================
   BUBBLE
   ========================================================= */

#content::after{
    content:"";

    position:absolute !important;

    right:-60px !important;
    top:95px !important;

    width:270px !important;
    height:270px !important;

    border-radius:50% !important;

    background:rgba(239,197,197,.16) !important;

    border:1px solid rgba(239,197,197,.22) !important;

    pointer-events:none !important;

    animation:anggunFloat 7s ease-in-out infinite alternate;
}

@keyframes anggunFloat{
    from{
        transform:translateY(0);
    }

    to{
        transform:translateY(28px);
    }
}


/* =========================================================
   HAPUS "ITEMS"
   ========================================================= */

#content > h1:first-of-type{
    display:none !important;
}


/* =========================================================
   HAPUS "IN ITEM SET SKRIPSI / LAPORAN / DLL"
   ========================================================= */

#content > .query,
#content .query{
    display:none !important;
}


/* =========================================================
   HAPUS ADVANCED SEARCH
   ========================================================= */

#content > .advanced-search,
#content .advanced-search{
    display:none !important;
}


/* =========================================================
   HAPUS PAGINATION PERTAMA / YANG ATAS
   ========================================================= */

#content > .pagination:first-of-type{
    display:none !important;
}


/* =========================================================
   AREA SORT
   ========================================================= */

.sorting{
    position:relative !important;
    z-index:5 !important;

    width:100% !important;

    margin:0 0 20px !important;
    padding:0 !important;
}

.sorting form,
form.sorting{
    display:flex !important;

    align-items:center !important;
    justify-content:flex-end !important;

    gap:8px !important;

    width:100% !important;

    margin:0 !important;
    padding:0 !important;
}


/* =========================================================
   SELECT SORT
   ========================================================= */

.sorting select,
select{
    min-height:41px !important;

    padding:0 35px 0 14px !important;

    font-family:"Cormorant Garamond",Georgia,serif !important;

    font-size:15px !important;

    color:var(--green-dark) !important;

    background:rgba(255,255,255,.68) !important;

    border:1px solid rgba(49,95,76,.18) !important;

    border-radius:2px !important;

    outline:none !important;
}


/* =========================================================
   TOMBOL SORT
   ========================================================= */

.sorting button,
.sorting input[type="submit"],
.sorting .button{
    min-height:41px !important;

    padding:0 18px !important;

    font-family:"Cormorant Garamond",Georgia,serif !important;

    font-size:15px !important;
    font-style:italic !important;

    color:#fff !important;

    background:var(--green-dark) !important;

    border:1px solid var(--green-dark) !important;

    border-radius:2px !important;

    box-shadow:none !important;
}


/* =========================================================
   RESOURCE LIST
   ========================================================= */

ul.resource-list{
    position:relative !important;
    z-index:3 !important;

    width:100% !important;
    max-width:none !important;

    margin:0 !important;
    padding:0 !important;

    list-style:none !important;

    background:rgba(255,253,252,.58) !important;

    border-top:1px solid var(--line) !important;
}


/* =========================================================
   SATU ITEM
   ========================================================= */

ul.resource-list .resource{
    position:relative !important;

    display:block !important;

    width:100% !important;
    min-height:175px !important;

    margin:0 !important;

    padding:34px 150px 34px 25px !important;

    background:transparent !important;

    border:0 !important;
    border-bottom:1px solid var(--line) !important;

    border-radius:0 !important;

    box-shadow:none !important;

    overflow:hidden !important;

    transition:
        background .25s ease,
        padding-left .25s ease !important;
}

ul.resource-list .resource:hover{
    padding-left:32px !important;

    background:rgba(248,229,227,.25) !important;

    transform:none !important;

    box-shadow:none !important;
}


/* =========================================================
   JUDUL DOKUMEN
   ========================================================= */

ul.resource-list .resource h2,
ul.resource-list .resource h3,
ul.resource-list .resource .resource-name{
    display:block !important;

    width:auto !important;

    margin:0 0 8px !important;
    padding:0 !important;

    font-family:"Cormorant Garamond",Georgia,serif !important;

    font-size:28px !important;
    line-height:1.2 !important;
    font-weight:600 !important;

    color:var(--green-dark) !important;
}


/* =========================================================
   HAPUS GARIS BAWAH JUDUL
   ========================================================= */

ul.resource-list .resource h2 a,
ul.resource-list .resource h3 a,
ul.resource-list .resource .resource-name a,
ul.resource-list .resource a.resource-link{
    color:var(--green-dark) !important;

    text-decoration:none !important;

    border:0 !important;
    border-bottom:0 !important;

    box-shadow:none !important;

    background:none !important;
    background-image:none !important;
}

ul.resource-list .resource h2 a:hover,
ul.resource-list .resource h3 a:hover,
ul.resource-list .resource .resource-name a:hover{
    color:var(--pink-dark) !important;

    text-decoration:none !important;

    border-bottom:0 !important;
}


/* =========================================================
   DESKRIPSI
   ========================================================= */

ul.resource-list .resource .description,
ul.resource-list .resource .description p{
    position:static !important;

    display:block !important;

    float:none !important;

    width:auto !important;
    max-width:950px !important;

    margin:0 !important;
    padding:0 !important;

    font-family:"Cormorant Garamond",Georgia,serif !important;

    font-size:18px !important;
    line-height:1.55 !important;

    color:#65796F !important;

    white-space:normal !important;

    word-break:normal !important;

    overflow-wrap:break-word !important;
}


/* =========================================================
   PDF / THUMBNAIL
   ========================================================= */

ul.resource-list .resource img{
    position:absolute !important;

    right:28px !important;
    top:50% !important;

    transform:translateY(-50%) !important;

    width:78px !important;
    height:105px !important;

    object-fit:cover !important;

    margin:0 !important;
    padding:4px !important;

    background:#fff !important;

    border:1px solid rgba(49,95,76,.10) !important;

    border-radius:0 !important;

    box-shadow:
        0 7px 20px
        rgba(49,95,76,.08) !important;
}


/* =========================================================
   PAGINATION BAWAH
   ========================================================= */

#content > .pagination:last-of-type{
    position:relative !important;
    z-index:5 !important;

    display:flex !important;

    align-items:center !important;
    justify-content:flex-start !important;
    flex-wrap:wrap !important;

    gap:7px !important;

    width:100% !important;

    margin:0 !important;
    padding:0 !important;

    font-family:"DM Sans",Arial,sans-serif !important;

    color:var(--text) !important;
}

#content > .pagination:last-of-type input{
    width:43px !important;
    height:25px !important;

    padding:0 5px !important;

    background:rgba(255,255,255,.75) !important;

    border:1px solid rgba(49,95,76,.15) !important;
}

#content > .pagination:last-of-type .button,
#content > .pagination:last-of-type a{
    min-width:45px !important;
    min-height:25px !important;

    display:inline-flex !important;

    align-items:center !important;
    justify-content:center !important;

    padding:0 10px !important;

    background:var(--green-dark) !important;

    color:#fff !important;

    border:0 !important;

    text-decoration:none !important;
}


/* =========================================================
   LINK UMUM
   ========================================================= */

a,
a:link,
a:visited{
    color:var(--green-dark);
}

a:hover,
a:active{
    color:var(--pink-dark);
}


/* =========================================================
   FOOTER
   ========================================================= */

footer{
    width:100% !important;

    margin:0 !important;

    padding:30px 8% !important;

    text-align:center !important;

    font-family:"Cormorant Garamond",Georgia,serif !important;

    font-size:15px !important;
    font-style:italic !important;

    color:#788A81 !important;

    background:var(--ivory) !important;

    border-top:1px solid rgba(49,95,76,.12) !important;
}


/* =========================================================
   SELECTION
   ========================================================= */

::selection{
    background:var(--pink);
    color:var(--green-dark);
}


/* =========================================================
   MOBILE
   ========================================================= */

@media screen and (max-width:900px){

    header{
        display:block !important;

        padding:20px 6% !important;
    }

    header h1,
    header h1 a,
    header .site-title,
    header .site-title a{
        text-align:center !important;

        font-size:27px !important;
    }

    header nav,
    #top-nav{
        margin:15px 0 !important;

        padding:0 !important;
    }

    header nav ul,
    #top-nav ul{
        gap:8px 20px !important;
    }

    #search{
        width:100% !important;
        max-width:none !important;

        margin:12px auto 0 !important;
    }

    #content{
        padding:45px 6% 60px !important;
    }

    .sorting,
    .sorting form,
    form.sorting{
        justify-content:flex-start !important;
    }

    ul.resource-list .resource{
        min-height:225px !important;

        padding:
            27px
            15px
            125px
            15px !important;
    }

    ul.resource-list .resource:hover{
        padding-left:15px !important;
    }

    ul.resource-list .resource h2,
    ul.resource-list .resource h3,
    ul.resource-list .resource .resource-name{
        font-size:24px !important;
    }

    ul.resource-list .resource img{
        top:auto !important;

        right:auto !important;

        left:15px !important;
        bottom:20px !important;

        transform:none !important;

        width:68px !important;
        height:92px !important;
    }
}


/* =========================================================
   REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion:reduce){

    #content::after{
        animation:none !important;
    }
}


/* =====================================================
   PAKSA HILANGKAN BAGIAN ATAS DAFTAR ITEM
   Items
   In item set Skripsi
   Pagination atas
   Advanced search
   ===================================================== */

/* Judul "Items" */
#content > h2:first-of-type,
#content > h1:first-of-type{
    display:none !important;
}

/* Tulisan "In item set Skripsi" */
#content .search-filters{
    display:none !important;
}

/* Pagination PERTAMA saja */
#content .pagination:first-of-type{
    display:none !important;
}

/* Advanced search bagian atas */
#content .advanced-search{
    display:none !important;
}

/* Rapikan ruang kosong setelah semuanya dihapus */
#content{
    padding-top:55px !important;
}

/* Sort tetap di kanan */
#content .sorting{
    margin-top:0 !important;
    margin-bottom:25px !important;
}