/* ---------------------------------------------------------------------------
 * DISIE — main theme stylesheet (Visual Identity v3 Saffron)
 *
 * Loads after the OJS default theme. Layers DISIE-specific styling:
 *   - typography refinements (Source Serif 4 body / Inter UI / JetBrains Mono)
 *   - Saffron + Bistre accent system
 *   - card surfaces (author guidelines, submission checklist, privacy, sections)
 *   - wordmark with the empty-bracket mark applied to the OJS site name
 *   - print + a11y media queries
 *
 * Tokens are defined in _tokens.css.
 * --------------------------------------------------------------------------- */

/* --- Page ground -------------------------------------------------------- */

html {
    background: var(--disie-bg);
    color: var(--disie-ink-2);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    height: 100%;
}

/* --- Sticky footer scaffold ---------------------------------------------
   On short pages (e.g. /about/contact) the OJS default footer floats up
   under the content. Use a flex column on the .pkp_structure_page so the
   content area grows and pushes the footer to the viewport bottom. */
body {
    min-height: 100%;
    display: flex;
    flex-direction: column;
    margin: 0;
}
.pkp_structure_page {
    display: flex;
    flex-direction: column;
    flex: 1 0 auto;
    min-height: 100vh;
}
.pkp_structure_content {
    flex: 1 0 auto;
}
.pkp_structure_footer_wrapper {
    flex-shrink: 0;
}

body,
.pkp_structure_main {
    font-family: var(--disie-font-body);
    font-size: var(--disie-font-size-base);
    line-height: var(--disie-line-height-body);
    color: var(--disie-ink-2);
    background: var(--disie-bg);
    font-feature-settings: "kern", "liga", "onum";
}

::selection {
    background: var(--disie-bistre);
    color: var(--disie-bg);
}

/* --- Typography hierarchy ---------------------------------------------- */

/* Serif for h1–h3 (display, body authority); sans for h4–h6 (UI). */
h1, .pkp_page_title,
h2,
h3 {
    font-family: var(--disie-font-body);
    font-weight: 600;
    color: var(--disie-ink-1);
    line-height: 1.15;
    letter-spacing: -0.01em;
}
h1, .pkp_page_title { font-size: 2.4rem; line-height: 1.08; letter-spacing: -0.015em; }
h2                  { font-size: 1.85rem; line-height: 1.15; }
h3                  { font-size: 1.4rem;  line-height: 1.25; letter-spacing: -0.005em; }

h4, h5, h6 {
    font-family: var(--disie-font-ui);
    font-weight: 600;
    color: var(--disie-ink-1);
    line-height: 1.4;
}
h4 { font-size: 1.05rem; letter-spacing: -0.005em; }
h5 { font-size: 0.92rem; }
h6 {
    font-size: 0.78rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--disie-ink-3);
}

/* UI / chrome — sans, not serif. Targets nav, sidebars, breadcrumbs,
   form controls, admin chrome — anything that should NOT pick up the
   body serif. */
.pkp_site_nav_menu,
.pkp_navigation_user,
.cmp_breadcrumbs,
.pkp_block,
button,
.btn,
input,
select,
textarea,
.pkp_structure_head,
.pkp_structure_footer,
.cmp_pagination {
    font-family: var(--disie-font-ui);
}

/* Mono for inline code, DOIs, identifiers */
code, kbd, samp,
.doi, .doi_value, .pkp_doi {
    font-family: var(--disie-font-mono);
    font-feature-settings: "kern" off;
}

/* Anchors: Bistre with a subtle thin underline that lifts on focus.
   Body links underline immediately; navigation chrome stays clean. */
a {
    color: var(--disie-bistre);
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}
a:hover { color: var(--disie-bistre-deep); }
a:focus-visible {
    outline: 2px solid var(--disie-saffron);
    outline-offset: 2px;
}
.pkp_site_nav_menu a,
.pkp_navigation_user a,
.cmp_breadcrumbs a {
    text-decoration: none;
}
.pkp_site_nav_menu a:hover,
.pkp_navigation_user a:hover,
.cmp_breadcrumbs a:hover {
    text-decoration: underline;
}

