/* Custom fonts and styling tokens for IJRDO - ISSHR theme */
:root {
  --color-sage-50: #f4f7f5;
  --color-sage-100: #e5ece7;
  --color-sage-200: #cdddd2;
  --color-sage-300: #a7c3b1;
  --color-sage-400: #7ba48b;
  --color-sage-500: #568569;
  --color-sage-600: #416a52;
  --color-sage-700: #345542;
  --color-sage-800: #2c4537;
  --color-sage-900: #1b3827;
  --color-sage-950: #112218;

  --color-lightgrey-50: #fafafa;
  --color-lightgrey-100: #f4f5f6;
  --color-lightgrey-200: #eaebee;
  --color-lightgrey-300: #dcdee2;
  --color-lightgrey-400: #c5c8cf;
  --color-lightgrey-500: #9ea3ad;
  --color-lightgrey-600: #717682;
  --color-lightgrey-700: #525763;
  --color-lightgrey-800: #343842;
  --color-lightgrey-900: #1e2126;
}

body.ijrdosshr-body {
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  background-color: #f0f2f1;
  color: var(--color-lightgrey-800);
  margin: 0;
  padding: 0;
}

/* Vintage Paper Background & Fine Etching Backdrop */
.hero-etching-canvas {
  background-color: #dededc;
  background-image:
    radial-gradient(ellipse at center, rgba(255, 255, 255, 0.72) 0%, rgba(218, 220, 217, 0.95) 100%),
    url("data:image/svg+xml,%3Csvg width='120' height='120' viewBox='0 0 120 120' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.05'/%3E%3C/svg%3E");
}

.hero-art-backdrop {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}

/* 3D Journal Book Perspective */
.perspective-stage {
  perspective: 1200px;
}

.journal-book-3d {
  transform-style: preserve-3d;
  transform: rotateY(-14deg) rotateX(4deg);
  transition: all 0.45s cubic-bezier(0.165, 0.84, 0.44, 1);
  box-shadow: -18px 24px 38px -6px rgba(17, 34, 24, 0.35),
    -4px 6px 14px -2px rgba(0, 0, 0, 0.2);
}

.journal-book-3d:hover {
  transform: rotateY(-4deg) rotateX(2deg) translateY(-6px) scale(1.02);
  box-shadow: -24px 32px 48px -4px rgba(17, 34, 24, 0.45),
    -6px 10px 20px -2px rgba(0, 0, 0, 0.25);
}

