/* ==================================================
    NHIJ Stylesheet GNU GPLv3 year 2022
=================================================== */

/* 1. Typography */

@import url('https://fonts.googleapis.com/css2?family=Fira+Sans:wght@300;400&family=Lora:ital@0;1&display=swap');

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
    color: #000000;
    font-family: 'Fira Sans', sans-serif;
    font-weight: 300;
}

h1 {
    font-size: 1.75rem;
}

a {
    color: #000000;
    text-decoration: underline;
    text-decoration-color: #007d28;
    text-decoration-thickness: 1px;
    text-underline-offset: 7px;
    transition: all ease-in-out 0.2s;
}

a:hover {
    color: #007d28;
    text-decoration-color: #007d28;
    text-decoration-thickness: 3px;
}

::selection { /* Style selections */
    background: #007d28;
    color: #ffd000;
}

.page-content p, .page-content li {
    font-size: 1.05rem !important;
    font-weight: 300 !important;
}

/* 2. Global */

/* 2.1 Body */

body {
    color: #161413;
    background-color: #FCFCFC;
}

/* 2.2 Header */

.main-header {
    border-bottom: 1px solid #E0B300;
    background: #FCFCFC;
}

.navbar-logo {
    max-width: 80%;
    padding-top: 2.5rem;
}

.navbar-logo a {
    border-bottom: 0px solid #D1B8C5;
    transition: all ease-in-out 0.15s;
}

.navbar-logo a:hover {
    border-bottom: 10px solid #006b12;
}

.navbar-logo img {
    width: 100%;
}

/* 2.3 Navbar */

#userNav .nav-link, .language-toggle .dropdown-toggle {
    color: #000000;
    text-decoration: none;
}

#userNav .nav-link:hover, .language-toggle .dropdown-toggle:hover, #userNav .nav-link:focus, .language-toggle .dropdown-toggle:focus {
    outline: 0;
    border-color: transparent;
    color: #007d28;
}

#userNav .dropdown-menu, .language-toggle .dropdown-menu {
    border-radius: 20px 5px 20px 20px;
}

#primaryNav .nav-link {
    font-weight: 300;
    letter-spacing: 0.25px;
    font-size: 1rem;
    text-decoration: none;
}

#primaryNav .nav-link:hover, #primaryNav .nav-link:focus {
    background: transparent;
    color: #006b12;
    border-color: transparent;
    font-weight: 300;
    letter-spacing: 0.25px;
    font-size: 1rem;
}

.badge-light {
    background: #007d28;
    color: #ffffff;
}

.dropdown-item {
    transition: all ease-in-out 0.2s;
    text-decoration: none;
}

.dropdown-item:hover, .dropdown-item:focus {
    border-color: transparent;
    color: #e3d800 !important;
}

#primaryNav .dropdown-menu.show {
    border-radius: 0px 0px 20px 20px;
    border-top: 1px solid #C5B3BC;
}

#primaryNav .dropdown-item {
    color: #FCFCFC;
    transition: all ease-in-out 0.2s;
    font-weight: 300;
    letter-spacing: 0.25px;
    text-decoration: none;
}

#primaryNav .dropdown-item:hover, #primaryNav .dropdown-item:focus {
    background: transparent;
    color: #1e9403;
    border-color: transparent;
}


/* 2.4 Footer */

/* Use prefooter block to aesthetically place sidebar content in footer; disable when not in use */

/*#CUSTOMblock-prefooter {
    flex-basis: auto;
    width: 100%;
    padding: 0;
}

@media (max-width: 767px) {
  #CUSTOMblock-prefooter {
    padding: 15px 15px 0 15px;
    margin-bottom: 0;
  }
}*/

.site-footer-sidebar { /* Remove margin and padding when prefooter is not in use */
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: 0;
}

