/* ==========================================================================
   Organizational Aesthetics: custom stylesheet for OJS 3.5
   THEME: Health Sciences (PKP, Bootstrap-based)
   Look & feel modelled on tavinstitute.org, using the OA accent #AC2B37.

   Install: Settings > Website > Appearance > Theme > Health Sciences Theme
            > "Journal style sheet": upload this file, then Save.
   Keep the theme's Primary colour at #AC2B37 (as it is now).
   ========================================================================== */

/* Fonts
   Tavistock uses AGIPO (Radim Pesko / RP Digital Type Foundry), a commercial
   typeface. Until a webfont licence is in place, "Schibsted Grotesk" (free,
   Google Fonts) stands in. Once you have licensed Agipo webfont files:
     1. Upload agipo-regular.woff2 and agipo-bold.woff2 to the journal's
        public files directory (e.g. /public/journals/1/fonts/)
     2. Remove the comment markers around the @font-face block below.
   "Agipo" is already first in the font stack, so it takes over automatically. */
@import url("https://fonts.googleapis.com/css2?family=Schibsted+Grotesk:wght@400;500;600;700&family=Source+Serif+4:ital,wght@0,400;0,600;1,400&display=swap");

/*
@font-face {
  font-family: "Agipo";
  src: url("/public/journals/1/fonts/agipo-regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Agipo";
  src: url("/public/journals/1/fonts/agipo-bold.woff2") format("woff2");
  font-weight: 600 700;
  font-style: normal;
  font-display: swap;
}
*/

/* ---------- 1. Design tokens ------------------------------------------- */
:root {
  --oa-accent:        #AC2B37;   /* OA red (replaces Tavistock teal) */
  --oa-accent-dark:   #8A1F2A;   /* hover / pressed */
  --oa-accent-tint:   #F6E9EA;   /* very light red for highlights */
  --oa-ink:           #2E2D2C;   /* Tavistock charcoal */
  --oa-ink-soft:      #5C5A58;   /* secondary text */
  --oa-paper:         #FFFFFF;
  --oa-paper-warm:    #F5F4F4;   /* Tavistock off-white */
  --oa-rule:          #E2E0DE;   /* hairlines */
  --oa-sans:  "Agipo", "Schibsted Grotesk", "Helvetica Neue", Arial, sans-serif;
  --oa-serif: "Source Serif 4", Georgia, "Times New Roman", serif;
  --oa-radius: 2px;

  /* Bootstrap 5 variables used by the theme */
  --bs-primary: #AC2B37;
  --bs-primary-rgb: 172, 43, 55;
  --bs-link-color: #AC2B37;
  --bs-link-hover-color: #8A1F2A;
  --bs-body-color: #2E2D2C;
  --bs-body-font-family: var(--oa-sans);
}

/* ---------- 2. Base ---------------------------------------------------- */
body {
  background: var(--oa-paper);
  color: var(--oa-ink);
  font-family: var(--oa-sans);
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: var(--oa-sans);
  color: var(--oa-ink);
  font-weight: 600;
  letter-spacing: -0.01em;
  line-height: 1.25;
}

a { color: var(--oa-accent); text-decoration: none; transition: color .15s ease, background-color .15s ease, border-color .15s ease; }
a:hover, a:focus { color: var(--oa-accent-dark); text-decoration: underline; text-underline-offset: 3px; }

a:focus-visible, button:focus-visible, .btn:focus-visible,
input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 2px solid var(--oa-accent);
  outline-offset: 2px;
  box-shadow: none;
}

::selection { background: var(--oa-accent); color: #fff; }

/* Page headings on inner pages (About, Archive, Search ...) */
.page-header h1,
.page-content > h1,
.page-title {
  font-size: 2.25rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--oa-ink);
}

.page-content { padding-top: 2.5rem; padding-bottom: 3rem; }

/* ---------- 3. Header -------------------------------------------------- */
.main-header {
  background: var(--oa-paper) !important;
  border-bottom: 1px solid var(--oa-ink);
  box-shadow: none !important;
}

.main-header .navbar-logo img,
.main-header .navbar-brand img {
  max-height: 90px;
  width: auto;
}

.main-header .navbar-logo-text {
  font-family: var(--oa-sans);
  font-weight: 700;
  font-size: 1.75rem;
  letter-spacing: -0.02em;
  color: var(--oa-ink) !important;
}

/* ---------- 4. Navigation: minimal ------------------------------------ */
/* Type scale: primary nav 1.3rem, drop-down 1.1rem, Login/Register 1.125rem.
   Hover and current page everywhere use the same 3px red bar as the
   "Current issue" eyebrow: one visual language across the site. */

.main-header .navbar { background: transparent !important; }

/* Reset every box/background the theme or Bootstrap adds to menu links */
.main-header .navbar-nav .nav-link,
.main-header .navbar-nav .nav-link:hover,
.main-header .navbar-nav .nav-link:focus,
.main-header .navbar-nav .nav-link:active,
.main-header .navbar-nav .nav-link.show,
.main-header .navbar-nav .show > .nav-link,
.main-header .dropdown-item,
.main-header .dropdown-item:hover,
.main-header .dropdown-item:focus,
.main-header .dropdown-item:active,
.main-header .dropdown-item.active {
  background: none !important;
  background-color: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: none !important;
  text-decoration: none !important;
}

/* Shared red bar, hidden until hover / current page */
.main-header #primaryNav .nav-link::before,
.main-header #userNav .nav-link::before,
.main-header .dropdown-item::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  height: 3px;
  background: var(--oa-accent);
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform .25s ease;
}