.journal-spine-3d {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 18px;
  transform: translateX(-100%) rotateY(-90deg);
  transform-origin: right;
  background: linear-gradient(to right, #112218, #1b3827, #2c4537);
}

/* Editorial subtle borders */
.editorial-border {
  border: 1px solid rgba(65, 106, 82, 0.16);
  box-shadow: 0 4px 20px -2px rgba(44, 69, 55, 0.05);
}

/* Typography helper classes */
.font-serif-academic {
  font-family: 'Cormorant Garamond', Georgia, serif;
}

.font-sans-ui {
  font-family: 'Plus Jakarta Sans', sans-serif;
}

/* ========================================================
   EDITORIAL & STATIC PAGES STYLING (Open Access, Ethics, etc.)
   ======================================================== */

.pkp_page_index,
.pkp_structure_page,
.page {
  background-color: #f0f2f1;
}

/* ========================================================
   UNIVERSAL EQUAL MARGINS & CONTAINER FOR ALL PAGES
   ======================================================== */

body.ijrdosshr-body {
  background-color: #f0f2f1 !important;
}

/* 1. Reset all outer OJS structure wrapper constraints */
.pkp_structure_page,
.pkp_structure_content,
.has_site_logo .pkp_head_wrapper,
.pkp_structure_main:first-child:last-child {
  width: 100% !important;
  max-width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  float: none !important;
}

/* 2. THE UNIVERSAL INNER PAGE WRAPPER: EXACT EQUAL LEFT & RIGHT MARGINS ON EVERY PAGE */
.ijrdosshr-inner-page-wrapper,
body.ijrdosshr-body > .cmp_breadcrumbs,
body.ijrdosshr-body > h1.page_title,
body.ijrdosshr-body > h1,
body.ijrdosshr-body > .page,
body.ijrdosshr-body > .page_issue,
body.ijrdosshr-body > .page_contact,
body.ijrdosshr-body > .page_editorial_team,
body.ijrdosshr-body > .page_editorialTeam,
body.ijrdosshr-body > .page_issue_archive,
body.ijrdosshr-body > .page_archive,
body.ijrdosshr-body > .page_about,
body:not(.pkp_page_index) .pkp_structure_content > .pkp_structure_main,
body:not(.pkp_page_index) main.page,
body:not(.pkp_page_index) .page:not(.hero-section-wrapper) {
  max-width: 1080px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  padding-top: 0.5rem !important;
  padding-bottom: 0 !important;
  float: none !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

/* Page content bottom spacing */
body.ijrdosshr-body > .page,
body.ijrdosshr-body > .page_issue,
.ijrdosshr-inner-page-wrapper {
  padding-bottom: 3.5rem !important;
}

/* When inner wrapper is present, prevent ANY nested children from adding extra padding or margins */
.ijrdosshr-inner-page-wrapper .pkp_structure_main,
.ijrdosshr-inner-page-wrapper .page,
.ijrdosshr-inner-page-wrapper main,
.ijrdosshr-inner-page-wrapper .page_issue,
.ijrdosshr-inner-page-wrapper .page_issue_archive,
.ijrdosshr-inner-page-wrapper .page_archive,
.ijrdosshr-inner-page-wrapper .page_editorialTeam,
.ijrdosshr-inner-page-wrapper .page_editorial_team,
.ijrdosshr-inner-page-wrapper .page_about,
.ijrdosshr-inner-page-wrapper .page_contact,
.ijrdosshr-inner-page-wrapper .page_submissions,
.ijrdosshr-inner-page-wrapper .page_search,
.ijrdosshr-inner-page-wrapper .obj_issue_toc,
.page_issue .pkp_structure_main,
.page_contact .pkp_structure_main,
.page_editorial_team .pkp_structure_main,
.page_editorialTeam .pkp_structure_main {
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  float: none !important;
  box-sizing: border-box !important;
}

/* 3. Strip all internal conflicting offsets so breadcrumbs, heading, green line, and text align identically from left edge */
.cmp_breadcrumbs,
.cmp_breadcrumbs ol,
.page_header,
.page-header,
.page_header_row,
h1.page_title,
.page_content,
.pkp_page_content,
.obj_issue_toc,
.sections,
.description,
.details,
.contact_section,
.issues_archive,
.page_editorialTeam,
.page_about {
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  text-align: left !important;
  box-sizing: border-box !important;
}

/* Breadcrumbs: Placed directly above heading, perfectly aligned with the left margin */
.cmp_breadcrumbs {
  padding-top: 1.25rem !important;
  padding-bottom: 0.35rem !important;
  font-size: 0.82rem !important;
  color: #717682 !important;
  margin: 0 !important;
  display: block !important;
}

.cmp_breadcrumbs ol {
  margin: 0 0 10px 0 !important;
  padding: 0 !important;
  line-height: 20px !important;
  font-size: 13px !important;
  list-style: none !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0.4rem !important;
}

.cmp_breadcrumbs a {
  color: #1b3827 !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}

.cmp_breadcrumbs a:hover {
  text-decoration: underline !important;
}

/* Remove all boxes, cards, and borders from page containers */
.page_title,
.page_content,
.pkp_page_content,
.pkp_structure_content,
.page_header,
.page-header,
.page_about,
.page_editorialTeam,
.page_contact {
  background: transparent !important;
  border-radius: 0 !important;
  border: none !important;
  box-shadow: none !important;
}

/* Page Title (H1): Direct, clean, starting at the exact same left margin */
h1.page_title,
.page-header h1,
.page_header h1,
h1 {
  font-family: 'Cormorant Garamond', Georgia, serif !important;
  font-size: 2.5rem !important;
  font-weight: 700 !important;
  color: #112218 !important;
  margin-top: 0.25rem !important;
  margin-bottom: 0.85rem !important;
  padding: 0 !important;
  border: none !important;
  border-bottom: none !important;
  letter-spacing: -0.01em !important;
  line-height: 1.2 !important;
}

/* Page Contact & Editorial Team: Keep Heading & Edit Link on the same line side-by-side */
.page_contact,
.page_editorial_team,
.page_editorialTeam {
  display: flex !important;
  flex-direction: column !important;
}

.page_contact > .cmp_breadcrumbs,
.page_editorial_team > .cmp_breadcrumbs,
.page_editorialTeam > .cmp_breadcrumbs {
  order: 1 !important;
}

/* Page Header Row (wrapper for Title + Edit link in same row) */
.page_header_row {
  order: 2 !important;
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  width: 100% !important;
  margin-bottom: 0 !important;
}

.page_header_row > h1,
.page_contact > h1,
.page_editorial_team > h1,
.page_editorialTeam > h1 {
  order: 2 !important;
  display: inline-flex !important;
  align-items: center !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  float: left !important;
}

.page_header_row > .cmp_edit_link,
.page_contact > .cmp_edit_link,
.page_editorial_team > .cmp_edit_link,
.page_editorialTeam > .cmp_edit_link {
  order: 3 !important;
  display: inline-flex !important;
  align-items: center !important;
  margin-left: 1.25rem !important;
  margin-top: 0.2rem !important;
  margin-bottom: 0 !important;
  color: #2c4537 !important;
  font-size: 0.95rem !important;
  font-weight: 600 !important;
  float: none !important;
}

.page_header_row > .cmp_edit_link:hover,
.page_contact > .cmp_edit_link:hover,
.page_editorial_team > .cmp_edit_link:hover,
.page_editorialTeam > .cmp_edit_link:hover {
  color: #416a52 !important;
  text-decoration: underline !important;
}

.editorial_team_content {
  order: 5 !important;
  width: 100% !important;
}

/* Page Issue: Order breadcrumbs, title, then the green line underneath */
.page_issue {
  display: flex !important;
  flex-direction: column !important;
}

.page_issue > .cmp_breadcrumbs {
  order: 1 !important;
}

.page_issue > h1 {
  order: 2 !important;
  margin-bottom: 0.85rem !important;
}

/* The Single Green Line: placed cleanly between heading and text across all pages */
.page_content::before,
.pkp_page_content::before,
.page_about::before,
.page_editorialTeam::after,
.page_editorial_team::after,
.page_contact::after,
.page_issue::after,
.page_archive::before {
  content: "" !important;
  display: block !important;
  width: 100% !important;
  height: 4.5px !important;
  background-color: #234d35 !important;
  margin-bottom: 1.75rem !important;
  border-radius: 2px !important;
}

/* For contact page, issue page, and editorial team, order the green line directly after title, before main content */
.page_issue::after {
  order: 3 !important;
  margin-top: 0 !important;
}

.page_issue > .obj_issue_toc {
  order: 4 !important;
}

.page_contact::after,
.page_editorial_team::after,
.page_editorialTeam::after {
  order: 4 !important;
  margin-top: 0.85rem !important;
}

.page_contact > .contact_section {
  order: 5 !important;
}

/* Subheadings (H2, H3, H4) inside pages */
.page_content h2,
.pkp_page_content h2,
.page_editorialTeam h2,
.page_about h2 {
  font-family: 'Cormorant Garamond', Georgia, serif !important;
  font-size: 1.45rem !important;
  font-weight: 700 !important;
  color: #1b3827 !important;
  margin-top: 2rem !important;
  margin-bottom: 0.6rem !important;
  padding: 0 !important;
  border: none !important;
  text-align: left !important;
}

/* Explicit Moving Forward Heading Color: 100% White */
#moving-forward h2,
section#moving-forward h2,
.bg-sage-950 h2 {
  color: #ffffff !important;
  border-bottom: 1.5px solid #2e4d3a !important;
}

.page_content h3,
.pkp_page_content h3,
h3 {
  font-size: 1.15rem !important;
  font-weight: 700 !important;
  color: #2c4537 !important;
  margin-top: 1.4rem !important;
  margin-bottom: 0.5rem !important;
  text-align: left !important;
}

/* Paragraphs & Text Content */
.page_content p,
.pkp_page_content p,
.page p {
  font-family: 'Plus Jakarta Sans', -apple-system, sans-serif !important;
  font-size: 0.94rem !important;
  line-height: 1.75 !important;
  color: #343842 !important;
  margin-bottom: 1.1rem !important;
  text-align: left !important;
}

/* Lists styling */
.page_content ul:not(.issues_archive):not(.articles),
.pkp_page_content ul:not(.issues_archive):not(.articles),
.page ul:not(.issues_archive):not(.articles):not(.pkp_unstyled_list) {
  list-style: disc !important;
  padding-left: 1.5rem !important;
  margin-bottom: 1.4rem !important;
}

.page_content ul:not(.issues_archive):not(.articles) li,
.pkp_page_content ul:not(.issues_archive):not(.articles) li,
.page ul:not(.issues_archive):not(.articles):not(.pkp_unstyled_list) li {
  font-size: 0.93rem !important;
  line-height: 1.7 !important;
  color: #343842 !important;
  margin-bottom: 0.45rem !important;
}

/* Archives list: strictly NO bullets, clean spacing and borders */
ul.issues_archive,
.issues_archive,
.issues_archive > li,
.page_issue_archive ul,
.page_issue_archive li,
.articles,
.articles > li {
  list-style: none !important;
  list-style-type: none !important;
  padding-left: 0 !important;
  margin-left: 0 !important;
}

.page_content ol,
.pkp_page_content ol,
.page ol {
  list-style: decimal !important;
  margin-bottom: 1.4rem !important;
}

/* Links inside content */
.page_content a,
.pkp_page_content a {
  color: #1b3827 !important;
  font-weight: 600 !important;
  text-decoration: underline !important;
  transition: color 0.15s ease !important;
}

.page_content a:hover,
.pkp_page_content a:hover {
  color: #416a52 !important;
}

/* Footer Headings Guaranteed Visibility (White color) */
footer h3,
footer h3.font-mono,
.pkp_structure_footer h3,
footer .space-y-3>h3 {
  color: #ffffff !important;
  opacity: 1 !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.4) !important;
}

/* Mobile responsive horizontal padding for inner pages */
@media (max-width: 1140px) {
  .ijrdosshr-inner-page-wrapper {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
  }
}

@media (max-width: 640px) {
  .ijrdosshr-inner-page-wrapper {
    padding-left: 1.5rem !important;
    padding-right: 1.5rem !important;
  }

  /* Hero Section Mobile Optimization */
  .hero-section-wrapper {
    min-height: auto !important;
    padding-top: 2rem !important;
    padding-bottom: 2rem !important;
  }

  .hero-section-wrapper .hero-bg-img {
    object-position: center top !important;
    opacity: 0.9 !important;
  }

  .hero-section-wrapper .hero-content-box {
    padding-top: 1.5rem !important;
    padding-bottom: 1.5rem !important;
    padding-left: 1rem !important;
    padding-right: 1rem !important;
  }

  .hero-section-wrapper .hero-title {
    font-size: 20px !important;
    line-height: 1.25 !important;
    letter-spacing: 0.25px !important;
  }

  .hero-section-wrapper .hero-subtitle {
    font-size: 13.5px !important;
    line-height: 1.45 !important;
    margin-bottom: 1.25rem !important;
  }

  .hero-section-wrapper .hero-badge {
    font-size: 10.5px !important;
    padding: 3px 10px !important;
  }

  .hero-section-wrapper .hero-issn span {
    font-size: 11.5px !important;
  }

  .hero-section-wrapper .hero-btns a {
    width: 100% !important;
    max-width: 260px !important;
    font-size: 12px !important;
    padding: 8px 14px !important;
  }
}