/* =========================================
   GENIUS – Corporate Global Publisher Style
   OJS 3.4 Material Theme (Site Level)
========================================= */

/* --- Buttons (used in homepage hero) --- */
.gj-btn{
  display:inline-block;
  padding:11px 18px;
  border-radius:12px;
  font-weight:800;
  text-decoration:none;
  border:1px solid transparent;
  transition: transform .18s ease, box-shadow .18s ease;
}
.gj-btn:hover{ transform: translateY(-2px); box-shadow:0 10px 22px rgba(0,0,0,0.08); }
.gj-btn-primary{ background:#1f4e79; color:#fff; }
.gj-btn-outline{ background:#fff; color:#1f4e79; border-color:#1f4e79; }

/* --- Journals list: grid and card layout --- */
.journals ul,
.cmp_journals,
.obj_journals{
  list-style:none !important;
  padding-left:0 !important;
  margin-left:0 !important;
}

@media (min-width: 900px){
  .journals ul,
  .cmp_journals,
  .obj_journals{
    display:grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap:22px;
  }
}

/* Card base */
.journals li,
.obj_journal_summary,
.cmp_journal_list__journal{
  border:1px solid #e8e8e8;
  border-radius:18px;
  padding:22px;
  background:#fff;
  box-shadow:0 10px 26px rgba(0,0,0,0.05);
  transition: transform .22s ease, box-shadow .22s ease;
  margin-bottom:18px;

  display:flex;
  flex-direction:column;
  min-height: 520px; /* equal height cards */
}

@media (min-width: 900px){
  .journals li,
  .obj_journal_summary,
  .cmp_journal_list__journal{ margin-bottom:0; }
}

.journals li:hover,
.obj_journal_summary:hover,
.cmp_journal_list__journal:hover{
  transform: translateY(-5px);
  box-shadow:0 18px 34px rgba(0,0,0,0.10);
}

/* Cover image centered + consistent size */
.journals img,
.obj_journal_summary img{
  display:block;
  margin: 4px auto 14px auto;
  width:180px;
  height:240px;
  object-fit:cover;
  border-radius:14px;
  border:1px solid #eef1f5;
}

/* Title */
.journals a,
.obj_journal_summary .title a{
  font-weight:900;
  font-size:18px;
  text-decoration:none;
  color:#1f4e79;
}
.journals a:hover{ text-decoration:underline; }

/* Description clamp */
.journals p,
.obj_journal_summary .description{
  color:#555;
  line-height:1.65;
  margin-top:10px;

  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

/* Push actions/buttons to bottom */
.journals li ul,
.obj_journal_summary ul,
.cmp_journal_list__journal ul{
  margin-top:auto !important;
  padding-top:14px;
}

/* ===============================
   Springer / T&F style buttons
=============================== */

/* Actions area: center + neat */
.journals li ul,
.obj_journal_summary ul,
.cmp_journal_list__journal ul{
  margin-top:auto !important;
  padding-top:16px;
  text-align:center;
}

/* Button: compact + same width */
.journals li ul li a,
.obj_journal_summary ul li a,
.cmp_journal_list__journal ul li a{
  display:inline-block;
  padding:8px 14px;          /* lebih compact */
  border-radius:10px;
  border:1px solid #d9dfe6;
  background:#ffffff;
  color:#1f4e79;
  font-size:14px;            /* lebih kecil */
  font-weight:800;
  text-decoration:none;
  min-width:128px;           /* bikin simetris */
  text-align:center;
  white-space:nowrap;        /* cegah jadi 2 baris */
  line-height:1.2;
  transition: all .18s ease;
}

/* Hover: corporate */
.journals li ul li a:hover,
.obj_journal_summary ul li a:hover,
.cmp_journal_list__journal ul li a:hover{
  background:#1f4e79;
  color:#ffffff;
  border-color:#1f4e79;
}

/* Spacing antar tombol */
.journals li ul li,
.obj_journal_summary ul li,
.cmp_journal_list__journal ul li{
  display:inline-block;
  margin:6px;                /* rapi & seimbang */
}
/* ======================================
   FIX: tombol jangan jadi kotak panjang
====================================== */

/* Matikan style default li yang bikin tinggi panjang */
.journals li ul,
.obj_journal_summary ul,
.cmp_journal_list__journal ul{
  list-style:none !important;
  padding:0 !important;
  margin:16px 0 0 0 !important;
  display:flex !important;
  gap:10px;
  justify-content:center;
  flex-wrap:wrap;
}

/* Ini kuncinya: LI jangan punya box besar */
.journals li ul li,
.obj_journal_summary ul li,
.cmp_journal_list__journal ul li{
  margin:0 !important;
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  width:auto !important;
  min-height:0 !important;
  height:auto !important;
  display:inline-flex !important;
}

/* Tombolnya sendiri tetap compact */
.journals li ul li a,
.obj_journal_summary ul li a,
.cmp_journal_list__journal ul li a{
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  padding:8px 14px !important;
  border-radius:10px !important;
  border:1px solid #d9dfe6 !important;
  background:#ffffff !important;
  color:#1f4e79 !important;
  font-size:14px !important;
  font-weight:800 !important;
  text-decoration:none !important;
  min-width:128px;
  height:auto !important;
  line-height:1.2 !important;
  white-space:nowrap;
}

/* Hover corporate */
.journals li ul li a:hover,
.obj_journal_summary ul li a:hover,
.cmp_journal_list__journal ul li a:hover{
  background:#1f4e79 !important;
  color:#ffffff !important;
  border-color:#1f4e79 !important;
}
/* ======================================
   CENTER JOURNAL TITLE
====================================== */

.obj_journal_summary .title,
.cmp_journal_list__journal .title{
  text-align: center !important;
}

.obj_journal_summary .title a,
.cmp_journal_list__journal .title a{
  display: inline-block;
  text-align: center !important;
  color: #1f4e79;
  font-weight: 900;
}


/* ======================================
   DARK MODE VISIBILITY FIX
====================================== */

/* Jika theme pakai data-theme */
[data-theme="dark"] p,
[data-theme="dark"] li,
[data-theme="dark"] a,
[data-theme="dark"] strong{
  color: #eaeaea !important;
}

/* Jika theme pakai class .dark */
.dark p,
.dark li,
.dark a,
.dark strong{
  color: #eaeaea !important;
}

/* Link warna terang di dark mode */
[data-theme="dark"] a,
.dark a{
  color: #8ec5ff !important;
}
/* Force hide Journals title */
.cmp_journals h2,
.obj_journals h2 {
  display: none !important;
}
/* Center journal title properly */
.obj_journal_summary .title,
.cmp_journal_list__journal .title {
  width: 100% !important;
  text-align: center !important;
}

.obj_journal_summary .title a,
.cmp_journal_list__journal .title a {
  display: block !important;
  text-align: center !important;
  margin: 12px auto 8px auto !important;
}
/* =========================================
   FIX ALL – Material Theme (Site Index)
   1) Dark mode text visibility in white hero box
   2) Hide default "Journals" heading
   3) Center journal titles and actions
========================================= */

/* 1) DARK MODE: pastikan teks di dalam HERO BOX putih terlihat */
[data-theme="dark"] .gj-hero,
.dark .gj-hero{
  background:#ffffff !important;
}

[data-theme="dark"] .gj-hero,
[data-theme="dark"] .gj-hero * ,
.dark .gj-hero,
.dark .gj-hero *{
  color:#1a1a1a !important;          /* paksa hitam agar terlihat */
}

[data-theme="dark"] .gj-hero .gj-btn-outline,
.dark .gj-hero .gj-btn-outline{
  color:#1f4e79 !important;
  border-color:#1f4e79 !important;
}

[data-theme="dark"] .gj-hero .gj-btn-primary,
.dark .gj-hero .gj-btn-primary{
  background:#1f4e79 !important;
  color:#ffffff !important;
}

/* 2) HIDE default OJS "Journals" heading (yang kiri atas list) */
.cmp_journals > h2,
.obj_journals > h2,
.journals > h2,
.journals h2:first-of-type{
  display:none !important;
}

/* 3) CENTER journal cards content (paling aman) */
.journals li,
.obj_journal_summary,
.cmp_journal_list__journal{
  text-align:center !important;
}

.journals li .title,
.obj_journal_summary .title,
.cmp_journal_list__journal .title{
  width:100% !important;
  text-align:center !important;
}

.journals li .title a,
.obj_journal_summary .title a,
.cmp_journal_list__journal .title a{
  display:block !important;
  text-align:center !important;
  margin:12px auto 8px auto !important;
}