/* ==========================================================================
   Journal Sisi Lain Realita — Apple-style sidebar & custom pages
   Upload : Website > Appearance > Advanced > Journal style sheet
   Theme  : ACahyabasic (warna biru), OJS 3.3
   Scope  : .pkp_structure_sidebar (sidebar blocks) and .slr-page (custom pages)
   ========================================================================== */

:root {
	--slr-accent: #01a39c;
	--slr-accent-ink: #00756f;
	--slr-accent-tint: rgba(1, 163, 156, .12);
	--slr-accent-wash: rgba(1, 163, 156, .06);
	--slr-label: #1d1d1f;
	--slr-label-2: #424245;
	--slr-label-3: #6e6e73;
	--slr-label-4: #86868b;
	--slr-chevron: #c7c7cc;
	--slr-separator: rgba(60, 60, 67, .16);
	--slr-fill: #f5f5f7;
	--slr-fill-2: #e8e8ed;
	--slr-surface: #ffffff;
	--slr-radius-s: 8px;
	--slr-radius: 14px;
	--slr-radius-l: 18px;
	--slr-shadow: 0 1px 1px rgba(0, 0, 0, .03), 0 4px 18px rgba(0, 0, 0, .05);
	--slr-shadow-hover: 0 2px 4px rgba(0, 0, 0, .05), 0 12px 32px rgba(0, 0, 0, .09);
	--slr-font: -apple-system, BlinkMacSystemFont, "SF Pro Text", "SF Pro Display", "Inter", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	--slr-ease: cubic-bezier(.25, .1, .25, 1);
}

/* ==========================================================================
   0. HEADER & LAYOUT
   ========================================================================== */

body {
	background: #fff !important;
}

.pkp_structure_content {
	box-shadow: none !important;
	padding-top: 40px !important;
}

.pkp_structure_head {
	background-image: linear-gradient(to bottom, #fff, #fff, #fff, #fff, #fff) !important;
	border-bottom: 0 !important;
}

.pkp_site_name .is_img img {
	margin-top: -20px;
	margin-bottom: -26px;
	max-height: 340px;
}

/* Desktop: logo spans the full header width, flush with the navigation bar edges */
@media (min-width: 992px) {
	.pkp_site_name_wrapper {
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	.pkp_site_name,
	.pkp_site_name .is_img {
		display: block !important;
		width: 100% !important;
	}

	.pkp_site_name .is_img img {
		width: 100% !important;
		max-width: 100% !important;
		height: auto !important;
		max-height: none !important;
	}
}

.pkp_structure_main {
	width: 845px;
}

.pkp_structure_sidebar {
	float: right;
	width: 285px;
}

/* --- iOS-style navigation bar ------------------------------------------- */

/* The theme paints the nav wrapper and dropdowns with its primary colour */
.pkp_site_nav_menu {
	background: #fff !important;
}

.pkp_nav_list li.profile {
	border-radius: 16px;
}

.pkp_navigation_primary_row {
	background: #fff !important;
	border: 1px solid rgba(60, 60, 67, .12) !important;
	border-radius: 25px;
	box-shadow: 0 1px 2px rgba(0, 0, 0, .04), 0 10px 30px -12px rgba(0, 0, 0, .14) !important;
}

#navigationPrimary > li > a,
#navigationPrimary ul a,
.pkp_navigation_search_wrapper a {
	font-family: var(--slr-font) !important;
	text-transform: none !important;
	letter-spacing: -.01em;
	-webkit-font-smoothing: antialiased;
}

#navigationPrimary > li > a {
	color: #000 !important;
	font-size: 14.5px !important;
	font-weight: 600 !important;
	border: 0 !important;
	background: transparent !important;
	transition: background-color .25s var(--slr-ease), color .25s var(--slr-ease), transform .2s var(--slr-ease);
}

#navigationPrimary > li > a:hover,
#navigationPrimary > li > a:focus,
#navigationPrimary > li:hover > a,
#navigationPrimary > li > a[aria-expanded="true"],
.pkp_navigation_search_wrapper a:hover,
.pkp_navigation_search_wrapper a:focus {
	background: var(--slr-accent-tint) !important;
	color: var(--slr-accent-ink) !important;
	outline: 0;
}

/* Current page: OJS puts pkp_page_* / pkp_op_* on <body>, so the matching
   menu item gets the hover look. Custom pages use their path as pkp_page_*. */
.pkp_page_index #navigationPrimary > li > a[href$="/sisilainrealita"],
.pkp_page_index #navigationPrimary > li > a[href$="/sisilainrealita/"],
.pkp_page_index #navigationPrimary > li > a[href$="/sisilainrealita/index"],
.pkp_page_issue.pkp_op_current #navigationPrimary > li > a[href$="/issue/current"],
.pkp_page_issue.pkp_op_archive #navigationPrimary > li > a[href$="/issue/archive"],
.pkp_page_issue.pkp_op_view #navigationPrimary > li > a[href$="/issue/archive"],
.pkp_page_announcement #navigationPrimary > li > a[href$="/announcement"],
.pkp_page_journalhistory #navigationPrimary > li > a[href$="/journalhistory" i],
.pkp_page_about #navigationPrimary > li:has(> ul a[href$="/about"]) > a,
.pkp_page_ourlocation #navigationPrimary > li:has(> ul a[href$="/ourlocation" i]) > a,
.pkp_page_search .pkp_navigation_search_wrapper a {
	background: var(--slr-accent-tint) !important;
	color: var(--slr-accent-ink) !important;
}

.pkp_page_about.pkp_op_index #navigationPrimary ul a[href$="/about"],
.pkp_page_about.pkp_op_privacy #navigationPrimary ul a[href$="/about/privacy"],
.pkp_page_about.pkp_op_contact #navigationPrimary ul a[href$="/about/contact"],
.pkp_page_ourlocation #navigationPrimary ul a[href$="/ourlocation" i] {
	background: var(--slr-accent-tint) !important;
	color: var(--slr-accent-ink) !important;
	font-weight: 600 !important;
}

#navigationPrimary > li > a:active {
	transform: scale(.96);
}

#navigationPrimary > li > a:focus-visible,
.pkp_navigation_search_wrapper a:focus-visible {
	outline: 2px solid var(--slr-accent) !important;
	outline-offset: 2px;
}

/* Chevron instead of the theme's triangle caret */
#navigationPrimary > li > a[aria-haspopup]::after {
	content: "\f107";
	width: auto;
	height: auto;
	margin-left: 6px;
	border: 0;
	overflow: visible;
	vertical-align: 0;
	font: normal normal normal 13px/1 FontAwesome;
	color: currentColor;
	transition: transform .25s var(--slr-ease), color .25s var(--slr-ease);
}

#navigationPrimary > li:hover > a[aria-haspopup]::after,
#navigationPrimary > li > a[aria-expanded="true"]::after {
	transform: rotate(180deg);
	color: var(--slr-accent-ink);
}

/* Dropdown = iOS context menu */
#navigationPrimary ul {
	top: calc(100% + 8px) !important;
	min-width: 15.5em;
	padding: 6px !important;
	background: #fff !important;
	border: 1px solid rgba(60, 60, 67, .12) !important;
	border-radius: 14px !important;
	box-shadow: 0 2px 8px rgba(0, 0, 0, .06), 0 22px 48px -10px rgba(0, 0, 0, .2) !important;
}

/* Hover bridge across the gap between the pill and the menu */
#navigationPrimary ul::before {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: -10px;
	height: 10px;
}

#navigationPrimary ul a {
	padding: 9px 12px !important;
	border: 0 !important;
	border-radius: 9px !important;
	color: var(--slr-label) !important;
	font-size: 14px !important;
	font-weight: 500 !important;
	transition: background-color .2s var(--slr-ease), color .2s var(--slr-ease);
}

#navigationPrimary ul a:hover,
#navigationPrimary ul a:focus {
	background: var(--slr-accent-tint) !important;
	color: var(--slr-accent-ink) !important;
}

/* Search: same pill behaviour as the menu items */
.pkp_navigation_search_wrapper a {
	color: #000 !important;
	font-size: 14.5px !important;
	font-weight: 600 !important;
	background: transparent !important;
	border: 0 !important;
	border-radius: 980px;
	transition: background-color .25s var(--slr-ease), color .25s var(--slr-ease), transform .2s var(--slr-ease);
}