.site-footer {
    background: linear-gradient(to bottom, #fcfcfc 0%,#c9de96 24%,#8ab66b 67%,#398235 100%);
    color: #000000;
    padding-bottom: 0;
}

.site-footer h3 {
    font-size: 1rem;
    color: #000000;
}

.site-footer p {
    font-size: 0.8rem;
}

.site-footer a {
    color: #000000;
    text-decoration: none;
    transition: all ease-in-out 0.2s;
}

.site-footer a:hover {
    color: #f7ba00;
    text-decoration: none;
}

.site-footer .row .align-self-center { /* modify the align-self-center class in the footer because it's hard-coded in the template */
    -ms-flex-item-align: flex-start !important;
    align-self: flex-start !important;
}


.col-md.col-md-2.align-self-center.text-right { /* Remove PKP logo for placement elsewhere */
    display: none;
}

@media (min-width: 991px) {
  .publisher-logos {
    float: left;
    text-align: left;
    margin-bottom: 0;
  }
}

.publisher-logos {
  text-align: center;
  margin-bottom: 1rem;
}

/* 3. Styling */

/* 3.1 Buttons */

.btn {
    border-radius: 10px;
    border: 1px solid #212121;
    color: #212121;
    text-transform: uppercase;
    font-weight: 300;
}

.btn-primary { /* Main (violet) buttons */
    border-radius: 20px 40px 40px 20px;
    border-color: #007d28 !important;
    color: #FCFCFC;
}

.btn-primary:hover, .btn-primary:focus, .btn-primary:active {
    background: #161413 !important;
    border-color: #161413 !important;
    color: #FCFCFC;
}

.btn-primary:focus {
  box-shadow: 0 0 0 .2rem #D1B8C5 !important;
}

.modal-content .btn-primary { /* Buttons in modals with violet backgrounds */
    background: transparent;
    border-radius: 10px !important;
    border-color: #FCFCFC44;
    color: #FCFCFCaa;
    text-transform: uppercase;
    transition: all ease-in-out 0.2s;
}

.modal-content .btn-primary:hover, .modal-content .btn-primary:active {
    background: transparent;
    border-color: #FCFCFC77;
    color: #FCFCFC;
}

/* 3.2 Forms */

.form-control {
    background-color: #FCFCFC;
}

.form-control:hover {
    border-color: #D1B8C5;
}

.form-control:focus {
    color: #495057;
    background-color: #FFF;
    border-color: #FFF;
    outline: 0;
    box-shadow: 0 0 0 0.2rem #D1B8C5;
}

@media (max-width: 575px) { /* Lists with images on the side */
    .list-img {
        text-align: center !important;
    }

    .list-img > img {
        width: 150px !important;
        margin-bottom: 2rem;
    }
}

/* 3.3 Paragraphs */

.paragraph {
    font-weight: 300;
    font-size: 1.1rem;
}

/* 3.4 Tooltips */

.hint {
    position: relative;
    display: inline-block;
    color: #610C3A;
}

.hint .hint-text {
    visibility: hidden;
    width: 200px;
    background-color: #610C3A;
    color: #FCFCFC;
    border-radius: 10px;
    padding: 10px 10px;
    position: absolute;
    z-index: 1;
    bottom: 110%;
    left: 50%;
    transform: translate(-50%);
    text-align: center;
    font-size: 0.9rem;
    line-height: 1.5;
    opacity: 0;
    transition: opacity 0.3s;
}

.hint .hint-text::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: #610C3A transparent transparent transparent;
}

.hint:hover .hint-text {
    visibility: visible;
    opacity: 1;
}

/* 3.5 Page headers */

.page-header {
    margin-top: 5rem;
    margin-bottom: 1rem;
}

.page-header h1 {
    font-size: 1.75rem;
    color: #000000;
    text-transform: uppercase;
}

/* 4. Page-specific */

/* 4.1 Homepage */

/* 4.1.1 Homepage issue */

.homepage-image-behind-issue::after {
    background: rgba(0,0,0,0.2);
}

.homepage-issue-current { /* 'CURRENT ISSUE' text */
    margin-top: 0 !important;
  	font-family: 'Fira Sans', sans-serif;
    color: #212121;
  	font-size: 2rem;
  	font-weight: 300;
  	text-transform: uppercase;
}

.homepage-issue-identifier {
  	display: none;
}

.homepage-issue-published { /* Date issue was published */
    margin-top: 1.5rem !important;
    color: #212121;
}

