/* ============================================================
   E-JOURNAL UNIVERSITAS TRIDINANTI — Custom Stylesheet (OJS 3.3)
   Cara pakai: Journal Settings → Appearance → Advanced
   → Upload a custom stylesheet → file ini
   ============================================================ */

/* ---------- 1. VARIABEL WARNA (gampang diubah) ---------- */
:root {
  --ut-primary:   #0b3d66;   /* biru tua kampus */
  --ut-accent:    #008acb;   /* biru terang aksen */
  --ut-accent2:   #f2a900;   /* emas aksen sekunder */
  --ut-bg:        #f4f6f8;   /* latar halaman */
  --ut-card:      #ffffff;
  --ut-text:      #2c3e50;
  --ut-muted:     #5d6d7e;
  --ut-danger:    #c0392b;
  --ut-radius:    8px;
  --ut-shadow:    0 2px 8px rgba(11, 61, 102, 0.08);
}

/* ---------- 2. BODY & BACKGROUND ---------- */
body {
  background: var(--ut-bg);
  color: var(--ut-text);
  font-size: 15px;
}

/* ---------- 3. HEADER — gradasi biru kampus ---------- */
.pkp_structure_head {
  background: linear-gradient(135deg, var(--ut-primary) 0%, var(--ut-accent) 100%);
  border-bottom: 4px solid var(--ut-accent2);
  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.25);
}
.pkp_head_wrapper {
  padding: 8px 0 14px;
  max-width: 1300px;
  margin: 0 auto;
}

/* Nama jurnal */
.pkp_site_name a {
  color: #ffffff !important;
  font-weight: 700;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
  font-size: 1.7em;
  letter-spacing: 0.3px;
}
.pkp_site_name a:hover { color: var(--ut-accent2) !important; }

/* Navigasi */
.pkp_site_nav_menu ul li a {
  color: #eaf2f8 !important;
  font-weight: 500;
  border-radius: 4px;
  transition: background 0.2s, color 0.2s;
}
.pkp_site_nav_menu ul li a:hover {
  background: rgba(255, 255, 255, 0.15);
  color: #ffffff !important;
}

/* ---------- 4. KONTEN UTAMA — kartu putih ---------- */
.pkp_structure_content {
  background: transparent;
}
.pkp_structure_main {
  background: var(--ut-card);
  border-radius: var(--ut-radius);
  box-shadow: var(--ut-shadow);
  padding: 24px;
  margin: 24px 0;
}
/* Homepage intro / tentang jurnal */
.homepage_about, .pkp_structure_main > .about {
  background: #f0f7fc;
  border-left: 5px solid var(--ut-accent);
  border-radius: var(--ut-radius);
  padding: 18px 22px;
  margin-bottom: 24px;
}

/* ---------- 5. HEADING ---------- */
h1, h2, h3, h4 {
  color: var(--ut-primary);
  line-height: 1.35;
}
h2 { border-bottom: 2px solid #e3ebf1; padding-bottom: 8px; }

/* ---------- 6. SIDEBAR — blok rata & rapi ---------- */
.pkp_structure_sidebar {
  background: transparent;
}
.pkp_block {
  background: var(--ut-card);
  border-radius: var(--ut-radius);
  box-shadow: var(--ut-shadow);
  border-top: 4px solid var(--ut-accent);
  margin-bottom: 20px;
  padding: 16px;
}
.pkp_block .title {
  color: var(--ut-primary);
  font-weight: 700;
  text-transform: uppercase;
  font-size: 0.85em;
  letter-spacing: 0.6px;
  border-bottom: 1px solid #e3ebf1;
  padding-bottom: 8px;
  margin-bottom: 10px;
}
.pkp_block a { color: var(--ut-accent); text-decoration: none; }
.pkp_block a:hover { color: var(--ut-primary); text-decoration: underline; }

/* ---------- 7. ARTIKEL / DAFTAR TERBITAN ---------- */
.obj_article_summary {
  background: #ffffff;
  border: 1px solid #e3ebf1;
  border-radius: var(--ut-radius);
  padding: 16px 18px;
  margin-bottom: 16px;
  transition: box-shadow 0.2s, transform 0.2s;
}
.obj_article_summary:hover {
  box-shadow: 0 4px 16px rgba(11, 61, 102, 0.15);
  transform: translateY(-2px);
}
.obj_article_summary h3 a {
  color: var(--ut-primary);
  font-weight: 600;
}
.obj_article_summary h3 a:hover { color: var(--ut-accent); }

/* ---------- 8. TOMBOL (GLOBAL) ---------- */
.btn, .cmp_button, .pkp_button,
input[type="submit"], .submit {
  background: var(--ut-accent) !important;
  color: #ffffff !important;
  border-radius: 5px !important;
  border: none !important;
  font-weight: 600 !important;
  padding: 8px 16px !important;
  transition: background 0.2s;
}
.btn:hover, .cmp_button:hover, .pkp_button:hover,
input[type="submit"]:hover {
  background: var(--ut-primary) !important;
  color: #ffffff !important;
}

/* ---------- 9. LINK BACA/UNDUH & METADATA ---------- */
.cmp_article_list .meta, .obj_article_summary .meta {
  color: var(--ut-muted);
  font-size: 0.88em;
}
.obj_article_summary .read_more a {
  background: var(--ut-accent2);
  color: #fff;
  border-radius: 4px;
  padding: 5px 12px;
  font-weight: 600;
  font-size: 0.9em;
}
.obj_article_summary .read_more a:hover {
  background: var(--ut-primary);
  text-decoration: none;
}

/* ---------- 10. FOOTER ---------- */
.pkp_structure_footer_wrapper {
  background: var(--ut-primary);
  color: #d6e4f0;
  margin-top: 40px;
  border-top: 4px solid var(--ut-accent2);
}
.pkp_structure_footer {
  max-width: 1300px;
  margin: 0 auto;
  padding: 24px;
}
.pkp_footer_content {
  color: #d6e4f0 !important;
  font-size: 0.92em;
}
.pkp_footer_content a { color: var(--ut-accent2); }
.pkp_footer_content a:hover { color: #fff; }

/* ---------- 11. TABEL (OJS) ---------- */
table, .pkp_table {
  border-collapse: collapse;
  width: 100%;
}
th {
  background: var(--ut-primary);
  color: #fff;
  padding: 8px 10px;
  text-align: left;
}
td {
  border: 1px solid #e3ebf1;
  padding: 8px 10px;
}
tr:nth-child(even) td { background: #f7fafc; }

/* ---------- 12. RESPONSIVE — layar kecil ---------- */
@media (max-width: 767px) {
  .pkp_site_name a { font-size: 1.2em; }
  .pkp_structure_main { padding: 14px; margin: 12px 0; }
  .pkp_head_wrapper { padding: 4px 0 8px; }
}