/* ==========================================================================
   JIEEd PREMIUM PROFESSIONAL OJS 3 — FINAL RESTRUCTURED CSS
   Journal of Integrated Elementary Education
   Rebuilt from previous JIEEd CSS and aligned with locked visual standards.

   Design goals:
   - Professional international-journal appearance
   - Stable on OJS 3
   - No gold/yellow accent
   - No decorative top blue line
   - Current Issue remains visible
   - Footer remains visible
   - Compact left-aligned tables
   - Responsive and restrained academic styling
   ========================================================================== */

:root {
  --jieed-primary: #2f53a2;
  --jieed-dark: #223c89;
  --jieed-accent: #536cb7;
  --jieed-link: #304db2;
  --jieed-border: #c1d4eb;
  --jieed-table-head: #edf6ff;
  --jieed-table-border: #d3e2f3;
  --jieed-divider: #dfe9f5;
  --jieed-text: #2f3747;
  --jieed-muted: #6f7c92;
  --jieed-soft: #f3fbff;
  --jieed-soft-2: #f7fcff;
  --jieed-white: #ffffff;

  --jieed-shadow-xs: 0 2px 8px rgba(47, 83, 162, 0.04);
  --jieed-shadow-sm: 0 4px 14px rgba(47, 83, 162, 0.06);
  --jieed-shadow-md: 0 10px 28px rgba(47, 83, 162, 0.08);

  --jieed-radius-sm: 6px;
  --jieed-radius-md: 10px;
  --jieed-radius-lg: 14px;
}

/* ==========================================================================
   1. RESET / GLOBAL BASE
   ========================================================================== */

html,
body {
  margin: 0 !important;
  padding: 0 !important;
  background: var(--jieed-white) !important;
}

