/* =============================================================
   FACTOR M — CSS-only OJS facelift (v1)
   Designed for common OJS 3 / default-theme class names.
   No template/PHP changes. Test on desktop and mobile first.
   ============================================================= */
:root {
  --fm-navy: #143b52;
  --fm-navy-dark: #0c2a3c;
  --fm-teal: #087f8c;
  --fm-ink: #213547;
  --fm-muted: #657587;
  --fm-bg: #f6f9fb;
  --fm-border: #e0e8ed;
  --fm-radius: 12px;
}

/* Base typography */
body {
  background: var(--fm-bg);
  color: var(--fm-ink);
  font-family: system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
  line-height: 1.7;
}
a { color: var(--fm-teal); }
a:hover, a:focus { color: var(--fm-navy); }

/* Masthead; keep markup and accessibility controls intact */
.pkp_structure_head { background: var(--fm-navy); border-bottom: 0; }
.pkp_site_name, .pkp_site_name_wrapper { background: transparent; }
.pkp_site_name a, .pkp_site_name a:hover { color: #fff; }
.pkp_site_name .is_text { color: #fff; font-weight: 750; letter-spacing: -.025em; line-height: 1.3; }
.pkp_navigation_primary_wrapper { background: var(--fm-navy-dark); border-bottom: 0; }
.pkp_navigation_primary > li > a,
.pkp_navigation_user > li > a { color: #fff; }
.pkp_navigation_primary > li > a:hover,
.pkp_navigation_primary > li > a:focus,
.pkp_navigation_user > li > a:hover { color: #a9e6eb; }
.pkp_navigation_primary > li > a:after { background: #6bd5de; }
/* Dropdown text must remain legible on light dropdown backgrounds */
.pkp_navigation_primary ul a { color: var(--fm-ink); }
.pkp_navigation_primary ul a:hover { color: var(--fm-teal); }

/* Content canvas */
.pkp_structure_content { background: #fff; }
.pkp_structure_main { min-width: 0; }
.pkp_page_index .homepage_image img { border-radius: var(--fm-radius); height: auto; }
.pkp_page_index .additional_content,
.pkp_page_index .homepage_about,
.pkp_page_index .cmp_announcements,
.pkp_page_index .current_issue {
  margin-bottom: 28px;
}
.pkp_page_index .homepage_about,
.pkp_page_index .additional_content {
  background: #fff;
  border: 1px solid var(--fm-border);
  padding: 22px 24px;
  border-radius: var(--fm-radius);
}
/* Do not blanket-style every heading across editorial/admin screens */
.pkp_page_index .page_title,
.pkp_page_index .homepage_about h2,
.pkp_page_index .cmp_announcements h2,
.pkp_page_index .current_issue > h2,
.pkp_page_index .current_issue .current_issue_title {
  color: var(--fm-navy);
  font-weight: 750;
  letter-spacing: -.02em;
}
.pkp_page_index h2:where(:not(.title)) { line-height: 1.35; }

/* Journal-description tables */
.pkp_page_index .homepage_about table,
.pkp_page_index .additional_content table {
  width: 100%; border-collapse: collapse; font-size: .96em;
}
.pkp_page_index .homepage_about td,
.pkp_page_index .additional_content td {
  padding: 10px 12px; border-bottom: 1px solid var(--fm-border);
  vertical-align: top;
}
.pkp_page_index .homepage_about tr:nth-child(even),
.pkp_page_index .additional_content tr:nth-child(even) { background: #f7fafc; }

/* Issue and article listings; selector names used by default OJS 3 themes */
.pkp_page_index .obj_issue_toc .sections,
.pkp_page_index .obj_issue_toc .section { padding: 0; }
.pkp_page_index .obj_issue_toc .articles > li,
.pkp_page_index .obj_issue_toc .galleys > li,
.pkp_page_index .obj_issue_summary {
  border: 1px solid var(--fm-border);
  border-radius: var(--fm-radius);
  background: #fff;
  padding: 16px 18px;
  margin-bottom: 14px;
  box-shadow: 0 3px 12px rgba(9,39,58,.04);
}
.pkp_page_index .obj_issue_toc .articles .title,
.pkp_page_index .obj_issue_toc .articles .title a,
.pkp_page_index .obj_issue_summary .title a {
  color: var(--fm-navy); font-weight: 700; line-height: 1.45;
}
.pkp_page_index .obj_issue_toc .articles .title a:hover,
.pkp_page_index .obj_issue_summary .title a:hover { color: var(--fm-teal); }
.pkp_page_index .obj_issue_toc .articles .authors,
.pkp_page_index .obj_issue_summary .description { color: var(--fm-muted); }

/* Links styled as buttons only when OJS marks them as galleys */
.obj_galley_link,
.pkp_page_index a.obj_galley_link {
  display: inline-block;
  padding: 6px 13px;
  border: 1px solid var(--fm-teal);
  border-radius: 6px;
  color: var(--fm-teal);
  font-weight: 650;
  text-decoration: none;
  background: #fff;
}
.obj_galley_link:hover, .obj_galley_link:focus {
  background: var(--fm-teal);
  color: #fff;
}

/* Announcements */
.pkp_page_index .obj_announcement_summary {
  background: #edf6f8;
  border-left: 4px solid var(--fm-teal);
  padding: 16px 18px;
  border-radius: 0 10px 10px 0;
  margin-bottom: 16px;
}
.pkp_page_index .obj_announcement_summary .title a { color: var(--fm-navy); }

/* Sidebars if they already exist; CSS does not create them */
.pkp_structure_sidebar .pkp_block {
  border: 1px solid var(--fm-border);
  border-radius: var(--fm-radius);
  background: #fff;
  padding: 16px;
  margin-bottom: 18px;
}
.pkp_structure_sidebar .pkp_block .title { color: var(--fm-navy); font-weight: 700; }

/* Footer */
.pkp_structure_footer { background: var(--fm-navy-dark); color: #e8f3f7; }
.pkp_structure_footer a { color: #b1ebee; }

/* Mobile: avoid forced desktop nav or horizontal overflow */
@media (max-width: 767px) {
  .pkp_site_name .is_text { font-size: 1.25rem; }
  .pkp_page_index .homepage_about,
  .pkp_page_index .additional_content { padding: 16px; }
  .pkp_page_index .obj_issue_toc .articles > li,
  .pkp_page_index .obj_issue_summary { padding: 14px; }
  .pkp_page_index .homepage_about table,
  .pkp_page_index .additional_content table { display: block; overflow-x: auto; }
}
/* Factor M — patch header untuk Redesign CSS v1
   Pasang SETELAH stylesheet v1, bukan mengganti seluruh CSS.
   Desain sederhana; hanya mengubah header/navigation. */

/* 1. Kurangi ketinggian header dan pertahankan warna solid */
.pkp_structure_head {
  background: #173c50 !important;
  border-top: 3px solid #146b7e;
  box-shadow: none !important;
}
.pkp_structure_head .pkp_head_wrapper {
  position: relative;
  min-height: 152px;
  max-width: 1140px;
  margin: 0 auto;
}

/* 2. Isi area kosong dengan identitas jurnal.
   Teks ini dekoratif; untuk aksesibilitas/SEO tetap atur Journal Title di OJS. */
.pkp_structure_head .pkp_head_wrapper::before {
  content: "Factor M";
  position: absolute;
  left: 20px;
  top: 34px;
  color: #fff;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 35px;
  font-weight: 700;
  letter-spacing: .1px;
  line-height: 1.15;
  pointer-events: none;
}
.pkp_structure_head .pkp_head_wrapper::after {
  content: "Journal Focus Action of Research Mathematic";
  position: absolute;
  left: 21px;
  top: 80px;
  color: #d4e2e8;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 13px;
  font-weight: 400;
  letter-spacing: .1px;
  pointer-events: none;
}

/* 3. Menu bersih tanpa efek tombol atau bayangan */
.pkp_structure_head .pkp_navigation_primary_wrapper,
.pkp_structure_head .pkp_navigation_primary_row {
  background: #102d3d !important;
  box-shadow: none !important;
}
.pkp_navigation_primary > li > a,
.pkp_navigation_primary > li > a:visited {
  color: #fff !important;
  font-weight: 500;
  text-transform: none;
}
.pkp_navigation_primary > li > a:hover,
.pkp_navigation_primary > li > a:focus {
  background: #1c495c !important;
  color: #fff !important;
}

/* 4. Jangan sampai label tambahan menghalangi navigasi mobile */
@media (max-width: 991px) {
  .pkp_structure_head .pkp_head_wrapper { min-height: 105px; }
  .pkp_structure_head .pkp_head_wrapper::before {
    left: 16px; top: 22px; font-size: 27px;
  }
  .pkp_structure_head .pkp_head_wrapper::after {
    left: 17px; top: 60px; font-size: 11px;
  }
}
@media (max-width: 480px) {
  .pkp_structure_head .pkp_head_wrapper::before { font-size: 24px; top: 18px; }
  .pkp_structure_head .pkp_head_wrapper::after { font-size: 10px; top: 51px; max-width: 75%; }
}
/* Factor M — Sidebar correction, place AFTER redesign v1.
   Non-destructive: keep native OJS sidebar structure and widgets. */
@media (min-width: 992px) {
  .pkp_structure_sidebar {
    padding-top: 24px;
    padding-bottom: 24px;
  }
}
.pkp_structure_sidebar .pkp_block {
  box-sizing: border-box;
  background: #fff;
  border: 1px solid #e2e8ec;
  border-radius: 6px;
  padding: 15px 16px;
  margin: 0 0 16px;
  height: auto;
  min-height: 0;
  box-shadow: none;
  overflow-wrap: anywhere;
}
.pkp_structure_sidebar .pkp_block .title {
  display: block;
  color: #173c50;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.4;
  margin: 0 0 12px;
}
.pkp_structure_sidebar .pkp_block .content {
  height: auto;
  min-height: 0;
  margin: 0;
  padding: 0;
}
/* Certificates and indexation logos should fit their containers. */
.pkp_structure_sidebar .pkp_block img {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 0 auto;
  object-fit: contain;
}
.pkp_structure_sidebar .pkp_block .content p {
  margin: 0 0 10px;
  padding: 0;
}
.pkp_structure_sidebar .pkp_block .content p:last-child { margin-bottom: 0; }
.pkp_structure_sidebar .pkp_block .content p:empty { display: none; }
.pkp_structure_sidebar .pkp_block .content > br { display: none; }
/* Present native submission link as a simple academic-style CTA. */
.pkp_structure_sidebar .block_make_submission a {
  display: inline-block;
  width: auto;
  max-width: 100%;
  background: #173c50;
  color: #fff !important;
  border: 1px solid #173c50;
  border-radius: 4px;
  padding: 9px 13px;
  font-weight: 600;
  text-align: center;
  text-decoration: none;
  box-shadow: none;
}
.pkp_structure_sidebar .block_make_submission a:hover,
.pkp_structure_sidebar .block_make_submission a:focus {
  background: #24546b;
  border-color: #24546b;
  color: #fff !important;
}
/* Keep any information-link lists readable but not stretched. */
.pkp_structure_sidebar .pkp_block ul { margin: 0; padding-left: 18px; }
.pkp_structure_sidebar .pkp_block li { margin-bottom: 7px; line-height: 1.5; }
@media (max-width: 991px) {
  .pkp_structure_sidebar .pkp_block { margin-bottom: 12px; padding: 14px; }
}


/* Factor M — Sidebar v3: patch AFTER stylesheet v2.
   Uses provided OJS markup; no PHP/template changes. */

/* Only the OUTER blocks get a card. Never frame nested .pkp_block. */
.pkp_structure_sidebar > .pkp_block {
  box-sizing: border-box;
  background: #fff;
  border: 1px solid #e2e8ec;
  border-radius: 5px;
  margin: 0 0 14px;
  padding: 14px 15px;
  box-shadow: none;
  height: auto;
  min-height: 0;
}
.pkp_structure_sidebar .pkp_block .pkp_block,
.pkp_structure_sidebar .pkp_block .content .pkp_block {
  display: block;
  width: 100%;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  padding: 0 !important;
  margin: 0 !important;
  height: auto !important;
  min-height: 0 !important;
}
/* Undo old global styling for the nested wrappers. */
.pkp_structure_sidebar .pkp_block .content,
.pkp_structure_sidebar .pkp_block .pkp_block .content {
  padding: 0;
  margin: 0;
  min-height: 0;
  height: auto;
}
/* Screen reader headings must stay visually hidden. */
.pkp_structure_sidebar .pkp_screen_reader {
  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;
  white-space: nowrap !important;
  border: 0 !important;
}
/* Images fill their block naturally; no distortion. */
.pkp_structure_sidebar .pkp_block img {
  display: block;
  width: auto;
  max-width: 100%;
  height: auto;
  margin-inline: auto;
}
#customblock-sinta4 img { width: 100%; }
/* Compact menu, override inline 45px bars only in these blocks. */
#customblock-Menu p[style*="background"],
#customblock-downloadtemplate p[style*="background"],
#customblock-tools p[style*="background"],
#customblock-visitor p[style*="background"] {
  box-sizing: border-box;
  height: auto !important;
  min-height: 0 !important;
  padding: 10px 12px !important;
  margin: 0 0 12px !important;
  background: #173c50 !important;
  border: 0 !important;
  color: #fff !important;
  text-align: left !important;
  font-size: 14px !important;
  line-height: 1.35 !important;
}
#customblock-Menu .menu_item {
  margin: 0 !important;
  padding: 0 !important;
}
#customblock-Menu .menu_item a {
  display: block;
  padding: 7px 3px;
  line-height: 1.35;
  text-decoration: none;
  overflow-wrap: anywhere;
}
#customblock-Menu .menu_item a:hover { text-decoration: underline; }
#customblock-Menu .menu_item em { margin-right: 5px; }
.pkp_structure_sidebar .block_make_submission .content { margin: 0; }
.pkp_structure_sidebar .block_make_submission a {
  display: block;
  width: 100%;
  box-sizing: border-box;
  padding: 10px 12px;
  text-align: center;
  background: #173c50;
  border: 1px solid #173c50;
  color: #fff !important;
  border-radius: 4px;
}
/* Do not introduce artificial height or huge gaps. */
.pkp_structure_sidebar .pkp_block p:empty { display: none; }
.pkp_structure_sidebar .pkp_block p:last-child { margin-bottom: 0; }
@media (max-width: 767px) {
  .pkp_structure_sidebar > .pkp_block { padding: 12px; }
}