.homepage-issue-description-wrapper { /* Issue description box */
    display: flex;
    align-content: center;
    background: linear-gradient(45deg, rgba(216,216,216,1) 0%,rgba(201,201,201,0.4) 100%);
    height: 297px;
    padding: 2.8rem 3rem;
    border: 0px solid #212121;
    border-radius: 0px 45px 45px 0px;
    line-height: 25x;
}

.homepage-issue-description .h2 {
    font-family: 'Lora', serif;
    font-style: normal;
    color: #161413;
    font-size: 1.45rem !important;
    margin-bottom: 1rem;
}

.homepage-issue-description p {
    color: #161413;
    font-weight: 300;
    font-size: 1.05rem;
}

.homepage-issue-description:after {
    display: none;
}

.homepage-issue-description-more {
    display: none !important;
}

@media (max-width: 1199px) {
    .homepage-issue-current {
        color: #161413;
    }

    .homepage-issue-published {
        color: #8E6A7D;
        text-transform: uppercase;
    }

    .homepage-issue-description-wrapper { /* Issue description box */
        box-shadow: none;
    }
}

@media (max-width: 991px) {
    .homepage-issue-description-wrapper { /* Issue description box */
        height: 100%;
        padding: 1rem 0rem;
        border: 0;
        background: #FCFCFC;
    }

    .homepage-issue-description {
        padding-bottom: 0;
    }
}

@media (min-width: 769px) {
    .homepage-issue-cover { /* Cover image */
        width: 210px;
        height: 297px;
    }
}

@media (max-width: 768px) {
    .homepage-issue-cover {
        max-width: 100% !important;
        max-height: 100% !important;
    }
}

/* 4.1.2 Homepage table of contents */

.issue-toc-section-title {
    font-size: 1.75rem;
    color: #212121;
}

.article-summary-authors, .article-summary-pages {
    font-size: 1rem;
    color: #212121;
    text-transform: uppercase;
    font-weight: 300;
    line-height: 1.33;
}

@media (min-width: 992px) {
	.article-summary-pages {
		width: 56px;
	}
}

.article-summary-title {
  	font-family: 'Lora', serif;
  	font-style: normal;
}

.article-summary-title a {
    color: #161413;
    /*border-bottom: 0px solid #D1B8C5;*/
    text-decoration-color: #FCFCFC;
    text-decoration-thickness: 0px;
    transition: all ease-in-out 0.2s;
}

.article-summary-title a:hover {
    /*border-bottom: 3px solid #D1B8C5;*/
    text-decoration: underline;
    text-decoration-thickness: 3px;
    text-decoration-color: #0a8701;
}

.article-summary-doi { /* Do not show article DOIs in the table of contents */
    display: none;
}

/* 4.1.3 Introduction */

.asean-terms {
    list-style: none;
}

.asean-terms li::before {
    font-family: 'Font Awesome 5 Free';
    font-weight: 700;
    content: "\f101"; 
    color: #C5B3BC;
    font-size: 1rem;
    display: inline-block; 
    width: 1.75rem;
    margin-left: -1.75rem;
}

/* 4.1.4 Homepage announcement */

.homepage-announcement {
    flex: 0 0 100%;
    max-width: 100%;
}

.homepage-announcement-title {
    font-size: 1.35rem;
}

.homepage-announcement a {
    font-size: 1.05rem;
    font-weight: 300;
}

/* 4.2 Issue table of contents */

.page-issue-date {
    color: #000000 !important;;
    text-transform: uppercase;
    font-weight: 300;
}

.page-issue-description-wrapper {
    display: flex;
    align-items: center;
    background: #F5F3F4;
    border: 1px solid #C5B3BC;
    min-height: 297px;
    padding: 2.8rem 3rem;
    border-radius: 45px 0px 0px 0px;
}

.page-issue-description-wrapper p {
    font-weight: 300;
    font-size: 1.15rem;
    text-align: right;
    margin-bottom: 0;
}

.page-issue-description-wrapper .h2 {
    font-family: 'Lora', serif;
    font-style: normal;
    color: #161413;
    font-size: 1.45rem !important;
    text-align: right;
    margin-bottom: 1rem;
}

