@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&family=Inter:wght@400;600&display=swap');
/* =========================================================================
   ORDINA – Organizational IT Governance, Digital Law, Internet Telematics
   and Assurance Journal (versi final: tema v3 + komponen ORDINA)
   Draft stylesheet v3 · OJS 3.3 Default Theme
   Layout reference: ENIGMA (header band, colour-strip nav, hero, sidebar blocks)
   Upload: Settings > Website > Appearance > Advanced > Journal style sheet

   Palette – sampled from the ORDINA logo
   - Navy deep  #061E4E   (footer, dark surfaces)
   - Navy       #062A5A   (header, nav, block titles, headings)
   - Teal       #1296A2   (links, accents, buttons)
   - Gold       #CDAF41   (highlights, active nav, CTA)
   - Paper      #F6F6F6   (page canvas)
   - Mint       #EAF6F6   (soft teal tint for panels)
   - Slate      #7E8AA2   (muted text and borders)
   ========================================================================= */

:root {
  --ord-navy-900: #061E4E;
  --ord-navy:     #062A5A;
  --ord-teal:     #1296A2;
  --ord-gold:     #CDAF41;
  --ord-white:    #FFFFFF;
  --ord-paper:    #F6F6F6;
  --ord-mint:     #EAF6F6;
  --ord-slate:    #7E8AA2;
  --ord-ink:      #062A5A;
  --ord-line:     #DCE3EA;
  --ord-radius:   10px;
  --ord-strip: linear-gradient(90deg,
              var(--ord-gold) 0 55%, var(--ord-teal) 55% 80%, var(--ord-white) 80% 100%);
}

/* ---------- Canvas ---------- */
body {
  background: var(--ord-paper) !important;
  color: var(--ord-ink);
  font-family: Poppins, Inter, sans-serif;
}
.pkp_structure_page {
  background: var(--ord-white);
  box-shadow: 0 0 0 1px var(--ord-line);
}
.pkp_structure_content { background: var(--ord-white); }
a { color: var(--ord-teal); }
a:hover, a:focus { color: var(--ord-navy); }

/* ---------- Header band (uploaded ORDINA banner as page header) ---------- */
.pkp_structure_head {
  background: var(--ord-navy);
  border-bottom: 0;
}
.pkp_site_name_wrapper { padding: 0; }
.pkp_site_name .is_img img { width: 100%; height: auto; max-height: none; display: block; }

/* ---------- Primary navigation with colour strip (ENIGMA style) ---------- */
.pkp_navigation_primary_row {
  background: var(--ord-navy-900);
  border-bottom: 4px solid transparent;
  border-image: var(--ord-strip) 1;
}
.pkp_navigation_primary > li > a,
.pkp_navigation_search_wrapper a {
  color: var(--ord-white);
  font-weight: 600;
}
.pkp_navigation_primary > li > a:hover,
.pkp_navigation_primary > li > a:focus,
.pkp_navigation_primary > li.current > a {
  color: var(--ord-gold);
  background: transparent;
}
.pkp_navigation_primary ul {
  background: var(--ord-navy-900);
  border-radius: 0 0 var(--ord-radius) var(--ord-radius);
}

/* ---------- Homepage hero (1600 x 460) ---------- */
.homepage_image img,
.pkp_structure_main .homepage_image img { border-radius: var(--ord-radius); }

/* ---------- Section headings with gold marker ---------- */
.pkp_page_content h1,
.pkp_page_content h2,
.pkp_page_content h3 {
  color: var(--ord-navy);
  font-weight: 700;
}
.pkp_page_content h2 {
  padding-left: 12px;
  border-left: 5px solid var(--ord-gold);
}
.pkp_page_content h3 { color: var(--ord-teal); }

/* ---------- Welcome / about box ---------- */
.pkp_page_content .journal_description,
.pkp_page_content blockquote {
  background: var(--ord-mint);
  border-left: 5px solid var(--ord-teal);
  border-radius: var(--ord-radius);
  padding: 16px 20px;
}

/* ---------- Journal summary table ---------- */
.journal_summary_table th { color: var(--ord-navy); }
.journal_summary_table th,
.journal_summary_table td { border-color: var(--ord-line); }
.journal_summary_table tr:nth-child(odd) { background: var(--ord-paper); }