.pkp_navigation_search_wrapper a .fa {
	color: inherit;
}

.pkp_navigation_search_wrapper a:active {
	transform: scale(.96);
}

.pkp_head_wrapper .pkp_search .search_controls .search_prompt {
	color: var(--slr-label) !important;
}

@media (min-width: 992px) {
	.pkp_navigation_primary_row {
		margin-top: 6px;
		padding: 7px 8px !important;
	}

	.pkp_navigation_primary_wrapper {
		display: flex !important;
		align-items: center;
		justify-content: space-between;
		gap: 12px;
	}

	.pkp_navigation_primary_wrapper::before,
	.pkp_navigation_primary_wrapper::after {
		display: none !important;
	}

	#navigationPrimary {
		display: flex !important;
		flex-wrap: wrap;
		align-items: center;
		gap: 2px;
		max-width: none !important;
		margin: 0 !important;
	}

	#navigationPrimary > li > a {
		display: inline-flex !important;
		align-items: center;
		margin: 0 !important;
		padding: 8px 14px !important;
		line-height: 20px !important;
		border-radius: 980px;
	}

	#navigationPrimary > li:hover > ul {
		left: 0 !important;
	}

	.pkp_navigation_search_wrapper {
		float: none !important;
		flex: none;
		margin: 0 !important;
	}

	.pkp_navigation_search_wrapper a {
		display: inline-flex !important;
		align-items: center;
		gap: 6px;
		margin: 0 !important;
		padding: 8px 16px !important;
		line-height: 20px !important;
	}
}

/* Menu icons are matched by link URL, so reordering the menu keeps them in place.
   Items without a specific rule get the generic page icon. */
#navigationPrimary > li > a::before {
	content: "\f15c";
	display: inline-block;
	margin-right: 8px;
	font: normal normal normal 14px/1 FontAwesome;
	color: currentColor;
	transition: transform .25s var(--slr-ease);
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
}

#navigationPrimary > li > a[href$="/sisilainrealita"]::before,
#navigationPrimary > li > a[href$="/sisilainrealita/"]::before,
#navigationPrimary > li > a[href$="/sisilainrealita/index"]::before { content: "\f015"; }
#navigationPrimary > li > a[href$="/about"]::before,
#navigationPrimary > li > a[href="#"]::before { content: "\f05a"; }
#navigationPrimary > li > a[href$="/issue/current"]::before { content: "\f02d"; }
#navigationPrimary > li > a[href$="/issue/archive"]::before { content: "\f187"; }
#navigationPrimary > li > a[href$="/announcement"]::before { content: "\f0a1"; }
#navigationPrimary > li > a[href$="/about/submissions"]::before { content: "\f1d8"; }
#navigationPrimary > li > a[href$="/about/editorialTeam"]::before { content: "\f0c0"; }
#navigationPrimary > li > a[href$="/about/contact"]::before { content: "\f0e0"; }
#navigationPrimary > li > a[href$="/journalhistory" i]::before { content: "\f1da"; }

/* --- User menu (Register / Login, or the account menu once signed in) --- */

.pkp_navigation_user_wrapper {
	z-index: 1001 !important;
}

@media (min-width: 992px) {
	.pkp_navigation_user_wrapper {
		right: 0 !important;
		padding-right: 0 !important;
	}
}

#navigationUser {
	display: flex !important;
	justify-content: flex-end;
	align-items: center;
	gap: 8px;
}

#navigationUser::before,
#navigationUser::after {
	display: none !important;
}

#navigationUser > li {
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
}

#navigationUser > li > a {
	display: inline-flex !important;
	align-items: center;
	gap: 7px;
	margin: 0 !important;
	padding: 7px 15px !important;
	font-family: var(--slr-font) !important;
	font-size: 13.5px !important;
	font-weight: 600 !important;
	line-height: 18px !important;
	letter-spacing: -.01em;
	text-transform: none !important;
	color: var(--slr-accent-ink) !important;
	background: rgba(255, 255, 255, .92) !important;
	border: 1px solid rgba(60, 60, 67, .14) !important;
	border-radius: 980px !important;
	box-shadow: 0 1px 2px rgba(0, 0, 0, .05), 0 6px 16px -8px rgba(0, 0, 0, .18) !important;
	-webkit-font-smoothing: antialiased;
	transition: background-color .25s var(--slr-ease), color .25s var(--slr-ease), border-color .25s var(--slr-ease), transform .2s var(--slr-ease), box-shadow .25s var(--slr-ease);
}

#navigationUser > li > a::before {
	content: "\f2bd";
	font: normal normal normal 14px/1 FontAwesome;
}

#navigationUser > li > a:hover,
#navigationUser > li > a:focus,
#navigationUser > li:hover > a {
	background: var(--slr-accent-tint) !important;
	border-color: transparent !important;
	color: var(--slr-accent-ink) !important;
	outline: 0;
}

#navigationUser > li > a:active {
	transform: scale(.96);
}

#navigationUser > li > a:focus-visible {
	outline: 2px solid var(--slr-accent) !important;
	outline-offset: 2px;
}

#navigationUser > li > a[href$="/user/register"]::before { content: "\f234"; }

#navigationUser > li > a[href$="/login"] {
	color: #fff !important;
	background: var(--slr-accent) !important;
	border-color: var(--slr-accent) !important;
	box-shadow: 0 1px 2px rgba(0, 0, 0, .06), 0 8px 18px -8px rgba(1, 163, 156, .7) !important;
}

#navigationUser > li > a[href$="/login"]::before { content: "\f090"; }

#navigationUser > li > a[href$="/login"]:hover,
#navigationUser > li > a[href$="/login"]:focus {
	color: #fff !important;
	background: var(--slr-accent-ink) !important;
	border-color: var(--slr-accent-ink) !important;
}

#navigationUser > li > a .task_count {
	top: 0 !important;
	width: 18px !important;
	height: 18px !important;
	margin-left: 2px !important;
	line-height: 18px !important;
	font-size: 11px !important;
	color: #fff !important;
	background: #ff3b30 !important;
}

#navigationUser ul {
	min-width: 12em !important;
	margin-top: 8px !important;
	padding: 6px !important;
	background: #fff !important;
	border: 1px solid rgba(60, 60, 67, .12) !important;
	border-radius: 14px !important;
	box-shadow: 0 2px 8px rgba(0, 0, 0, .06), 0 22px 48px -10px rgba(0, 0, 0, .2) !important;
}

#navigationUser ul::before {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: -12px;
	height: 12px;
}

#navigationUser ul a {
	display: block;
	padding: 9px 12px !important;
	border: 0 !important;
	border-radius: 9px !important;
	font-family: var(--slr-font) !important;
	font-size: 14px !important;
	font-weight: 500 !important;
	color: var(--slr-label) !important;
	transition: background-color .2s var(--slr-ease), color .2s var(--slr-ease);
}

#navigationUser ul a:hover,
#navigationUser ul a:focus {
	background: var(--slr-accent-tint) !important;
	color: var(--slr-accent-ink) !important;
}

#navigationUser ul a[href*="/login/signOut"] {
	color: #d70015 !important;
}

#navigationUser ul a[href*="/login/signOut"]:hover {
	background: rgba(255, 59, 48, .1) !important;
}

/* ==========================================================================
   1. SIDEBAR
   ========================================================================== */

.pkp_structure_sidebar {
	font-family: var(--slr-font);
	-webkit-font-smoothing: antialiased;
}

.pkp_structure_sidebar:before {
	border-left-color: var(--slr-separator);
}

.pkp_structure_sidebar .pkp_block {
	padding: 0 0 26px;
	font-size: 14px;
	line-height: 1.45;
}

.pkp_structure_sidebar .pkp_block .content {
	background: transparent;
}

.pkp_structure_sidebar .pkp_block p {
	margin: 0;
}

.pkp_structure_sidebar em.fa {
	font-style: normal;
}

/* ---------- Group header (sits above the card, iOS grouped-list style) --- */

