/* =========================================================
   OVERRIDE: View Journal + Current Issue -> tombol "Focus and Scope"
   (SITE INDEX ONLY)
   Tempel di PALING BAWAH CSS portal
   ========================================================= */

/* Rapikan container link agar sejajar dan rapi */
.page_index_site .cmp_journal table + p,
.page_index_site .cmp_journal h3 + p,
.page_index_site .cmp_journal_title + p{
  margin: 14px 0 0 !important;
  display: flex !important;
  flex-wrap: wrap;
  gap: 12px;
}

/* Tombol gaya soft-mint seperti "Focus and Scope" */
.page_index_site .cmp_journal table + p a,
.page_index_site .cmp_journal h3 + p a,
.page_index_site .cmp_journal_title + p a{
  display: inline-flex !important;
  align-items: center;
  justify-content: center;

  padding: 12px 18px !important;
  border-radius: 16px !important;

  background: rgba(236,253,247,.92) !important;           /* mint soft */
  border: 1px solid rgba(13,148,136,.22) !important;      /* teal border */
  color: var(--primary) !important;

  font-weight: 900 !important;
  text-decoration: none !important;
  text-underline-offset: 0 !important;

  box-shadow: 0 1px 0 rgba(15,23,42,.05), 0 10px 22px rgba(2,6,23,.06) !important;
  transition: background .15s var(--ease), border-color .15s var(--ease),
              box-shadow .15s var(--ease), transform .15s var(--ease);
}

/* Hover mirip tombol contoh (lebih “naik” sedikit) */
.page_index_site .cmp_journal table + p a:hover,
.page_index_site .cmp_journal h3 + p a:hover,
.page_index_site .cmp_journal_title + p a:hover{
  background: #ffffff !important;
  border-color: rgba(13,148,136,.32) !important;
  box-shadow: 0 1px 0 rgba(15,23,42,.05), 0 16px 30px rgba(2,6,23,.10) !important;
  transform: translateY(-1px);
}

/* Active */
.page_index_site .cmp_journal table + p a:active,
.page_index_site .cmp_journal h3 + p a:active,
.page_index_site .cmp_journal_title + p a:active{
  transform: translateY(0);
  box-shadow: 0 1px 0 rgba(15,23,42,.05), 0 10px 22px rgba(2,6,23,.06) !important;
}

/* Focus ring */
.page_index_site .cmp_journal table + p a:focus-visible,
.page_index_site .cmp_journal h3 + p a:focus-visible,
.page_index_site .cmp_journal_title + p a:focus-visible{
  outline: 3px solid rgba(52,211,153,.35) !important;
  outline-offset: 2px !important;
}

/* Mobile: tombol full lebar biar rapi */
@media (max-width: 560px){
  .page_index_site .cmp_journal table + p,
  .page_index_site .cmp_journal h3 + p,
  .page_index_site .cmp_journal_title + p{
    flex-direction: column;
  }
  .page_index_site .cmp_journal table + p a,
  .page_index_site .cmp_journal h3 + p a,
  .page_index_site .cmp_journal_title + p a{
    width: 100% !important;
  }
}