/**
 * Sukan Theme foundation for OJS 3.5.0.5.
 *
 * This file only enhances upstream frontend markup. It must not contain
 * business content, context-specific paths or data access assumptions.
 *
 * Merged stylesheet (2026-09-17, zero-build physical concatenation):
 *   1. former styles/sukan.css  — tokens, base elements, status primitives,
 *      shared reading/archive/article enhancements, print presentation
 *   2. former styles/layout.css — fluid container and shared button
 * Each section keeps its original file header as the section banner.
 */

:root {
    --sukan-color-brand-surface: #17324d;
    --sukan-color-accent: #a8432b;
    --sukan-color-interactive: #1b5fa7;
    --sukan-color-interactive-hover: #134a85;
    --sukan-color-text: #1f2a37;
    --sukan-color-text-muted: #5a6675;
    --sukan-color-surface: #ffffff;
    --sukan-color-surface-subtle: #f4f6f8;
    --sukan-color-border: #c9d1db;
    --sukan-color-border-subtle: #e3e7ec;
    --sukan-color-success: #176b3a;
    --sukan-color-danger: #a12622;
    --sukan-color-warning: #7a4f00;
    --sukan-color-focus: #005fcc;
    --sukan-color-success-subtle: rgba(23, 107, 58, 0.12);
    --sukan-color-danger-subtle: rgba(161, 38, 34, 0.12);
    --sukan-color-warning-subtle: rgba(122, 79, 0, 0.12);
    --sukan-color-interactive-subtle: rgba(27, 95, 167, 0.1);
    --sukan-color-muted-subtle: rgba(107, 114, 128, 0.12);
    --sukan-shadow-card: 0 1px 2px rgba(23, 50, 77, 0.06);
    --sukan-shadow-card-hover: 0 0.25rem 0.875rem rgba(23, 50, 77, 0.1);

    --sukan-font-size-small: 0.875rem;
    --sukan-font-size-body: 1rem;
    --sukan-font-size-h4: clamp(1rem, 0.96rem + 0.2vw, 1.125rem);
    --sukan-font-size-h3: clamp(1.125rem, 1.04rem + 0.42vw, 1.375rem);
    --sukan-font-size-h2: clamp(1.375rem, 1.2rem + 0.7vw, 1.75rem);
    --sukan-font-size-h1: clamp(1.75rem, 1.45rem + 1.1vw, 2.25rem);
    --sukan-line-height-body: 1.65;
    --sukan-line-height-heading: 1.3;
    --sukan-line-height-control: 1.25;
    --sukan-line-height-input: 1.4;
    --sukan-line-height-small: 1.5;
    --sukan-font-weight-strong: 700;
    --sukan-reading-measure: 72ch;
    --sukan-container: 82.5rem;
    --sukan-gutter: clamp(1rem, 3vw, 2rem);

    --sukan-space-1: 0.25rem;
    --sukan-space-2: 0.5rem;
    --sukan-space-3: 0.75rem;
    --sukan-space-4: 1rem;
    --sukan-space-5: 1.5rem;
    --sukan-space-6: 2rem;
    --sukan-space-7: 3rem;

    --sukan-radius-small: 0.25rem;
    --sukan-radius-medium: 0.5rem;
    --sukan-touch-target: 2.75rem;
    --sukan-checkbox-size: 1.125rem;
    --sukan-textarea-min-size: 8rem;
    --sukan-focus-width: 0.1875rem;
    --sukan-focus-offset: 0.1875rem;
    --sukan-duration-standard: 160ms;
    --sukan-duration-reduced: 0.01ms;
}

html,
body {
    color: var(--sukan-color-text);
    background: var(--sukan-color-surface-subtle);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans CJK SC", sans-serif;
    font-size: var(--sukan-font-size-body);
    line-height: var(--sukan-line-height-body);
    /* Progressive enhancement: ignored by browsers without text-spacing. */
    text-spacing: ideograph-alpha allow-end;
}

.pkp_structure_content,
.pkp_structure_main,
.pkp_structure_sidebar,
.pkp_structure_main > .page {
    min-inline-size: 0;
}

.pkp_structure_main {
    overflow-wrap: anywhere;
}