.pkp_structure_sidebar .slr-group__title,
.pkp_structure_sidebar .block_language > .title,
.pkp_structure_sidebar .block_information > .title {
	position: static;
	display: block;
	width: auto;
	height: auto;
	margin: 0 0 8px;
	padding: 0 4px;
	background: none;
	border: 0;
	color: var(--slr-label-3);
	font-family: var(--slr-font);
	font-size: 12px;
	font-weight: 600;
	line-height: 1.3;
	letter-spacing: .06em;
	text-align: left;
	text-transform: uppercase;
}

/* ---------- Grouped list card ------------------------------------------ */

.pkp_structure_sidebar .slr-list,
.pkp_structure_sidebar .block_language .content ul,
.pkp_structure_sidebar .block_information .content ul {
	margin: 0;
	padding: 0;
	list-style: none;
	background: var(--slr-surface);
	border: 1px solid var(--slr-separator);
	border-radius: var(--slr-radius);
	box-shadow: var(--slr-shadow);
	overflow: hidden;
}

.pkp_structure_sidebar .pkp_block .slr-list > li,
.pkp_structure_sidebar .block_language .content ul > li,
.pkp_structure_sidebar .block_information .content ul > li {
	position: relative;
	display: block;
	margin: 0;
	padding: 0;
	background: transparent;
	border: 0;
	border-radius: 0;
	line-height: 1.35;
}

/* Inset hairline separator, starts after the icon like iOS */
.pkp_structure_sidebar .pkp_block .slr-list > li + li::before,
.pkp_structure_sidebar .block_language .content ul > li + li::before,
.pkp_structure_sidebar .block_information .content ul > li + li::before {
	content: "";
	position: absolute;
	top: 0;
	left: 52px;
	right: 0;
	height: 1px;
	background: var(--slr-separator);
	transform: scaleY(.6);
	transform-origin: top;
}

.pkp_structure_sidebar .block_language .content ul > li + li::before,
.pkp_structure_sidebar .block_information .content ul > li + li::before {
	left: 16px;
}

.pkp_structure_sidebar .pkp_block .slr-list > li > a,
.pkp_structure_sidebar .block_language .content ul > li > a,
.pkp_structure_sidebar .block_information .content ul > li > a {
	display: flex;
	align-items: center;
	gap: 12px;
	min-height: 44px;
	padding: 8px 14px 8px 12px;
	background: transparent;
	color: var(--slr-label);
	font-size: 14px;
	font-weight: 400;
	letter-spacing: -.005em;
	text-decoration: none;
	transition: background-color .2s var(--slr-ease);
}

.pkp_structure_sidebar .block_language .content ul > li > a,
.pkp_structure_sidebar .block_information .content ul > li > a {
	padding-left: 16px;
}

/* Disclosure chevron */
.pkp_structure_sidebar .pkp_block .slr-list > li > a::after,
.pkp_structure_sidebar .block_information .content ul > li > a::after {
	content: "\f105";
	margin-left: auto;
	padding-left: 8px;
	color: var(--slr-chevron);
	font: normal normal normal 16px/1 FontAwesome;
	transition: color .2s var(--slr-ease), transform .2s var(--slr-ease);
}

.pkp_structure_sidebar .pkp_block .slr-list > li > a:hover,
.pkp_structure_sidebar .pkp_block .slr-list > li > a:focus-visible,
.pkp_structure_sidebar .block_language .content ul > li > a:hover,
.pkp_structure_sidebar .block_information .content ul > li > a:hover {
	background: var(--slr-fill);
	color: var(--slr-label);
	text-decoration: none;
	outline: none;
}

.pkp_structure_sidebar .pkp_block .slr-list > li > a:hover::after,
.pkp_structure_sidebar .pkp_block .slr-list > li > a:focus-visible::after,
.pkp_structure_sidebar .block_information .content ul > li > a:hover::after {
	color: var(--slr-accent);
	transform: translateX(2px);
}

.pkp_structure_sidebar .pkp_block .slr-list > li > a:active {
	background: var(--slr-fill-2);
}

/* Icon squircle. The &nbsp; TinyMCE needs inside <em> is hidden via font-size:0. */
.pkp_structure_sidebar .pkp_block .slr-list > li > a > em.fa {
	flex: 0 0 28px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 7px;
	background: var(--slr-accent-tint);
	color: var(--slr-accent-ink);
	font-size: 0;
	transition: background-color .2s var(--slr-ease), color .2s var(--slr-ease);
}

.pkp_structure_sidebar .pkp_block .slr-list > li > a > em.fa::before {
	font-size: 14px;
	line-height: 1;
}

.pkp_structure_sidebar .pkp_block .slr-list > li > a:hover > em.fa,
.pkp_structure_sidebar .pkp_block .slr-list > li > a:focus-visible > em.fa {
	background: var(--slr-accent);
	color: #fff;
}

/* Language: checkmark on the active locale */
.pkp_structure_sidebar .block_language .content ul > li.current > a {
	color: var(--slr-accent-ink);
	font-weight: 600;
}

.pkp_structure_sidebar .block_language .content ul > li.current > a::after {
	content: "\f00c";
	margin-left: auto;
	color: var(--slr-accent);
	font: normal normal normal 13px/1 FontAwesome;
}

/* ---------- Plain card (actions, template, issue, indexing, visitor) ---- */

.pkp_structure_sidebar .slr-card {
	padding: 16px;
	background: var(--slr-surface);
	border: 1px solid var(--slr-separator);
	border-radius: var(--slr-radius);
	box-shadow: var(--slr-shadow);
	color: var(--slr-label);
}

.pkp_structure_sidebar .pkp_block .slr-card > * + * {
	margin-top: 14px;
}

.pkp_structure_sidebar .slr-card__lead {
	color: var(--slr-label-3);
	font-size: 13px;
	line-height: 1.45;
}

.pkp_structure_sidebar .slr-card__lead strong {
	display: block;
	margin-bottom: 2px;
	color: var(--slr-label);
	font-size: 15px;
	font-weight: 600;
	letter-spacing: -.01em;
}

.pkp_structure_sidebar .slr-card__link {
	text-align: center;
	font-size: 13px;
}

.pkp_structure_sidebar .slr-card__link a {
	color: var(--slr-accent-ink);
	font-weight: 500;
	text-decoration: none;
}

.pkp_structure_sidebar .slr-card__link a:hover {
	text-decoration: underline;
}

.pkp_structure_sidebar .slr-card__link em.fa {
	font-size: 0;
}

.pkp_structure_sidebar .slr-card__link em.fa::before {
	margin-left: 4px;
	font-size: 13px;
}

/* ---------- Buttons (pill) --------------------------------------------- */

.slr-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 40px;
	padding: 9px 20px;
	border: 0;
	border-radius: 980px;
	font-family: var(--slr-font);
	font-size: 14px;
	font-weight: 500;
	letter-spacing: -.01em;
	line-height: 1.2;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	transition: background-color .2s var(--slr-ease), color .2s var(--slr-ease), transform .2s var(--slr-ease);
}

.slr-btn:hover,
.slr-btn:focus-visible {
	text-decoration: none;
}

.slr-btn:active {
	transform: scale(.98);
}

.slr-btn > em.fa {
	font-size: 0;
}

.slr-btn > em.fa::before {
	font-size: 14px;
}

a.slr-btn--filled,
.pkp_structure_sidebar a.slr-btn--filled {
	background: var(--slr-accent);
	color: #fff;
}

a.slr-btn--filled:hover,
a.slr-btn--filled:focus-visible {
	background: var(--slr-accent-ink);
	color: #fff;
}

a.slr-btn--tinted,
.pkp_structure_sidebar a.slr-btn--tinted {
	background: var(--slr-accent-tint);
	color: var(--slr-accent-ink);
}

a.slr-btn--tinted:hover,
a.slr-btn--tinted:focus-visible {
	background: rgba(1, 163, 156, .2);
	color: var(--slr-accent-ink);
}

.pkp_structure_sidebar .slr-btn {
	width: 100%;
}

/* ---------- Actions block --------------------------------------------- */

.pkp_structure_sidebar .slr-actions__btns {
	display: grid;
	gap: 8px;
}

.pkp_structure_sidebar .slr-share {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding-top: 14px;
	border-top: 1px solid var(--slr-separator);
}

.pkp_structure_sidebar .slr-share__label {
	margin-right: 2px;
	color: var(--slr-label-4);
	font-size: 12px;
	font-weight: 500;
}

