/**
 * plugins/themes/actaTheme/styles/actaHome.css
 *
 * Journal HOME page only (theme-dev/acta-home-mockup.html). Loaded by
 * ActaThemePlugin::init() on the home page after acta.css, and NOT loaded
 * anywhere else, so no other page (or journal) can be affected by it.
 *
 * Kept out of acta.css on purpose: acta.css is served with a 7-day browser
 * cache under a fixed "?v=" URL, so a returning visitor would have combined
 * the new home HTML with the OLD cached CSS. This file is requested with
 * "?v=<file mtime>" (see the plugin), so every edit busts the cache.
 */

/* =====================================================================
   HOME PAGE REDESIGN — theme-dev/acta-home-mockup.html
   ---------------------------------------------------------------------
   Source of truth for the journal home page. Supersedes mockup-home.html
   (the older design every rule ABOVE this block was built from) for the
   home page ONLY. Every selector below starts with body.pkp_page_index,
   so archive / issue / article / search / about / login etc. keep the
   exact rules above and are not affected. (Other journals use other
   themes and the site index uses jurnalFhIndexTheme — neither loads this
   file.)

   Palette = the palette already live (maroon / red / white); only the
   variable names are new, taken from the mockup's :root:
     --accent-deep #006b08 (= "maroon" above)   --accent #00870a (= "red")
     --ink #333332 (same text colour)           --paper #FFFFFE (~#fff)
     --rule / --muted / --faint: the mockup's warm greys (replace the
     #eee / #777 / #999-ish literals on this page only).
   Fonts: Source Serif 4 (headings) + IBM Plex Sans (body), loaded only on
   the home page by ActaThemePlugin::init().

   Width model: the mockup's .wrap is max-width:1180px with 40px side
   padding (=> 1100px of content, centred, bands full-bleed). Reproduced
   without extra markup as --acta-gutter =
   max(40px, (100% - 1100px) / 2) used as horizontal padding on each band.
   ===================================================================== */
:root {
	--accent-deep: #006b08;
	--accent: #00870a;
	--ink: #333332;
	--paper: #FFFFFE;
	--rule: #E6E1DC;
	--muted: #706A62;
	--faint: #9C9690;
}

body.pkp_page_index {
	--acta-sans: 'IBM Plex Sans', system-ui, sans-serif;
	--acta-serif: 'Source Serif 4', serif;
	background: var(--paper);
	color: var(--ink);
	font-family: var(--acta-sans);
	font-size: 14px;
}

body.pkp_page_index .acta_page {
	--acta-gutter: max(40px, calc((100% - 1100px) / 2));
	max-width: none;
	background: transparent;
	box-shadow: none;
	font-family: var(--acta-sans);
	/* The mockup never sets a line-height (=> "normal"); the parent theme
	   gives body a fixed ~20px, which every unstyled line inherited. */
	line-height: normal;
}

@media (max-width: 720px) {
	body.pkp_page_index .acta_page {
		--acta-gutter: 20px;
	}
}

/* ---------- Header bands ---------- */
body.pkp_page_index .acta_topstrip {
	display: none;
}

body.pkp_page_index .acta_toprow {
	background: transparent;
	padding: 10px var(--acta-gutter);
	font-size: 12px;
	color: var(--muted);
	border-bottom: 1px solid var(--rule);
}

body.pkp_page_index .acta_toprow_title,
body.pkp_page_index .acta_toprow_link,
body.pkp_page_index .acta_toprow_actions .acta_user_nav a {
	font-size: 12px;
	color: var(--muted);
}

body.pkp_page_index .acta_toprow_actions .acta_user_nav a {
	margin-left: 0;
	padding: 0;
}

body.pkp_page_index .acta_navrow {
	background: var(--accent-deep);
}

/* Banner: gradient + centred Universitas Padjadjaran logo (header.tpl
   renders the <img> on the home page only). */