.pkp_structure_main h1,
.pkp_structure_main h2,
.pkp_structure_main h3,
.pkp_structure_main h4 {
    color: var(--sukan-color-text);
    line-height: var(--sukan-line-height-heading);
    overflow-wrap: anywhere;
    text-wrap: balance;
}

.pkp_structure_main h1 {
    font-size: var(--sukan-font-size-h1);
}

.pkp_structure_main h2 {
    font-size: var(--sukan-font-size-h2);
}

.pkp_structure_main h3 {
    font-size: var(--sukan-font-size-h3);
}

.pkp_structure_main h4 {
    font-size: var(--sukan-font-size-h4);
}

.pkp_structure_main p,
.pkp_structure_main li,
.pkp_structure_main dd,
.pkp_structure_main td,
.pkp_structure_main th {
    overflow-wrap: anywhere;
}

.pkp_structure_main a {
    color: var(--sukan-color-interactive);
    text-decoration-thickness: 0.08em;
    text-underline-offset: 0.16em;
}

.pkp_structure_main a:hover {
    color: var(--sukan-color-interactive-hover);
}

.pkp_structure_page a:focus-visible,
.pkp_structure_page button:focus-visible,
.pkp_structure_page input:focus-visible,
.pkp_structure_page select:focus-visible,
.pkp_structure_page textarea:focus-visible,
.pkp_structure_page summary:focus-visible,
.pkp_structure_page [tabindex]:focus-visible {
    outline: var(--sukan-focus-width) solid var(--sukan-color-focus);
    outline-offset: var(--sukan-focus-offset);
}

.obj_article_summary,
.obj_issue_summary {
    display: flow-root;
    min-inline-size: 0;
    padding: var(--sukan-space-4);
    background: var(--sukan-color-surface);
    border: 1px solid var(--sukan-color-border-subtle);
    border-radius: var(--sukan-radius-medium);
    box-shadow: var(--sukan-shadow-card);
    overflow-wrap: anywhere;
    transition: border-color var(--sukan-duration-standard) ease, box-shadow var(--sukan-duration-standard) ease;
}

.obj_article_summary:hover,
.obj_issue_summary:hover {
    border-color: var(--sukan-color-border);
    box-shadow: var(--sukan-shadow-card-hover);
}

.obj_article_summary > .title,
.obj_issue_summary .title {
    line-height: var(--sukan-line-height-heading);
}

.obj_article_summary .meta,
.obj_article_summary .subtitle,
.obj_article_summary .pages,
.obj_article_summary .published,
.obj_issue_summary .series,
.obj_issue_summary .description {
    color: var(--sukan-color-text-muted);
}

.obj_article_summary .galleys_links {
    flex-wrap: wrap;
    gap: var(--sukan-space-2);
}

.obj_article_summary .galleys_links li {
    margin-inline-end: 0;
}

.cmp_button,
.cmp_button_wire,
.cmp_form .buttons button,
.pkp_structure_main button,
.pkp_structure_main input[type="button"],
.pkp_structure_main input[type="submit"] {
    box-sizing: border-box;
    min-block-size: var(--sukan-touch-target);
    max-inline-size: 100%;
    padding-block: var(--sukan-space-2);
    padding-inline: var(--sukan-space-4);
    border: 1px solid var(--sukan-color-brand-surface);
    border-radius: var(--sukan-radius-small);
    font: inherit;
    font-weight: var(--sukan-font-weight-strong);
    line-height: var(--sukan-line-height-control);
    text-align: center;
    text-decoration: none;
    white-space: normal;
    cursor: pointer;
    transition: background-color var(--sukan-duration-standard) ease, border-color var(--sukan-duration-standard) ease, color var(--sukan-duration-standard) ease, box-shadow var(--sukan-duration-standard) ease;
}

.cmp_button,
.cmp_form .buttons button,
.pkp_structure_main button,
.pkp_structure_main input[type="button"],
.pkp_structure_main input[type="submit"] {
    color: var(--sukan-color-surface);
    background: var(--sukan-color-brand-surface);
}

.cmp_button_wire {
    color: var(--sukan-color-interactive);
    background: var(--sukan-color-surface);
}