.pkp_structure_sidebar .slr-share a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background: var(--slr-fill);
	color: var(--slr-label-2);
	font-size: 0;
	text-decoration: none;
	transition: background-color .2s var(--slr-ease), color .2s var(--slr-ease);
}

.pkp_structure_sidebar .slr-share a > em.fa::before {
	font-size: 14px;
}

.pkp_structure_sidebar .slr-share a:hover,
.pkp_structure_sidebar .slr-share a:focus-visible {
	background: var(--slr-accent);
	color: #fff;
}

/* ---------- Template block -------------------------------------------- */

.pkp_structure_sidebar .slr-template {
	display: flex;
	align-items: flex-start;
	gap: 12px;
}

.pkp_structure_sidebar .slr-template > em.fa {
	flex: 0 0 40px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 20px;
	background: #2b579a;
	color: #fff;
	font-size: 0;
}

.pkp_structure_sidebar .slr-template > em.fa::before {
	font-size: 20px;
}

/* ---------- Journal issue block --------------------------------------- */

.pkp_structure_sidebar .slr-issue__cover {
	margin: 0;
	text-align: center;
}

.pkp_structure_sidebar .slr-issue__cover a {
	display: block;
	border-radius: 12px;
}

.pkp_structure_sidebar .slr-issue__cover img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
	margin: 0 auto;
	object-fit: cover;
	border-radius: 12px;
	box-shadow: 0 1px 2px rgba(0, 0, 0, .08), 0 14px 30px -12px rgba(0, 0, 0, .35);
	transition: transform .35s var(--slr-ease), box-shadow .35s var(--slr-ease);
}

.pkp_structure_sidebar .slr-issue__cover a:hover img {
	transform: translateY(-3px) scale(1.01);
	box-shadow: 0 2px 4px rgba(0, 0, 0, .08), 0 22px 40px -14px rgba(0, 0, 0, .4);
}

.pkp_structure_sidebar .slr-issue__name {
	color: var(--slr-label-3);
	font-size: 12.5px;
	line-height: 1.45;
	text-align: center;
}

.pkp_structure_sidebar .slr-issue__name strong {
	display: block;
	color: var(--slr-label);
	font-size: 15px;
	font-weight: 600;
	letter-spacing: -.01em;
}

/* Key–value rows */
.pkp_structure_sidebar .slr-kv {
	margin: 0;
	padding: 0;
	list-style: none;
	background: var(--slr-fill);
	border-radius: 10px;
	overflow: hidden;
}

.pkp_structure_sidebar .pkp_block .slr-kv > li {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 10px;
	margin: 0 12px;
	padding: 9px 0;
	background: transparent;
	border: 0;
	border-radius: 0;
	font-size: 13px;
	line-height: 1.35;
}

.pkp_structure_sidebar .pkp_block .slr-kv > li + li {
	border-top: 1px solid var(--slr-separator);
}

.pkp_structure_sidebar .slr-kv span {
	color: var(--slr-label-3);
	white-space: nowrap;
}

.pkp_structure_sidebar .slr-kv strong {
	color: var(--slr-label);
	font-weight: 500;
	text-align: right;
}

.pkp_structure_sidebar .pkp_block .slr-kv a {
	display: inline;
	padding: 0;
	background: none;
	color: var(--slr-accent-ink);
	text-decoration: none;
}

.pkp_structure_sidebar .pkp_block .slr-kv a:hover {
	text-decoration: underline;
}

/* ---------- Indexing logos -------------------------------------------- */

.pkp_structure_sidebar .slr-logos {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 8px;
}

.pkp_structure_sidebar .slr-logos a {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 60px;
	padding: 10px;
	border-radius: 10px;
	background: var(--slr-fill);
	transition: background-color .2s var(--slr-ease), box-shadow .2s var(--slr-ease);
}

.pkp_structure_sidebar .slr-logos a:hover {
	background: var(--slr-surface);
	box-shadow: 0 0 0 1px var(--slr-separator), var(--slr-shadow-hover);
}

.pkp_structure_sidebar .slr-logos img {
	max-width: 100%;
	max-height: 34px;
	object-fit: contain;
}

/* ---------- Visitor --------------------------------------------------- */

.pkp_structure_sidebar .slr-visitor {
	text-align: center;
}

.pkp_structure_sidebar .slr-visitor img {
	display: inline-block;
}

/* StatCounter guest summary, cropped to its chart + totals panel.
   Offsets match StatCounter's layout at a 560px-wide frame. */
.pkp_structure_sidebar .slr-statchart {
	--sc-scale: .56;
	position: relative;
	width: calc(446px * var(--sc-scale));
	max-width: 100%;
	height: calc(250px * var(--sc-scale));
	margin: 0 auto 12px;
	overflow: hidden;
	border-radius: 12px;
	background: #fff;
	box-shadow: inset 0 0 0 1px var(--slr-separator);
}

.pkp_structure_sidebar .slr-statchart iframe {
	position: absolute;
	top: calc(-205px * var(--sc-scale));
	left: calc(-80px * var(--sc-scale));
	width: 560px;
	height: 600px;
	border: 0;
	transform: scale(var(--sc-scale));
	transform-origin: 0 0;
	pointer-events: none;
}

/* ==========================================================================
   2. CUSTOM PAGES (Navigation Menu Items > Custom Page content)
   ========================================================================== */

.page:has(> .slr-page) > .page_title {
	margin: 8px 0 6px;
	color: var(--slr-label);
	font-family: var(--slr-font);
	font-size: 34px;
	font-weight: 700;
	letter-spacing: -.022em;
	line-height: 1.15;
}

.slr-page {
	max-width: 760px;
	color: var(--slr-label);
	font-family: var(--slr-font);
	font-size: 16px;
	line-height: 1.6;
	letter-spacing: -.003em;
	-webkit-font-smoothing: antialiased;
}

.slr-page p {
	margin: 0 0 14px;
}

/* Justified body text; headings, tables, buttons and key-value rows stay left-aligned */
.slr-page p,
.slr-page li,
.slr-page .slr-note,
.slr-page table.slr-table td {
	text-align: justify;
	-webkit-hyphens: auto;
	hyphens: auto;
}

.slr-page p.slr-actions,
.slr-page p.slr-eyebrow,
.slr-page .slr-grid > .slr-card p,
.slr-page .slr-grid > .slr-card li,
.slr-page ul.slr-kv > li,
.slr-page ul.slr-chips > li,
.slr-page table.slr-table .slr-num {
	text-align: left;
	-webkit-hyphens: manual;
	hyphens: manual;
}

.slr-page table.slr-table .slr-num {
	text-align: center;
}

.slr-page a {
	color: var(--slr-accent-ink);
	text-decoration: none;
}

.slr-page a:hover {
	text-decoration: underline;
}

.slr-page h2 {
	margin: 40px 0 12px;
	color: var(--slr-label);
	font-family: var(--slr-font);
	font-size: 24px;
	font-weight: 600;
	letter-spacing: -.015em;
	line-height: 1.25;
}

.slr-page h3 {
	margin: 26px 0 8px;
	color: var(--slr-label);
	font-family: var(--slr-font);
	font-size: 18px;
	font-weight: 600;
	letter-spacing: -.01em;
	line-height: 1.3;
}

.slr-page h2:first-child,
.slr-page h3:first-child {
	margin-top: 0;
}

.slr-page ul,
.slr-page ol {
	margin: 0 0 16px;
	padding-left: 22px;
}

.slr-page li {
	margin: 0 0 6px;
}

.slr-page em.fa {
	font-style: normal;
}

.slr-page .slr-lead {
	margin-bottom: 22px;
	color: var(--slr-label-2);
	font-size: 19px;
	line-height: 1.5;
	letter-spacing: -.01em;
}

.slr-page .slr-eyebrow {
	margin-bottom: 4px;
	color: var(--slr-accent-ink);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: .04em;
	text-transform: uppercase;
}

.slr-page .slr-muted {
	color: var(--slr-label-3);
	font-size: 14px;
}

/* Cards */
.slr-page .slr-card {
	margin: 0 0 16px;
	padding: 22px 24px;
	background: var(--slr-fill);
	border-radius: var(--slr-radius-l);
}

.slr-page .slr-card > :last-child {
	margin-bottom: 0;
}

.slr-page .slr-card h3 {
	margin-top: 0;
}

