/* === Additional Menu - Jurnal Ilmiah Informatika Komputer === */
.infokom-additional-menu {
  border-radius: 6px;
  overflow: hidden;
  background: #fff8e1; /* kuning muda */
  box-shadow: 0 4px 10px rgba(0,0,0,0.15);
  margin-bottom: 12px;
  font-family: Arial, Helvetica, sans-serif;
}

/* Title */
.infokom-menu-title {
  background: linear-gradient(90deg, #ff9800, #ff5722); /* oranye ke merah */
  color: #ffffff;
  text-align: center;
  font-weight: 700;
  padding: 12px 10px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  border-bottom: 4px solid #673ab7; /* ungu aksen cover */
}

/* List */
.infokom-menu-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

/* Item */
.infokom-menu-list li {
  border-bottom: 1px solid #f0e0b2;
}

.infokom-menu-list li:last-child {
  border-bottom: none;
}

.infokom-menu-list a {
  display: block;
  padding: 10px 12px;
  color: #333;
  text-decoration: none !important;
  font-weight: 600;
  transition: all 0.25s ease;
  background: #fffdf5;
}

/* Hover */
.infokom-menu-list a:hover {
  background: #ffe0b2; /* oranye muda */
  color: #d32f2f; /* merah teks */
  padding-left: 16px;
}


/* === Make a Submission Button - Jurnal Ilmiah Informatika Komputer === */
.block_make_submission_link {
  display: block !important;
  text-align: center !important;
  padding: 12px 14px !important;
  margin: 10px 0 !important;
  border-radius: 8px !important;
  font-weight: 700 !important;
  font-size: 14px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  color: #ffffff !important;
  text-decoration: none !important;

  /* Gradient sesuai cover: oranye -> merah */
  background: linear-gradient(90deg, #ff9800, #ff5722) !important;
  border: none !important;

  box-shadow: 0 4px 10px rgba(0,0,0,0.25) !important;
  transition: all 0.25s ease !important;
}

/* Hover effect */
.block_make_submission_link:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 14px rgba(0,0,0,0.35) !important;
  background: #ffe0b2 !important;
  color: #673ab7 !important;
}

/* Active / click */
.block_make_submission_link:active {
  transform: translateY(0) !important;
  box-shadow: 0 3px 8px rgba(0,0,0,0.3) !important;
}

/* Mobile tweak */
@media (max-width: 576px) {
  .block_make_submission_link {
    font-size: 13px !important;
    padding: 11px 12px !important;
  }
}


.pkp_structure_head {
    background-color: #6a1b9a !important; /* ungu tua elegan */
    border-bottom: 3px solid #ff9800 !important; /* aksen oranye */
}

.pkp_site_nav_menu {
    background: #6a1b9a !important;
}

/* === Infokom Template Download Block === */
/* === Infokom Template Block (same layout as JPP, different colors) === */
.infokom-template-block {
  border-radius: 6px;
  overflow: hidden;
  background: #fff8e1; /* kuning muda */
  box-shadow: 0 4px 10px rgba(0,0,0,0.15);
  margin-bottom: 10px;
  font-family: Arial, Helvetica, sans-serif;
}

.infokom-template-title {
  background: linear-gradient(90deg, #ff9800, #ff5722); /* oranye ke merah */
  color: #ffffff;
  text-align: center;
  font-weight: 700;
  padding: 12px 10px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  border-bottom: 4px solid #673ab7; /* ungu aksen cover */
}

.infokom-template-image-link {
  display: block;
  text-align: center;
  padding: 12px;
  margin: 10px;
  background: #ffffff;
  border-radius: 6px;
  text-decoration: none !important;
  color: #6a1b9a !important; /* ungu */
  font-weight: 700;
  box-shadow: 0 2px 6px rgba(0,0,0,0.12);
  transition: all 0.25s ease;
}

.infokom-template-image-link:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 10px rgba(0,0,0,0.2);
  background: #fff3cd; /* kuning muda hover */
}

.infokom-template-image-link img {
  max-width: 100%;
  max-height: 120px;
  object-fit: contain;
  margin-bottom: 8px;
  display: block;
  margin-left: auto;
  margin-right: auto;

  /* biar gambar lebih kontras */
  /* filter: drop-shadow(0 2px 6px rgba(0,0,0,0.4)); */
}

.infokom-template-image-link span {
  display: block;
  font-size: 13px;
}

/* === Indexed By Block - Infokom === */
.infokom-indexedby-block {
  border-radius: 6px;
  overflow: hidden;
  background: #fff8e1;
  box-shadow: 0 4px 10px rgba(0,0,0,0.15);
  margin-bottom: 10px;
  font-family: Arial, Helvetica, sans-serif;
}

/* Title (KONSISTEN sesuai permintaan) */
.infokom-indexedby-title {
  background: linear-gradient(90deg, #ff9800, #ff5722); /* oranye ke merah */
  color: #ffffff;
  text-align: center;
  font-weight: 700;
  padding: 12px 10px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  border-bottom: 4px solid #673ab7; /* ungu aksen cover */
}

/* Grid */
.infokom-indexedby-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
  padding: 12px;
}

/* Item card */
.infokom-indexedby-item {
  background: #ffffff;
  border-radius: 6px;
  padding: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none !important;
  box-shadow: 0 2px 6px rgba(0,0,0,0.12);
  transition: all 0.25s ease;
}

/* Hover */
.infokom-indexedby-item:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 10px rgba(0,0,0,0.2);
  background: #fff3cd;
}