body.pkp_page_index .acta_banner {
	position: relative;
	height: auto;
	min-height: 130px;
	overflow: visible;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 24px;
	background: linear-gradient(115deg, #001e02 0%, #001e02 38%, var(--accent-deep) 68%, var(--accent) 100%);
}

body.pkp_page_index .acta_brand_logo {
	/* 50px tall; width follows the file's own ratio (244x53) — never stretched */
	height: 50px;
	width: auto;
	display: block;
}

/* Journal's own header logo (admin-uploaded, arbitrary aspect ratio) — scaled
   to the SAME 50px height as the Unpad logo beside it, so neither dominates. */
body.pkp_page_index .acta_journal_logo {
	height: 50px;
	width: auto;
	max-width: 200px;
	object-fit: contain;
	display: block;
}

body.pkp_page_index .acta_accent {
	background: var(--accent-deep);
	color: #e8f2e9;
	padding: 9px var(--acta-gutter);
	font-size: 12px;
}

body.pkp_page_index .cmp_breadcrumbs {
	padding: 12px var(--acta-gutter);
	font-size: 12px;
	color: var(--muted);
	border-bottom: 0;
}

/* Desktop nav (≥821px). The ≤820px hamburger layout above is left as it
   was, so these link paddings are not applied there. */
@media (min-width: 821px) {
	body.pkp_page_index .acta_navrow {
		padding: 0 var(--acta-gutter);
	}

	body.pkp_page_index .acta_navrow .acta_primary_nav > li > a {
		color: #e8f2e9;
		font-size: 13px;
		font-weight: 500;
		padding: 14px 18px;
		gap: 0;
	}

	body.pkp_page_index .acta_navrow .acta_primary_nav > li > a:hover,
	body.pkp_page_index .acta_navrow .acta_primary_nav > li > a:focus {
		background: rgba(255, 255, 255, .08);
		color: #e8f2e9;
	}

	body.pkp_page_index .acta_navrow > .acta_search_link {
		color: #e8f2e9;
		font-size: 13px;
		padding: 14px 0;
		gap: 6px;
	}

	body.pkp_page_index .acta_navrow > .acta_search_link:hover,
	body.pkp_page_index .acta_navrow > .acta_search_link:focus {
		background: transparent;
		color: #e8f2e9;
	}

	body.pkp_page_index .acta_navrow > .acta_search_link .fa-search {
		font-size: 14px;
		margin-right: 5px;
	}
}

/* ---------- Two-column grid (8fr / 4fr) ---------- */
body.pkp_page_index .pkp_structure_content.has_sidebar {
	grid-template-columns: 8fr 4fr;
	column-gap: 44px;
	row-gap: 0;
	padding: 8px var(--acta-gutter) 60px;
}

@media (max-width: 900px) {
	body.pkp_page_index .pkp_structure_content.has_sidebar {
		grid-template-columns: 1fr;
		column-gap: 0;
	}

	body.pkp_page_index .pkp_structure_content.has_sidebar .pkp_structure_main {
		grid-column: 1;
		grid-row: 1;
	}

	body.pkp_page_index .pkp_structure_content.has_sidebar .pkp_structure_sidebar {
		grid-column: 1;
		grid-row: 2;
	}
}

/* ---------- Main column ---------- */
body.pkp_page_index .pkp_structure_main {
	font-family: var(--acta-sans);
	font-size: 14px;
	color: var(--ink);
}

body.pkp_page_index .acta_section_title {
	font-family: var(--acta-serif);
	font-size: 19px;
	font-weight: 600;
	line-height: normal;
	color: var(--ink);
	margin: 30px 0 16px;
}

body.pkp_page_index .page_index_journal > .acta_section_title:first-of-type {
	margin-top: 14px;
}

/* Journal Description: cover (148x210) beside the meta lines, body copy
   full width underneath. The description is admin-managed HTML from the
   journal's "description" field (cover <p>, meta <p> with <strong> + <br>,
   body <p>, originality <p>) — it can't be re-authored from a theme, so the
   wrapper is display:contents and each <p> is placed by what it contains
   (:has), falling back to plain full-width paragraphs if the admin ever
   restructures it. */
body.pkp_page_index .acta_about_row {
	display: grid;
	grid-template-columns: 148px minmax(0, 1fr);
	column-gap: 22px;
	align-items: start;
	margin: 0;
	padding: 0;
	border-bottom: 0;
}

body.pkp_page_index .acta_about_text {
	display: contents;
}

body.pkp_page_index .acta_cover {
	grid-column: 1;
	grid-row: 1;
	width: 148px;
	height: 210px;
	max-width: none;
	margin: 0;
	border: 1px solid var(--rule);
	box-sizing: border-box;
	object-fit: cover;
}

/* "!important" on text-align: the source <p>s carry an inline
   style="text-align: justify" that the mockup does not use. */
body.pkp_page_index .acta_about_text p {
	grid-column: 1 / -1;
	margin: 0 0 14px;
	font-size: 13.5px;
	line-height: 1.75;
	color: var(--ink);
	text-align: left !important;
}

body.pkp_page_index .acta_about_text p:has(img[src*="adminjurnalfh/cover.png"]) {
	display: none;
}

body.pkp_page_index .acta_about_text p:has(> strong):has(a[href*="issn.brin.go.id"]) {
	grid-column: 2;
	grid-row: 1;
	margin: 0;
	font-size: 13px;
	line-height: 19px;
}

body.pkp_page_index .acta_about_text p:has(> strong):has(a[href*="issn.brin.go.id"]) > strong:first-child {
	display: inline-block;
	font-weight: 600;
	line-height: 17px;
	margin-bottom: 5px;
}

body.pkp_page_index .acta_about_text p:has(> strong):has(a[href*="issn.brin.go.id"]) + p {
	margin-top: 14px;
}

body.pkp_page_index .acta_about_text p:has(> a[href*="no-originality-statement-link"]) {
	margin: 0;
	font-size: 13px;
	font-weight: 600;
	line-height: normal;
}

body.pkp_page_index .acta_about_text a {
	color: var(--accent);
	text-decoration: none;
}

body.pkp_page_index .acta_about_text a:hover {
	text-decoration: underline;
}

body.pkp_page_index .acta_about_text a[href*="no-originality-statement-link"] {
	display: inline-flex;
	align-items: center;
	gap: 5px;
}

body.pkp_page_index .acta_about_text a[href*="no-originality-statement-link"]::before {
	content: "\f019"; /* fa-download */
	font-size: 12px;
	margin-right: 0;
	color: inherit;
}

/* Current Issue */
body.pkp_page_index .current_issue .current_issue_title {
	font-size: 13px;
	font-weight: 400;
	line-height: normal;
	color: var(--ink);
	margin: 0 0 4px;
}

body.pkp_page_index .obj_issue_toc .heading {
	font-size: 12px;
	line-height: normal;
	color: var(--faint);
	margin: 0;
	gap: 0 7px;
}

body.pkp_page_index .obj_issue_toc .heading a {
	color: var(--accent);
	text-decoration: none;
}

/* The parent's clearfix (::before/::after content:" "; display:table) turns
   into a real, empty flex item once .heading is display:flex, so the first
   `gap` fell in front of "DOI:" and pushed the line ~7px right of the
   heading above it. Same clearfix-as-flex-item pattern as .row / .has_sidebar
   elsewhere in this theme. */
body.pkp_page_index .obj_issue_toc .heading::before,
body.pkp_page_index .obj_issue_toc .heading::after {
	content: none;
	display: none;
}

/* Parent theme's issue_toc.less gives .pub_id / .published a ~20px vertical
   margin and bold labels — the mockup's line is plain, single-row 12px. */
body.pkp_page_index .obj_issue_toc .heading .pub_id,
body.pkp_page_index .obj_issue_toc .heading .published {
	margin: 0;
	padding: 0;
}

body.pkp_page_index .obj_issue_toc .heading .type,
body.pkp_page_index .obj_issue_toc .heading .label,
body.pkp_page_index .obj_issue_toc .heading .value {
	font-weight: 400;
	color: inherit;
}

body.pkp_page_index .obj_issue_toc .sections > .section > h3 {
	font-family: var(--acta-serif);
	font-size: 19px;
	font-weight: 600;
	line-height: normal;
	color: var(--ink);
	margin: 30px 0 16px;
	/* undo the parent theme's "badge on a rule" treatment of this heading */
	display: block;
	position: static;
	padding: 0;
	background: none;
}

/* Parent theme's issue_toc.less: .sections gets a 60px top margin (that
   collapses with the heading's own 30px into a 60px gap) and every article
   <li> a 30px bottom margin — neither exists in the mockup's flat list. */
body.pkp_page_index .obj_issue_toc .sections {
	margin-top: 0;
}

body.pkp_page_index .obj_issue_toc .cmp_article_list > li {
	margin: 0;
}

/* Article rows */
body.pkp_page_index .obj_article_summary.acta_article {
	padding: 20px 0;
	border-bottom: 1px solid var(--rule);
}

body.pkp_page_index .cmp_article_list > li:last-child .obj_article_summary.acta_article {
	border-bottom: 0;
}

/* the title's own 6px bottom margin (mockup .title mb 6) — the parent's
   ".obj_article_summary .title" zeroes it and is more specific than
   acta.css's ".title.acta_article_title" */
body.pkp_page_index .obj_article_summary .title.acta_article_title {
	margin: 0 0 6px;
}

body.pkp_page_index .acta_article_title a {
	font-family: var(--acta-serif);
	font-size: 15.5px;
	font-weight: 600;
	line-height: 1.4;
	color: var(--ink);
	text-decoration: none;
	display: block;
}

body.pkp_page_index .acta_article_title a:hover {
	color: var(--accent);
	text-decoration: none;
}

body.pkp_page_index p.acta_article_doi {
	font-size: 11.5px;
	line-height: normal;
	color: var(--faint);
	margin: 0 0 8px;
}

/* DOI logo (theme asset styles/images/doi-logo.webp) replaces the generic
   fingerprint glyph. Done as a background on the existing <i> so the shared
   article_summary.tpl markup — also used on other pages — is unchanged. */
body.pkp_page_index p.acta_article_doi i {
	display: inline-block;
	width: 14px;
	height: 14px;
	margin-right: 4px;
	vertical-align: -2px;
	font-size: 0;
	background: url("images/doi-logo.webp") center / contain no-repeat;
}

body.pkp_page_index p.acta_article_doi i::before {
	content: none;
	display: none;
}

body.pkp_page_index p.acta_article_authors {
	font-size: 13px;
	line-height: normal;
	color: var(--muted);
	margin: 0 0 10px;
}

body.pkp_page_index .acta_article_foot {
	gap: 14px;
	font-size: 12.5px;
	line-height: normal;
	color: var(--muted);
	align-items: center;
}

body.pkp_page_index .acta_article_foot .acta_pages,
body.pkp_page_index .acta_article_foot .acta_downloads {
	line-height: normal;
}

body.pkp_page_index .obj_galley_link.pdf {
	border: 1px solid var(--accent-deep);
	border-radius: 0;
	color: var(--accent-deep);
	padding: 3px 10px;
	font-size: 12px;
	font-weight: 600;
	line-height: normal;
	gap: 5px;
	display: inline-flex;
	align-items: center;
	text-decoration: none;
	background: transparent;
}

body.pkp_page_index .obj_galley_link.pdf::before {
	font-family: "Font Awesome 6 Free";
	font-weight: 900;
	content: "\f019"; /* fa-download */
	font-size: 12px;
	width: 14px;
	margin-right: 3px;
	text-align: center;
}

body.pkp_page_index .obj_galley_link.pdf:hover {
	background: var(--accent-deep);
	color: #fff;
	text-decoration: none;
}

body.pkp_page_index .acta_downloads {
	display: inline-flex;
	align-items: center;
	gap: 3px;
	font-size: 12.5px;
	color: var(--muted);
}

body.pkp_page_index .acta_downloads i {
	color: inherit;
	font-size: 12px;
	width: 14px;
	text-align: center;
}

body.pkp_page_index .acta_view_all_issues {
	display: inline-block;
	margin-top: 24px;
	font-size: 13px;
	font-weight: 600;
	color: var(--accent);
}

/* ---------- Sidebar ----------
   Shorthand used in the selectors below: SB =
   body.pkp_page_index .pkp_structure_sidebar.acta_sidebar   */
body.pkp_page_index .pkp_structure_sidebar.acta_sidebar .acta_make_submission {
	padding: 12px;
	font-size: 13px;
	font-weight: 600;
	border-radius: 0;
	background: var(--accent-deep);
}

body.pkp_page_index .pkp_structure_sidebar.acta_sidebar .acta_make_submission:hover {
	background: var(--accent);
}

body.pkp_page_index .pkp_structure_sidebar.acta_sidebar .acta_make_submission i {
	margin-right: 6px;
}

/* Section spacing: EVERY visible section heading opens its own margin-top
   (below, on the heading rule itself), instead of relying on the PREVIOUS
   block's margin-bottom — see actaInner.css for the full rationale (same
   fix, duplicated here because the home page loads its own stylesheet). */
body.pkp_page_index .pkp_structure_sidebar.acta_sidebar .pkp_block,
body.pkp_page_index .pkp_structure_sidebar.acta_sidebar .acta_side_block {
	margin-bottom: 0;
	line-height: normal;
}

/* link labels are <a><span class="title">: the parent's ".pkp_block .title"
   line-height would otherwise re-inflate every link row */
body.pkp_page_index .pkp_structure_sidebar.acta_sidebar a .title {
	line-height: inherit;
}

/* Custom-block content sits inside its OWN nested div.block_information
   (a wrapper the blocks' HTML brings along) — that nested div must not get
   the outer block's margin. */
body.pkp_page_index .pkp_structure_sidebar.acta_sidebar .block_custom .block_information {
	margin: 0;
	padding: 0;
}

/* Section headings: Source Serif 4, 14.5px / 600 (mockup .side-block h3).
   margin-top opens the gap before each new section; the screen-reader-only
   heading of an admin custom block with no title set is excluded by
   :not(.pkp_screen_reader) — no visible heading, so it merges with the
   block above it (acta's Language + "For Authors" block). */
body.pkp_page_index .pkp_structure_sidebar.acta_sidebar .pkp_block > h2.title:not(.pkp_screen_reader),
body.pkp_page_index .pkp_structure_sidebar.acta_sidebar .block_information > span.title:first-child,
body.pkp_page_index .pkp_structure_sidebar.acta_sidebar .acta_side_h {
	font-family: var(--acta-serif);
	font-size: 14.5px;
	font-weight: 600;
	line-height: normal;
	color: var(--ink);
	margin: 28px 0 12px;
	padding-bottom: 8px;
	border-bottom: 1px solid var(--rule);
	display: block;
}

/* ...except the FIRST section in the sidebar (see actaInner.css note). */
body.pkp_page_index .pkp_structure_sidebar.acta_sidebar > .pkp_block:first-child > h2.title,
body.pkp_page_index .pkp_structure_sidebar.acta_sidebar > .pkp_block:first-child .block_information > span.title:first-child,
body.pkp_page_index .pkp_structure_sidebar.acta_sidebar > .pkp_block:first-child > .acta_side_h,
body.pkp_page_index .pkp_structure_sidebar.acta_sidebar > .acta_side_block:first-child > .acta_side_h,
body.pkp_page_index .pkp_structure_sidebar.acta_sidebar > .acta_make_submission + .pkp_block > h2.title,
body.pkp_page_index .pkp_structure_sidebar.acta_sidebar > .acta_make_submission + .pkp_block .block_information > span.title:first-child,
body.pkp_page_index .pkp_structure_sidebar.acta_sidebar > .acta_make_submission + .pkp_block > .acta_side_h,
body.pkp_page_index .pkp_structure_sidebar.acta_sidebar > .acta_make_submission + .acta_side_block > .acta_side_h {
	margin-top: 0;
}

/* Editorial Team preview */
body.pkp_page_index .pkp_structure_sidebar.acta_sidebar .content p.acta_editor_text {
	font-size: 13px;
	line-height: normal;
	color: var(--ink);
	margin: 0 0 12px;
}

/* "!important": footer.tpl gives the 2nd person an inline margin-top:6px
   (fine on the other pages, not in this mockup). */
body.pkp_page_index .pkp_structure_sidebar.acta_sidebar .content p.acta_editor_text + p.acta_editor_text {
	margin-top: 0 !important;
}

body.pkp_page_index .pkp_structure_sidebar.acta_sidebar .acta_editor_text b {
	font-weight: 600;
}

/* display:block so the 12px role line is sized by its own font, not by the
   13px strut of the surrounding <p> (mockup .r is a block div). */
body.pkp_page_index .pkp_structure_sidebar.acta_sidebar .acta_editor_role {
	display: block;
	font-size: 12px;
	line-height: normal;
	color: var(--muted);
}

body.pkp_page_index .pkp_structure_sidebar.acta_sidebar .acta_editorial_preview .content > a {
	font-size: 13px;
	font-weight: 600;
}

body.pkp_page_index .pkp_structure_sidebar.acta_sidebar .block_language .content ul {
	margin: 0;
	padding: 0;
}

/* the parent gives each <li> 5px vertical padding + a fixed 20px line-height */
body.pkp_page_index .pkp_structure_sidebar.acta_sidebar .block_language li {
	padding: 0;
	line-height: normal;
}

body.pkp_page_index .pkp_structure_sidebar.acta_sidebar .block_language li a {
	display: block;
	font-size: 13px;
}

/* "For Authors" block (#customblock-sidebarmenu). Markup is one flat run:
     a×5 (links) · span.title "Originality Statement" · a (Plagiarism Check)
     · span.title "Indexing Site" · a>img ×7 (logos)
   with a stray &nbsp; between Author Guidelines and Manuscript Template.
   - font-size/line-height:0 on the wrapper collapses that &nbsp; (it becomes
     an anonymous flex item) to a 0×0 box; every real child sets its own size.
   - Spacing is explicit margins, never the &nbsp;: 22px before each link
     group (the mockup's .gap-before), 8px between links inside a group. */
body.pkp_page_index .pkp_structure_sidebar.acta_sidebar #customblock-sidebarmenu .block_information {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	column-gap: 10px;
	row-gap: 0;
	font-size: 0;
	line-height: 0;
	margin-bottom: -10px;
}