.slr-page .slr-card--accent {
	background: var(--slr-accent-wash);
	box-shadow: inset 0 0 0 1px var(--slr-accent-tint);
}

.slr-page .slr-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 14px;
	margin: 0 0 20px;
}

.slr-page .slr-grid > .slr-card {
	margin: 0;
}

.slr-page .slr-card > em.fa {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	margin-bottom: 12px;
	border-radius: 20px;
	background: var(--slr-accent);
	color: #fff;
	font-size: 0;
}

.slr-page .slr-card > em.fa::before {
	font-size: 17px;
}

.slr-page .slr-card p {
	margin-bottom: 8px;
}

.slr-page .slr-grid .slr-card h3 {
	margin-bottom: 6px;
	font-size: 16px;
}

.slr-page .slr-grid .slr-card p {
	color: var(--slr-label-2);
	font-size: 14.5px;
	line-height: 1.5;
}

/* Callout */
.slr-page .slr-note {
	position: relative;
	margin: 0 0 18px;
	padding: 16px 18px 16px 50px;
	background: var(--slr-accent-wash);
	border-radius: var(--slr-radius);
	color: var(--slr-label-2);
	font-size: 15px;
	line-height: 1.5;
}

.slr-page .slr-note::before {
	content: "\f05a";
	position: absolute;
	left: 18px;
	top: 16px;
	color: var(--slr-accent);
	font: normal normal normal 18px/1.3 FontAwesome;
}

.slr-page .slr-note--warn {
	background: rgba(255, 159, 10, .1);
}

.slr-page .slr-note--warn::before {
	content: "\f071";
	color: #c77700;
}

/* Numbered steps (vertical timeline) */
.slr-page ol.slr-steps {
	margin: 0 0 20px;
	padding: 0;
	list-style: none;
	counter-reset: slr-step;
}

.slr-page ol.slr-steps > li {
	position: relative;
	margin: 0;
	padding: 0 0 22px 52px;
	counter-increment: slr-step;
}

.slr-page ol.slr-steps > li::before {
	content: counter(slr-step);
	position: absolute;
	left: 0;
	top: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background: var(--slr-accent);
	color: #fff;
	font-size: 14px;
	font-weight: 600;
}

.slr-page ol.slr-steps > li::after {
	content: "";
	position: absolute;
	left: 15px;
	top: 38px;
	bottom: 4px;
	width: 2px;
	border-radius: 2px;
	background: var(--slr-fill-2);
}

.slr-page ol.slr-steps > li:last-child {
	padding-bottom: 0;
}

.slr-page ol.slr-steps > li:last-child::after {
	display: none;
}

.slr-page ol.slr-steps strong {
	display: block;
	padding-top: 4px;
	color: var(--slr-label);
	font-size: 16px;
	font-weight: 600;
}

.slr-page ol.slr-steps .slr-tag {
	margin-left: 6px;
	vertical-align: 1px;
}

/* Tag / chip */
.slr-page .slr-tag {
	display: inline-block;
	padding: 2px 9px;
	border-radius: 980px;
	background: var(--slr-fill-2);
	color: var(--slr-label-2);
	font-size: 12px;
	font-weight: 500;
	line-height: 1.5;
}

.slr-page ul.slr-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0 0 20px;
	padding: 0;
	list-style: none;
}

.slr-page ul.slr-chips > li {
	margin: 0;
	padding: 7px 14px;
	border-radius: 980px;
	background: var(--slr-fill);
	color: var(--slr-label);
	font-size: 14px;
	line-height: 1.3;
}

/* Checklist */
.slr-page ul.slr-check {
	padding: 0;
	list-style: none;
}

.slr-page ul.slr-check > li {
	position: relative;
	padding-left: 30px;
}

.slr-page ul.slr-check > li::before {
	content: "\f00c";
	position: absolute;
	left: 0;
	top: 3px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background: var(--slr-accent-tint);
	color: var(--slr-accent-ink);
	font: normal normal normal 11px/1 FontAwesome;
}

/* Key–value list */
.slr-page ul.slr-kv {
	margin: 0 0 20px;
	padding: 0 18px;
	list-style: none;
	background: var(--slr-fill);
	border-radius: var(--slr-radius);
}

.slr-page ul.slr-kv > li {
	display: flex;
	justify-content: space-between;
	gap: 16px;
	margin: 0;
	padding: 12px 0;
	font-size: 15px;
}

.slr-page ul.slr-kv > li + li {
	border-top: 1px solid var(--slr-separator);
}

.slr-page ul.slr-kv span {
	color: var(--slr-label-3);
}

.slr-page ul.slr-kv strong {
	font-weight: 500;
	text-align: right;
}

/* People (reviewers, editors) */
.slr-page ul.slr-people {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
	gap: 12px;
	margin: 0 0 20px;
	padding: 0;
	list-style: none;
}

.slr-page ul.slr-people > li {
	margin: 0;
	padding: 16px 18px;
	background: var(--slr-fill);
	border-radius: var(--slr-radius);
	color: var(--slr-label-3);
	font-size: 14px;
	line-height: 1.45;
}

.slr-page ul.slr-people strong {
	display: block;
	margin-bottom: 2px;
	color: var(--slr-label);
	font-size: 15px;
	font-weight: 600;
}

/* Tables */
.slr-page .slr-table-wrap {
	margin: 0 0 20px;
	overflow-x: auto;
	border: 1px solid var(--slr-separator);
	border-radius: var(--slr-radius);
}

.slr-page table.slr-table {
	width: 100%;
	margin: 0;
	border: 0;
	border-collapse: collapse;
	font-size: 14.5px;
	line-height: 1.45;
}

.slr-page table.slr-table th,
.slr-page table.slr-table td {
	padding: 12px 16px;
	border: 0;
	text-align: left;
	vertical-align: top;
}

.slr-page table.slr-table thead th {
	background: var(--slr-fill);
	color: var(--slr-label-3);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .04em;
	text-transform: uppercase;
}

.slr-page table.slr-table tbody tr + tr td,
.slr-page table.slr-table tbody tr + tr th {
	border-top: 1px solid var(--slr-separator);
}

.slr-page table.slr-table tbody th {
	color: var(--slr-label);
	font-weight: 600;
}

.slr-page table.slr-table .slr-num {
	text-align: center;
	font-variant-numeric: tabular-nums;
}

/* Map */
.slr-page .slr-map {
	margin: 0 0 20px;
	overflow: hidden;
	border-radius: var(--slr-radius-l);
	background: var(--slr-fill);
	line-height: 0;
}

.slr-page .slr-map iframe {
	width: 100%;
	height: 360px;
	border: 0;
}

/* Button row */
.slr-page .slr-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 6px 0 20px;
}

.slr-page a.slr-btn:hover {
	text-decoration: none;
}

.slr-page a.slr-btn--filled,
.slr-page a.slr-btn--filled:hover {
	color: #fff;
}

/* Admin placeholder — remove once filled in */
.slr-ph {
	padding: 1px 6px;
	border-radius: 6px;
	background: #fff4cc;
	box-shadow: inset 0 0 0 1px #f0c94a;
	color: #7a5a00;
	font-size: .9em;
	font-weight: 600;
}

.slr-page .slr-updated {
	margin-top: 32px;
	padding-top: 14px;
	border-top: 1px solid var(--slr-separator);
	color: var(--slr-label-4);
	font-size: 13px;
}

/* ==========================================================================
   3. HOMEPAGE ADDITIONAL CONTENT (Appearance > Setup > Additional Content)
   ========================================================================== */

.additional_content:has(> .slr-home) {
	margin-bottom: 36px;
}

.slr-page.slr-home {
	max-width: none;
}

.slr-home h2 {
	margin-top: 44px;
}

/* Hero: full-bleed photo (upload the image, keep this URL in sync) + teal overlay */
.slr-home .slr-home__hero {
	position: relative;
	isolation: isolate;
	margin: 0 0 16px;
	padding: 40px 38px 34px;
	overflow: hidden;
	border-radius: 22px;
	background: #0b2a2c;
	color: #fff;
	box-shadow: 0 18px 40px -18px rgba(0, 60, 58, .55);
}

.slr-home .slr-home__hero::before,
.slr-home .slr-home__hero::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
}