/* ---------- Sidebar blocks ---------- */
.pkp_block {
  background: var(--ord-white);
  border: 1px solid var(--ord-line);
  border-radius: var(--ord-radius);
  overflow: hidden;
  margin-bottom: 18px;
}
.pkp_block .title {
  background: var(--ord-navy);
  color: var(--ord-white);
  padding: 10px 14px;
  border-bottom: 3px solid var(--ord-gold);
  font-weight: 600;
}
.pkp_block .content { padding: 12px 14px; }
.pkp_block .content a { display: block; padding: 4px 0; }

/* ---------- Submission call to action (gold, navy text) ---------- */
.pkp_block.block_make_submission .content a,
.pkp_button.submit,
.cmp_button.submit {
  background: var(--ord-gold);
  color: var(--ord-navy-900);
  border: 0;
  border-radius: 999px;
  font-weight: 700;
  text-align: center;
}
.pkp_block.block_make_submission .content a:hover,
.pkp_button.submit:hover { background: var(--ord-teal); color: var(--ord-white); }

/* ---------- Article and issue cards ---------- */
.obj_article_summary,
.obj_issue_summary {
  background: var(--ord-white);
  border: 1px solid var(--ord-line);
  border-left: 5px solid var(--ord-teal);
  border-radius: var(--ord-radius);
  padding: 14px 16px;
  margin-bottom: 14px;
}
.obj_article_summary .title a,
.obj_issue_summary .title a { color: var(--ord-navy); font-weight: 600; }
.obj_article_summary .title a:hover { color: var(--ord-teal); }
.obj_article_summary .galleys_links a,
.obj_article_summary .pkp_button {
  border-radius: 999px;
  background: var(--ord-teal);
  color: var(--ord-white);
  border: 0;
  padding: 4px 12px;
}

/* ---------- Buttons ---------- */
.pkp_button,
.cmp_button {
  background: var(--ord-teal);
  border-color: var(--ord-teal);
  color: var(--ord-white);
  border-radius: 999px;
}
.pkp_button:hover,
.cmp_button:hover { background: var(--ord-navy); border-color: var(--ord-navy); }

/* ---------- Footer with colour strip ---------- */
.pkp_structure_footer_wrapper {
  background: var(--ord-navy-900);
  color: var(--ord-paper);
  border-top: 4px solid transparent;
  border-image: var(--ord-strip) 1;
}
.pkp_structure_footer_wrapper a { color: var(--ord-white); }
.pkp_footer_content { color: var(--ord-paper); }

/* ---------- Dark mode (same palette, inverted surfaces) ---------- */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) body { background: var(--ord-navy-900) !important; color: var(--ord-paper); }
  :root:not([data-theme="light"]) .pkp_structure_page,
  :root:not([data-theme="light"]) .pkp_structure_content,
  :root:not([data-theme="light"]) .obj_article_summary,
  :root:not([data-theme="light"]) .pkp_block { background: var(--ord-navy); color: var(--ord-paper); }
  :root:not([data-theme="light"]) .pkp_page_content .journal_description,
  :root:not([data-theme="light"]) .pkp_page_content blockquote { background: var(--ord-navy-900); }
  :root:not([data-theme="light"]) a { color: var(--ord-gold); }
  :root:not([data-theme="light"]) .pkp_page_content h1,
  :root:not([data-theme="light"]) .pkp_page_content h2,
  :root:not([data-theme="light"]) .pkp_page_content h3 { color: var(--ord-white); }
}
:root[data-theme="dark"] body { background: var(--ord-navy-900) !important; color: var(--ord-paper); }
:root[data-theme="dark"] .pkp_structure_page,
:root[data-theme="dark"] .pkp_structure_content,
:root[data-theme="dark"] .obj_article_summary,
:root[data-theme="dark"] .pkp_block { background: var(--ord-navy); color: var(--ord-paper); }
:root[data-theme="dark"] a { color: var(--ord-gold); }

/* ---------- Phone width ---------- */
@media (max-width: 767px) {
  .pkp_structure_content { padding: 0 16px; }
  .pkp_navigation_primary > li > a { padding: 12px 14px; }
}