body.pkp_page_index .pkp_structure_sidebar.acta_sidebar #customblock-sidebarmenu .block_information > a:not(:has(img)) {
	flex: 0 0 100%;
	margin-top: 8px;
	padding: 0;
	font-size: 13px;
	line-height: normal;
}

body.pkp_page_index .pkp_structure_sidebar.acta_sidebar #customblock-sidebarmenu .block_information > a:first-child,
body.pkp_page_index .pkp_structure_sidebar.acta_sidebar #customblock-sidebarmenu .block_information > a[title="Manuscript Template"] {
	margin-top: 22px;
}

body.pkp_page_index .pkp_structure_sidebar.acta_sidebar #customblock-sidebarmenu .block_information > span.title {
	flex: 0 0 100%;
	font-family: var(--acta-serif);
	font-size: 14.5px;
	font-weight: 600;
	line-height: normal;
	color: var(--ink);
	margin: 28px 0 12px;
	padding-bottom: 8px;
	border-bottom: 1px solid var(--rule);
}

body.pkp_page_index .pkp_structure_sidebar.acta_sidebar #customblock-sidebarmenu .block_information > span.title + a:not(:has(img)) {
	margin-top: 0;
}

body.pkp_page_index .pkp_structure_sidebar.acta_sidebar #customblock-sidebarmenu .block_information > a:has(img) {
	flex: 0 0 calc(50% - 5px);
	height: 34px;
	margin: 0 0 10px;
	padding: 0;
	display: flex;
	align-items: center;
	justify-content: flex-start;
}