.slr-home .slr-home__hero::before {
	background: url("https://journal.uir.ac.id/public/site/images/jurnalrealita/mceclip1.jpg") 70% center / cover no-repeat;
	transform-origin: 70% 55%;
	animation: slr-hero-zoom 18s ease-in-out infinite alternate;
}

.slr-home .slr-home__hero::after {
	background:
		linear-gradient(90deg, rgba(0, 32, 31, .94) 0%, rgba(0, 46, 44, .8) 45%, rgba(0, 46, 44, .25) 100%);
}

@keyframes slr-hero-zoom {
	from { transform: scale(1); }
	to { transform: scale(1.1); }
}

.slr-home .slr-home__hero-text {
	text-align: left;
}

.slr-page .slr-home__hero .slr-eyebrow {
	display: inline-block;
	margin: 0 0 18px;
	padding: 6px 14px;
	border: 1px solid rgba(255, 255, 255, .35);
	border-radius: 980px;
	background: rgba(255, 255, 255, .12);
	color: #fff;
	font-size: 11.5px;
	letter-spacing: .12em;
}

.slr-page .slr-home__hero h2 {
	margin: 0 0 8px;
	color: #fff;
	font-size: 40px;
	font-weight: 800;
	letter-spacing: -.02em;
	line-height: 1.1;
	text-align: left;
}

.slr-page .slr-home__hero h2 span {
	color: #7ff0e8;
}

.slr-page .slr-home__hero .slr-home__tagline {
	margin: 0 0 16px;
	color: #fff;
	font-size: 19px;
	font-weight: 600;
	text-align: left;
}

.slr-page .slr-home__hero .slr-lead {
	margin-bottom: 26px;
	color: rgba(255, 255, 255, .88);
	font-size: 16px;
	line-height: 1.65;
	text-align: justify;
	-webkit-hyphens: auto;
	hyphens: auto;
}

.slr-page .slr-home__hero .slr-lead em {
	color: #fff;
}

.slr-home .slr-home__hero .slr-actions {
	margin-bottom: 0;
}

.slr-page .slr-home__hero a.slr-btn--filled,
.slr-page .slr-home__hero a.slr-btn--filled:hover {
	background: #fff;
	color: var(--slr-accent-ink) !important;
	box-shadow: 0 6px 18px -6px rgba(0, 0, 0, .45);
}

.slr-page .slr-home__hero a.slr-btn--tinted {
	border: 1px solid rgba(255, 255, 255, .4);
	background: rgba(255, 255, 255, .12);
	color: #fff;
}

.slr-page .slr-home__hero a.slr-btn--tinted:hover {
	background: rgba(255, 255, 255, .22);
	color: #fff;
}

/* Journal identity = professional identity sheet: header, key-figure strip, metadata grid */
.slr-page .slr-id {
	margin: 0 0 20px;
	overflow: hidden;
	border-radius: 24px;
	background: #fff;
	box-shadow: inset 0 0 0 1px var(--slr-separator), 0 1px 2px rgba(0, 0, 0, .04), 0 24px 48px -30px rgba(0, 40, 38, .35);
}

.slr-page .slr-id p {
	margin: 0;
	text-align: left;
	-webkit-hyphens: manual;
	hyphens: manual;
}

.slr-page .slr-id ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.slr-page .slr-id li {
	margin: 0;
	text-align: left;
	-webkit-hyphens: manual;
	hyphens: manual;
}

