/* AgroPraktikal Mulawarman — CSS-only stable edition for OJS 3.5 Default Theme */
:root{--agro-dark:#064d37;--agro:#08734d;--agro-soft:#edf6f1;--agro-gold:#d8aa3d;--agro-text:#26342d;--agro-border:#dce7e0;--agro-white:#fff}

/* Prevent padding from making OJS containers wider than their parent. */
.pkp_structure_page,.pkp_structure_head,.pkp_head_wrapper,.pkp_site_nav_menu,.pkp_structure_content,.pkp_structure_main,.page_index_journal,.homepage_image,.homepage_about,.additional_content,.pkp_structure_footer{box-sizing:border-box}
body{margin:0;color:var(--agro-text);background:#f5f8f6;font-family:Arial,"Helvetica Neue",sans-serif;line-height:1.65}
a{color:var(--agro);text-underline-offset:2px}a:hover,a:focus{color:var(--agro-dark)}
h1,h2,h3,h4,h5,h6{color:var(--agro-dark);font-family:Arial,"Helvetica Neue",sans-serif;line-height:1.2}

/* Header */
.pkp_structure_head{width:100%;background:#fff;border:0;box-shadow:0 2px 14px rgba(6,77,55,.1)}
.pkp_head_wrapper{width:calc(100% - 32px);max-width:1180px;margin:0 auto;padding:0}
.pkp_site_name_wrapper{min-height:112px;display:flex;align-items:center;padding:16px 24px;box-sizing:border-box}
.pkp_site_name{width:auto;min-height:76px;display:flex;align-items:center;margin:0;padding:0;position:relative}
.pkp_site_name>a,.pkp_site_name>a.is_img{display:flex;align-items:center;margin:0;padding:0;line-height:1}
.pkp_site_name img{display:block;width:72px;height:72px;max-width:72px;max-height:72px;object-fit:contain}
.pkp_site_name::after{content:"AGROPRAKTIKAL\A MULAWARMAN";display:block;margin-left:20px;color:#075a3c;font:600 25px/1.06 Arial,"Helvetica Neue",sans-serif;letter-spacing:.01em;white-space:pre;pointer-events:none}
.pkp_navigation_user_wrapper,#navigationUserWrapper{top:18px;right:24px;color:var(--agro-dark);font-size:12px}
.pkp_navigation_user_wrapper a,#navigationUserWrapper a{color:var(--agro-dark)}

/* Navigation */
.pkp_site_nav_menu{width:100%;margin:0;padding:0 22px;background:linear-gradient(100deg,#054a35,#08734d);border:0}
.pkp_navigation_primary_row,.pkp_navigation_primary_wrapper{min-height:58px}
.pkp_navigation_primary{margin:0;padding:0}
.pkp_navigation_primary>li>a{padding:19px 15px 17px;color:rgba(255,255,255,.94);border-bottom:3px solid transparent;font:600 13px/19px Arial,"Helvetica Neue",sans-serif;text-decoration:none}
.pkp_navigation_primary>li>a:hover,.pkp_navigation_primary>li>a:focus{color:#fff;background:rgba(255,255,255,.07);border-bottom-color:var(--agro-gold)}
.pkp_navigation_primary .dropdown-menu{border:1px solid var(--agro-border);border-radius:0 0 8px 8px;box-shadow:0 10px 25px rgba(0,35,24,.14)}
/* This journal already has Search as a normal menu item. */
.pkp_navigation_search_wrapper{display:none}

/* Page width: aligned with the navigation bar. */
.pkp_structure_content{width:calc(100% - 32px);max-width:1180px;margin:0 auto;padding:0}
.pkp_structure_main{width:100%;max-width:none;margin:0;padding:32px 0 56px}

/* Homepage hero — text is generated entirely by CSS. */
.page_index_journal .homepage_image{position:relative;width:100%;height:clamp(330px,43vw,540px);margin:0;overflow:hidden;background:var(--agro-dark)}
.page_index_journal .homepage_image img{display:block;width:100%;height:100%;margin:0;object-fit:cover;object-position:center}
.page_index_journal .homepage_image::before{content:"";position:absolute;z-index:1;inset:0;background:linear-gradient(90deg,rgba(2,53,37,.88) 0%,rgba(2,53,37,.6) 45%,rgba(2,53,37,.12) 78%);pointer-events:none}
.page_index_journal .homepage_image::after{content:"FAKULTAS PERTANIAN · UNIVERSITAS MULAWARMAN\A\A AGROPRAKTIKAL\A MULAWARMAN\A\A Publikasi Hasil Praktik Kerja Lapangan";position:absolute;z-index:2;top:15%;left:clamp(28px,5vw,64px);width:min(700px,66%);color:#fff;font:500 clamp(20px,3.25vw,48px)/1.12 Arial,"Helvetica Neue",sans-serif;letter-spacing:.01em;white-space:pre-wrap;text-shadow:0 2px 16px rgba(0,0,0,.22);pointer-events:none}

/* Homepage content */
.homepage_about,.additional_content{width:100%;max-width:none;margin-right:0;margin-left:0;border:1px solid var(--agro-border);background:#fff}
.homepage_about{margin-top:34px;padding:34px 40px 24px;border-bottom:0;border-radius:14px 14px 0 0}
.homepage_about h2{margin:0 0 14px;font-size:28px;font-weight:600}
.homepage_about p{margin-bottom:0;color:var(--agro-text);font-size:15px}
.additional_content{margin-top:0;margin-bottom:0;padding:0 40px 34px;border-top:0;border-radius:0 0 14px 14px}
.additional_content p,.additional_content .agro-kicker{margin:0;padding:20px 22px;color:var(--agro-text);background:var(--agro-soft);border-left:4px solid var(--agro);border-radius:4px 9px 9px 4px;font-family:Arial,"Helvetica Neue",sans-serif!important;font-size:14px!important;line-height:1.65!important}
.additional_content p span{font-family:inherit!important;font-size:inherit!important;line-height:inherit!important}

/* Other public pages, including login and register. */
.pkp_structure_main>.page{width:100%;box-sizing:border-box;padding:36px 40px;background:#fff;border:1px solid var(--agro-border);border-radius:14px}
input[type=text],input[type=email],input[type=password],input[type=url],input[type=search],select,textarea{max-width:100%;box-sizing:border-box;border:1px solid #c7d7cd;border-radius:6px;background:#fff}
input:focus,select:focus,textarea:focus{border-color:var(--agro);outline:3px solid rgba(8,115,77,.13)}
.cmp_button,.pkp_button,button,input[type=submit]{color:#fff;background:var(--agro);border-color:var(--agro);border-radius:6px}
.cmp_button:hover,.pkp_button:hover,button:hover,input[type=submit]:hover{color:#fff;background:var(--agro-dark);border-color:var(--agro-dark)}

/* Footer */
.pkp_structure_footer_wrapper{width:100%;color:rgba(255,255,255,.84);background:var(--agro-dark)}
.pkp_structure_footer{width:calc(100% - 32px);max-width:1180px;margin:0 auto;padding:38px 24px}
.pkp_footer_content a{color:#fff}.pkp_brand_footer img{width:90px;height:auto;filter:brightness(0) invert(1);opacity:.78}

@media(max-width:760px){
  .pkp_head_wrapper,.pkp_structure_content,.pkp_structure_footer{width:calc(100% - 20px)}
  .pkp_site_name_wrapper{min-height:88px;padding:12px 14px}
  .pkp_site_name img{width:54px;height:54px}
  .pkp_site_name::after{margin-left:12px;font-size:clamp(15px,5vw,21px)}
  .pkp_site_nav_menu{padding:0 12px}
  .pkp_navigation_primary>li>a{padding:12px 10px;font-size:13px}
  .pkp_structure_main{padding:18px 0 34px}
  .page_index_journal .homepage_image{height:330px}
  .page_index_journal .homepage_image::after{top:17%;left:22px;width:calc(100% - 44px);font-size:clamp(17px,6.7vw,31px)}
  .homepage_about{margin-top:20px;padding:26px 22px 18px}
  .additional_content{padding:0 22px 24px}
  .pkp_structure_main>.page{padding:26px 22px}
}

@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important}}

/* =========================================================
   FINAL OJS OVERRIDES
   OJS applies a desktop margin after the journal stylesheet.
   These narrowly scoped declarations keep the hero flush with the navbar.
   ========================================================= */
@media (min-width: 761px) {
  .pkp_head_wrapper,
  .pkp_structure_content {
    width: calc(100% - 32px) !important;
    max-width: 1160px !important;
  }
}

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

.pkp_structure_main {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

.page_index_journal,
.page_index_journal .homepage_image {
  margin-top: 0 !important;
}

/* A dimmed photograph provides the overlay without consuming a pseudo-element. */
.page_index_journal .homepage_image img {
  filter: brightness(.56) saturate(.92);
}

/* Main hero title. */
.page_index_journal .homepage_image::before {
  content: "AGROPRAKTIKAL\A MULAWARMAN";
  position: absolute;
  z-index: 2;
  top: 25%;
  right: auto;
  bottom: auto;
  left: clamp(30px, 5vw, 66px);
  width: min(720px, 67%);
  color: #fff;
  background: none;
  font-family: Arial, "Helvetica Neue", sans-serif;
  font-size: clamp(44px, 6vw, 78px);
  font-weight: 500;
  line-height: .98;
  letter-spacing: -.025em;
  white-space: pre;
  text-shadow: 0 2px 16px rgba(0, 0, 0, .24);
  pointer-events: none;
}

/* Hero subtitle. */
.page_index_journal .homepage_image::after {
  content: "Publikasi Hasil Praktik Kerja Lapangan";
  position: absolute;
  z-index: 2;
  top: 66%;
  right: auto;
  bottom: auto;
  left: clamp(30px, 5vw, 66px);
  width: min(720px, 70%);
  color: #fff;
  font-family: Arial, "Helvetica Neue", sans-serif;
  font-size: clamp(18px, 2.2vw, 29px);
  font-weight: 400;
  line-height: 1.25;
  letter-spacing: 0;
  white-space: normal;
  text-shadow: 0 2px 12px rgba(0, 0, 0, .25);
  pointer-events: none;
}

@media (max-width: 760px) {
  .pkp_structure_main {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  .page_index_journal .homepage_image::before {
    top: 27%;
    left: 22px;
    width: calc(100% - 44px);
    font-size: clamp(34px, 11vw, 54px);
  }

  .page_index_journal .homepage_image::after {
    top: 67%;
    left: 22px;
    width: calc(100% - 44px);
    font-size: clamp(16px, 5vw, 22px);
  }
}

/* =========================================================
   REMOVE REMAINING DEFAULT BLUE — GREEN/WHITE CONTROLS
   ========================================================= */

/* Search submit button */
.page_search div.submit,
.page_search .submit {
  background: transparent;
}

.page_search button.submit,
.page_search input.submit,
.page_search input[type="submit"] {
  min-height: 46px;
  box-sizing: border-box;
  padding: 10px 22px 10px 54px !important;
  color: #fff !important;
  background: var(--agro) !important;
  border: 1px solid var(--agro-dark) !important;
  border-radius: 7px !important;
  box-shadow: none !important;
  font-family: Arial, "Helvetica Neue", sans-serif;
  font-weight: 700;
}

.page_search button.submit::before {
  color: #fff !important;
  background: var(--agro-dark) !important;
  border-right: 1px solid rgba(255,255,255,.25) !important;
}

/* OJS places the magnifying-glass segment in ::after. */
.page_search button.submit::after {
  color: #fff !important;
  background: var(--agro-dark) !important;
  border: 0 !important;
  border-right: 1px solid rgba(255,255,255,.25) !important;
}

.page_search button.submit:hover,
.page_search button.submit:focus,
.page_search input.submit:hover,
.page_search input.submit:focus {
  color: var(--agro-dark) !important;
  background: #fff !important;
  border-color: var(--agro) !important;
  outline: 3px solid rgba(8,115,77,.13);
}

.page_search button.submit:hover::before,
.page_search button.submit:focus::before {
  color: #fff !important;
  background: var(--agro) !important;
}

.page_search button.submit:hover::after,
.page_search button.submit:focus::after {
  color: #fff !important;
  background: var(--agro) !important;
}

/* About dropdown and other primary-navigation submenus */
.pkp_navigation_primary .dropdown-menu {
  padding: 6px !important;
  overflow: hidden;
  background: #fff !important;
  border: 1px solid #bfd8c9 !important;
  border-top: 4px solid var(--agro-gold) !important;
  border-radius: 0 0 10px 10px !important;
  box-shadow: 0 12px 28px rgba(5,77,53,.16) !important;
}

.pkp_navigation_primary .dropdown-menu > li {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

.pkp_navigation_primary .dropdown-menu > li > a {
  display: block;
  padding: 11px 14px !important;
  color: var(--agro-dark) !important;
  background: #fff !important;
  border: 0 !important;
  border-left: 3px solid transparent !important;
  border-radius: 5px;
  font-family: Arial, "Helvetica Neue", sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.35;
  text-decoration: none;
}

.pkp_navigation_primary .dropdown-menu > li > a:hover,
.pkp_navigation_primary .dropdown-menu > li > a:focus {
  color: #fff !important;
  background: var(--agro) !important;
  border-left-color: var(--agro-gold) !important;
}

.pkp_navigation_primary .dropdown-menu > li.current > a,
.pkp_navigation_primary .dropdown-menu > li.active > a {
  color: var(--agro-dark) !important;
  background: var(--agro-soft) !important;
  border-left-color: var(--agro) !important;
  font-weight: 700;
}

/* Keyboard focus throughout public navigation */
.pkp_navigation_primary a:focus-visible,
.pkp_navigation_user a:focus-visible {
  outline: 3px solid rgba(216,170,61,.55) !important;
  outline-offset: 2px;
}

/* Signed-in account dropdown */
#navigationUser .dropdown-menu,
.pkp_navigation_user .dropdown-menu {
  padding: 6px !important;
  background: #fff !important;
  border: 1px solid #bfd8c9 !important;
  border-top: 4px solid var(--agro-gold) !important;
  border-radius: 0 0 9px 9px !important;
  box-shadow: 0 10px 24px rgba(5,77,53,.16) !important;
}

#navigationUser .dropdown-menu > li > a,
.pkp_navigation_user .dropdown-menu > li > a {
  display: block !important;
  padding: 10px 12px !important;
  color: var(--agro-dark) !important;
  background: #fff !important;
  border: 0 !important;
  border-left: 4px solid transparent !important;
  border-radius: 5px !important;
  text-decoration: none !important;
}

#navigationUser .dropdown-menu > li > a:hover,
#navigationUser .dropdown-menu > li > a:focus,
.pkp_navigation_user .dropdown-menu > li > a:hover,
.pkp_navigation_user .dropdown-menu > li > a:focus {
  color: #fff !important;
  background: var(--agro) !important;
  border-left-color: var(--agro-gold) !important;
}

#navigationUser .dropdown-menu > li.current > a,
#navigationUser .dropdown-menu > li.active > a,
.pkp_navigation_user .dropdown-menu > li.current > a,
.pkp_navigation_user .dropdown-menu > li.active > a {
  color: var(--agro-dark) !important;
  background: var(--agro-soft) !important;
  border-left-color: var(--agro) !important;
}

/* =========================================================
   CONTACT PAGE — ALIGNED COLUMNS
   ========================================================= */
.page_contact .contact_section {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
  gap: clamp(32px, 7vw, 90px);
  width: 100%;
  margin: 0 !important;
  padding: 0 !important;
}

.page_contact .contact_section .contact {
  float: none !important;
  clear: none !important;
  position: static !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  width: auto !important;
  max-width: none !important;
  min-width: 0;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
  align-self: start !important;
}

.page_contact .contact_section .contact.primary {
  grid-column: 1 !important;
  grid-row: 1 !important;
}

.page_contact .contact_section .contact.support {
  grid-column: 2 !important;
  grid-row: 1 !important;
}

.page_contact .contact_section .contact > h2 {
  margin: 0 0 22px !important;
  padding: 0 0 11px !important;
  color: var(--agro-dark);
  border: 0 !important;
  border-bottom: 2px solid var(--agro-gold) !important;
  font-size: 20px;
  font-weight: 600;
  line-height: 1.25;
}

.page_contact .contact .name {
  margin: 0 0 6px;
  color: var(--agro-text);
  font-weight: 600;
}

.page_contact .contact .affiliation {
  margin: 0 0 12px;
  color: #617067;
  line-height: 1.55;
}

.page_contact .contact .email {
  margin-top: 12px;
}

.page_contact .cmp_edit_link {
  margin-bottom: 24px;
}

@media (max-width: 700px) {
  .page_contact .contact_section {
    grid-template-columns: 1fr;
    gap: 32px;
  }

  .page_contact .contact_section .contact.primary {
    grid-column: 1 !important;
    grid-row: 1 !important;
  }

  .page_contact .contact_section .contact.support {
    grid-column: 1 !important;
    grid-row: 2 !important;
  }
}

/* =========================================================
   EDITORIAL MASTHEAD CARDS — AUTOMATIC FROM OJS DATA
   ========================================================= */
.page_masthead {
  width: 100%;
}

.page_masthead > h1 {
  margin: 0 0 34px;
  padding-bottom: 17px;
  border-bottom: 3px solid var(--agro-gold);
  font-size: clamp(30px, 4vw, 42px);
  font-weight: 600;
}

.page_masthead > h2 {
  position: relative;
  margin: 42px 0 20px;
  padding: 13px 18px 13px 22px;
  color: #fff;
  background: linear-gradient(100deg, var(--agro-dark), var(--agro));
  border-radius: 9px;
  font-size: 20px;
  font-weight: 600;
  letter-spacing: .01em;
}

.page_masthead > h2::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 5px;
  background: var(--agro-gold);
  border-radius: 9px 0 0 9px;
}

.page_masthead .user_listing {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.page_masthead .user_listing > li {
  position: relative;
  min-height: 118px;
  display: block;
  box-sizing: border-box;
  margin: 0;
  padding: 25px 66px 23px 104px;
  overflow: hidden;
  color: var(--agro-text);
  background: linear-gradient(145deg, #fff 0%, #fbfdfc 100%);
  border: 1px solid var(--agro-border);
  border-radius: 13px;
  box-shadow: 0 7px 20px rgba(5, 77, 53, .07);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.page_masthead .user_listing > li:hover {
  transform: translateY(-2px);
  border-color: #bed7c8;
  box-shadow: 0 11px 28px rgba(5, 77, 53, .12);
}

/* Generic portrait, used because the default masthead does not output profile photos. */
.page_masthead .user_listing > li::before {
  content: "";
  position: absolute;
  top: 24px;
  left: 24px;
  width: 58px;
  height: 58px;
  border: 4px solid #e4f0e9;
  border-radius: 50%;
  background:
    radial-gradient(circle at 50% 34%, #fff 0 10px, transparent 11px),
    radial-gradient(ellipse at 50% 105%, #fff 0 23px, transparent 24px),
    linear-gradient(145deg, #0b8157, #064d37);
  box-shadow: 0 5px 13px rgba(6, 77, 55, .16);
}

.page_masthead .user_listing .name {
  display: block;
  margin: 0 0 8px;
  color: var(--agro-dark);
  font-family: Arial, "Helvetica Neue", sans-serif;
  font-size: 17px;
  font-weight: 700;
  line-height: 1.3;
}

.page_masthead .user_listing .affiliation {
  display: block;
  color: var(--agro-muted, #617067);
  font-family: Arial, "Helvetica Neue", sans-serif;
  font-size: 13px;
  line-height: 1.5;
}

.page_masthead .user_listing .date_start {
  position: absolute;
  top: 15px;
  right: 15px;
  display: inline-block;
  padding: 4px 8px;
  color: var(--agro-dark);
  background: var(--agro-soft);
  border: 1px solid #d4e8dc;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 700;
  line-height: 1.2;
  white-space: nowrap;
}

.page_masthead > p {
  margin: 34px 0 0;
  padding: 18px 20px;
  background: var(--agro-soft);
  border-left: 4px solid var(--agro);
  border-radius: 4px 9px 9px 4px;
}

.page_masthead > hr {
  display: none;
}

@media (max-width: 820px) {
  .page_masthead .user_listing {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 480px) {
  .page_masthead > h2 {
    margin-top: 30px;
    font-size: 17px;
  }

  .page_masthead .user_listing > li {
    min-height: 108px;
    padding: 22px 20px 20px 88px;
  }

  .page_masthead .user_listing > li::before {
    top: 22px;
    left: 18px;
    width: 50px;
    height: 50px;
  }

  .page_masthead .user_listing .date_start {
    position: static;
    margin-top: 9px;
  }
}

/* =========================================================
   SHARED PUBLIC-PAGE DESIGN SYSTEM
   Extends the Editorial Masthead look across OJS public pages.
   ========================================================= */

/* Page title */
.pkp_structure_main > .page > h1,
.pkp_structure_main > .page > .page_title,
.pkp_structure_main > .page > header > h1 {
  margin-top: 0;
  margin-bottom: 30px;
  padding-bottom: 16px;
  color: var(--agro-dark);
  border-bottom: 3px solid var(--agro-gold);
  font-family: Arial, "Helvetica Neue", sans-serif;
  font-size: clamp(29px, 4vw, 41px);
  font-weight: 600;
  line-height: 1.15;
  letter-spacing: -.015em;
}

/* Ordinary section headings; Masthead category headings retain their special bar. */
.pkp_structure_main > .page:not(.page_masthead) > h2,
.pkp_structure_main > .page:not(.page_masthead) section > h2,
.pkp_structure_main > .page:not(.page_masthead) .section_title {
  margin-top: 34px;
  margin-bottom: 17px;
  padding-left: 14px;
  color: var(--agro-dark);
  border-left: 4px solid var(--agro-gold);
  font-family: Arial, "Helvetica Neue", sans-serif;
  font-size: clamp(20px, 2.5vw, 27px);
  font-weight: 600;
  line-height: 1.25;
}

.pkp_structure_main > .page h3 {
  color: var(--agro-dark);
  font-size: 18px;
  font-weight: 600;
}

/* Breadcrumb */
.cmp_breadcrumbs {
  margin: 0 0 25px;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  font-size: 12px;
}

.cmp_breadcrumbs a {
  color: var(--agro);
  font-weight: 600;
  text-decoration: none;
}

.cmp_breadcrumbs .separator {
  color: #94a79c;
}

/* Reusable content cards */
.obj_issue_summary,
.obj_article_summary,
.cmp_announcement,
.submission_checklist,
.page_search .search_results > li,
.page_issue_archive .issues_archive > li {
  box-sizing: border-box;
  margin-bottom: 18px;
  padding: 22px;
  background: #fff;
  border: 1px solid var(--agro-border);
  border-radius: 11px;
  box-shadow: 0 6px 18px rgba(5, 77, 53, .06);
}

.obj_article_summary:hover,
.obj_issue_summary:hover,
.cmp_announcement:hover {
  border-color: #bed7c8;
  box-shadow: 0 9px 24px rgba(5, 77, 53, .10);
}

.obj_article_summary .title,
.obj_issue_summary .title,
.cmp_announcement .title {
  color: var(--agro-dark);
  font-family: Arial, "Helvetica Neue", sans-serif;
  font-weight: 600;
}

.obj_article_summary .title a,
.obj_issue_summary .title a,
.cmp_announcement .title a {
  color: var(--agro-dark);
  text-decoration: none;
}

.obj_article_summary .title a:hover,
.obj_issue_summary .title a:hover,
.cmp_announcement .title a:hover {
  color: var(--agro);
}

/* Article metadata and muted supporting text */
.obj_article_summary .authors,
.obj_article_summary .pages,
.obj_article_summary .published,
.obj_issue_summary .description,
.page .description {
  color: #617067;
}

/* Tables */
.pkp_structure_main > .page table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  overflow: hidden;
  border: 1px solid var(--agro-border);
  border-radius: 9px;
}

.pkp_structure_main > .page table th {
  padding: 12px 14px;
  color: #fff;
  background: var(--agro-dark);
  border-color: rgba(255,255,255,.14);
  text-align: left;
}

.pkp_structure_main > .page table td {
  padding: 12px 14px;
  border-color: var(--agro-border);
}

.pkp_structure_main > .page table tbody tr:nth-child(even) {
  background: #f7faf8;
}

/* Forms, including Login, Register, Search, and Submissions */
.pkp_structure_main > .page fieldset {
  margin: 20px 0;
  padding: 22px;
  border: 1px solid var(--agro-border);
  border-radius: 10px;
  background: #fbfdfc;
}

.pkp_structure_main > .page legend {
  padding: 0 9px;
  color: var(--agro-dark);
  font-weight: 700;
}

.pkp_structure_main > .page label {
  color: var(--agro-text);
  font-weight: 600;
}

.page_login form,
.page_register form,
.page_search form {
  max-width: 760px;
}

/* Notices and information panels */
.pkp_structure_main > .page .cmp_notification,
.pkp_structure_main > .page .pkp_notification,
.pkp_structure_main > .page .submission_checklist {
  color: var(--agro-text);
  background: var(--agro-soft);
  border-color: #cfe3d7;
  border-left: 4px solid var(--agro);
  border-radius: 5px 9px 9px 5px;
}

/* Pagination */
.cmp_pagination a,
.cmp_pagination .current {
  display: inline-flex;
  min-width: 34px;
  min-height: 34px;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  margin: 2px;
  padding: 5px 9px;
  border: 1px solid var(--agro-border);
  border-radius: 6px;
  text-decoration: none;
}

.cmp_pagination .current,
.cmp_pagination a:hover {
  color: #fff;
  background: var(--agro);
  border-color: var(--agro);
}

@media (max-width: 760px) {
  .pkp_structure_main > .page > h1,
  .pkp_structure_main > .page > .page_title,
  .pkp_structure_main > .page > header > h1 {
    margin-bottom: 23px;
    font-size: 28px;
  }

  .obj_issue_summary,
  .obj_article_summary,
  .cmp_announcement,
  .submission_checklist {
    padding: 18px;
  }

  .pkp_structure_main > .page table {
    display: block;
    overflow-x: auto;
  }
}

/* =========================================================
   JOIN JOURNAL SUMMARY + HOMEPAGE ADDITIONAL CONTENT
   They remain two OJS components but appear as one card.
   ========================================================= */
.page_index_journal .homepage_about,
.page_index_journal .additional_content {
  display: block;
  width: 100% !important;
  max-width: none !important;
  box-sizing: border-box !important;
  margin-right: 0 !important;
  margin-left: 0 !important;
  background: #fff;
  box-shadow: none !important;
}

.page_index_journal .homepage_about {
  margin-top: 34px !important;
  margin-bottom: 0 !important;
  padding: 34px 40px 24px !important;
  border: 1px solid var(--agro-border) !important;
  border-bottom: 0 !important;
  border-radius: 14px 14px 0 0 !important;
}

.page_index_journal .additional_content {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding: 0 40px 34px !important;
  border: 1px solid var(--agro-border) !important;
  border-top: 0 !important;
  border-radius: 0 0 14px 14px !important;
}

.page_index_journal .additional_content > :first-child {
  margin-top: 0 !important;
}

@media (max-width: 760px) {
  .page_index_journal .homepage_about {
    margin-top: 20px !important;
    padding: 26px 22px 18px !important;
  }

  .page_index_journal .additional_content {
    padding: 0 22px 24px !important;
  }
}

/* =========================================================
   HEADER ACCOUNT, PAGE CLEANUP, AND OJS COLUMN GUIDES
   ========================================================= */

/* Prevent the public layout from producing a horizontal scrollbar. */
html,
body,
.pkp_structure_page {
  max-width: 100%;
  overflow-x: hidden;
}

/* OJS draws two vertical column guides with these pseudo-elements. */
.pkp_structure_main::before,
.pkp_structure_main::after {
  content: none !important;
  display: none !important;
  width: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

/* Keep Login/Register or the signed-in account visible at the top-right. */
.pkp_navigation_user_wrapper,
#navigationUserWrapper {
  position: absolute !important;
  z-index: 20;
  top: 18px !important;
  right: 24px !important;
  left: auto !important;
  width: auto !important;
  max-width: calc(100% - 360px);
  margin: 0 !important;
  padding: 0 !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

.pkp_navigation_user,
#navigationUser {
  position: static !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  white-space: nowrap;
}

.pkp_navigation_user > li,
#navigationUser > li {
  position: relative !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
}

.pkp_navigation_user > li > a,
#navigationUser > li > a {
  display: inline-flex !important;
  min-height: 34px;
  align-items: center;
  padding: 7px 12px !important;
  box-sizing: border-box;
  color: var(--agro-dark) !important;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 6px;
  font-family: Arial, "Helvetica Neue", sans-serif;
  font-size: 12px;
  font-weight: 600;
  line-height: 18px;
  text-decoration: none;
}

.pkp_navigation_user > li > a:hover,
.pkp_navigation_user > li > a:focus,
#navigationUser > li > a:hover,
#navigationUser > li > a:focus {
  color: #fff !important;
  background: var(--agro);
  border-color: var(--agro);
}

/* Give Register a bordered-button treatment when OJS displays it. */
#navigationUser a[href*="/user/register"],
#navigationUser a[href*="/register"] {
  border-color: var(--agro) !important;
}

/* Keep the account dropdown anchored to its trigger instead of page width. */
.pkp_navigation_user .dropdown-menu,
#navigationUser .dropdown-menu {
  right: 0 !important;
  left: auto !important;
  width: max-content !important;
  min-width: 170px !important;
  max-width: 260px;
}

/* Home: clean transitions between navbar, hero, and information card. */
.page_index_journal {
  width: 100%;
  overflow: visible;
}

.page_index_journal .homepage_image {
  width: 100%;
  border: 0;
}

.homepage_about,
.additional_content {
  box-shadow: none;
}

@media (max-width: 760px) {
  .pkp_navigation_user_wrapper,
  #navigationUserWrapper {
    position: static !important;
    width: 100% !important;
    max-width: none;
    padding: 8px 0 !important;
  }

  .pkp_navigation_user,
  #navigationUser {
    justify-content: flex-start;
    flex-wrap: wrap;
  }

  .pkp_navigation_user > li > a,
  #navigationUser > li > a {
    color: #fff !important;
  }
}

/* =========================================================
   REFERENCE COMPOSITION — DECORATIVE HERO DETAILS
   The two hero buttons are intentionally visual only.
   ========================================================= */
.page_index_journal {
  position: relative;
}

/* Small faculty label above the main title. */
.page_index_journal::before {
  content: "FAKULTAS PERTANIAN · UNIVERSITAS MULAWARMAN";
  position: absolute;
  z-index: 3;
  top: clamp(58px, 8vw, 94px);
  left: clamp(30px, 5vw, 66px);
  color: #f4f5d8;
  font-family: Arial, "Helvetica Neue", sans-serif;
  font-size: clamp(10px, 1.15vw, 14px);
  font-weight: 700;
  line-height: 1;
  letter-spacing: .16em;
  white-space: nowrap;
  pointer-events: none;
}

/* No decorative buttons are shown in the hero. */
.page_index_journal::after {
  content: none;
  display: none;
}

/* Align title and subtitle with the reference after adding the faculty label. */
.page_index_journal .homepage_image::before {
  top: 27%;
  font-size: clamp(48px, 5.8vw, 76px);
  font-weight: 600;
  line-height: .96;
}

.page_index_journal .homepage_image::after {
  top: 64%;
  font-size: clamp(18px, 1.9vw, 27px);
  font-weight: 400;
}

@media (max-width: 760px) {
  .page_index_journal::before {
    top: 42px;
    left: 22px;
    max-width: calc(100% - 44px);
    overflow: hidden;
    font-size: 8px;
    letter-spacing: .11em;
  }

  .page_index_journal .homepage_image::before {
    top: 28%;
    font-size: clamp(33px, 10vw, 48px);
  }

  .page_index_journal .homepage_image::after {
    top: 63%;
    font-size: clamp(15px, 4.7vw, 20px);
  }
}

/* Photo treatment: dark green on the left, clearer on the right. */
.page_index_journal .homepage_image {
  height: clamp(430px, 43vw, 540px);
  background: linear-gradient(90deg, #003f2d 0%, #07523a 38%, #c9d5d2 100%);
}

.page_index_journal .homepage_image img {
  object-fit: cover;
  object-position: center center;
  filter: brightness(.88) saturate(.9) contrast(1.02);
  -webkit-mask-image: linear-gradient(90deg, rgba(0,0,0,.56) 0%, rgba(0,0,0,.76) 38%, #000 72%);
  mask-image: linear-gradient(90deg, rgba(0,0,0,.56) 0%, rgba(0,0,0,.76) 38%, #000 72%);
}

@media (max-width: 760px) {
  .page_index_journal .homepage_image {
    height: 340px;
  }

  .page_index_journal .homepage_image img {
    object-position: 58% center;
  }
}