/* Body prose — keep measure under control even on wide viewports. */
.page_about .pkp_structure_main p,
.page_submissions .pkp_structure_main p,
.obj_article_summary p,
.page_article p {
    max-width: var(--disie-content-max);
}

p {
    margin: 0 0 1em;
}

/* Homepage "About" block — give it some breathing space, paper-typed text */
.homepage_about {
    padding-top: var(--disie-space-xl);
    padding-bottom: var(--disie-space-xl);
    max-width: var(--disie-content-max);
}
.homepage_about h2 {
    margin-top: 0;
    margin-bottom: var(--disie-space-md);
}

/* Sidebar blocks (subscription, info, language toggle, etc.) — when they
   come back via Custom Block Manager, sane defaults so they read as
   secondary chrome, not primary content. */
.pkp_block .title {
    font-family: var(--disie-font-ui);
    color: var(--disie-ink-3);
    font-size: 0.78rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}
.pkp_block .content {
    font-size: 0.95rem;
}

/* --- Header (override OJS default deep-blue band) ----------------------- */
/* The OJS default theme paints both .pkp_structure_head (#1E6292) AND
   .pkp_site_nav_menu (also #1E6292) with white text. We repaint both to
   the v3 Saffron / warm-paper system. */
.pkp_structure_head {
    background: var(--disie-surface) !important;
    border-bottom: 1px solid var(--disie-border) !important;
}
.pkp_site_nav_menu {
    background: var(--disie-surface) !important;
    border-top: 1px solid var(--disie-border);
    padding: 0.4rem 0.714rem !important;
}
.pkp_site_nav_menu a,
.pkp_site_nav_menu a:focus {
    color: var(--disie-ink-2) !important;
}
.pkp_head_wrapper {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}

/* Site-name container: undo the absolute-positioned dark-bg styling */
.pkp_site_name_wrapper {
    height: auto !important;
}
.pkp_site_name {
    position: static !important;
    left: auto !important;
    right: auto !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: visible !important;
    text-overflow: clip !important;
    white-space: nowrap;
    color: var(--disie-ink-1) !important;
    line-height: 1;
}

/* Wordmark = real SVG. Fluid width so the header doesn't break on narrow
   viewports; logo aspect 420×110, height fixed, width auto from contain. */
.pkp_site_name .is_text,
.pkp_site_name a {
    display: inline-block;
    height: 56px;
    width: 220px;
    max-width: 60vw;
    background-image: url("../img/logos/disie-logo-primary.svg");
    background-repeat: no-repeat;
    background-position: left center;
    background-size: contain;
    text-indent: -9999px;
    overflow: hidden;
    color: transparent;
    line-height: 0;
}

/* Primary navigation menu — links in ink, hover marks the bottom rule
   in saffron (NOT the link colour itself, since saffron fails contrast). */
.pkp_navigation_primary {
    text-align: left;
}
.pkp_navigation_primary > li > a {
    color: var(--disie-ink-2) !important;
    border-bottom-color: transparent !important;
    font-family: var(--disie-font-ui);
    font-weight: 500;
    font-size: 0.95rem;
    letter-spacing: 0.01em;
}
.pkp_navigation_primary > li > a:hover,
.pkp_navigation_primary > li > a:focus,
.pkp_navigation_primary > li > a:focus-visible {
    color: var(--disie-ink-1) !important;
    background: transparent !important;
    border-bottom-color: var(--disie-saffron) !important;
    outline: none;
}

/* When a parent has its dropdown open, drop the saffron underline so we
   don't get a double-line look (saffron underline + dropdown card top
   border). The dropdown card itself becomes the active visual. */