/* Header */
.slr-page .slr-id__head {
	position: relative;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 16px 24px;
	padding: 26px 28px;
	overflow: hidden;
	background:
		radial-gradient(60% 120% at 100% 0%, rgba(1, 163, 156, .12) 0%, rgba(1, 163, 156, 0) 70%),
		linear-gradient(180deg, #f6fbfb 0%, #fff 100%);
	border-bottom: 1px solid var(--slr-separator);
}

.slr-page .slr-id__brand {
	display: flex;
	align-items: center;
	gap: 16px;
	min-width: 0;
}

.slr-page img.slr-id__logo {
	display: block;
	flex: none;
	width: 72px;
	height: 72px;
	margin: 0;
	filter: drop-shadow(0 8px 14px rgba(120, 85, 10, .35));
}

.slr-page p.slr-id__kicker {
	color: var(--slr-accent-ink);
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
}

.slr-page p.slr-id__name {
	margin: 2px 0 3px;
	color: var(--slr-label);
	font-size: 24px;
	font-weight: 800;
	letter-spacing: -.022em;
	line-height: 1.15;
}

.slr-page p.slr-id__pub {
	color: var(--slr-label-3);
	font-size: 13.5px;
}

.slr-page p.slr-id__badges {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

/* Glass badges: soft colour blobs behind them give the frosted glass something to refract */
.slr-page p.slr-id__badges {
	position: relative;
	isolation: isolate;
}

.slr-page p.slr-id__badges::before {
	content: "";
	position: absolute;
	inset: -14px -10px;
	z-index: -1;
	background:
		radial-gradient(closest-side at 22% 55%, rgba(255, 159, 10, .38), transparent),
		radial-gradient(closest-side at 82% 45%, rgba(1, 163, 156, .42), transparent);
	filter: blur(8px);
	pointer-events: none;
}

.slr-page .slr-id__badge {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 7px 14px;
	border: 1px solid rgba(255, 255, 255, .85);
	border-radius: 980px;
	background: linear-gradient(180deg, rgba(255, 255, 255, .78) 0%, rgba(255, 255, 255, .42) 100%);
	-webkit-backdrop-filter: blur(16px) saturate(180%);
	backdrop-filter: blur(16px) saturate(180%);
	box-shadow:
		inset 0 1px 0 #fff,
		inset 0 -1px 0 rgba(0, 0, 0, .04),
		0 0 0 .5px rgba(0, 0, 0, .06),
		0 8px 20px -8px rgba(0, 60, 58, .3);
	color: var(--slr-label);
	font-size: 12.5px;
	font-weight: 600;
	white-space: nowrap;
}

.slr-page .slr-id__badge::before {
	content: "";
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--slr-accent);
	box-shadow: 0 0 0 2px rgba(1, 163, 156, .18), 0 0 8px rgba(1, 163, 156, .6);
}

.slr-page .slr-id__badge--pending::before {
	background: #ff9f0a;
	animation: slr-pulse 2s ease-out infinite;
}

@keyframes slr-pulse {
	0% { box-shadow: 0 0 0 0 rgba(255, 159, 10, .55); }
	70% { box-shadow: 0 0 0 7px rgba(255, 159, 10, 0); }
	100% { box-shadow: 0 0 0 0 rgba(255, 159, 10, 0); }
}

/* Key figures */
.slr-page ul.slr-id__stats {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	background: #fff;
	border-bottom: 1px solid var(--slr-separator);
}

.slr-page ul.slr-id__stats > li {
	display: flex;
	flex-direction: column;
	gap: 4px;
	padding: 20px 22px;
}

.slr-page ul.slr-id__stats > li + li {
	border-left: 1px solid var(--slr-separator);
}

.slr-page .slr-id__stats strong {
	color: var(--slr-accent-ink);
	font-size: 28px;
	font-weight: 800;
	letter-spacing: -.03em;
	line-height: 1.05;
	font-variant-numeric: tabular-nums;
}

.slr-page .slr-id__stats strong.slr-id__word {
	font-size: 22px;
	line-height: 1.25;
}

.slr-page .slr-id__stats span {
	color: var(--slr-label);
	font-size: 13px;
	font-weight: 600;
}

.slr-page .slr-id__stats small {
	color: var(--slr-label-3);
	font-size: 12px;
}

.slr-page .slr-id__stats a {
	color: var(--slr-accent-ink);
	text-decoration: none;
}

.slr-page .slr-id__stats a:hover {
	text-decoration: underline;
}

/* Metadata grid */
.slr-page ul.slr-id__meta {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	padding: 6px 28px 10px;
	column-gap: 32px;
}

.slr-page ul.slr-id__meta > li {
	display: flex;
	align-items: center;
	gap: 14px;
	min-width: 0;
	padding: 16px 0;
	border-bottom: 1px solid var(--slr-separator);
}

.slr-page ul.slr-id__meta > li:nth-last-child(-n + 2) {
	border-bottom: 0;
}

.slr-page ul.slr-id__meta > li > em.fa {
	display: inline-flex;
	flex: none;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border-radius: 25px;
	background: var(--slr-accent-tint);
	color: var(--slr-accent-ink);
	font-size: 0;
}

.slr-page ul.slr-id__meta > li > em.fa::before {
	display: block;
	font-size: 15px;
	line-height: 1;
}

.slr-page ul.slr-id__meta > li > span {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
	color: var(--slr-label-3);
	font-size: 11.5px;
	font-weight: 600;
	letter-spacing: .06em;
	text-transform: uppercase;
}

.slr-page ul.slr-id__meta > li > span > strong {
	color: var(--slr-label);
	font-size: 15.5px;
	font-weight: 700;
	letter-spacing: -.01em;
	text-transform: none;
	font-variant-numeric: tabular-nums;
	overflow-wrap: anywhere;
}

.slr-page ul.slr-id__meta a {
	color: var(--slr-accent-ink);
	text-decoration: none;
}

.slr-page ul.slr-id__meta a:hover {
	text-decoration: underline;
	text-underline-offset: 3px;
}

.slr-page .slr-id__mono {
	font-family: ui-monospace, "SF Mono", "Cascadia Mono", Consolas, monospace;
	font-size: 14.5px;
	letter-spacing: 0;
}

.slr-home .slr-home__address {
	padding: 22px 24px;
	border-radius: var(--slr-radius-l);
	background: #fff;
	box-shadow: inset 0 0 0 1px var(--slr-separator), var(--slr-shadow);
}

.slr-home p.slr-home__org {
	position: relative;
	margin-bottom: 16px;
	padding-left: 52px;
	color: var(--slr-label-3);
	font-size: 14.5px;
	line-height: 1.45;
	text-align: left;
}

.slr-home p.slr-home__org strong {
	color: var(--slr-label);
	font-size: 17px;
	font-weight: 600;
}

.slr-home p.slr-home__org > em.fa {
	position: absolute;
	left: 0;
	top: 2px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border-radius: 20px;
	background: var(--slr-accent);
	color: #fff;
	font-size: 0;
}

.slr-home p.slr-home__org > em.fa::before {
	font-size: 17px;
}

.slr-home .slr-home__address ul.slr-kv {
	margin-bottom: 16px;
}

.slr-home .slr-home__address ul.slr-kv strong {
	max-width: 70%;
	overflow-wrap: anywhere;
}

/* ==========================================================================
   3b. CURRENT ISSUE (homepage) & ISSUE TABLE OF CONTENTS
   The issue heading (cover, title, date, "View All Issues") is laid out as one
   card: .obj_issue_toc and .heading use display:contents so their children
   join the .current_issue grid; ::before paints the card behind them.
   ========================================================================== */

.pkp_page_index .additional_content {
	padding: 0px 0px 0px 3px;
  }

.pkp_page_index .current_issue {
	display: grid;
	grid-template-columns: 172px minmax(0, 1fr);
	column-gap: 24px;
	margin: 44px -30px 0;
	font-family: var(--slr-font);
}

.pkp_page_index .current_issue::before {
	content: "";
	grid-column: 1 / -1;
	grid-row: 2 / 7;
	border-radius: 22px;
	background:
		radial-gradient(70% 90% at 100% 0%, rgba(1, 163, 156, .14) 0%, rgba(1, 163, 156, 0) 60%),
		linear-gradient(180deg, #f3fbfa 0%, #fff 100%);
	box-shadow: inset 0 0 0 0px var(--slr-accent-tint), 0 18px 40px -26px rgba(0, 60, 58, .35);
}

.pkp_page_index .current_issue > h2 {
	display: block;
	grid-column: 1 / -1;
	grid-row: 1;
	margin: 0 0 16px;
	padding: 0;
	border: 0;
	color: var(--slr-label);
	font-family: var(--slr-font);
	font-size: 24px;
	font-weight: 700;
	letter-spacing: -.02em;
	text-transform: none;
}

.pkp_page_index .current_issue .obj_issue_toc,
.pkp_page_index .current_issue .obj_issue_toc > .heading {
	display: contents;
}

.pkp_page_index .current_issue .obj_issue_toc > .heading::before,
.pkp_page_index .current_issue .obj_issue_toc > .heading::after {
	display: none;
}

.pkp_page_index .current_issue .heading > .cover {
	grid-column: 1;
	grid-row: 2 / 7;
	float: none;
	width: auto;
	margin: 22px 0 22px 22px;
}

.pkp_page_index .current_issue .heading > .cover img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: 12px;
	box-shadow: 0 2px 4px rgba(0, 0, 0, .08), 0 16px 30px -12px rgba(0, 0, 0, .35);
	transition: transform .3s var(--slr-ease);
}

.pkp_page_index .current_issue .heading > .cover:hover img {
	transform: translateY(-3px) scale(1.02);
}

.pkp_page_index .current_issue .current_issue_title {
	grid-column: 2;
	grid-row: 2;
	align-self: end;
	margin: 22px 24px 12px 0;
	color: var(--slr-label);
	font-family: var(--slr-font);
	font-size: 21px;
	font-weight: 700;
	letter-spacing: -.018em;
	line-height: 1.3;
}

.pkp_page_index .current_issue .current_issue_title::before {
	content: "Latest Issue";
	display: block;
	margin-bottom: 6px;
	color: var(--slr-accent-ink);
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
}

.pkp_page_index .current_issue .heading > .published {
	grid-column: 2;
	grid-row: 4;
	justify-self: start;
	align-self: center;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin: 0 0 16px;
	padding: 6px 12px;
	border-radius: 980px;
	background: #fff;
	box-shadow: inset 0 0 0 1px var(--slr-separator);
	font-family: var(--slr-font);
	font-size: 13px;
}

.pkp_page_index .current_issue .heading > .published::before {
	content: "\f073";
	font: normal normal normal 13px/1 FontAwesome;
	color: var(--slr-accent);
}

.pkp_page_index .current_issue .heading > .published .label {
	color: var(--slr-label-3);
	font-weight: 600;
	text-transform: none;
}

.pkp_page_index .current_issue .heading > .published .value {
	margin: 0;
	color: var(--slr-label);
	font-weight: 600;
	font-variant-numeric: tabular-nums;
}

.pkp_page_index .current_issue .heading > .pub_id,
.pkp_page_index .current_issue .obj_issue_toc > .pub_id {
	grid-column: 2;
	grid-row: 3;
	margin: 0 24px 10px 0;
	font-family: var(--slr-font);
	font-size: 13px;
}

.pkp_page_index .current_issue .heading > .pub_id .type {
	color: var(--slr-label-3);
	font-weight: 600;
	text-transform: none;
}

.pkp_page_index .current_issue .heading > .pub_id .id a {
	color: var(--slr-accent-ink);
}

.pkp_page_index .current_issue .heading > .description,
.pkp_page_index .current_issue .obj_issue_toc > .description {
	grid-column: 2;
	grid-row: 5;
	margin: 0 24px 18px 0;
	color: var(--slr-label-2);
	font-family: var(--slr-font);
	font-size: 14.5px;
	line-height: 1.6;
	text-align: justify;
}

.pkp_page_index .current_issue .heading > .description p,
.pkp_page_index .current_issue .obj_issue_toc > .description p {
	margin: 0 0 8px;
}

.pkp_page_index .current_issue .heading > .description > :last-child,
.pkp_page_index .current_issue .obj_issue_toc > .description > :last-child {
	margin-bottom: 0;
}

.pkp_page_index .current_issue > .read_more {
	grid-column: 2;
	grid-row: 6;
	justify-self: start;
	align-self: start;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin: 0 0 22px;
	padding: 9px 18px;
	border-radius: 980px;
	background: var(--slr-accent);
	box-shadow: 0 6px 16px -6px rgba(1, 163, 156, .7);
	color: #fff;
	font-family: var(--slr-font);
	font-size: 14px;
	font-weight: 600;
	line-height: 1.3;
	text-transform: none;
	transition: background-color .2s ease, transform .2s var(--slr-ease);
}

.pkp_page_index .current_issue > .read_more::after {
	position: static;
	width: auto;
	height: auto;
	line-height: 1;
	font-size: 12px;
}

.pkp_page_index .current_issue > .read_more:hover,
.pkp_page_index .current_issue > .read_more:focus {
	background: var(--slr-accent-ink);
	color: #fff;
}

.pkp_page_index .current_issue > .read_more:active {
	transform: scale(.97);
}

.pkp_page_index .current_issue .obj_issue_toc > .sections {
	grid-column: 1 / -1;
	grid-row: 7;
	margin-top: 32px;
}

/* Section header ("Articles") as an iOS grouped-list header */
.obj_issue_toc .section > h2 {
	display: block;
	width: auto;
	margin: 0 0 10px;
	padding: 0 4px;
	border: 0;
	background: none;
	box-shadow: none;
	color: var(--slr-label-3);
	font-family: var(--slr-font);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: .06em;
	text-transform: uppercase;
}

.obj_issue_toc .section + .section {
	margin-top: 28px;
}

.obj_issue_toc .cmp_article_list {
	margin: 0;
	padding: 0;
	overflow: hidden;
	border-radius: 18px;
	background: #fff;
	box-shadow: inset 0 0 0 0px var(--slr-separator), var(--slr-shadow);
}

.obj_issue_toc .cmp_article_list > li {
	margin: 0;
	padding: 18px 20px;
	transition: background-color .2s ease;
}

.obj_issue_toc .cmp_article_list > li + li {
	border-top: 1px solid var(--slr-separator);
}

.obj_issue_toc .cmp_article_list > li:hover {
	background: var(--slr-accent-wash);
}

.obj_issue_toc .obj_article_summary {
	padding: 0;
	font-family: var(--slr-font);
}

.obj_issue_toc .obj_article_summary:has(> .cover) {
	display: grid;
	grid-template-columns: 64px minmax(0, 1fr);
	column-gap: 16px;
}

.obj_issue_toc .obj_article_summary:has(> .cover)::before,
.obj_issue_toc .obj_article_summary:has(> .cover)::after {
	display: none;
}

.obj_issue_toc .obj_article_summary:has(> .cover) > :not(.cover) {
	grid-column: 2;
}

.obj_issue_toc .obj_article_summary > .cover {
	grid-column: 1;
	grid-row: 1 / span 8;
	float: none;
	width: auto;
	margin: 0;
}

.obj_issue_toc .obj_article_summary > .cover img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: 8px;
	box-shadow: 0 1px 2px rgba(0, 0, 0, .1), 0 6px 14px -6px rgba(0, 0, 0, .3);
}

