/* ============================================================================
   Texts and Contexts — OJS theme match
   Brings the OJS Default theme into line with the main site at txtctx.com:
   oatmeal paper, warm ink, manuscript ink-blue, brass detail; Fraunces + Newsreader.

   Install: Settings > Website > Appearance > Setup > Journal Style Sheet (upload this file).
   Best paired with the Default theme and its Colour set to #213A54.
   Notes:
     - Fonts load from Google Fonts (same as the main site). Visitors fetch them
       directly; nothing to host.
     - The footer is kept light on purpose so the "OJS / PKP" credit stays legible.
     - This styles the reader-facing journal only; the editorial backend is untouched.
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,400;0,9..144,500;0,9..144,600;1,9..144,400&family=Newsreader:ital,opsz,wght@0,6..72,400;0,6..72,500;0,6..72,600;1,6..72,400&display=swap');

:root {
  --paper:    #F1F0EB;
  --paper-2:  #E9E7DF;
  --ink:      #1B1A17;
  --ink-soft: #575349;
  --accent:   #213A54;
  --accent-d: #16293D;
  --brass:    #9A7B3F;
  --rule:     #D9D4C8;
  --serif-display: "Fraunces", Georgia, "Times New Roman", serif;
  --serif-text: "Newsreader", Georgia, "Times New Roman", serif;
}

/* ---------- base ---------- */
body,
.pkp_structure_page {
  background: var(--paper);
  color: var(--ink);
  font-family: var(--serif-text);
  -webkit-font-smoothing: antialiased;
}
.pkp_structure_content { background: transparent; }

/* readable body copy */
.pkp_structure_content,
.pkp_structure_content p,
.pkp_structure_content li { font-size: 1.02rem; line-height: 1.65; }

/* ---------- headings ---------- */
h1, h2, h3, h4,
.pkp_structure_content h1,
.pkp_structure_content h2,
.pkp_structure_content h3,
.page_title,
.obj_article_details .title,
.obj_issue_toc .title,
.cmp_notification .title {
  font-family: var(--serif-display);
  font-weight: 500;
  color: var(--ink);
  line-height: 1.15;
}

/* ---------- header band ---------- */
.pkp_structure_head {
  background: var(--accent);
  border-bottom: none;
}
.pkp_structure_head,
.pkp_structure_head a,
.pkp_site_name_wrapper a,
.pkp_site_nav_menu a,
.pkp_search input,
.pkp_search .search_prompt {
  color: var(--paper);
}
/* primary navigation */
.pkp_site_nav_menu a { text-decoration: none; }
.pkp_site_nav_menu a:hover,
.pkp_site_nav_menu a:focus,
.pkp_site_nav_menu .current a {
  color: #FFFFFF;
  box-shadow: inset 0 -2px 0 var(--brass);
}

/* header logo size (change 56px to taste) */
.pkp_site_name_wrapper img,
.pkp_site_name img,
.pkp_head_wrapper .pkp_site_name img {
  max-height: 56px !important;
  width: auto !important;
  height: auto !important;
}

/* make the primary nav bar the same ink-blue as the header */
.pkp_navigation_primary_wrapper,
.pkp_navigation_primary_row,
nav.pkp_navigation_primary,
.pkp_site_nav_menu {
  background-color: var(--accent) !important;
}

/* breathing room so the menu text is centred, not sitting on the bottom edge */
.pkp_site_nav_menu a,
.pkp_navigation_primary a {
  padding-top: 0.7rem !important;
  padding-bottom: 0.7rem !important;
  line-height: 1.3 !important;
}

/* ---------- links & accents ---------- */
.pkp_structure_content a,
.pkp_block a {
  color: var(--accent);
  text-underline-offset: 0.15em;
}
.pkp_structure_content a:hover,
.pkp_structure_content a:focus,
.pkp_block a:hover {
  color: var(--accent-d);
}

/* ---------- buttons ---------- */
.pkp_button,
a.pkp_button,
.cmp_button,
a.cmp_button,
.pkp_form .buttons button,
button.submitFormButton,
input[type="submit"],
button[type="submit"],
.obj_article_details .galleys_links a,
.obj_issue_toc .galleys a {
  background-color: var(--accent);
  border: 1px solid var(--accent);
  color: var(--paper);
  border-radius: 2px;
}
.pkp_button:hover,
a.pkp_button:hover,
.cmp_button:hover,
a.cmp_button:hover,
.pkp_form .buttons button:hover,
input[type="submit"]:hover,
button[type="submit"]:hover,
.obj_article_details .galleys_links a:hover,
.obj_issue_toc .galleys a:hover {
  background-color: var(--accent-d);
  border-color: var(--accent-d);
  color: var(--paper);
}

/* ---------- sidebar blocks ---------- */
.pkp_block .title,
.pkp_block .pkp_block_title {
  font-family: var(--serif-display);
  font-weight: 500;
  color: var(--ink);
  border-bottom: 1px solid var(--rule);
  padding-bottom: 0.35rem;
}

/* ---------- rules / separators ---------- */
.pkp_structure_content hr,
.obj_issue_toc .heading,
.pkp_structure_content .separator,
.obj_article_details .row { border-color: var(--rule); }

/* subtle brass rule under the main page title */
.page_title {
  border-bottom: 2px solid var(--brass);
  padding-bottom: 0.4rem;
  display: inline-block;
}

/* ---------- footer (kept light so the OJS/PKP credit stays visible) ---------- */
.pkp_structure_footer_wrapper,
.pkp_structure_footer {
  background: var(--paper-2);
  border-top: 1px solid var(--rule);
  color: var(--ink-soft);
}
.pkp_structure_footer a { color: var(--accent); }
.pkp_structure_footer a:hover { color: var(--accent-d); }

/* scale down the OJS/PKP credit (the theme already caps it at 150px, so use less).
   Change 100px to taste. */
.pkp_brand_footer,
.pkp_brand_footer a {
  max-width: 80px !important;
}
.pkp_structure_footer img[src*="ojs_brand"],
.pkp_brand_footer img,
a[href*="pkp"] img,
img[src*="ojs_brand"] {
  width: 80px !important;
  max-width: 80px !important;
  height: auto !important;
}

/* ---------- mobile header: keep the logo within the bar ---------- */
@media (max-width: 767px) {
  .pkp_site_name_wrapper img,
  .pkp_site_name img,
  .pkp_head_wrapper .pkp_site_name img,
  .pkp_structure_head .pkp_site_name img {
    max-height: 40px !important;
    max-width: 62vw !important;
    width: auto !important;
    height: auto !important;
  }
  .pkp_structure_head {
    padding-top: 0.5rem !important;
    padding-bottom: 0.5rem !important;
    overflow: visible !important;
  }
}