.cmp_button:hover,
.cmp_button:focus,
.cmp_form .buttons button:hover,
.cmp_form .buttons button:focus,
.pkp_structure_main button:hover,
.pkp_structure_main button:focus,
.pkp_structure_main input[type="button"]:hover,
.pkp_structure_main input[type="button"]:focus,
.pkp_structure_main input[type="submit"]:hover,
.pkp_structure_main input[type="submit"]:focus {
    color: var(--sukan-color-surface);
    background: var(--sukan-color-interactive-hover);
    border-color: var(--sukan-color-interactive-hover);
}

.cmp_button_wire:hover,
.cmp_button_wire:focus {
    color: var(--sukan-color-surface);
    background: var(--sukan-color-interactive-hover);
    border-color: var(--sukan-color-interactive-hover);
}

.cmp_button:active,
.cmp_button_wire:active,
.cmp_form .buttons button:active,
.pkp_structure_main button:active,
.pkp_structure_main input[type="button"]:active,
.pkp_structure_main input[type="submit"]:active {
    box-shadow: inset 0 0 0 1px var(--sukan-color-surface);
}

.cmp_button:disabled,
.cmp_button[aria-disabled="true"],
.cmp_button_wire:disabled,
.cmp_button_wire[aria-disabled="true"],
.cmp_form button:disabled,
.pkp_structure_main button:disabled,
.pkp_structure_main input:disabled {
    color: var(--sukan-color-text-muted);
    background: var(--sukan-color-surface-subtle);
    border-color: var(--sukan-color-border);
    box-shadow: none;
    cursor: not-allowed;
    opacity: 0.75;
}

.cmp_form fieldset {
    min-inline-size: 0;
}

.cmp_form label,
.cmp_form legend {
    color: var(--sukan-color-text);
}

.cmp_form input[type="text"],
.cmp_form input[type="email"],
.cmp_form input[type="password"],
.cmp_form input[type="url"],
.cmp_form input[type="tel"],
.cmp_form input[type="search"],
.cmp_form input[type="number"],
.cmp_form select,
.cmp_form textarea {
    box-sizing: border-box;
    min-block-size: var(--sukan-touch-target);
    max-inline-size: 100%;
    padding: var(--sukan-space-2) var(--sukan-space-3);
    color: var(--sukan-color-text);
    background: var(--sukan-color-surface);
    border: 1px solid var(--sukan-color-border);
    border-radius: var(--sukan-radius-small);
    font: inherit;
    line-height: var(--sukan-line-height-input);
    transition: border-color var(--sukan-duration-standard) ease, box-shadow var(--sukan-duration-standard) ease;
}

.cmp_form input[type="text"]:hover,
.cmp_form input[type="email"]:hover,
.cmp_form input[type="password"]:hover,
.cmp_form input[type="url"]:hover,
.cmp_form input[type="tel"]:hover,
.cmp_form input[type="search"]:hover,
.cmp_form input[type="number"]:hover,
.cmp_form select:hover,
.cmp_form textarea:hover {
    border-color: var(--sukan-color-text-muted);
}

.cmp_form input[type="text"]:focus,
.cmp_form input[type="email"]:focus,
.cmp_form input[type="password"]:focus,
.cmp_form input[type="url"]:focus,
.cmp_form input[type="tel"]:focus,
.cmp_form input[type="search"]:focus,
.cmp_form input[type="number"]:focus,
.cmp_form select:focus,
.cmp_form textarea:focus {
    border-color: var(--sukan-color-focus);
    box-shadow: 0 0 0 1px var(--sukan-color-focus);
}

.cmp_form input[type="text"]:disabled,
.cmp_form input[type="email"]:disabled,
.cmp_form input[type="password"]:disabled,
.cmp_form input[type="url"]:disabled,
.cmp_form input[type="tel"]:disabled,
.cmp_form input[type="search"]:disabled,
.cmp_form input[type="number"]:disabled,
.cmp_form select:disabled,
.cmp_form textarea:disabled {
    color: var(--sukan-color-text-muted);
    background: var(--sukan-color-surface-subtle);
    border-color: var(--sukan-color-border-subtle);
    box-shadow: none;
    cursor: not-allowed;
    opacity: 0.75;
}

.cmp_form textarea {
    min-block-size: var(--sukan-textarea-min-size);
    resize: vertical;
}