.pkp_navigation_primary > li:hover > a,
.pkp_navigation_primary > li:focus-within > a {
    border-bottom-color: transparent !important;
    color: var(--disie-ink-1) !important;
}

/* Sub-menu (dropdown) on light surface */
.pkp_navigation_primary li ul {
    background: var(--disie-surface) !important;
    border: 1px solid var(--disie-border) !important;
    box-shadow: var(--disie-shadow-2);
}
.pkp_navigation_primary li ul a {
    color: var(--disie-ink-2) !important;
    font-family: var(--disie-font-ui) !important;
    font-size: 0.92rem !important;          /* sub-menu reads as quieter chrome than primary nav */
    font-weight: 500 !important;
    line-height: 1.35 !important;
    letter-spacing: 0.005em !important;
    text-align: left !important;            /* OJS default sets sub-list right; left reads better */
    padding: 0.55rem 0.95rem !important;
    margin: 0 !important;
    border-bottom: none !important;         /* OJS may inherit the 2px transparent border from primary */
    white-space: nowrap;
}
.pkp_navigation_primary li ul a:hover {
    background: var(--disie-surface-2) !important;
    color: var(--disie-ink-1) !important;
}
.pkp_navigation_primary li ul a:focus,
.pkp_navigation_primary li ul a:focus-visible {
    outline: 2px solid var(--disie-saffron) !important;
    outline-offset: -2px;
    background: var(--disie-surface-2) !important;
    color: var(--disie-ink-1) !important;
}
.pkp_navigation_primary li ul {
    text-align: left !important;      /* override OJS default text-align:right */
}

/* User nav (Register / Login / Profile menu) */
.pkp_navigation_user {
    border-top-color: var(--disie-border) !important;
}
.pkp_navigation_user > li > a {
    color: var(--disie-ink-2) !important;
    font-family: var(--disie-font-ui);
}
.pkp_navigation_user > li > a:hover {
    color: var(--disie-bistre) !important;
}

/* Search link in the header. OJS default paints
   .pkp_navigation_search_wrapper a in #fff with a hover-rule in #fff and
   a focus state that flips to white-on-blue. We repaint to ink + the
   saffron hover-mark, AND match the typography of the primary nav so
   "Suchen" doesn't read as serif-body type next to the Inter nav items. */
.pkp_navigation_search_wrapper a,
.pkp_search {
    font-family: var(--disie-font-ui) !important;
    font-size: 0.95rem !important;
    font-weight: 500 !important;
    letter-spacing: 0.01em !important;
    color: var(--disie-ink-2) !important;
    background: transparent !important;
    border-bottom: 2px solid transparent !important;
    text-decoration: none !important;
}
.pkp_navigation_search_wrapper a:hover,
.pkp_navigation_search_wrapper a:focus-visible,
.pkp_search:hover,
.pkp_search:focus-visible {
    color: var(--disie-ink-1) !important;
    background: transparent !important;
    border-bottom-color: var(--disie-saffron) !important;
    outline: none;
}
/* Magnifier icon should sit on the typographic baseline with the text */
.pkp_search .fa,
.pkp_search .fa-search {
    font-size: 0.95em;
    margin-right: 0.35em;
    vertical-align: -1px;
}

/* Mobile-menu toggle button */
.pkp_site_nav_toggle {
    color: var(--disie-ink-1) !important;
}

/* Dark-mode logo swap (browsers that report prefers-color-scheme: dark) */
@media (prefers-color-scheme: dark) {
    .pkp_site_name .is_text,
    .pkp_site_name a {
        background-image: url("../img/logos/disie-logo-reverse.svg");
    }
}

/* Print: monochrome wordmark + neutral header */
@media print {
    .pkp_site_name .is_text,
    .pkp_site_name a {
        background-image: url("../img/logos/disie-logo-mono.svg");
    }
    .pkp_structure_head {
        background: #fff !important;
        border-bottom-color: #999 !important;
    }
}

