/* ===========================================================================
   Adeon Global — journal theme (v2)
   Layout modelled on a classic society-journal site: solid navigation band,
   cover-and-quick-links sidebar, article rows with DOI lines and pill actions,
   indexing strip, three-column footer. Written against the OJS Default theme.
   =========================================================================== */

:root {
  --ag-brand: #F97A0C;
  --ag-brand-d: #C75E00;
  --ag-brand-l: #FF9A3D;
  --ag-brand-soft: #FFF3E6;
  --ag-brand-line: #FFD9B0;
  --ag-navy: #15213B;
  --ag-navy-2: #22304F;
  --ag-ink: #1B2333;
  --ag-muted: #5D6B85;
  --ag-bg: #F4F6FA;
  --ag-line: #E1E6EF;
  --ag-radius: 10px;
  --ag-shadow: 0 1px 2px rgba(21,33,59,.05), 0 6px 20px rgba(21,33,59,.06);
}

body, .pkp_structure_page {
  font-family: "Inter", "Segoe UI", system-ui, -apple-system, Arial, sans-serif;
  color: var(--ag-ink);
  background: var(--ag-bg);
  font-size: 15px;
}
a { color: var(--ag-brand-d); text-decoration: none; }
a:hover, a:focus { color: var(--ag-brand); text-decoration: underline; }
h1, h2, h3, h4 { color: var(--ag-navy); letter-spacing: -.01em; }

/* =========================================================
   1. Masthead — logo left, journal name and ISSN beside it
   Modelled on a classic journal masthead: the publisher mark sits on the
   left, the full journal title runs beside it in caps, and the ISSN line
   sits underneath. The name and ISSN come from custom properties that the
   installer writes into each journal's own copy of this stylesheet, so
   every journal shows its own details even though the logo is shared.
   ========================================================= */