.cmp_form input[aria-invalid="true"],
.cmp_form select[aria-invalid="true"],
.cmp_form textarea[aria-invalid="true"] {
    border-color: var(--sukan-color-danger);
    box-shadow: 0 0 0 1px var(--sukan-color-danger);
}

.cmp_form input[aria-invalid="true"]:hover,
.cmp_form select[aria-invalid="true"]:hover,
.cmp_form textarea[aria-invalid="true"]:hover,
.cmp_form input[aria-invalid="true"]:focus,
.cmp_form select[aria-invalid="true"]:focus,
.cmp_form textarea[aria-invalid="true"]:focus {
    border-color: var(--sukan-color-danger);
    box-shadow: 0 0 0 1px var(--sukan-color-danger);
}

.cmp_form .fields > div .error,
.cmp_form .pkp_form_error {
    position: static;
    display: block;
    margin-block-start: var(--sukan-space-2);
    padding: var(--sukan-space-2) var(--sukan-space-3);
    color: var(--sukan-color-surface);
    background: var(--sukan-color-danger);
    border-radius: var(--sukan-radius-small);
    font-size: var(--sukan-font-size-small);
    line-height: var(--sukan-line-height-small);
}

.cmp_form .description {
    color: var(--sukan-color-text-muted);
    font-size: var(--sukan-font-size-small);
}

.cmp_form label:has(> input[type="checkbox"]),
.cmp_form label:has(> input[type="radio"]) {
    display: flex;
    align-items: flex-start;
    min-block-size: var(--sukan-touch-target);
    gap: var(--sukan-space-2);
}

.cmp_form input[type="checkbox"],
.cmp_form input[type="radio"] {
    flex: 0 0 auto;
    inline-size: var(--sukan-checkbox-size);
    block-size: var(--sukan-checkbox-size);
    margin: var(--sukan-space-1) 0 0;
}

.cmp_pagination {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--sukan-space-3);
    text-align: start;
}

.cmp_pagination .prev,
.cmp_pagination .next,
.cmp_pagination a {
    float: none;
    display: inline-flex;
    align-items: center;
    min-block-size: var(--sukan-touch-target);
    padding: var(--sukan-space-2) var(--sukan-space-3);
    border-radius: var(--sukan-radius-small);
}

.cmp_breadcrumbs {
    max-inline-size: 100%;
}

.cmp_breadcrumbs ol {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: var(--sukan-space-1);
}

.cmp_breadcrumbs li,
.cmp_breadcrumbs a,
.cmp_breadcrumbs .current,
.cmp_breadcrumbs .current h1 {
    min-inline-size: 0;
    overflow-wrap: anywhere;
}

.cmp_breadcrumbs .separator {
    padding-inline: var(--sukan-space-1);
    color: var(--sukan-color-text-muted);
}

.cmp_notification,
.pkp_form_error {
    padding: var(--sukan-space-4);
    color: var(--sukan-color-text);
    background: var(--sukan-color-surface-subtle);
    border: 1px solid var(--sukan-color-border-subtle);
    border-inline-start: var(--sukan-space-2) solid var(--sukan-color-brand-surface);
    border-radius: var(--sukan-radius-small);
    overflow-wrap: anywhere;
}

.cmp_notification.success,
.cmp_notification .success {
    border-inline-start-color: var(--sukan-color-success);
}

.cmp_notification.error,
.cmp_notification.no,
.cmp_notification .error,
.cmp_notification .no,
.pkp_form_error {
    border-inline-start-color: var(--sukan-color-danger);
}

.cmp_notification.warning,
.cmp_notification .warning {
    border-inline-start-color: var(--sukan-color-warning);
}

/*
 * Reusable status primitives for frontend pages and project plugins.
 * Colors derive from existing --sukan-* tokens only; text always
 * accompanies the color so color is never the sole status indicator.
 */

.sukan_badge {
    display: inline-flex;
    align-items: center;
    gap: var(--sukan-space-1);
    max-inline-size: 100%;
    padding: 0.125rem var(--sukan-space-2);
    color: var(--sukan-color-text);
    background: var(--sukan-color-surface-subtle);
    border: 1px solid var(--sukan-color-border-subtle);
    border-radius: 999px;
    font-size: var(--sukan-font-size-small);
    font-weight: var(--sukan-font-weight-strong);
    line-height: var(--sukan-line-height-small);
    overflow-wrap: anywhere;
}