/* Forced colours: fall back to plain text wordmark */
@media (forced-colors: active) {
    .pkp_site_name .is_text,
    .pkp_site_name a {
        background-image: none;
        text-indent: 0;
        width: auto;
        height: auto;
        font-family: var(--disie-font-body);
        font-weight: 600;
        color: CanvasText;
        line-height: 1.1;
    }
}

/* --- Card surfaces ------------------------------------------------------ */
/* Used both by the inline blocks on /about/submissions (author guidelines,
   submission checklist, privacy statement, section policies) AND by the
   page-level wrappers on simple narrative pages (about, contact, privacy,
   masthead, about-this-publishing-system). List pages — homepage,
   announcements, issue archive, search results — stay open. */

.author_guidelines,
.submission_checklist,
.privacy_statement,
.section_policy,
.page_about,
.page_contact,
.page_privacy,
.page_masthead,
.page_about_publishing_system {
    background: var(--disie-surface);
    border: 1px solid var(--disie-border);
    border-radius: var(--disie-radius);
    padding: var(--disie-space-lg) calc(var(--disie-space-lg) + 0.25rem);
    margin: var(--disie-space-lg) 0;
    box-shadow: var(--disie-shadow-1);
}

/* Page-level cards get a touch more breathing room than the inline blocks
   inside /about/submissions (which sit nested already). */
.page_about,
.page_contact,
.page_privacy,
.page_masthead,
.page_about_publishing_system {
    padding: var(--disie-space-xl) calc(var(--disie-space-xl) + 0.25rem);
    margin: var(--disie-space-md) 0 var(--disie-space-2xl);
}

/* Page-card breadcrumbs sit at the top of the card; demote them visually
   so the h1 stays the focus. */
.page_about > .cmp_breadcrumbs,
.page_contact > .cmp_breadcrumbs,
.page_privacy > .cmp_breadcrumbs,
.page_masthead > .cmp_breadcrumbs,
.page_about_publishing_system > .cmp_breadcrumbs {
    margin-top: 0;
    margin-bottom: var(--disie-space-md);
    font-size: 0.85rem;
    color: var(--disie-ink-3);
}

/* The page h1 acts as the card title — saffron-ochre accent rule below,
   matching the .section_policy h2 treatment so the visual language is
   consistent across all card-shaped pages. */
.page_about > h1,
.page_contact > h1,
.page_privacy > h1,
.page_masthead > h1,
.page_about_publishing_system > h1 {
    margin-top: 0;
    margin-bottom: var(--disie-space-md);
    padding-bottom: 0.45em;
    position: relative;
    border-bottom: none;
}
.page_about > h1::after,
.page_contact > h1::after,
.page_privacy > h1::after,
.page_masthead > h1::after,
.page_about_publishing_system > h1::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 56px;
    height: 3px;
    background: var(--disie-ochre);
    border-radius: 1px;
}

.author_guidelines + .submission_checklist,
.submission_checklist + .privacy_statement,
.section_policy + .section_policy {
    margin-top: var(--disie-space-lg);
}

/* Card title gets a saffron-deep undertone via Ochre — the secondary
   accent. Distinct from the bistre body links so the card heading reads
   as structural, not as a link. */
.author_guidelines > h2,
.submission_checklist > h2,
.privacy_statement > h2,
.section_policy h2 {
    margin-top: 0;
    margin-bottom: 0.85em;
    padding-bottom: 0.5em;
    position: relative;
    font-family: var(--disie-font-body);
    font-size: 1.6rem;
    line-height: 1.2;
    color: var(--disie-ink-1);
    border-bottom: none;
}
.author_guidelines > h2::after,
.submission_checklist > h2::after,
.privacy_statement > h2::after,
.section_policy h2::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 56px;
    height: 3px;
    background: var(--disie-ochre);
    border-radius: 1px;
}

