/*CSS variables for common colors and fonts.*/
:root {
	--brand-colour: #192532;
	--brand-font-colour: black;
	--brand-link: #192532;
	--brand-link-hover: #015b86;
	--brand-font: 'Arial', sans-serif;
	--background-colour: #ada388;
}

/*font replacements*/
body {
	font-family: var(--brand-font);
}

h1,
.cmp_breadcrumbs .current h1,
.pkp_structure_main h1,
.pkp_structure_main h2,
.pkp_structure_main h3,
.pkp_structure_main h4,
.pkp_block .title {
	font-family: var(--brand-font);
	color: var(--brand-font-colour);
}
.obj_issue_toc .section > h3 {
        color: var(--brand-colour);
}
/*OJS used h2 for subtitles. For shame! */
.pkp_structure_main h2.subtitle {
	color: black;
}

/*prevents font from being gray on desktop display*/
@media (min-width: 768px){
	.obj_issue_toc .galleys h2,
	.obj_issue_toc .section h2 {
		color: var(--brand-colour);
	}
}

/*SECONDARY RECOLORING FOR MAIN SITE ELEMENTS*/
.pkp_structure_head { 
	background-color: white;
}

/*PRIMARY RECOLORING FOR MAIN SITE ELEMENTS*/
/*foreground elements*/
.pkp_site_name .is_text,
.pkp_navigation_user > li > a,
.pkp_navigation_user > li > a:hover,
.pkp_navigation_user > li > a:focus,
.pkp_head_wrapper .pkp_search.is_open .search_prompt{
	color: white;
}

/*background elements*/
.pkp_navigation_primary_row {
	background-color: var(--brand-colour);
}

/*PRIMARY RECOLORING FOR LINKS*/
/*in-text links*/
a,
a:focus {
	color: var(--brand-link);
}

a:hover {
	color: var(--brand-link-hover);
}

/*galley link*/
.obj_galley_link {
	border: 1px solid var(--brand-link);
	color: var(--brand-link);
}

.obj_galley_link:hover,
.obj_galley_link:focus {
	background: var(--brand-link);
}

/*button elements*/
.block_make_submission a,
.page_search .submit button {
	background: var(--brand-link);
	box-shadow: 1px 3px 3px rgba(0,0,0,0.3);
	color: white;
}

/*button background elements*/

.page_search .submit button:after {
	background: var(--brand-link);
	top: 0;
	height: 28px;
	line-height: 28px;
}

.page_search .submit button:hover:after,
.page_search .submit button:focus:after {
	background: var(--brand-link-hover);
}

.block_make_submission a:hover {
	box-shadow: inset 0 1em 1em rgba(0,0,0,0.1);
}

/*dropdown elements*/
.pkp_navigation_primary ul a, .pkp_navigation_user ul a {
	color: var(--brand-colour);
	text-decoration-color: var(--brand-colour);
}

.pkp_navigation_primary .dropdown-menu a:focus,
.pkp_navigation_primary .dropdown-menu a:hover, .cmp_notification{
    border-color: var(--brand-colour);
}

.pkp_nav_list ul a:hover {
	border-color: var(--brand-colour);
	color: var(--brand-colour);
}

.cmp_button_wire:hover,
.cmp_button_wire:focus{
	background: var(--brand-colour);
}

.pkp_head_wrapper .pkp_search.is_open .search_prompt:hover,
.pkp_head_wrapper .pkp_search.is_open .search_prompt:focus {
    border-bottom-color: var(--brand-colour);
}

:focus {
	outline-color: var(--brand-link-hover);
}

/*Code for switching sidebar to left side --- disable block if not desired*/
/*START LEFT SIDEBAR BLOCK*/
/*
.pkp_structure_content {
	display: flex !important;
}
.pkp_structure_sidebar {
	order: -1;
}
@media (min-width: 768px) {
	.pkp_structure_main:before {
		left: 300px;
	}
}
@media (min-width: 1200px) {
	.pkp_structure_main:after {
		left: 1160px;
	}
}
@media (min-width: 992px) {
	.pkp_structure_main:after {
		left: 952px;
	}
}
*/
/*note---this is just for demonstration--- more media queries need to be added if it's decided that sidebar should be moved permanently to left*/
/*END LEFT SIDEBAR BLOCK*/