.sukan_badge::before {
    content: "";
    flex: 0 0 auto;
    inline-size: 0.5em;
    block-size: 0.5em;
    background: currentColor;
    border-radius: 50%;
}

.sukan_badge--success {
    color: var(--sukan-color-success);
    background: var(--sukan-color-success-subtle);
    border-color: transparent;
}

.sukan_badge--warning {
    color: var(--sukan-color-warning);
    background: var(--sukan-color-warning-subtle);
    border-color: transparent;
}

.sukan_badge--danger {
    color: var(--sukan-color-danger);
    background: var(--sukan-color-danger-subtle);
    border-color: transparent;
}

.sukan_badge--interactive {
    color: var(--sukan-color-interactive-hover);
    background: var(--sukan-color-interactive-subtle);
    border-color: transparent;
}

.sukan_badge--muted {
    color: var(--sukan-color-text-muted);
    background: var(--sukan-color-muted-subtle);
    border-color: transparent;
}

.sukan_alert {
    padding: var(--sukan-space-3) var(--sukan-space-4);
    color: var(--sukan-color-text);
    background: var(--sukan-color-surface-subtle);
    border: 1px solid var(--sukan-color-border-subtle);
    border-inline-start: var(--sukan-space-1) solid var(--sukan-color-interactive);
    border-radius: var(--sukan-radius-small);
    overflow-wrap: anywhere;
}

.sukan_alert > :first-child {
    margin-block-start: 0;
}

.sukan_alert > :last-child {
    margin-block-end: 0;
}

.sukan_alert--info {
    background: var(--sukan-color-interactive-subtle);
    border-inline-start-color: var(--sukan-color-interactive);
}

.sukan_alert--success {
    background: var(--sukan-color-success-subtle);
    border-inline-start-color: var(--sukan-color-success);
}

.sukan_alert--warning {
    background: var(--sukan-color-warning-subtle);
    border-inline-start-color: var(--sukan-color-warning);
}

.sukan_alert--danger {
    background: var(--sukan-color-danger-subtle);
    border-inline-start-color: var(--sukan-color-danger);
}

.cmp_back_link a {
    display: inline-flex;
    align-items: center;
    min-block-size: var(--sukan-touch-target);
}

.pkp_structure_main table {
    inline-size: 100%;
    max-inline-size: 100%;
    border-collapse: collapse;
    table-layout: fixed;
}

.pkp_structure_main th,
.pkp_structure_main td {
    padding: var(--sukan-space-2) var(--sukan-space-3);
    border: 1px solid var(--sukan-color-border-subtle);
    text-align: start;
    vertical-align: top;
}

.pkp_structure_main th {
    background: var(--sukan-color-surface-subtle);
}

@media (min-width: 48rem) {
    .obj_article_summary,
    .obj_issue_summary {
        padding: var(--sukan-space-5);
    }
}

@media (max-width: 29.99rem) {
    :root {
        --sukan-space-6: 1.5rem;
        --sukan-space-7: 2rem;
    }

    .cmp_form .buttons {
        display: grid;
        gap: var(--sukan-space-2);
    }

    .cmp_form .buttons a,
    .cmp_form .buttons button {
        margin-inline-start: 0;
    }

    .cmp_pagination {
        align-items: stretch;
    }
}

@media (prefers-reduced-motion: reduce) {
    .obj_article_summary,
    .obj_issue_summary,
    .cmp_button,
    .cmp_button_wire,
    .cmp_form .buttons button,
    .cmp_form input,
    .cmp_form select,
    .cmp_form textarea,
    .pkp_structure_main button,
    .pkp_structure_main input[type="button"],
    .pkp_structure_main input[type="submit"] {
        transition-duration: var(--sukan-duration-reduced);
    }
}

/*
 * M4 public reading journey.
 *
 * These selectors enhance OJS 3.5.0.5 upstream markup only. Content order,
 * visibility and routing remain the responsibility of OJS and project plugins.
 */

.page_index_journal .homepage_image,
.page_index_journal .homepage_about,
.page_index_journal .current_issue,
.page_index_journal .additional_content {
    min-inline-size: 0;
}