body.pkp_page_index .pkp_structure_sidebar.acta_sidebar #customblock-sidebarmenu .block_information > a:has(img) img {
	height: 34px;
	width: auto;
	max-width: 100%;
	max-height: none;
	margin: 0;
	display: block;
}

/* ISSN: barcodes side by side (aspect ratio kept — the mockup's 90x44
   placeholder is not the real 124x84 barcode's ratio), labels underneath. */
body.pkp_page_index .pkp_structure_sidebar.acta_sidebar #customblock-issn .content p:has(> a > img) {
	display: flex;
	gap: 14px;
	align-items: flex-end;
	margin: 0 0 8px;
}

body.pkp_page_index .pkp_structure_sidebar.acta_sidebar #customblock-issn .content p:has(> a > img) img {
	width: 90px;
	height: auto;
	margin: 0;
	display: block;
}

/* Labels: font-size:0 collapses the &nbsp; run between the two links to a
   zero-width flex item, so the 20px gap comes from the explicit margin. */
body.pkp_page_index .pkp_structure_sidebar.acta_sidebar #customblock-issn .content p:has(> a[title="PISSN"]) {
	display: flex;
	font-size: 0;
	line-height: 0;
	margin: 0;
}

body.pkp_page_index .pkp_structure_sidebar.acta_sidebar #customblock-issn .content p:has(> a[title="PISSN"]) a {
	font-size: 12px;
	font-weight: 600;
	line-height: normal;
	color: var(--ink);
}