body {
  color: var(--jieed-text) !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 13px !important;
  line-height: 1.62 !important;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

body,
button,
input,
select,
textarea {
  font-family: Arial, Helvetica, sans-serif !important;
}

img {
  max-width: 100%;
  height: auto;
}

a {
  color: var(--jieed-link);
  text-decoration-thickness: 1px;
  text-underline-offset: 2px;
}

a:hover,
a:focus {
  color: var(--jieed-dark);
}

/* ==========================================================================
   2. OJS PAGE STRUCTURE
   ========================================================================== */

.pkp_structure_page {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  background: var(--jieed-white) !important;
  box-shadow: none !important;
}

.pkp_structure_content {
  width: min(1440px, calc(100% - 48px)) !important;
  max-width: 1440px !important;
  margin: 0 auto !important;
  padding-top: 24px !important;
  padding-bottom: 34px !important;
}

.pkp_structure_main {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  background: transparent !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

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

/* ==========================================================================
   3. HEADER / BRANDING
   ========================================================================== */

.pkp_structure_head {
  background: var(--jieed-white) !important;
  border: 0 !important;
  box-shadow: 0 4px 18px rgba(47, 83, 162, 0.07) !important;
}

.pkp_head_wrapper {
  width: min(1440px, calc(100% - 48px)) !important;
  max-width: 1440px !important;
  min-height: 32px !important;
  height: auto !important;
  margin: 0 auto !important;
  padding: 7px 0 6px !important;
  background: var(--jieed-white) !important;
  color: var(--jieed-text) !important;
}

.pkp_site_name {
  margin: 0 !important;
  padding: 0 !important;
}

.pkp_site_name .is_img {
  display: block !important;
  line-height: 0 !important;
}

.pkp_site_name .is_img img {
  display: block !important;
  width: auto !important;
  max-width: min(100%, 720px) !important;
  max-height: 64px !important;
  margin: 0 auto !important;
  object-fit: contain !important;
}

.pkp_site_name .is_text {
  color: var(--jieed-primary) !important;
  font-size: 28px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  letter-spacing: -0.015em !important;
  text-decoration: none !important;
}

/* ==========================================================================
   4. PRIMARY NAVIGATION
   ========================================================================== */

.pkp_navigation_primary_wrapper {
  margin-top: 12px !important;
  border-top: 1px solid var(--jieed-divider) !important;
}

.pkp_navigation_primary_row {
  background: var(--jieed-primary) !important;
  box-shadow: none !important;
}

.pkp_navigation_primary {
  width: min(1440px, calc(100% - 48px)) !important;
  max-width: 1440px !important;
  margin: 0 auto !important;
  padding: 0 !important;
}

.pkp_navigation_primary > li {
  margin: 0 !important;
}

.pkp_navigation_primary > li > a {
  display: flex !important;
  align-items: center !important;
  min-height: 46px !important;
  padding: 0 12px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #ffffff !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  letter-spacing: .01em !important;
  text-decoration: none !important;
  text-transform: none !important;
  transition: background-color .18s ease !important;
}

.pkp_navigation_primary > li > a:hover,
.pkp_navigation_primary > li > a:focus,
.pkp_navigation_primary > li.current > a,
.pkp_navigation_primary > li.active > a {
  background: var(--jieed-dark) !important;
  color: #ffffff !important;
}

/* Dropdown */
.pkp_navigation_primary .dropdown-menu,
.pkp_nav_list ul {
  min-width: 230px !important;
  padding: 7px !important;
  border: 1px solid var(--jieed-table-border) !important;
  border-radius: var(--jieed-radius-md) !important;
  background: #ffffff !important;
  box-shadow: 0 12px 28px rgba(34, 60, 137, 0.13) !important;
}

.pkp_navigation_primary .dropdown-menu a,
.pkp_nav_list ul a {
  display: block !important;
  padding: 8px 10px !important;
  border-radius: var(--jieed-radius-sm) !important;
  background: transparent !important;
  color: var(--jieed-text) !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  line-height: 1.45 !important;
  text-decoration: none !important;
}

.pkp_navigation_primary .dropdown-menu a:hover,
.pkp_navigation_primary .dropdown-menu a:focus,
.pkp_nav_list ul a:hover,
.pkp_nav_list ul a:focus {
  background: var(--jieed-soft) !important;
  color: var(--jieed-primary) !important;
}

/* User navigation */
.pkp_navigation_user {
  font-size: 12.5px !important;
}

.pkp_navigation_user > li > a {
  color: var(--jieed-primary) !important;
  font-weight: 700 !important;
  text-decoration: none !important;
}

/* ==========================================================================
   5. TYPOGRAPHY / HEADINGS
   ========================================================================== */

.pkp_structure_main h1,
.pkp_structure_main h2,
.pkp_structure_main h3,
.pkp_structure_main h4,
.pkp_structure_main h5,
.pkp_structure_main h6 {
  color: var(--jieed-primary) !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-style: normal !important;
  text-transform: none !important;
  text-shadow: none !important;
}

.pkp_structure_main h1 {
  margin-top: 0 !important;
  margin-bottom: 16px !important;
  font-size: clamp(25px, 2.7vw, 32px) !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  letter-spacing: -0.02em !important;
}

.pkp_structure_main h2 {
  margin-top: 20px !important;
  margin-bottom: 14px !important;
  padding-bottom: 9px !important;
  border-bottom: 1px solid var(--jieed-divider) !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
}

.pkp_structure_main h3 {
  margin-top: 24px !important;
  margin-bottom: 10px !important;
  font-size: 16.5px !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
}

.pkp_structure_main p,
.pkp_structure_main li {
  color: var(--jieed-text);
  font-size: 15px;
  line-height: 1.72;
}

.pkp_structure_main strong,
.pkp_structure_main b {
  font-weight: 700;
}

/* ==========================================================================
   6. HOMEPAGE INTRO / DESCRIPTION
   ========================================================================== */

.page_index_journal .homepage_image {
  margin: 0 0 24px !important;
  padding: 0 !important;
  border: 0 !important;
  background: #ffffff !important;
}

.page_index_journal .homepage_image img {
  width: 100% !important;
  border-radius: var(--jieed-radius-lg) !important;
  box-shadow: var(--jieed-shadow-md) !important;
}

.page_index_journal .journal-description,
.page_index_journal .additional_content,
.page_index_journal .description {
  margin-bottom: 20px !important;
  padding: 14px 16px !important;
  border: 1px solid var(--jieed-table-border) !important;
  border-radius: var(--jieed-radius-lg) !important;
  background: var(--jieed-soft-2) !important;
  box-shadow: var(--jieed-shadow-sm) !important;
}

/* ==========================================================================
   7. ANNOUNCEMENTS
   ========================================================================== */

.cmp_announcements {
  margin: 18px 0 22px !important;
}

.cmp_announcements > h2,
.page_index_journal .cmp_announcements > h2 {
  margin: 0 0 12px !important;
  padding: 0 0 10px !important;
  border-bottom: 1px solid var(--jieed-divider) !important;
  color: var(--jieed-primary) !important;
  font-size: 15.5px !important;
  font-weight: 700 !important;
}

.cmp_announcements ul,
.cmp_announcements .announcements {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.obj_announcement_summary {
  position: relative !important;
  margin: 0 0 10px !important;
  padding: 14px 16px !important;
  border: 1px solid #e2e9f3 !important;
  border-radius: 9px !important;
  background: #ffffff !important;
  box-shadow: 0 4px 14px rgba(47, 83, 162, 0.05) !important;
  transition: border-color .18s ease, box-shadow .18s ease, background-color .18s ease !important;
}

.obj_announcement_summary:hover {
  border-color: var(--jieed-border) !important;
  background: #fbfdff !important;
  box-shadow: 0 8px 22px rgba(47, 83, 162, 0.08) !important;
}

.obj_announcement_summary .title,
.obj_announcement_summary h3 {
  margin: 0 0 6px !important;
  padding: 0 !important;
  color: var(--jieed-primary) !important;
  font-size: 15.5px !important;
  font-weight: 700 !important;
  line-height: 1.45 !important;
}

.obj_announcement_summary .title a,
.obj_announcement_summary h3 a {
  color: var(--jieed-primary) !important;
  text-decoration: none !important;
}

.obj_announcement_summary .title a:hover,
.obj_announcement_summary h3 a:hover {
  color: var(--jieed-dark) !important;
}

.obj_announcement_summary .date {
  display: inline-block !important;
  margin: 0 0 6px !important;
  padding: 3px 8px !important;
  border-radius: 999px !important;
  background: var(--jieed-soft) !important;
  color: var(--jieed-accent) !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
}

.obj_announcement_summary .summary,
.obj_announcement_summary p {
  margin-bottom: 0 !important;
  color: #4d586a !important;
  font-size: 13px !important;
  line-height: 1.65 !important;
}

/* ==========================================================================
   8. CURRENT ISSUE — PREMIUM EDITORIAL PRESENTATION
   ========================================================================== */

.current_issue,
.obj_issue_toc {
  display: block !important;
  margin-top: 24px !important;
}

.current_issue {
  margin-bottom: 26px !important;
}

.current_issue > h2,
.current_issue .current_issue_title,
.obj_issue_toc .heading {
  margin: 0 0 20px !important;
}

.current_issue .current_issue_title,
.obj_issue_toc .heading {
  position: relative !important;
  padding: 15px 17px !important;
  border: 1px solid var(--jieed-table-border) !important;
  border-radius: 10px !important;
  background: linear-gradient(135deg, #fbfdff 0%, var(--jieed-soft-2) 100%) !important;
  box-shadow: 0 8px 24px rgba(47, 83, 162, 0.07) !important;
}

.obj_issue_toc .heading .title,
.obj_issue_toc .heading h2,
.obj_issue_toc .heading h3,
.current_issue .current_issue_title {
  color: var(--jieed-primary) !important;
  font-weight: 700 !important;
}

.obj_issue_toc .heading .title {
  margin-bottom: 7px !important;
  font-size: 22px !important;
  line-height: 1.35 !important;
}

.obj_issue_toc .heading .description,
.obj_issue_toc .heading .published,
.obj_issue_toc .heading .date_published,
.current_issue .published {
  color: var(--jieed-muted) !important;
  font-size: 13px !important;
  line-height: 1.6 !important;
}

.obj_issue_toc .cover,
.current_issue .cover {
  margin: 0 0 20px !important;
}

.obj_issue_toc .cover img,
.current_issue .cover img {
  display: block !important;
  width: auto !important;
  max-width: 175px !important;
  max-height: 240px !important;
  margin: 0 !important;
  border: 1px solid #e0e7f0 !important;
  border-radius: 9px !important;
  background: #ffffff !important;
  box-shadow: 0 8px 22px rgba(47, 83, 162, 0.10) !important;
}

.obj_issue_toc .sections {
  margin-top: 16px !important;
}

.obj_issue_toc .section {
  margin: 0 0 22px !important;
}

.obj_issue_toc .section > h2,
.obj_issue_toc .section > h3,
.obj_issue_toc .section .section_title {
  margin: 0 0 14px !important;
  padding: 0 0 9px !important;
  border-bottom: 1px solid var(--jieed-divider) !important;
  color: var(--jieed-primary) !important;
  font-size: 19px !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
}

/* ==========================================================================
   9. ARTICLE LIST / ARTICLE SUMMARY — STRUCTURED EDITORIAL LAYOUT
   ========================================================================== */

/* Article list becomes one coherent editorial surface */
.obj_issue_toc .articles,
.obj_issue_toc ul.articles,
.page_issue .articles,
.current_issue .articles {
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid #e1e8f2 !important;
  border-radius: 11px !important;
  background: #ffffff !important;
  box-shadow: 0 5px 18px rgba(47, 83, 162, 0.045) !important;
  overflow: hidden !important;
  list-style: none !important;
}

.obj_issue_toc .articles > li,
.page_issue .articles > li,
.current_issue .articles > li {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  list-style: none !important;
}

.obj_article_summary {
  position: relative !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  column-gap: 18px !important;
  row-gap: 2px !important;
  align-items: start !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 15px 17px !important;
  border: 0 !important;
  border-bottom: 1px solid #e8edf5 !important;
  border-radius: 0 !important;
  background: #ffffff !important;
  box-shadow: none !important;
  transition: background-color .16s ease !important;
}

.obj_article_summary:last-child {
  border-bottom: 0 !important;
}

.obj_article_summary:hover {
  background: #fbfdff !important;
  box-shadow: none !important;
  transform: none !important;
}

.obj_article_summary .title {
  grid-column: 1 !important;
  margin: 0 0 5px !important;
  padding: 0 !important;
  color: var(--jieed-primary) !important;
  font-size: 15.5px !important;
  font-weight: 700 !important;
  line-height: 1.42 !important;
  letter-spacing: -0.01em !important;
}

.obj_article_summary .title a {
  color: var(--jieed-primary) !important;
  text-decoration: none !important;
}

.obj_article_summary .title a:hover,
.obj_article_summary .title a:focus {
  color: var(--jieed-dark) !important;
  text-decoration: none !important;
}

.obj_article_summary .authors {
  grid-column: 1 !important;
  margin: 0 0 4px !important;
  padding: 0 !important;
  color: #505b6d !important;
  font-size: 12.5px !important;
  font-weight: 400 !important;
  line-height: 1.48 !important;
}

.obj_article_summary .pages,
.obj_article_summary .published,
.obj_article_summary .meta,
.obj_article_summary .doi,
.obj_article_summary .stats {
  grid-column: 1 !important;
  margin: 1px 0 0 !important;
  padding: 0 !important;
  color: var(--jieed-muted) !important;
  font-size: 11.8px !important;
  line-height: 1.42 !important;
}

.obj_article_summary .doi a,
.obj_article_summary .meta a {
  color: var(--jieed-link) !important;
  text-decoration: none !important;
}

/* Place PDF / galley consistently at the right on desktop */
.obj_article_summary .galleys,
.obj_article_summary .galleys_links {
  grid-column: 2 !important;
  grid-row: 1 / span 8 !important;
  align-self: center !important;
  justify-self: end !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 5px !important;
  margin: 0 !important;
  padding: 0 !important;
}

.obj_galley_link,
.galleys_links a,
.obj_article_summary .galleys a,
a.obj_galley_link {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 46px !important;
  min-height: 28px !important;
  margin: 0 !important;
  padding: 5px 9px !important;
  border: 1px solid var(--jieed-primary) !important;
  border-radius: 5px !important;
  background: var(--jieed-primary) !important;
  color: #ffffff !important;
  font-size: 10.5px !important;
  font-weight: 700 !important;
  line-height: 1.1 !important;
  letter-spacing: .02em !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
  box-shadow: none !important;
}

.obj_galley_link:hover,
.obj_galley_link:focus,
.galleys_links a:hover,
.galleys_links a:focus {
  border-color: var(--jieed-dark) !important;
  background: var(--jieed-dark) !important;
  color: #ffffff !important;
}

/* Section heading above an article group */
.obj_issue_toc .section {
  margin: 0 0 22px !important;
}

.obj_issue_toc .section > h2,
.obj_issue_toc .section > h3,
.obj_issue_toc .section .section_title {
  margin: 0 0 10px !important;
  padding: 0 0 7px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--jieed-divider) !important;
  color: var(--jieed-primary) !important;
  font-size: 16.5px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
  letter-spacing: -0.008em !important;
}

/* Archive issue summaries: compact, aligned and editorial */
.obj_issue_summary {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  column-gap: 16px !important;
  align-items: center !important;
  margin: 0 0 10px !important;
  padding: 13px 15px !important;
  border: 1px solid #e2e8f2 !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  box-shadow: 0 3px 10px rgba(47, 83, 162, 0.035) !important;
}

.obj_issue_summary .title {
  margin: 0 0 4px !important;
  color: var(--jieed-primary) !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
}

.obj_issue_summary .description,
.obj_issue_summary .published {
  margin: 0 !important;
  color: var(--jieed-muted) !important;
  font-size: 12px !important;
  line-height: 1.5 !important;
}

/* Mobile article layout */
@media (max-width: 768px) {
  .obj_article_summary {
    grid-template-columns: 1fr !important;
    padding: 14px 15px !important;
  }

  .obj_article_summary .title,
  .obj_article_summary .authors,
  .obj_article_summary .pages,
  .obj_article_summary .published,
  .obj_article_summary .meta,
  .obj_article_summary .doi,
  .obj_article_summary .stats,
  .obj_article_summary .galleys,
  .obj_article_summary .galleys_links {
    grid-column: 1 !important;
  }

  .obj_article_summary .galleys,
  .obj_article_summary .galleys_links {
    grid-row: auto !important;
    justify-self: start !important;
    margin-top: 7px !important;
  }

  .obj_issue_summary {
    grid-template-columns: 1fr !important;
  }
}

/* ==========================================================================
   10. ARTICLE DETAIL PAGE
   ========================================================================== */

.obj_article_details .page_title,
.page_article .page_title {
  margin-bottom: 14px !important;
  color: var(--jieed-primary) !important;
  font-size: clamp(25px, 2.7vw, 34px) !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  letter-spacing: -0.015em !important;
}

.obj_article_details .authors,
.obj_article_details .author {
  color: #4e596b !important;
}

.obj_article_details .abstract,
.obj_article_details .references,
.obj_article_details .keywords,
.obj_article_details .item {
  margin-top: 24px !important;
}

/* ==========================================================================
   11. BUTTONS
   ========================================================================== */

.pkp_button,
.cmp_button,
.block_make_submission_link,
input[type="submit"],
input[type="button"] {
  min-height: 32px !important;
  padding: 7px 12px !important;
  border: 1px solid var(--jieed-primary) !important;
  border-radius: var(--jieed-radius-sm) !important;
  background: var(--jieed-primary) !important;
  color: #ffffff !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  text-decoration: none !important;
  text-transform: none !important;
  box-shadow: 0 4px 12px rgba(47, 83, 162, 0.12) !important;
  transition: background-color .18s ease, border-color .18s ease, box-shadow .18s ease !important;
}

.pkp_button:hover,
.pkp_button:focus,
.cmp_button:hover,
.cmp_button:focus,
.block_make_submission_link:hover,
.block_make_submission_link:focus,
input[type="submit"]:hover,
input[type="submit"]:focus,
input[type="button"]:hover,
input[type="button"]:focus {
  border-color: var(--jieed-dark) !important;
  background: var(--jieed-dark) !important;
  color: #ffffff !important;
  box-shadow: 0 5px 15px rgba(34, 60, 137, 0.16) !important;
}

/* ==========================================================================
   12. FORMS
   ========================================================================== */

input[type="text"],
input[type="email"],
input[type="password"],
input[type="search"],
input[type="url"],
input[type="number"],
select,
textarea {
  min-height: 32px !important;
  padding: 7px 10px !important;
  border: 1px solid #cfd8e5 !important;
  border-radius: var(--jieed-radius-sm) !important;
  background: #ffffff !important;
  color: var(--jieed-text) !important;
  font-size: 14px !important;
  box-shadow: none !important;
}

textarea {
  min-height: 100px !important;
}

input:focus,
select:focus,
textarea:focus {
  border-color: var(--jieed-accent) !important;
  outline: 0 !important;
  box-shadow: 0 0 0 3px rgba(83, 108, 183, 0.12) !important;
}

/* ==========================================================================
   13. TABLES — COMPACT & LEFT ALIGNED
   ========================================================================== */

.pkp_structure_main table {
  width: auto !important;
  max-width: 100% !important;
  margin: 14px 0 !important;
  border: 1px solid var(--jieed-table-border) !important;
  border-collapse: collapse !important;
  border-spacing: 0 !important;
  table-layout: auto !important;
  background: #ffffff !important;
  color: var(--jieed-text) !important;
  font-size: 14px !important;
}

.pkp_structure_main table th {
  padding: 8px 10px !important;
  border: 1px solid var(--jieed-table-border) !important;
  background: var(--jieed-table-head) !important;
  color: var(--jieed-primary) !important;
  font-weight: 700 !important;
  line-height: 1.45 !important;
  text-align: left !important;
  vertical-align: top !important;
}

.pkp_structure_main table td {
  padding: 7px 10px !important;
  border: 1px solid #e6edf5 !important;
  background: #ffffff !important;
  color: var(--jieed-text) !important;
  line-height: 1.55 !important;
  text-align: left !important;
  vertical-align: top !important;
}

.pkp_structure_main table td:first-child,
.pkp_structure_main table th:first-child {
  white-space: nowrap;
}

/* ==========================================================================
   14. SIDEBAR
   ========================================================================== */

.pkp_structure_sidebar {
  padding-top: 0 !important;
}

.pkp_structure_sidebar .pkp_block,
.pkp_structure_sidebar .block_custom {
  margin: 0 0 12px !important;
  padding: 14px 15px !important;
  border: 1px solid #e2e8f2 !important;
  border-radius: 9px !important;
  background: #ffffff !important;
  box-shadow: 0 4px 14px rgba(47, 83, 162, 0.05) !important;
}

.pkp_structure_sidebar .pkp_block .title,
.pkp_structure_sidebar .pkp_block h2,
.pkp_structure_sidebar .pkp_block h3,
.pkp_structure_sidebar .block_custom h2,
.pkp_structure_sidebar .block_custom h3 {
  margin: 0 0 11px !important;
  padding: 0 0 8px !important;
  border-bottom: 1px solid var(--jieed-divider) !important;
  color: var(--jieed-primary) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
  text-transform: none !important;
}

.pkp_structure_sidebar p {
  color: #536072 !important;
  font-size: 13px !important;
  line-height: 1.6 !important;
}

.pkp_structure_sidebar ul {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.pkp_structure_sidebar li {
  margin: 0 !important;
  padding: 5px 0 !important;
  border-bottom: 1px solid #edf1f6 !important;
}

.pkp_structure_sidebar li:last-child {
  border-bottom: 0 !important;
}

.pkp_structure_sidebar a {
  color: #4b5870 !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
  text-decoration: none !important;
}

.pkp_structure_sidebar a:hover,
.pkp_structure_sidebar a:focus {
  color: var(--jieed-primary) !important;
}

/* ==========================================================================
   15. BREADCRUMBS / PAGINATION
   ========================================================================== */

.cmp_breadcrumbs,
.breadcrumbs {
  margin-bottom: 16px !important;
  color: var(--jieed-muted) !important;
  font-size: 12.5px !important;
}

.cmp_breadcrumbs a,
.breadcrumbs a {
  color: var(--jieed-link) !important;
  text-decoration: none !important;
}

.cmp_pagination,
.pagination {
  margin: 20px 0 !important;
}

.cmp_pagination a,
.pagination a,
.pagination span {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 32px !important;
  min-height: 32px !important;
  margin: 2px !important;
  padding: 5px 8px !important;
  border: 1px solid var(--jieed-table-border) !important;
  border-radius: var(--jieed-radius-sm) !important;
  background: #ffffff !important;
  color: var(--jieed-primary) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  text-decoration: none !important;
}

.cmp_pagination a:hover,
.pagination a:hover {
  border-color: var(--jieed-primary) !important;
  background: var(--jieed-soft) !important;
}

/* ==========================================================================
   16. FOOTER — KEEP VISIBLE
   ========================================================================== */

.pkp_structure_footer_wrapper {
  display: block !important;
  margin-top: 32px !important;
  border: 0 !important;
  background: var(--jieed-dark) !important;
}

.pkp_structure_footer {
  display: block !important;
  width: min(1440px, calc(100% - 48px)) !important;
  max-width: 1440px !important;
  margin: 0 auto !important;
  padding: 26px 0 !important;
  color: rgba(255,255,255,.88) !important;
}

.pkp_structure_footer p,
.pkp_structure_footer li,
.pkp_structure_footer div {
  color: rgba(255,255,255,.88);
}

.pkp_structure_footer a {
  color: #ffffff !important;
  text-decoration-color: rgba(255,255,255,.45) !important;
}

.pkp_structure_footer a:hover,
.pkp_structure_footer a:focus {
  color: #ffffff !important;
  text-decoration-color: #ffffff !important;
}

.pkp_brand_footer {
  display: block !important;
  padding-top: 12px !important;
  opacity: .82;
}

/* ==========================================================================
   17. ACCESSIBILITY
   ========================================================================== */

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 3px solid rgba(83,108,183,.30) !important;
  outline-offset: 2px !important;
}

/* ==========================================================================
   18. RESPONSIVE
   ========================================================================== */

@media (max-width: 1100px) {
  .pkp_structure_content,
  .pkp_head_wrapper,
  .pkp_navigation_primary,
  .pkp_structure_footer {
    width: calc(100% - 32px) !important;
  }

  .pkp_navigation_primary > li > a {
    padding-left: 11px !important;
    padding-right: 11px !important;
    font-size: 12.5px !important;
  }
}

@media (max-width: 768px) {
  body {
    font-size: 14px !important;
  }

  .pkp_structure_content,
  .pkp_head_wrapper,
  .pkp_navigation_primary,
  .pkp_structure_footer {
    width: calc(100% - 24px) !important;
  }

  .pkp_structure_content {
    padding-top: 22px !important;
    padding-bottom: 32px !important;
  }

  .pkp_site_name .is_img img {
    max-width: min(100%, 560px) !important;
    max-height: 78px !important;
  }

  .pkp_navigation_primary_row {
    background: #ffffff !important;
  }

  .pkp_navigation_primary > li > a {
    min-height: 44px !important;
    border-bottom: 1px solid #e8edf4 !important;
    background: #ffffff !important;
    color: var(--jieed-primary) !important;
  }

  .pkp_navigation_primary > li > a:hover,
  .pkp_navigation_primary > li > a:focus {
    background: var(--jieed-soft) !important;
    color: var(--jieed-dark) !important;
  }

  .obj_article_summary {
    padding: 17px 16px !important;
  }

  .pkp_structure_main table {
    display: block !important;
    width: 100% !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }

  .pkp_structure_main table td:first-child,
  .pkp_structure_main table th:first-child {
    white-space: normal;
  }
}

@media (max-width: 480px) {
  .pkp_structure_content,
  .pkp_head_wrapper,
  .pkp_navigation_primary,
  .pkp_structure_footer {
    width: calc(100% - 20px) !important;
  }

  .pkp_structure_main h1 {
    font-size: 26px !important;
  }

  .pkp_structure_main h2 {
    font-size: 20px !important;
  }

  .obj_article_summary .title {
    font-size: 16px !important;
  }

  .pkp_button,
  .cmp_button,
  .block_make_submission_link {
    width: 100% !important;
    justify-content: center !important;
    text-align: center !important;
  }
}

/* ==========================================================================
   19. LOCKED CUSTOM JIEEd HTML PAGES
   Inline !important styles remain authoritative.
   ========================================================================== */

#jieed-article-template,
#jieed-aims-scope,
#jieed-history {
  max-width: none;
}


/* ==========================================================================
   19. COMPACT LUXURY REFINEMENT
   ========================================================================== */

/* Slightly tighter rhythm across primary content */
.pkp_structure_main > *:first-child {
  margin-top: 0 !important;
}

.pkp_structure_main p {
  margin-top: 0 !important;
  margin-bottom: 11px !important;
}

.pkp_structure_main ul,
.pkp_structure_main ol {
  margin-top: 6px !important;
  margin-bottom: 14px !important;
}

.pkp_structure_main li {
  margin-bottom: 4px !important;
}

/* Refined visual hierarchy */
.current_issue,
.obj_issue_toc,
.cmp_announcements,
.page_index_journal .journal-description,
.page_index_journal .additional_content {
  position: relative !important;
}

.obj_article_summary .title,
.obj_announcement_summary .title,
.obj_issue_summary .title {
  letter-spacing: -0.008em !important;
}

/* Refined sidebar typography */
.pkp_structure_sidebar .pkp_block,
.pkp_structure_sidebar .block_custom {
  line-height: 1.55 !important;
}

/* Compact table labels */
.pkp_structure_main table th:first-child,
.pkp_structure_main table td:first-child {
  padding-right: 14px !important;
}

/* Cleaner section spacing */
.obj_issue_toc .section:last-child,
.cmp_announcements .obj_announcement_summary:last-child {
  margin-bottom: 0 !important;
}


/* ==========================================================================
   STRUCTURED COMPACT RHYTHM
   ========================================================================== */

.pkp_structure_main {
  line-height: 1.6 !important;
}

.pkp_structure_main p {
  margin-top: 0 !important;
  margin-bottom: 9px !important;
}

.pkp_structure_main h1 {
  margin-bottom: 14px !important;
}

.pkp_structure_main h2 {
  margin-top: 21px !important;
  margin-bottom: 10px !important;
}

.pkp_structure_main h3 {
  margin-top: 17px !important;
  margin-bottom: 7px !important;
}

.obj_issue_toc .sections {
  margin-top: 14px !important;
}

.cmp_announcements .obj_announcement_summary:last-child,
.obj_issue_toc .section:last-child,
.obj_issue_toc .articles .obj_article_summary:last-child {
  margin-bottom: 0 !important;
}

/* Keep the whole issue/article hierarchy visually aligned */
.current_issue,
.obj_issue_toc,
.cmp_announcements {
  width: 100% !important;
}


/* ==========================================================================
   PREMIUM AUTO-DROPDOWN NAVIGATION
   Submenu opens automatically on hover, keyboard focus, and touch-focus.
   ========================================================================== */

.pkp_navigation_primary > li,
.pkp_nav_list > li {
  position: relative !important;
}

/* Keep submenu rendered but visually hidden for smoother and more stable opening */
.pkp_navigation_primary > li > ul,
.pkp_navigation_primary > li > .dropdown-menu,
.pkp_nav_list > li > ul,
.pkp_nav_list > li > .dropdown-menu {
  display: block !important;
  position: absolute !important;
  top: 100% !important;
  left: 0 !important;
  z-index: 9999 !important;
  min-width: 215px !important;
  margin: 0 !important;
  padding: 6px !important;
  border: 1px solid var(--jieed-table-border) !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  box-shadow: 0 12px 28px rgba(34, 60, 137, 0.13) !important;

  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transform: translateY(5px) !important;
  transition:
    opacity .14s ease,
    visibility .14s ease,
    transform .14s ease !important;
}

/* Automatic submenu opening */
.pkp_navigation_primary > li:hover > ul,
.pkp_navigation_primary > li:hover > .dropdown-menu,
.pkp_navigation_primary > li:focus-within > ul,
.pkp_navigation_primary > li:focus-within > .dropdown-menu,
.pkp_nav_list > li:hover > ul,
.pkp_nav_list > li:hover > .dropdown-menu,
.pkp_nav_list > li:focus-within > ul,
.pkp_nav_list > li:focus-within > .dropdown-menu {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: translateY(0) !important;
}

/* Nested submenu support */
.pkp_navigation_primary li ul li,
.pkp_nav_list li ul li {
  position: relative !important;
}

.pkp_navigation_primary li ul li > ul,
.pkp_nav_list li ul li > ul {
  display: block !important;
  position: absolute !important;
  top: -6px !important;
  left: calc(100% + 4px) !important;
  z-index: 10000 !important;
  min-width: 210px !important;
  margin: 0 !important;
  padding: 6px !important;
  border: 1px solid var(--jieed-table-border) !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  box-shadow: 0 12px 28px rgba(34, 60, 137, 0.13) !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transform: translateX(5px) !important;
  transition:
    opacity .14s ease,
    visibility .14s ease,
    transform .14s ease !important;
}

.pkp_navigation_primary li ul li:hover > ul,
.pkp_navigation_primary li ul li:focus-within > ul,
.pkp_nav_list li ul li:hover > ul,
.pkp_nav_list li ul li:focus-within > ul {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: translateX(0) !important;
}

/* Compact premium submenu items */
.pkp_navigation_primary li ul a,
.pkp_nav_list li ul a {
  display: block !important;
  min-height: 0 !important;
  padding: 8px 10px !important;
  border-radius: 5px !important;
  background: transparent !important;
  color: var(--jieed-text) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
}

.pkp_navigation_primary li ul a:hover,
.pkp_navigation_primary li ul a:focus,
.pkp_nav_list li ul a:hover,
.pkp_nav_list li ul a:focus {
  background: var(--jieed-soft) !important;
  color: var(--jieed-primary) !important;
}


/* ==========================================================================
   CURRENT ISSUE — ULTRA COMPACT PREMIUM
   ========================================================================== */

.current_issue,
.obj_issue_toc {
  margin-top: 18px !important;
}

.current_issue {
  margin-bottom: 20px !important;
}

/* Compact editorial header */
.current_issue .current_issue_title,
.obj_issue_toc .heading {
  margin: 0 0 12px !important;
  padding: 12px 14px !important;
  border: 1px solid #dfe7f1 !important;
  border-radius: 8px !important;
  background: linear-gradient(135deg, #ffffff 0%, #f7fbff 100%) !important;
  box-shadow: 0 4px 14px rgba(47, 83, 162, 0.045) !important;
}

.obj_issue_toc .heading .title,
.current_issue .current_issue_title {
  margin: 0 0 4px !important;
  color: var(--jieed-primary) !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  letter-spacing: -0.01em !important;
}

.obj_issue_toc .heading .description,
.obj_issue_toc .heading .published,
.obj_issue_toc .heading .date_published,
.current_issue .published {
  margin: 0 !important;
  color: var(--jieed-muted) !important;
  font-size: 11.8px !important;
  line-height: 1.45 !important;
}

/* Smaller and more proportional issue cover */
.obj_issue_toc .cover,
.current_issue .cover {
  margin: 0 0 12px !important;
}

.obj_issue_toc .cover img,
.current_issue .cover img {
  display: block !important;
  width: auto !important;
  max-width: 145px !important;
  max-height: 205px !important;
  margin: 0 !important;
  border: 1px solid #e1e7ef !important;
  border-radius: 7px !important;
  background: #ffffff !important;
  box-shadow: 0 5px 14px rgba(47, 83, 162, 0.07) !important;
}

/* Tighter section spacing */
.obj_issue_toc .sections {
  margin-top: 12px !important;
}

.obj_issue_toc .section {
  margin: 0 0 16px !important;
}

.obj_issue_toc .section > h2,
.obj_issue_toc .section > h3,
.obj_issue_toc .section .section_title {
  margin: 0 0 8px !important;
  padding: 0 0 6px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--jieed-divider) !important;
  color: var(--jieed-primary) !important;
  font-size: 15.5px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
  letter-spacing: -0.008em !important;
}

/* More compact article surface inside current issue */
.obj_issue_toc .articles,
.obj_issue_toc ul.articles,
.current_issue .articles {
  border-radius: 8px !important;
  box-shadow: 0 3px 12px rgba(47, 83, 162, 0.035) !important;
}

.current_issue .obj_article_summary,
.obj_issue_toc .obj_article_summary {
  padding: 12px 14px !important;
  column-gap: 14px !important;
}

.current_issue .obj_article_summary .title,
.obj_issue_toc .obj_article_summary .title {
  margin-bottom: 4px !important;
  font-size: 14.5px !important;
  line-height: 1.4 !important;
}

.current_issue .obj_article_summary .authors,
.obj_issue_toc .obj_article_summary .authors {
  margin-bottom: 3px !important;
  font-size: 12px !important;
  line-height: 1.42 !important;
}

.current_issue .obj_article_summary .pages,
.current_issue .obj_article_summary .published,
.current_issue .obj_article_summary .meta,
.current_issue .obj_article_summary .doi,
.obj_issue_toc .obj_article_summary .pages,
.obj_issue_toc .obj_article_summary .published,
.obj_issue_toc .obj_article_summary .meta,
.obj_issue_toc .obj_article_summary .doi {
  font-size: 11.3px !important;
  line-height: 1.38 !important;
}

/* Smaller galley/PDF control */
.current_issue .obj_galley_link,
.obj_issue_toc .obj_galley_link {
  min-width: 43px !important;
  min-height: 26px !important;
  padding: 4px 8px !important;
  font-size: 10px !important;
  border-radius: 5px !important;
}


/* ==========================================================================
   MOBILE NAVIGATION SAFETY
   On small screens submenu stays in normal flow when opened/focused.
   ========================================================================== */

@media (max-width: 768px) {
  .pkp_navigation_primary > li,
  .pkp_nav_list > li {
    width: 100% !important;
  }

  .pkp_navigation_primary > li > ul,
  .pkp_navigation_primary > li > .dropdown-menu,
  .pkp_nav_list > li > ul,
  .pkp_nav_list > li > .dropdown-menu {
    position: static !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 3px 0 5px 12px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: #f8fbff !important;
    box-shadow: none !important;
    transform: none !important;
  }

  .pkp_navigation_primary li ul a,
  .pkp_nav_list li ul a {
    white-space: normal !important;
    padding: 7px 9px !important;
  }

  .pkp_navigation_primary li ul li > ul,
  .pkp_nav_list li ul li > ul {
    position: static !important;
    width: 100% !important;
    min-width: 0 !important;
    margin-left: 8px !important;
    border: 0 !important;
    box-shadow: none !important;
    transform: none !important;
  }

  .obj_issue_toc .cover img,
  .current_issue .cover img {
    max-width: 120px !important;
    max-height: 170px !important;
  }
}


/* ==========================================================================
   JIEEd — DENSE GALLERY LAYOUT & SPACE OPTIMIZATION
   ========================================================================== */

/* --- Reduce excessive vertical whitespace --- */
.pkp_structure_content {
  padding-top: 18px !important;
  padding-bottom: 24px !important;
}

.pkp_structure_main {
  min-height: 0 !important;
}

.pkp_structure_main > * {
  margin-top: 0;
}

.pkp_structure_main h1 {
  margin-bottom: 14px !important;
}

.pkp_structure_main h2 {
  margin-top: 20px !important;
  margin-bottom: 10px !important;
  padding-bottom: 7px !important;
}

.pkp_structure_main h3 {
  margin-top: 16px !important;
  margin-bottom: 8px !important;
}

.pkp_structure_main p {
  margin-top: 0 !important;
  margin-bottom: 9px !important;
}

.pkp_structure_main ul,
.pkp_structure_main ol {
  margin-top: 4px !important;
  margin-bottom: 10px !important;
}

.page_index_journal .journal-description,
.page_index_journal .additional_content,
.page_index_journal .description {
  margin-bottom: 16px !important;
  padding: 16px 18px !important;
}

.cmp_announcements {
  margin-top: 16px !important;
  margin-bottom: 18px !important;
}

.current_issue,
.obj_issue_toc {
  margin-top: 14px !important;
  margin-bottom: 18px !important;
}

.obj_issue_toc .heading,
.current_issue .current_issue_title {
  margin-bottom: 10px !important;
}

.obj_issue_toc .sections {
  margin-top: 8px !important;
}

.obj_issue_toc .section {
  margin-bottom: 14px !important;
}

/* --- ARTICLE LIST AS PREMIUM GALLERY --- */
.obj_issue_toc .articles,
.obj_issue_toc ul.articles,
.current_issue .articles,
.current_issue ul.articles {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  list-style: none !important;
}

/* Article card */
.obj_issue_toc .obj_article_summary,
.current_issue .obj_article_summary {
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  height: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 14px 15px 13px !important;
  border: 1px solid #e1e8f2 !important;
  border-radius: 9px !important;
  background: #ffffff !important;
  box-shadow: 0 3px 10px rgba(47, 83, 162, 0.04) !important;
  overflow: hidden !important;
  transition: border-color .16s ease, box-shadow .16s ease, background-color .16s ease !important;
}

.obj_issue_toc .obj_article_summary:hover,
.current_issue .obj_article_summary:hover {
  border-color: var(--jieed-border) !important;
  background: #fbfdff !important;
  box-shadow: 0 7px 18px rgba(47, 83, 162, 0.075) !important;
}

/* Gallery card title */
.obj_issue_toc .obj_article_summary .title,
.current_issue .obj_article_summary .title {
  margin: 0 0 5px !important;
  padding: 0 !important;
  font-size: 14.5px !important;
  font-weight: 700 !important;
  line-height: 1.38 !important;
  letter-spacing: -0.006em !important;
}

.obj_issue_toc .obj_article_summary .title a,
.current_issue .obj_article_summary .title a {
  color: var(--jieed-primary) !important;
  text-decoration: none !important;
}

/* Author */
.obj_issue_toc .obj_article_summary .authors,
.current_issue .obj_article_summary .authors {
  margin: 0 0 4px !important;
  color: #4f5b6d !important;
  font-size: 11.8px !important;
  line-height: 1.42 !important;
}

/* Metadata */
.obj_issue_toc .obj_article_summary .pages,
.obj_issue_toc .obj_article_summary .published,
.obj_issue_toc .obj_article_summary .meta,
.obj_issue_toc .obj_article_summary .doi,
.obj_issue_toc .obj_article_summary .stats,
.current_issue .obj_article_summary .pages,
.current_issue .obj_article_summary .published,
.current_issue .obj_article_summary .meta,
.current_issue .obj_article_summary .doi,
.current_issue .obj_article_summary .stats {
  margin-top: 2px !important;
  color: var(--jieed-muted) !important;
  font-size: 11px !important;
  line-height: 1.35 !important;
}

/* Push galley links neatly to card bottom when possible */
.obj_issue_toc .obj_article_summary .galleys,
.obj_issue_toc .obj_article_summary .galleys_links,
.current_issue .obj_article_summary .galleys,
.current_issue .obj_article_summary .galleys_links {
  margin-top: auto !important;
  padding-top: 8px !important;
}

/* Smaller premium galley button */
.obj_issue_toc .obj_galley_link,
.current_issue .obj_galley_link,
.obj_issue_toc .galleys a,
.current_issue .galleys a {
  min-height: 27px !important;
  margin: 2px 4px 0 0 !important;
  padding: 4px 8px !important;
  border-radius: 5px !important;
  font-size: 9.8px !important;
  font-weight: 700 !important;
  line-height: 1.1 !important;
}

/* --- Current issue header even denser --- */
.current_issue .current_issue_title,
.obj_issue_toc .heading {
  padding: 10px 12px !important;
  border-radius: 8px !important;
  box-shadow: 0 3px 10px rgba(47, 83, 162, 0.04) !important;
}

.obj_issue_toc .heading .title,
.current_issue .current_issue_title {
  font-size: 17px !important;
  line-height: 1.28 !important;
}

.obj_issue_toc .cover,
.current_issue .cover {
  margin-bottom: 8px !important;
}

.obj_issue_toc .cover img,
.current_issue .cover img {
  max-width: 125px !important;
  max-height: 175px !important;
  border-radius: 6px !important;
  box-shadow: 0 4px 12px rgba(47, 83, 162, 0.06) !important;
}

.obj_issue_toc .section > h2,
.obj_issue_toc .section > h3,
.obj_issue_toc .section .section_title {
  margin: 0 0 7px !important;
  padding-bottom: 5px !important;
  font-size: 15px !important;
}

/* --- Archive list can also use a compact gallery --- */
.page_issue_archive .issues_archive,
.page_issue_archive ul.issues_archive {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.page_issue_archive .obj_issue_summary {
  height: 100% !important;
  margin: 0 !important;
  padding: 13px 14px !important;
  border-radius: 8px !important;
}

/* --- Announcements denser and cleaner --- */
.obj_announcement_summary {
  margin-bottom: 9px !important;
  padding: 13px 15px !important;
  border-radius: 8px !important;
}

.obj_announcement_summary .title,
.obj_announcement_summary h3 {
  margin-bottom: 4px !important;
  font-size: 14.5px !important;
  line-height: 1.38 !important;
}

.obj_announcement_summary .date {
  margin-bottom: 5px !important;
  padding: 2px 7px !important;
  font-size: 10.8px !important;
}

.obj_announcement_summary .summary,
.obj_announcement_summary p {
  font-size: 12.5px !important;
  line-height: 1.5 !important;
}

/* --- Sidebar denser --- */
.pkp_structure_sidebar .pkp_block,
.pkp_structure_sidebar .block_custom {
  margin-bottom: 10px !important;
  padding: 12px 13px !important;
  border-radius: 8px !important;
}

.pkp_structure_sidebar .pkp_block .title,
.pkp_structure_sidebar .pkp_block h2,
.pkp_structure_sidebar .pkp_block h3,
.pkp_structure_sidebar .block_custom h2,
.pkp_structure_sidebar .block_custom h3 {
  margin-bottom: 8px !important;
  padding-bottom: 6px !important;
}

.pkp_structure_sidebar li {
  padding: 4px 0 !important;
}

/* --- Footer spacing --- */
.pkp_structure_footer_wrapper {
  margin-top: 22px !important;
}

.pkp_structure_footer {
  padding-top: 20px !important;
  padding-bottom: 20px !important;
}

/* ==========================================================================
   HIDE OJS / PKP BRAND IMAGE WITHOUT HIDING JOURNAL FOOTER
   ========================================================================== */

.pkp_brand_footer,
.pkp_brand_footer img,
img[src*="ojs_brand.png"],
img.img-responsive[src*="ojs_brand.png"],
img[alt*="More information about the publishing system"],
img[alt*="Platform and Workflow by OJS/PKP"] {
  display: none !important;
  visibility: hidden !important;
  width: 0 !important;
  height: 0 !important;
  max-width: 0 !important;
  max-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

/* Avoid empty space where PKP brand used to be */
.pkp_structure_footer .pkp_brand_footer,
.pkp_structure_footer_wrapper .pkp_brand_footer {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* ==========================================================================
   RESPONSIVE GALLERY
   ========================================================================== */

@media (max-width: 900px) {
  .obj_issue_toc .articles,
  .obj_issue_toc ul.articles,
  .current_issue .articles,
  .current_issue ul.articles,
  .page_issue_archive .issues_archive,
  .page_issue_archive ul.issues_archive {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 768px) {
  .pkp_structure_content {
    padding-top: 14px !important;
    padding-bottom: 20px !important;
  }

  .obj_issue_toc .obj_article_summary,
  .current_issue .obj_article_summary {
    padding: 12px 13px !important;
  }

  .obj_issue_toc .cover img,
  .current_issue .cover img {
    max-width: 105px !important;
    max-height: 150px !important;
  }
}


/* ==========================================================================
   JIEEd NAVIGATION — ROBUST AUTO SUBMENU + BLUE THEME HIGHLIGHT
   Supports OJS 3 / Bootstrap-like dropdown states:
   hover, focus-within, .open, .show, .active, aria-expanded=true
   ========================================================================== */

/* Ensure dropdown parents create positioning context */
.pkp_navigation_primary > li,
.pkp_navigation_primary li,
.pkp_nav_list > li,
.pkp_nav_list li,
#navigationPrimary > li,
#navigationUser > li,
.navbar-nav > li,
.nav > li {
  position: relative !important;
}

/* Primary navigation base */
.pkp_navigation_primary > li > a,
#navigationPrimary > li > a,
.navbar-nav > li > a {
  background: transparent !important;
  color: #ffffff !important;
  border-radius: 0 !important;
  text-decoration: none !important;
  transition: background-color .14s ease, color .14s ease !important;
}

/* Locked blue highlight for hover/focus/active/open */
.pkp_navigation_primary > li:hover > a,
.pkp_navigation_primary > li:focus-within > a,
.pkp_navigation_primary > li.active > a,
.pkp_navigation_primary > li.current > a,
.pkp_navigation_primary > li.open > a,
.pkp_navigation_primary > li.show > a,
.pkp_navigation_primary > li > a[aria-expanded="true"],
#navigationPrimary > li:hover > a,
#navigationPrimary > li:focus-within > a,
#navigationPrimary > li.active > a,
#navigationPrimary > li.open > a,
#navigationPrimary > li.show > a,
#navigationPrimary > li > a[aria-expanded="true"],
.navbar-nav > li:hover > a,
.navbar-nav > li:focus-within > a,
.navbar-nav > li.active > a,
.navbar-nav > li.open > a,
.navbar-nav > li.show > a,
.navbar-nav > li > a[aria-expanded="true"] {
  background: var(--jieed-dark) !important;
  color: #ffffff !important;
  box-shadow: inset 0 -3px 0 var(--jieed-accent) !important;
}

/* Default hidden submenu */
.pkp_navigation_primary li > ul,
.pkp_navigation_primary li > .dropdown-menu,
.pkp_nav_list li > ul,
.pkp_nav_list li > .dropdown-menu,
#navigationPrimary li > ul,
#navigationPrimary li > .dropdown-menu,
.navbar-nav li > .dropdown-menu {
  display: block !important;
  position: absolute !important;
  top: 100% !important;
  left: 0 !important;
  z-index: 99999 !important;
  min-width: 220px !important;
  margin: 0 !important;
  padding: 6px !important;
  border: 1px solid var(--jieed-table-border) !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  box-shadow: 0 12px 28px rgba(34, 60, 137, 0.14) !important;

  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transform: translateY(4px) !important;
  transition: opacity .13s ease, visibility .13s ease, transform .13s ease !important;
}

/* Show submenu automatically */
.pkp_navigation_primary li:hover > ul,
.pkp_navigation_primary li:hover > .dropdown-menu,
.pkp_navigation_primary li:focus-within > ul,
.pkp_navigation_primary li:focus-within > .dropdown-menu,
.pkp_navigation_primary li.open > ul,
.pkp_navigation_primary li.open > .dropdown-menu,
.pkp_navigation_primary li.show > ul,
.pkp_navigation_primary li.show > .dropdown-menu,
.pkp_navigation_primary li > a[aria-expanded="true"] + ul,
.pkp_navigation_primary li > a[aria-expanded="true"] + .dropdown-menu,

.pkp_nav_list li:hover > ul,
.pkp_nav_list li:hover > .dropdown-menu,
.pkp_nav_list li:focus-within > ul,
.pkp_nav_list li:focus-within > .dropdown-menu,
.pkp_nav_list li.open > ul,
.pkp_nav_list li.open > .dropdown-menu,
.pkp_nav_list li.show > ul,
.pkp_nav_list li.show > .dropdown-menu,

#navigationPrimary li:hover > ul,
#navigationPrimary li:hover > .dropdown-menu,
#navigationPrimary li:focus-within > ul,
#navigationPrimary li:focus-within > .dropdown-menu,
#navigationPrimary li.open > ul,
#navigationPrimary li.open > .dropdown-menu,
#navigationPrimary li.show > ul,
#navigationPrimary li.show > .dropdown-menu,
#navigationPrimary li > a[aria-expanded="true"] + ul,
#navigationPrimary li > a[aria-expanded="true"] + .dropdown-menu,

.navbar-nav li:hover > .dropdown-menu,
.navbar-nav li:focus-within > .dropdown-menu,
.navbar-nav li.open > .dropdown-menu,
.navbar-nav li.show > .dropdown-menu,
.navbar-nav li > a[aria-expanded="true"] + .dropdown-menu {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: translateY(0) !important;
}

/* Premium submenu items */
.pkp_navigation_primary li ul a,
.pkp_navigation_primary .dropdown-menu a,
.pkp_nav_list li ul a,
.pkp_nav_list .dropdown-menu a,
#navigationPrimary li ul a,
#navigationPrimary .dropdown-menu a,
.navbar-nav .dropdown-menu a {
  display: block !important;
  min-height: 0 !important;
  padding: 8px 10px !important;
  border: 0 !important;
  border-radius: 5px !important;
  background: transparent !important;
  color: var(--jieed-text) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
}

/* Locked blue submenu highlight */
.pkp_navigation_primary li ul a:hover,
.pkp_navigation_primary li ul a:focus,
.pkp_navigation_primary li ul li.active > a,
.pkp_navigation_primary li ul li.current > a,
.pkp_navigation_primary li ul li.open > a,
.pkp_navigation_primary .dropdown-menu a:hover,
.pkp_navigation_primary .dropdown-menu a:focus,
.pkp_nav_list li ul a:hover,
.pkp_nav_list li ul a:focus,
.pkp_nav_list li ul li.active > a,
.pkp_nav_list li ul li.current > a,
#navigationPrimary li ul a:hover,
#navigationPrimary li ul a:focus,
#navigationPrimary li ul li.active > a,
#navigationPrimary li ul li.current > a,
.navbar-nav .dropdown-menu a:hover,
.navbar-nav .dropdown-menu a:focus,
.navbar-nav .dropdown-menu .active > a {
  background: var(--jieed-soft) !important;
  color: var(--jieed-primary) !important;
  box-shadow: inset 3px 0 0 var(--jieed-primary) !important;
}

/* Nested submenus */
.pkp_navigation_primary li ul li > ul,
.pkp_nav_list li ul li > ul,
#navigationPrimary li ul li > ul,
.navbar-nav .dropdown-menu li > .dropdown-menu {
  top: -6px !important;
  left: calc(100% + 4px) !important;
}

/* Force bootstrap/OJS open/show dropdowns to remain visible */
.dropdown.open > .dropdown-menu,
.dropdown.show > .dropdown-menu,
.open > .dropdown-menu,
.show > .dropdown-menu {
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

/* Remove legacy yellow/default theme active states if present */
#headerNavigationContainer.navbar.navbar-default .active > a,
#headerNavigationContainer.navbar.navbar-default .open > a,
#headerNavigationContainer.navbar.navbar-default .show > a,
#headerNavigationContainer.navbar.navbar-default a[aria-expanded="true"] {
  background: var(--jieed-dark) !important;
  color: #ffffff !important;
  border-color: var(--jieed-dark) !important;
}

#headerNavigationContainer .navbar-nav .dropdown-menu a:hover,
#headerNavigationContainer .navbar-nav .dropdown-menu a:focus,
#headerNavigationContainer .navbar-nav .dropdown-menu .active > a {
  background: var(--jieed-soft) !important;
  color: var(--jieed-primary) !important;
}

/* ==========================================================================
   MOBILE / TOUCH NAVIGATION
   ========================================================================== */

@media (max-width: 768px) {

  /* Parent navigation highlight on focus/touch/open */
  .pkp_navigation_primary > li:focus-within > a,
  .pkp_navigation_primary > li.open > a,
  .pkp_navigation_primary > li.show > a,
  .pkp_navigation_primary > li > a[aria-expanded="true"],
  #navigationPrimary > li:focus-within > a,
  #navigationPrimary > li.open > a,
  #navigationPrimary > li.show > a,
  #navigationPrimary > li > a[aria-expanded="true"],
  .navbar-nav > li:focus-within > a,
  .navbar-nav > li.open > a,
  .navbar-nav > li.show > a,
  .navbar-nav > li > a[aria-expanded="true"] {
    background: var(--jieed-soft) !important;
    color: var(--jieed-primary) !important;
    box-shadow: inset 3px 0 0 var(--jieed-primary) !important;
  }

  /* Keep submenu inside mobile menu flow */
  .pkp_navigation_primary li > ul,
  .pkp_navigation_primary li > .dropdown-menu,
  .pkp_nav_list li > ul,
  .pkp_nav_list li > .dropdown-menu,
  #navigationPrimary li > ul,
  #navigationPrimary li > .dropdown-menu,
  .navbar-nav li > .dropdown-menu {
    position: static !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 3px 0 5px 12px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: #f8fbff !important;
    box-shadow: none !important;
    transform: none !important;
  }

  /* Hidden until parent receives focus/open state */
  .pkp_navigation_primary li > ul,
  .pkp_navigation_primary li > .dropdown-menu,
  .pkp_nav_list li > ul,
  .pkp_nav_list li > .dropdown-menu,
  #navigationPrimary li > ul,
  #navigationPrimary li > .dropdown-menu,
  .navbar-nav li > .dropdown-menu {
    max-height: 0 !important;
    overflow: hidden !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    transition: max-height .18s ease, opacity .15s ease !important;
  }

  .pkp_navigation_primary li:focus-within > ul,
  .pkp_navigation_primary li:focus-within > .dropdown-menu,
  .pkp_navigation_primary li.open > ul,
  .pkp_navigation_primary li.open > .dropdown-menu,
  .pkp_navigation_primary li.show > ul,
  .pkp_navigation_primary li.show > .dropdown-menu,
  .pkp_navigation_primary li > a[aria-expanded="true"] + ul,
  .pkp_navigation_primary li > a[aria-expanded="true"] + .dropdown-menu,

  .pkp_nav_list li:focus-within > ul,
  .pkp_nav_list li:focus-within > .dropdown-menu,
  .pkp_nav_list li.open > ul,
  .pkp_nav_list li.open > .dropdown-menu,
  .pkp_nav_list li.show > ul,
  .pkp_nav_list li.show > .dropdown-menu,

  #navigationPrimary li:focus-within > ul,
  #navigationPrimary li:focus-within > .dropdown-menu,
  #navigationPrimary li.open > ul,
  #navigationPrimary li.open > .dropdown-menu,
  #navigationPrimary li.show > ul,
  #navigationPrimary li.show > .dropdown-menu,
  #navigationPrimary li > a[aria-expanded="true"] + ul,
  #navigationPrimary li > a[aria-expanded="true"] + .dropdown-menu,

  .navbar-nav li:focus-within > .dropdown-menu,
  .navbar-nav li.open > .dropdown-menu,
  .navbar-nav li.show > .dropdown-menu,
  .navbar-nav li > a[aria-expanded="true"] + .dropdown-menu {
    max-height: 1000px !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    padding-top: 3px !important;
    padding-bottom: 5px !important;
  }

  .pkp_navigation_primary li ul a,
  .pkp_nav_list li ul a,
  #navigationPrimary li ul a,
  .navbar-nav .dropdown-menu a {
    white-space: normal !important;
    padding: 7px 9px !important;
  }
}


/* ==========================================================================
   JIEEd — PREMIUM TWO-COLUMN GALLERY + NAVIGATION COLOR REFINEMENT
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. NAVIGATION: BLUE/DARK TEXT AT REST, PREMIUM BLUE ON INTERACTION
   -------------------------------------------------------------------------- */

.pkp_navigation_primary_row,
#headerNavigationContainer.navbar.navbar-default {
  background: #ffffff !important;
  border-top: 1px solid var(--jieed-divider) !important;
  border-bottom: 1px solid var(--jieed-divider) !important;
  box-shadow: 0 3px 12px rgba(47, 83, 162, 0.04) !important;
}

/* Normal / untouched state */
.pkp_navigation_primary > li > a,
#navigationPrimary > li > a,
.navbar-nav > li > a,
#headerNavigationContainer.navbar.navbar-default > .container-fluid .navbar-nav > li > a {
  background: transparent !important;
  color: var(--jieed-primary) !important;
  box-shadow: none !important;
  text-decoration: none !important;
}

/* Slightly darker on keyboard focus before open */
.pkp_navigation_primary > li > a:focus,
#navigationPrimary > li > a:focus,
.navbar-nav > li > a:focus {
  color: var(--jieed-dark) !important;
}

/* Hover / touched / open / active */
.pkp_navigation_primary > li:hover > a,
.pkp_navigation_primary > li:focus-within > a,
.pkp_navigation_primary > li.active > a,
.pkp_navigation_primary > li.current > a,
.pkp_navigation_primary > li.open > a,
.pkp_navigation_primary > li.show > a,
.pkp_navigation_primary > li > a[aria-expanded="true"],

#navigationPrimary > li:hover > a,
#navigationPrimary > li:focus-within > a,
#navigationPrimary > li.active > a,
#navigationPrimary > li.current > a,
#navigationPrimary > li.open > a,
#navigationPrimary > li.show > a,
#navigationPrimary > li > a[aria-expanded="true"],

.navbar-nav > li:hover > a,
.navbar-nav > li:focus-within > a,
.navbar-nav > li.active > a,
.navbar-nav > li.current > a,
.navbar-nav > li.open > a,
.navbar-nav > li.show > a,
.navbar-nav > li > a[aria-expanded="true"] {
  background: var(--jieed-primary) !important;
  color: #ffffff !important;
  box-shadow: inset 0 -3px 0 var(--jieed-accent) !important;
}

/* Active item can remain slightly darker */
.pkp_navigation_primary > li.active > a,
.pkp_navigation_primary > li.current > a,
#navigationPrimary > li.active > a,
#navigationPrimary > li.current > a,
.navbar-nav > li.active > a,
.navbar-nav > li.current > a {
  background: var(--jieed-dark) !important;
  color: #ffffff !important;
}

/* Submenu untouched state */
.pkp_navigation_primary li ul a,
.pkp_navigation_primary .dropdown-menu a,
.pkp_nav_list li ul a,
.pkp_nav_list .dropdown-menu a,
#navigationPrimary li ul a,
#navigationPrimary .dropdown-menu a,
.navbar-nav .dropdown-menu a {
  background: transparent !important;
  color: var(--jieed-text) !important;
}

/* Submenu interaction highlight in theme blue */
.pkp_navigation_primary li ul a:hover,
.pkp_navigation_primary li ul a:focus,
.pkp_navigation_primary li ul li.active > a,
.pkp_navigation_primary li ul li.current > a,
.pkp_navigation_primary .dropdown-menu a:hover,
.pkp_navigation_primary .dropdown-menu a:focus,
.pkp_nav_list li ul a:hover,
.pkp_nav_list li ul a:focus,
#navigationPrimary li ul a:hover,
#navigationPrimary li ul a:focus,
.navbar-nav .dropdown-menu a:hover,
.navbar-nav .dropdown-menu a:focus,
.navbar-nav .dropdown-menu .active > a {
  background: var(--jieed-soft) !important;
  color: var(--jieed-primary) !important;
  box-shadow: inset 3px 0 0 var(--jieed-primary) !important;
}

/* --------------------------------------------------------------------------
   2. GENERAL TWO-COLUMN UTILITY FOR CUSTOM HTML PAGES
   -------------------------------------------------------------------------- */

.jieed-gallery-2 {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  align-items: stretch !important;
}

.jieed-gallery-2 > * {
  min-width: 0 !important;
  margin: 0 !important;
}

/* --------------------------------------------------------------------------
   3. ARTICLE GALLERY — TWO COLUMNS ON WIDE SCREENS
   -------------------------------------------------------------------------- */

@media (min-width: 1100px) {
  .obj_issue_toc .articles,
  .obj_issue_toc ul.articles,
  .current_issue .articles,
  .current_issue ul.articles {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
    align-items: stretch !important;
  }

  .obj_issue_toc .obj_article_summary,
  .current_issue .obj_article_summary {
    height: 100% !important;
    margin: 0 !important;
    padding: 13px 14px !important;
    border: 1px solid #e1e8f2 !important;
    border-radius: 9px !important;
    background: #ffffff !important;
    box-shadow: 0 3px 10px rgba(47, 83, 162, 0.035) !important;
  }
}

/* --------------------------------------------------------------------------
   4. ANNOUNCEMENT GALLERY — TWO COLUMNS
   -------------------------------------------------------------------------- */

@media (min-width: 1100px) {
  .cmp_announcements .announcements,
  .cmp_announcements ul,
  .page_index_journal .cmp_announcements .announcements {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
  }

  .cmp_announcements .obj_announcement_summary {
    height: 100% !important;
    margin: 0 !important;
  }
}

/* --------------------------------------------------------------------------
   5. ISSUE ARCHIVE GALLERY — TWO COLUMNS
   -------------------------------------------------------------------------- */

@media (min-width: 1100px) {
  .page_issue_archive .issues_archive,
  .page_issue_archive ul.issues_archive {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
  }

  .page_issue_archive .obj_issue_summary {
    height: 100% !important;
    margin: 0 !important;
  }
}

/* --------------------------------------------------------------------------
   6. OPTIONAL TWO-COLUMN LAYOUT FOR GENERIC OJS CARD-LIKE GROUPS
   -------------------------------------------------------------------------- */

@media (min-width: 1200px) {
  .jieed-card-grid,
  .jieed-policy-grid,
  .jieed-info-grid,
  .jieed-history-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
    align-items: stretch !important;
  }
}

/* --------------------------------------------------------------------------
   7. RESPONSIVE FALLBACK
   -------------------------------------------------------------------------- */

@media (max-width: 1099px) {
  .jieed-gallery-2,
  .obj_issue_toc .articles,
  .obj_issue_toc ul.articles,
  .current_issue .articles,
  .current_issue ul.articles,
  .cmp_announcements .announcements,
  .cmp_announcements ul,
  .page_issue_archive .issues_archive,
  .page_issue_archive ul.issues_archive {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 768px) {
  /* Mobile navigation normal state remains readable */
  .pkp_navigation_primary > li > a,
  #navigationPrimary > li > a,
  .navbar-nav > li > a {
    background: #ffffff !important;
    color: var(--jieed-primary) !important;
  }

  .pkp_navigation_primary > li:hover > a,
  .pkp_navigation_primary > li:focus-within > a,
  .pkp_navigation_primary > li.open > a,
  .pkp_navigation_primary > li.show > a,
  .pkp_navigation_primary > li > a[aria-expanded="true"],
  #navigationPrimary > li:hover > a,
  #navigationPrimary > li:focus-within > a,
  #navigationPrimary > li.open > a,
  #navigationPrimary > li.show > a,
  #navigationPrimary > li > a[aria-expanded="true"],
  .navbar-nav > li:hover > a,
  .navbar-nav > li:focus-within > a,
  .navbar-nav > li.open > a,
  .navbar-nav > li.show > a,
  .navbar-nav > li > a[aria-expanded="true"] {
    background: var(--jieed-soft) !important;
    color: var(--jieed-primary) !important;
    box-shadow: inset 3px 0 0 var(--jieed-primary) !important;
  }
}


/* ==========================================================================
   HIDE ANNOUNCEMENTS HEADING ONLY
   Keeps announcement content visible and removes empty heading space.
   ========================================================================== */

.cmp_announcements > h2,
.page_index_journal .cmp_announcements > h2 {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  overflow: hidden !important;
}

.cmp_announcements,
.page_index_journal .cmp_announcements {
  margin-top: 8px !important;
}


/* ==========================================================================
   JIEEd HOMEPAGE — COMPACT PREMIUM RESPONSIVE GALLERY
   Exact OJS selectors confirmed from browser DevTools.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. REMOVE ANNOUNCEMENTS PAGE HEADER COMPLETELY
   Exact structure:
   #main-content > section.cmp_announcements.media > header.page-header > h2
   -------------------------------------------------------------------------- */

#main-content > section.cmp_announcements.media > header,
#main-content > section.cmp_announcements.media > header.page-header,
#main-content > section.cmp_announcements.media > header.page-header > h2,
section.cmp_announcements.media > header,
section.cmp_announcements.media > header.page-header,
section.cmp_announcements.media > header.page-header > h2,
.cmp_announcements > header,
.cmp_announcements > header.page-header,
.cmp_announcements > header.page-header > h2,
.cmp_announcements > h2 {
  display: none !important;
  visibility: hidden !important;
  position: absolute !important;
  width: 0 !important;
  height: 0 !important;
  min-width: 0 !important;
  min-height: 0 !important;
  max-width: 0 !important;
  max-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  overflow: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* Prevent any reserved space left by the removed header */
#main-content > section.cmp_announcements.media,
section.cmp_announcements.media,
.cmp_announcements {
  margin-top: 6px !important;
  padding-top: 0 !important;
}

/* --------------------------------------------------------------------------
   2. HOMEPAGE VERTICAL RHYTHM — LESS EMPTY SPACE
   -------------------------------------------------------------------------- */

#main-content.page_index_journal,
.page_index_journal {
  padding-top: 0 !important;
}

#main-content.page_index_journal > *,
.page_index_journal > * {
  margin-top: 0 !important;
  margin-bottom: 12px !important;
}

#main-content .journal-description,
#main-content .cmp_announcements,
#main-content .current_issue,
#main-content .additional_content {
  margin-top: 0 !important;
  margin-bottom: 12px !important;
}

#main-content .journal-description {
  padding: 14px 16px !important;
}

#main-content .journal-description p,
#main-content .additional_content p {
  margin-top: 0 !important;
  margin-bottom: 8px !important;
}

#main-content .journal-description p:last-child,
#main-content .additional_content p:last-child {
  margin-bottom: 0 !important;
}