/* Logo */
.infokom-indexedby-item img {
  max-width: 100%;
  max-height: 50px;
  object-fit: contain;
  /* filter: drop-shadow(0 2px 6px rgba(0,0,0,0.4)); */
}

/* Responsive: jadi 1 kolom di layar kecil */
@media (max-width: 480px) {
  .infokom-indexedby-grid {
    grid-template-columns: 1fr;
  }
}


/* === Supported By Block - Infokom === */
.infokom-supportedby-block {
  border-radius: 6px;
  overflow: hidden;
  background: #fff8e1;
  box-shadow: 0 4px 10px rgba(0,0,0,0.15);
  margin-bottom: 12px;
  font-family: Arial, Helvetica, sans-serif;
}

/* Title – Konsisten dengan tema warna */
.infokom-supportedby-title {
  background: linear-gradient(90deg, #ff9800, #ff5722);
  color: #ffffff;
  text-align: center;
  font-weight: 700;
  padding: 12px 10px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  border-bottom: 4px solid #673ab7; /* ungu aksen cover */
}

/* Content area */
.infokom-supportedby-content {
  padding: 12px;
  text-align: center;
  background: #ffffff;
  border-radius: 0 0 6px 6px;
  transition: all 0.25s ease;
  margin: 10px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.12);
}

/* Hover effect */
.infokom-supportedby-content:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 10px rgba(0,0,0,0.2);
  background: #fff3cd;
}

/* Logo styling */
.infokom-supportedby-content img {
  max-width: 100%;
  max-height: 80px;
  object-fit: contain;
  margin-bottom: 8px;
}

/* Text below logo */
.infokom-supportedby-text {
  font-size: 13px;
  font-weight: 700;
  color: #6a1b9a; /* ungu */
}

/* === Tools Block - Infokom === */
.infokom-tools-block {
  border-radius: 6px;
  overflow: hidden;
  background: #fff8e1;
  box-shadow: 0 4px 10px rgba(0,0,0,0.15);
  margin-bottom: 12px;
  font-family: Arial, Helvetica, sans-serif;
}