.obj_issue_toc .obj_article_summary > .title {
	font-family: var(--slr-font);
	line-height: 1.35;
}

.obj_issue_toc .obj_article_summary > .title a {
	color: var(--slr-label);
	font-family: var(--slr-font);
	font-size: 16px;
	font-weight: 600;
	letter-spacing: -.01em;
	transition: color .2s ease;
}

.obj_issue_toc .obj_article_summary > .title a:hover,
.obj_issue_toc .obj_article_summary > .title a:focus {
	color: var(--slr-accent-ink);
}

.obj_issue_toc .obj_article_summary .meta {
	padding-top: 6px;
}

.obj_issue_toc .obj_article_summary .authors {
	padding-right: 76px;
	color: var(--slr-label-2);
	font-family: var(--slr-font);
	font-size: 14px;
}

.obj_issue_toc .obj_article_summary .pages {
	top: 5px;
	padding: 4px 9px;
	border-radius: 980px;
	background: var(--slr-fill);
	color: var(--slr-label-3);
	font-family: var(--slr-font);
	font-size: 12px;
	font-weight: 600;
	line-height: 1.2;
	font-variant-numeric: tabular-nums;
}

.obj_issue_toc .obj_article_summary .pages::before {
	width: auto;
	margin-right: 4px;
	font-size: 11px;
}

.obj_issue_toc .tocreadcount {
	margin-top: 8px;
	color: var(--slr-label-3);
	font-family: var(--slr-font);
	font-size: 12.5px;
}

.obj_issue_toc .tocreadcount .article_stat,
.obj_issue_toc .tocreadcount .galley_stat {
	height: auto !important;
	padding: 0;
	background: none !important;
	text-transform: capitalize;
}

.obj_issue_toc .tocreadcount .article_stat::before,
.obj_issue_toc .tocreadcount .galley_stat::before {
	content: "\f06e";
	margin-right: 5px;
	font: normal normal normal 12px/1 FontAwesome;
	color: var(--slr-accent);
}

.obj_issue_toc .tocreadcount .galley_stat {
	margin-left: 12px;
}

.obj_issue_toc .tocreadcount .galley_stat::before {
	content: "\f019";
}

.obj_issue_toc .tocreadcount strong {
	color: var(--slr-label-2);
	font-weight: 600;
	font-variant-numeric: tabular-nums;
}

.obj_issue_toc .doi_container {
	margin-top: 4px;
}

.obj_issue_toc .doi_link {
	color: var(--slr-accent-ink);
	font-family: var(--slr-font);
	font-size: 12.5px;
}

.obj_issue_toc .doi_link:hover {
	text-decoration: underline;
}

.obj_issue_toc .obj_article_summary > .galleys_links {
	margin: 10px 0 0;
	padding: 0;
}

.obj_issue_toc .obj_article_summary > .galleys_links li {
	margin: 0 6px 0 0;
}

.obj_issue_toc .obj_article_summary > .galleys_links a.obj_galley_link {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	width: auto;
	padding: 6px 14px;
	border: 0;
	border-radius: 980px;
	background: var(--slr-accent-tint);
	color: var(--slr-accent-ink);
	font-family: var(--slr-font);
	font-size: 12.5px;
	font-weight: 600;
	line-height: 1.3;
	text-transform: none;
	transition: background-color .2s ease, color .2s ease;
}

.obj_issue_toc .obj_article_summary > .galleys_links a.obj_galley_link::before {
	margin: 0;
}

.obj_issue_toc .obj_article_summary > .galleys_links a.obj_galley_link:hover,
.obj_issue_toc .obj_article_summary > .galleys_links a.obj_galley_link:focus {
	background: var(--slr-accent);
	color: #fff;
}

/* ==========================================================================
   4. RESPONSIVE & MOTION
   ========================================================================== */

@media (max-width: 991px) {
	.pkp_structure_sidebar {
		padding: 0 .714rem;
	}
}

@media (max-width: 600px) {
	.page:has(> .slr-page) > .page_title {
		font-size: 28px;
	}

	.slr-page {
		font-size: 15.5px;
	}

	.slr-page .slr-lead {
		font-size: 17px;
	}

	.slr-page h2 {
		font-size: 21px;
	}

	.slr-page .slr-card {
		padding: 18px;
	}

	.slr-page ul.slr-kv > li {
		flex-direction: column;
		gap: 2px;
	}

	.slr-page ul.slr-kv strong {
		text-align: left;
	}

	.slr-home .slr-home__hero {
		padding: 24px 20px;
	}

	.slr-home .slr-home__hero h2 {
		font-size: 26px;
	}

	.slr-home .slr-home__address ul.slr-kv strong {
		max-width: none;
	}

	.slr-page .slr-id__head,
	.slr-page ul.slr-id__meta {
		padding-left: 18px;
		padding-right: 18px;
	}

	.slr-page ul.slr-id__meta {
		grid-template-columns: minmax(0, 1fr);
	}

	.slr-page ul.slr-id__meta > li:nth-last-child(2) {
		border-bottom: 1px solid var(--slr-separator);
	}
}

@media (max-width: 760px) {
	.slr-page ul.slr-id__stats {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.slr-page ul.slr-id__stats > li:nth-child(3) {
		border-left: 0;
	}

	.slr-page ul.slr-id__stats > li:nth-child(n + 3) {
		border-top: 1px solid var(--slr-separator);
	}

	.slr-page .slr-home__hero h2 {
		font-size: 32px;
	}

	.pkp_page_index .current_issue {
		grid-template-columns: 116px minmax(0, 1fr);
		column-gap: 16px;
	}

	.pkp_page_index .current_issue .heading > .cover {
		margin: 16px 0 16px 16px;
	}

	.pkp_page_index .current_issue .current_issue_title {
		margin: 16px 16px 10px 0;
		font-size: 17px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.pkp_structure_sidebar *,
	.slr-page * {
		transition: none !important;
	}

	.slr-home .slr-home__hero::before,
	.slr-page .slr-id__badge--pending::before {
		animation: none;
	}
}