/* --------------------------------------------------------------------------
   3. ANNOUNCEMENTS — RESPONSIVE PREMIUM GALLERY
   Real OJS wrapper: .cmp_announcements.media > .media-list
   -------------------------------------------------------------------------- */

#main-content > section.cmp_announcements.media > .media-list,
section.cmp_announcements.media > .media-list,
.cmp_announcements .media-list {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)) !important;
  gap: 9px !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  align-items: stretch !important;
}

#main-content > section.cmp_announcements.media > .media-list > *,
section.cmp_announcements.media > .media-list > *,
.cmp_announcements .media-list > * {
  width: 100% !important;
  min-width: 0 !important;
  height: 100% !important;
  margin: 0 !important;
}

/* Announcement card */
.cmp_announcements .obj_announcement_summary,
.cmp_announcements .media-list > .media,
.cmp_announcements .media-list > article,
.cmp_announcements .media-list > div {
  box-sizing: border-box !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 12px 14px !important;
  border: 1px solid #e1e8f2 !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  box-shadow: 0 3px 10px rgba(47, 83, 162, 0.035) !important;
  transition: border-color .16s ease, box-shadow .16s ease, background-color .16s ease !important;
}

.cmp_announcements .obj_announcement_summary:hover,
.cmp_announcements .media-list > .media:hover,
.cmp_announcements .media-list > article:hover {
  border-color: var(--jieed-border) !important;
  background: #fbfdff !important;
  box-shadow: 0 6px 16px rgba(47, 83, 162, 0.065) !important;
}