/* -- Primary menu -- */
.main-header #primaryNav .nav-link {
  position: relative;
  color: var(--oa-ink) !important;
  font-family: var(--oa-sans);
  font-size: 1.3rem !important;
  font-weight: 500;
  letter-spacing: -0.015em;
  line-height: 1.2;
  text-transform: none;
  padding: 1.15rem 0 1.25rem !important;
  margin: 0 .1rem;
  transition: color .15s ease;
}
.main-header #primaryNav .nav-link::before { bottom: .5rem; }
.main-header #primaryNav .dropdown-toggle::before { right: 1.1em; }  /* stop before the arrow */

.main-header #primaryNav .nav-link:hover,
.main-header #primaryNav .nav-link:focus,
.main-header #primaryNav .nav-link[aria-expanded="true"] { color: var(--oa-accent) !important; }
.main-header #primaryNav .nav-link:hover::before,
.main-header #primaryNav .nav-link:focus::before,
.main-header #primaryNav .nav-link[aria-expanded="true"]::before { transform: scaleX(1); }

/* Current page. The menu has no "active" marker, so each page is
   recognised by its wrapper class. */
body:has(.page-issue)          #primaryNav .nmi_type_current       > .nav-link,
body:has(.page-archives)       #primaryNav .nmi_type_archives      > .nav-link,
body:has(.page-announcement)   #primaryNav .nmi_type_announcements > .nav-link,
body:has(.page-search)         #primaryNav .nmi_type_search        > .nav-link,
body:has(.page-about, .page-submissions, .page-masthead, .page-contact, .page-about-publishing-system)
                               #primaryNav .nmi_type_about         > .nav-link { color: var(--oa-accent) !important; }
body:has(.page-issue)          #primaryNav .nmi_type_current       > .nav-link::before,
body:has(.page-archives)       #primaryNav .nmi_type_archives      > .nav-link::before,
body:has(.page-announcement)   #primaryNav .nmi_type_announcements > .nav-link::before,
body:has(.page-search)         #primaryNav .nmi_type_search        > .nav-link::before,
body:has(.page-about, .page-submissions, .page-masthead, .page-contact, .page-about-publishing-system)
                               #primaryNav .nmi_type_about         > .nav-link::before { transform: scaleX(1); transition: none; }

/* Keyboard focus stays visible as a fine ring (mouse users never see it) */
.main-header .navbar-nav .nav-link:focus-visible,
.main-header .dropdown-item:focus-visible {
  outline: 1px solid var(--oa-accent) !important;
  outline-offset: 5px;
}

/* Drop-down arrow: light chevron */
.main-header .dropdown-toggle::after {
  border: 0 !important;
  content: "" !important;
  display: inline-block;
  width: .4em;
  height: .4em;
  border-right: 1.5px solid currentColor !important;
  border-bottom: 1.5px solid currentColor !important;
  transform: translateY(-.22em) rotate(45deg);
  margin-left: .55em;
  vertical-align: middle;
  transition: transform .2s ease;
}
.main-header .dropdown-toggle[aria-expanded="true"]::after { transform: translateY(.05em) rotate(-135deg); }

/* -- Second-level menu (About ▸ …): plain words, same underline bar -- */
.main-header .dropdown-menu {
  background: var(--oa-paper) !important;
  border: 0 !important;
  border-top: 3px solid var(--oa-accent) !important;
  border-radius: 0 !important;
  box-shadow: 0 1px 0 var(--oa-rule), 0 16px 32px -16px rgba(46, 45, 44, .22) !important;
  padding: .9rem 0 !important;
  margin-top: .1rem !important;
  min-width: 16rem;
}

.main-header .dropdown-item {
  position: relative;
  display: block;
  width: fit-content;                 /* bar is as wide as the word */
  color: var(--oa-ink) !important;
  font-family: var(--oa-sans);
  font-size: 1.1rem;
  font-weight: 400;
  letter-spacing: -0.01em;
  line-height: 1.3;
  padding: .55rem 0 .7rem !important;
  margin: 0 1.6rem;
  white-space: nowrap;
  transition: color .15s ease;
}
.main-header .dropdown-item::before { bottom: .3rem; }

.main-header .dropdown-item:hover,
.main-header .dropdown-item:focus { color: var(--oa-accent) !important; }
.main-header .dropdown-item:hover::before,
.main-header .dropdown-item:focus::before { transform: scaleX(1); }

/* Current sub-page */
body:has(.page-about)        .main-header .dropdown-item[href$="/about"],
body:has(.page-submissions)  .main-header .dropdown-item[href$="/about/submissions"],
body:has(.page-masthead)     .main-header .dropdown-item[href*="/about/editorial"],
body:has(.page-contact)      .main-header .dropdown-item[href$="/about/contact"] { color: var(--oa-accent) !important; }
body:has(.page-about)        .main-header .dropdown-item[href$="/about"]::before,
body:has(.page-submissions)  .main-header .dropdown-item[href$="/about/submissions"]::before,
body:has(.page-masthead)     .main-header .dropdown-item[href*="/about/editorial"]::before,
body:has(.page-contact)      .main-header .dropdown-item[href$="/about/contact"]::before { transform: scaleX(1); transition: none; }

/* -- Login / Register / user menu (top right) -- */
.main-header #userNav { gap: .5rem; align-items: center; }

.main-header #userNav .nav-link,
.main-header #primaryNav-userNav .nav-link {
  position: relative;
  font-size: 1.125rem !important;
  font-weight: 500 !important;
  letter-spacing: -0.01em;
  color: var(--oa-ink) !important;
  padding: .45rem 1rem .7rem !important;
  transition: color .15s ease;
}
.main-header #userNav .nav-link::before { bottom: .2rem; left: 1rem; right: 1rem; }
.main-header #userNav .dropdown-toggle::before { right: calc(1rem + 1.1em); }