/* Title (KONSISTEN) */
.infokom-tools-title {
  background: linear-gradient(90deg, #ff9800, #ff5722);
  color: #ffffff;
  text-align: center;
  font-weight: 700;
  padding: 12px 10px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  border-bottom: 4px solid #673ab7;
}

/* List (atas-bawah biar besar) */
.infokom-tools-list {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
  padding: 10px;
}

/* Item */
.infokom-tool-item {
  background: #ffffff;
  border-radius: 6px;
  padding: 10px;
  text-align: center;
  box-shadow: 0 2px 6px rgba(0,0,0,0.12);
  transition: all 0.25s ease;
  text-decoration: none !important;
  color: #333 !important;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.infokom-tool-item:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 10px rgba(0,0,0,0.2);
  background: #fff3cd;
}

.infokom-tool-item img {
  max-width: 100%;
  max-height: 60px;
  object-fit: contain;
  margin-bottom: 6px;
  /* filter: drop-shadow(0 2px 6px rgba(0,0,0,0.4)); */
}

.infokom-tool-item span {
  font-size: 12px;
  font-weight: 700;
  color: #673ab7;
}

/* === Visitor Block - Infokom === */
.infokom-visitor-block {
  border-radius: 6px;
  overflow: hidden;
  background: #fff8e1;
  box-shadow: 0 4px 10px rgba(0,0,0,0.15);
  margin-bottom: 12px;
  font-family: Arial, Helvetica, sans-serif;
}

/* Title (KONSISTEN) */
.infokom-visitor-title {
  background: linear-gradient(90deg, #ff9800, #ff5722);
  color: #ffffff;
  text-align: center;
  font-weight: 700;
  padding: 12px 10px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  border-bottom: 4px solid #673ab7;
}

/* List: atas-bawah */
.infokom-visitor-list {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
  padding: 10px;
}

/* Item */
.infokom-visitor-item {
  background: #ffffff;
  border-radius: 6px;
  padding: 10px;
  text-align: center;
  box-shadow: 0 2px 6px rgba(0,0,0,0.12);
  transition: all 0.25s ease;
  text-decoration: none !important;
  color: #333 !important;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.infokom-visitor-item:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 10px rgba(0,0,0,0.2);
  background: #fff3cd;
}

/* Image */
.infokom-visitor-item img {
  display: block;
  margin: 0 auto 6px auto;
  max-width: 100%;
  max-height: 100px;
  object-fit: contain;
  filter: drop-shadow(0 2px 6px rgba(0,0,0,0.6)); /* biar kontras */
}

/* Label */
.infokom-visitor-item span {
  font-size: 12px;
  font-weight: 700;
  color: #673ab7;
}


/* === Keyword Cloud Block (OJS) === */

/* Title - konsisten dengan block lain */
.pkp_block.block_keyword_cloud .title {
  background: linear-gradient(90deg, #ff9800, #ff5722); /* oranye ke merah */
  color: #ffffff;
  text-align: center;
  font-weight: 700;
  padding: 12px 10px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  border-bottom: 4px solid #673ab7; /* ungu aksen cover */
  margin: 0;
  border-radius: 5px;
}

/* Content area */
.pkp_block.block_keyword_cloud .content {
  padding: 10px;
  background: #fff8e1;
  text-align: center;
  border-radius: 6px;
  overflow: hidden;
  box-shadow: 0 2px 10px rgba(0,0,0,0.15);
  margin-bottom: 12px;
  font-family: Arial, Helvetica, sans-serif;
}

/* SVG wordcloud responsive */
.pkp_block.block_keyword_cloud svg {
  max-width: 100%;
  height: auto;
}


.infokom-editorial-board h2 {
  margin-top: 20px;
  margin-bottom: 10px;
  color: #673ab7;
}

.infokom-editorial-board .editor-card {
  background: #fff;
  border-radius: 6px;
  padding: 12px;
  margin-bottom: 10px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.12);
}

.infokom-editorial-board .editor-info {
  margin-bottom: 8px;
  color: #333;
}

.infokom-editorial-board .editor-links a {
  display: inline-block;
  margin-right: 6px;
  padding: 4px 10px;
  background: #ff9800;
  color: #fff !important;
  border-radius: 4px;
  text-decoration: none !important;
  font-size: 12px;
  font-weight: 600;
  transition: all 0.2s ease;
}

.infokom-editorial-board .editor-links a:hover {
  background: #ff5722;
  transform: translateY(-1px);
}

.infokom-peer-reviewers h2 {
  margin-top: 20px;
  margin-bottom: 10px;
  color: #673ab7;
}

.infokom-peer-reviewers p {
  margin-bottom: 12px;
  color: #444;
}

.infokom-peer-reviewers .reviewer-card {
  background: #fff;
  border-radius: 6px;
  padding: 12px;
  margin-bottom: 10px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.12);
}

.infokom-peer-reviewers .reviewer-info {
  margin-bottom: 8px;
  color: #333;
}

.infokom-peer-reviewers .reviewer-links a {
  display: inline-block;
  margin-right: 6px;
  padding: 4px 10px;
  background: #ff9800;
  color: #fff !important;
  border-radius: 4px;
  text-decoration: none !important;
  font-size: 12px;
  font-weight: 600;
  transition: all 0.2s ease;
}

.infokom-peer-reviewers .reviewer-links a:hover {
  background: #ff5722;
  transform: translateY(-1px);
}

.infokom-focus-scope {
  background: #ffffff;
  padding: 15px;
  border-radius: 6px;
}

.infokom-focus-scope h2 {
  margin-bottom: 10px;
  color: #673ab7; /* ungu aksen cover */
}

.infokom-focus-scope p {
  color: #333;
  line-height: 1.6;
  margin-bottom: 10px;
}

.infokom-focus-scope .focus-scope-list {
  margin-left: 20px;
  columns: 2; /* jadi 2 kolom di layar besar */
}

.infokom-focus-scope .focus-scope-list li {
  margin-bottom: 6px;
}

.infokom-publication-ethics {
  background: #ffffff;
  padding: 15px;
  border-radius: 6px;
}

.infokom-publication-ethics h2 {
  color: #ff5722; /* merah-oranye sesuai tema cover */
  margin-bottom: 10px;
}

.infokom-publication-ethics h3 {
  color: #673ab7; /* ungu aksen cover */
  margin-top: 20px;
  margin-bottom: 8px;
}

.infokom-publication-ethics p {
  color: #333;
  line-height: 1.6;
  margin-bottom: 10px;
  text-align: justify;
}

.infokom-publication-ethics ul {
  margin-left: 20px;
  margin-bottom: 10px;
}

.infokom-publication-ethics ul li {
  margin-bottom: 6px;
}


.infokom-author-fees {
  background: #ffffff;
  padding: 15px;
  border-radius: 6px;
}

.infokom-author-fees h2 {
  color: #ff5722; /* merah-oranye tema cover */
  margin-bottom: 10px;
}

.infokom-author-fees p {
  color: #333;
  line-height: 1.6;
  margin-bottom: 10px;
  text-align: justify;
}

.infokom-author-fees .fee-box {
  background: linear-gradient(90deg, #ff9800, #ff5722);
  color: #ffffff;
  font-size: 22px;
  font-weight: 800;
  text-align: center;
  padding: 15px;
  border-radius: 6px;
  margin: 15px 0;
  border: 3px solid #673ab7; /* ungu aksen cover */
  box-shadow: 0 4px 10px rgba(0,0,0,0.15);
}


.infokom-indexing-page {
  background: #ffffff;
  padding: 15px;
  border-radius: 6px;
}

.infokom-indexing-page h2 {
  color: #ff5722; /* merah-oranye tema cover */
  margin-bottom: 10px;
}

.infokom-indexing-page p {
  color: #333;
  margin-bottom: 15px;
}

.infokom-indexing-page .indexing-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: 15px;
}

.infokom-indexing-page .index-item {
  display: flex;
  align-items: center;
  justify-content: center;
  background: #ffffff;
  padding: 10px;
  border-radius: 6px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.12);
  transition: all 0.25s ease;
}