.pkp_structure_head { background: #fff; border-bottom: 0; box-shadow: 0 1px 0 rgba(21,33,59,.06); }
.pkp_head_wrapper { padding: 18px 0 14px; }
.pkp_site_name_wrapper { padding: 0; }

.pkp_site_name {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  column-gap: 26px;
  row-gap: 8px;
}
.pkp_site_name .is_img { grid-area: 1 / 1; display: block; }
.pkp_site_name .is_img img { max-height: 78px; width: auto; }

/* the journal title — same row as the logo, above the menu bar.
   Supplied by the header template when patched, by ::before otherwise. */
.pkp_site_name .site_name_beside_logo,
.pkp_site_name .is_text,
.pkp_site_name::before {
  grid-area: 1 / 2;
  align-self: center;
  font-size: clamp(1.05rem, 2vw, 1.8rem);
  font-weight: 800;
  line-height: 1.25;
  letter-spacing: -.01em;
  text-transform: uppercase;
  color: var(--ag-navy);
  text-decoration: none;
}
.pkp_site_name::before { content: var(--ag-journal-name, ""); }
.pkp_site_name:has(.site_name_beside_logo)::before,
.pkp_site_name:has(.is_text)::before { content: none; }
.pkp_site_name .site_name_beside_logo:hover, .pkp_site_name .is_text:hover { color: var(--ag-brand-d); }
/* no logo (site-wide pages): the title spans the full width */
.pkp_site_name:not(:has(.is_img)) .is_text { grid-area: 1 / 1 / 1 / -1; }

/* ISSN / publisher line, full width beneath both */
.pkp_site_name::after {
  grid-area: 2 / 1 / 2 / -1;
  content: var(--ag-issn-line, "");
  padding-top: 9px;
  border-top: 2px solid var(--ag-brand);
  font-size: .84rem;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: none;
  color: var(--ag-muted);
}

/* user links (Login / Register) as small pills on the right */
.pkp_navigation_user_wrapper { float: right; }
.pkp_navigation_user > li > a {
  background: var(--ag-brand-soft);
  border: 1px solid var(--ag-brand-line);
  color: var(--ag-brand-d);
  border-radius: 999px;
  padding: 6px 15px;
  font-size: .82rem;
  font-weight: 700;
  margin-left: 6px;
}
.pkp_navigation_user > li > a:hover { background: var(--ag-brand); border-color: var(--ag-brand); color: #fff; text-decoration: none; }

/* =========================================================
   2. Primary navigation — solid band across the page
   ========================================================= */
.pkp_navigation_primary_row {
  background: var(--ag-navy);
  border: 0;
  box-shadow: inset 0 -3px 0 var(--ag-brand);
}
.pkp_navigation_primary_row .pkp_navigation_primary_wrapper { padding: 0; }
.pkp_navigation_primary > li > a {
  color: #E7ECF6;
  font-weight: 600;
  font-size: .87rem;
  letter-spacing: .02em;
  text-transform: uppercase;
  padding: 13px 15px;
  border-radius: 0;
}
.pkp_navigation_primary > li > a:hover,
.pkp_navigation_primary > li > a:focus,
.pkp_navigation_primary > li.current > a {
  background: var(--ag-brand);
  color: #fff;
  text-decoration: none;
}
.pkp_navigation_primary > li > ul {
  background: #fff;
  border: 1px solid var(--ag-line);
  border-radius: 0 0 10px 10px;
  box-shadow: var(--ag-shadow);
  padding: 6px;
}
.pkp_navigation_primary > li > ul a { color: var(--ag-ink); text-transform: none; font-size: .88rem; padding: 8px 12px; border-radius: 7px; }
.pkp_navigation_primary > li > ul a:hover { background: var(--ag-brand-soft); color: var(--ag-brand-d); }

/* header search */
.pkp_search input[type="text"] { border: 1px solid var(--ag-line); border-radius: 7px; padding: 7px 11px; }
.pkp_search input[type="text"]:focus { outline: 2px solid var(--ag-brand-line); border-color: var(--ag-brand); }

/* =========================================================
   3. Content shell
   ========================================================= */
.pkp_structure_content { padding-top: 24px; padding-bottom: 10px; }
.pkp_structure_main {
  background: #fff;
  border: 1px solid var(--ag-line);
  border-radius: var(--ag-radius);
  box-shadow: var(--ag-shadow);
  padding: 26px 30px;
}
.pkp_structure_sidebar { padding-left: 22px; }

.page > h1, .obj_issue_toc > h1, .obj_article_details > h1, .cmp_announcements > h1 {
  font-size: 1.6rem;
  position: relative;
  padding-bottom: .55rem;
  margin: 0 0 1.2rem;
  border-bottom: 2px solid var(--ag-line);
}
.page > h1::after, .obj_issue_toc > h1::after, .obj_article_details > h1::after, .cmp_announcements > h1::after {
  content: "";
  position: absolute;
  left: 0; bottom: -2px;
  width: 96px; height: 2px;
  background: var(--ag-brand);
}
h2.pkp_screen_reader + *, .obj_issue_toc .section > h2 {
  font-size: .95rem;
  color: var(--ag-brand-d);
  text-transform: uppercase;
  letter-spacing: .09em;
  font-weight: 800;
  border-bottom: 1px solid var(--ag-line);
  padding-bottom: .35rem;
}
.cmp_breadcrumbs { color: var(--ag-muted); font-size: .84rem; margin-bottom: .8rem; }
.cmp_breadcrumbs a { color: var(--ag-muted); }

/* journal description block on the home page */
.page_index_journal .journal_description {
  font-size: .97rem;
  color: var(--ag-ink);
  line-height: 1.75;
}
.page_index_journal .journal_description h2,
.page_index_journal .journal_description h3 { font-size: 1.1rem; margin-top: 1.4rem; }
.page_index_journal .homepage_image img { border-radius: var(--ag-radius); border: 1px solid var(--ag-line); }

/* =========================================================
   4. Article rows — title, authors, pages, DOI, pill actions
   ========================================================= */
.obj_article_summary {
  border: 0;
  border-bottom: 1px solid var(--ag-line);
  padding: 18px 0 20px;
  margin: 0;
}
.obj_article_summary:last-child { border-bottom: 0; }
.obj_article_summary > .title { margin-bottom: .35rem; }
.obj_article_summary > .title a {
  color: var(--ag-navy);
  font-weight: 700;
  font-size: 1.04rem;
  line-height: 1.45;
}
.obj_article_summary > .title a:hover { color: var(--ag-brand-d); text-decoration: none; }
.obj_article_summary .authors {
  color: var(--ag-muted);
  font-size: .9rem;
  font-style: italic;
  margin-bottom: .3rem;
}
.obj_article_summary .meta, .obj_article_summary .published, .obj_article_summary .pages {
  color: var(--ag-muted);
  font-size: .85rem;
}
.obj_article_summary .meta .pages::before { content: "Pages: "; font-weight: 700; color: var(--ag-ink); }
.obj_article_summary .cover_image img { border-radius: 8px; border: 1px solid var(--ag-line); }
.obj_article_summary .doi, .obj_article_details .doi {
  font-size: .85rem;
  color: var(--ag-muted);
  word-break: break-all;
}
.obj_article_summary .doi a { color: var(--ag-brand-d); }

/* galley / action pills */
.obj_article_summary .galleys_links { margin-top: .6rem; padding: 0; }
.obj_galley_link, .galleys_links .obj_galley_link, .obj_article_details .galleys .obj_galley_link {
  display: inline-block;
  background: #fff;
  border: 1px solid var(--ag-brand);
  color: var(--ag-brand-d);
  border-radius: 999px;
  font-weight: 700;
  font-size: .8rem;
  letter-spacing: .02em;
  padding: 6px 16px;
  margin: 0 6px 6px 0;
  text-transform: uppercase;
}
.obj_galley_link:hover, .obj_galley_link:focus {
  background: var(--ag-brand);
  border-color: var(--ag-brand);
  color: #fff;
  text-decoration: none;
}

/* article landing page */
.obj_article_details .page_title { font-size: 1.45rem; line-height: 1.35; }
.obj_article_details .subtitle { color: var(--ag-muted); font-size: 1.05rem; }
.obj_article_details .authors .author { margin-bottom: .5rem; }
.obj_article_details .author .name { font-weight: 700; color: var(--ag-navy); }
.obj_article_details .author .affiliation, .obj_article_details .author .orcid { color: var(--ag-muted); font-size: .88rem; }
.obj_article_details .main_entry .item { border-top: 1px solid var(--ag-line); padding-top: 1rem; margin-top: 1rem; }
.obj_article_details .item .label {
  font-size: .78rem;
  text-transform: uppercase;
  letter-spacing: .09em;
  font-weight: 800;
  color: var(--ag-brand-d);
}
.obj_article_details .abstract { font-size: .97rem; line-height: 1.8; }

/* issue table of contents */
.obj_issue_toc .heading, .obj_issue_summary .title { color: var(--ag-navy); }
.obj_issue_toc .cover_image img, .obj_issue_summary .cover img {
  border-radius: var(--ag-radius);
  border: 1px solid var(--ag-line);
  box-shadow: var(--ag-shadow);
}

/* =========================================================
   5. Sidebar blocks — cover, quick links, information
   ========================================================= */
.pkp_block {
  background: #fff;
  border: 1px solid var(--ag-line);
  border-radius: var(--ag-radius);
  padding: 16px 18px;
  margin-bottom: 18px;
  box-shadow: var(--ag-shadow);
}
.pkp_block .title {
  color: #fff;
  background: var(--ag-navy);
  font-size: .76rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .1em;
  border: 0;
  border-radius: 7px;
  padding: 8px 12px;
  margin: -4px -4px .9rem;
}
.pkp_block ul { padding-left: 0; list-style: none; margin: 0; }
.pkp_block li { margin-bottom: .5rem; font-size: .9rem; border-bottom: 1px dashed var(--ag-line); padding-bottom: .5rem; }
.pkp_block li:last-child { border-bottom: 0; }
.pkp_block.block_make_submission a, .block_make_submission .cmp_button {
  display: block;
  background: var(--ag-brand);
  color: #fff;
  border: 0;
  border-radius: 8px;
  text-align: center;
  font-weight: 800;
  padding: 11px;
  text-transform: uppercase;
  font-size: .84rem;
}
.pkp_block.block_make_submission a:hover { background: var(--ag-brand-d); color: #fff; text-decoration: none; }

/* =========================================================
   6. Home-page extras injected through OJS settings
   ========================================================= */
.ag-strip {
  margin: 26px 0 6px;
  padding-top: 20px;
  border-top: 2px solid var(--ag-line);
}
.ag-strip h3 {
  font-size: .95rem;
  text-transform: uppercase;
  letter-spacing: .09em;
  color: var(--ag-brand-d);
  margin-bottom: 14px;
}
.ag-index-list { display: flex; flex-wrap: wrap; gap: 10px; padding: 0; list-style: none; margin: 0; }
.ag-index-list li {
  background: #fff;
  border: 1px solid var(--ag-line);
  border-radius: 999px;
  padding: 7px 16px;
  font-size: .85rem;
  font-weight: 600;
  color: var(--ag-ink);
}
.ag-cta {
  margin-top: 24px;
  background: linear-gradient(120deg, var(--ag-brand-d), var(--ag-brand) 60%, var(--ag-brand-l));
  color: #fff;
  border-radius: var(--ag-radius);
  padding: 22px 26px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  flex-wrap: wrap;
}
.ag-cta h3 { color: #fff; margin: 0 0 .2rem; font-size: 1.2rem; }
.ag-cta p { margin: 0; color: #FFEAD6; font-size: .92rem; }
.ag-cta a {
  background: #fff;
  color: var(--ag-brand-d);
  border-radius: 8px;
  padding: 10px 20px;
  font-weight: 800;
  font-size: .88rem;
  white-space: nowrap;
}
.ag-cta a:hover { background: var(--ag-navy); color: #fff; text-decoration: none; }
.ag-quick { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 12px; margin-top: 18px; }
.ag-quick a {
  display: block;
  background: var(--ag-brand-soft);
  border: 1px solid var(--ag-brand-line);
  border-radius: 9px;
  padding: 13px 15px;
  font-weight: 700;
  color: var(--ag-brand-d);
  font-size: .9rem;
}
.ag-quick a:hover { background: var(--ag-brand); color: #fff; text-decoration: none; }
.ag-quick span { display: block; font-weight: 500; font-size: .8rem; color: var(--ag-muted); margin-top: 2px; }
.ag-quick a:hover span { color: #FFEAD6; }

/* =========================================================
   7. Buttons and forms
   ========================================================= */
.cmp_button, .pkp_button, button.submitFormButton, input[type="submit"], .cmp_form button {
  background: var(--ag-brand);
  border: 1px solid var(--ag-brand);
  color: #fff;
  border-radius: 8px;
  font-weight: 700;
  padding: 9px 18px;
}
.cmp_button:hover, .pkp_button:hover, button.submitFormButton:hover, input[type="submit"]:hover {
  background: var(--ag-brand-d); border-color: var(--ag-brand-d); color: #fff;
}
.cmp_form input[type="text"], .cmp_form input[type="email"], .cmp_form input[type="password"],
.cmp_form textarea, .cmp_form select {
  border: 1px solid var(--ag-line); border-radius: 8px; padding: 9px 11px;
}
.cmp_form input:focus, .cmp_form textarea:focus, .cmp_form select:focus {
  outline: 2px solid var(--ag-brand-line); border-color: var(--ag-brand);
}
table.pkp_table th { background: var(--ag-brand-soft); color: var(--ag-navy); }
table.pkp_table td, table.pkp_table th { border-color: var(--ag-line); }

/* =========================================================
   8. Footer — three columns, dark, no PKP mark
   ========================================================= */
.pkp_structure_footer_wrapper { background: var(--ag-navy); margin-top: 40px; border-top: 3px solid var(--ag-brand); }
.pkp_structure_footer { padding: 34px 0 8px; }
.pkp_footer_content { color: #B9C4DA; font-size: .92rem; }
.pkp_footer_content a { color: #B9C4DA; }
.pkp_footer_content a:hover { color: var(--ag-brand-l); }
.pkp_footer_content h1, .pkp_footer_content h2, .pkp_footer_content h3, .pkp_footer_content h4 {
  color: #fff;
  font-size: .82rem;
  text-transform: uppercase;
  letter-spacing: .1em;
  margin: 0 0 .9rem;
}
.ag-footer-grid { display: grid; grid-template-columns: 1.6fr 1fr 1fr; gap: 30px; }
.ag-footer-grid ul { list-style: none; padding: 0; margin: 0; }
.ag-footer-grid li { margin-bottom: .45rem; }
.ag-footer-bottom {
  border-top: 1px solid rgba(255,255,255,.13);
  margin-top: 24px;
  padding-top: 14px;
  text-align: center;
  font-size: .83rem;
  color: #8C99B4;
}

/* the PKP / OJS brand mark — removed from the template and hidden here too */
.pkp_brand_footer { display: none !important; }

/* =========================================================
   9. Responsive
   ========================================================= */
@media (max-width: 991px) {
  .ag-footer-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 767px) {
  .pkp_structure_main { padding: 18px 16px; }
  .pkp_site_name { grid-template-columns: 1fr; row-gap: 6px; }
  .pkp_site_name .is_img { grid-area: 1 / 1; }
  .pkp_site_name .is_img img { max-height: 54px; }
  .pkp_site_name .site_name_beside_logo,
  .pkp_site_name .is_text,
  .pkp_site_name::before { grid-area: 2 / 1; }
  .pkp_site_name::after { grid-area: 3 / 1; font-size: .78rem; }
  .pkp_navigation_primary > li > a { padding: 11px 12px; font-size: .82rem; }
  .ag-footer-grid { grid-template-columns: 1fr; }
  .ag-cta { padding: 18px; }
  .pkp_structure_sidebar { padding-left: 0; }
}


/* --- masthead details for this journal --- */
:root {
  --ag-journal-name: "Journal of Applied Chemistry Research";
  --ag-issn-line: "Published by Adeon Global";
}