.main-header #userNav .nav-link:hover,
.main-header #userNav .nav-link:focus,
.main-header #userNav .nav-link[aria-expanded="true"],
.main-header #primaryNav-userNav .nav-link:hover { color: var(--oa-accent) !important; }
.main-header #userNav .nav-link:hover::before,
.main-header #userNav .nav-link:focus::before,
.main-header #userNav .nav-link[aria-expanded="true"]::before { transform: scaleX(1); }

body:has(.page-login, .pkp_page_login, #login) #userNav .nmi_type_user_login > .nav-link,
body:has(.page-register, .pkp_page_register, #register) #userNav .nmi_type_user_register > .nav-link { color: var(--oa-accent) !important; }

.main-header .task_count,
.main-header .badge {
  background: var(--oa-accent) !important;
  color: #fff !important;
  font-size: .68rem;
  font-weight: 600;
  line-height: 1;
  min-width: 1.45em;
  padding: .32em .5em !important;
  border-radius: 999px !important;
  margin-left: .4em;
  vertical-align: .2em;
}
.main-header #userNav .dropdown-menu { min-width: 13rem; }
.main-header #userNav .dropdown-item { font-size: 1rem; margin: 0 1.4rem; }

/* Mobile menu toggle: thin outline */
.main-header .navbar-toggler {
  border: 1px solid var(--oa-ink) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* Small screens: stacked list */
@media (max-width: 991px) {
  .main-header #primaryNav .nav-link,
  .main-header #primaryNav-userNav .nav-link {
    font-size: 1.25rem !important;
    padding: .8rem 0 1rem !important;
    width: fit-content;
  }
  .main-header #primaryNav .nav-link::before { bottom: .45rem; }
  .main-header .dropdown-menu { box-shadow: none !important; border-top-width: 0 !important; padding: 0 0 .5rem !important; }
  .main-header .dropdown-item { margin: 0 1rem; font-size: 1.1rem; }
}

/* Language switcher */
.main-header [id^="language"] a { color: var(--oa-ink-soft); }
.main-header [id^="language"] a:hover { color: var(--oa-accent); }

/* ---------- 5. Homepage ----------------------------------------------- */
.homepage-image img {
  display: block;
  width: 100%;
  height: auto;
}

/* The white panel that overlaps the homepage image */
.container-homepage-issue {
  background: var(--oa-paper);
}

/* "Current Issue": Tavistock-style eyebrow label */
.homepage-issue-current {
  display: inline-block;
  font-size: .8rem !important;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .12em;
  color: var(--oa-accent) !important;
  border-top: 3px solid var(--oa-accent);
  padding-top: .8rem;
  margin-bottom: 1rem;
}

.homepage-issue-identifier {
  font-size: 2.25rem !important;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--oa-ink);
}

.homepage-issue-published {
  font-size: .9rem !important;
  font-weight: 400;
  color: var(--oa-ink-soft);
  text-transform: none;
  letter-spacing: 0;
}

.homepage-issue-header { margin-top: 2rem; margin-bottom: 1rem; }

.homepage-issue-cover {
  box-shadow: 0 12px 30px rgba(46, 45, 44, .15);
}

.homepage-issue-description-wrapper {
  background: var(--oa-paper-warm) !important;
  border: 0 !important;
  border-left: 3px solid var(--oa-accent) !important;
  border-radius: 0;
  padding: 1.75rem 2rem;
}

.homepage-issue-description .h2 {
  font-size: 1.35rem;
  margin-bottom: 1rem;
}

.homepage-issue-description,
.homepage-journal-description,
.homepage-additional-content {
  font-size: 1rem;
  line-height: 1.7;
}

.homepage-issue-description-more a,
.homepage-journal-description-more,
.homepage-journal-description-less {
  display: inline-block;
  font-weight: 600;
  font-size: .9rem;
  color: var(--oa-accent);
  border-bottom: 2px solid var(--oa-accent);
  padding-bottom: 2px;
  margin-top: 1rem;
  text-transform: none;
  letter-spacing: 0;
}
.homepage-issue-description-more a:hover { color: var(--oa-accent-dark); border-color: var(--oa-accent-dark); text-decoration: none; }

/* Announcements on homepage */
.homepage-announcements { margin-top: 2.5rem; margin-bottom: 1rem; }
.homepage-announcement {
  border-top: 1px solid var(--oa-ink);
  padding-top: 1rem;
}
.homepage-announcement-title { font-size: 1.1rem; }
.homepage-announcement-date { color: var(--oa-ink-soft); }

.homepage-additional-content {
  border-top: 1px solid var(--oa-rule);
  margin-top: 3rem;
  padding-top: 2rem;
}

/* ---------- 6. Issue table of contents -------------------------------- */

/* Each section is one group, closed by a charcoal line.
   The theme's grey line between sections is removed. */
.issue-toc-section,
.issue-toc-section + .issue-toc-section {
  border: 0 !important;
  margin-bottom: 0;
}
.issue-toc-section:has(.article-summary) {
  border-bottom: 1px solid var(--oa-ink) !important;
  padding-bottom: 1.5rem;
}

/* Section headings (Editorial, Articles ...): eyebrow with a short red bar
   above, the same device as "Current Issue" */
.issue-toc-section-title {
  position: relative;
  font-size: .8rem !important;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .12em;
  color: var(--oa-ink) !important;
  background: none !important;
  border: 0 !important;
  padding: 1.1rem 0 0 0 !important;
  margin: 3.5rem 0 .25rem 0 !important;
}
.issue-toc-section-title::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 48px;
  height: 3px;
  background: var(--oa-accent);
}
.issue-toc-section:first-child .issue-toc-section-title { margin-top: 0 !important; }