.page_index_journal .homepage_image img {
    display: block;
    inline-size: 100%;
    block-size: auto;
    border-radius: var(--sukan-radius-medium);
}

.page_index_journal .homepage_about,
.page_index_journal .additional_content {
    max-inline-size: var(--sukan-reading-measure);
}

.page_index_journal .current_issue {
    margin-block-start: var(--sukan-space-6);
}

.page_index_journal .current_issue_title {
    display: inline-flex;
    align-items: center;
    min-block-size: var(--sukan-touch-target);
    margin-block: var(--sukan-space-3) var(--sukan-space-5);
    padding: var(--sukan-space-2) var(--sukan-space-4);
    color: var(--sukan-color-text);
    background: var(--sukan-color-surface-subtle);
    border-inline-start: var(--sukan-space-1) solid var(--sukan-color-brand-surface);
    border-radius: var(--sukan-radius-small);
    font-weight: var(--sukan-font-weight-strong);
    overflow-wrap: anywhere;
}

.page_index_journal .current_issue > .read_more {
    display: inline-flex;
    align-items: center;
    min-block-size: var(--sukan-touch-target);
    margin-block-start: var(--sukan-space-4);
}

.page_issue_archive .issues_archive {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--sukan-space-5);
    margin: var(--sukan-space-5) 0 0;
    padding: 0;
    border: 0;
    list-style: none;
}

.page_issue_archive .issues_archive > li {
    min-inline-size: 0;
    padding: 0;
    border: 0;
}

.page_issue_archive .obj_issue_summary {
    block-size: 100%;
}

.obj_issue_summary h2,
.obj_issue_summary .title {
    overflow-wrap: anywhere;
}

.obj_issue_summary .cover img,
.obj_issue_toc .cover img {
    max-inline-size: 100%;
    block-size: auto;
}

.obj_issue_toc .heading {
    min-inline-size: 0;
}

.obj_issue_toc .heading:has(.cover, .description, .pub_id, .published) {
    margin-block-end: var(--sukan-space-5);
    padding: var(--sukan-space-4);
    background: var(--sukan-color-surface-subtle);
    border: 1px solid var(--sukan-color-border-subtle);
    border-radius: var(--sukan-radius-medium);
}

.obj_issue_toc .sections:not(:first-child) {
    margin-block-start: var(--sukan-space-6);
}

.obj_issue_toc .section {
    position: relative;
    margin: var(--sukan-space-6) 0 0;
    padding: var(--sukan-space-5) 0 0;
    border-block-start: 1px solid var(--sukan-color-border-subtle);
}

.obj_issue_toc .section::before {
    display: none;
}

.obj_issue_toc .section > h2,
.obj_issue_toc .section > h3,
.obj_issue_toc .section > h4 {
    position: static;
    display: block;
    margin: 0 0 var(--sukan-space-4);
    padding: 0;
    color: var(--sukan-color-text);
    background: transparent;
    font-size: var(--sukan-font-size-h3);
    font-weight: var(--sukan-font-weight-strong);
    line-height: var(--sukan-line-height-heading);
}

.obj_issue_toc .articles,
.cmp_article_list {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--sukan-space-4);
    margin: 0;
    padding: 0;
    list-style: none;
}

.obj_issue_toc .articles > li,
.cmp_article_list > li {
    min-inline-size: 0;
    margin: 0;
}

.obj_article_summary > .title {
    margin: 0;
    font-size: var(--sukan-font-size-h4);
}

.obj_article_summary > .title a {
    text-decoration: none;
}

.obj_article_summary > .title a:hover {
    text-decoration: underline;
}

.obj_article_summary .meta {
    margin-block-start: var(--sukan-space-2);
    padding-block-start: 0;
    line-height: var(--sukan-line-height-small);
}

.obj_article_summary .authors,
.obj_article_summary .subtitle {
    overflow-wrap: anywhere;
}

.obj_article_summary .galleys_links:empty,
.obj_issue_toc .galleys_links:empty,
.obj_article_details .galleys_links:empty,
.obj_article_details .supplementary_galleys_links:empty {
    display: none;
    margin: 0;
}

.obj_article_details > .page_title {
    max-inline-size: var(--sukan-reading-measure);
    margin: 0;
}