body.pkp_page_index .pkp_structure_sidebar.acta_sidebar #customblock-issn .content p:has(> a[title="PISSN"]) a + a {
	margin-left: 20px;
}

/* Google Scholar table */
body.pkp_page_index .pkp_structure_sidebar.acta_sidebar #gsc_rsb_st {
	font-size: 12.5px;
	color: var(--ink);
}

body.pkp_page_index .pkp_structure_sidebar.acta_sidebar #gsc_rsb_st th,
body.pkp_page_index .pkp_structure_sidebar.acta_sidebar #gsc_rsb_st td {
	padding: 5px 0;
	text-align: right;
	border-bottom: 0;
	border-top: 1px solid var(--rule);
}

body.pkp_page_index .pkp_structure_sidebar.acta_sidebar #gsc_rsb_st th {
	font-weight: 600;
	color: var(--muted);
	padding: 0 0 6px;
	border-top: 0;
}

body.pkp_page_index .pkp_structure_sidebar.acta_sidebar #gsc_rsb_st th:first-child,
body.pkp_page_index .pkp_structure_sidebar.acta_sidebar #gsc_rsb_st td:first-child {
	text-align: left;
	font-weight: 500;
}

body.pkp_page_index .pkp_structure_sidebar.acta_sidebar #gsc_rsb_st a.gsc_rsb_f {
	color: inherit;
	font-size: inherit;
	cursor: default;
}