.infokom-indexing-page .index-item:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 10px rgba(0,0,0,0.2);
  background: #fff3cd;
}

.infokom-indexing-page .index-item img {
  max-width: 100%;
  max-height: 60px;
  object-fit: contain;
}


/* === INFOKOM Author Guidelines === */
.infokom-guidelines {
  font-family: "Times New Roman", Times, serif;
  line-height: 1.7;
  color: #222;
  max-width: 900px;
  margin: 0 auto;
}

/* Judul utama */
.infokom-guidelines h2 {
  text-align: center;
  margin-bottom: 20px;
  padding: 12px 10px;
  background: linear-gradient(90deg, #ff9800, #ff5722); /* oranye ke merah */
  color: #fff;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
  border-bottom: 4px solid #673ab7; /* ungu aksen cover */
  border-radius: 6px;
}

/* Subjudul */
.infokom-guidelines h3 {
  margin-top: 28px;
  margin-bottom: 10px;
  padding-left: 10px;
  border-left: 4px solid #673ab7;
  color: #3f2b96;
  font-weight: 700;
}

.infokom-guidelines h4 {
  margin-top: 18px;
  margin-bottom: 8px;
  color: #ff5722;
  font-weight: 700;
}

/* Paragraf */
.infokom-guidelines p {
  text-align: justify;
  margin-bottom: 12px;
}

/* List */
.infokom-guidelines ul,
.infokom-guidelines ol {
  margin-left: 20px;
  margin-bottom: 14px;
}

.infokom-guidelines li {
  margin-bottom: 6px;
}

/* Tabel contoh */
.infokom-guidelines table {
  width: 100%;
  margin: 15px 0;
  border-collapse: collapse;
  font-size: 14px;
  background: #fff;
}

.infokom-guidelines table th {
  background: #f3e5f5;
  color: #4a148c;
  font-weight: 700;
  border: 1px solid #ccc;
  padding: 8px;
}

.infokom-guidelines table td {
  border: 1px solid #ccc;
  padding: 8px;
  text-align: center;
}

.infokom-guidelines table caption {
  caption-side: top;
  font-weight: 700;
  margin-bottom: 6px;
  color: #333;
}

/* Rumus */
.infokom-guidelines .equation,
.infokom-guidelines p[style*="text-align: center"] {
  background: #f9f9f9;
  padding: 10px;
  border-radius: 6px;
  margin: 12px 0;
  font-size: 18px;
}

/* Code / contoh referensi */
.infokom-guidelines pre {
  background: #f5f5f5;
  padding: 12px;
  border-radius: 6px;
  overflow-x: auto;
  font-size: 13px;
  border-left: 4px solid #673ab7;
}

/* Link */
.infokom-guidelines a {
  color: #ff5722;
  font-weight: 600;
  text-decoration: none;
}

.infokom-guidelines a:hover {
  text-decoration: underline;
}

/* Responsive */
@media (max-width: 768px) {
  .infokom-guidelines {
    padding: 0 10px;
  }

  .infokom-guidelines h2 {
    font-size: 18px;
  }

  .infokom-guidelines table {
    font-size: 13px;
  }
}

.infokom-guidelines-iframe {
  width: 100%;
  max-width: 100%;
  margin: 0 auto;
}

.infokom-guidelines-iframe iframe {
  width: 100%;
  height: 900px;       /* bisa kamu naikkan jadi 1000px / 1200px kalau mau */
  border: none;
  border-radius: 8px;
  box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}

/* Responsive untuk HP */
@media (max-width: 768px) {
  .infokom-guidelines-iframe iframe {
    height: 700px;
  }
}

/* Responsive Logo */
/* Default (desktop) */
.pkp_site_name .is_img img {
  max-width: 100%;
  height: auto;
  max-height: 120px;
  width: auto;
}

/* Logo di tablet */
@media (max-width: 992px) {
  .pkp_site_name .is_img img {
    max-height: 100px;
  }
}

/* Logo di HP */
@media (max-width: 576px) {
  .pkp_site_name .is_img img {
    max-height: 30px;
  }
}

.homepage_about p {
  text-align: justify;
  text-justify: inter-word;
  line-height: 1.7;
  margin-bottom: 12px;
}

/* === JPP Plain Footer === */
.infokom-footer-plain {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  background: #eeeeee;
  padding: 20px 24px;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 13px;
  color: #000;
  margin-top: 30px;
}

.infokom-footer-left {
  max-width: 70%;
}

.infokom-footer-left img {
  margin: 8px 0;
}

.infokom-footer-left a {
  color: #0066cc;
  text-decoration: none;
}

.infokom-footer-left a:hover {
  text-decoration: underline;
}

.infokom-footer-right {
  text-align: right;
  font-size: 14px;
}

/* Responsive */
@media (max-width: 768px) {
  .infokom-footer-plain {
    flex-direction: column;
    gap: 15px;
  }

  .infokom-footer-right {
    text-align: left;
  }

  .infokom-footer-left {
    max-width: 100%;
  }
}

.infokom-archive-page {
  line-height: 1.7;
}

.infokom-archive-page p {
  text-align: justify;
  margin-bottom: 12px;
}

.infokom-archive-box {
  margin: 20px 0;
  text-align: center;
}

.infokom-archive-box a {
  display: inline-block;
  padding: 12px 20px;
  background: linear-gradient(90deg, #ff9800, #ff5722);
  color: #ffffff !important;
  font-weight: 700;
  text-decoration: none !important;
  border-radius: 6px;
  border-bottom: 4px solid #673ab7;
  transition: all 0.25s ease;
}

.infokom-archive-box a:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 10px rgba(0,0,0,0.2);
}