.article-details-issue-identifier a {
    font-family: 'Fira Sans';
    color: #008035;
    font-size: 1.15rem;
}

.article-details-issue-section {
    color: #8E6A7D;
}

.article-details-published {
    color: #8E6A7D;
}

.authors-string {
    font-size: 1.25rem;
}

.authors-string a {
    border-bottom: 0px solid #D1B8C5;
}

.issue-toc-section + .issue-toc-section {
    border-top: 1px solid #C5B3BC !important;
}


/* 4.3 Individual articles */


.article-details-issue-identifier, .article-details-heading, .article-details .item > .label {
    color: #068037 !important;
    font-weight: 300;
}

.article-details-issue-identifier a {
    border-bottom: 0px solid #D1B8C5;
    transition: all ease-in-out 0.2s;
}

.article-details-issue-identifier a:hover, .article-details-issue-identifier a:focus {
    color: #610C3A;
    text-decoration: none;
    border-bottom: 3px solid #D1B8C5;
}

.article-details-doi a {
    color: #8E6A7D;
    text-decoration: underline;
    text-decoration-color: #D1B8C5;
    text-decoration-thickness: 1px;
    text-underline-offset: 7px;
    transition: all ease-in-out 0.2s;
}

.article-details-doi a:hover {
    color: #610C3A;
    text-decoration-color: #D1B8C5;
    text-decoration-thickness: 3px;
}

.author-symbol {
    color: #8E6A7D !important;
}

.author-string-href {
    font-size: 1.3rem;
    text-decoration: none;
    font-weight: 400;
}

.article-details-author-affiliation {
    color: #8E6A7D !important;
    font-size: 1.1rem !important; 
    font-weight: 300;
}

.article-details-fulltitle {
    font-family: 'Lora', serif;
    font-style: normal;
    color: #161413;
    line-height: 1.5;
    text-transform: unset !important;
}

.article-details-issue-section {
    color: #068037c2 !important;
    text-transform: uppercase;
    font-weight: 300;
}

.article-details-published {
    color: #007F34BD !important;
    font-weight: 300;
    text-transform: uppercase;
}

.article-details-main {
    padding: 3rem 6rem;
    background: linear-gradient(45deg, rgba(216,216,216,1) 0%,rgba(201,201,201,0.4) 100%);
    border: 1px solid #C5B3BC00;
    border-radius: 45px 0px 45px 0px;
}

.article-details-abstract p {
    font-family: 'Lora', serif;
}

.article-details-references p {
    font-family: 'Lora', serif;
}

.article-details-sidebar ul {
    font-size: 1.05rem;
    font-weight: 300;
    list-style: none;
}

.article-details-sidebar ul li::before {
    font-family: 'Font Awesome 5 Free';
    font-weight: 700;
    content: "\f101"; 
    color: #C5B3BC;
    font-size: 1rem;
    display: inline-block; 
    width: 1.25rem;
    margin-left: -2.5rem;
}

.article-details-keywords-value {
    font-size: 1.05rem;
    font-weight: 300;
}

.article-details-references-value {
    font-family: 'Lora', serif;
}

.article-details-license p {
    font-size: 1rem;
    font-weight: 300;
    margin-top: 1rem;
    margin-bottom: 0;
}

.article-details-license img {
    margin-left: 43%;
}

/* 4.4 All custom pages */

.custom-page .page-header h1 {
    font-size: 2rem;
    margin-top: 2.5rem
    margin-bottom: 0;
}

.page-content {
    border-top-color: #067A02;
}

/* 4.5 Contact page */

.contact-name {
    font-size: 16px;
}

.contact-affiliation {
    font-size: 16px;  
}

.contact-email {
    font-size: 16px;
}

/* 4.6 Submissions page */

.submissions-checklist {
    font-size: 1.05rem;
    font-weight: 300;
}

.submissions-checklist ul {
    margin-top: 1rem;
    list-style: square;
}

/* 4.7 FAQ page */

.faq-return a {
    color: #8E6A7D;
    transition: all ease-in-out 0.2s;
}