/* Nationally Accredited: the certificate scan is shown at the mockup's
   282px. The SINTA badge below it (.j-meta-img) is HIDDEN with display:none —
   the <img> stays in the DOM and is still requested, nothing in the block's
   data is touched. Why hidden although the corrected mockup shows it: its
   URL is https://sinta.kemdikbud.go.id/badge/journal?id=4206 and that host no
   longer resolves in DNS (SINTA moved to sinta.kemdiktisaintek.go.id), so for
   every visitor it renders as a broken-image box. To show it again: delete
   the .j-meta-img rule below AFTER pointing the block's <img> at a working
   host (Custom Block Manager -> block "idexingsite"). */
body.pkp_page_index .pkp_structure_sidebar.acta_sidebar #customblock-idexingsite .content p {
	margin: 0;
}

body.pkp_page_index .pkp_structure_sidebar.acta_sidebar #customblock-idexingsite .content a {
	display: block;
}

body.pkp_page_index .pkp_structure_sidebar.acta_sidebar #customblock-idexingsite .content img {
	max-width: 100%;
	height: auto;
	display: block;
}

/* width: the parent's base "img{width:auto}" beats the width="282" attribute
   the mockup renders the certificate at; pin it (still capped by max-width). */
body.pkp_page_index .pkp_structure_sidebar.acta_sidebar #customblock-idexingsite .content p img {
	width: 282px;
	border: 1px solid var(--rule);
}

body.pkp_page_index .pkp_structure_sidebar.acta_sidebar #customblock-idexingsite .j-meta-img {
	display: none;
}

/* Visitor: ClustrMaps map hidden (display:none — the <img> stays in the
   DOM, so the browser still requests it and the counter still runs).
   StatCounter row = logo + "Web Analytics" + "Visitor"; the block's real
   <img> there is the invisible tracking pixel, so it stays in the DOM (still
   loaded) but is reduced to 1px/transparent, and the logo/label are drawn
   with ::before/::after on the same link. */
