/* ILMI journal — OJS 3.4 Default Theme custom stylesheet */
:root {
  --ilmi-plum: #2d1147;
  --ilmi-plum-light: #4a2865;
  --ilmi-gold: #d9bc7b;
  --ilmi-paper: #f8f5ec;
  --ilmi-ink: #382945;
}

body {
  color: var(--ilmi-ink);
  background: #f5f1e8;
}

a,
a:visited { color: #65407e; }
a:hover,
a:focus { color: #8c6531; }

.pkp_structure_head {
  background: var(--ilmi-plum);
  box-shadow: 0 6px 22px rgba(38, 17, 55, .16);
}
.pkp_head_wrapper { padding-top: 20px; }
.pkp_site_name { padding: 0; }
.pkp_site_name .is_img {
  display: block;
  width: 100%;
  max-width: 1160px;
}
.pkp_site_name .is_img img {
  display: block;
  width: 100% !important;
  max-width: 1160px !important;
  max-height: none !important;
  height: auto !important;
  margin: 0 auto;
  object-fit: contain;
}

.pkp_navigation_primary_row {
  margin-top: 18px;
  border-top: 1px solid rgba(217, 188, 123, .35);
}
.pkp_navigation_primary > li > a,
.pkp_navigation_primary > li > a:visited,
.pkp_navigation_search_wrapper a,
.pkp_navigation_search_wrapper a:visited {
  color: #f5ecdf;
}
.pkp_navigation_primary > li > a:hover,
.pkp_navigation_primary > li > a:focus,
.pkp_navigation_search_wrapper a:hover,
.pkp_navigation_search_wrapper a:focus {
  color: #f2d695;
}
.pkp_navigation_primary .dropdown-menu a { color: var(--ilmi-ink); }

.pkp_page_index .pkp_structure_content {
  padding: 48px 0 70px;
}
.pkp_page_index .pkp_structure_main {
  width: calc(100% - 340px);
  max-width: none;
  margin: 0;
  padding: 0;
  border: 0;
}
.pkp_page_index .pkp_structure_sidebar {
  width: 300px;
  float: right;
  margin: 0;
}
.pkp_page_index .pkp_structure_main::before,
.pkp_page_index .pkp_structure_main::after { display: none; }
.pkp_page_index .page_index_journal {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(190px, .8fr);
  gap: clamp(20px, 3vw, 36px);
  align-items: center;
  min-height: 0;
  padding: clamp(28px, 3vw, 42px);
  background: var(--ilmi-paper);
  border: 1px solid #e4d8c3;
  box-shadow: 0 20px 55px rgba(50, 29, 57, .08);
}
.pkp_page_index .homepage_about {
  grid-column: 1;
  grid-row: 1;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}
.pkp_page_index .homepage_about::before {
  content: "ISLAMIC LEARNING · MODERNIZATION · INNOVATION";
  display: block;
  margin-bottom: 18px;
  color: #946e38;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .15em;
}
.pkp_page_index .homepage_about h2 {
  margin: 0 0 22px;
  padding: 0;
  border: 0;
  color: var(--ilmi-plum);
  font-family: Lora, Georgia, serif;
  font-size: clamp(32px, 3.5vw, 45px);
  font-weight: 500;
  line-height: 1.14;
}
.pkp_page_index .homepage_about p {
  max-width: 680px;
  margin: 0;
  color: #554c5d;
  font-size: clamp(15px, 1.4vw, 17px);
  line-height: 1.82;
}
.pkp_page_index .homepage_image {
  grid-column: 2;
  grid-row: 1;
  width: min(100%, 270px);
  margin: 0 auto;
  padding: 0;
  filter: drop-shadow(0 24px 25px rgba(32, 15, 45, .24));
  transform: rotate(1.5deg);
}
.pkp_page_index .homepage_image img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  border: 1px solid #d7c08b;
}

.pkp_page_index .additional_content {
  grid-column: 1 / -1;
  grid-row: 2;
  min-width: 0;
  margin: 12px 0 0;
  padding: 0;
}
.ilmi-sections { width: 100%; }
.ilmi-sections .ilmi-kicker {
  margin: 0 0 15px;
  color: #987544;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .18em;
}
.ilmi-sections h2 {
  margin: 0 0 24px;
  color: var(--ilmi-plum);
  font-family: Lora, Georgia, serif;
  font-size: clamp(30px, 3.8vw, 47px);
  font-weight: 500;
  line-height: 1.16;
}
.ilmi-sections p { line-height: 1.78; }
.ilmi-intro {
  padding: clamp(30px, 5vw, 62px);
  background: #fffdf9;
  border: 1px solid #e5dccc;
}
.ilmi-intro h2 { max-width: 700px; }
.ilmi-intro > p:not(.ilmi-kicker) { max-width: 780px; color: #5a5260; font-size: 17px; }
.ilmi-button,
.ilmi-button:visited {
  display: inline-block;
  margin-top: 10px;
  padding: 13px 20px;
  background: var(--ilmi-plum);
  color: #fff !important;
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
}
.ilmi-button:hover,
.ilmi-button:focus { background: var(--ilmi-plum-light); color: #fff !important; }
.ilmi-scope {
  margin-top: 38px;
  padding: clamp(30px, 5vw, 60px);
  background: #eee8da;
}
.ilmi-scope > p:not(.ilmi-kicker) { color: #625867; }
.ilmi-scope-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin: 30px 0 22px;
}
.ilmi-scope-card {
  min-width: 0;
  min-height: 230px;
  padding: 27px 22px;
  background: #fffdf8;
  border: 1px solid #e2d8c7;
  border-bottom: 4px solid var(--ilmi-gold);
}
.ilmi-scope-card:nth-child(even) { border-bottom-color: #6e4b82; }
.ilmi-card-num {
  display: block;
  margin-bottom: 27px;
  color: #ab864d;
  font-family: Lora, Georgia, serif;
  font-size: 31px;
}
.ilmi-scope-card h3 {
  margin: 0 0 13px;
  color: var(--ilmi-plum);
  font-family: Lora, Georgia, serif;
  font-size: 20px;
  font-weight: 600;
  line-height: 1.3;
}
.ilmi-scope-card p { margin: 0; color: #625b65; font-size: 13px; line-height: 1.65; }
.ilmi-scope-link { margin: 0; text-align: right; font-weight: 700; }
.ilmi-next {
  margin-top: 38px;
  padding: clamp(30px, 5vw, 60px);
  background: var(--ilmi-plum);
  color: #ecdfed;
}
.ilmi-next h2 { color: #fff; }
.ilmi-next p { max-width: 680px; }
.ilmi-next .ilmi-button { background: #e7cb90; color: var(--ilmi-plum) !important; }
.ilmi-next .ilmi-button:hover { background: #f3dcaa; }

/* Custom Block Manager sidebar */
#customblock-ilmi-sidebar-navigation { margin: 0; padding: 0; border: 0; }
#customblock-ilmi-sidebar-navigation > .content { margin: 0; padding: 0; }
.ilmi-sidebar-panels { display: grid; gap: 18px; font-family: Georgia, serif; }
.ilmi-panel {
  padding: 0 12px 15px;
  background: #fffdf9;
  border: 1px solid #ddd5c7;
  border-radius: 4px;
  box-shadow: 0 5px 17px rgba(43, 18, 62, .06);
}
.ilmi-panel h2 {
  margin: 0 -12px 12px;
  padding: 11px 12px;
  background: #ede7db;
  border-bottom: 2px solid var(--ilmi-gold);
  color: var(--ilmi-plum);
  font-family: Georgia, serif;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .02em;
  line-height: 1.25;
  text-align: center;
}
.ilmi-editorial-links,
.ilmi-tools-grid,
.ilmi-index-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.ilmi-editorial-links a,
.ilmi-tools-grid a {
  display: block;
  padding: 10px 6px;
  background: #f1eeea;
  color: var(--ilmi-plum);
  font-size: 12px;
  font-weight: 700;
  text-align: center;
  text-decoration: none;
}
.ilmi-editorial-links a:hover,
.ilmi-tools-grid a:hover { background: #e9dcbf; }
.ilmi-panel-note { margin: 11px 0 0; color: #726b70; font-size: 11px; line-height: 1.5; }
.ilmi-index-badge {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 72px;
  padding: 7px;
  border: 1px solid #dcd5c9;
  background: #fff;
  color: var(--ilmi-plum);
  font-family: Arial, sans-serif;
  text-align: center;
  text-decoration: none;
  overflow: hidden;
}
.ilmi-index-badge:hover { border-color: var(--ilmi-gold); background: #fffdf8; }
.ilmi-index-badge img { display: block; max-width: 100%; max-height: 56px; width: auto; height: auto; object-fit: contain; }
.ilmi-index-badge .ilmi-issn-mark {
  display: block;
  width: 100%;
  max-width: 116px;
  padding: 3px 4px 1px;
  background: #263b62;
  border-bottom: 3px solid #159a91;
  color: #fff;
  font-size: 21px;
  font-weight: 800;
  letter-spacing: 2px;
  line-height: 1.1;
}
.ilmi-index-badge small { display: block; margin-top: 3px; color: #263b62; font-size: 7px; font-weight: 700; letter-spacing: .02em; }
.ilmi-template-row { display: flex; align-items: center; gap: 10px; }
.ilmi-doc-icon {
  display: inline-block;
  flex: 0 0 47px;
  padding: 7px 3px 3px;
  background: #2459a8;
  color: #fff;
  font-family: Arial, sans-serif;
  font-size: 14px;
  font-weight: 800;
  text-align: center;
}
.ilmi-doc-icon small { display: block; margin-top: 5px; background: #173d78; font-size: 6px; }
.ilmi-template-row p { margin: 0; color: #55465e; font-size: 12px; line-height: 1.5; }
.ilmi-template-row em { color: #8c7045; font-size: 10px; }
.ilmi-tools-grid a { font-weight: 400; }
.ilmi-whatsapp { display: block; margin-top: 12px; color: #149b56 !important; font-size: 16px; font-weight: 700; line-height: 1.1; text-align: center; text-decoration: none; }
.ilmi-whatsapp small { display: block; margin-top: 3px; color: #5c5162; font-size: 9px; font-weight: 400; }
.ilmi-keywords { margin: 0; color: #72536f; font-size: 12px; line-height: 1.65; text-align: center; }
.ilmi-keywords > * { margin: 0 2px; }

.pkp_structure_footer_wrapper {
  background: var(--ilmi-plum);
  color: #e7d9eb;
  border-top: 4px solid var(--ilmi-gold);
}
.pkp_structure_footer { color: inherit; }
.pkp_structure_footer a { color: #f4e8ce; }
.pkp_brand_footer img { filter: brightness(0) invert(1); opacity: .75; }

.page_about .pkp_structure_main,
.page_contact .pkp_structure_main,
.page_submissions .pkp_structure_main {
  background: #fffdf9;
}
.page_about h2,
.page_about h3 { color: var(--ilmi-plum); }

@media (max-width: 900px) {
  .pkp_head_wrapper { padding-top: 12px; }
  .pkp_page_index .pkp_structure_content { padding: 28px 15px 45px; }
  .pkp_page_index .pkp_structure_main { width: 100%; float: none; }
  .pkp_page_index .pkp_structure_sidebar { width: 100%; float: none; margin-top: 30px; }
  .ilmi-sidebar-panels { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pkp_page_index .page_index_journal {
    grid-template-columns: minmax(0, 1fr);
    gap: 34px;
    min-height: 0;
    padding: 38px 30px 44px;
  }
  .pkp_page_index .homepage_about { grid-column: 1; grid-row: 1; }
  .pkp_page_index .homepage_image {
    grid-column: 1;
    grid-row: 2;
    width: min(78%, 320px);
  }
  .pkp_page_index .additional_content { grid-column: 1; grid-row: 3; margin: 0; }
  .ilmi-scope-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ilmi-scope-card { min-height: 260px; }
}

@media (max-width: 600px) {
  .ilmi-sidebar-panels { grid-template-columns: 1fr; }
  .pkp_site_name .is_img img {
    width: 100% !important;
    height: auto !important;
    max-height: none !important;
  }
  .pkp_page_index .pkp_structure_content { padding: 18px 12px 35px; }
  .pkp_page_index .page_index_journal {
    gap: 25px;
    padding: 30px 22px 38px;
  }
  .pkp_page_index .homepage_about::before { font-size: 9px; line-height: 1.5; }
  .pkp_page_index .homepage_about h2 { font-size: 31px; }
  .pkp_page_index .homepage_about p { font-size: 15px; line-height: 1.7; }
  .pkp_page_index .homepage_image { width: min(100%, 275px); }
  .ilmi-intro, .ilmi-scope, .ilmi-next { padding: 28px 22px; }
  .ilmi-sections h2 { font-size: 30px; }
  .ilmi-intro > p:not(.ilmi-kicker) { font-size: 15px; }
  .ilmi-scope-grid { grid-template-columns: 1fr; gap: 12px; }
  .ilmi-scope-card { min-height: 0; padding: 24px 20px; }
  .ilmi-card-num { margin-bottom: 12px; }
  .ilmi-scope-link { text-align: left; }
}