.obj_article_details > .subtitle {
    max-inline-size: var(--sukan-reading-measure);
    margin-block-start: var(--sukan-space-2);
    color: var(--sukan-color-text-muted);
    line-height: var(--sukan-line-height-heading);
}

.obj_article_details .row {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    margin: var(--sukan-space-6) 0 0;
    background: var(--sukan-color-surface);
    border: 1px solid var(--sukan-color-border-subtle);
    border-radius: var(--sukan-radius-medium);
    overflow: hidden;
}

.obj_article_details .main_entry,
.obj_article_details .entry_details {
    float: none;
    inline-size: auto;
    width: auto;
    min-inline-size: 0;
    margin: 0;
    border: 0;
}

.obj_article_details .main_entry .item,
.obj_article_details .entry_details .item {
    padding: var(--sukan-space-4);
    overflow-wrap: anywhere;
}

.obj_article_details .main_entry .item + .item,
.obj_article_details .entry_details .item + .item {
    border-block-start: 1px solid var(--sukan-color-border-subtle);
}

.obj_article_details .main_entry .item > .label,
.obj_article_details .entry_details .item .label {
    color: var(--sukan-color-text);
    line-height: var(--sukan-line-height-heading);
}

.obj_article_details .main_entry .abstract {
    max-inline-size: var(--sukan-reading-measure);
}

.obj_article_details .main_entry .abstract > :first-child,
.obj_article_details .entry_details .value > :first-child {
    margin-block-start: 0;
}

.obj_article_details .main_entry .abstract > :last-child,
.obj_article_details .entry_details .value > :last-child {
    margin-block-end: 0;
}

.obj_article_details ul.authors,
.obj_article_details .entry_details ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.obj_article_details ul.authors {
    display: grid;
    gap: var(--sukan-space-3);
}

.obj_article_details ul.authors > li {
    margin: 0;
}

.obj_article_details .authors .affiliation,
.obj_article_details .keywords .value,
.obj_article_details .entry_details .value {
    color: var(--sukan-color-text-muted);
    overflow-wrap: anywhere;
}

.obj_article_details .entry_details {
    background: var(--sukan-color-surface-subtle);
    border-block-start: 1px solid var(--sukan-color-border-subtle);
}

@media (min-width: 48rem) {
    .page_issue_archive .issues_archive {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .obj_article_details .main_entry .item,
    .obj_article_details .entry_details .item {
        padding: var(--sukan-space-5);
    }
}

@media (min-width: 64rem) {
    .obj_article_details .row {
        grid-template-columns: minmax(0, 2fr) minmax(16rem, 1fr);
    }

    .obj_article_details .main_entry {
        grid-column: 1;
        grid-row: 1;
    }

    .obj_article_details .entry_details {
        grid-column: 2;
        grid-row: 1;
        border-block-start: 0;
        border-inline-start: 1px solid var(--sukan-color-border-subtle);
    }
}

/* M5 historical archive: presentation only; data remains Plugin-owned. */
.sukan_history__header {
    max-inline-size: var(--sukan-reading-measure);
    margin-block-end: var(--sukan-space-6);
}

.sukan_history__header h1 {
    margin-block-end: var(--sukan-space-3);
}

.sukan_history__header p {
    margin: 0;
    color: var(--sukan-color-text-muted);
}

.sukan_history__years {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--sukan-space-5);
}

.sukan_history__year {
    min-inline-size: 0;
    padding: var(--sukan-space-4);
    background: var(--sukan-color-surface);
    border: 1px solid var(--sukan-color-border-subtle);
    border-radius: var(--sukan-radius-medium);
}

.sukan_history__year h2 {
    margin: 0 0 var(--sukan-space-4);
    padding-block-end: var(--sukan-space-2);
    border-block-end: 1px solid var(--sukan-color-border-subtle);
    font-size: var(--sukan-font-size-h3);
}

.sukan_history__issues {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--sukan-space-2);
    margin: 0;
    padding: 0;
    list-style: none;
}

.sukan_history__issue {
    min-inline-size: 0;
    margin: 0;
    padding: var(--sukan-space-2) var(--sukan-space-3);
    background: var(--sukan-color-surface-subtle);
    border-radius: var(--sukan-radius-small);
    overflow-wrap: anywhere;
}