body.pkp_page_index .pkp_structure_sidebar.acta_sidebar #customblock-visitor .content p:has(> a[title="Visit tracker"]) {
	display: none;
}

body.pkp_page_index .pkp_structure_sidebar.acta_sidebar #customblock-visitor .content p:has(> a[title="Web Analytics"]) {
	display: flex;
	align-items: center;
	gap: 14px;
	margin: 0;
	font-size: 12.5px;
}

body.pkp_page_index .pkp_structure_sidebar.acta_sidebar #customblock-visitor a[title="Web Analytics"] {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 14px;
	font-size: 12.5px;
}

body.pkp_page_index .pkp_structure_sidebar.acta_sidebar #customblock-visitor a[title="Web Analytics"]::before {
	content: "";
	display: block;
	width: 60px;
	height: 24px;
	background: url("images/statcounter-logo.webp") center / contain no-repeat;
}

body.pkp_page_index .pkp_structure_sidebar.acta_sidebar #customblock-visitor a[title="Web Analytics"]::after {
	content: "Web Analytics";
}

body.pkp_page_index .pkp_structure_sidebar.acta_sidebar #customblock-visitor a[title="Web Analytics"] img {
	position: absolute;
	left: 0;
	top: 0;
	width: 1px;
	height: 1px;
	opacity: 0;
	overflow: hidden;
	pointer-events: none;
}

/* The earlier chart icon on the "Visitor" link is superseded by the logo. */
body.pkp_page_index .pkp_structure_sidebar.acta_sidebar a[href^="https://statcounter.com/p"]::before {
	content: none;
}

/* Archive by Year */
body.pkp_page_index .pkp_structure_sidebar.acta_sidebar .acta_archive_list {
	font-size: 12.5px;
	line-height: 2;
	color: var(--faint);
	margin: 0;
}

body.pkp_page_index .pkp_structure_sidebar.acta_sidebar .acta_archive_list a {
	font-size: 12.5px;
}

/* ---------- Footer band ---------- */
body.pkp_page_index .pkp_structure_footer {
	background: var(--accent-deep);
	color: #e8f2e9;
	padding: 26px var(--acta-gutter);
	font-size: 12.5px;
}

body.pkp_page_index .pkp_structure_footer .pkp_footer_content .row {
	align-items: flex-start;
	gap: 24px;
}

body.pkp_page_index .pkp_structure_footer .pkp_footer_content,
body.pkp_page_index .pkp_structure_footer .pkp_footer_content address,
body.pkp_page_index .pkp_structure_footer .pkp_footer_content a,
body.pkp_page_index .pkp_structure_footer .pkp_footer_content div {
	color: #e8f2e9;
	font-size: 12.5px;
}

body.pkp_page_index .pkp_structure_footer .pkp_footer_content h4 {
	display: flex;
	align-items: center;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: .3px;
	text-transform: uppercase;
	color: #d6e7d7;
	margin: 0 0 8px;
}

/* The pasted footer HTML uses Font Awesome 4 classes (fa-envelope-o /
   fa-user-o) that FA6 doesn't have; swap in the mockup's pin / mail icons. */
body.pkp_page_index .pkp_structure_footer .pkp_footer_content h4 em {
	display: none;
}

body.pkp_page_index .pkp_structure_footer .pkp_footer_content h4::before {
	font-family: "Font Awesome 6 Free";
	font-weight: 900;
	font-size: 12px;
	margin-right: 5px;
	content: "\f3c5"; /* fa-location-dot */
}

body.pkp_page_index .pkp_structure_footer .pkp_footer_content .contact_detail h4::before {
	content: "\f0e0"; /* fa-envelope */
}

/* ---------- Phones: hamburger in the utility bar ----------
   The parent theme's ".pkp_site_nav_toggle" is position:absolute; top:0;
   left:0; 2.857rem square (z-index 999), which laid the button over the
   journal name at the left of the bar, and its child <span> is drawn as a
   white 3-line icon. Put the button back in the flow, at the right edge next
   to "Login", keep the Font Awesome bars icon, and return the span to a
   plain screen-reader label. */
@media (max-width: 820px) {
	body.pkp_page_index .acta_toprow_actions {
		display: flex;
		align-items: center;
		gap: 12px;
	}

	body.pkp_page_index .acta_toprow_actions .acta_menu_toggle {
		position: static;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 32px;
		height: 32px;
		margin: -8px -6px -8px 0;
		padding: 0;
		border: 0;
		box-shadow: none;
		z-index: auto;
		font-size: 18px;
		line-height: 1;
		color: var(--accent-deep);
	}

	body.pkp_page_index .acta_toprow_actions .acta_menu_toggle > span {
		position: absolute;
		top: auto;
		left: auto;
		width: 1px;
		height: 1px;
		overflow: hidden;
		clip: rect(0 0 0 0);
		border: 0;
		transform: none;
		text-indent: 0;
	}

	body.pkp_page_index .acta_toprow_actions .acta_menu_toggle > span::before,
	body.pkp_page_index .acta_toprow_actions .acta_menu_toggle > span::after {
		content: none;
	}
}