/* Articles inside a section: no lines, just space */
.article-summary {
  border: 0 !important;
  padding: 1.1rem 0;
  margin: 0 !important;
}

.article-summary-authors {
  font-size: .9rem;
  color: var(--oa-ink-soft);
  margin-bottom: .2rem;
}

.article-summary-pages {
  font-size: .85rem;
  color: var(--oa-ink-soft);
  font-variant-numeric: tabular-nums;
}

.article-summary-title {
  font-family: var(--oa-sans);
  font-size: 1.15rem;
  font-weight: 600;
  line-height: 1.35;
  letter-spacing: -0.01em;
}
.article-summary-title a { color: var(--oa-ink) !important; }
.article-summary-title a:hover,
.article-summary-title a:focus { color: var(--oa-accent) !important; text-decoration: none; }

.article-summary-date,
.article-summary-doi { font-size: .85rem; color: var(--oa-ink-soft); margin-top: .25rem; }

.article-summary-galleys { margin-top: .6rem; }

/* ---------- 7. Buttons (galleys, "View All Issues", forms) ------------ */
.btn,
.btn-primary,
.cmp_button,
.cmp_form button[type="submit"],
button.submit,
input[type="submit"],
.block_make_submission a {
  display: inline-block;
  font-family: var(--oa-sans);
  font-size: .85rem;
  font-weight: 600;
  letter-spacing: .03em;
  text-transform: uppercase;
  color: var(--oa-accent) !important;
  background: transparent !important;
  border: 1.5px solid var(--oa-accent) !important;
  border-radius: var(--oa-radius) !important;
  box-shadow: none !important;
  padding: .45rem 1.1rem;
  line-height: 1.4;
  text-decoration: none;
}
.btn:hover, .btn:focus,
.btn-primary:hover, .btn-primary:focus,
.cmp_button:hover,
.cmp_form button[type="submit"]:hover,
button.submit:hover,
input[type="submit"]:hover,
.block_make_submission a:hover {
  background: var(--oa-accent) !important;
  border-color: var(--oa-accent) !important;
  color: #fff !important;
  text-decoration: none;
}

/* Galley buttons in lists are a bit smaller */
.article-summary-galleys .btn { font-size: .75rem; padding: .25rem .8rem; }

/* Solid red for main calls to action */
.page-content > .text-center > .btn,
.block_make_submission a,
.cmp_form button[type="submit"],
input[type="submit"] {
  background: var(--oa-accent) !important;
  color: #fff !important;
  padding: .65rem 1.4rem;
}
.page-content > .text-center > .btn:hover,
.block_make_submission a:hover,
.cmp_form button[type="submit"]:hover,
input[type="submit"]:hover {
  background: var(--oa-accent-dark) !important;
  border-color: var(--oa-accent-dark) !important;
}

/* ---------- 8. Forms --------------------------------------------------- */
.form-control, .form-select,
input[type="text"], input[type="email"], input[type="password"],
input[type="search"], input[type="url"], input[type="tel"],
input[type="date"], select, textarea {
  font-family: var(--oa-sans);
  color: var(--oa-ink);
  border: 1px solid #C9C6C3;
  border-radius: var(--oa-radius);
  box-shadow: none;
}
.form-control:focus, .form-select:focus,
input:focus, select:focus, textarea:focus {
  border-color: var(--oa-accent);
  box-shadow: 0 0 0 3px rgba(172, 43, 55, .15);
  outline: none;
}
.form-check-input:checked { background-color: var(--oa-accent); border-color: var(--oa-accent); }

label, legend { font-weight: 600; color: var(--oa-ink); }

.alert-primary {
  color: var(--oa-ink);
  background: var(--oa-accent-tint);
  border: 0;
  border-left: 4px solid var(--oa-accent);
  border-radius: 0;
}

/* ---------- 9. Article landing page ----------------------------------- */
.article-details .page-header { border-bottom: 1px solid var(--oa-rule); padding-bottom: 1.5rem; margin-bottom: 2rem; }

.article-details-issue-identifier a,
.article-details-issue-section {
  font-size: .8rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .12em;
  color: var(--oa-accent);
}

.article-details-fulltitle {
  font-size: 2.25rem;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.02em;
  color: var(--oa-ink);
  margin: .5rem 0 1rem;
}

.article-details-published,
.article-details-doi { font-size: .9rem; color: var(--oa-ink-soft); }

.authors-string { margin-top: 1rem; }
.authors-string li { font-weight: 600; color: var(--oa-ink); }
.authors-string .author-string-href { color: var(--oa-ink); }
.authors-string .author-string-href:hover { color: var(--oa-accent); }
.authors-string .author-symbol { color: var(--oa-accent); }

.article-details-author-affiliation { color: var(--oa-ink-soft); font-size: .92rem; }

.article-details-bio-toggle {
  background: none;
  border: 0;
  padding: 0;
  color: var(--oa-accent);
  font-weight: 600;
  font-size: .85rem;
}
.article-details-bio-toggle:hover { color: var(--oa-accent-dark); text-decoration: underline; }

/* Labels like "Abstract", "Keywords", "References" */
.article-details-heading,
.downloads_chart .label {
  font-size: .78rem !important;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .12em;
  color: var(--oa-ink-soft) !important;
  border: 0;
  margin-bottom: .8rem;
}