/* Sub-section dividers inside the longer cards */
.author_guidelines h3,
.submission_checklist h3,
.privacy_statement h3 {
    margin-top: 1.6em;
    padding-top: 1em;
    border-top: 1px solid var(--disie-border);
    font-family: var(--disie-font-body);
    font-size: 1.18rem;
    line-height: 1.3;
    color: var(--disie-ink-1);
}
.author_guidelines > h3:first-of-type,
.submission_checklist > h3:first-of-type,
.privacy_statement > h3:first-of-type {
    margin-top: 0.4em;
    padding-top: 0;
    border-top: none;
}

/* List markers in the card lists — arrows in bistre mono, not bullets,
   matches the v3 design's policy-card req-list style.
   Implementation note: classical padding-left + ::before absolute rather
   than display:grid. Grid with `1fr` second-column inside a card with
   padding interacts badly with min-content sizing and collapses the
   text column to ~one word per line. The padding+absolute pattern is
   bulletproof and renders identically on every browser. */
.author_guidelines ul,
.submission_checklist ul,
.section_policy ul {
    list-style: none;
    padding-left: 0;
    margin: 0.7em 0;
}
.author_guidelines ul li,
.submission_checklist ul li,
.section_policy ul li {
    position: relative;
    padding-left: 1.6em;
    margin: 0.45em 0;
    line-height: var(--disie-line-height-body);
}
.author_guidelines ul li::before,
.submission_checklist ul li::before,
.section_policy ul li::before {
    content: "→";
    color: var(--disie-bistre);
    font-family: var(--disie-font-mono);
    font-size: 0.85em;
    position: absolute;
    left: 0;
    top: 0;
    line-height: inherit;
}

/* Body type rhythm + emphasis */
.author_guidelines p,
.submission_checklist p,
.privacy_statement p,
.section_policy p {
    margin: 0.6em 0;
    line-height: var(--disie-line-height-body);
}
.author_guidelines strong,
.submission_checklist strong,
.privacy_statement strong,
.section_policy strong {
    color: var(--disie-ink-1);
    font-weight: 600;
}

/* Heading-to-content nudge */
.author_guidelines h2 + p,
.author_guidelines h2 + div,
.author_guidelines h3 + p,
.author_guidelines h3 + ul,
.submission_checklist h2 + p,
.submission_checklist h3 + p,
.submission_checklist h3 + ul,
.privacy_statement h2 + p,
.privacy_statement h3 + p,
.section_policy h2 + p,
.section_policy h2 + div {
    margin-top: 0;
}

/* --- Buttons (Saffron primary, ghost secondary) ------------------------- */

.pkp_button,
.pkp_form .submit,
button.submit,
.btn,
input[type="submit"] {
    font-family: var(--disie-font-ui);
    font-weight: 600;
    font-size: 0.9rem;
    padding: 0.7em 1.1em;
    border-radius: var(--disie-radius-sm);
    border: 1px solid var(--disie-saffron);
    background: var(--disie-saffron);
    color: var(--disie-saffron-ink);
    cursor: pointer;
    letter-spacing: 0.01em;
    transition: background-color 0.15s ease, border-color 0.15s ease;
}
.pkp_button:hover,
.pkp_form .submit:hover,
button.submit:hover,
.btn:hover,
input[type="submit"]:hover {
    background: var(--disie-saffron-deep);
    border-color: var(--disie-saffron-deep);
}

/* Ghost / secondary button (cancel, back, etc.) */
.pkp_button_link,
button.cancel,
.btn-ghost,
input[type="reset"] {
    background: transparent;
    color: var(--disie-ink-1);
    border-color: var(--disie-border-strong);
}
.pkp_button_link:hover,
button.cancel:hover,
.btn-ghost:hover,
input[type="reset"]:hover {
    background: transparent;
    color: var(--disie-bistre);
    border-color: var(--disie-ink-1);
}

