/* Cambodian Journal of English Language Teaching (CJELT)
   Public OJS journal stylesheet
   Upload in: Settings > Website > Appearance > Advanced > Journal style sheet
*/

:root {
  --cjelt-blue: #003B7A;
  --cjelt-blue-dark: #002B59;
  --cjelt-blue-light: #EAF2FB;
  --cjelt-teal: #1FAFBA;
  --cjelt-header-blue: #124FCE;
  --cjelt-nav-teal: #147C9E;
  --cjelt-nav-blue: #0F57B7;
  --cjelt-red: #B21F2D;
  --cjelt-gold: #C69A2D;
  --cjelt-text: #222222;
  --cjelt-muted: #666666;
  --cjelt-border: #D9E1EA;
  --cjelt-bg: #FFFFFF;
  --cjelt-soft-bg: #F7F9FC;
}

html,
body {
  font-family: "Noto Sans", Arial, Helvetica, sans-serif;
  color: var(--cjelt-text);
  background: var(--cjelt-bg);
  font-size: 16px;
  line-height: 1.6;
}

body {
  letter-spacing: 0;
}

a,
a:visited {
  color: var(--cjelt-blue);
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

a:hover,
a:focus {
  color: var(--cjelt-red);
}

h1,
h2,
h3,
h4,
h5,
h6,
.page_title,
.obj_article_details .page_title,
.cmp_breadcrumbs,
.pkp_block .title {
  font-family: "Noto Sans", Arial, Helvetica, sans-serif;
  color: var(--cjelt-blue-dark);
  letter-spacing: 0;
}

h1,
.page_title,
.obj_article_details .page_title {
  font-size: 2rem;
  line-height: 1.25;
  margin-bottom: 1rem;
}

h2 {
  font-size: 1.45rem;
  line-height: 1.35;
  margin-top: 1.8rem;
}

h3 {
  font-size: 1.15rem;
  line-height: 1.4;
  margin-top: 1.4rem;
}

p,
li {
  font-size: 1rem;
}

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

/* Header and site identity */
.pkp_structure_head {
  background: linear-gradient(105deg, var(--cjelt-teal) 0%, #1D83D8 52%, var(--cjelt-header-blue) 100%);
}

.pkp_head_wrapper {
  background: transparent;
}

.pkp_site_name,
.pkp_site_name_wrapper {
  padding-top: 2rem;
  padding-bottom: 2rem;
  overflow: visible;
}

.pkp_site_name,
.pkp_site_name a,
.pkp_site_name .is_img img {
  color: #FFFFFF;
}

.pkp_site_name a {
  text-decoration: none;
}

.pkp_site_name .is_img,
.pkp_site_name a.is_img {
  display: inline-flex !important;
  align-items: center;
  visibility: visible !important;
  opacity: 1 !important;
}

.pkp_site_name .is_img img,
.pkp_site_name a.is_img img {
  display: block !important;
  width: auto;
  max-width: min(860px, 92vw);
  max-height: 104px;
  visibility: visible !important;
  opacity: 1 !important;
}

.pkp_site_name .is_text {
  font-weight: 700;
  color: #FFFFFF;
}

/* Primary navigation */
.pkp_navigation_primary_row,
.pkp_navigation_primary_wrapper {
  background: transparent !important;
  border-top: 0;
  border-bottom: 0;
}

.pkp_site_nav_menu,
.pkp_site_nav_menu .pkp_navigation_primary,
.pkp_navigation_primary,
.pkp_navigation_user {
  background: transparent !important;
}

.pkp_navigation_primary > li > a,
.pkp_navigation_primary > li > a:visited,
.pkp_navigation_primary ul a,
.pkp_navigation_user > li > a {
  color: #FFFFFF;
  font-weight: 600;
  text-decoration: none;
}

.pkp_navigation_primary > li > a:hover,
.pkp_navigation_primary > li > a:focus,
.pkp_navigation_primary > li > a[aria-expanded="true"],
.pkp_navigation_user > li > a:hover,
.pkp_navigation_user > li > a:focus {
  color: #FFFFFF;
  background: rgba(255, 255, 255, 0.12);
}

.pkp_navigation_primary ul {
  background: #FFFFFF;
  border: 1px solid var(--cjelt-border);
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.12);
}

.pkp_navigation_primary ul a,
.pkp_navigation_primary ul a:visited {
  color: var(--cjelt-blue-dark);
}

.pkp_navigation_primary ul a:hover,
.pkp_navigation_primary ul a:focus {
  color: #FFFFFF;
  background: var(--cjelt-nav-blue);
}

/* Layout */
.pkp_structure_content,
.pkp_structure_footer,
.pkp_head_wrapper,
.pkp_navigation_primary_wrapper {
  box-sizing: border-box;
  max-width: 1120px;
  margin-left: auto;
  margin-right: auto;
}

.pkp_structure_content {
  width: calc(100% - 48px);
}

.pkp_structure_page,
.pkp_structure_body,
.pkp_structure_content,
.pkp_structure_main {
  border: 0 !important;
  box-shadow: none !important;
}

.pkp_structure_page:before,
.pkp_structure_page:after,
.pkp_structure_body:before,
.pkp_structure_body:after,
.pkp_structure_content:before,
.pkp_structure_content:after,
.pkp_structure_main:before,
.pkp_structure_main:after {
  display: none !important;
  content: none !important;
}

.pkp_structure_main {
  box-sizing: border-box;
  width: 100%;
  max-width: none;
  padding-top: 0.85rem;
  padding-bottom: 2.5rem;
}

.pkp_structure_content {
  background: #FFFFFF;
}

.pkp_structure_content > *:first-child,
.pkp_structure_main > *:first-child {
  margin-top: 0 !important;
}

.pkp_structure_content hr,
.pkp_structure_main hr {
  margin-top: 0.25rem;
  margin-bottom: 1.5rem;
}

.pkp_structure_sidebar {
  font-size: 0.95rem;
}

.pkp_block {
  margin-bottom: 1.5rem;
  padding-bottom: 1.25rem;
  border-bottom: 1px solid var(--cjelt-border);
}

.pkp_block .title {
  font-size: 1rem;
  font-weight: 700;
  color: var(--cjelt-blue);
  margin-bottom: 0.65rem;
}

.pkp_block ul {
  padding-left: 1.2rem;
}

/* Buttons and calls to action */
.cmp_button,
.cmp_form .buttons button,
.page_search .submit button,
.obj_galley_link,
.block_make_submission a,
.pkp_page_index .cmp_button,
button.submit,
input[type="submit"] {
  display: inline-block;
  border: 1px solid var(--cjelt-blue);
  border-radius: 6px;
  background: var(--cjelt-blue);
  color: #FFFFFF !important;
  font-family: "Noto Sans", Arial, Helvetica, sans-serif;
  font-weight: 700;
  text-decoration: none;
  padding: 0.55rem 0.9rem;
  line-height: 1.25;
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.cmp_button:hover,
.cmp_button:focus,
.cmp_form .buttons button:hover,
.cmp_form .buttons button:focus,
.page_search .submit button:hover,
.page_search .submit button:focus,
.obj_galley_link:hover,
.obj_galley_link:focus,
.block_make_submission a:hover,
.block_make_submission a:focus,
button.submit:hover,
button.submit:focus,
input[type="submit"]:hover,
input[type="submit"]:focus {
  background: var(--cjelt-blue-dark);
  border-color: var(--cjelt-blue-dark);
  color: #FFFFFF !important;
}

.obj_galley_link {
  border-radius: 5px;
  padding: 0.4rem 0.7rem;
}

/* Announcements and issue/article lists */
.cmp_announcements,
.obj_announcement_summary,
.obj_issue_summary,
.obj_article_summary {
  border-bottom: 1px solid var(--cjelt-border);
  padding-bottom: 1.2rem;
  margin-bottom: 1.2rem;
}

.obj_announcement_summary .title,
.obj_issue_summary .title,
.obj_article_summary .title {
  color: var(--cjelt-blue-dark);
  font-weight: 700;
}

.obj_announcement_summary .date,
.obj_article_summary .authors,
.obj_article_summary .pages,
.obj_issue_summary .series {
  color: var(--cjelt-muted);
}

.current_issue,
.additional_content,
.page_index_journal .homepage_image {
  margin-bottom: 2rem;
}

.current_issue h2 {
  border-bottom: 3px solid var(--cjelt-blue);
  padding-bottom: 0.45rem;
}

/* Article details */
.obj_article_details .authors,
.obj_article_details .item.doi,
.obj_article_details .item.keywords,
.obj_article_details .item.abstract {
  margin-bottom: 1.3rem;
}

.obj_article_details .label {
  color: var(--cjelt-blue);
  font-weight: 700;
}

.obj_article_details .abstract {
  line-height: 1.65;
}

.obj_article_details .item.references {
  font-size: 0.95rem;
  line-height: 1.55;
}

/* Forms */
input[type="text"],
input[type="email"],
input[type="password"],
input[type="url"],
textarea,
select {
  border: 1px solid var(--cjelt-border);
  border-radius: 5px;
  font-family: "Noto Sans", Arial, Helvetica, sans-serif;
}

input:focus,
textarea:focus,
select:focus {
  border-color: var(--cjelt-blue);
  outline: 2px solid var(--cjelt-blue-light);
}

/* Footer */
.pkp_structure_footer_wrapper {
  background: #FFFFFF;
  color: var(--cjelt-text);
  border-top: 1px solid var(--cjelt-border);
}

.pkp_structure_footer,
.pkp_structure_footer p,
.pkp_structure_footer li {
  color: var(--cjelt-text);
}

.pkp_structure_footer a,
.pkp_structure_footer a:visited {
  color: var(--cjelt-blue);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.pkp_structure_footer a:hover,
.pkp_structure_footer a:focus {
  color: var(--cjelt-red);
}

.pkp_structure_footer h1,
.pkp_structure_footer h2,
.pkp_structure_footer h3,
.pkp_structure_footer h4,
.pkp_structure_footer .title {
  color: var(--cjelt-blue);
}

/* Custom CJELT content blocks */
.cjelt-card,
.cjelt-callout,
.cjelt-sidebar-box {
  border: 1px solid var(--cjelt-border);
  border-radius: 8px;
  background: var(--cjelt-soft-bg);
  padding: 1rem;
  margin: 1rem 0;
}

.cjelt-callout {
  border-left: 5px solid var(--cjelt-blue);
  background: var(--cjelt-blue-light);
}

.cjelt-button-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin: 1rem 0;
}

.cjelt-button,
.cjelt-button:visited {
  display: inline-block;
  border-radius: 6px;
  background: var(--cjelt-blue);
  color: #FFFFFF !important;
  font-weight: 700;
  text-decoration: none;
  padding: 0.65rem 1rem;
}

.cjelt-button:hover,
.cjelt-button:focus {
  background: var(--cjelt-blue-dark);
  color: #FFFFFF !important;
}

.cjelt-button.secondary {
  background: #FFFFFF;
  color: var(--cjelt-blue) !important;
  border: 1px solid var(--cjelt-blue);
}

.cjelt-button.secondary:hover,
.cjelt-button.secondary:focus {
  background: var(--cjelt-blue-light);
  color: var(--cjelt-blue-dark) !important;
}

/* Existing custom class from your uploaded file */
.privacy-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
  margin: 22px 0 26px;
}

/* Mobile */
@media (max-width: 850px) {
  .pkp_structure_head {
    display: flex;
    flex-direction: column;
    background: #FFFFFF;
    min-height: auto;
  }

  .pkp_head_wrapper {
    order: 2;
    width: 100%;
    max-width: 100%;
    background: linear-gradient(105deg, var(--cjelt-teal) 0%, #1D83D8 52%, var(--cjelt-header-blue) 100%);
    min-height: auto;
  }

  .pkp_navigation_primary_row {
    order: 1;
    width: 100%;
    background: #FFFFFF !important;
    border-bottom: 1px solid var(--cjelt-border);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
  }

  .pkp_navigation_primary_wrapper,
  .pkp_site_nav_menu {
    background: #FFFFFF !important;
  }

  .pkp_site_name_wrapper {
    display: block !important;
    width: 100%;
  }

  .pkp_site_name,
  .pkp_site_name a.is_text,
  .pkp_site_name .is_text,
  .pkp_site_name a.is_img,
  .pkp_site_name .is_img {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  .pkp_site_name,
  .pkp_site_name_wrapper {
    padding: 2.25rem 1.25rem 2.4rem;
    text-align: left;
    height: auto !important;
    min-height: 0;
    max-height: none !important;
    overflow: visible !important;
  }

  .pkp_site_name .is_text,
  .pkp_site_name a.is_text {
    color: #FFFFFF !important;
    font-size: 1.65rem;
    font-weight: 700;
    line-height: 1.3;
    white-space: normal;
    word-break: normal;
    text-decoration: none;
  }

  .pkp_site_name .is_img img,
  .pkp_site_name a.is_img img {
    display: block !important;
    width: auto !important;
    max-width: 92vw !important;
    max-height: 92px !important;
  }

  .pkp_site_nav_menu {
    background: #FFFFFF !important;
  }

  .pkp_site_nav_menu .pkp_navigation_primary_row {
    background: #FFFFFF !important;
  }

  .pkp_navigation_primary,
  .pkp_navigation_user {
    margin: 0;
    padding: 0.65rem 1rem;
    background: #FFFFFF !important;
  }

  .pkp_navigation_primary > li > a,
  .pkp_navigation_user > li > a {
    display: block;
    padding: 0.35rem 0;
    color: var(--cjelt-blue-dark) !important;
    font-size: 1.05rem;
    line-height: 1.35;
  }

  .pkp_navigation_primary ul {
    margin: 0.35rem 0 0.5rem;
    padding: 0.55rem 0.75rem;
    background: #FFFFFF;
    border-radius: 4px;
  }

  .pkp_navigation_primary ul a,
  .pkp_navigation_primary ul a:visited {
    color: var(--cjelt-blue-dark) !important;
    padding: 0.35rem 0;
  }

  .pkp_navigation_primary ul a:hover,
  .pkp_navigation_primary ul a:focus {
    color: var(--cjelt-blue) !important;
    background: transparent;
  }

  .pkp_site_nav_toggle,
  .pkp_site_nav_toggle:before,
  .pkp_site_nav_toggle:after,
  .pkp_site_nav_toggle span {
    max-width: 44px;
    max-height: 44px;
    color: var(--cjelt-blue-dark);
  }

  h1,
  .page_title,
  .obj_article_details .page_title {
    font-size: 1.55rem;
  }

  h2 {
    font-size: 1.25rem;
  }

  .pkp_structure_main {
    padding-top: 1.25rem;
  }

  .pkp_structure_content,
  .pkp_structure_footer,
  .pkp_head_wrapper,
  .pkp_navigation_primary_wrapper {
    width: 100%;
    max-width: 100%;
  }

  .cjelt-button-row {
    flex-direction: column;
  }

  .cjelt-button,
  .cjelt-button.secondary {
    width: 100%;
    box-sizing: border-box;
    text-align: center;
  }

  .privacy-grid {
    grid-template-columns: 1fr;
  }
}

/* CJELT footer: white link area + dark bottom bar */
.pkp_structure_footer_wrapper {
  background: #FFFFFF !important;
  border-top: 1px solid #E6EDF5 !important;
  padding: 0 !important;
  margin-top: 2.5rem;
}

.pkp_structure_footer {
  max-width: 100% !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cjelt-blue-dark);
}

.pkp_structure_footer .pkp_brand_footer,
.pkp_brand_footer {
  display: none !important;
}

.cjelt-footer {
  font-family: "Noto Sans", Arial, Helvetica, sans-serif;
  background: #FFFFFF;
  color: var(--cjelt-blue-dark);
}

.cjelt-footer-main {
  box-sizing: border-box;
  max-width: 1120px;
  margin: 0 auto;
  padding: 2.8rem 1.5rem 2.6rem;
  display: grid;
  grid-template-columns: 1.1fr 1fr 1fr 1fr;
  gap: 3rem;
  align-items: start;
}

.cjelt-footer-logo {
  display: inline-flex;
  width: 72px;
  height: 72px;
  border-radius: 16px;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #147C9E 0%, #126DB8 52%, #0F57B7 100%);
  color: #FFFFFF;
  font-size: 1.35rem;
  line-height: 1;
  font-weight: 900;
  letter-spacing: -0.04em;
  box-shadow: 0 8px 20px rgba(15, 87, 183, 0.18);
}

.cjelt-footer-logo span {
  display: block;
  text-align: center;
}

.cjelt-footer-title {
  margin-top: 0.8rem;
  max-width: 220px;
  font-size: 0.9rem;
  line-height: 1.35;
  font-weight: 700;
  color: var(--cjelt-blue-dark);
}

.cjelt-footer-col h3 {
  margin: 0 0 0.75rem;
  color: var(--cjelt-blue-dark);
  font-size: 1rem;
  line-height: 1.25;
  font-weight: 800;
}

.cjelt-footer-col ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.cjelt-footer-col li {
  margin: 0 0 0.45rem;
  padding: 0;
  color: var(--cjelt-blue-dark);
  font-size: 0.9rem;
  line-height: 1.4;
}

.cjelt-footer a,
.cjelt-footer a:visited {
  color: var(--cjelt-blue-dark) !important;
  text-decoration: none !important;
}

.cjelt-footer a:hover,
.cjelt-footer a:focus {
  color: var(--cjelt-nav-blue) !important;
  text-decoration: underline !important;
  text-underline-offset: 3px;
}

.cjelt-footer-bottom {
  background: #43525E;
  color: #FFFFFF;
  text-align: center;
  padding: 0.9rem 1rem;
  font-size: 0.86rem;
  line-height: 1.4;
  font-weight: 700;
}

.cjelt-footer-bottom a,
.cjelt-footer-bottom a:visited {
  color: #FFFFFF !important;
  text-decoration: none !important;
}

.cjelt-footer-bottom a:hover,
.cjelt-footer-bottom a:focus {
  color: #FFFFFF !important;
  text-decoration: underline !important;
}

@media (max-width: 850px) {
  .cjelt-footer-main {
    grid-template-columns: 1fr 1fr;
    gap: 1.8rem;
    padding: 2rem 1.25rem;
  }

  .cjelt-footer-logo {
    width: 64px;
    height: 64px;
    border-radius: 14px;
    font-size: 1.15rem;
  }
}

@media (max-width: 560px) {
  .cjelt-footer-main {
    grid-template-columns: 1fr;
    gap: 1.4rem;
    padding: 1.8rem 1.15rem;
  }

  .cjelt-footer-title {
    max-width: 100%;
  }

  .cjelt-footer-col h3 {
    margin-bottom: 0.45rem;
  }
}

/* =========================================================
   CJELT compact header + reliable mobile journal title
   Added July 2026
   ========================================================= */

/* Desktop/tablet: reduce the colored header height by about 35% */
@media (min-width: 851px) {
  .pkp_structure_head {
    min-height: 0 !important;
  }

  .pkp_head_wrapper {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  .pkp_site_name_wrapper,
  .pkp_site_name {
    box-sizing: border-box;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding-top: 1.05rem !important;
    padding-bottom: 0.55rem !important;
  }

  .pkp_site_name .is_text,
  .pkp_site_name a.is_text {
    display: inline-block !important;
    margin: 0 !important;
    font-size: 1.52rem !important;
    line-height: 1.2 !important;
  }

  .pkp_site_name .is_img img,
  .pkp_site_name a.is_img img {
    max-height: 70px !important;
  }

  .pkp_navigation_primary_row,
  .pkp_navigation_primary_wrapper {
    min-height: 0 !important;
    margin: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0.35rem !important;
  }

  .pkp_navigation_primary > li > a,
  .pkp_navigation_user > li > a {
    padding-top: 0.55rem !important;
    padding-bottom: 0.55rem !important;
    line-height: 1.2 !important;
  }
}

/* Mobile: keep the journal title visible and make the header compact */
@media (max-width: 850px) {
  .pkp_structure_head,
  .pkp_head_wrapper {
    min-height: 0 !important;
    height: auto !important;
    overflow: visible !important;
  }

  .pkp_head_wrapper {
    display: flex !important;
    flex-direction: column !important;
    position: relative !important;
  }

  .pkp_site_name_wrapper {
    order: 1 !important;
    display: block !important;
    position: static !important;
    inset: auto !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    z-index: 3;
  }

  .pkp_site_name {
    display: block !important;
    position: static !important;
    inset: auto !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 1rem 1.1rem 0.9rem !important;
    text-align: left !important;
    overflow: visible !important;
    visibility: visible !important;
    opacity: 1 !important;
    transform: none !important;
    clip: auto !important;
    clip-path: none !important;
  }

  .pkp_site_name a,
  .pkp_site_name a.is_text,
  .pkp_site_name .is_text {
    display: block !important;
    position: static !important;
    width: 100% !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #FFFFFF !important;
    font-size: clamp(1.05rem, 5vw, 1.38rem) !important;
    font-weight: 700 !important;
    line-height: 1.22 !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  .pkp_site_name a.is_img,
  .pkp_site_name .is_img {
    display: block !important;
    width: 100% !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  .pkp_site_name a.is_img img,
  .pkp_site_name .is_img img {
    display: block !important;
    width: auto !important;
    max-width: 94% !important;
    max-height: 58px !important;
    margin: 0 !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  .pkp_navigation_primary_row {
    order: 2 !important;
    min-height: 0 !important;
    margin: 0 !important;
  }

  .pkp_site_nav_toggle {
    top: 0.55rem !important;
    right: 0.75rem !important;
  }
}

/* Extra-small phones */
@media (max-width: 480px) {
  .pkp_site_name {
    padding: 0.85rem 3.6rem 0.8rem 0.9rem !important;
  }

  .pkp_site_name a,
  .pkp_site_name a.is_text,
  .pkp_site_name .is_text {
    font-size: 1.02rem !important;
    line-height: 1.25 !important;
  }
}

/* =========================================================
   Mobile header spacing fix: keep the title clear of controls
   Added July 2026
   ========================================================= */
@media (max-width: 850px) {
  /* Reserve a dedicated left gutter for the hamburger/menu control. */
  .pkp_site_name_wrapper {
    box-sizing: border-box !important;
  }

  .pkp_site_name {
    box-sizing: border-box !important;
    min-height: 70px !important;
    padding: 0.78rem 1rem 0.78rem 4.35rem !important;
    display: flex !important;
    align-items: center !important;
  }

  .pkp_site_name a,
  .pkp_site_name a.is_text,
  .pkp_site_name .is_text {
    max-width: 100% !important;
    font-size: clamp(0.98rem, 4.35vw, 1.24rem) !important;
    line-height: 1.18 !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
  }

  /* Keep the mobile menu button fully inside its own gutter. */
  .pkp_site_nav_toggle {
    position: absolute !important;
    top: 50% !important;
    left: 0.8rem !important;
    right: auto !important;
    width: 44px !important;
    height: 44px !important;
    margin: 0 !important;
    transform: translateY(-50%) !important;
    z-index: 10 !important;
  }
}

@media (max-width: 480px) {
  .pkp_site_name {
    min-height: 66px !important;
    padding: 0.68rem 0.75rem 0.68rem 4rem !important;
  }

  .pkp_site_name a,
  .pkp_site_name a.is_text,
  .pkp_site_name .is_text {
    font-size: 0.96rem !important;
    line-height: 1.16 !important;
  }

  .pkp_site_nav_toggle {
    left: 0.55rem !important;
    width: 40px !important;
    height: 40px !important;
  }
}

/* =========================================================
   CJELT HOMEPAGE REFRESH
   Append-only overrides for the OJS journal homepage
   Added July 2026
   ========================================================= */

/* Keep these changes limited to the journal homepage. */
.page_index_journal {
  --cjelt-home-ink: #12324D;
  --cjelt-home-muted: #607386;
  --cjelt-home-line: #DDE7F0;
  --cjelt-home-surface: #FFFFFF;
  --cjelt-home-soft: #F5F8FC;
  --cjelt-home-teal: #128A9D;
  --cjelt-home-blue: #0B5EA8;
  --cjelt-home-shadow: 0 16px 42px rgba(16, 61, 94, 0.10);
  box-sizing: border-box;
  padding-top: 2rem;
  padding-bottom: 3.25rem;
}

/* A little more breathing room and a calmer page background. */
body:has(.page_index_journal) {
  background: var(--cjelt-home-soft);
}

body:has(.page_index_journal) .pkp_structure_content,
body:has(.page_index_journal) .pkp_structure_main {
  background: transparent !important;
}

body:has(.page_index_journal) .pkp_structure_main {
  padding-top: 0 !important;
}

/* Give the masthead a more finished edge without making it taller. */
body:has(.page_index_journal) .pkp_structure_head {
  box-shadow: 0 5px 20px rgba(11, 64, 113, 0.12);
}

@media (min-width: 851px) {
  body:has(.page_index_journal) .pkp_navigation_primary > li > a,
  body:has(.page_index_journal) .pkp_navigation_user > li > a {
    border-radius: 7px;
  }

  body:has(.page_index_journal) .pkp_navigation_primary > li > a:hover,
  body:has(.page_index_journal) .pkp_navigation_primary > li > a:focus,
  body:has(.page_index_journal) .pkp_navigation_user > li > a:hover,
  body:has(.page_index_journal) .pkp_navigation_user > li > a:focus {
    background: rgba(255, 255, 255, 0.14) !important;
  }
}

/* ---------------------------------------------------------
   Current issue: turn the sparse OJS block into an intentional
   issue spotlight card. This will still work once articles appear.
   --------------------------------------------------------- */
.page_index_journal .current_issue {
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
  margin: 0 0 2.25rem !important;
  padding: 1.55rem 1.75rem 1.45rem !important;
  border: 1px solid var(--cjelt-home-line);
  border-radius: 18px;
  background:
    radial-gradient(circle at 93% 12%, rgba(31, 175, 186, 0.14), transparent 26%),
    linear-gradient(135deg, #FFFFFF 0%, #F8FBFF 68%, #F1FAFB 100%);
  box-shadow: var(--cjelt-home-shadow);
}

.page_index_journal .current_issue::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 5px;
  background: linear-gradient(90deg, var(--cjelt-home-blue), var(--cjelt-home-teal));
}

.page_index_journal .current_issue h2 {
  margin: 0 0 0.9rem !important;
  padding: 0 !important;
  border: 0 !important;
  color: var(--cjelt-home-teal) !important;
  font-size: 0.8rem !important;
  line-height: 1.2;
  font-weight: 800;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.page_index_journal .current_issue .obj_issue_toc,
.page_index_journal .current_issue .heading {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

.page_index_journal .current_issue .title,
.page_index_journal .current_issue .heading .title,
.page_index_journal .current_issue .heading a {
  max-width: 760px;
  margin: 0 !important;
  color: var(--cjelt-home-ink) !important;
  font-size: clamp(1.2rem, 2vw, 1.55rem) !important;
  line-height: 1.3 !important;
  font-weight: 800 !important;
  text-decoration: none !important;
}

.page_index_journal .current_issue .description {
  max-width: 760px;
  margin-top: 0.7rem;
  color: var(--cjelt-home-muted);
}

.page_index_journal .current_issue .published {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  margin: 1rem 0 0 !important;
  padding: 0.36rem 0.65rem;
  border: 1px solid #D8E6F1;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.78);
  color: var(--cjelt-home-muted);
  font-size: 0.86rem;
  line-height: 1.3;
}

.page_index_journal .current_issue .published::before {
  content: "●";
  color: var(--cjelt-home-teal);
  font-size: 0.65rem;
}

.page_index_journal .current_issue .sections {
  margin-top: 1.5rem;
}

.page_index_journal .current_issue .read_more,
.page_index_journal .current_issue > a:last-child {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  margin-top: 1.15rem !important;
  padding: 0.62rem 0.9rem;
  border: 1px solid var(--cjelt-home-blue);
  border-radius: 8px;
  background: var(--cjelt-home-blue);
  color: #FFFFFF !important;
  font-size: 0.9rem;
  line-height: 1.2;
  font-weight: 800;
  text-decoration: none !important;
  box-shadow: 0 8px 18px rgba(11, 94, 168, 0.16);
  transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

.page_index_journal .current_issue .read_more:hover,
.page_index_journal .current_issue .read_more:focus,
.page_index_journal .current_issue > a:last-child:hover,
.page_index_journal .current_issue > a:last-child:focus {
  background: #084C89;
  transform: translateY(-1px);
  box-shadow: 0 10px 22px rgba(11, 94, 168, 0.22);
}

/* Remove the long separator line that makes the homepage feel skeletal. */
.page_index_journal .current_issue + .additional_content {
  margin-top: 0 !important;
  padding-top: 0 !important;
  border-top: 0 !important;
}

/* ---------------------------------------------------------
   Submission hero: retain the existing HTML, but make the card
   slightly tighter, richer, and less like a large flat rectangle.
   The !important rules are intentional because the current block
   contains inline presentation styles.
   --------------------------------------------------------- */
.page_index_journal .additional_content > div:first-child {
  position: relative;
  overflow: hidden;
  margin-top: 0 !important;
  margin-bottom: 2rem !important;
  padding: 2rem 2rem !important;
  border: 1px solid rgba(255, 255, 255, 0.22) !important;
  border-radius: 20px !important;
  background: linear-gradient(135deg, #0A4E83 0%, #0E7899 58%, #23A4AE 100%) !important;
  box-shadow: 0 18px 42px rgba(9, 73, 113, 0.18) !important;
}

.page_index_journal .additional_content > div:first-child::after {
  content: "";
  position: absolute;
  top: -100px;
  right: -90px;
  width: 270px;
  height: 270px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.08);
  pointer-events: none;
}

.page_index_journal .additional_content > div:first-child h2 {
  margin-top: 0.2rem !important;
  font-size: clamp(1.65rem, 3vw, 2.2rem) !important;
  line-height: 1.15 !important;
}

.page_index_journal .additional_content > div:first-child p {
  line-height: 1.55 !important;
}

.page_index_journal .additional_content img {
  border-radius: 14px;
}

/* General homepage cards and headings below the hero. */
.page_index_journal .additional_content h2,
.page_index_journal .additional_content h3 {
  text-wrap: balance;
}

.page_index_journal .additional_content > section,
.page_index_journal .additional_content > .cjelt-card,
.page_index_journal .additional_content > div:not(:first-child) {
  border-color: var(--cjelt-home-line);
}

.page_index_journal .cjelt-card,
.page_index_journal .cjelt-callout,
.page_index_journal .cjelt-sidebar-box {
  border-radius: 14px;
  background: #FFFFFF;
  box-shadow: 0 9px 28px rgba(16, 61, 94, 0.07);
}

.page_index_journal .cjelt-button,
.page_index_journal .cmp_button,
.page_index_journal .block_make_submission a {
  border-radius: 8px;
}

/* Keep the homepage comfortable on tablets and phones. */
@media (max-width: 850px) {
  .page_index_journal {
    padding-top: 1.25rem;
    padding-bottom: 2.25rem;
  }

  .page_index_journal .current_issue {
    padding: 1.3rem 1.2rem 1.25rem !important;
    border-radius: 15px;
  }

  .page_index_journal .additional_content > div:first-child {
    padding: 1.5rem 1.2rem !important;
    border-radius: 16px !important;
  }
}

@media (max-width: 560px) {
  .page_index_journal .current_issue .published {
    display: flex;
    width: fit-content;
  }

  .page_index_journal .current_issue .read_more,
  .page_index_journal .current_issue > a:last-child {
    width: 100%;
    justify-content: center;
    box-sizing: border-box;
  }
}

/* =========================================================
   CJELT CURRENT ISSUE CLEANUP
   Hide redundant homepage metadata and archive link
   Added July 2026
   ========================================================= */
.page_index_journal .current_issue .published,
.page_index_journal .current_issue .read_more {
  display: none !important;
}

/* Keep the simplified issue spotlight compact and balanced. */
.page_index_journal .current_issue {
  padding-bottom: 1.6rem !important;
}

.page_index_journal .current_issue .title,
.page_index_journal .current_issue .heading .title,
.page_index_journal .current_issue .heading a {
  margin-bottom: 0 !important;
}

/* =========================================================
   CJELT HOMEPAGE FOOTER SPACING
   Remove the oversized blank area between the final homepage
   content block and the footer divider.
   Added July 2026
   ========================================================= */

/* Remove stacked bottom spacing from the homepage containers. */
.page_index_journal {
  padding-bottom: 0.75rem !important;
}

.page_index_journal .additional_content {
  margin-bottom: 0 !important;
}

.page_index_journal .additional_content > div:first-child {
  margin-bottom: 0.75rem !important;
}

/* The footer is outside .page_index_journal, so target it through body. */
body:has(.page_index_journal) .pkp_structure_main {
  padding-bottom: 0 !important;
}

body:has(.page_index_journal) .pkp_structure_footer_wrapper {
  margin-top: 0 !important;
}

@media (max-width: 850px) {
  .page_index_journal {
    padding-bottom: 0.5rem !important;
  }

  .page_index_journal .additional_content > div:first-child {
    margin-bottom: 0.5rem !important;
  }
}

/* =========================================================
   CJELT COMPACT COPYRIGHT BAR
   Reduce excessive height in the colored footer strip while
   preserving comfortable spacing and mobile readability.
   Added July 2026
   ========================================================= */
.cjelt-footer-bottom {
  box-sizing: border-box;
  padding: 0.58rem 1rem !important;
  line-height: 1.32 !important;
}

/* OJS/global paragraph margins were making the strip look much taller. */
.cjelt-footer-bottom p {
  margin: 0 !important;
  padding: 0 !important;
  line-height: inherit !important;
}

@media (max-width: 560px) {
  .cjelt-footer-bottom {
    padding: 0.68rem 0.85rem !important;
    font-size: 0.8rem;
  }
}

/* =========================================================
   CJELT EXTRA-COMPACT COPYRIGHT BAR
   Final override: keep the colored footer strip slim on
   desktop while allowing safe wrapping on smaller screens.
   Added July 2026
   ========================================================= */
.cjelt-footer-bottom {
  box-sizing: border-box !important;
  min-height: 0 !important;
  height: auto !important;
  padding: 0.38rem 1rem !important;
  font-size: 0.78rem !important;
  line-height: 1.2 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Remove spacing or width limits from any nested footer content. */
.cjelt-footer-bottom > *,
.cjelt-footer-bottom p,
.cjelt-footer-bottom div {
  box-sizing: border-box !important;
  width: auto !important;
  max-width: none !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: inherit !important;
}

/* Keep the copyright statement on one slim line when space allows. */
@media (min-width: 851px) {
  .cjelt-footer-bottom,
  .cjelt-footer-bottom > *,
  .cjelt-footer-bottom p,
  .cjelt-footer-bottom div {
    white-space: nowrap !important;
  }
}

/* Permit wrapping on tablets and phones without restoring excess height. */
@media (max-width: 850px) {
  .cjelt-footer-bottom {
    padding: 0.48rem 0.75rem !important;
    font-size: 0.76rem !important;
    line-height: 1.25 !important;
  }

  .cjelt-footer-bottom,
  .cjelt-footer-bottom > *,
  .cjelt-footer-bottom p,
  .cjelt-footer-bottom div {
    white-space: normal !important;
  }
}

/* =========================================================
   CJELT ISSUE + ARTICLE PAGE REFRESH
   Clean card-based issue contents and a two-column article page
   Added September 2026
   ========================================================= */

/* Shared page-level colors. These stay inside issue/article pages so the
   existing homepage, header, navigation, and footer are left untouched. */
.page_issue,
.page_article {
  --cjelt-reader-ink: #16324A;
  --cjelt-reader-muted: #607386;
  --cjelt-reader-line: #DCE6EF;
  --cjelt-reader-soft: #F5F8FC;
  --cjelt-reader-blue: #0B5EA8;
  --cjelt-reader-blue-dark: #084A83;
  --cjelt-reader-teal: #148B9E;
  --cjelt-reader-teal-soft: #EAF7F8;
  --cjelt-reader-card: #FFFFFF;
  --cjelt-reader-shadow: 0 10px 28px rgba(20, 58, 88, 0.08);
}

.page_issue,
.page_article {
  color: var(--cjelt-reader-ink);
}

/* Breadcrumbs: quieter and more compact than the default OJS treatment. */
.page_issue .cmp_breadcrumbs,
.page_article .cmp_breadcrumbs {
  margin: 0 0 1rem !important;
  padding: 0 !important;
  color: var(--cjelt-reader-muted) !important;
  font-size: 0.84rem !important;
  line-height: 1.35;
}

.page_issue .cmp_breadcrumbs a,
.page_article .cmp_breadcrumbs a {
  color: var(--cjelt-reader-muted) !important;
  text-decoration: none !important;
}

.page_issue .cmp_breadcrumbs a:hover,
.page_issue .cmp_breadcrumbs a:focus,
.page_article .cmp_breadcrumbs a:hover,
.page_article .cmp_breadcrumbs a:focus {
  color: var(--cjelt-reader-blue) !important;
  text-decoration: underline !important;
}

/* =========================================================
   ISSUE PAGE
   ========================================================= */

.page_issue {
  padding-top: 1.1rem;
  padding-bottom: 2.5rem;
}

/* Issue header */
.page_issue .obj_issue_toc > .heading,
.page_issue .obj_issue_toc .heading {
  box-sizing: border-box;
  margin: 0 0 1.5rem !important;
  padding: 1.35rem 1.45rem !important;
  border: 1px solid var(--cjelt-reader-line) !important;
  border-top: 4px solid var(--cjelt-reader-teal) !important;
  border-radius: 12px !important;
  background: linear-gradient(135deg, #FFFFFF 0%, #F8FBFD 100%) !important;
  box-shadow: var(--cjelt-reader-shadow);
}

.page_issue .obj_issue_toc .heading .title,
.page_issue .obj_issue_toc .heading h1,
.page_issue .page_title {
  margin: 0 !important;
  color: var(--cjelt-reader-ink) !important;
  font-size: clamp(1.75rem, 3vw, 2.25rem) !important;
  line-height: 1.18 !important;
  font-weight: 800 !important;
  letter-spacing: -0.02em;
}

.page_issue .obj_issue_toc .heading .series,
.page_issue .obj_issue_toc .heading .published,
.page_issue .obj_issue_toc .heading .description {
  margin-top: 0.5rem !important;
  color: var(--cjelt-reader-muted) !important;
}

.page_issue .obj_issue_toc .heading .description {
  max-width: 78ch;
  line-height: 1.6;
}

/* Section headings */
.page_issue .obj_issue_toc .section {
  margin: 0 0 2rem !important;
}

.page_issue .obj_issue_toc .section > h2,
.page_issue .obj_issue_toc .section > h3,
.page_issue .obj_issue_toc .section .section_title {
  margin: 0 0 0.9rem !important;
  padding: 0 0 0.6rem !important;
  border-bottom: 2px solid var(--cjelt-reader-line) !important;
  color: var(--cjelt-reader-ink) !important;
  font-size: 1.08rem !important;
  line-height: 1.3 !important;
  font-weight: 800 !important;
}

.page_issue .obj_issue_toc .section > h2::after,
.page_issue .obj_issue_toc .section > h3::after,
.page_issue .obj_issue_toc .section .section_title::after {
  content: "";
  display: block;
  width: 54px;
  height: 3px;
  margin-top: 0.55rem;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--cjelt-reader-blue), var(--cjelt-reader-teal));
}

/* Two-column article-card grid, similar to the supplied reference layout. */
.page_issue .obj_issue_toc .section > .articles,
.page_issue .obj_issue_toc .section .articles {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.95rem !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.page_issue .obj_article_summary {
  position: relative;
  box-sizing: border-box;
  display: flex !important;
  flex-direction: column;
  min-width: 0;
  height: 100%;
  margin: 0 !important;
  padding: 1.05rem 1.1rem 1rem 1.2rem !important;
  border: 1px solid var(--cjelt-reader-line) !important;
  border-left: 4px solid var(--cjelt-reader-teal) !important;
  border-radius: 10px !important;
  background: var(--cjelt-reader-card) !important;
  box-shadow: 0 6px 18px rgba(20, 58, 88, 0.06);
  transition: transform 0.16s ease, box-shadow 0.16s ease, border-color 0.16s ease;
}

.page_issue .obj_article_summary:hover {
  transform: translateY(-2px);
  border-color: #C8D9E7 !important;
  box-shadow: 0 10px 24px rgba(20, 58, 88, 0.10);
}

/* Article title */
.page_issue .obj_article_summary .title {
  margin: 0 0 0.55rem !important;
  padding: 0 !important;
  color: var(--cjelt-reader-blue) !important;
  font-size: 1rem !important;
  line-height: 1.34 !important;
  font-weight: 800 !important;
}

.page_issue .obj_article_summary .title a,
.page_issue .obj_article_summary .title a:visited {
  color: var(--cjelt-reader-blue) !important;
  text-decoration: none !important;
}

.page_issue .obj_article_summary .title a:hover,
.page_issue .obj_article_summary .title a:focus {
  color: var(--cjelt-reader-blue-dark) !important;
  text-decoration: underline !important;
  text-decoration-thickness: 1px !important;
  text-underline-offset: 3px !important;
}

/* Authors and supporting metadata */
.page_issue .obj_article_summary .authors {
  margin: 0 0 0.55rem !important;
  color: var(--cjelt-reader-ink) !important;
  font-size: 0.88rem !important;
  line-height: 1.5 !important;
}

.page_issue .obj_article_summary .meta,
.page_issue .obj_article_summary .pages,
.page_issue .obj_article_summary .subtitle,
.page_issue .obj_article_summary .doi {
  color: var(--cjelt-reader-muted) !important;
  font-size: 0.82rem !important;
  line-height: 1.45 !important;
}

.page_issue .obj_article_summary .doi a,
.page_issue .obj_article_summary .doi a:visited {
  color: var(--cjelt-reader-blue) !important;
}

/* PDF/HTML galley buttons sit neatly at the bottom of each card. */
.page_issue .obj_article_summary .galleys_links,
.page_issue .obj_article_summary .galleys {
  margin-top: auto !important;
  padding-top: 0.8rem !important;
}

.page_issue .obj_article_summary .galleys_links {
  display: flex !important;
  flex-wrap: wrap;
  gap: 0.45rem;
}

.page_issue .obj_article_summary .obj_galley_link,
.page_issue .obj_article_summary .obj_galley_link:visited {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-height: 32px;
  margin: 0 !important;
  padding: 0.42rem 0.7rem !important;
  border: 1px solid var(--cjelt-reader-teal) !important;
  border-radius: 7px !important;
  background: var(--cjelt-reader-teal) !important;
  color: #FFFFFF !important;
  font-size: 0.78rem !important;
  line-height: 1.1 !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  box-shadow: none !important;
}

.page_issue .obj_article_summary .obj_galley_link:hover,
.page_issue .obj_article_summary .obj_galley_link:focus {
  border-color: #0F7485 !important;
  background: #0F7485 !important;
  color: #FFFFFF !important;
}

/* =========================================================
   ARTICLE DETAILS PAGE — STRUCTURE REPAIR + CLEAN READER LAYOUT
   Uses the actual OJS markup:
   .obj_article_details > .cmp_notification
   .obj_article_details > .page_title
   .obj_article_details > .subtitle
   .obj_article_details > .row > .main_entry + .entry_details
   Added September 2026
   ========================================================= */

.page_article {
  padding-top: 1rem;
  padding-bottom: 2.6rem;
}

/* The earlier version treated .main_entry and .entry_details as direct
   children of .obj_article_details. In OJS they sit inside .row. Turning
   .row into display:contents lets the real children participate in this grid. */
.page_article .obj_article_details {
  position: relative;
  box-sizing: border-box;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 300px;
  grid-template-areas:
    "notice notice"
    "title aside"
    "subtitle aside"
    "main aside";
  column-gap: 0;
  row-gap: 0;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid var(--cjelt-reader-line) !important;
  border-top: 4px solid var(--cjelt-reader-teal) !important;
  border-radius: 14px !important;
  background: #FFFFFF !important;
  box-shadow: var(--cjelt-reader-shadow) !important;
  overflow: hidden;
}

/* Preview/old-version notification must span the entire article card. */
.page_article .obj_article_details > .cmp_notification,
.page_article .obj_article_details > .cmp_notification.notice {
  grid-area: notice;
  box-sizing: border-box;
  width: 100% !important;
  min-height: 0 !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0.8rem 1.2rem !important;
  border: 0 !important;
  border-bottom: 1px solid #DCE6EF !important;
  border-radius: 0 !important;
  background: #F1F5F8 !important;
  color: #425C70 !important;
  font-size: 0.86rem !important;
  line-height: 1.45 !important;
}

.page_article .obj_article_details > .cmp_notification a,
.page_article .obj_article_details > .cmp_notification a:visited {
  color: var(--cjelt-reader-blue) !important;
  font-weight: 700;
}

/* OJS article title sits directly inside .obj_article_details. */
.page_article .obj_article_details > .page_title {
  grid-area: title;
  box-sizing: border-box;
  width: auto !important;
  max-width: none !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 1.5rem 1.65rem 0.65rem !important;
  color: var(--cjelt-reader-ink) !important;
  background: #FFFFFF !important;
  font-size: clamp(1.72rem, 2.7vw, 2.2rem) !important;
  line-height: 1.16 !important;
  font-weight: 800 !important;
  letter-spacing: -0.022em;
  text-wrap: balance;
  overflow-wrap: break-word;
  word-break: normal;
}

.page_article .obj_article_details > .subtitle {
  grid-area: subtitle;
  box-sizing: border-box;
  width: auto !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 1.65rem 0.85rem !important;
  color: #516A7D !important;
  background: #FFFFFF !important;
  font-size: 1rem !important;
  line-height: 1.5 !important;
  font-weight: 500 !important;
}

/* Critical OJS reset: the default theme floats .main_entry and .entry_details
   inside .row. We remove those floats/widths and let the parent grid control it. */
.page_article .obj_article_details > .row {
  display: contents !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

.page_article .obj_article_details .main_entry {
  grid-area: main;
  float: none !important;
  box-sizing: border-box;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 1.65rem 1.65rem !important;
  border: 0 !important;
  background: #FFFFFF !important;
}

.page_article .obj_article_details .entry_details {
  grid-area: aside;
  float: none !important;
  align-self: stretch;
  box-sizing: border-box;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 1.45rem 1.2rem 1.5rem !important;
  border: 0 !important;
  border-left: 1px solid var(--cjelt-reader-line) !important;
  background: linear-gradient(180deg, #F8FBFD 0%, #F3F8FB 100%) !important;
  overflow-wrap: anywhere;
}

/* Authors sit directly under the title as the first item in main_entry. */
.page_article .obj_article_details .main_entry > .item.authors {
  margin: 0 !important;
  padding: 0.25rem 0 1.05rem !important;
  border-top: 0 !important;
  border-bottom: 1px solid var(--cjelt-reader-line) !important;
}

.page_article .obj_article_details ul.authors {
  display: flex !important;
  flex-wrap: wrap;
  gap: 0.65rem 1rem;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.page_article .obj_article_details ul.authors > li {
  box-sizing: border-box;
  margin: 0 !important;
  padding: 0 !important;
  min-width: 0;
  color: #385268 !important;
  font-size: 0.88rem !important;
  line-height: 1.4 !important;
}

.page_article .obj_article_details ul.authors .name {
  display: inline !important;
  color: var(--cjelt-reader-ink) !important;
  font-weight: 750 !important;
}

.page_article .obj_article_details ul.authors .affiliation,
.page_article .obj_article_details ul.authors .contributor_roles,
.page_article .obj_article_details ul.authors .orcid {
  display: block !important;
  margin-top: 0.12rem;
  color: var(--cjelt-reader-muted) !important;
  font-size: 0.76rem !important;
  line-height: 1.35 !important;
}

.page_article .obj_article_details ul.authors a,
.page_article .obj_article_details ul.authors a:visited {
  color: var(--cjelt-reader-blue) !important;
  text-decoration: none !important;
}

/* Main article sections */
.page_article .obj_article_details .main_entry > .item:not(.authors) {
  box-sizing: border-box;
  width: 100% !important;
  margin: 0 !important;
  padding: 1.15rem 0 0 !important;
  border: 0 !important;
}

.page_article .obj_article_details .main_entry > .item:not(.authors) + .item {
  margin-top: 1rem !important;
  border-top: 1px solid var(--cjelt-reader-line) !important;
}

.page_article .obj_article_details .main_entry .item .label {
  display: block !important;
  margin: 0 0 0.55rem !important;
  color: var(--cjelt-reader-ink) !important;
  font-size: 0.98rem !important;
  line-height: 1.3 !important;
  font-weight: 800 !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
}

.page_article .obj_article_details .main_entry .item.doi .label,
.page_article .obj_article_details .main_entry .item.keywords .label {
  display: block !important;
}

.page_article .obj_article_details .abstract,
.page_article .obj_article_details .abstract p,
.page_article .obj_article_details .main_entry p,
.page_article .obj_article_details .main_entry li {
  max-width: none !important;
  color: #2A4357 !important;
  font-size: 0.94rem !important;
  line-height: 1.68 !important;
}

.page_article .obj_article_details .abstract p:first-child,
.page_article .obj_article_details .main_entry .value > p:first-child {
  margin-top: 0 !important;
}

.page_article .obj_article_details .abstract p:last-child,
.page_article .obj_article_details .main_entry .value > p:last-child {
  margin-bottom: 0 !important;
}

/* Keywords: keep them compact even when OJS renders plain text rather than links. */
.page_article .obj_article_details .item.keywords .value {
  color: #486075 !important;
  font-size: 0.86rem !important;
  line-height: 1.55 !important;
}

.page_article .obj_article_details .item.keywords .value a,
.page_article .obj_article_details .item.keywords .value span {
  display: inline-block;
  margin: 0.12rem 0.18rem 0.12rem 0 !important;
  padding: 0.28rem 0.52rem !important;
  border: 1px solid #D8E5EE;
  border-radius: 999px;
  background: #F7FAFC;
  color: #476177 !important;
  font-size: 0.78rem !important;
  line-height: 1.2 !important;
}

/* References */
.page_article .obj_article_details .item.references,
.page_article .obj_article_details .item.references p,
.page_article .obj_article_details .item.references li {
  font-size: 0.87rem !important;
  line-height: 1.58 !important;
}

/* Right-hand publication/download column */
.page_article .obj_article_details .entry_details > .item {
  box-sizing: border-box;
  width: 100% !important;
  margin: 0 !important;
  padding: 0.78rem 0 !important;
  border: 0 !important;
  border-bottom: 1px solid #DFE9F1 !important;
}

.page_article .obj_article_details .entry_details > .item:first-child {
  padding-top: 0 !important;
}

.page_article .obj_article_details .entry_details > .item:last-child {
  border-bottom: 0 !important;
}

.page_article .obj_article_details .entry_details .label,
.page_article .obj_article_details .entry_details h2,
.page_article .obj_article_details .entry_details h3 {
  display: block;
  margin: 0 0 0.3rem !important;
  color: #3C556A !important;
  font-size: 0.74rem !important;
  line-height: 1.3 !important;
  font-weight: 800 !important;
  letter-spacing: 0.045em;
  text-transform: uppercase;
}

.page_article .obj_article_details .entry_details .value,
.page_article .obj_article_details .entry_details p,
.page_article .obj_article_details .entry_details li {
  margin-top: 0;
  color: #486075 !important;
  font-size: 0.84rem !important;
  line-height: 1.48 !important;
}

.page_article .obj_article_details .entry_details a,
.page_article .obj_article_details .entry_details a:visited {
  color: var(--cjelt-reader-blue) !important;
}

/* PDF / galley links */
.page_article .obj_article_details .entry_details .galleys_links,
.page_article .obj_article_details .entry_details .supplementary_galleys_links {
  display: grid !important;
  gap: 0.45rem;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.page_article .obj_article_details .entry_details .galleys_links li,
.page_article .obj_article_details .entry_details .supplementary_galleys_links li {
  margin: 0 !important;
  padding: 0 !important;
}

.page_article .obj_article_details .entry_details .obj_galley_link,
.page_article .obj_article_details .entry_details .obj_galley_link:visited {
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 100% !important;
  box-sizing: border-box;
  margin: 0 !important;
  padding: 0.7rem 0.8rem !important;
  border: 1px solid var(--cjelt-reader-teal) !important;
  border-radius: 7px !important;
  background: var(--cjelt-reader-teal) !important;
  color: #FFFFFF !important;
  font-size: 0.84rem !important;
  line-height: 1.2 !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  box-shadow: none !important;
}

.page_article .obj_article_details .entry_details .obj_galley_link:hover,
.page_article .obj_article_details .entry_details .obj_galley_link:focus {
  border-color: #0F7485 !important;
  background: #0F7485 !important;
  color: #FFFFFF !important;
}

/* DOI/citation URLs */
.page_article .obj_article_details .item.doi a,
.page_article .obj_article_details .citation_display,
.page_article .obj_article_details .citation_display a {
  overflow-wrap: anywhere;
  word-break: break-word;
}

/* License/copyright content stays secondary. */
.page_article .obj_article_details .item.copyright,
.page_article .obj_article_details .item.license {
  color: var(--cjelt-reader-muted) !important;
  font-size: 0.8rem !important;
  line-height: 1.5 !important;
}

/* Prevent cover images or metadata from forcing the sidebar wider. */
.page_article .obj_article_details .entry_details img {
  max-width: 100% !important;
  height: auto !important;
}

/* =========================================================
   RESPONSIVE READER PAGES
   ========================================================= */

@media (max-width: 960px) {
  .page_article .obj_article_details {
    grid-template-columns: minmax(0, 1fr) 270px;
  }
}

@media (max-width: 850px) {
  .page_issue,
  .page_article {
    padding-top: 0.7rem;
    padding-bottom: 1.8rem;
  }

  .page_issue .obj_issue_toc .section > .articles,
  .page_issue .obj_issue_toc .section .articles {
    grid-template-columns: 1fr;
  }

  .page_article .obj_article_details {
    display: block !important;
    width: 100% !important;
    border-radius: 11px !important;
  }

  .page_article .obj_article_details > .row {
    display: block !important;
    margin: 0 !important;
  }

  .page_article .obj_article_details > .page_title {
    padding: 1.25rem 1.15rem 0.6rem !important;
    font-size: clamp(1.48rem, 6vw, 1.9rem) !important;
  }

  .page_article .obj_article_details > .subtitle {
    padding: 0 1.15rem 0.8rem !important;
  }

  .page_article .obj_article_details .main_entry {
    width: 100% !important;
    padding: 0 1.15rem 1.25rem !important;
  }

  .page_article .obj_article_details .entry_details {
    width: 100% !important;
    padding: 1.1rem 1.15rem 1.2rem !important;
    border-left: 0 !important;
    border-top: 1px solid var(--cjelt-reader-line) !important;
  }

  .page_article .obj_article_details ul.authors {
    display: block !important;
  }

  .page_article .obj_article_details ul.authors > li + li {
    margin-top: 0.55rem !important;
  }
}

@media (max-width: 560px) {
  .page_issue .obj_issue_toc > .heading,
  .page_issue .obj_issue_toc .heading {
    padding: 1.05rem 1rem !important;
    border-radius: 9px !important;
  }

  .page_issue .obj_article_summary {
    padding: 0.95rem 0.95rem 0.9rem 1rem !important;
    border-radius: 8px !important;
  }

  .page_article .obj_article_details {
    box-shadow: 0 5px 16px rgba(20, 58, 88, 0.06) !important;
  }

  .page_article .obj_article_details > .cmp_notification,
  .page_article .obj_article_details > .cmp_notification.notice {
    padding: 0.7rem 0.9rem !important;
    font-size: 0.8rem !important;
  }

  .page_article .obj_article_details .abstract,
  .page_article .obj_article_details .abstract p,
  .page_article .obj_article_details .main_entry p {
    font-size: 0.91rem !important;
    line-height: 1.64 !important;
  }
}

/* =========================================================
   CJELT ARTICLE REFINEMENT v3
   Author cleanup, stronger PDF action, cleaner citation panel
   Added September 2026
   ========================================================= */

/* ---------------------------------------------------------
   AUTHORS
   Keep the public author block to name + affiliation (+ ORCID if present).
   OJS contributor/credit role labels such as "Author" or "Editor" are useful
   metadata, but visually redundant on the public article landing page.
   --------------------------------------------------------- */
.page_article .obj_article_details ul.authors .contributor_roles,
.page_article .obj_article_details ul.authors .credit_roles {
  display: none !important;
}

.page_article .obj_article_details ul.authors > li {
  padding-bottom: 0.08rem !important;
}

.page_article .obj_article_details ul.authors .name {
  display: block !important;
  margin-bottom: 0.08rem !important;
  color: var(--cjelt-reader-ink) !important;
  font-size: 0.9rem !important;
  line-height: 1.32 !important;
  font-weight: 800 !important;
}

.page_article .obj_article_details ul.authors .affiliation {
  display: block !important;
  margin-top: 0 !important;
  color: #6B7F90 !important;
  font-size: 0.76rem !important;
  line-height: 1.4 !important;
}

.page_article .obj_article_details ul.authors .orcid {
  display: block !important;
  margin-top: 0.12rem !important;
  font-size: 0.73rem !important;
  line-height: 1.3 !important;
}

/* ---------------------------------------------------------
   PDF / FULL-TEXT ACTION
   Make the primary galley unmistakably actionable while staying inside the
   existing CJELT blue-teal visual system.
   --------------------------------------------------------- */
.page_article .obj_article_details .entry_details .item.galleys {
  padding: 0 0 1rem !important;
  border-bottom: 1px solid #DCE7EF !important;
}

.page_article .obj_article_details .entry_details .obj_galley_link,
.page_article .obj_article_details .entry_details .obj_galley_link:visited {
  min-height: 52px !important;
  padding: 0.9rem 1rem !important;
  border: 0 !important;
  border-radius: 10px !important;
  background: linear-gradient(135deg, var(--cjelt-reader-blue) 0%, var(--cjelt-reader-teal) 100%) !important;
  color: #FFFFFF !important;
  font-size: 0.94rem !important;
  line-height: 1.2 !important;
  font-weight: 800 !important;
  letter-spacing: 0.01em !important;
  box-shadow: 0 8px 18px rgba(11, 94, 168, 0.20) !important;
  transition: transform 0.15s ease, box-shadow 0.15s ease, filter 0.15s ease !important;
}

.page_article .obj_article_details .entry_details .obj_galley_link:hover,
.page_article .obj_article_details .entry_details .obj_galley_link:focus {
  background: linear-gradient(135deg, #084F90 0%, #0E7889 100%) !important;
  color: #FFFFFF !important;
  transform: translateY(-1px);
  box-shadow: 0 11px 23px rgba(11, 94, 168, 0.25) !important;
}

.page_article .obj_article_details .entry_details .obj_galley_link:focus-visible {
  outline: 3px solid rgba(20, 139, 158, 0.24) !important;
  outline-offset: 3px !important;
}

/* Preserve OJS's file icon but give it a little more separation. */
.page_article .obj_article_details .entry_details .obj_galley_link::before {
  margin-right: 0.45rem !important;
  font-size: 1.04em !important;
}

/* ---------------------------------------------------------
   HOW TO CITE / CITATION STYLE LANGUAGE PLUGIN
   CSS can improve presentation, wrapping, and controls. The actual citation
   text is generated by OJS/CSL and cannot be corrected by CSS.
   --------------------------------------------------------- */
.page_article .obj_article_details .citation_display {
  display: block !important;
  box-sizing: border-box !important;
  width: 100% !important;
  margin: 0.35rem 0 0.65rem !important;
  padding: 0.8rem 0.85rem !important;
  border: 1px solid #DCE7EF !important;
  border-radius: 8px !important;
  background: #FFFFFF !important;
  color: #3E586D !important;
  font-size: 0.8rem !important;
  line-height: 1.52 !important;
  overflow-wrap: anywhere !important;
  word-break: normal !important;
}

.page_article .obj_article_details .citation_display p,
.page_article .obj_article_details .citation_display div,
.page_article .obj_article_details .citation_display span {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  font-size: inherit !important;
  line-height: inherit !important;
}

/* Common CSL/OJS controls across 3.x releases and theme variants. */
.page_article .obj_article_details .citation_formats,
.page_article .obj_article_details .citation_formats_button,
.page_article .obj_article_details .citation_formats button,
.page_article .obj_article_details button.citation_formats,
.page_article .obj_article_details .citation_formats a,
.page_article .obj_article_details .citation_formats select {
  box-sizing: border-box !important;
  max-width: 100% !important;
  border-radius: 7px !important;
  font-family: "Noto Sans", Arial, Helvetica, sans-serif !important;
}

.page_article .obj_article_details .citation_formats_button,
.page_article .obj_article_details .citation_formats > button,
.page_article .obj_article_details button.citation_formats {
  width: 100% !important;
  min-height: 38px !important;
  padding: 0.56rem 0.72rem !important;
  border: 1px solid #BFCED9 !important;
  background: #FFFFFF !important;
  color: #36536A !important;
  font-size: 0.76rem !important;
  line-height: 1.2 !important;
  font-weight: 800 !important;
  letter-spacing: 0.035em !important;
  text-transform: uppercase !important;
  box-shadow: none !important;
}

.page_article .obj_article_details .citation_formats_button:hover,
.page_article .obj_article_details .citation_formats_button:focus,
.page_article .obj_article_details .citation_formats > button:hover,
.page_article .obj_article_details .citation_formats > button:focus,
.page_article .obj_article_details button.citation_formats:hover,
.page_article .obj_article_details button.citation_formats:focus {
  border-color: var(--cjelt-reader-teal) !important;
  background: var(--cjelt-reader-teal-soft) !important;
  color: #0D6070 !important;
}

.page_article .obj_article_details .citation_formats select {
  width: 100% !important;
  min-height: 38px !important;
  padding: 0.45rem 0.55rem !important;
  border: 1px solid #C8D6E0 !important;
  background: #FFFFFF !important;
  color: #355168 !important;
  font-size: 0.8rem !important;
}

.page_article .obj_article_details .citation_formats_list,
.page_article .obj_article_details .citation_formats_styles,
.page_article .obj_article_details .citation_formats .dropdown-menu {
  box-sizing: border-box !important;
  max-width: 100% !important;
  border: 1px solid #D7E3EC !important;
  border-radius: 8px !important;
  background: #FFFFFF !important;
  box-shadow: 0 10px 24px rgba(20, 58, 88, 0.12) !important;
}

.page_article .obj_article_details .citation_formats_list a,
.page_article .obj_article_details .citation_formats_styles a,
.page_article .obj_article_details .citation_formats .dropdown-menu a {
  display: block !important;
  padding: 0.48rem 0.65rem !important;
  color: var(--cjelt-reader-blue) !important;
  font-size: 0.79rem !important;
  line-height: 1.3 !important;
  text-decoration: none !important;
}

.page_article .obj_article_details .citation_formats_list a:hover,
.page_article .obj_article_details .citation_formats_list a:focus,
.page_article .obj_article_details .citation_formats_styles a:hover,
.page_article .obj_article_details .citation_formats_styles a:focus,
.page_article .obj_article_details .citation_formats .dropdown-menu a:hover,
.page_article .obj_article_details .citation_formats .dropdown-menu a:focus {
  background: #F1F8FA !important;
  color: var(--cjelt-reader-blue-dark) !important;
}

/* ---------------------------------------------------------
   REFERENCES
   Keep the references visually subordinate to the abstract. A true click-to-
   show/hide control needs an interactive element in the OJS template (such as
   <details>/<summary>) or JavaScript; CSS alone cannot create persistent state.
   --------------------------------------------------------- */
.page_article .obj_article_details .item.references {
  margin-top: 1.2rem !important;
  padding-top: 1rem !important;
  border-top: 1px solid var(--cjelt-reader-line) !important;
}

.page_article .obj_article_details .item.references > .label {
  margin-bottom: 0.65rem !important;
  color: #405B70 !important;
  font-size: 0.92rem !important;
}

.page_article .obj_article_details .item.references .value {
  color: #4A6174 !important;
}

.page_article .obj_article_details .item.references .value p {
  margin: 0 0 0.82rem !important;
  padding-left: 1.05rem !important;
  text-indent: -1.05rem !important;
  font-size: 0.83rem !important;
  line-height: 1.55 !important;
}

.page_article .obj_article_details .item.references .value p:last-child {
  margin-bottom: 0 !important;
}

@media (max-width: 850px) {
  .page_article .obj_article_details .entry_details .obj_galley_link,
  .page_article .obj_article_details .entry_details .obj_galley_link:visited {
    min-height: 50px !important;
    font-size: 0.92rem !important;
  }

  .page_article .obj_article_details .citation_display {
    font-size: 0.79rem !important;
  }
}

/* =========================================================
   CJELT ARTICLE REFINEMENT v4
   Robust contributor-role cleanup + reference/citation safeguards
   Added September 2026
   ========================================================= */

/* ---------------------------------------------------------
   AUTHOR ROLE CLEANUP
   OJS/theme versions vary in how contributor roles are wrapped.
   Hide only role/credit labels while preserving name, affiliation, and ORCID.
   --------------------------------------------------------- */
.page_article .obj_article_details .item.authors .contributor_roles,
.page_article .obj_article_details .item.authors .contributor_role,
.page_article .obj_article_details .item.authors .credit_roles,
.page_article .obj_article_details .item.authors .credit_role,
.page_article .obj_article_details .item.authors [class*="contributor_role"],
.page_article .obj_article_details .item.authors [class*="credit_role"],
.page_article .obj_article_details ul.authors > li > .contributor_roles,
.page_article .obj_article_details ul.authors > li > .contributor_role,
.page_article .obj_article_details ul.authors > li > .credit_roles,
.page_article .obj_article_details ul.authors > li > .credit_role {
  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;
  overflow: hidden !important;
}

/* Older/custom OJS templates may output the contributor role as a direct
   generic .value span inside each author list item. Names, affiliations,
   and ORCID use their own classes, so this catches the redundant role label
   without suppressing the visible author information. */
.page_article .obj_article_details .item.authors ul.authors > li > span.value:not(.name):not(.affiliation):not(.orcid) {
  display: none !important;
}

/* Tighten the author rows after role labels are removed. */
.page_article .obj_article_details .item.authors ul.authors > li {
  margin-bottom: 0.68rem !important;
  padding-bottom: 0 !important;
}

.page_article .obj_article_details .item.authors ul.authors > li:last-child {
  margin-bottom: 0 !important;
}

/* ---------------------------------------------------------
   REFERENCES
   CSS cannot create a persistent click-to-open/click-to-close state unless
   the page markup includes an interactive element (e.g., details/summary or
   a checkbox/button controlled by JavaScript). Keep the standard OJS output
   readable for now, and style native details/summary automatically if the
   template is enhanced later.
   --------------------------------------------------------- */
.page_article .obj_article_details .item.references details {
  margin: 0 !important;
  border: 1px solid #DCE7EF !important;
  border-radius: 9px !important;
  background: #FBFDFE !important;
  overflow: hidden !important;
}

.page_article .obj_article_details .item.references details > summary {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 0.75rem !important;
  cursor: pointer !important;
  list-style: none !important;
  padding: 0.72rem 0.85rem !important;
  color: #294B63 !important;
  background: #F4F9FB !important;
  font-size: 0.86rem !important;
  line-height: 1.25 !important;
  font-weight: 800 !important;
}

.page_article .obj_article_details .item.references details > summary::-webkit-details-marker {
  display: none !important;
}

.page_article .obj_article_details .item.references details > summary::after {
  content: "+";
  flex: 0 0 auto;
  color: var(--cjelt-reader-teal) !important;
  font-size: 1.1rem !important;
  font-weight: 900 !important;
}

.page_article .obj_article_details .item.references details[open] > summary::after {
  content: "−";
}

.page_article .obj_article_details .item.references details > .value,
.page_article .obj_article_details .item.references details > div {
  padding: 0.85rem !important;
}

/* ---------------------------------------------------------
   HOW TO CITE
   Protect the citation box from theme overflow. Citation text itself is
   generated by the Citation Style Language plugin and its metadata; CSS can
   style it but cannot repair incorrect author/order/style data.
   --------------------------------------------------------- */
.page_article .obj_article_details .entry_details .item.citation,
.page_article .obj_article_details .entry_details .item.citation_style,
.page_article .obj_article_details .entry_details [class*="citation"] {
  min-width: 0 !important;
  max-width: 100% !important;
  overflow-wrap: anywhere !important;
}

.page_article .obj_article_details .citation_display,
.page_article .obj_article_details .citation_display * {
  max-width: 100% !important;
  overflow-wrap: anywhere !important;
  word-break: normal !important;
}


/* =========================================================
   CJELT ARTICLE REFINEMENT v5
   Wider desktop reader + larger typography + robust role hiding
   Added September 2026
   ========================================================= */

/* ---------------------------------------------------------
   DESKTOP READER WIDTH
   Use more of the available desktop screen without making lines excessively
   long. The article card grows from the journal-wide 1120px cap to 1320px.
   --------------------------------------------------------- */
@media (min-width: 1100px) {
  body:has(.page_article) .pkp_structure_content {
    box-sizing: border-box !important;
    width: calc(100% - 64px) !important;
    max-width: 1320px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  body:has(.page_article) .pkp_structure_main {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: none !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  .page_article {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: none !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .page_article .obj_article_details {
    grid-template-columns: minmax(0, 1fr) 335px !important;
  }
}

/* Slightly narrower desktops still receive a useful amount of breathing room. */
@media (min-width: 851px) and (max-width: 1099px) {
  body:has(.page_article) .pkp_structure_content {
    width: calc(100% - 40px) !important;
    max-width: 1000px !important;
  }
}

/* ---------------------------------------------------------
   ARTICLE TYPOGRAPHY
   Increase reading size at normal 100% browser zoom while preserving the
   hierarchy between title, body text, metadata, and the sidebar.
   --------------------------------------------------------- */
.page_article .cmp_breadcrumbs {
  font-size: 0.93rem !important;
  line-height: 1.45 !important;
  margin-bottom: 1.35rem !important;
}

.page_article .obj_article_details > .cmp_notification,
.page_article .obj_article_details > .cmp_notification.notice {
  padding: 0.88rem 1.35rem !important;
  font-size: 0.93rem !important;
  line-height: 1.45 !important;
}

.page_article .obj_article_details > .page_title {
  padding: 1.65rem 1.85rem 0.72rem !important;
  font-size: clamp(1.95rem, 2.55vw, 2.5rem) !important;
  line-height: 1.15 !important;
}

.page_article .obj_article_details > .subtitle {
  padding: 0 1.85rem 0.95rem !important;
  font-size: 1.08rem !important;
  line-height: 1.5 !important;
}

.page_article .obj_article_details .main_entry {
  padding: 0 1.85rem 1.85rem !important;
}

.page_article .obj_article_details .entry_details {
  padding: 1.55rem 1.35rem 1.65rem !important;
}

/* Author names and affiliations should be comfortably readable. */
.page_article .obj_article_details ul.authors > li {
  font-size: 0.98rem !important;
  line-height: 1.45 !important;
}

.page_article .obj_article_details ul.authors .name {
  margin-bottom: 0.12rem !important;
  font-size: 1.02rem !important;
  line-height: 1.35 !important;
  font-weight: 800 !important;
}

.page_article .obj_article_details ul.authors .affiliation {
  margin-top: 0 !important;
  font-size: 0.86rem !important;
  line-height: 1.45 !important;
}

.page_article .obj_article_details ul.authors .orcid {
  font-size: 0.82rem !important;
  line-height: 1.4 !important;
}

/* Main reading column. */
.page_article .obj_article_details .main_entry .item .label {
  margin-bottom: 0.62rem !important;
  font-size: 1.06rem !important;
  line-height: 1.32 !important;
}

.page_article .obj_article_details .abstract,
.page_article .obj_article_details .abstract p,
.page_article .obj_article_details .main_entry p,
.page_article .obj_article_details .main_entry li {
  font-size: 1.03rem !important;
  line-height: 1.72 !important;
}

.page_article .obj_article_details .item.keywords .value {
  font-size: 0.96rem !important;
  line-height: 1.62 !important;
}

.page_article .obj_article_details .item.keywords .value a,
.page_article .obj_article_details .item.keywords .value span {
  font-size: 0.86rem !important;
}

/* References remain a little quieter than the abstract, but no longer tiny. */
.page_article .obj_article_details .item.references,
.page_article .obj_article_details .item.references p,
.page_article .obj_article_details .item.references li,
.page_article .obj_article_details .item.references .value p {
  font-size: 0.93rem !important;
  line-height: 1.62 !important;
}

/* Sidebar metadata. */
.page_article .obj_article_details .entry_details .label,
.page_article .obj_article_details .entry_details h2,
.page_article .obj_article_details .entry_details h3 {
  font-size: 0.8rem !important;
  line-height: 1.35 !important;
}

.page_article .obj_article_details .entry_details .value,
.page_article .obj_article_details .entry_details p,
.page_article .obj_article_details .entry_details li {
  font-size: 0.91rem !important;
  line-height: 1.55 !important;
}

.page_article .obj_article_details .item.copyright,
.page_article .obj_article_details .item.license {
  font-size: 0.9rem !important;
  line-height: 1.55 !important;
}

/* Keep the primary full-text action visually obvious at the larger scale. */
.page_article .obj_article_details .entry_details .obj_galley_link,
.page_article .obj_article_details .entry_details .obj_galley_link:visited {
  min-height: 56px !important;
  padding: 0.95rem 1.05rem !important;
  font-size: 1rem !important;
}

/* Citation UI should scale with the rest of the sidebar. */
.page_article .obj_article_details .citation_display {
  font-size: 0.88rem !important;
  line-height: 1.58 !important;
}

.page_article .obj_article_details .citation_formats_button,
.page_article .obj_article_details .citation_formats > button,
.page_article .obj_article_details button.citation_formats,
.page_article .obj_article_details .citation_formats select {
  font-size: 0.84rem !important;
}

/* ---------------------------------------------------------
   HIDE CONTRIBUTOR ROLE WORDS
   Preserve the underlying metadata for OJS/CSL, but remove redundant public
   labels such as Author, Translator, Editor, etc. from the author display.
   --------------------------------------------------------- */
.page_article .obj_article_details .authors .contributor_roles,
.page_article .obj_article_details .authors .credit_roles,
.page_article .obj_article_details .authors .contributor_role,
.page_article .obj_article_details .authors .credit_role,
.page_article .obj_article_details .authors [class*="contributor_role"],
.page_article .obj_article_details .authors [class*="credit_role"],
.page_article .obj_article_details .authors [class~="role"],
.page_article .obj_article_details ul.authors > li > .value:not(.name):not(.affiliation):not(.orcid) {
  display: none !important;
  visibility: hidden !important;
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: -1px !important;
  padding: 0 !important;
  border: 0 !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
  font-size: 0 !important;
  line-height: 0 !important;
}

.page_article .obj_article_details .authors .contributor_roles *,
.page_article .obj_article_details .authors .credit_roles *,
.page_article .obj_article_details .authors [class*="contributor_role"] *,
.page_article .obj_article_details .authors [class*="credit_role"] * {
  display: none !important;
}

/* ---------------------------------------------------------
   READY-TO-USE COLLAPSIBLE PANELS
   OJS currently renders References and License as ordinary section/div markup.
   CSS cannot add a real click state to those elements. If the OJS template is
   later wrapped in <details><summary>...</summary>...</details>, these rules
   immediately create the requested Show/Hide interface.
   --------------------------------------------------------- */
.page_article .obj_article_details .item.references details,
.page_article .obj_article_details .entry_details .item.copyright details,
.page_article .obj_article_details .entry_details .item.license details {
  margin: 0 !important;
  border: 1px solid #D9E6EE !important;
  border-radius: 9px !important;
  background: #FFFFFF !important;
  overflow: hidden !important;
}

.page_article .obj_article_details .item.references details > summary,
.page_article .obj_article_details .entry_details .item.copyright details > summary,
.page_article .obj_article_details .entry_details .item.license details > summary {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 0.75rem !important;
  cursor: pointer !important;
  list-style: none !important;
  padding: 0.78rem 0.9rem !important;
  background: #F3F8FB !important;
  color: #294B63 !important;
  font-size: 0.92rem !important;
  line-height: 1.3 !important;
  font-weight: 800 !important;
}

.page_article .obj_article_details .item.references details > summary::-webkit-details-marker,
.page_article .obj_article_details .entry_details .item.copyright details > summary::-webkit-details-marker,
.page_article .obj_article_details .entry_details .item.license details > summary::-webkit-details-marker {
  display: none !important;
}

.page_article .obj_article_details .item.references details > summary::after,
.page_article .obj_article_details .entry_details .item.copyright details > summary::after,
.page_article .obj_article_details .entry_details .item.license details > summary::after {
  content: "+ Show";
  flex: 0 0 auto;
  color: var(--cjelt-reader-teal) !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
}

.page_article .obj_article_details .item.references details[open] > summary::after,
.page_article .obj_article_details .entry_details .item.copyright details[open] > summary::after,
.page_article .obj_article_details .entry_details .item.license details[open] > summary::after {
  content: "− Hide";
}

.page_article .obj_article_details .item.references details > .value,
.page_article .obj_article_details .item.references details > div:not(summary),
.page_article .obj_article_details .entry_details .item.copyright details > div,
.page_article .obj_article_details .entry_details .item.license details > div {
  padding: 0.9rem !important;
}

/* Keep the larger desktop typography sensible after the single-column switch. */
@media (max-width: 850px) {
  .page_article .obj_article_details > .page_title {
    padding: 1.3rem 1.15rem 0.65rem !important;
    font-size: clamp(1.55rem, 6vw, 1.95rem) !important;
  }

  .page_article .obj_article_details .main_entry {
    padding: 0 1.15rem 1.3rem !important;
  }

  .page_article .obj_article_details .abstract,
  .page_article .obj_article_details .abstract p,
  .page_article .obj_article_details .main_entry p,
  .page_article .obj_article_details .main_entry li {
    font-size: 0.98rem !important;
    line-height: 1.68 !important;
  }

  .page_article .obj_article_details ul.authors .name {
    font-size: 0.98rem !important;
  }

  .page_article .obj_article_details ul.authors .affiliation {
    font-size: 0.84rem !important;
  }
}

/* =========================================================
   CJELT ARTICLE COLLAPSIBLE CONTROLS
   Companion styles for Custom Header JavaScript
   Added Sep 2026
   ========================================================= */

.page_article .obj_article_details .item.references.cjelt-collapsible,
.page_article .obj_article_details .entry_details .item.copyright.cjelt-collapsible {
  border-top: 1px solid #E1E9F0 !important;
  padding-top: 0.9rem !important;
}

.page_article .obj_article_details .item.references.cjelt-collapsible > .label,
.page_article .obj_article_details .entry_details .item.copyright.cjelt-collapsible > .label {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 0.8rem !important;
  margin: 0 !important;
  padding: 0 !important;
}

.page_article .cjelt-section-toggle {
  appearance: none;
  -webkit-appearance: none;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.42rem !important;
  min-width: 78px !important;
  min-height: 34px !important;
  margin: 0 0 0 auto !important;
  padding: 0.38rem 0.68rem !important;
  border: 1px solid #C8DCE8 !important;
  border-radius: 999px !important;
  background: #F4F9FC !important;
  color: #0F688C !important;
  font-family: "Noto Sans", Arial, Helvetica, sans-serif !important;
  font-size: 0.78rem !important;
  line-height: 1 !important;
  font-weight: 800 !important;
  cursor: pointer !important;
  box-shadow: none !important;
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease, transform 0.15s ease !important;
}

.page_article .cjelt-section-toggle:hover,
.page_article .cjelt-section-toggle:focus-visible {
  background: #E9F5F8 !important;
  border-color: #7FC3D0 !important;
  color: #075779 !important;
  transform: translateY(-1px);
  outline: 2px solid rgba(31, 175, 186, 0.18) !important;
  outline-offset: 2px !important;
}

.page_article .cjelt-section-toggle[aria-expanded="true"] {
  background: #EAF4FB !important;
  border-color: #9BC4DD !important;
  color: var(--cjelt-blue-dark) !important;
}

.page_article .cjelt-toggle-icon {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 18px !important;
  height: 18px !important;
  border-radius: 50% !important;
  background: #FFFFFF !important;
  font-size: 0.9rem !important;
  line-height: 1 !important;
  font-weight: 900 !important;
}

.page_article .cjelt-collapsible-content {
  margin-top: 0.9rem !important;
}

.page_article .cjelt-collapsible-content[hidden] {
  display: none !important;
}

.page_article .main_entry .item.references .cjelt-collapsible-content {
  padding-top: 0.15rem !important;
}

.page_article .entry_details .item.copyright .cjelt-license-body {
  padding-top: 0.15rem !important;
}

/* Hide OJS contributor-role text in the public author display while preserving
   the role metadata used by the citation and indexing systems. */
.page_article .obj_article_details .main_entry .item.authors .contributor_roles,
.page_article .obj_article_details .main_entry .item.authors .contributor_roles .value {
  display: none !important;
}

@media (max-width: 850px) {
  .page_article .cjelt-section-toggle {
    min-width: 72px !important;
    min-height: 32px !important;
    padding: 0.35rem 0.6rem !important;
    font-size: 0.75rem !important;
  }
}

/* =========================================================
   CJELT ARTICLE V7 — OJS 3.5 exact contributor + reference toggle fixes
   Added Sep 2026
   ========================================================= */

/* OJS 3.5 renders the public contributor-role label (Author, Translator, etc.)
   as .userGroup inside each author <li>. Hide the display label only; the
   underlying contributor metadata remains untouched for citations/indexing. */
.page_article .obj_article_details .main_entry .item.authors ul.authors > li > .userGroup,
.obj_article_details .main_entry .item.authors ul.authors > li > .userGroup {
  display: none !important;
}

/* Exact OJS 3.5 References toggle presentation. */
.obj_article_details .main_entry .item.references.cjelt-collapsible {
  margin-top: 1.15rem !important;
  padding-top: 1rem !important;
  border-top: 1px solid #E1E9F0 !important;
}

.obj_article_details .main_entry .item.references.cjelt-collapsible > .label {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 1rem !important;
  margin: 0 !important;
}

.obj_article_details .main_entry .item.references .cjelt-collapsible-content {
  margin-top: 1rem !important;
}

.obj_article_details .main_entry .item.references .cjelt-collapsible-content[hidden] {
  display: none !important;
}

/* =========================================================
   CJELT ARTICLE V8 — DESKTOP SHELL ALIGNMENT
   Align masthead, navigation, breadcrumbs/article body, and custom footer
   to the same wide reading grid on article pages.
   Added Sep 2026
   ========================================================= */

@media (min-width: 1100px) {
  /* Match the article reader's 1320px desktop shell. */
  body:has(.page_article) .pkp_head_wrapper,
  body:has(.page_article) .pkp_navigation_primary_wrapper,
  body:has(.page_article) .cjelt-footer-main {
    box-sizing: border-box !important;
    width: calc(100% - 64px) !important;
    max-width: 1320px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  /* Remove legacy horizontal offsets that make the journal identity/menu
     begin noticeably farther right than the article container. */
  body:has(.page_article) .pkp_head_wrapper,
  body:has(.page_article) .pkp_navigation_primary_wrapper {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  body:has(.page_article) .pkp_site_name_wrapper,
  body:has(.page_article) .pkp_site_name {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  body:has(.page_article) .pkp_navigation_primary {
    margin-left: 0 !important;
  }

  /* Keep the footer on the same grid while retaining a modest inner gutter
     so the logo and columns do not touch the edge of the footer region. */
  body:has(.page_article) .cjelt-footer-main {
    padding-left: 1.5rem !important;
    padding-right: 1.5rem !important;
  }
}

/* Medium desktop/tablet landscape: keep the three regions aligned without
   forcing the wide 1320px layout into a smaller viewport. */
@media (min-width: 851px) and (max-width: 1099px) {
  body:has(.page_article) .pkp_head_wrapper,
  body:has(.page_article) .pkp_navigation_primary_wrapper,
  body:has(.page_article) .cjelt-footer-main {
    box-sizing: border-box !important;
    width: calc(100% - 40px) !important;
    max-width: 1000px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  body:has(.page_article) .pkp_head_wrapper,
  body:has(.page_article) .pkp_navigation_primary_wrapper {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}

/* =========================================================
   CJELT VISUAL REFINEMENT v9
   Quieter masthead gradient + sample-inspired charcoal footer strip
   + square, line-led article frame
   Added Sep 2026
   ========================================================= */

/* ---------------------------------------------------------
   HEADER
   Keep a gradient, but narrow the color range so the white journal title
   and navigation retain strong contrast without a visually loud transition.
   --------------------------------------------------------- */
.pkp_structure_head {
  background: linear-gradient(105deg, #0F6E88 0%, #176A94 54%, #1B62A0 100%) !important;
}

@media (min-width: 851px) {
  .pkp_head_wrapper,
  .pkp_navigation_primary_row,
  .pkp_navigation_primary_wrapper,
  .pkp_site_nav_menu,
  .pkp_site_nav_menu .pkp_navigation_primary,
  .pkp_navigation_primary,
  .pkp_navigation_user {
    background: transparent !important;
  }

  .pkp_site_name,
  .pkp_site_name a,
  .pkp_site_name .is_text,
  .pkp_site_name a.is_text,
  .pkp_navigation_primary > li > a,
  .pkp_navigation_primary > li > a:visited,
  .pkp_navigation_user > li > a,
  .pkp_navigation_user > li > a:visited {
    color: #FFFFFF !important;
  }

  .pkp_site_name .is_text,
  .pkp_site_name a.is_text {
    font-weight: 800 !important;
    text-shadow: none !important;
    opacity: 1 !important;
  }

  .pkp_navigation_primary > li > a:hover,
  .pkp_navigation_primary > li > a:focus,
  .pkp_navigation_primary > li > a[aria-expanded="true"],
  .pkp_navigation_user > li > a:hover,
  .pkp_navigation_user > li > a:focus {
    background: rgba(255, 255, 255, 0.10) !important;
    color: #FFFFFF !important;
  }
}

/* OJS switches the colored portion to .pkp_head_wrapper on mobile. */
@media (max-width: 850px) {
  .pkp_structure_head {
    background: #FFFFFF !important;
  }

  .pkp_head_wrapper {
    background: linear-gradient(105deg, #0F6E88 0%, #176A94 54%, #1B62A0 100%) !important;
  }
}

/* ---------------------------------------------------------
   ARTICLE FRAME
   Move away from a rounded "card" treatment. The solid teal top rule becomes
   the main visual cue and the rest of the article frame stays square and calm.
   --------------------------------------------------------- */
.page_article .obj_article_details {
  border: 1px solid #DCE5EC !important;
  border-top: 4px solid #22899C !important;
  border-radius: 0 !important;
  box-shadow: 0 5px 18px rgba(25, 49, 72, 0.055) !important;
  overflow: hidden !important;
}

.page_article .obj_article_details > .cmp_notification,
.page_article .obj_article_details > .cmp_notification.notice {
  border-radius: 0 !important;
  background: #F1F5F8 !important;
}

/* Keep the sidebar visually connected to the square article frame. */
.page_article .obj_article_details .entry_details {
  border-radius: 0 !important;
}

/* Do not reintroduce rounded article corners at tablet/phone breakpoints. */
@media (max-width: 850px) {
  .page_article .obj_article_details {
    border-radius: 0 !important;
  }
}

/* ---------------------------------------------------------
   FOOTER
   Match the reference site's dark slate strip (approximately #49535F), while
   retaining CJELT's useful white navigation area above it.
   --------------------------------------------------------- */
.cjelt-footer-bottom {
  background: #49535F !important;
  color: #FFFFFF !important;
  border-top: 0 !important;
  box-shadow: none !important;
}

.cjelt-footer-bottom,
.cjelt-footer-bottom p,
.cjelt-footer-bottom div,
.cjelt-footer-bottom a,
.cjelt-footer-bottom a:visited {
  color: #FFFFFF !important;
}

.cjelt-footer-bottom a:hover,
.cjelt-footer-bottom a:focus {
  color: #FFFFFF !important;
  text-decoration-color: rgba(255, 255, 255, 0.85) !important;
}

/* =========================================================
   CJELT FOOTER COLOR ONLY v13
   Safe reset to the v9 footer layout. Change only the bottom
   copyright/credit strip to charcoal gray. Do not alter the
   white navigation/logo area or footer dimensions.
   Added Sep 2026
   ========================================================= */
.pkp_structure_footer_wrapper .cjelt-footer-bottom,
.pkp_structure_footer .cjelt-footer-bottom,
.pkp_footer_content .cjelt-footer-bottom,
.cjelt-footer-bottom {
  background: #4B545D !important;
  background-color: #4B545D !important;
  background-image: none !important;
  color: #FFFFFF !important;
}

.pkp_structure_footer_wrapper .cjelt-footer-bottom *,
.pkp_structure_footer .cjelt-footer-bottom *,
.pkp_footer_content .cjelt-footer-bottom *,
.cjelt-footer-bottom * {
  color: #FFFFFF !important;
}

/* =========================================================
   CJELT ARTICLE CARD + FOOTER REFINEMENT v14
   Added Sep 2026
   - Restore a modern rounded article card
   - Add a soft, restrained full-card shadow
   - Target only the footer credit strip beneath .cjelt-footer-main
   ========================================================= */

/* Modern article card: rounded, but not excessively so. */
.page_article .obj_article_details {
  border: 1px solid #DCE5EC !important;
  border-top: 4px solid #22899C !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  background: #FFFFFF !important;
  box-shadow: 0 10px 28px rgba(24, 52, 74, 0.08) !important;
}

/* Let the parent card control the corner shape cleanly. */
.page_article .obj_article_details > .cmp_notification,
.page_article .obj_article_details > .cmp_notification.notice {
  border-radius: 0 !important;
}

.page_article .obj_article_details .entry_details {
  border-radius: 0 !important;
}

@media (max-width: 850px) {
  .page_article .obj_article_details {
    border-radius: 12px !important;
    box-shadow: 0 7px 22px rgba(24, 52, 74, 0.075) !important;
  }
}

/*
   Footer credit bar fallback.
   This targets the element immediately after the white .cjelt-footer-main
   area, even if the bottom bar's class is missing or changed in OJS/custom HTML.
   It does NOT recolor the white navigation/logo section above it.
*/
.cjelt-footer .cjelt-footer-main + *,
.cjelt-footer > .cjelt-footer-bottom,
.cjelt-footer > :last-child:not(.cjelt-footer-main) {
  background: #4A535C !important;
  background-color: #4A535C !important;
  background-image: none !important;
  color: #FFFFFF !important;
}

.cjelt-footer .cjelt-footer-main + * *,
.cjelt-footer > .cjelt-footer-bottom *,
.cjelt-footer > :last-child:not(.cjelt-footer-main) * {
  color: #FFFFFF !important;
}

/* =========================================================
   CJELT HOMEPAGE CURRENT ISSUE — TWO-COLUMN ARTICLE CARDS v15
   Added Sep 2026
   Goals:
   - Compact the Current Issue area
   - Remove the separate Editorial section heading
   - Present articles as two-column cards on desktop
   - Show Editorial as a small badge inside the article card
   - Hide public contributor-role labels such as (Author)
   - Keep the homepage PDF button smaller than the article-page CTA
   ========================================================= */

/* Make the Current Issue block more compact and less empty. */
.page_index_journal .current_issue {
  padding: 1.35rem 1.5rem 1.45rem !important;
  border-radius: 16px !important;
  background:
    radial-gradient(circle at 96% 10%, rgba(31, 175, 186, 0.08), transparent 24%),
    linear-gradient(135deg, #FFFFFF 0%, #FAFCFE 72%, #F5FAFC 100%) !important;
  box-shadow: 0 10px 28px rgba(16, 61, 94, 0.075) !important;
}

/* Keep the issue identity tight at the top. */
.page_index_journal .current_issue > h2 {
  margin-bottom: 0.65rem !important;
}

.page_index_journal .current_issue .obj_issue_toc,
.page_index_journal .current_issue .heading {
  margin: 0 !important;
  padding: 0 !important;
}

.page_index_journal .current_issue .heading .title,
.page_index_journal .current_issue .heading a,
.page_index_journal .current_issue .obj_issue_toc > .heading .title {
  max-width: none !important;
  margin: 0 !important;
  font-size: clamp(1.08rem, 1.45vw, 1.28rem) !important;
  line-height: 1.3 !important;
  font-weight: 800 !important;
}

.page_index_journal .current_issue .sections {
  margin-top: 1rem !important;
}

.page_index_journal .current_issue .section {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

/* Hide the separate section heading (for example, Editorial).
   The article type is presented as a badge inside each card below. */
.page_index_journal .current_issue .section > h2,
.page_index_journal .current_issue .section > h3,
.page_index_journal .current_issue .section > .title,
.page_index_journal .current_issue .section > .section_title {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* Two-column article grid on desktop. */
.page_index_journal .current_issue .section > .articles,
.page_index_journal .current_issue .section .articles,
.page_index_journal .current_issue .section > .cmp_article_list,
.page_index_journal .current_issue .section .cmp_article_list {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 1rem !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.page_index_journal .current_issue .section > .articles > li,
.page_index_journal .current_issue .section .articles > li,
.page_index_journal .current_issue .section > .cmp_article_list > li,
.page_index_journal .current_issue .section .cmp_article_list > li {
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

/* Individual homepage article card. */
.page_index_journal .current_issue .obj_article_summary {
  position: relative !important;
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  min-width: 0 !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 2.45rem 1.2rem 1.15rem 1.35rem !important;
  border: 1px solid #D8E3EC !important;
  border-left: 5px solid var(--cjelt-home-teal) !important;
  border-radius: 13px !important;
  background: #FFFFFF !important;
  box-shadow: 0 6px 18px rgba(16, 61, 94, 0.055) !important;
  transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease !important;
}

.page_index_journal .current_issue .obj_article_summary:hover {
  transform: translateY(-2px);
  border-color: #C9D9E6 !important;
  box-shadow: 0 10px 24px rgba(16, 61, 94, 0.09) !important;
}

/* The inaugural homepage section is Editorial. Put that label inside
   each article card rather than using a separate section heading. */
.page_index_journal .current_issue .sections .section:first-child .obj_article_summary::before {
  content: "Editorial";
  position: absolute;
  top: 1rem;
  left: 1.35rem;
  display: inline-flex;
  align-items: center;
  width: fit-content;
  padding: 0.22rem 0.52rem;
  border: 1px solid #CFE3E8;
  border-radius: 999px;
  background: #EFF8FA;
  color: #117B8D;
  font-size: 0.72rem;
  line-height: 1.1;
  font-weight: 800;
  letter-spacing: 0.055em;
  text-transform: uppercase;
}

/* Homepage article title. */
.page_index_journal .current_issue .obj_article_summary .title {
  margin: 0 0 0.6rem !important;
  padding: 0 !important;
  color: var(--cjelt-home-ink) !important;
  font-size: clamp(1.02rem, 1.25vw, 1.14rem) !important;
  line-height: 1.36 !important;
  font-weight: 800 !important;
}

.page_index_journal .current_issue .obj_article_summary .title a,
.page_index_journal .current_issue .obj_article_summary .title a:visited {
  color: var(--cjelt-home-blue) !important;
  text-decoration: none !important;
}

.page_index_journal .current_issue .obj_article_summary .title a:hover,
.page_index_journal .current_issue .obj_article_summary .title a:focus {
  color: #084C89 !important;
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
}

/* Author line: supportive, not dominant. */
.page_index_journal .current_issue .obj_article_summary .authors {
  margin: 0 0 0.85rem !important;
  color: #4F6172 !important;
  font-size: 0.9rem !important;
  line-height: 1.5 !important;
}

/* Hide visible contributor-role labels such as (Author)/(Translator)
   while keeping the underlying role metadata intact. */
.page_index_journal .current_issue .obj_article_summary .authors .userGroup,
.page_index_journal .current_issue .obj_article_summary .authors .user_group,
.page_index_journal .current_issue .obj_article_summary .authors .contributor_roles,
.page_index_journal .current_issue .obj_article_summary .authors .role {
  display: none !important;
}

/* Keep galleys anchored near the bottom when card heights differ. */
.page_index_journal .current_issue .obj_article_summary .galleys,
.page_index_journal .current_issue .obj_article_summary .galleys_links {
  margin-top: auto !important;
  padding-top: 0.25rem !important;
}

/* Smaller homepage download button than the main article-page CTA. */
.page_index_journal .current_issue .obj_article_summary .obj_galley_link,
.page_index_journal .current_issue .obj_article_summary .obj_galley_link:visited {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 36px !important;
  margin: 0 !important;
  padding: 0.5rem 0.78rem !important;
  border: 1px solid #14869A !important;
  border-radius: 8px !important;
  background: linear-gradient(90deg, #0F5E9E 0%, #178FA0 100%) !important;
  color: #FFFFFF !important;
  font-size: 0.82rem !important;
  line-height: 1.1 !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  box-shadow: 0 5px 12px rgba(15, 94, 158, 0.13) !important;
}

.page_index_journal .current_issue .obj_article_summary .obj_galley_link:hover,
.page_index_journal .current_issue .obj_article_summary .obj_galley_link:focus {
  border-color: #0B536A !important;
  background: #0B536A !important;
  color: #FFFFFF !important;
  transform: translateY(-1px);
}

/* Reduce visual competition from the large submission block below the issue. */
.page_index_journal .additional_content > div:first-child {
  padding-top: 1.7rem !important;
  padding-bottom: 1.7rem !important;
}

/* Tablets and phones: return naturally to one column. */
@media (max-width: 900px) {
  .page_index_journal .current_issue .section > .articles,
  .page_index_journal .current_issue .section .articles,
  .page_index_journal .current_issue .section > .cmp_article_list,
  .page_index_journal .current_issue .section .cmp_article_list {
    grid-template-columns: 1fr !important;
  }

  .page_index_journal .current_issue {
    padding: 1.2rem 1.1rem 1.25rem !important;
  }
}

@media (max-width: 560px) {
  .page_index_journal .current_issue .obj_article_summary {
    padding: 2.35rem 1rem 1rem 1.12rem !important;
    border-radius: 11px !important;
  }

  .page_index_journal .current_issue .sections .section:first-child .obj_article_summary::before {
    left: 1.12rem;
  }

  .page_index_journal .current_issue .obj_article_summary .obj_galley_link {
    width: 100% !important;
    box-sizing: border-box !important;
  }
}

/* =========================================================
   CJELT CURRENT ISSUE + HOMEPAGE CLEANUP v16
   Added Sep 2026
   Goals:
   - Remove the default OJS horizontal section divider from homepage cards
   - Give the full Current Issue page a compact, intentional issue layout
   - Support collapsible issue sections via the Custom Header JS helper
   - Keep article cards in a responsive two-column grid
   ========================================================= */

/* ---------------------------------------------------------
   HOMEPAGE: remove OJS's default section divider.
   The Default Theme draws .section::before across the full section.
   Once section headings are moved into article badges, that line is redundant.
   --------------------------------------------------------- */
.page_index_journal .current_issue .obj_issue_toc .section::before,
.page_index_journal .current_issue .section::before {
  content: none !important;
  display: none !important;
  border: 0 !important;
  width: 0 !important;
  height: 0 !important;
}

/* Ensure no inherited divider/border survives on the homepage section shell. */
.page_index_journal .current_issue .obj_issue_toc .section,
.page_index_journal .current_issue .section {
  border-top: 0 !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
}

/* ---------------------------------------------------------
   CURRENT ISSUE PAGE: use the same wider reading shell as article pages.
   --------------------------------------------------------- */
@media (min-width: 1100px) {
  body:has(.page_issue) .pkp_structure_content,
  body:has(.page_issue) .pkp_head_wrapper,
  body:has(.page_issue) .pkp_navigation_primary_wrapper,
  body:has(.page_issue) .cjelt-footer-main {
    box-sizing: border-box !important;
    width: calc(100% - 64px) !important;
    max-width: 1320px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}

/* Keep the issue page title prominent but not oversized. */
.page_issue > h1,
.page_issue .page_title {
  margin: 0 0 0.75rem !important;
  color: var(--cjelt-reader-ink) !important;
  font-size: clamp(1.65rem, 2.4vw, 2.05rem) !important;
  line-height: 1.22 !important;
  font-weight: 800 !important;
  letter-spacing: -0.015em !important;
}

/* The OJS issue heading contains publication metadata, not the visible page
   title. Make it a compact metadata strip instead of a large empty card. */
.page_issue .obj_issue_toc > .heading,
.page_issue .obj_issue_toc .heading {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 0.5rem 1.1rem !important;
  box-sizing: border-box !important;
  margin: 0 0 1.35rem !important;
  padding: 0.78rem 1rem !important;
  border: 1px solid #DDE7EF !important;
  border-left: 4px solid var(--cjelt-reader-teal) !important;
  border-top-width: 1px !important;
  border-radius: 10px !important;
  background: #F8FAFC !important;
  box-shadow: 0 4px 14px rgba(20, 58, 88, 0.045) !important;
}

.page_issue .obj_issue_toc .heading .published,
.page_issue .obj_issue_toc .heading .pub_id,
.page_issue .obj_issue_toc .heading .description {
  margin: 0 !important;
  color: var(--cjelt-reader-muted) !important;
  font-size: 0.9rem !important;
  line-height: 1.45 !important;
}

.page_issue .obj_issue_toc .heading .published .label,
.page_issue .obj_issue_toc .heading .pub_id .type {
  color: var(--cjelt-reader-ink) !important;
  font-weight: 800 !important;
}

/* Remove OJS's large vertical section spacing and built-in divider line. */
.page_issue .obj_issue_toc .sections {
  margin-top: 0 !important;
}

.page_issue .obj_issue_toc .section {
  position: relative !important;
  overflow: hidden !important;
  margin: 0 0 1.35rem !important;
  padding: 0 !important;
  border: 1px solid #DCE6EF !important;
  border-radius: 14px !important;
  background: #FFFFFF !important;
  box-shadow: 0 7px 22px rgba(20, 58, 88, 0.06) !important;
}

.page_issue .obj_issue_toc .section::before {
  content: none !important;
  display: none !important;
  border: 0 !important;
}

/* Section heading doubles as a clean accordion header once JS is enabled. */
.page_issue .obj_issue_toc .section > h2,
.page_issue .obj_issue_toc .section > h3,
.page_issue .obj_issue_toc .section .section_title {
  box-sizing: border-box !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 1rem !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0.9rem 1rem !important;
  border: 0 !important;
  border-bottom: 1px solid #E1E9F0 !important;
  background: #F8FAFC !important;
  color: var(--cjelt-reader-ink) !important;
  font-size: 1rem !important;
  line-height: 1.3 !important;
  font-weight: 800 !important;
}

.page_issue .obj_issue_toc .section > h2::after,
.page_issue .obj_issue_toc .section > h3::after,
.page_issue .obj_issue_toc .section .section_title::after {
  content: none !important;
  display: none !important;
}

/* Article grid now sits *inside* the section card. */
.page_issue .obj_issue_toc .section > .articles,
.page_issue .obj_issue_toc .section .articles,
.page_issue .obj_issue_toc .section > .cmp_article_list,
.page_issue .obj_issue_toc .section .cmp_article_list {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 1rem !important;
  margin: 0 !important;
  padding: 1rem !important;
  list-style: none !important;
}

.page_issue .obj_issue_toc .section > .articles > li,
.page_issue .obj_issue_toc .section .articles > li,
.page_issue .obj_issue_toc .section > .cmp_article_list > li,
.page_issue .obj_issue_toc .section .cmp_article_list > li {
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

/* Slightly refine cards inside the Current Issue page. */
.page_issue .obj_article_summary {
  border: 1px solid #D9E4EC !important;
  border-left: 4px solid var(--cjelt-reader-teal) !important;
  border-radius: 11px !important;
  box-shadow: 0 5px 16px rgba(20, 58, 88, 0.05) !important;
}

.page_issue .obj_article_summary:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 8px 20px rgba(20, 58, 88, 0.08) !important;
}

/* ---------------------------------------------------------
   CURRENT ISSUE SECTION TOGGLE — styles for JS-injected control.
   Starts expanded. The JS toggles .cjelt-collapsed and aria-expanded.
   --------------------------------------------------------- */
.page_issue .cjelt-section-toggle {
  flex: 0 0 auto !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.42rem !important;
  min-height: 32px !important;
  margin: 0 !important;
  padding: 0.38rem 0.65rem !important;
  border: 1px solid #C9DCE5 !important;
  border-radius: 7px !important;
  background: #FFFFFF !important;
  color: #126F82 !important;
  font: inherit !important;
  font-size: 0.78rem !important;
  line-height: 1.1 !important;
  font-weight: 800 !important;
  cursor: pointer !important;
  box-shadow: none !important;
}

.page_issue .cjelt-section-toggle:hover,
.page_issue .cjelt-section-toggle:focus {
  border-color: var(--cjelt-reader-teal) !important;
  background: #EEF8FA !important;
  color: #0E6576 !important;
  outline: none !important;
}

.page_issue .cjelt-section-toggle:focus-visible {
  outline: 3px solid rgba(20, 139, 158, 0.18) !important;
  outline-offset: 2px !important;
}

.page_issue .cjelt-toggle-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1rem;
  font-size: 1rem;
  line-height: 1;
}

.page_issue .obj_issue_toc .section.cjelt-collapsed > .articles,
.page_issue .obj_issue_toc .section.cjelt-collapsed > .cmp_article_list {
  display: none !important;
}

/* Tablets/phones: one article card per row and smaller section shell. */
@media (max-width: 900px) {
  .page_issue .obj_issue_toc .section > .articles,
  .page_issue .obj_issue_toc .section .articles,
  .page_issue .obj_issue_toc .section > .cmp_article_list,
  .page_issue .obj_issue_toc .section .cmp_article_list {
    grid-template-columns: 1fr !important;
    padding: 0.85rem !important;
  }
}

@media (max-width: 560px) {
  .page_issue .obj_issue_toc .section {
    border-radius: 11px !important;
  }

  .page_issue .obj_issue_toc .section > h2,
  .page_issue .obj_issue_toc .section > h3,
  .page_issue .obj_issue_toc .section .section_title {
    padding: 0.8rem 0.85rem !important;
  }

  .page_issue .cjelt-section-toggle .cjelt-toggle-text {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    clip-path: inset(50%) !important;
    white-space: nowrap !important;
  }

  .page_issue .cjelt-section-toggle {
    width: 34px !important;
    min-width: 34px !important;
    padding: 0.35rem !important;
    justify-content: center !important;
  }
}

/* =========================================================
   CJELT V17 — CURRENT ISSUE CLEANUP
   Current Issue is always open; section names move into
   individual article cards as badges via Custom Header JS.
   ========================================================= */

/* The current issue page should read as an issue table of contents,
   not an accordion. Remove the V16 section shell. */
.page_issue .obj_issue_toc .section {
  overflow: visible !important;
  margin: 0 0 1.65rem !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.page_issue .obj_issue_toc .section::before,
.page_issue .obj_issue_toc .section::after {
  content: none !important;
  display: none !important;
}

/* V17 puts the section name (Editorial, Research Article, etc.)
   inside each article card, so the separate section heading is hidden. */
.page_issue .obj_issue_toc .section > h2,
.page_issue .obj_issue_toc .section > h3,
.page_issue .obj_issue_toc .section > .section_title,
.page_issue .obj_issue_toc .section .section_title {
  display: none !important;
}

/* Remove any accordion control left over from cached V16 markup. */
.page_issue .cjelt-section-toggle {
  display: none !important;
}

.page_issue .obj_issue_toc .section.cjelt-collapsed > .articles,
.page_issue .obj_issue_toc .section.cjelt-collapsed > .cmp_article_list {
  display: grid !important;
}

/* Clean two-column issue grid. */
.page_issue .obj_issue_toc .section > .articles,
.page_issue .obj_issue_toc .section .articles,
.page_issue .obj_issue_toc .section > .cmp_article_list,
.page_issue .obj_issue_toc .section .cmp_article_list {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 1.1rem !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

/* Refine individual article cards on the Current Issue page. */
.page_issue .obj_article_summary {
  box-sizing: border-box !important;
  min-height: 100% !important;
  margin: 0 !important;
  padding: 1.2rem 1.25rem 1.15rem !important;
  border: 1px solid #D9E4EC !important;
  border-left: 4px solid var(--cjelt-reader-teal) !important;
  border-radius: 12px !important;
  background: #FFFFFF !important;
  box-shadow: 0 6px 18px rgba(20, 58, 88, 0.055) !important;
  transition: transform 0.15s ease, box-shadow 0.15s ease !important;
}

.page_issue .obj_article_summary:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 9px 22px rgba(20, 58, 88, 0.085) !important;
}

/* Dynamic article-type badge injected by the V17 Custom Header script. */
.page_issue .cjelt-article-type-badge {
  display: inline-flex !important;
  align-items: center !important;
  width: fit-content !important;
  margin: 0 0 0.65rem !important;
  padding: 0.24rem 0.55rem !important;
  border: 1px solid #CFE5EA !important;
  border-radius: 999px !important;
  background: #EEF8FA !important;
  color: #13798C !important;
  font-size: 0.74rem !important;
  line-height: 1.15 !important;
  font-weight: 800 !important;
  letter-spacing: 0.055em !important;
  text-transform: uppercase !important;
}

/* Keep the issue publication metadata concise. */
.page_issue .obj_issue_toc > .heading,
.page_issue .obj_issue_toc .heading {
  margin-bottom: 1.15rem !important;
}

/* Tablet/mobile: one article per row. */
@media (max-width: 900px) {
  .page_issue .obj_issue_toc .section > .articles,
  .page_issue .obj_issue_toc .section .articles,
  .page_issue .obj_issue_toc .section > .cmp_article_list,
  .page_issue .obj_issue_toc .section .cmp_article_list {
    grid-template-columns: 1fr !important;
  }
}

/* =========================================================
   CJELT V18 — HIDE CURRENT ISSUE PUBLICATION DATE
   The issue title already identifies the current issue, so the
   separate "Published: YYYY-MM-DD" strip is unnecessary.
   ========================================================= */

/* Hide the publication-date row itself. */
.page_issue .obj_issue_toc .heading .published,
.page_issue .obj_issue_toc > .heading .published {
  display: none !important;
}

/* If that metadata strip contains nothing else useful, remove the
   now-empty shell so no blank bordered box remains. */
.page_issue .obj_issue_toc > .heading:has(.published):not(:has(.description, .pub_id)),
.page_issue .obj_issue_toc .heading:has(.published):not(:has(.description, .pub_id)) {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* =========================================================
   CJELT V19 — ARTICLE PAGE COLLAPSIBLE REFERENCES + LICENSE
   Companion to Custom Header v19
   ========================================================= */

/* References and License headings act as compact control rows. */
.page_article .obj_article_details .item.references.cjelt-collapsible,
.page_article .obj_article_details .entry_details .item.copyright.cjelt-collapsible {
  position: relative !important;
}

.page_article .obj_article_details .item.references.cjelt-collapsible > .label,
.page_article .obj_article_details .entry_details .item.copyright.cjelt-collapsible > .label {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 0.75rem !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

/* Keep the article-main References control understated but obvious. */
.page_article .obj_article_details .main_entry .item.references .cjelt-section-toggle {
  min-width: 92px !important;
}

/* Sidebar License control is smaller so it does not dominate the metadata. */
.page_article .obj_article_details .entry_details .item.copyright .cjelt-section-toggle {
  min-width: 72px !important;
  min-height: 30px !important;
  padding: 0.32rem 0.55rem !important;
  font-size: 0.72rem !important;
}

/* Contents are hidden by JS until opened. */
.page_article .obj_article_details .item.references .cjelt-collapsible-content[hidden],
.page_article .obj_article_details .entry_details .item.copyright .cjelt-collapsible-content[hidden] {
  display: none !important;
}

.page_article .obj_article_details .item.references .cjelt-collapsible-content {
  margin-top: 0.9rem !important;
}

.page_article .obj_article_details .entry_details .item.copyright .cjelt-collapsible-content {
  margin-top: 0.75rem !important;
}

/* Keep license badge/images tidy inside the expanded area. */
.page_article .obj_article_details .entry_details .item.copyright .cjelt-collapsible-content img {
  max-width: 96px !important;
  height: auto !important;
}

/* Optional shell for article metrics plugins (for example View Counter).
   These rules are intentionally generic and harmless until such a plugin
   injects metric markup. */
.page_article .obj_article_details [class*="viewcounter"],
.page_index_journal .obj_article_summary [class*="viewcounter"],
.page_issue .obj_article_summary [class*="viewcounter"] {
  font-family: "Noto Sans", Arial, Helvetica, sans-serif !important;
}


/* =========================================================
   CJELT V20 — MOVE LICENSE BELOW HOW TO CITE
   Keep the citation card immediately after core article metadata,
   then place the collapsible license at the bottom of the sidebar.
   ========================================================= */

/* License becomes the final sidebar item after the citation block. */
.page_article .obj_article_details .entry_details .item.copyright.cjelt-license-relocated {
  margin-top: 1rem !important;
  padding-top: 0.9rem !important;
  border-top: 1px solid #DCE5ED !important;
  border-bottom: 0 !important;
}

/* Make the collapsed License row compact and clearly secondary. */
.page_article .obj_article_details .entry_details .item.copyright.cjelt-license-relocated > .label {
  margin: 0 !important;
  padding: 0 !important;
  color: var(--cjelt-blue-dark) !important;
  font-size: 0.8rem !important;
  line-height: 1.25 !important;
  font-weight: 800 !important;
  letter-spacing: 0.045em !important;
  text-transform: uppercase !important;
}

/* Expanded license content gets its own compact panel so opening it does
   not visually overwhelm the entire article card. */
.page_article .obj_article_details .entry_details .item.copyright.cjelt-license-relocated .cjelt-collapsible-content {
  box-sizing: border-box !important;
  max-height: 320px !important;
  overflow-y: auto !important;
  margin-top: 0.7rem !important;
  padding: 0.8rem 0.85rem !important;
  border: 1px solid #DCE5ED !important;
  border-radius: 10px !important;
  background: #FFFFFF !important;
  color: var(--cjelt-text) !important;
  font-size: 0.88rem !important;
  line-height: 1.55 !important;
}

/* Keep any long license links from forcing the sidebar wider. */
.page_article .obj_article_details .entry_details .item.copyright.cjelt-license-relocated .cjelt-collapsible-content a {
  overflow-wrap: anywhere !important;
  word-break: normal !important;
}


/* =========================================================
   CJELT V22 — ARTICLE LAYOUT STABILITY + LICENSE POPOVER
   Reverts the V21 DOM/layout restructuring and keeps the proven
   V20 article layout. The expanded License now opens as a floating
   panel, so it cannot stretch the sidebar or push authors away
   from the article title.
   ========================================================= */

/* Allow the floating License panel to extend beyond the card if needed. */
.page_article .obj_article_details {
  overflow: visible !important;
}

/* Preserve the rounded visual shell even with visible overflow. */
.page_article .obj_article_details,
.page_article .obj_article_details > .row,
.page_article .obj_article_details .main_entry,
.page_article .obj_article_details .entry_details {
  min-width: 0 !important;
}

/* The relocated License row stays compact below How to Cite. */
.page_article .obj_article_details .entry_details .item.copyright.cjelt-license-relocated {
  position: relative !important;
  z-index: 30 !important;
  margin-top: 1rem !important;
  padding-top: 0.9rem !important;
  border-top: 1px solid #DCE5ED !important;
  border-bottom: 0 !important;
  overflow: visible !important;
}

/* Expanded License becomes a floating popover instead of changing column height. */
.page_article .obj_article_details .entry_details .item.copyright.cjelt-license-relocated .cjelt-collapsible-content {
  position: absolute !important;
  top: calc(100% + 0.45rem) !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 60 !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-height: 320px !important;
  overflow-y: auto !important;
  margin: 0 !important;
  padding: 0.85rem 0.9rem !important;
  border: 1px solid #CCD9E3 !important;
  border-radius: 10px !important;
  background: #FFFFFF !important;
  color: var(--cjelt-text) !important;
  font-size: 0.88rem !important;
  line-height: 1.55 !important;
  box-shadow: 0 12px 30px rgba(20, 58, 88, 0.16) !important;
}

/* Hidden means genuinely gone; visible means popover. */
.page_article .obj_article_details .entry_details .item.copyright.cjelt-license-relocated .cjelt-collapsible-content[hidden] {
  display: none !important;
}

/* Keep long license URLs inside the popover. */
.page_article .obj_article_details .entry_details .item.copyright.cjelt-license-relocated .cjelt-collapsible-content a {
  overflow-wrap: anywhere !important;
  word-break: normal !important;
}

/* Keep the CC badge restrained. */
.page_article .obj_article_details .entry_details .item.copyright.cjelt-license-relocated .cjelt-collapsible-content img {
  max-width: 96px !important;
  height: auto !important;
}

/* View Counter: make the tiny icon metrics readable without competing
   with the title. The plugin still controls the actual numbers. */
.page_article .obj_article_details [class*="viewcounter"],
.page_index_journal .obj_article_summary [class*="viewcounter"],
.page_issue .obj_article_summary [class*="viewcounter"] {
  color: #607386 !important;
  font-size: 0.78rem !important;
  line-height: 1.2 !important;
}

.page_article .obj_article_details [class*="viewcounter"] {
  margin-left: 0.55rem !important;
}

/* On smaller screens, use a normal in-flow panel because overlays are
   less comfortable on narrow viewports. */
@media (max-width: 850px) {
  .page_article .obj_article_details {
    overflow: hidden !important;
  }

  .page_article .obj_article_details .entry_details .item.copyright.cjelt-license-relocated .cjelt-collapsible-content {
    position: static !important;
    width: 100% !important;
    max-height: 300px !important;
    margin-top: 0.7rem !important;
    box-shadow: none !important;
  }
}


/* =========================================================
   CJELT V24 — V22 BASE + RESTORED ARTICLE TITLE SIZE ONLY
   No other V22 layout or behavior is changed.
   ========================================================= */

.page_article .obj_article_details > .page_title,
.page_article .obj_article_details .page_title,
.page_article h1.page_title {
  font-size: clamp(2rem, 2.7vw, 2.55rem) !important;
  line-height: 1.16 !important;
  font-weight: 800 !important;
  letter-spacing: -0.02em !important;
  margin-bottom: 0.8rem !important;
}

@media (max-width: 850px) {
  .page_article .obj_article_details > .page_title,
  .page_article .obj_article_details .page_title,
  .page_article h1.page_title {
    font-size: clamp(1.6rem, 6vw, 2rem) !important;
    line-height: 1.18 !important;
  }
}


/* =========================================================
   CJELT V25 — TITLE COLOR + CURRENT ISSUE TITLE CONSISTENCY
   V24 base. Only title presentation is adjusted.
   ========================================================= */

/* Article landing page: use the journal's deep blue rather than muted gray. */
.page_article .obj_article_details > .page_title,
.page_article .obj_article_details .page_title,
.page_article h1.page_title {
  color: var(--cjelt-blue-dark) !important;
}

/* Current Issue cards: match the homepage article-title scale and treatment. */
.page_issue .obj_article_summary .title {
  margin: 0 0 0.6rem !important;
  padding: 0 !important;
  color: var(--cjelt-home-ink) !important;
  font-size: clamp(1.02rem, 1.25vw, 1.14rem) !important;
  line-height: 1.36 !important;
  font-weight: 800 !important;
}

.page_issue .obj_article_summary .title a,
.page_issue .obj_article_summary .title a:visited {
  color: var(--cjelt-home-blue) !important;
  text-decoration: none !important;
}

.page_issue .obj_article_summary .title a:hover,
.page_issue .obj_article_summary .title a:focus {
  color: #084C89 !important;
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
}


/* =========================================================
   CJELT V26 — LICENSE ABOVE HOW TO CITE + CLEAN SIDEBAR LINES
   V25 base. Keeps all existing article/page styling.
   ========================================================= */

/* License now sits directly before the citation card.
   Remove the extra top rule that caused a doubled separator. */
.page_article .obj_article_details .entry_details .item.copyright.cjelt-license-relocated {
  margin-top: 0 !important;
  padding-top: 0.9rem !important;
  border-top: 0 !important;
  border-bottom: 1px solid #DFE9F1 !important;
}

/* Make sure the How to Cite item does not add a second separator above itself. */
.page_article .obj_article_details .entry_details .item.citation,
.page_article .obj_article_details .entry_details .item.citation_style,
.page_article .obj_article_details .entry_details .item.how_to_cite,
.page_article .obj_article_details .entry_details .item.citations {
  border-top: 0 !important;
}

/* If the citation plugin wraps the card in a generic citation class,
   suppress only redundant horizontal-rule decoration, not the card border. */
.page_article .obj_article_details .entry_details [class*="citation"]::before,
.page_article .obj_article_details .entry_details [class*="citation"]::after {
  content: none !important;
  display: none !important;
}

/* Keep one clean separator between ordinary sidebar metadata items. */
.page_article .obj_article_details .entry_details > .item {
  border-top: 0 !important;
  border-bottom: 1px solid #DFE9F1 !important;
}

.page_article .obj_article_details .entry_details > .item:last-child {
  border-bottom: 0 !important;
}

/* Citation card itself stays visually distinct without stray background rules. */
.page_article .obj_article_details .entry_details .citation_display {
  margin-top: 0 !important;
}


/* =========================================================
   CJELT V27 — HOW TO CITE LINK + CITATION MENU CLEANUP
   Keeps V26 layout and behavior. Only citation presentation
   is refined.
   ========================================================= */

/* Citation URL remains clickable but visually quieter. */
.page_article .obj_article_details .citation_display a,
.page_article .obj_article_details .citation_display a:visited {
  color: var(--cjelt-blue) !important;
  text-decoration: none !important;
  text-decoration-line: none !important;
  border-bottom: 0 !important;
}

.page_article .obj_article_details .citation_display a:hover,
.page_article .obj_article_details .citation_display a:focus {
  color: var(--cjelt-blue-dark) !important;
  text-decoration: none !important;
  text-decoration-line: none !important;
}

/* Add a small breathing space between the citation text/URL and the
   "More Citation Formats" control. */
.page_article .obj_article_details .citation_formats {
  display: block !important;
  position: static !important;
  width: 100% !important;
  margin: 4px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* Ensure the dropdown trigger is a single clean box with no nested
   overlapping border or inherited negative positioning. */
.page_article .obj_article_details .citation_formats_button,
.page_article .obj_article_details .citation_formats > button,
.page_article .obj_article_details button.citation_formats {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  position: static !important;
  width: 100% !important;
  max-width: 100% !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 0.62rem 0.85rem !important;
  border: 1px solid #BFCED9 !important;
  border-radius: 7px !important;
  background: #FFFFFF !important;
  box-shadow: none !important;
  outline: 0 !important;
  overflow: hidden !important;
}

/* Remove any extra outline/border generated by nested anchors or wrappers. */
.page_article .obj_article_details .citation_formats a {
  border: 0 !important;
  box-shadow: none !important;
  text-decoration: none !important;
}

.page_article .obj_article_details .citation_formats::before,
.page_article .obj_article_details .citation_formats::after,
.page_article .obj_article_details .citation_formats_button::before {
  box-shadow: none !important;
}

/* Keep the dropdown list aligned beneath the trigger if opened. */
.page_article .obj_article_details .citation_formats_list,
.page_article .obj_article_details .citation_formats_styles,
.page_article .obj_article_details .citation_formats .dropdown-menu {
  margin-top: 4px !important;
}


/* =========================================================
   CJELT V30 — SIMPLE ARTICLE PAGE: NO CUSTOM SHOW/HIDE
   References and License are always visible.
   The experimental citation popover from later versions is not included.
   ========================================================= */

/* Remove all custom Show/Hide controls if old markup is still cached. */
.page_article .obj_article_details .cjelt-section-toggle {
  display: none !important;
}

/* References: always visible in normal document flow. */
.page_article .obj_article_details .main_entry .item.references,
.page_article .obj_article_details .main_entry .item.references.cjelt-collapsible {
  display: block !important;
  overflow: visible !important;
}

.page_article .obj_article_details .main_entry .item.references > .label {
  display: block !important;
}

.page_article .obj_article_details .main_entry .item.references > .value,
.page_article .obj_article_details .main_entry .item.references .cjelt-collapsible-content {
  display: block !important;
  position: static !important;
  width: auto !important;
  max-height: none !important;
  overflow: visible !important;
  margin-top: 0.65rem !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* Override the HTML hidden attribute if an older cached script left it behind. */
.page_article .obj_article_details .main_entry .item.references > .value[hidden],
.page_article .obj_article_details .main_entry .item.references .cjelt-collapsible-content[hidden] {
  display: block !important;
}

/* License: always visible above How to Cite. */
.page_article .obj_article_details .entry_details .item.copyright,
.page_article .obj_article_details .entry_details .item.copyright.cjelt-license-relocated,
.page_article .obj_article_details .entry_details .item.copyright.cjelt-collapsible {
  display: block !important;
  position: static !important;
  overflow: visible !important;
  margin-top: 0 !important;
  padding-top: 0.9rem !important;
  border-top: 0 !important;
  border-bottom: 1px solid #DFE9F1 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.page_article .obj_article_details .entry_details .item.copyright > .label {
  display: block !important;
  margin-bottom: 0.65rem !important;
}

.page_article .obj_article_details .entry_details .item.copyright .cjelt-license-body,
.page_article .obj_article_details .entry_details .item.copyright .cjelt-collapsible-content {
  display: block !important;
  position: static !important;
  width: auto !important;
  max-height: none !important;
  overflow: visible !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.page_article .obj_article_details .entry_details .item.copyright .cjelt-license-body[hidden],
.page_article .obj_article_details .entry_details .item.copyright .cjelt-collapsible-content[hidden] {
  display: block !important;
}

/* Keep license content secondary but fully readable. */
.page_article .obj_article_details .entry_details .item.copyright,
.page_article .obj_article_details .entry_details .item.copyright p,
.page_article .obj_article_details .entry_details .item.copyright div {
  font-size: 0.84rem !important;
  line-height: 1.5 !important;
}

.page_article .obj_article_details .entry_details .item.copyright a {
  overflow-wrap: anywhere !important;
}

.page_article .obj_article_details .entry_details .item.copyright img {
  max-width: 96px !important;
  height: auto !important;
}


/* =========================================================
   CJELT V33 — WIDER HOMEPAGE CURRENT ISSUE OUTER BOX
   V30 base. Only the OUTER Current Issue container is widened.
   Inner article cards remain exactly as they are in V30.
   ========================================================= */

@media (min-width: 1000px) {
  .page_index_journal .current_issue {
    box-sizing: border-box !important;
    width: calc(100% + 72px) !important;
    max-width: calc(100vw - 48px) !important;
    margin-left: -36px !important;
    margin-right: -36px !important;
  }
}

/* Keep the normal V30 width on tablets and phones. */
@media (max-width: 999px) {
  .page_index_journal .current_issue {
    width: auto !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}


/* =========================================================
   CJELT V34 — ALIGN HOMEPAGE OUTER SECTIONS
   V33 base. Widen the Call for Submissions outer box to match
   the widened Current Issue outer box. Inner content is unchanged.
   ========================================================= */

@media (min-width: 1000px) {
  .page_index_journal .additional_content > div:first-child {
    box-sizing: border-box !important;
    width: calc(100% + 72px) !important;
    max-width: calc(100vw - 48px) !important;
    margin-left: -36px !important;
    margin-right: -36px !important;
  }
}

/* Keep normal width on tablets and phones. */
@media (max-width: 999px) {
  .page_index_journal .additional_content > div:first-child {
    width: auto !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}