.cmp_announcements .obj_announcement_summary .title,
.cmp_announcements .obj_announcement_summary h3,
.cmp_announcements .media-list .title {
  margin: 0 0 4px !important;
  padding: 0 !important;
  color: var(--jieed-primary) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.38 !important;
  letter-spacing: -0.004em !important;
}

.cmp_announcements .obj_announcement_summary .date {
  margin: 0 0 4px !important;
  padding: 2px 6px !important;
  border-radius: 999px !important;
  background: var(--jieed-soft) !important;
  color: var(--jieed-accent) !important;
  font-size: 10.5px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
}

.cmp_announcements .obj_announcement_summary p,
.cmp_announcements .obj_announcement_summary .summary {
  margin: 0 !important;
  color: #566173 !important;
  font-size: 12px !important;
  line-height: 1.48 !important;
}

/* --------------------------------------------------------------------------
   4. CURRENT ISSUE — COMPACT EDITORIAL BLOCK
   -------------------------------------------------------------------------- */

#main-content > section.current_issue,
section.current_issue,
.current_issue,
.obj_issue_toc {
  margin-top: 8px !important;
  margin-bottom: 12px !important;
}

.current_issue .current_issue_title,
.obj_issue_toc .heading {
  margin: 0 0 9px !important;
  padding: 10px 12px !important;
  border: 1px solid #dfe7f1 !important;
  border-radius: 8px !important;
  background: linear-gradient(135deg, #ffffff 0%, #f7fbff 100%) !important;
  box-shadow: 0 3px 10px rgba(47, 83, 162, 0.04) !important;
}

.obj_issue_toc .heading .title,
.current_issue .current_issue_title {
  margin: 0 0 3px !important;
  color: var(--jieed-primary) !important;
  font-size: 16.5px !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
}

.obj_issue_toc .heading .description,
.obj_issue_toc .heading .published,
.obj_issue_toc .heading .date_published,
.current_issue .published {
  margin: 0 !important;
  color: var(--jieed-muted) !important;
  font-size: 11.3px !important;
  line-height: 1.4 !important;
}

.obj_issue_toc .cover,
.current_issue .cover {
  margin: 0 0 8px !important;
}

.obj_issue_toc .cover img,
.current_issue .cover img {
  display: block !important;
  width: auto !important;
  max-width: 115px !important;
  max-height: 160px !important;
  margin: 0 !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 6px !important;
  background: #ffffff !important;
  box-shadow: 0 4px 12px rgba(47, 83, 162, 0.06) !important;
}

.obj_issue_toc .sections {
  margin-top: 8px !important;
}

.obj_issue_toc .section {
  margin: 0 0 12px !important;
}

.obj_issue_toc .section > h2,
.obj_issue_toc .section > h3,
.obj_issue_toc .section .section_title {
  margin: 0 0 7px !important;
  padding: 0 0 5px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--jieed-divider) !important;
  color: var(--jieed-primary) !important;
  font-size: 14.5px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
}

/* --------------------------------------------------------------------------
   5. ARTICLE LIST — FLEXIBLE RESPONSIVE PREMIUM GALLERY
   Uses auto-fit so it fills available space without empty columns.
   -------------------------------------------------------------------------- */

.obj_issue_toc .articles,
.obj_issue_toc ul.articles,
.current_issue .articles,
.current_issue ul.articles {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 330px), 1fr)) !important;
  gap: 9px !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  list-style: none !important;
  align-items: stretch !important;
}

/* Support both direct article cards and <li> wrappers */
.obj_issue_toc .articles > li,
.current_issue .articles > li,
.obj_issue_toc .articles > article,
.current_issue .articles > article,
.obj_issue_toc .articles > .obj_article_summary,
.current_issue .articles > .obj_article_summary {
  min-width: 0 !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  list-style: none !important;
}

/* If OJS wraps .obj_article_summary inside <li>, make li the visual card */
.obj_issue_toc .articles > li,
.current_issue .articles > li {
  box-sizing: border-box !important;
  padding: 0 !important;
  border: 1px solid #e1e8f2 !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  box-shadow: 0 3px 10px rgba(47, 83, 162, 0.035) !important;
  overflow: hidden !important;
}

/* Article summary visual layout */
.obj_issue_toc .obj_article_summary,
.current_issue .obj_article_summary {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 12px 13px !important;
  border: 1px solid #e1e8f2 !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  box-shadow: 0 3px 10px rgba(47, 83, 162, 0.035) !important;
  transition: border-color .16s ease, box-shadow .16s ease, background-color .16s ease !important;
}