/* --- Notification block (.cmp_notification) --------------------------- */
/* OJS defaults this to bg #ddd + a 0.357rem #006798 blue left stripe.
   We repaint to a saffron-soft surface with a saffron-deep left rule and
   style the inline submission-action links as proper buttons. The "oder"
   conjunction wrapped inline by the locale string sits between them. */
.cmp_notification {
    background: var(--disie-bistre-soft) !important;
    border-left: 4px solid var(--disie-saffron-deep) !important;
    border-radius: 0 var(--disie-radius) var(--disie-radius) 0;
    padding: 1.25rem 1.5rem !important;
    margin: 1.5rem 0 2rem !important;
    color: var(--disie-ink-1);
    font-family: var(--disie-font-ui);
    font-size: 1rem;
    line-height: 1.7;
}

/* Action links inside the notification (e.g. on /about/submissions for
   logged-in users: "<a>New Submission</a> or <a>View Submissions</a>"). */
.cmp_notification a {
    display: inline-flex;
    align-items: center;
    padding: 0.55em 1em;
    margin: 0.15em 0.25em;
    background: var(--disie-saffron);
    color: var(--disie-saffron-ink) !important;
    border: 1px solid var(--disie-saffron);
    border-radius: var(--disie-radius-sm);
    font-family: var(--disie-font-ui);
    font-weight: 600;
    font-size: 0.92rem;
    letter-spacing: 0.005em;
    text-decoration: none !important;
    transition: background-color 0.15s ease, border-color 0.15s ease;
}
.cmp_notification a:hover,
.cmp_notification a:focus-visible {
    background: var(--disie-saffron-deep);
    border-color: var(--disie-saffron-deep);
    color: var(--disie-saffron-ink) !important;
    outline: none;
}

/* Second action becomes the secondary ghost button to keep the visual
   hierarchy: one primary call-to-action, one supporting follow-up. */
.cmp_notification a + a {
    background: transparent;
    color: var(--disie-ink-1) !important;
    border-color: var(--disie-border-strong);
}
.cmp_notification a + a:hover,
.cmp_notification a + a:focus-visible {
    background: transparent;
    color: var(--disie-bistre) !important;
    border-color: var(--disie-ink-1);
}

/* Variants OJS uses for status notifications (success, error). Keep their
   semantic meaning but drop the loud border colours. */
.cmp_notification.success {
    border-left-color: var(--disie-forest) !important;
}
.cmp_notification.no,
.cmp_notification.error {
    border-left-color: var(--disie-crimson) !important;
}