.sukan_history__issue a {
    font-weight: var(--sukan-font-weight-strong);
}

.sukan_history__issue--unavailable {
    color: var(--sukan-color-text-muted);
}

.sukan_history__unavailable {
    display: block;
    margin-block-start: var(--sukan-space-1);
    font-size: var(--sukan-font-size-small);
}

@media (min-width: 30rem) {
    .sukan_history__issues {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (min-width: 48rem) {
    .sukan_history__years {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/*
 * Minimal print presentation: drop the sticky header, homepage actions, sidebars,
 * footer navigation and role entries; body text prints black on white and
 * links are not expanded to show their URLs.
 */
@media print {
    .pkp_structure_head,
    .sukan_hero__actions,
    .pkp_structure_sidebar,
    .sukan_issue_sidebar,
    .sukan_homepage_sidebar,
    .sukan_history__sidebar,
    .sukan_footer__navigation,
    .sukan_role_entries {
        display: none;
    }

    html,
    body {
        color: #000;
        background: #fff;
    }

    .pkp_structure_content,
    .pkp_structure_main {
        float: none;
        inline-size: 100%;
        width: 100%;
        margin-inline: 0;
        padding-block-start: 0;
    }
}

/* ===== merged from styles/layout.css ===== */

/**
 * Public layout on top of the OJS Default Theme.
 *
 * Content and routing stay with OJS. One fluid container (max 1320px) is
 * shared by the header, content and footer.
 */

.pkp_structure_page {
    display: flex;
    flex-direction: column;
    min-block-size: 100vh;
    background: var(--sukan-color-surface-subtle);
}

.pkp_structure_content,
.pkp_structure_footer,
.sukan_header_inner {
    box-sizing: border-box;
    inline-size: min(100% - 2 * var(--sukan-gutter), var(--sukan-container));
    max-inline-size: var(--sukan-container);
    margin-inline: auto;
}

.pkp_structure_content {
    flex: 1 0 auto;
    padding-block: var(--sukan-space-5) var(--sukan-space-7);
    background: transparent;
}

.pkp_structure_content:not(.has_sidebar) .pkp_structure_main {
    float: none;
    inline-size: 100%;
    width: 100%;
    margin-inline: 0;
    padding: 0;
}

.pkp_structure_content:not(.has_sidebar) .pkp_structure_main:first-child:last-child {
    margin-block-start: 0;
}

.pkp_structure_main {
    background: transparent;
}

.pkp_structure_main > .page,
.pkp_structure_main > .page_index_journal,
.pkp_structure_main > .page_article,
.pkp_structure_main > .page_issue,
.pkp_structure_main > .page_issue_archive,
.pkp_structure_main > .sukan_history {
    inline-size: 100%;
    max-inline-size: none;
}

.pkp_structure_main::before,
.pkp_structure_main::after {
    display: none;
}

/* Shared public button; pages add --primary for the main action. */
.sukan_button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    min-block-size: var(--sukan-touch-target);
    padding: var(--sukan-space-2) var(--sukan-space-5);
    color: var(--sukan-color-brand-surface);
    background: var(--sukan-color-surface);
    border: 1px solid var(--sukan-color-border);
    border-radius: var(--sukan-radius-small);
    font-weight: 600;
    line-height: var(--sukan-line-height-control);
    text-decoration: none;
    transition: background-color var(--sukan-duration-standard) ease, border-color var(--sukan-duration-standard) ease, color var(--sukan-duration-standard) ease;
}

.pkp_structure_main a.sukan_button {
    color: var(--sukan-color-brand-surface);
}

.pkp_structure_main a.sukan_button:hover,
.pkp_structure_main a.sukan_button:focus {
    color: var(--sukan-color-interactive);
    border-color: var(--sukan-color-interactive);
}

.pkp_structure_main a.sukan_button--primary {
    color: #fff;
    background: var(--sukan-color-interactive);
    border-color: var(--sukan-color-interactive);
}

.pkp_structure_main a.sukan_button--primary:hover,
.pkp_structure_main a.sukan_button--primary:focus {
    color: #fff;
    background: var(--sukan-color-interactive-hover);
    border-color: var(--sukan-color-interactive-hover);
}