/* Avoid double border if article lives inside an LI card */
.obj_issue_toc .articles > li > .obj_article_summary,
.current_issue .articles > li > .obj_article_summary {
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.obj_issue_toc .obj_article_summary:hover,
.current_issue .obj_article_summary:hover,
.obj_issue_toc .articles > li:hover,
.current_issue .articles > li:hover {
  border-color: var(--jieed-border) !important;
  background: #fbfdff !important;
  box-shadow: 0 6px 16px rgba(47, 83, 162, 0.065) !important;
}

.obj_issue_toc .obj_article_summary .title,
.current_issue .obj_article_summary .title {
  margin: 0 0 4px !important;
  padding: 0 !important;
  color: var(--jieed-primary) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.38 !important;
  letter-spacing: -0.006em !important;
}

.obj_issue_toc .obj_article_summary .authors,
.current_issue .obj_article_summary .authors {
  margin: 0 0 3px !important;
  color: #4f5b6d !important;
  font-size: 11.5px !important;
  line-height: 1.4 !important;
}

.obj_issue_toc .obj_article_summary .pages,
.obj_issue_toc .obj_article_summary .published,
.obj_issue_toc .obj_article_summary .meta,
.obj_issue_toc .obj_article_summary .doi,
.obj_issue_toc .obj_article_summary .stats,
.current_issue .obj_article_summary .pages,
.current_issue .obj_article_summary .published,
.current_issue .obj_article_summary .meta,
.current_issue .obj_article_summary .doi,
.current_issue .obj_article_summary .stats {
  margin-top: 2px !important;
  color: var(--jieed-muted) !important;
  font-size: 10.8px !important;
  line-height: 1.35 !important;
}

.obj_issue_toc .obj_article_summary .galleys,
.obj_issue_toc .obj_article_summary .galleys_links,
.current_issue .obj_article_summary .galleys,
.current_issue .obj_article_summary .galleys_links {
  margin-top: auto !important;
  padding-top: 7px !important;
}

.obj_issue_toc .obj_galley_link,
.current_issue .obj_galley_link,
.obj_issue_toc .galleys a,
.current_issue .galleys a {
  min-height: 25px !important;
  margin: 2px 4px 0 0 !important;
  padding: 4px 7px !important;
  border-radius: 5px !important;
  font-size: 9.5px !important;
  font-weight: 700 !important;
  line-height: 1.1 !important;
}

/* --------------------------------------------------------------------------
   6. ARCHIVE — RESPONSIVE FLEXIBLE GALLERY
   -------------------------------------------------------------------------- */

.page_issue_archive .issues_archive,
.page_issue_archive ul.issues_archive {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)) !important;
  gap: 9px !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.page_issue_archive .issues_archive > *,
.page_issue_archive ul.issues_archive > * {
  min-width: 0 !important;
  margin: 0 !important;
}

.page_issue_archive .obj_issue_summary {
  height: 100% !important;
  margin: 0 !important;
  padding: 12px 13px !important;
  border: 1px solid #e1e8f2 !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  box-shadow: 0 3px 10px rgba(47, 83, 162, 0.035) !important;
}

/* --------------------------------------------------------------------------
   7. ADDITIONAL CONTENT — COMPACT
   -------------------------------------------------------------------------- */

#main-content > section.additional_content,
section.additional_content,
.additional_content {
  margin-top: 8px !important;
  margin-bottom: 10px !important;
  padding-top: 0 !important;
}

/* --------------------------------------------------------------------------
   8. SIDEBAR — COMPACT & CONSISTENT
   -------------------------------------------------------------------------- */

.pkp_structure_sidebar .pkp_block,
.pkp_structure_sidebar .block_custom {
  margin-bottom: 9px !important;
  padding: 11px 12px !important;
  border-radius: 8px !important;
}

.pkp_structure_sidebar .pkp_block .title,
.pkp_structure_sidebar .pkp_block h2,
.pkp_structure_sidebar .pkp_block h3,
.pkp_structure_sidebar .block_custom h2,
.pkp_structure_sidebar .block_custom h3 {
  margin: 0 0 7px !important;
  padding: 0 0 5px !important;
}

.pkp_structure_sidebar li {
  padding: 4px 0 !important;
}

/* --------------------------------------------------------------------------
   9. RESPONSIVE FINE-TUNING
   -------------------------------------------------------------------------- */

@media (max-width: 900px) {
  #main-content > section.cmp_announcements.media > .media-list,
  section.cmp_announcements.media > .media-list,
  .cmp_announcements .media-list,
  .obj_issue_toc .articles,
  .obj_issue_toc ul.articles,
  .current_issue .articles,
  .current_issue ul.articles,
  .page_issue_archive .issues_archive,
  .page_issue_archive ul.issues_archive {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 768px) {
  #main-content.page_index_journal > *,
  .page_index_journal > * {
    margin-bottom: 9px !important;
  }

  .obj_issue_toc .obj_article_summary,
  .current_issue .obj_article_summary,
  .cmp_announcements .obj_announcement_summary {
    padding: 11px 12px !important;
  }
}


/* ==========================================================================
   JIEEd NAVIGATION — BOLD TYPOGRAPHY REFINEMENT
   ========================================================================== */

.pkp_navigation_primary > li > a,
#navigationPrimary > li > a,
.navbar-nav > li > a,
#headerNavigationContainer.navbar.navbar-default .navbar-nav > li > a {
  font-weight: 700 !important;
  letter-spacing: .005em !important;
}

/* Submenu typography */
.pkp_navigation_primary li ul a,
.pkp_navigation_primary .dropdown-menu a,
.pkp_nav_list li ul a,
.pkp_nav_list .dropdown-menu a,
#navigationPrimary li ul a,
#navigationPrimary .dropdown-menu a,
.navbar-nav .dropdown-menu a,
#headerNavigationContainer .navbar-nav .dropdown-menu a {
  font-weight: 700 !important;
}

/* Active/open state can be slightly stronger */
.pkp_navigation_primary > li.active > a,
.pkp_navigation_primary > li.current > a,
.pkp_navigation_primary > li.open > a,
.pkp_navigation_primary > li.show > a,
#navigationPrimary > li.active > a,
#navigationPrimary > li.current > a,
#navigationPrimary > li.open > a,
#navigationPrimary > li.show > a,
.navbar-nav > li.active > a,
.navbar-nav > li.current > a,
.navbar-nav > li.open > a,
.navbar-nav > li.show > a {
  font-weight: 800 !important;
}


/* ==========================================================================
   JIEEd — VERIFIED OJS ARTICLE GALLERY FIX
   Exact OJS structure:
   .obj_issue_toc .sections .section > ul.cmp_article_list.articles > li
   ========================================================================== */

/* --------------------------------------------------------------------------
   CURRENT ISSUE HEADING: COMPACT COVER + DESCRIPTION
   -------------------------------------------------------------------------- */

.page_index_journal .current_issue .obj_issue_toc .heading,
.current_issue .obj_issue_toc .heading,
.obj_issue_toc .heading {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: flex-start !important;
  gap: 12px !important;
  width: 100% !important;
  margin: 0 0 10px !important;
  padding: 11px 12px !important;
  border: 1px solid #dfe7f1 !important;
  border-radius: 8px !important;
  background: linear-gradient(135deg, #ffffff 0%, #f7fbff 100%) !important;
  box-shadow: 0 3px 10px rgba(47, 83, 162, 0.04) !important;
}

/* Stop Bootstrap/OJS from making cover column huge */
.page_index_journal .current_issue .obj_issue_toc .heading .cover,
.current_issue .obj_issue_toc .heading .cover,
.obj_issue_toc .heading .cover {
  display: block !important;
  flex: 0 0 112px !important;
  width: 112px !important;
  max-width: 112px !important;
  min-width: 112px !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  float: none !important;
}

/* Compact cover */
.page_index_journal .current_issue .obj_issue_toc .heading .cover img,
.current_issue .obj_issue_toc .heading .cover img,
.obj_issue_toc .heading .cover img {
  display: block !important;
  width: 108px !important;
  max-width: 108px !important;
  height: auto !important;
  max-height: 155px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid #dfe6ef !important;
  border-radius: 6px !important;
  background: #ffffff !important;
  box-shadow: 0 4px 12px rgba(47, 83, 162, 0.07) !important;
  object-fit: contain !important;
}

/* Description fills remaining width */
.page_index_journal .current_issue .obj_issue_toc .heading .description,
.current_issue .obj_issue_toc .heading .description,
.obj_issue_toc .heading .description {
  flex: 1 1 520px !important;
  min-width: 0 !important;
  width: auto !important;
  margin: 0 !important;
  padding: 1px 0 !important;
  color: var(--jieed-text) !important;
  font-size: 12.2px !important;
  line-height: 1.5 !important;
}

/* Published meta stays compact */
.page_index_journal .current_issue .obj_issue_toc .heading .published,
.current_issue .obj_issue_toc .heading .published,
.obj_issue_toc .heading .published {
  flex: 1 1 100% !important;
  margin: -2px 0 0 124px !important;
  padding: 0 !important;
  color: var(--jieed-muted) !important;
  font-size: 10.8px !important;
  line-height: 1.35 !important;
}

/* --------------------------------------------------------------------------
   SECTION TITLE "ARTICLES"
   -------------------------------------------------------------------------- */

.page_index_journal .current_issue .obj_issue_toc .sections .section > h2,
.page_index_journal .current_issue .obj_issue_toc .sections .section > h3,
.current_issue .obj_issue_toc .sections .section > h2,
.current_issue .obj_issue_toc .sections .section > h3,
.obj_issue_toc .sections .section > h2,
.obj_issue_toc .sections .section > h3 {
  margin: 8px 0 8px !important;
  padding: 0 0 5px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--jieed-divider) !important;
  color: var(--jieed-primary) !important;
  font-size: 14.5px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
}

/* --------------------------------------------------------------------------
   REAL OJS ARTICLE LIST: FORCE GRID
   -------------------------------------------------------------------------- */

.page_index_journal .current_issue .obj_issue_toc .sections .section > ul.cmp_article_list.articles,
.current_issue .obj_issue_toc .sections .section > ul.cmp_article_list.articles,
.obj_issue_toc .sections .section > ul.cmp_article_list.articles,
ul.cmp_article_list.articles {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  grid-auto-flow: row !important;
  grid-auto-rows: 1fr !important;
  gap: 10px !important;
  align-items: stretch !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  list-style: none !important;
  float: none !important;
  clear: both !important;
}

/* Each article becomes a proper gallery item */
.page_index_journal .current_issue .obj_issue_toc ul.cmp_article_list.articles > li,
.current_issue .obj_issue_toc ul.cmp_article_list.articles > li,
.obj_issue_toc ul.cmp_article_list.articles > li,
ul.cmp_article_list.articles > li {
  display: block !important;
  position: relative !important;
  float: none !important;
  clear: none !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid #e0e8f2 !important;
  border-radius: 9px !important;
  background: #ffffff !important;
  box-shadow: 0 3px 10px rgba(47, 83, 162, 0.035) !important;
  list-style: none !important;
  overflow: hidden !important;
  vertical-align: top !important;
  transition: border-color .16s ease, box-shadow .16s ease, background-color .16s ease !important;
}

.page_index_journal .current_issue .obj_issue_toc ul.cmp_article_list.articles > li:hover,
.current_issue .obj_issue_toc ul.cmp_article_list.articles > li:hover,
.obj_issue_toc ul.cmp_article_list.articles > li:hover,
ul.cmp_article_list.articles > li:hover {
  border-color: var(--jieed-border) !important;
  background: #fbfdff !important;
  box-shadow: 0 7px 18px rgba(47, 83, 162, 0.065) !important;
}

/* Article summary fills the gallery card */
.page_index_journal .current_issue .obj_issue_toc ul.cmp_article_list.articles > li > .obj_article_summary,
.current_issue .obj_issue_toc ul.cmp_article_list.articles > li > .obj_article_summary,
.obj_issue_toc ul.cmp_article_list.articles > li > .obj_article_summary,
ul.cmp_article_list.articles > li > .obj_article_summary {
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  min-height: 100% !important;
  margin: 0 !important;
  padding: 13px 14px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  float: none !important;
}

/* Premium left accent without consuming visual space */
ul.cmp_article_list.articles > li::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 3px !important;
  height: 100% !important;
  background: rgba(47, 83, 162, 0.38) !important;
}

/* Article title */
ul.cmp_article_list.articles > li .obj_article_summary .title {
  margin: 0 0 6px !important;
  padding: 0 !important;
  color: var(--jieed-primary) !important;
  font-size: 14.2px !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
  letter-spacing: -0.006em !important;
}

ul.cmp_article_list.articles > li .obj_article_summary .title a {
  color: var(--jieed-primary) !important;
  text-decoration: none !important;
}

ul.cmp_article_list.articles > li .obj_article_summary .title a:hover,
ul.cmp_article_list.articles > li .obj_article_summary .title a:focus {
  color: var(--jieed-dark) !important;
}

/* Authors */
ul.cmp_article_list.articles > li .obj_article_summary .authors {
  margin: 0 0 4px !important;
  padding: 0 !important;
  color: #505c6d !important;
  font-size: 11.5px !important;
  line-height: 1.42 !important;
}

/* Pages and publication metadata */
ul.cmp_article_list.articles > li .obj_article_summary .pages,
ul.cmp_article_list.articles > li .obj_article_summary .published,
ul.cmp_article_list.articles > li .obj_article_summary .meta,
ul.cmp_article_list.articles > li .obj_article_summary .doi,
ul.cmp_article_list.articles > li .obj_article_summary .stats {
  margin: 2px 0 0 !important;
  padding: 0 !important;
  color: var(--jieed-muted) !important;
  font-size: 10.7px !important;
  line-height: 1.35 !important;
}

/* Keep galley button at bottom for aligned cards */
ul.cmp_article_list.articles > li .obj_article_summary .galleys,
ul.cmp_article_list.articles > li .obj_article_summary .galleys_links {
  margin-top: auto !important;
  padding-top: 7px !important;
}

/* PDF */
ul.cmp_article_list.articles > li .obj_galley_link,
ul.cmp_article_list.articles > li .galleys_links a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 42px !important;
  min-height: 25px !important;
  margin: 2px 4px 0 0 !important;
  padding: 4px 7px !important;
  border: 1px solid var(--jieed-primary) !important;
  border-radius: 5px !important;
  background: var(--jieed-primary) !important;
  color: #ffffff !important;
  font-size: 9.5px !important;
  font-weight: 700 !important;
  line-height: 1.1 !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
}

/* --------------------------------------------------------------------------
   RESPONSIVE: ONE COLUMN ON TABLET / MOBILE
   -------------------------------------------------------------------------- */

@media (max-width: 999px) {
  .page_index_journal .current_issue .obj_issue_toc .sections .section > ul.cmp_article_list.articles,
  .current_issue .obj_issue_toc .sections .section > ul.cmp_article_list.articles,
  .obj_issue_toc .sections .section > ul.cmp_article_list.articles,
  ul.cmp_article_list.articles {
    grid-template-columns: 1fr !important;
    grid-auto-rows: auto !important;
  }
}

@media (max-width: 700px) {
  .page_index_journal .current_issue .obj_issue_toc .heading,
  .current_issue .obj_issue_toc .heading,
  .obj_issue_toc .heading {
    display: block !important;
  }

  .page_index_journal .current_issue .obj_issue_toc .heading .cover,
  .current_issue .obj_issue_toc .heading .cover,
  .obj_issue_toc .heading .cover {
    width: 92px !important;
    min-width: 92px !important;
    max-width: 92px !important;
    margin: 0 0 8px !important;
  }

  .page_index_journal .current_issue .obj_issue_toc .heading .cover img,
  .current_issue .obj_issue_toc .heading .cover img,
  .obj_issue_toc .heading .cover img {
    width: 88px !important;
    max-width: 88px !important;
    max-height: 128px !important;
  }

  .page_index_journal .current_issue .obj_issue_toc .heading .published,
  .current_issue .obj_issue_toc .heading .published,
  .obj_issue_toc .heading .published {
    margin: 5px 0 0 !important;
  }
}

/* ==========================================================================
   20. HOMEPAGE ONLY — HIDE OJS-AUTOMATIC CURRENT ISSUE THUMBNAIL
   Keep custom issue cover in homepage HTML and issue-page covers visible.
   This rule hides the native Bootstrap .thumbnail.col-md-4 wrapper,
   not merely its <img>, avoiding an empty column and duplicate cover.
   ========================================================================== */

#main-content.page_index_journal .current_issue .thumbnail.col-md-4,
.page_index_journal .current_issue .thumbnail.col-md-4,
body.pkp_page_index.pkp_op_index .current_issue .thumbnail.col-md-4 {
  display: none !important;
}

/* Let the native issue text reclaim the width when it directly follows
   the hidden Bootstrap thumbnail in the same row. */
#main-content.page_index_journal .current_issue .thumbnail.col-md-4 ~ .col-md-8,
.page_index_journal .current_issue .thumbnail.col-md-4 ~ .col-md-8,
body.pkp_page_index.pkp_op_index .current_issue .thumbnail.col-md-4 ~ .col-md-8 {
  width: 100% !important;
  max-width: 100% !important;
  flex: 0 0 100% !important;
  float: none !important;
  margin-left: 0 !important;
}


/* ==========================================================================
   JIEEd — FINAL PREMIUM NAVIGATION TYPOGRAPHY
   Slightly larger, crisp and balanced navigation text on all screens.
   These final overrides deliberately preserve the established color,
   hover/focus styles, dropdown logic, and responsive layout.
   ========================================================================== */

/* Main journal navigation */
.pkp_navigation_primary > li > a,
#navigationPrimary > li > a,
.navbar-nav > li > a,
#headerNavigationContainer.navbar.navbar-default .navbar-nav > li > a {
  font-size: 13.5px !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
  letter-spacing: .005em !important;
}

/* Dropdown navigation and nested submenu links */
.pkp_navigation_primary li ul a,
.pkp_navigation_primary .dropdown-menu a,
.pkp_nav_list li ul a,
.pkp_nav_list .dropdown-menu a,
#navigationPrimary li ul a,
#navigationPrimary .dropdown-menu a,
.navbar-nav .dropdown-menu a,
#headerNavigationContainer .navbar-nav .dropdown-menu a {
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1.45 !important;
}

/* Profile / sign-in area */
.pkp_navigation_user > li > a,
#navigationUser > li > a {
  font-size: 13px !important;
}

/* Controlled spacing on medium laptop/tablet displays */
@media (min-width: 769px) and (max-width: 1100px) {
  .pkp_navigation_primary > li > a,
  #navigationPrimary > li > a,
  .navbar-nav > li > a,
  #headerNavigationContainer.navbar.navbar-default .navbar-nav > li > a {
    font-size: 13px !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
}

/* Clear, comfortable type within mobile menu */
@media (max-width: 768px) {
  .pkp_navigation_primary > li > a,
  #navigationPrimary > li > a,
  .navbar-nav > li > a,
  #headerNavigationContainer.navbar.navbar-default .navbar-nav > li > a {
    font-size: 13.5px !important;
  }
}

/* ==========================================================================
   JIEEd — PREMIUM ARTICLES HEADER & BOOTSTRAP ARTICLE SUMMARY
   OJS 3 structure: .page-header > h2 > small (Articles)
                    .article-summary.media > .media-body + .doiInSummary
   Scoped to avoid changing announcements and existing .obj_article_summary cards.
   ========================================================================== */