/* --- ORCID green (third-party brand mark, retain canonical colour) ----- */
.orcid_icon { fill: #a6ce39; }

/* --- Footer ------------------------------------------------------------- */
/* OJS renders an outer .pkp_structure_footer_wrapper (full-bleed) with an
   inner .pkp_structure_footer (centred container), then a .pkp_brand_footer
   block holding the PKP-Public-Knowledge logo. The journal's own footer
   text comes from the `pageFooter` setting (seeded). */

.pkp_structure_footer_wrapper {
    background: var(--disie-surface-2);
    border-top: 1px solid var(--disie-border);
    color: var(--disie-ink-3);
    margin-top: var(--disie-space-2xl);
}

.pkp_structure_footer {
    padding-top: var(--disie-space-xl) !important;
    padding-bottom: var(--disie-space-xl) !important;
    font-family: var(--disie-font-ui);
    font-size: 0.9rem;
    line-height: 1.55;
}

/* Page-footer text content (set via journal_settings.pageFooter, seeded) */
.pkp_structure_footer p,
.pkp_structure_footer .footer_content {
    color: var(--disie-ink-2);
    margin: 0 0 0.75em;
}
.pkp_structure_footer a {
    color: var(--disie-bistre);
}
.pkp_structure_footer a:hover {
    color: var(--disie-bistre-deep);
}

/* DISIE footer column layout. The pageFooter HTML wraps four blocks in
   .disie-footer-cols; each block has a <strong> heading + a <p> or <ul>. */
.pkp_structure_footer .disie-footer-cols {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--disie-space-xl);
    align-items: start;
    margin-bottom: var(--disie-space-md);
}
.pkp_structure_footer .disie-footer-cols > div > p:first-child,
.pkp_structure_footer .disie-footer-cols > div > p:first-child > strong {
    font-family: var(--disie-font-ui);
    font-weight: 600;
    color: var(--disie-ink-1);
    font-size: 0.78rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    margin-bottom: 0.5em;
}
.pkp_structure_footer .disie-footer-cols ul.disie-footer-list {
    list-style: none;
    padding: 0;
    margin: 0;
}
.pkp_structure_footer .disie-footer-cols ul.disie-footer-list li {
    margin: 0.25em 0;
    padding: 0;
}
.pkp_structure_footer .disie-footer-cols ul.disie-footer-list li::before {
    content: none;
}
.pkp_structure_footer .disie-footer-cols ul.disie-footer-list a {
    text-decoration: none;
    color: var(--disie-ink-2);
}
.pkp_structure_footer .disie-footer-cols ul.disie-footer-list a:hover {
    color: var(--disie-bistre);
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}
.pkp_structure_footer .disie-footer-mono {
    font-family: var(--disie-font-mono);
    font-size: 0.82rem;
    color: var(--disie-ink-3);
    line-height: 1.55;
}
.pkp_structure_footer .disie-footer-mono em {
    color: var(--disie-ochre);
    font-style: italic;
}
.pkp_structure_footer .disie-footer-bottom {
    margin-top: var(--disie-space-md);
    padding-top: var(--disie-space-md);
    border-top: 1px solid var(--disie-border);
    font-size: 0.82rem;
    color: var(--disie-ink-3);
}

/* Mobile: stack columns */
@media (max-width: 720px) {
    .pkp_structure_footer .disie-footer-cols {
        grid-template-columns: 1fr;
        gap: var(--disie-space-lg);
    }
}

/* PKP brand block — small, dimmed, right-aligned by default theme. We
   keep the float behaviour but soften the visual weight. */
.pkp_brand_footer {
    padding: 0 !important;
    margin-top: var(--disie-space-md);
    border-top: 1px solid var(--disie-border);
    padding-top: var(--disie-space-md) !important;
}
.pkp_brand_footer a {
    float: right !important;
    display: block;
    max-width: 130px;
    opacity: 0.55;
    transition: opacity 0.15s ease;
}
.pkp_brand_footer a:hover {
    opacity: 0.85;
}
.pkp_brand_footer img {
    width: 100%;
    height: auto;
    display: block;
}
.pkp_brand_footer::after {
    content: "";
    display: table;
    clear: both;
}

/* --- Print stylesheet --------------------------------------------------- */

@media print {
    body {
        font-size: 11pt;
        color: #000;
        background: #fff;
    }
    .author_guidelines,
    .submission_checklist,
    .privacy_statement,
    .section_policy {
        background: none;
        box-shadow: none;
        border-color: #999;
        break-inside: avoid;
        page-break-inside: avoid;
    }
    a, a:visited {
        color: #000;
        text-decoration: underline;
    }
    .pkp_site_nav_menu,
    .pkp_navigation_user,
    .pkp_structure_footer {
        display: none;
    }
}

/* --- A11y: reduced motion + forced colours ----------------------------- */

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
    }
}

@media (forced-colors: active) {
    .author_guidelines,
    .submission_checklist,
    .privacy_statement,
    .section_policy {
        border-color: CanvasText;
    }
    .pkp_button,
    button.submit,
    .btn,
    input[type="submit"] {
        forced-color-adjust: none;
        background: ButtonFace;
        color: ButtonText;
        border: 1px solid ButtonText;
    }
}