/*Code for setting footer content and brand footer on the same line*/
.pkp_structure_footer {
	display: flex;
}

.pkp_footer_content {
	flex-grow: 1;
}

/*style formatting for footer*/
.pkp_footer_content img {
	max-width: 300px;
}

/*flex code for pushing footer down to bottom on pages without much content */
.pkp_structure_page {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
}

.pkp_structure_content {
	flex-grow: 1;
}

/*code for sites with logos to keep the top from being terrible*/
/*note: this code all exists because of some really bad-looking default styles 
associated with the .has_site_logo class which need to be overwritten to give a consistent-
looking style. Ideally, we should work with PKP to revise the default style to not look
as bad with logos, and then remove these overwrites*/

.has_site_logo .pkp_head_wrapper {
	padding-left: 0;
	padding-right: 0;
}

@media (min-width: 1200px) {
	.has_site_logo .pkp_head_wrapper {
		width: 100%;
	}
	.pkp_site_name, .pkp_navigation_primary_wrapper, .pkp_navigation_user, .pkp_structure_content, .pkp_structure_footer {
		width: 1160px !important;
	}
}

@media (min-width: 992px) and (max-width: 1199px) {
	.has_site_logo .pkp_head_wrapper {
		width: 100%;
	}
	.pkp_site_name, .pkp_navigation_primary_wrapper, .pkp_navigation_user, .pkp_structure_content, .pkp_structure_footer {
		width: 952px !important;
	}
}

@media (min-width: 768px) and (max-width: 991px) {
	.has_site_logo .pkp_head_wrapper {
		width: 100%;
	}
	.pkp_site_name,
	.pkp_navigation_primary_wrapper,
	.pkp_navigation_user,
	.pkp_structure_content,
	.pkp_structure_footer {
		width: 728px !important;
	}
}


/*IIPJ LOGO SIZE CUSTOMIZATION*/
.pkp_site_name .is_img img {
	max-height: 225px;
}

.pkp_site_name > a {
	padding-top: 0;
	padding-bottom: 0;
}

.pkp_navigation_user_wrapper {
	background: var(--brand-colour);
	width:100%;
}
.pkp_navigation_user.pkp_navigation_user {
	margin: auto;
}
.pkp_structure_page,
.pkp_structure_footer_wrapper {
	background: var(--background-colour);
}

.pkp_structure_content {
	background: white;
}

/* Fix for URLs in the reference list breaking out of container */
.references {
	overflow-wrap: break-word;
	word-wrap: break-word;
}
@media (max-width: 991px) {
        .pkp_site_nav_toggle > span::before, .pkp_site_nav_toggle > span::after {
                background: var(--brand-colour);
        }
        .pkp_site_nav_toggle > span {
                border-bottom-color: var(--brand-colour);
        }
        .pkp_site_name_wrapper {
                height: 9rem;
        }
        .pkp_site_nav_menu {
                background:var(--brand-colour);
        }
        .pkp_navigation_primary ul a, .pkp_navigation_user ul a,
        .pkp_navigation_primary ul a:hover, .pkp_navigation_user ul a:hover,
        .pkp_navigation_primary ul a:focus, .pkp_navigation_user ul a:focus {
                color: #ffffff;
                text-decoration-color: #ffffff;
        }
        .pkp_site_name .is_text, .pkp_navigation_user > li > a,
        .pkp_navigation_user > li > a:hover, .pkp_navigation_user > li > a:focus,
        .pkp_head_wrapper .pkp_search.is_open .search_prompt {
                color: #ffffff;
        }
        .pkp_navigation_primary_row {
                border-top: 0;
                background-color: var(--brand-colour);
                background: none;
        }
        .pkp_navigation_user_wrapper {
                background: var(--brand-colour);
                background: none;
                border-bottom: 0px;
        }
}