/* Compact section heading and the space before the first article. */
#main-content div.page-header,
.pkp_structure_main div.page-header {
  margin-top: 10px !important;
  margin-bottom: 10px !important;
  padding: 0 0 7px !important;
  border: 0 !important;
  border-bottom: 1px solid #dfe8f4 !important;
  background: transparent !important;
  box-shadow: none !important;
}

#main-content div.page-header > h2,
.pkp_structure_main div.page-header > h2 {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  color: var(--jieed-primary, #2f53a2) !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  letter-spacing: -0.012em !important;
}

#main-content div.page-header > h2 > small,
.pkp_structure_main div.page-header > h2 > small {
  display: inline !important;
  color: var(--jieed-primary, #2f53a2) !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  letter-spacing: -0.012em !important;
}

#main-content div.page-header + .media-list,
#main-content div.page-header + .article-summary.media,
.pkp_structure_main div.page-header + .media-list,
.pkp_structure_main div.page-header + .article-summary.media {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* Article as a light, refined editorial card. */
.article-summary.media {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 0 11px !important;
  padding: 17px 19px !important;
  border: 1px solid #e0e8f3 !important;
  border-left: 1px solid #e0e8f3 !important;
  border-radius: 10px !important;
  background: #ffffff !important;
  box-shadow: 0 3px 12px rgba(35, 61, 117, 0.045) !important;
  color: var(--jieed-text, #2f3747) !important;
  font-size: 12.5px !important;
  line-height: 1.55 !important;
  transition: border-color .18s ease, box-shadow .18s ease, background-color .18s ease !important;
}

.article-summary.media:hover {
  border-color: #c6d7ed !important;
  border-left-color: #c6d7ed !important;
  background: #fcfdff !important;
  box-shadow: 0 7px 20px rgba(35, 61, 117, 0.075) !important;
}

.article-summary.media + .article-summary.media {
  margin-top: 0 !important;
}

.article-summary.media .media-body {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  overflow: visible !important;
  color: #69768b !important;
  font-size: 12.5px !important;
  line-height: 1.65 !important;
}

/* Strong article title with balanced visual hierarchy. */
.article-summary.media h3.media-heading {
  margin: 0 0 10px !important;
  padding: 0 !important;
  border: 0 !important;
  color: var(--jieed-primary, #2f53a2) !important;
  font-size: 17px !important;
  font-weight: 700 !important;
  line-height: 1.43 !important;
  letter-spacing: -0.008em !important;
  text-transform: none !important;
}

.article-summary.media h3.media-heading a {
  color: var(--jieed-primary, #2f53a2) !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  line-height: inherit !important;
  text-decoration: none !important;
  overflow-wrap: anywhere !important;
}

.article-summary.media h3.media-heading a:hover,
.article-summary.media h3.media-heading a:focus {
  color: var(--jieed-dark, #223c89) !important;
  text-decoration: underline !important;
  text-decoration-thickness: 1px !important;
  text-underline-offset: 3px !important;
}

/* Author list: calm panel, clear emphasis on author names. */
.article-summary.media .meta {
  margin: 0 0 9px !important;
  padding: 9px 12px !important;
  border: 1px solid #eaf0f7 !important;
  border-radius: 7px !important;
  background: #f8fbff !important;
}

.article-summary.media .meta .authors {
  margin: 0 !important;
  padding: 0 !important;
  color: #5e6c81 !important;
  font-size: 12.5px !important;
  font-weight: 400 !important;
  line-height: 1.65 !important;
}

.article-summary.media .meta .authors b,
.article-summary.media .meta .authors strong {
  color: #304461 !important;
  font-weight: 700 !important;
}

.article-summary.media .meta .authors br:last-child {
  display: none !important;
}

/* Number of pages styled as understated metadata. */
.article-summary.media p.pages {
  display: inline-block !important;
  width: auto !important;
  margin: 0 0 9px !important;
  padding: 3px 9px !important;
  border: 1px solid #e3ebf5 !important;
  border-radius: 5px !important;
  background: #f2f6fc !important;
  color: #5a6b85 !important;
  font-size: 12px !important;
  line-height: 1.45 !important;
}

/* PDF link retains the established navy/blue color system. */
.article-summary.media .btn-group {
  display: inline-flex !important;
  align-items: center !important;
  float: none !important;
  margin: 0 0 8px 10px !important;
  padding: 0 !important;
  vertical-align: middle !important;
}

.article-summary.media a.galley-link.btn.btn-primary.pdf,
.article-summary.media a.galley-link.btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 54px !important;
  min-height: 29px !important;
  padding: 6px 12px !important;
  border: 1px solid var(--jieed-primary, #2f53a2) !important;
  border-radius: 6px !important;
  background: var(--jieed-primary, #2f53a2) !important;
  box-shadow: 0 2px 7px rgba(47, 83, 162, 0.12) !important;
  color: #ffffff !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  letter-spacing: 0.025em !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
  transition: background-color .18s ease, box-shadow .18s ease !important;
}

.article-summary.media a.galley-link.btn:hover,
.article-summary.media a.galley-link.btn:focus {
  border-color: var(--jieed-dark, #223c89) !important;
  background: var(--jieed-dark, #223c89) !important;
  color: #ffffff !important;
  box-shadow: 0 4px 12px rgba(34, 60, 137, 0.16) !important;
}

/* OJS outputs view/download counts as bare text around Glyphicon icons. */
.article-summary.media .glyphicon {
  margin: 0 4px 0 12px !important;
  color: var(--jieed-primary, #2f53a2) !important;
  font-size: 12px !important;
  vertical-align: baseline !important;
}

.article-summary.media .glyphicon-signal {
  margin-left: 0 !important;
}

/* DOI as a neat, readable footer, even when OJS repositions the node. */
.article-summary.media .doiInSummary {
  display: block !important;
  margin: 10px 0 0 !important;
  padding: 9px 0 0 !important;
  border-top: 1px solid #e9eff7 !important;
  background: transparent !important;
  color: #5e6d83 !important;
  font-size: 12px !important;
  line-height: 1.55 !important;
  overflow-wrap: anywhere !important;
}

.article-summary.media .doiInSummary strong {
  margin-right: 4px !important;
  color: #465975 !important;
  font-weight: 700 !important;
}

.article-summary.media .doiInSummary a {
  color: var(--jieed-link, #304db2) !important;
  font-size: inherit !important;
  text-decoration: none !important;
  overflow-wrap: anywhere !important;
}

.article-summary.media .doiInSummary a:hover,
.article-summary.media .doiInSummary a:focus {
  color: var(--jieed-dark, #223c89) !important;
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
}

/* Proper spacing and tap targets on smaller screens. */
@media (max-width: 768px) {
  #main-content div.page-header,
  .pkp_structure_main div.page-header {
    margin-top: 8px !important;
    margin-bottom: 8px !important;
    padding-bottom: 6px !important;
  }

  #main-content div.page-header > h2 > small,
  .pkp_structure_main div.page-header > h2 > small {
    font-size: 19px !important;
  }

  .article-summary.media {
    padding: 14px 15px !important;
    margin-bottom: 9px !important;
  }

  .article-summary.media h3.media-heading {
    font-size: 16px !important;
  }

  .article-summary.media .meta {
    padding: 8px 10px !important;
  }

  .article-summary.media .btn-group {
    margin-left: 8px !important;
  }
}


/* ==========================================================================
   JIEEd — COMPACT PREMIUM FOOTER (BOOTSTRAP OJS 3)
   Scope: <footer class="footer" role="contentinfo">.
   Keeps the Statcounter widget/link; follows the existing stylesheet's choice
   to hide the optional OJS/PKP brand graphic without creating tall whitespace.
   ========================================================================== */

footer.footer[role="contentinfo"] {
  min-height: 0 !important;
  margin: 17px 0 0 !important;
  padding: 11px 0 !important;
  border-top: 1px solid rgba(216, 228, 244, .30) !important;
  box-shadow: none !important;
  line-height: 1.35 !important;
}

footer.footer[role="contentinfo"] > .container {
  width: min(1440px, calc(100% - 48px)) !important;
  max-width: 1440px !important;
  min-height: 0 !important;
  margin: 0 auto !important;
  padding: 0 !important;
}

footer.footer[role="contentinfo"] > .container > .row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 5px 14px !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

footer.footer[role="contentinfo"] > .container > .row > .col-md-10,
footer.footer[role="contentinfo"] > .container > .row > .col-md-2 {
  position: static !important;
  float: none !important;
  width: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

footer.footer[role="contentinfo"] > .container > .row > .col-md-10 {
  flex: 1 1 250px !important;
  min-width: 0 !important;
}

footer.footer[role="contentinfo"] > .container > .row > .col-md-2[role="complementary"] {
  flex: 0 0 auto !important;
}

footer.footer[role="contentinfo"] p,
footer.footer[role="contentinfo"] .col-md-10 p {
  margin: 0 !important;
  padding: 0 !important;
  font-size: 11.5px !important;
  font-weight: 500 !important;
  line-height: 1.45 !important;
}

footer.footer[role="contentinfo"] a {
  font-size: 11.5px !important;
  line-height: 1.45 !important;
  text-decoration: none !important;
  text-underline-offset: 3px !important;
}

footer.footer[role="contentinfo"] a:hover,
footer.footer[role="contentinfo"] a:focus-visible {
  text-decoration: underline !important;
}

/* Limit any visible Statcounter graphic without disabling its analytics. */
footer.footer[role="contentinfo"] .statcounter,
footer.footer[role="contentinfo"] a .statcounter {
  max-width: 100% !important;
  vertical-align: middle !important;
}

footer.footer[role="contentinfo"] img.statcounter {
  width: auto !important;
  max-height: 22px !important;
}

/* If the brand graphic is enabled later, keep it discreet. Existing logo-
   hiding rules elsewhere in this CSS still take precedence where applicable. */
footer.footer[role="contentinfo"] .col-md-2 img.img-responsive {
  width: auto !important;
  max-width: 76px !important;
  max-height: 22px !important;
  object-fit: contain !important;
}

@media (max-width: 768px) {
  footer.footer[role="contentinfo"] {
    margin-top: 13px !important;
    padding: 9px 0 !important;
  }

  footer.footer[role="contentinfo"] > .container {
    width: calc(100% - 24px) !important;
  }

  footer.footer[role="contentinfo"] > .container > .row {
    align-items: flex-start !important;
    gap: 5px 10px !important;
  }

  footer.footer[role="contentinfo"] > .container > .row > .col-md-10 {
    flex-basis: 100% !important;
  }
}

/* ===========================================================================
   JIEEd 2026 — PREMIUM ARTICLE DETAILS + COMPACT CURRENT ISSUE HEADING
   Final, deliberately scoped overrides for OJS 3/Bootstrap article summaries.
   Keeps navigation, Statcounter, footer and existing issue gallery functional.
   =========================================================================== */

/* 1. The actual OJS <header> element, not just older <div> page headers.
   Compact specifically the Current Issue heading; do not revive the hidden
   announcements heading or alter page title hierarchies elsewhere. */
#main-content > section.current_issue > header.page-header,
#main-content section.current_issue > header.page-header,
section.current_issue > header.page-header,
.current_issue > header.page-header {
  margin: 2px 0 7px !important;
  padding: 0 0 6px !important;
  min-height: 0 !important;
  border: 0 !important;
  border-bottom: 1px solid #dce7f5 !important;
  background: transparent !important;
  box-shadow: none !important;
}

#main-content > section.current_issue > header.page-header > h2,
#main-content section.current_issue > header.page-header > h2,
section.current_issue > header.page-header > h2,
.current_issue > header.page-header > h2 {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  color: #264a91 !important;
  font-size: 17px !important;
  font-weight: 700 !important;
  letter-spacing: -.012em !important;
  line-height: 1.25 !important;
}

/* Remove extra spacing before current issue content. */
section.current_issue > header.page-header + *,
.current_issue > header.page-header + * {
  margin-top: 0 !important;
}

/* 2. Full-width Bootstrap article cards; editorial blue/cyan palette. */
.article-summary.media {
  margin: 0 0 10px !important;
  padding: 16px 18px !important;
  border: 1px solid #dce7f4 !important;
  border-left: 1px solid #dce7f4 !important;
  border-radius: 10px !important;
  background: linear-gradient(115deg, #fff 0%, #fff 83%, #f8fbff 100%) !important;
  box-shadow: 0 4px 16px rgba(38, 74, 145, .055) !important;
  transition: background .2s ease, border-color .2s ease, box-shadow .2s ease !important;
}

.article-summary.media:hover,
.article-summary.media:focus-within {
  border-color: #aac5e9 !important;
  border-left-color: #aac5e9 !important;
  background: #fbfdff !important;
  box-shadow: 0 8px 24px rgba(38, 74, 145, .10) !important;
}

.article-summary.media .media-body {
  color: #50657e !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  line-height: 1.65 !important;
}

/* Title has priority in the visual hierarchy. */
.article-summary.media h3.media-heading {
  margin: 0 0 10px !important;
  padding: 0 0 1px !important;
  border: 0 !important;
  color: #203f82 !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  line-height: 1.42 !important;
  letter-spacing: -.016em !important;
}

.article-summary.media h3.media-heading a {
  color: #203f82 !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  text-decoration: none !important;
  text-underline-offset: 3px !important;
}
.article-summary.media h3.media-heading a:hover,
.article-summary.media h3.media-heading a:focus-visible {
  color: #116c94 !important;
  text-decoration: underline !important;
  text-decoration-thickness: 1px !important;
}

/* Author names stand out while affiliations remain quiet and readable.
   The existing HTML uses <br> per author; preserve that semantic structure. */
.article-summary.media .meta {
  margin: 0 0 9px !important;
  padding: 9px 12px !important;
  border: 1px solid #e0edf8 !important;
  border-left: 1px solid #e0edf8 !important;
  border-radius: 7px !important;
  background: linear-gradient(100deg, #f2f8ff, #fbfdff) !important;
}
.article-summary.media .meta .authors {
  margin: 0 !important;
  padding: 0 !important;
  color: #596e83 !important;
  font-size: 12.6px !important;
  font-weight: 400 !important;
  line-height: 1.72 !important;
}
.article-summary.media .meta .authors b,
.article-summary.media .meta .authors strong {
  color: #274b87 !important;
  font-weight: 700 !important;
}
.article-summary.media .meta .authors br:last-child {
  display: none !important;
}

/* Short page-range badge. Text content comes from OJS. */
.article-summary.media p.pages {
  display: inline-block !important;
  width: auto !important;
  margin: 0 0 8px !important;
  padding: 4px 9px !important;
  border: 1px solid #d9e6f6 !important;
  border-radius: 6px !important;
  background: #edf4fd !important;
  color: #315886 !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  letter-spacing: .005em !important;
}

/* Premium PDF action with a restrained gradient and download glyph. */
.article-summary.media .btn-group {
  display: inline-flex !important;
  align-items: center !important;
  margin: 0 0 8px 8px !important;
  float: none !important;
  vertical-align: middle !important;
}
.article-summary.media a.galley-link.btn,
.article-summary.media a.galley-link.btn.btn-primary.pdf {
  display: inline-flex !important;
  justify-content: center !important;
  align-items: center !important;
  min-width: 66px !important;
  min-height: 29px !important;
  padding: 6px 12px !important;
  border: 1px solid #274d98 !important;
  border-radius: 6px !important;
  background: linear-gradient(135deg, #3565b9 0%, #234789 100%) !important;
  box-shadow: 0 3px 9px rgba(35, 71, 137, .17) !important;
  color: #fff !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  letter-spacing: .035em !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
}
.article-summary.media a.galley-link.btn.pdf::before {
  content: "\2193" !important;
  display: inline-block !important;
  margin-right: 6px !important;
  color: #e6f1ff !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}
.article-summary.media a.galley-link.btn:hover,
.article-summary.media a.galley-link.btn:focus-visible {
  border-color: #19386f !important;
  background: linear-gradient(135deg, #264e98, #17356c) !important;
  box-shadow: 0 5px 12px rgba(35, 71, 137, .23) !important;
  color: #fff !important;
}

/* OJS renders the view/download counts as text, not as separate spans.
   Style the common text on .media-body and each distinct statistics icon. */
.article-summary.media .glyphicon {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 23px !important;
  height: 23px !important;
  margin: 3px 5px 3px 11px !important;
  border: 1px solid #d9ebf2 !important;
  border-radius: 6px !important;
  background: #edf9fc !important;
  color: #097f98 !important;
  font-size: 11px !important;
  line-height: 1 !important;
  vertical-align: middle !important;
}
.article-summary.media .glyphicon-signal {
  margin-left: 0 !important;
}
.article-summary.media .glyphicon-download-alt {
  border-color: #e0e3f8 !important;
  background: #f1f2ff !important;
  color: #5a55a6 !important;
}

/* DOI is legible whether OJS moves it below the title or leaves it below
   the article body. Long DOI URLs can break naturally on small screens. */
.article-summary.media .doiInSummary,
.article-summary.media .doi {
  display: block !important;
  width: fit-content !important;
  max-width: 100% !important;
  margin: 7px 0 11px !important;
  padding: 7px 10px !important;
  border: 1px solid #d9eaf0 !important;
  border-left: 1px solid #d9eaf0 !important;
  border-radius: 6px !important;
  background: #f2fafc !important;
  color: #36596d !important;
  font-size: 12px !important;
  line-height: 1.5 !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
}
.article-summary.media .doiInSummary strong,
.article-summary.media .doi strong {
  margin-right: 5px !important;
  color: #176d84 !important;
  font-weight: 700 !important;
}
.article-summary.media .doiInSummary a,
.article-summary.media .doi a {
  color: #176993 !important;
  font-size: inherit !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  overflow-wrap: anywhere !important;
}
.article-summary.media .doiInSummary a:hover,
.article-summary.media .doiInSummary a:focus-visible,
.article-summary.media .doi a:hover,
.article-summary.media .doi a:focus-visible {
  color: #204587 !important;
  text-decoration: underline !important;
}

/* 3. Existing native OJS issue gallery: upgrade presentation, not layout.
   The earlier 2-column cards remain exactly as configured. */
ul.cmp_article_list.articles > li {
  border-color: #dce7f4 !important;
  background: linear-gradient(125deg, #ffffff 0%, #fbfdff 100%) !important;
}
ul.cmp_article_list.articles > li::before {
  width: 4px !important;
  background: linear-gradient(180deg, #315aab 0%, #63accb 100%) !important;
}
ul.cmp_article_list.articles > li .obj_article_summary .title {
  color: #244686 !important;
  font-size: 15.2px !important;
  font-weight: 700 !important;
  line-height: 1.38 !important;
}
ul.cmp_article_list.articles > li .obj_article_summary .title a {
  color: #244686 !important;
}
ul.cmp_article_list.articles > li .obj_article_summary .title a:hover,
ul.cmp_article_list.articles > li .obj_article_summary .title a:focus-visible {
  color: #116c94 !important;
}
ul.cmp_article_list.articles > li .obj_article_summary .authors {
  color: #586c83 !important;
  font-size: 12px !important;
  line-height: 1.52 !important;
}
ul.cmp_article_list.articles > li .obj_article_summary .authors b,
ul.cmp_article_list.articles > li .obj_article_summary .authors strong {
  color: #294e8d !important;
  font-weight: 700 !important;
}
ul.cmp_article_list.articles > li .obj_article_summary .pages,
ul.cmp_article_list.articles > li .obj_article_summary .published,
ul.cmp_article_list.articles > li .obj_article_summary .meta,
ul.cmp_article_list.articles > li .obj_article_summary .doi,
ul.cmp_article_list.articles > li .obj_article_summary .stats {
  color: #536d89 !important;
  font-size: 11.2px !important;
  line-height: 1.45 !important;
}
ul.cmp_article_list.articles > li .obj_galley_link,
ul.cmp_article_list.articles > li .galleys_links a {
  min-height: 27px !important;
  padding: 5px 10px !important;
  border: 1px solid #3158a6 !important;
  border-radius: 6px !important;
  background: linear-gradient(135deg, #3565b9, #234789) !important;
  box-shadow: 0 2px 8px rgba(35, 71, 137, .13) !important;
  color: #fff !important;
  font-size: 10.5px !important;
  letter-spacing: .025em !important;
}
ul.cmp_article_list.articles > li .obj_galley_link:hover,
ul.cmp_article_list.articles > li .galleys_links a:hover {
  border-color: #19386f !important;
  background: #19386f !important;
}

/* 4. Narrow screens: compact, readable, never force horizontal scrolling. */
@media (max-width: 768px) {
  #main-content > section.current_issue > header.page-header,
  section.current_issue > header.page-header,
  .current_issue > header.page-header {
    margin: 1px 0 6px !important;
    padding-bottom: 5px !important;
  }
  #main-content > section.current_issue > header.page-header > h2,
  section.current_issue > header.page-header > h2,
  .current_issue > header.page-header > h2 {
    font-size: 16px !important;
  }
  .article-summary.media {
    padding: 13px 14px !important;
    margin-bottom: 9px !important;
  }
  .article-summary.media h3.media-heading {
    font-size: 16.5px !important;
  }
  .article-summary.media .meta {
    padding: 8px 10px !important;
  }
  .article-summary.media .meta .authors {
    font-size: 12.3px !important;
  }
  .article-summary.media .doiInSummary,
  .article-summary.media .doi {
    width: 100% !important;
  }
  .article-summary.media .glyphicon {
    margin-right: 4px !important;
    margin-left: 6px !important;
  }
  .article-summary.media .glyphicon-signal {
    margin-left: 0 !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .article-summary.media,
  .article-summary.media a.galley-link.btn {
    transition: none !important;
  }
}

/* ============================================================================
   JIEEd 2026 | PREMIUM ISSUE ARCHIVE CARDS
   Scope: OJS 3 Bootstrap markup .issue-summary.media
   Keeps the existing editorial palette, navigation and Current Issue intact.
   ============================================================================ */

/* Give archive entries enough horizontal room for long geographic and
   institutional descriptions; prevent narrow two-column cards. */
.page_issue_archive .issues_archive,
.page_issue_archive ul.issues_archive {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 520px), 1fr)) !important;
  gap: 14px !important;
  align-items: stretch !important;
}
.page_issue_archive .issues_archive > li,
.page_issue_archive ul.issues_archive > li {
  min-width: 0 !important;
  margin: 0 !important;
}

/* Cohesive, refined editorial card. */
.issue-summary.media {
  position: relative !important;
  display: flex !important;
  align-items: flex-start !important;
  gap: 18px !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 100% !important;
  margin: 0 0 14px !important;
  padding: 19px 20px !important;
  border: 1px solid #dce6f3 !important;
  border-left: 4px solid #365eaf !important;
  border-radius: 12px !important;
  background: linear-gradient(125deg, #ffffff 0%, #fbfdff 67%, #f6faff 100%) !important;
  box-shadow: 0 5px 19px rgba(35, 62, 125, .065) !important;
  overflow: hidden !important;
  transition: border-color .2s ease, box-shadow .2s ease,
              background-color .2s ease !important;
}
.issue-summary.media:hover,
.issue-summary.media:focus-within {
  border-color: #c3d6ed !important;
  border-left-color: #1c79a1 !important;
  background: linear-gradient(125deg, #ffffff 0%, #f8fbff 100%) !important;
  box-shadow: 0 9px 26px rgba(35, 62, 125, .11) !important;
}
.page_issue_archive .issues_archive .issue-summary.media {
  margin: 0 !important;
}

/* Journal cover: no aggressive cropping, restrained depth and soft framing. */
.issue-summary.media > .media-left {
  display: block !important;
  flex: 0 0 122px !important;
  width: 122px !important;
  min-width: 0 !important;
  max-width: 122px !important;
  padding: 0 !important;
  margin: 0 !important;
}
.issue-summary.media > .media-left > a.cover {
  display: block !important;
  width: 100% !important;
  padding: 5px !important;
  border: 1px solid #dbe5f3 !important;
  border-radius: 9px !important;
  background: #fff !important;
  box-shadow: 0 7px 17px rgba(35, 62, 125, .12) !important;
  text-decoration: none !important;
  transition: box-shadow .2s ease, border-color .2s ease !important;
}
.issue-summary.media > .media-left > a.cover:hover,
.issue-summary.media > .media-left > a.cover:focus-visible {
  border-color: #8dadde !important;
  box-shadow: 0 9px 23px rgba(35, 62, 125, .18) !important;
}
.issue-summary.media > .media-left > a.cover > img.media-object {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  max-height: 177px !important;
  margin: 0 auto !important;
  object-fit: contain !important;
  border-radius: 5px !important;
  background: #fff !important;
}

/* Volume / issue title: clear hierarchy without oversized typography. */
.issue-summary.media > .media-body {
  display: block !important;
  flex: 1 1 0 !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}
.issue-summary.media > .media-body > h2.media-heading {
  display: block !important;
  margin: 0 0 10px !important;
  padding: 0 0 8px !important;
  border: 0 !important;
  border-bottom: 1px solid #dce7f5 !important;
  color: #254b91 !important;
  font-size: 19px !important;
  font-weight: 700 !important;
  line-height: 1.28 !important;
  letter-spacing: -.015em !important;
}
.issue-summary.media > .media-body > h2.media-heading > a.title {
  color: #254b91 !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  line-height: inherit !important;
  text-decoration: none !important;
  overflow-wrap: anywhere !important;
}
.issue-summary.media > .media-body > h2.media-heading > a.title:hover,
.issue-summary.media > .media-body > h2.media-heading > a.title:focus-visible {
  color: #146d99 !important;
  text-decoration: underline !important;
  text-decoration-color: #b5d4e7 !important;
  text-underline-offset: 3px !important;
}

/* Issue metadata stays readable even when the original OJS markup is a single
   paragraph containing <strong>, <br> and flags. No content is hidden. */
.issue-summary.media .description {
  display: block !important;
  margin: 0 !important;
  padding: 10px 12px !important;
  border: 1px solid #e1eaf5 !important;
  border-radius: 8px !important;
  background: #f7faff !important;
  color: #4c5e75 !important;
  overflow-wrap: anywhere !important;
}
.issue-summary.media .description p,
.issue-summary.media .description p:last-child {
  margin: 0 !important;
  padding: 0 !important;
  color: #4c5e75 !important;
  font-size: 12.7px !important;
  font-weight: 400 !important;
  line-height: 1.9 !important;
  text-align: left !important;
  overflow-wrap: anywhere !important;
}
.issue-summary.media .description strong,
.issue-summary.media .description b {
  display: inline !important;
  padding: 2px 5px !important;
  border-radius: 4px !important;
  background: #e7f0fc !important;
  color: #244e91 !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: inherit !important;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}
/* Consistent flags, not excessively large inline thumbnails. */
.issue-summary.media .description img[src*="flagcdn.com"] {
  display: inline-block !important;
  width: 22px !important;
  height: 15px !important;
  max-width: none !important;
  margin: 0 3px 0 7px !important;
  padding: 0 !important;
  border: 1px solid rgba(36, 78, 145, .15) !important;
  border-radius: 3px !important;
  background: #fff !important;
  box-shadow: 0 1px 3px rgba(31, 57, 107, .09) !important;
  object-fit: cover !important;
  vertical-align: -2px !important;
}
.issue-summary.media .description a {
  color: #25549f !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}
.issue-summary.media .description a:hover,
.issue-summary.media .description a:focus-visible {
  color: #116d99 !important;
  text-decoration: underline !important;
}

/* Mobile: full-width text, balanced cover and comfortable tap targets. */
@media (max-width: 680px) {
  .issue-summary.media {
    gap: 13px !important;
    padding: 14px !important;
  }
  .issue-summary.media > .media-left {
    flex-basis: 95px !important;
    width: 95px !important;
    max-width: 95px !important;
  }
  .issue-summary.media > .media-body > h2.media-heading {
    font-size: 17px !important;
    margin-bottom: 8px !important;
    padding-bottom: 7px !important;
  }
  .issue-summary.media .description {
    padding: 8px 9px !important;
  }
  .issue-summary.media .description p {
    font-size: 12.3px !important;
    line-height: 1.8 !important;
  }
}
@media (max-width: 480px) {
  .issue-summary.media {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 12px !important;
    padding: 14px !important;
  }
  .issue-summary.media > .media-left {
    align-self: center !important;
    flex: 0 0 auto !important;
    width: 104px !important;
    max-width: 104px !important;
  }
  .issue-summary.media > .media-body {
    width: 100% !important;
  }
  .issue-summary.media > .media-body > h2.media-heading {
    text-align: center !important;
  }
}
@media (prefers-reduced-motion: reduce) {
  .issue-summary.media,
  .issue-summary.media > .media-left > a.cover {
    transition: none !important;
  }
}
@media print {
  .issue-summary.media,
  .issue-summary.media > .media-left > a.cover {
    box-shadow: none !important;
  }
}


/* ==========================================================================
   JIEEd 2026 — SOFT HIGHLIGHT ARTICLE CARDS (NO LEFT COLORED STRIPE)
   Overrides only .article-summary.media, leaving issue archive, navigation,
   current issue heading, article metrics, PDF link and footer untouched.
   ========================================================================== */

/* A full-surface editorial highlight replaces the former blue vertical bar. */
.article-summary.media {
  border: 1px solid #dce6f2 !important;
  border-left: 1px solid #dce6f2 !important;
  border-radius: 11px !important;
  background: linear-gradient(115deg,
    #ffffff 0%, #ffffff 44%, #fbfdff 76%, #f5f9ff 100%) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.95),
    0 4px 15px rgba(33,62,117,.055) !important;
  transition: border-color .22s ease, box-shadow .22s ease,
    background .22s ease, transform .22s ease !important;
}

.article-summary.media:hover,
.article-summary.media:focus-within {
  border-color: #bbd1e9 !important;
  border-left-color: #bbd1e9 !important;
  background: radial-gradient(ellipse at 97% 4%,
      rgba(180,214,251,.26) 0%, transparent 48%),
    linear-gradient(115deg, #ffffff 0%, #f9fcff 69%, #f1f7ff 100%) !important;
  box-shadow: 0 9px 27px rgba(38,74,145,.10),
    inset 0 1px 0 rgba(255,255,255,.98) !important;
  transform: translateY(-1px) !important;
}

/* Text highlight, rather than a strip beside the entire card. */
.article-summary.media h3.media-heading {
  margin-bottom: 9px !important;
  color: #214485 !important;
}
.article-summary.media h3.media-heading a {
  color: #214485 !important;
  background-image: linear-gradient(to top,
    rgba(179,212,247,.19) 0%, rgba(179,212,247,.19) 19%,
    transparent 19%, transparent 100%) !important;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
  transition: color .18s ease, background-image .18s ease !important;
}
.article-summary.media h3.media-heading a:hover,
.article-summary.media h3.media-heading a:focus-visible {
  color: #164a91 !important;
  background-image: linear-gradient(to top,
    rgba(134,189,247,.36) 0%, rgba(134,189,247,.36) 28%,
    transparent 28%, transparent 100%) !important;
  text-decoration: none !important;
}

/* Authors become a subdued tonal panel with no bright vertical border. */
.article-summary.media .meta {
  border: 1px solid #e3eaf4 !important;
  border-left: 1px solid #e3eaf4 !important;
  border-radius: 8px !important;
  background: linear-gradient(105deg,#f4f8fd 0%,#f9fbfe 100%) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.92) !important;
}
.article-summary.media .meta .authors {
  color: #5a6e82 !important;
}
.article-summary.media .meta .authors b,
.article-summary.media .meta .authors strong {
  color: #294b82 !important;
}

/* DOI receives a cool soft highlight, not a colored left border. */
.article-summary.media .doiInSummary,
.article-summary.media .doi {
  border: 1px solid #dcebef !important;
  border-left: 1px solid #dcebef !important;
  border-radius: 7px !important;
  background: linear-gradient(105deg,#f2fafb 0%,#f7fcff 100%) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.80) !important;
}

/* Give compact page and statistic details a consistent tonal emphasis. */
.article-summary.media p.pages {
  border-color: #dfe8f5 !important;
  background: #f0f5fc !important;
}
.article-summary.media .glyphicon {
  box-shadow: inset 0 1px 0 rgba(255,255,255,.8) !important;
}

@media (max-width: 768px) {
  .article-summary.media {
    padding: 13px 14px !important;
    border-radius: 9px !important;
  }
}
@media (prefers-reduced-motion: reduce) {
  .article-summary.media {
    transition: none !important;
  }
  .article-summary.media:hover,
  .article-summary.media:focus-within {
    transform: none !important;
  }
}
@media print {
  .article-summary.media {
    background: #fff !important;
    box-shadow: none !important;
  }
}


/* Match OJS native article gallery: remove the other legacy left stripe. */
ul.cmp_article_list.articles > li::before {
  content: none !important;
  display: none !important;
  background: none !important;
}
ul.cmp_article_list.articles > li {
  border: 1px solid #dce6f2 !important;
  background: linear-gradient(120deg, #fff 0%, #fff 62%, #f7faff 100%) !important;
  box-shadow: 0 4px 15px rgba(33,62,117,.055) !important;
}
ul.cmp_article_list.articles > li:hover,
ul.cmp_article_list.articles > li:focus-within {
  border-color: #bbd1e9 !important;
  background: radial-gradient(ellipse at 95% 8%,rgba(180,214,251,.24),transparent 50%),
    linear-gradient(120deg,#fff,#f6faff) !important;
  box-shadow: 0 8px 22px rgba(38,74,145,.095) !important;
}

/* ============================================================================
   JIEEd | PREMIUM BLUE + CHAMPAGNE SOFT HIGHLIGHT
   Unified article and issue-archive treatment for OJS 3.
   Subtle full-card blue/golden glow replaces every colored left stripe.
   Keep this section LAST in the journal CSS to override earlier rules.
   ============================================================================ */

/* 1) SHARED ARTICLE & ISSUE HIGHLIGHT: flat left border; no colored side bar. */
.article-summary.media,
.issue-summary.media {
  border: 1px solid #c9dcf3 !important;
  border-left: 1px solid #c9dcf3 !important;
  border-radius: 12px !important;
  background:
    radial-gradient(ellipse 72% 120% at 100% 0%, rgba(166, 205, 255, .31) 0%, transparent 72%),
    radial-gradient(ellipse 57% 75% at 0% 100%, rgba(252, 225, 151, .15) 0%, transparent 77%),
    linear-gradient(118deg, #ffffff 5%, #f5f9ff 70%, #edf5ff 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.96),
    0 5px 17px rgba(35, 74, 142, .085) !important;
  transition: background .22s ease, border-color .22s ease,
              box-shadow .22s ease, transform .22s ease !important;
}
.article-summary.media:hover,
.article-summary.media:focus-within,
.issue-summary.media:hover,
.issue-summary.media:focus-within {
  border-color: #91b9ed !important;
  border-left-color: #91b9ed !important;
  background:
    radial-gradient(ellipse 84% 125% at 100% 0%, rgba(142, 190, 250, .44) 0%, transparent 74%),
    radial-gradient(ellipse 62% 82% at 0% 100%, rgba(252, 221, 138, .24) 0%, transparent 79%),
    linear-gradient(118deg, #ffffff 0%, #edf5ff 67%, #e8f2ff 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.98),
    0 11px 28px rgba(38, 76, 146, .15) !important;
  transform: translateY(-2px) !important;
}

/* 2) ARTICLE: clearer title highlight and elegant compact metadata. */
.article-summary.media h3.media-heading {
  margin-bottom: 9px !important;
  color: #1d3f7b !important;
}
.article-summary.media h3.media-heading a {
  color: #1d3f7b !important;
  background-image: linear-gradient(to top,
     rgba(135, 186, 250, .38) 0%,
     rgba(135, 186, 250, .38) 26%,
     transparent 26%, transparent 100%) !important;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}
.article-summary.media h3.media-heading a:hover,
.article-summary.media h3.media-heading a:focus-visible {
  color: #173b7a !important;
  background-image: linear-gradient(to top,
     rgba(106, 164, 243, .55) 0%,
     rgba(106, 164, 243, .55) 34%,
     transparent 34%, transparent 100%) !important;
}
.article-summary.media .meta {
  border: 1px solid #d7e5f7 !important;
  border-left: 1px solid #d7e5f7 !important;
  border-radius: 9px !important;
  background: linear-gradient(105deg,
     rgba(231, 241, 255, .94) 0%,
     rgba(246, 250, 255, .93) 100%) !important;
}
.article-summary.media .meta .authors b,
.article-summary.media .meta .authors strong {
  color: #234782 !important;
}
.article-summary.media p.pages {
  color: #294f83 !important;
  border: 1px solid #d6e4f8 !important;
  background: #e8f2ff !important;
}
.article-summary.media .doiInSummary,
.article-summary.media .doi {
  border: 1px solid #cae7ed !important;
  border-left: 1px solid #cae7ed !important;
  background: linear-gradient(105deg, #e8f8fb 0%, #f3fbff 100%) !important;
}

/* 3) NATIVE OJS ARTICLE GRID: highlight entire tile, never draw a left marker. */
ul.cmp_article_list.articles > li::before,
.page_index_journal .current_issue .obj_issue_toc ul.cmp_article_list.articles > li::before,
.current_issue .obj_issue_toc ul.cmp_article_list.articles > li::before {
  content: none !important;
  display: none !important;
}
.page_index_journal .current_issue .obj_issue_toc ul.cmp_article_list.articles > li,
.current_issue .obj_issue_toc ul.cmp_article_list.articles > li,
.obj_issue_toc ul.cmp_article_list.articles > li,
ul.cmp_article_list.articles > li {
  border: 1px solid #c9dcf3 !important;
  border-left: 1px solid #c9dcf3 !important;
  border-radius: 12px !important;
  background:
    radial-gradient(ellipse at 100% 0%, rgba(163, 205, 255, .28), transparent 67%),
    linear-gradient(120deg, #fff 0%, #f5f9ff 73%, #eff6ff 100%) !important;
  box-shadow: 0 5px 17px rgba(35, 74, 142, .08) !important;
  transition: border-color .22s ease, background .22s ease,
              box-shadow .22s ease, transform .22s ease !important;
}
.page_index_journal .current_issue .obj_issue_toc ul.cmp_article_list.articles > li:hover,
.current_issue .obj_issue_toc ul.cmp_article_list.articles > li:hover,
.obj_issue_toc ul.cmp_article_list.articles > li:hover,
ul.cmp_article_list.articles > li:hover,
ul.cmp_article_list.articles > li:focus-within {
  border-color: #91b9ed !important;
  background:
    radial-gradient(ellipse at 100% 0%, rgba(146, 194, 250, .42), transparent 73%),
    radial-gradient(ellipse at 0% 100%, rgba(252, 225, 151, .17), transparent 65%),
    linear-gradient(120deg, #fff 0%, #eaf4ff 100%) !important;
  box-shadow: 0 10px 24px rgba(38, 76, 146, .14) !important;
  transform: translateY(-2px) !important;
}
ul.cmp_article_list.articles > li .obj_article_summary .title a {
  color: #234782 !important;
  background-image: linear-gradient(to top, rgba(135,186,250,.28) 0 24%, transparent 24%) !important;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}

/* 4) ISSUE ARCHIVES: matching highlight, no blue left list or cover edge. */
.issue-summary.media,
.page_issue_archive .issues_archive .issue-summary.media {
  border: 1px solid #c9dcf3 !important;
  border-left: 1px solid #c9dcf3 !important;
}
.page_issue_archive .issues_archive .issue-summary.media:hover,
.page_issue_archive .issues_archive .issue-summary.media:focus-within,
.page_issue_archive ul.issues_archive .issue-summary.media:hover,
.page_issue_archive ul.issues_archive .issue-summary.media:focus-within {
  border-color: #91b9ed !important;
  border-left-color: #91b9ed !important;
}
.issue-summary.media::before,
.page_issue_archive .issues_archive > li::before,
.page_issue_archive ul.issues_archive > li::before {
  content: none !important;
  display: none !important;
}
.page_issue_archive .issues_archive,
.page_issue_archive ul.issues_archive,
.page_issue_archive .issues_archive > li,
.page_issue_archive ul.issues_archive > li {
  list-style: none !important;
  list-style-image: none !important;
}
/* Uniform blue-tinted frame, no vertical accent next to issue cover. */
.issue-summary.media > .media-left > a.cover {
  border: 1px solid #c9def6 !important;
  background: linear-gradient(130deg, #fff 0%, #f1f7ff 100%) !important;
  box-shadow: 0 8px 21px rgba(35, 74, 142, .14) !important;
}
.issue-summary.media:hover > .media-left > a.cover,
.issue-summary.media:focus-within > .media-left > a.cover {
  border-color: #9cbeed !important;
  box-shadow: 0 11px 25px rgba(35, 74, 142, .20) !important;
}
.issue-summary.media > .media-body > h2.media-heading {
  border-bottom: 1px solid #cadcf3 !important;
  color: #1d3f7b !important;
}
.issue-summary.media > .media-body > h2.media-heading > a.title {
  color: #1d3f7b !important;
  background-image: linear-gradient(to top,
      rgba(135, 186, 250, .38) 0%,
      rgba(135, 186, 250, .38) 26%,
      transparent 26%) !important;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
  text-decoration: none !important;
}
.issue-summary.media > .media-body > h2.media-heading > a.title:hover,
.issue-summary.media > .media-body > h2.media-heading > a.title:focus-visible {
  color: #173b7a !important;
  background-image: linear-gradient(to top,
      rgba(106, 164, 243, .55) 0%,
      rgba(106, 164, 243, .55) 34%,
      transparent 34%) !important;
}
.issue-summary.media .description {
  border: 1px solid #d3e4f8 !important;
  border-left: 1px solid #d3e4f8 !important;
  background:
    linear-gradient(114deg,
      rgba(234, 244, 255, .96) 0%,
      rgba(247, 251, 255, .98) 74%,
      rgba(255, 250, 232, .85) 100%) !important;
}
.issue-summary.media .description strong,
.issue-summary.media .description b {
  background: #fff0cb !important;
  color: #2b4679 !important;
  border-radius: 4px !important;
}

/* 5) LEGACY OJS issue summary markup follows the same palette if present. */
.page_issue_archive .obj_issue_summary {
  border: 1px solid #c9dcf3 !important;
  border-left: 1px solid #c9dcf3 !important;
  border-radius: 12px !important;
  background:
    radial-gradient(ellipse at 100% 0%, rgba(163,205,255,.28), transparent 68%),
    linear-gradient(120deg, #fff, #f3f9ff) !important;
  box-shadow: 0 5px 17px rgba(35, 74, 142, .08) !important;
  transition: border-color .22s ease, box-shadow .22s ease,
              transform .22s ease !important;
}
.page_issue_archive .obj_issue_summary:hover,
.page_issue_archive .obj_issue_summary:focus-within {
  border-color: #91b9ed !important;
  box-shadow: 0 10px 24px rgba(38,76,146,.14) !important;
  transform: translateY(-2px) !important;
}

/* 6) Accessibility / restrained mobile motion. */
@media (max-width: 768px) {
  .article-summary.media,
  .issue-summary.media,
  .page_issue_archive .obj_issue_summary,
  ul.cmp_article_list.articles > li {
    border-radius: 10px !important;
  }
}
@media (prefers-reduced-motion: reduce) {
  .article-summary.media:hover,
  .article-summary.media:focus-within,
  .issue-summary.media:hover,
  .issue-summary.media:focus-within,
  .page_issue_archive .obj_issue_summary:hover,
  ul.cmp_article_list.articles > li:hover {
    transform: none !important;
  }
}
@media print {
  .article-summary.media,
  .issue-summary.media,
  .page_issue_archive .obj_issue_summary,
  ul.cmp_article_list.articles > li {
    background: #fff !important;
    box-shadow: none !important;
    transform: none !important;
  }
}

/* ============================================================================
   JIEEd PDF GALLEY VIEWER — ISOLATED LAYOUT FIX (2026-10-19)
   Scope is restricted to OJS's PDF.js galley page. Keeps journal pages intact.
   Works with modern browsers supporting :has() (Chrome, Edge, Firefox, Safari).
   ============================================================================ */

/* Remove ONLY the large custom banner when the PDF galley is open. */
body:has(#pdfCanvasContainer) > header:not(.header_view):has(img[src*="header-jieed-besar1.png"]),
body:has(#pdfCanvasContainer) header.jieed-custom-banner,
body:has(#pdfCanvasContainer) header:has(> img[src*="header-jieed-besar1.png"]):not(.header_view),
body:has(#pdfCanvasContainer) .jieed-custom-banner {
  display: none !important;
}

/* PDF viewer layout: slim toolbar above a full-width document. */
body:has(#pdfCanvasContainer) {
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
  height: 100vh !important;
  height: 100dvh !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: #e9eef5 !important;
}

body:has(#pdfCanvasContainer) > .header_view {
  position: relative !important;
  inset: auto !important;
  z-index: 30 !important;
  display: flex !important;
  flex: 0 0 54px !important;
  align-items: center !important;
  gap: 12px !important;
  width: 100% !important;
  max-width: none !important;
  height: 54px !important;
  min-height: 54px !important;
  margin: 0 !important;
  padding: 0 20px !important;
  border: 0 !important;
  border-bottom: 1px solid #dce5f1 !important;
  background: #fff !important;
  box-shadow: 0 2px 10px rgba(24,50,93,.07) !important;
}

body:has(#pdfCanvasContainer) > .header_view a {
  position: static !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  float: none !important;
  margin: 0 !important;
  text-decoration: none !important;
}

body:has(#pdfCanvasContainer) > .header_view .return {
  flex: 0 0 36px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 36px !important;
  height: 34px !important;
  border: 1px solid #d6e2f0 !important;
  border-radius: 7px !important;
  background: #f4f8fd !important;
  color: #223c89 !important;
}

body:has(#pdfCanvasContainer) > .header_view .return::before {
  content: "\2190" !important;
  font: 700 22px/1 Arial, sans-serif !important;
}

body:has(#pdfCanvasContainer) > .header_view .title {
  display: block !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  overflow: hidden !important;
  white-space: nowrap !important;
  text-overflow: ellipsis !important;
  color: #17365d !important;
  font: 600 14px/1.4 Arial, Helvetica, sans-serif !important;
  text-align: left !important;
  text-shadow: none !important;
}

body:has(#pdfCanvasContainer) > .header_view .download {
  display: inline-flex !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 34px !important;
  padding: 6px 14px !important;
  border: 1px solid #2f53a2 !important;
  border-radius: 7px !important;
  background: #2f53a2 !important;
  color: white !important;
  font: 700 12px/1.25 Arial, sans-serif !important;
  box-shadow: none !important;
}

body:has(#pdfCanvasContainer) > .header_view .download::before {
  content: "\2193" !important;
  margin-right: 7px !important;
  font-size: 17px !important;
  line-height: 1 !important;
}

body:has(#pdfCanvasContainer) > .header_view .download:hover,
body:has(#pdfCanvasContainer) > .header_view .download:focus-visible {
  background: #223c89 !important;
  border-color: #223c89 !important;
  color: #fff !important;
}

body:has(#pdfCanvasContainer) #pdfCanvasContainer {
  position: relative !important;
  display: block !important;
  flex: 1 1 auto !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 0 !important;
  background: #edf1f6 !important;
}

body:has(#pdfCanvasContainer) #pdfCanvasContainer > iframe {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: #edf1f6 !important;
}

/* Preserve version notice, when OJS shows an older PDF version. */
body:has(#pdfCanvasContainer) .galley_view_notice {
  position: absolute !important;
  z-index: 5 !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
}

@media (max-width: 650px) {
  body:has(#pdfCanvasContainer) > .header_view {
    flex-basis: 49px !important;
    height: 49px !important;
    min-height: 49px !important;
    padding: 0 9px !important;
    gap: 8px !important;
  }
  body:has(#pdfCanvasContainer) > .header_view .title {
    font-size: 12px !important;
  }
  body:has(#pdfCanvasContainer) > .header_view .download {
    padding: 7px 9px !important;
    font-size: 11px !important;
  }
}


/* JIEEd | OJS 3 | Full-height PDF and isolated footer | 20 Oct 2026
   Paste at END of existing journal custom CSS. */

/* PDF galley only: hide regular site chrome, not the PDF toolbar */
body:has(#pdfCanvasContainer) .pkp_structure_footer_wrapper,
body:has(#pdfCanvasContainer) .pkp_structure_footer,
body:has(#pdfCanvasContainer) [role="contentinfo"][aria-label="JIEEd journal footer"],
body:has(#pdfCanvasContainer) .jieed-custom-banner,
body:has(#pdfCanvasContainer) .pkp_structure_head,
body:has(#pdfCanvasContainer) .pkp_navigation_primary_wrapper {
  display: none !important;
}

/* Don't let inherited content widths/heights limit the viewer */
html:has(#pdfCanvasContainer),
body:has(#pdfCanvasContainer) {
  width: 100% !important;
  height: 100% !important;
  min-height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}
body:has(#pdfCanvasContainer) {
  height: 100vh !important;
  height: 100dvh !important;
  display: flex !important;
  flex-direction: column !important;
  background: #edf1f6 !important;
}

/* Full-viewport PDF reader — explicit height beats inherited auto height */
body:has(#pdfCanvasContainer) #pdfCanvasContainer {
  display: block !important;
  position: relative !important;
  flex: 1 1 0% !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  min-height: 0 !important;
  height: calc(100vh - 54px) !important;
  height: calc(100dvh - 54px) !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  overflow: hidden !important;
}
body:has(#pdfCanvasContainer) #pdfCanvasContainer > iframe,
body:has(#pdfCanvasContainer) #pdfCanvasContainer > embed,
body:has(#pdfCanvasContainer) #pdfCanvasContainer > object {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 100% !important;
  border: 0 !important;
}

/* Preserve the compact OJS navigation bar */
body:has(#pdfCanvasContainer) > .header_view {
  flex: 0 0 54px !important;
  height: 54px !important;
  min-height: 54px !important;
  max-height: 54px !important;
  width: 100% !important;
  margin: 0 !important;
}

/* Some OJS galley templates place a content wrapper around the viewer.
   Only apply when it actually contains the PDF Canvas. */
body:has(#pdfCanvasContainer) .pkp_structure_page:has(#pdfCanvasContainer),
body:has(#pdfCanvasContainer) .pkp_structure_content:has(#pdfCanvasContainer),
body:has(#pdfCanvasContainer) .pkp_structure_main:has(#pdfCanvasContainer) {
  width: 100% !important;
  max-width: none !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

@media (max-width: 650px) {
  body:has(#pdfCanvasContainer) > .header_view {
    flex-basis: 49px !important;
    height: 49px !important;
    min-height: 49px !important;
    max-height: 49px !important;
  }
  body:has(#pdfCanvasContainer) #pdfCanvasContainer {
    height: calc(100vh - 49px) !important;
    height: calc(100dvh - 49px) !important;
  }
}

/* ==========================================================================
   JIEEd | OJS 3 SIDEBAR LAYOUT FIX
   Add this at the very end of the current custom CSS.
   Applies only when an OJS sidebar is present.
   Other journal components, PDF viewer, and footer remain unchanged.
   ========================================================================== */

/* Desktop: journal content at left, sidebar at right. */
@media (min-width: 992px) {
  .pkp_structure_content.has_sidebar,
  .pkp_structure_content:has(> .pkp_structure_sidebar) {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 280px !important;
    column-gap: 28px !important;
    align-items: start !important;
  }

  .pkp_structure_content.has_sidebar > .pkp_structure_main,
  .pkp_structure_content:has(> .pkp_structure_sidebar) > .pkp_structure_main {
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    float: none !important;
    margin: 0 !important;
  }

  .pkp_structure_content.has_sidebar > .pkp_structure_sidebar,
  .pkp_structure_content:has(> .pkp_structure_sidebar) > .pkp_structure_sidebar {
    grid-column: 2 !important;
    grid-row: 1 !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 280px !important;
    float: none !important;
    clear: none !important;
    margin: 0 !important;
    padding-top: 0 !important;
  }
}

/* Tablet/mobile: natural vertical reading order; sidebar below the content. */
@media (max-width: 991px) {
  .pkp_structure_content.has_sidebar,
  .pkp_structure_content:has(> .pkp_structure_sidebar) {
    display: block !important;
  }

  .pkp_structure_content.has_sidebar > .pkp_structure_main,
  .pkp_structure_content:has(> .pkp_structure_sidebar) > .pkp_structure_main,
  .pkp_structure_content.has_sidebar > .pkp_structure_sidebar,
  .pkp_structure_content:has(> .pkp_structure_sidebar) > .pkp_structure_sidebar {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    float: none !important;
    clear: none !important;
  }

  .pkp_structure_content.has_sidebar > .pkp_structure_sidebar,
  .pkp_structure_content:has(> .pkp_structure_sidebar) > .pkp_structure_sidebar {
    margin-top: 20px !important;
  }
}


/* ========================================================================
   JIEEd PREMIUM SIDEBAR | WIDER & CLOSER TO MAIN CONTENT
   Appended override for JIEEd_Premium_OJS3_Sidebar_Right_FIXED.css
   Preserves header, content, PDF gallery, and journal footer.
   ======================================================================== */

/* Desktop: visually balanced 2-column OJS layout. */
@media (min-width: 1260px) {
  .pkp_structure_content.has_sidebar,
  .pkp_structure_content:has(> .pkp_structure_sidebar) {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 360px !important;
    column-gap: 14px !important;
    align-items: start !important;
  }

  .pkp_structure_content.has_sidebar > .pkp_structure_main,
  .pkp_structure_content:has(> .pkp_structure_sidebar) > .pkp_structure_main {
    grid-column: 1 !important;
    grid-row: 1 !important;
    min-width: 0 !important;
    width: auto !important;
    max-width: none !important;
    float: none !important;
    margin: 0 !important;
  }

  .pkp_structure_content.has_sidebar > .pkp_structure_sidebar,
  .pkp_structure_content:has(> .pkp_structure_sidebar) > .pkp_structure_sidebar {
    grid-column: 2 !important;
    grid-row: 1 !important;
    width: 100% !important;
    max-width: 360px !important;
    min-width: 0 !important;
    float: none !important;
    clear: none !important;
    margin: 0 !important;
    padding: 0 !important;
  }
}

/* Smaller desktop: leave comfortable width for the article column. */
@media (min-width: 992px) and (max-width: 1259px) {
  .pkp_structure_content.has_sidebar,
  .pkp_structure_content:has(> .pkp_structure_sidebar) {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 318px !important;
    column-gap: 12px !important;
    align-items: start !important;
  }

  .pkp_structure_content.has_sidebar > .pkp_structure_main,
  .pkp_structure_content:has(> .pkp_structure_sidebar) > .pkp_structure_main {
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    float: none !important;
    margin: 0 !important;
  }

  .pkp_structure_content.has_sidebar > .pkp_structure_sidebar,
  .pkp_structure_content:has(> .pkp_structure_sidebar) > .pkp_structure_sidebar {
    grid-column: 2 !important;
    grid-row: 1 !important;
    width: 100% !important;
    max-width: 318px !important;
    min-width: 0 !important;
    float: none !important;
    clear: none !important;
    margin: 0 !important;
    padding: 0 !important;
  }
}

/* Use the space efficiently for this premium custom block, without
   changing other sidebar plugins or their designs. */
.pkp_structure_sidebar .pkp_block:has(#jieed-premium-sidebar-v2),
.pkp_structure_sidebar .block_custom:has(#jieed-premium-sidebar-v2) {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  padding: 7px !important;
  margin: 0 0 10px !important;
  border: 0 !important;
  border-radius: 9px !important;
  background: transparent !important;
  box-shadow: none !important;
}

#jieed-premium-sidebar-v2 {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}

/* Smartphones and narrow tablets retain the already-working stacked layout. */
@media (max-width: 991px) {
  .pkp_structure_content.has_sidebar,
  .pkp_structure_content:has(> .pkp_structure_sidebar) {
    display: block !important;
  }

  .pkp_structure_content.has_sidebar > .pkp_structure_main,
  .pkp_structure_content:has(> .pkp_structure_sidebar) > .pkp_structure_main,
  .pkp_structure_content.has_sidebar > .pkp_structure_sidebar,
  .pkp_structure_content:has(> .pkp_structure_sidebar) > .pkp_structure_sidebar {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    float: none !important;
    clear: none !important;
  }
  .pkp_structure_content.has_sidebar > .pkp_structure_sidebar,
  .pkp_structure_content:has(> .pkp_structure_sidebar) > .pkp_structure_sidebar {
    margin-top: 20px !important;
  }
}