/* =========================================================================
   Komponen ORDINA (blok sidebar, halaman statis, footer) — dipertahankan
   dari kit sebelumnya agar kelas .ordina-* tetap tampil rapi
   ========================================================================= */
:root { --ord-teal-light: var(--ord-mint); --ord-grey: var(--ord-paper); }

.pkp_navigation_primary_wrapper { padding-left: 1.5rem; padding-right: 1.25rem; }

.ordina-menu { list-style: none; margin: 0; padding: 0; }
.ordina-menu li { border-bottom: 1px solid var(--ord-line); }
.ordina-menu li:last-child { border-bottom: 0; }
.pkp_block .content .ordina-menu a {
  display: block; padding: .5rem .25rem .5rem .8rem;
  font-weight: 600; text-decoration: none;
  border-left: 3px solid transparent;
}
.pkp_block .content .ordina-menu a:hover {
  background: var(--ord-mint); border-left-color: var(--ord-teal);
}
.ordina-info { margin: 0; padding: 0; list-style: none; font-size: .9rem; }
.ordina-info li { padding: .3rem 0; }
.ordina-info strong { color: var(--ord-navy); }
.pkp_block .content a.ordina-badge, .ordina-badge {
  display: inline-block; margin: .2rem .2rem .2rem 0; padding: .3rem .6rem;
  border: 1px solid var(--ord-teal); border-radius: 999px;
  color: var(--ord-teal); font-size: .8rem; font-weight: 600; text-decoration: none;
}
.ordina-badge:hover { background: var(--ord-teal); color: #fff !important; }
.ordina-muted { color: var(--ord-slate); font-size: .8rem; }
.pkp_block .content a.ordina-btn, .ordina-btn {
  display: block; padding: .7rem 1rem; background: var(--ord-teal);
  color: #fff !important; text-align: center; font-weight: 700;
  border-radius: 999px; text-decoration: none;
}
.ordina-btn--gold { background: var(--ord-gold) !important; color: var(--ord-navy-900) !important; }

.ordina-page h2 { margin-top: 1.6em; }
.ordina-page table { width: 100%; border-collapse: collapse; margin: 1rem 0; font-size: .95rem; }
.ordina-page th { background: var(--ord-navy); color: #fff; text-align: left; padding: .6rem .8rem; }
.ordina-page td { padding: .6rem .8rem; border-bottom: 1px solid var(--ord-line); vertical-align: top; }
.ordina-page tr:nth-child(even) td { background: var(--ord-paper); }
.ordina-page .ordina-info-table td:first-child { width: 32%; font-weight: 700; color: var(--ord-navy); }
.ordina-note {
  margin: 1rem 0; padding: .8rem 1rem; background: var(--ord-mint);
  border-left: 4px solid var(--ord-teal); border-radius: 6px;
}

.ordina-footer { display: flex; flex-wrap: wrap; gap: 1.5rem 3rem; justify-content: space-between; font-size: .9rem; line-height: 1.6; }
.ordina-footer h4 { margin: 0 0 .4rem; color: var(--ord-gold); font-size: .85rem; letter-spacing: .08em; text-transform: uppercase; }
.ordina-footer p { margin: 0 0 .3rem; }
.pkp_brand_footer { background: var(--ord-navy-900); }
.pkp_brand_footer img { filter: brightness(0) invert(1); opacity: .8; }
@media (max-width: 767px) { .ordina-footer { flex-direction: column; } }

/* ---------- Tipografi: Poppins untuk semua judul (tema bawaan memakai serif) ---------- */
.pkp_structure_page, .pkp_structure_page h1, .pkp_structure_page h2, .pkp_structure_page h3,
.pkp_structure_page h4, .pkp_block .title, .obj_article_summary .title,
.obj_issue_summary .title, .page_title, .cmp_breadcrumbs, .pkp_navigation_primary > li > a {
  font-family: Poppins, Inter, sans-serif !important;
}
.homepage_image { margin: 0 0 1.25rem; }
.homepage_image img { width: 100%; height: auto; display: block; }

/* ---------- Hero: latar putih agar menyatu dengan halaman ---------- */
.homepage_image,
.pkp_structure_main .homepage_image {
  background: #FFFFFF;
  border-radius: 0;
  padding: 0;
}
.homepage_image img,
.pkp_structure_main .homepage_image img {
  border-radius: 0;
}