.article-details-block { margin-bottom: 2rem; }

.article-details-abstract {
  font-family: var(--oa-serif);
  font-size: 1.1rem;
  line-height: 1.75;
}
.article-details-abstract .article-details-heading { font-family: var(--oa-sans); }

.article-details-references-value { font-size: .92rem; line-height: 1.6; color: var(--oa-ink); }

/* Right-hand sidebar on the article page */
.article-details-sidebar {
  border-left: 1px solid var(--oa-rule);
  padding-left: 1.5rem;
}
.article-details-sidebar .article-details-block {
  border-bottom: 1px solid var(--oa-rule);
  padding-bottom: 1.25rem;
}
.article-details-cover img { box-shadow: 0 10px 24px rgba(46, 45, 44, .12); }

.article-details-galley .btn { margin-bottom: .4rem; }

/* ---------- 9b. Pop-ups (login, author bio) --------------------------- */
/* The theme paints pop-ups in the primary colour; everything inside is
   set in white, minimal lines instead of boxes. */
.modal-backdrop.show { background: var(--oa-ink); opacity: .7; }

.modal-content {
  background: var(--oa-accent) !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: 0 24px 60px -20px rgba(0, 0, 0, .45);
}
.modal-content,
.modal-content p,
.modal-content label,
.modal-content legend,
.modal-content .form-text,
.modal-content .required,
.modal-content .modal-title { color: #fff !important; }

.modal-header { border-bottom: 1px solid rgba(255, 255, 255, .5) !important; }
.modal-title { font-weight: 600; font-size: 1.25rem; }

/* Close (×): plain white mark, no square */
.modal-content .close {
  background: none !important;
  border: 0 !important;
  color: #fff !important;
  opacity: .85;
  font-size: 2.25rem;
  font-weight: 300;
  line-height: 1;
  padding: .25rem .5rem;
  text-shadow: none !important;
  transition: opacity .15s ease, transform .2s ease;
}
.modal-content .close:hover,
.modal-content .close:focus { opacity: 1; transform: rotate(90deg); }
.modal-content .close:focus-visible { outline: 1px solid #fff; outline-offset: 2px; }

/* Labels */
.modal-content label {
  font-size: .78rem;
  font-weight: 600;
  letter-spacing: .12em;
  text-transform: uppercase;
  margin-bottom: .35rem;
}
.modal-content .form-check-label { text-transform: none; letter-spacing: 0; font-weight: 400; font-size: .9rem; }

/* Fields: a single white line to write on */
.modal-content .form-control {
  background: transparent !important;
  color: #fff !important;
  border: 0 !important;
  border-bottom: 1.5px solid rgba(255, 255, 255, .7) !important;
  border-radius: 0 !important;
  padding: .55rem 0 !important;
  font-size: 1.1rem;
  box-shadow: none !important;
}
.modal-content .form-control:focus {
  border-bottom: 3px solid #fff !important;
  padding-bottom: calc(.55rem - 1.5px) !important;
  box-shadow: none !important;
}
.modal-content .form-control::placeholder { color: rgba(255, 255, 255, .6); }
.modal-content .form-control:-webkit-autofill {
  -webkit-text-fill-color: #fff;
  -webkit-box-shadow: 0 0 0 1000px var(--oa-accent) inset;
  transition: background-color 9999s;
}

/* Checkbox */
.modal-content .form-check-input {
  background-color: transparent;
  border: 1.5px solid #fff !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
.modal-content .form-check-input:checked {
  background-color: var(--oa-ink) !important;
  border-color: #fff !important;
}

/* Links (Forgot password, Register here) */
.modal-content a {
  color: #fff !important;
  text-decoration: underline !important;
  text-decoration-color: rgba(255, 255, 255, .5) !important;
  text-underline-offset: 4px;
}
.modal-content a:hover,
.modal-content a:focus { text-decoration-color: #fff !important; text-decoration-thickness: 2px; }

/* Login button: solid white, red text; hover turns it into a white outline */
.modal-content .btn,
.modal-content .btn-primary,
.modal-content button[type="submit"] {
  background: #fff !important;
  color: var(--oa-accent) !important;
  border: 1.5px solid #fff !important;
  border-radius: 0 !important;
  font-size: .95rem !important;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  padding: .8rem 2.25rem !important;
  min-width: 12rem;
}
.modal-content .btn:hover,
.modal-content .btn:focus,
.modal-content .btn-primary:hover,
.modal-content .btn-primary:focus,
.modal-content button[type="submit"]:hover {
  background: transparent !important;
  color: #fff !important;
  border-color: #fff !important;
}
.modal-content .btn:focus-visible { outline: 1px solid #fff !important; outline-offset: 4px; }

.modal-content .form-group-buttons { margin-top: 1.75rem; margin-bottom: 1.25rem; }
.modal-content .form-group-register {
  border-top: 1px solid rgba(255, 255, 255, .5);
  padding-top: 1.25rem;
  font-size: .95rem;
}

/* ---------- 10. Archive & issue page ---------------------------------- */
.issue-summary img,
.issue-summary-cover img {
  transition: transform .2s ease, box-shadow .2s ease;
}
.issue-summary:hover img,
.issue-summary-cover:hover img {
  transform: translateY(-3px);
  box-shadow: 0 12px 26px rgba(46, 45, 44, .15);
}
.issue-summary-series,
.issue-summary-title { color: var(--oa-ink); font-weight: 600; }
.issue-summary a:hover .issue-summary-series,
.issue-summary a:hover .issue-summary-title { color: var(--oa-accent); }

.pagination .page-link { color: var(--oa-accent); border-radius: var(--oa-radius); }
.pagination .page-item.active .page-link {
  background: var(--oa-accent);
  border-color: var(--oa-accent);
  color: #fff;
}

/* ---------- 11. Static pages (About, Submissions, Masthead) ----------- */
.page-content h2 {
  font-size: 1.2rem;
  border-top: 1px solid var(--oa-ink);
  padding-top: .8rem;
  margin-top: 2.25rem;
}

blockquote {
  border-left: 3px solid var(--oa-accent);
  margin-left: 0;
  padding-left: 1.25rem;
  font-family: var(--oa-serif);
  font-style: italic;
}

hr { border: 0; border-top: 1px solid var(--oa-rule); opacity: 1; }

/* ---------- 12. Footer ------------------------------------------------- */
/* Upper part (Information + Make a Submission): charcoal band.
   Lower part (OA Home / ISSN / Tavistock logo / OJS logo): white, charcoal text. */

.site-footer {
  background: var(--oa-paper) !important;
  color: var(--oa-ink);
  border-top: 4px solid var(--oa-accent);
  margin-top: 3rem;
}

/* -- Upper part: charcoal, full width -- */
.site-footer-sidebar {
  position: relative;
  background: var(--oa-ink);
  color: #E9E7E5;
  box-shadow: 0 0 0 100vmax var(--oa-ink);   /* extends the band edge to edge */
  clip-path: inset(0 -100vmax);
  padding-top: 2.75rem;
  padding-bottom: 2.75rem;
}

.site-footer-sidebar > .row {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  row-gap: 2rem;
}
.site-footer-sidebar .pkp_block { flex: 1 1 0; min-width: 14rem; }

.site-footer-sidebar .pkp_block .title,
.site-footer-sidebar .pkp_block h2,
.site-footer-sidebar .pkp_block h3 {
  font-size: .78rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .14em;
  color: #fff !important;
  margin-bottom: 1rem;
}
.site-footer-sidebar .pkp_block .title:before,
.site-footer-sidebar .pkp_block h2:before {
  content: "";
  display: block;
  width: 32px;
  height: 3px;
  background: var(--oa-accent);
  margin-bottom: .75rem;
}

.site-footer-sidebar .pkp_block ul { list-style: none; padding: 0; margin: 0; }
.site-footer-sidebar .pkp_block li { padding: .25rem 0; }

.site-footer-sidebar a {
  color: #fff !important;
  text-decoration: underline;
  text-decoration-color: rgba(255, 255, 255, .3);
  text-underline-offset: 4px;
}
.site-footer-sidebar a:hover { text-decoration-color: var(--oa-accent); }

/* "Make a Submission": in the right-hand column, aligned right */
.site-footer-sidebar .block_make_submission {
  flex: 0 0 auto !important;
  min-width: 0;
  margin-left: auto !important;
  text-align: right;
}
.site-footer-sidebar .block_make_submission .title:before,
.site-footer-sidebar .block_make_submission h2:before { margin-left: auto; }
.site-footer-sidebar .block_make_submission a {
  display: inline-block;
  text-decoration: none !important;
  color: #fff !important;
  background: var(--oa-accent) !important;
  border: 1.5px solid var(--oa-accent) !important;
  padding: .75rem 1.6rem !important;
}
.site-footer-sidebar .block_make_submission a:hover {
  background: #fff !important;
  border-color: #fff !important;
  color: var(--oa-accent) !important;
}

/* -- Lower part: white, neat charcoal text, logos in their own colours -- */
.site-footer > .site-footer-content {
  background: var(--oa-paper);
  color: var(--oa-ink);
  padding-top: 2.25rem;
  padding-bottom: 2.25rem;
  font-size: .9rem;
  line-height: 1.7;
}
.site-footer-content,
.site-footer-content p,
.site-footer-content strong { color: var(--oa-ink) !important; }
.site-footer-content p { margin-bottom: .5rem; }
.site-footer-content strong { font-weight: 600; letter-spacing: .02em; }

.site-footer-content a {
  color: var(--oa-ink) !important;
  text-decoration: none;
  border-bottom: 1px solid var(--oa-rule);
  padding-bottom: 1px;
  transition: color .15s ease, border-color .15s ease;
}
.site-footer-content a:hover {
  color: var(--oa-accent) !important;
  border-bottom-color: var(--oa-accent);
  text-decoration: none;
}
.site-footer-content a:has(img) { border-bottom: 0; }

/* Tavistock logo: original colours */
.site-footer-content img:not(.footer-brand-image) {
  max-height: none !important;
  height: auto !important;
  width: auto;
  max-width: 100%;
  margin-top: .75rem;
  filter: none !important;
  opacity: 1 !important;
}

/* OJS/PKP logo: the theme ships it white, so tint it grey for the white footer */
.footer-brand-image {
  max-width: 110px;
  filter: brightness(0);
  opacity: .45;
  transition: opacity .15s ease;
}
.site-footer-content a:hover .footer-brand-image { opacity: .8; }

@media (max-width: 767px) {
  .site-footer-sidebar .block_make_submission { margin-left: 0 !important; text-align: left; }
  .site-footer-sidebar .block_make_submission .title:before,
  .site-footer-sidebar .block_make_submission h2:before { margin-left: 0; }
}

/* ---------- 13. Small screens ----------------------------------------- */
@media (max-width: 991px) {
  .main-header .navbar-brand img { max-height: 60px; }
  .page-header h1, .article-details-fulltitle, .homepage-issue-identifier { font-size: 1.75rem !important; }
  .article-details-sidebar { border-left: 0; padding-left: 0; }
  .homepage-issue-description-wrapper { padding: 1.25rem; }
}

/* ==========================================================================
   14. EDITORIAL LAYER: flat, catalogue-like (inspired by OnCurating)
   Removes the theme's outlined/3D text effects and the dark-red band, and
   sets the homepage like a printed exhibition catalogue: big cover, big
   plain title, numbered sections, no shadows anywhere.
   ========================================================================== */

/* Kill every shadow / outline effect the theme puts on text and boxes */
.container-homepage-issue,
.container-homepage-issue *,
.homepage-image,
.homepage-image *,
.page-header,
.page-header * {
  text-shadow: none !important;
  -webkit-text-stroke: 0 !important;
  -webkit-text-fill-color: currentColor !important;
}
.homepage-issue-cover,
.article-details-cover img,
.issue-summary img,
.issue-summary-cover img,
.homepage-issue-description-wrapper,
.container-homepage-issue {
  box-shadow: none !important;
}

/* No coloured band: page and homepage-image area are plain white */
body,
.homepage-image,
.homepage-image-behind-issue {
  background: var(--oa-paper) !important;
  background-color: var(--oa-paper) !important;
}
.homepage-image:before,
.homepage-image:after { display: none !important; }

/* Homepage image (if set) becomes a flat full-width banner */
.homepage-image { max-height: 420px; overflow: hidden; }
.homepage-image img { width: 100%; height: 420px; object-fit: cover; }

/* Issue block sits in normal flow below the header/banner, not floating */
.container-homepage-issue {
  position: relative;
  top: auto !important;
  margin-top: 0 !important;
  background: var(--oa-paper) !important;
  border: 0 !important;
  padding-top: 3.5rem;
}

/* Small label: plain red text with a short red bar above */
.homepage-issue-current {
  display: block !important;
  width: auto;
  border: 0 !important;
  padding: 0 !important;
  margin: 0 0 1.25rem 0 !important;
  font-size: .78rem !important;
  font-weight: 600 !important;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--oa-accent) !important;
  text-align: left !important;
}
.homepage-issue-current:before {
  content: "";
  display: block;
  width: 48px;
  height: 3px;
  background: var(--oa-accent);
  margin-bottom: .8rem;
}

/* Volume / number: very large, solid charcoal, left-aligned */
.homepage-issue-identifier {
  color: var(--oa-ink) !important;
  font-size: clamp(2.5rem, 5vw, 4.25rem) !important;
  font-weight: 700 !important;
  line-height: 1.02;
  letter-spacing: -0.035em;
  text-align: left !important;
  margin: 0 0 .75rem 0;
}

.homepage-issue-published {
  color: var(--oa-ink-soft) !important;
  font-size: .9rem !important;
  font-weight: 400 !important;
  text-transform: none !important;
  text-align: left !important;
  padding-bottom: 2rem;
  border-bottom: 1px solid var(--oa-ink);
  margin-bottom: 2.5rem;
}

/* Cover + description side by side, flat */
.homepage-issue-header {
  justify-content: flex-start !important;
  align-items: flex-start;
  margin-top: 0;
}
.homepage-issue-cover { width: 100%; border: 1px solid var(--oa-rule); }

.homepage-issue-description-wrapper {
  background: transparent !important;
  border: 0 !important;
  padding: 0 0 0 1rem !important;
}
.homepage-issue-description .h2 {
  font-size: 1.6rem !important;
  font-weight: 700;
  letter-spacing: -0.02em;
  margin-bottom: 1.25rem;
}
.homepage-issue-description { font-size: 1.02rem; line-height: 1.7; max-width: 44rem; }

/* Numbered sections in the table of contents: 01 Editorial, 02 Articles ... */
.issue-toc { counter-reset: oa-section; }
.issue-toc-section-title { counter-increment: oa-section; }
.issue-toc-section-title:before {
  content: counter(oa-section, decimal-leading-zero);
  color: var(--oa-accent);
  margin-right: .9rem;
  font-variant-numeric: tabular-nums;
}

/* Article titles a touch larger, catalogue-style */
.article-summary-title { font-size: 1.3rem; letter-spacing: -0.015em; }

/* Galley links in lists: understated text with an arrow instead of boxes */
.article-summary-galleys .btn {
  border: 0 !important;
  padding: 0 !important;
  background: none !important;
  color: var(--oa-accent) !important;
  font-size: .8rem;
  letter-spacing: .08em;
  margin-right: 1.25rem;
}
.article-summary-galleys .btn:after { content: " \2192"; }
.article-summary-galleys .btn:hover {
  background: none !important;
  color: var(--oa-accent-dark) !important;
  text-decoration: underline;
}

/* Archive: flat cover grid, red frame on hover instead of a lift */
.issue-summary img,
.issue-summary-cover img { border: 1px solid var(--oa-rule); transform: none !important; }
.issue-summary:hover img,
.issue-summary-cover:hover img { outline: 3px solid var(--oa-accent); outline-offset: -3px; }
.issue-summary-series,
.issue-summary-title { font-size: .9rem; font-weight: 500; margin-top: .5rem; }

/* Article page cover: flat */
.article-details-cover img { border: 1px solid var(--oa-rule); }

@media (max-width: 991px) {
  .homepage-image img { height: 240px; }
  .homepage-issue-description-wrapper { padding: 1.5rem 0 0 0 !important; }
}

/* ==========================================================================
   15. CURRENT ISSUE, LARGER (homepage + issue page)
   Bigger cover, bigger issue title, more of the description visible,
   and a clear gap before the first section of the contents.
   ========================================================================== */

/* -- Homepage -- */
@media (min-width: 992px) {
  .homepage-issue-header { margin-bottom: 0 !important; }
  .homepage-issue-header > .col-lg-3 { flex: 0 0 34%; max-width: 34%; }
  .homepage-issue-header > .col-lg-9 { flex: 0 0 66%; max-width: 66%; }
  .homepage-issue-description-wrapper { padding: 0 0 0 2.5rem !important; }
}
.homepage-issue-cover {
  display: block;
  width: 100%;
  max-width: 100% !important;
  max-height: none !important;
  height: auto;
  margin: 0 0 1.5rem 0 !important;
}
.homepage-issue-identifier { font-size: clamp(2.75rem, 6vw, 5rem) !important; }
.homepage-issue-description .h2 { font-size: clamp(1.6rem, 2.4vw, 2.1rem) !important; line-height: 1.15; }
.homepage-issue-description { font-size: 1.08rem; }
@media (min-width: 992px) {
  .homepage-issue-description { max-height: 26em !important; }   /* theme cuts at 15em */
}
/* The theme fades the cut-off text into white: keep that fade on the page colour */
.homepage-issue-description:after {
  background-image: linear-gradient(rgba(255, 255, 255, 0), var(--oa-paper) 70%) !important;
}

/* Gap between the issue block and "01 Editorial" */
.container-homepage-issue .issue-wrapper,
.container-homepage-issue .issue-toc { margin-top: 0; }
.container-homepage-issue .issue-wrapper {
  margin-top: 4.5rem !important;
  padding-top: 0;
}

/* -- Issue page (Current / any issue from the archive) -- */
.page-issue-header h1 {
  font-size: clamp(2.75rem, 6vw, 5rem) !important;
  font-weight: 700;
  line-height: 1.02;
  letter-spacing: -0.035em;
  text-align: left;
  color: var(--oa-ink);
  margin: 0 0 .75rem 0;
}
.page-issue-header h1::before {
  content: "";
  display: block;
  width: 48px;
  height: 3px;
  background: var(--oa-accent);
  margin-bottom: 1.25rem;
}
.page-issue-date,
.page-issue-doi {
  color: var(--oa-ink-soft) !important;
  font-size: .9rem !important;
  text-align: left;
  margin-top: 0 !important;
}
.page-issue-header {
  border-bottom: 1px solid var(--oa-ink);
  padding-bottom: 2rem;
  margin-bottom: 2.5rem;
}

.page-issue-details {
  margin-top: 0 !important;
  justify-content: flex-start !important;
  align-items: flex-start;
}
@media (min-width: 992px) {
  .page-issue-details > .col-lg-9 { flex: 0 0 66%; max-width: 66%; }
  .page-issue-details > .col-lg-3 { flex: 0 0 34%; max-width: 34%; }
}
.page-issue-description-wrapper {
  background: transparent !important;
  padding: 0 2.5rem 0 0 !important;
}
.page-issue-description { font-size: 1.08rem; line-height: 1.7; }
.page-issue-description .h2 {
  text-align: left !important;
  font-size: clamp(1.6rem, 2.4vw, 2.1rem) !important;
  line-height: 1.15;
  margin-bottom: 1.25rem;
}
.page-issue-cover {
  width: 100%;
  max-width: 100% !important;
  max-height: none !important;
  margin: 0 !important;
  box-shadow: none !important;
  border: 1px solid var(--oa-rule);
}

/* Gap between the issue block and the first section of the contents */
.page-issue-details + .row { margin-top: 4.5rem !important; }

@media (max-width: 991px) {
  .homepage-issue-description-wrapper,
  .page-issue-description-wrapper { padding: 1.5rem 0 0 0 !important; }
  .page-issue-details > .col-lg-3 { order: -1; }   /* cover first on phones */
  .homepage-issue-cover, .page-issue-cover { max-width: 360px !important; }
  .container-homepage-issue .issue-wrapper,
  .page-issue-details + .row { margin-top: 3rem !important; }
}

/* ==========================================================================
   16. SPACING FIXES
   ========================================================================== */

/* "View All Issues": breathing room after the last section line */
.container-homepage-issue > .text-center {
  margin-top: 3.5rem;
  margin-bottom: 1.5rem;
}

/* "More" under the issue description: the text fades out fully first,
   and "More →" sits on a clean strip below it, styled like the PDF links */
.homepage-issue-description {
  position: relative;
  padding-bottom: 3.5rem !important;
}
.homepage-issue-description:after {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 100% !important;
  height: 10rem !important;
  background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, var(--oa-paper) 55%) !important;
  pointer-events: none;
}
.homepage-issue-description-more {
  position: absolute !important;
  z-index: 2;
  left: 0;
  bottom: .75rem !important;
  width: auto !important;
  margin: 0 !important;
}
.homepage-issue-description-more a,
.homepage-journal-description-more,
.homepage-journal-description-less {
  position: relative;
  display: inline-block;
  margin: 0 !important;
  padding: .25rem 0 .55rem !important;
  border: 0 !important;
  font-size: .85rem !important;
  font-weight: 600 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
  color: var(--oa-accent) !important;
  text-decoration: none !important;
}
.homepage-issue-description-more a::after,
.homepage-journal-description-more::after { content: " \2192"; }
.homepage-issue-description-more a::before,
.homepage-journal-description-more::before,
.homepage-journal-description-less::before {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 3px;
  background: var(--oa-accent);
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform .25s ease;
}
.homepage-issue-description-more a:hover::before,
.homepage-issue-description-more a:focus::before,
.homepage-journal-description-more:hover::before,
.homepage-journal-description-less:hover::before { transform: scaleX(1); }