.faq-return a:hover {
    color: #610C3A;
    text-decoration: none;
}

/* 4.8 Search page */

.alert-info {
    background: #F5F3F4;
    color: #050505;
    border-color: #050505;
}

.search-filters {
    background: #FAFAFA;
    border: 1px solid #050505;
    border-radius: 45px 0 45px 0;
}

.search-filters > h2 {
    color: #050505;
}

.search-filters label {
    color: #050505;
}

.form-control {
    color: #050505;
}

/* 4.9 Editorial team */

.editorial-member .col-lg-10 {
    display: grid;
}

.editorial-member img {
    border-radius: 40px 5px 5px 5px;
    border: 1px solid #C5B3BC;
}

.editorial-member a {
    transition: all ease-in-out 0.2s;
}

.editorial-member a:hover {
    color: #161413;
}

.editorial-member h3 {
    margin: 0;
    font-size: 1.25rem;
    align-self: center;
}

.editorial-member h4 {
    margin: 0;
    line-height: 1.2; 
    color: #8E6A7D; 
    font-weight: 400;
    font-size: 1.05rem;
    align-self: self-end;
}

.editorial-member h5 {
    margin: 0;
    line-height: 1.2; 
    color: #8E6A7D; 
    font-weight: 300; 
    font-size: 1.05rem;
    align-self: self-end;
}

.editorial-member p {
    margin: 0;
    align-self: center;
}

/* 4.10 Announcements */

.announcement-summary-date, .announcement-date, .homepage-announcement-date {
    font-family: 'Fira Sans', sans-serif !important;
    font-size: 1rem !important;
    color: #8E6A7D !important;
    text-transform: uppercase !important;
    font-weight: 300 !important;
}

/* 4.11 Archives */

.page-archives-header {
    margin-bottom: 4rem !important;
}

.page-archives .issue-summary {
    background: #fcfcfc;
}

.page-archives .issue-summary-cover {
    box-shadow: 0 5px 10px rgba(0,0,0,0.1);
}

.page-archives .issue-summary .card-body {
    background: transparent;
}

.page-archives .issue-summary-series a {
    color: #000;
    font-size: 1.11rem;
    text-decoration: none;
}

.page-archives .issue-summary-series a:hover {
    color: #097501;
}

.page-archives .issue-summary-date {
    color: #000 !important;
    font-size: 0.9rem;
    font-weight: 300;
    text-transform: uppercase;
}

.page-archives .issue-summary-title {
    color: #000 !important;
    font-size: 0.9rem;
    font-weight: 300;
}

/* Pagination */

.page-item {
    font-size: 1rem;
    font-weight: 300;
}

.page-item a {
    text-decoration: none;
}

.page-link {
    color: #8E6A7D !important;
    transition: all ease-in-out 0.2s;
}

.page-link:hover, .page-link:focus {
    color: #610c3a !important;
    background: #fcfcfc !important;
    box-shadow: none;
}

.page-item:first-child .page-link {
    border: 0;
}

.page-item:first-child .page-link span {
    display: none;
}

.page-item:first-child .page-link:before {
    margin-left: 0;
    vertical-align: text-bottom;
    border: none;
    font-family: 'Font Awesome 5 Free';
    font-weight: 700;
    content: "\f100";
    color: #C5B3BC;
    padding-right: 3px;
    transition: all ease-in-out 0.2s;
}

.page-item:first-child:hover .page-link:before {
    color: #610c3a;
}

.page-item:last-child .page-link {
    border: 0;
}

.page-item:last-child .page-link span {
    display: none;
}

.page-item:last-child .page-link:after {
    margin-left: 0;
    vertical-align: text-bottom;
    border: none;
    font-family: 'Font Awesome 5 Free';
    font-weight: 700;
    content: "\f101";
    color: #C5B3BC;
    padding-left: 3px;
    transition: all ease-in-out 0.2s;
}

.page-item:last-child:hover .page-link:after {
    color: #610c3a;
}

.page-item.active .page-link {
    border: 0;
    color: #8E6A7D !important;
}

.page-item.disabled .page-link {
    color: #C5B3BC !important;
}