/* ---------- Homepage Announcements (frontend/objects/announcements_list.tpl,
   included by indexJournal.tpl between the Journal Description and Current
   Issue sections when enableAnnouncementsHomepage is on) — was completely
   unstyled (plain parent-theme box), the same class of gap as an uncovered
   page template, just embedded in the home page instead of standalone. */
body.pkp_page_index .cmp_announcements {
	border-top: 1px solid var(--rule);
	padding-top: 4px;
}

body.pkp_page_index .cmp_announcements > h2 {
	font-family: var(--acta-serif);
	font-size: 19px;
	font-weight: 600;
	line-height: normal;
	color: var(--ink);
	margin: 30px 0 16px;
}

body.pkp_page_index .cmp_announcements .obj_announcement_summary {
	padding: 16px 0;
	border-bottom: 1px solid var(--rule);
}

body.pkp_page_index .cmp_announcements .obj_announcement_summary:last-child {
	border-bottom: 0;
	padding-bottom: 0;
}

body.pkp_page_index .cmp_announcements .obj_announcement_summary h2,
body.pkp_page_index .cmp_announcements .obj_announcement_summary h3,
body.pkp_page_index .cmp_announcements .obj_announcement_summary h4 {
	margin: 0 0 4px;
	font-family: var(--acta-serif);
	font-size: 15.5px;
	font-weight: 600;
	line-height: 1.4;
}

body.pkp_page_index .cmp_announcements .obj_announcement_summary h2 a,
body.pkp_page_index .cmp_announcements .obj_announcement_summary h3 a,
body.pkp_page_index .cmp_announcements .obj_announcement_summary h4 a {
	color: var(--ink);
	text-decoration: none;
}

body.pkp_page_index .cmp_announcements .obj_announcement_summary h2 a:hover,
body.pkp_page_index .cmp_announcements .obj_announcement_summary h3 a:hover,
body.pkp_page_index .cmp_announcements .obj_announcement_summary h4 a:hover {
	color: var(--accent);
}

body.pkp_page_index .cmp_announcements .obj_announcement_summary .date {
	font-size: 12px;
	color: var(--muted);
	margin-bottom: 6px;
}

body.pkp_page_index .cmp_announcements .obj_announcement_summary .summary,
body.pkp_page_index .cmp_announcements .obj_announcement_summary .description {
	font-size: 13.5px;
	line-height: 1.7;
	color: var(--ink);
}

body.pkp_page_index .cmp_announcements .obj_announcement_summary .summary p,
body.pkp_page_index .cmp_announcements .obj_announcement_summary .description p {
	margin: 0 0 10px;
}

body.pkp_page_index .cmp_announcements .obj_announcement_summary .read_more {
	display: inline-block;
	font-size: 13px;
	font-weight: 600;
	color: var(--accent);
	text-decoration: none;
}

body.pkp_page_index .cmp_announcements .obj_announcement_summary .read_more:hover {
	text-decoration: underline;
}

/* First item (announcement_summary.tpl) sits in .more's PARENT, ahead of
   the rest — align its spacing with the list that follows. */
body.pkp_page_index .cmp_announcements > .more {
	margin: 0;
}

/* Content relocated from the footer into the sidebar (see footer.tpl's
   optional "footer_to_sidebar" handling in make_theme.py) — e.g. indexing
   badges / "recommended tools" a journal's own pageFooter carries when it
   has no address of its own for the footer proper (see
   footerAddress.tpl). Rendered from that journal's real pageFooter data,
   just relocated; margin-top matches the section-opening rule other
   sidebar headings use, since this block has no h2/span.title of its own. */
body.pkp_page_index .pkp_structure_sidebar.acta_sidebar .acta_footer_in_sidebar {
	margin-top: 28px;
	padding-top: 20px;
	border-top: 1px solid var(--rule);
	font-size: 12px;
	line-height: 1.6;
	color: var(--muted);
}

body.pkp_page_index .pkp_structure_sidebar.acta_sidebar .acta_footer_in_sidebar p {
	margin: 0 0 10px;
}

body.pkp_page_index .pkp_structure_sidebar.acta_sidebar .acta_footer_in_sidebar strong {
	display: block;
	margin-bottom: 8px;
	font-weight: 600;
	color: var(--ink);
}

body.pkp_page_index .pkp_structure_sidebar.acta_sidebar .acta_footer_in_sidebar img {
	max-width: 100%;
	height: auto;
	margin: 0 8px 8px 0;
	vertical-align: middle;
}

body.pkp_page_index .pkp_structure_sidebar.acta_sidebar .acta_footer_in_sidebar a {
	color: var(--accent);
	text-decoration: none;
}