.journal-cover-card,
.issue-cover-card,
.textbook-cover-card {
    padding: var(--ds-space-2-5);
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.journal-cover-card > img,
.issue-cover-card > img,
.textbook-cover-card > img {
    display: block;
    width: min(100%, 240px);
    height: auto;
    max-width: 100%;
    object-fit: contain;
}

.legacy-detail-sidebar {
    display: flex;
    flex-direction: column;
    gap: var(--ds-space-4);
}

.detail-cover-card {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--ds-space-2-5);
    text-align: center;
}

.detail-cover-card > img {
    display: block;
    width: min(100%, 240px);
    max-width: 100%;
    height: auto;
    object-fit: contain;
    border-radius: var(--ds-radius-md);
    background: var(--ds-color-bg-alt);
}

.legacy-detail-sidebar .action-card {
    display: flex;
    flex-direction: column;
    gap: var(--ds-space-3);
    padding: var(--ds-space-3-5) var(--ds-space-4);
}

.legacy-detail-sidebar .action-card .action-btn,
.legacy-detail-sidebar .action-card .sidebar-semantic-button.action-btn {
    width: 100%;
    justify-content: flex-start;
    margin: 0;
}

.legacy-detail-sidebar .sidebar-crossmark-card {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--ds-space-4);
}

.legacy-detail-sidebar .sidebar-crossmark-card img {
    display: block;
    max-width: min(100%, 220px);
    height: auto;
}

.legacy-detail-sidebar .legacy-detail-links-card,
.legacy-detail-sidebar .legacy-detail-access-card {
    padding: var(--ds-space-4);
}

.legacy-detail-sidebar .legacy-detail-links-card {
    display: flex;
    flex-direction: column;
    gap: var(--ds-space-3);
}

.legacy-detail-sidebar .legacy-detail-access-card {
    display: flex;
    align-items: center;
    justify-content: center;
}

.legacy-detail-sidebar .article-cover-access {
    display: flex;
    flex-wrap: wrap;
    gap: var(--ds-space-3);
    margin: 0;
}

.legacy-detail-sidebar .legacy-detail-access-card .article-cover-access {
    width: 100%;
    justify-content: center;
    padding: 0;
    text-align: center;
}

.legacy-detail-sidebar .article-cover-access a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    padding: var(--ds-space-2) var(--ds-space-2-5);
    border: var(--ds-space-px) solid var(--ds-color-border);
    border-radius: var(--ds-radius-md);
    background: var(--ds-color-white);
}

.legacy-detail-sidebar .legacy-detail-access-card .article-cover-access a {
    width: auto;
    max-width: 100%;
}

.legacy-detail-sidebar .article-cover-access img {
    display: block;
    width: auto;
    max-width: 100%;
    max-height: 32px;
    height: auto;
}

.legacy-detail-sidebar .legacy-detail-access-card .article-cover-access img {
    max-width: min(100%, 220px);
    max-height: 40px;
}

.journal-header-card,
.issue-header-card {
    padding: var(--ds-space-5) var(--ds-space-5-5);
}

.journal-header-card .catalog-row.info-row,
.issue-header-card .catalog-row.info-row {
    margin-bottom: var(--ds-space-2);
    align-items: flex-start;
}

.journal-header-card .info-row .name,
.issue-header-card .info-row .name {
    width: 180px;
    font-size: var(--ds-font-size-2xs);
    font-weight: 600;
    color: var(--ds-color-muted);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.journal-header-card .info-row .data,
.issue-header-card .info-row .data {
    font-size: var(--ds-font-size-base);
    color: var(--ds-color-heading);
    font-weight: 500;
}

.journal-header-card .info-row .data a,
.issue-header-card .info-row .data a {
    color: var(--ds-color-link);
    font-weight: 500;
}

/* Age rating — H2-scale value (JournalsBundle, all variants) */
.journals-age-rating {
    /* Match visual weight of page h2 (see base-globals + heading scale) */
    font-size: var(--ds-font-size-5xl);
    font-weight: 700;
    line-height: 1.25;
    color: var(--ds-color-heading);
    font-family: var(--ds-font-family);
}

.journals-age-rating-wrap {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: var(--ds-space-2);
}

.journals-age-rating__caption {
    font-size: var(--ds-font-size-sm);
    font-weight: 600;
    color: var(--ds-color-muted);
}

.article-page .dates-row .journals-age-rating-wrap {
    flex: 1 0 100%;
    margin-top: var(--ds-space-2);
}

.journals-age-rating-row .journals-age-rating-meta-label,
.journals-age-rating-row .journals-age-rating-meta-value {
    vertical-align: middle;
}

.journals-age-rating-row .journals-age-rating-meta-value .journals-age-rating {
    font-size: var(--ds-font-size-2xl);
    line-height: 1;
}

.journals-age-rating-catalog-row .data .journals-age-rating,
.journals-age-rating-article-info-row .value .journals-age-rating {
    display: inline-block;
}

.journal-sidebar .journal-contact-card h5,
.issue-sidebar .issue-editor-card h5 {
    margin: 0 0 var(--ds-space-2-5);
    font-size: var(--ds-font-size-2xs);
    font-weight: 600;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--ds-color-muted);
}


/* ============================================================================
   Shared page patterns -- sidebar, labels, cards, logos
   Used across journal, issue, and article pages.
   Page-specific overrides remain in their respective CSS files.
   ============================================================================ */


/* -- Sidebar base layout ------------------------------------------------- */

.ds-page-layout,
.article-page .sidebar,
.issue-page .sidebar,
.journal-page .sidebar {
    display: flex;
    flex-direction: column;
    gap: var(--ds-space-4);
}


/* -- Section label pattern ----------------------------------------------- */

.ds-label,
.action-label,
.nav-card-label,
.index-label,
.info-card-label,
.editorial-role-label,
.sidebar-card-label,
.issues-section-title {
    font-size: var(--ds-font-size-2xs);
    font-weight: 600;
    color: var(--ds-color-muted);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}


/* -- Index logos ---------------------------------------------------------- */

.index-logos {
    display: flex;
    flex-wrap: wrap;
    gap: var(--ds-space-2);
}


/* -- Contact / editor card base ------------------------------------------ */

.journal-contact-card,
.issue-editor-card {
    padding: var(--ds-space-4);
}

.ds-person-list .author-list-item,
.ds-person-list .ds-person-list__item,
.journal-contact-card .author-list-item,
.issue-editor-card .author-list-item {
    display: flex;
    gap: var(--ds-space-2-5);
    align-items: flex-start;
    margin-bottom: var(--ds-space-2-5);
}

.ds-person-list .author-list-item:last-child,
.ds-person-list .ds-person-list__item:last-child,
.journal-contact-card .author-list-item:last-child,
.issue-editor-card .author-list-item:last-child {
    margin-bottom: 0;
}

.ds-person-list .avatar,
.ds-person-list .ds-person-list__avatar,
.journal-contact-card .avatar,
.issue-editor-card .avatar {
    width: 36px;
    height: 36px;
    border-radius: var(--ds-radius-full);
    flex-shrink: 0;
    background: var(--ds-color-border-lt);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--ds-font-size-body-sm);
    font-weight: 600;
    color: var(--ds-color-body);
}

.ds-person-list .info,
.ds-person-list .ds-person-list__info,
.journal-contact-card .info,
.issue-editor-card .info {
    font-size: var(--ds-font-size-sm);
    line-height: 1.5;
    color: var(--ds-color-body);
}

.ds-person-list .info a,
.ds-person-list .ds-person-list__info a,
.journal-contact-card .info a,
.issue-editor-card .info a {
    color: var(--ds-color-link);
}

.ds-person-list .mail,
.ds-person-list .phone,
.ds-person-list .ds-person-list__mail,
.journal-contact-card .mail,
.journal-contact-card .phone,
.journal-contact-card .info .mail,
.journal-contact-card .info .phone,
.issue-editor-card .mail,
.issue-editor-card .phone,
.issue-editor-card .info .mail,
.issue-editor-card .info .phone {
    font-size: var(--ds-font-size-2xs);
    color: var(--ds-color-muted);
    word-break: break-word;
    display: inline-block;
    text-decoration: none;
}

.ds-person-list .mail:hover,
.ds-person-list .phone:hover,
.ds-person-list .info a:hover,
.ds-person-list .info a:active,
.ds-person-list .mail:focus,
.ds-person-list .phone:focus,
.journal-contact-card .info .mail:hover,
.journal-contact-card .info .phone:hover,
.journal-contact-card .info a:hover,
.journal-contact-card .info a:active,
.journal-contact-card .info .mail:focus,
.journal-contact-card .info .phone:focus,
.issue-editor-card .info .mail:hover,
.issue-editor-card .info .phone:hover,
.issue-editor-card .info a:hover,
.issue-editor-card .info a:active,
.issue-editor-card .info .mail:focus,
.issue-editor-card .info .phone:focus {
    color: var(--ds-color-muted);
    text-decoration: underline;
}

.ds-person-list .editor-role,
.ds-person-list .ds-person-list__role,
.ds-person-list .info b,
.ds-person-list .ds-person-list__info b,
.journal-contact-card .editor-role,
.issue-editor-card .editor-role,
.journal-contact-card .info b,
.issue-editor-card .info b {
    font-size: var(--ds-font-size-body-sm);
    font-weight: 600;
    color: var(--ds-color-heading);
    text-transform: none;
    letter-spacing: normal;
    margin-bottom: var(--ds-space-1);
}

.ds-person-list .editor-name,
.ds-person-list .ds-person-list__name,
.journal-contact-card .editor-name,
.issue-editor-card .editor-name {
    font-size: var(--ds-font-size-body-sm);
    font-weight: 500;
    color: var(--ds-color-link);
    line-height: 1.35;
}

.ds-person-list .editor-name a,
.ds-person-list .ds-person-list__name a,
.journal-contact-card .editor-name a,
.issue-editor-card .editor-name a {
    color: var(--ds-color-link);
    display: inline-block;
    max-width: 100%;
}


/* -- Sidebar submit button base ------------------------------------------ */

.ds-sidebar-btn,
.sidebar-submit-btn {
    align-items: center;
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    text-align: center;
    width: 100%;
    padding: var(--ds-space-2-25) var(--ds-space-3);
    font-size: var(--ds-font-size-body-sm);
    font-weight: 600;
    line-height: normal;
    background: var(--ds-color-link);
    color: var(--ds-color-white) !important;
    border: none;
    border-radius: var(--ds-radius-md);
    font-family: var(--ds-font-family);
    text-decoration: none !important;
    cursor: pointer;
}

.ds-sidebar-btn:hover,
.sidebar-submit-btn:hover {
    background: var(--ds-color-link-hover);
}

.sidebar-semantic-button {
    -webkit-appearance: none;
    appearance: none;
    color: inherit;
    cursor: pointer;
    font: inherit;
    line-height: inherit;
    margin: 0;
    text-align: inherit;
}

.sidebar-semantic-button:not(.action-btn):not(.sidebar-submit-secondary) {
    background: none;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    display: inline;
    padding: 0;
}

.sidebar-semantic-button:focus-visible {
    outline: none;
    box-shadow: var(--ds-focus-ring);
}

.sidebar-link {
    font-size: var(--ds-font-size-body-sm);
    margin-top: var(--ds-space-2);
}

.sidebar-submit-secondary {
    align-items: center;
    background: var(--ds-color-white);
    border: var(--ds-space-px) solid var(--ds-color-border);
    border-radius: var(--ds-radius-md);
    box-sizing: border-box;
    color: var(--ds-color-body);
    cursor: pointer;
    display: flex;
    font-family: var(--ds-font-family);
    font-size: var(--ds-font-size-body-sm);
    font-weight: 500;
    justify-content: center;
    line-height: normal;
    min-height: 40px;
    padding: var(--ds-space-2) var(--ds-space-3);
    text-align: center;
    text-decoration: none !important;
    width: 100%;
}

.sidebar-submit-secondary:hover {
    border-color: var(--ds-color-secondary);
    color: var(--ds-color-body);
    text-decoration: none;
}

.journal-sidebar-subscription {
    font-size: var(--ds-font-size-body-sm);
}


/* -- OA notice card base ------------------------------------------------- */

.oa-status-line {
    display: flex;
    align-items: flex-start;
    gap: var(--ds-space-2);
}

.oa-status-line > :last-child {
    min-width: 0;
}

.oa-status-icon {
    display: block;
    width: var(--ds-size-icon-md);
    height: var(--ds-size-icon-md);
    flex-shrink: 0;
    margin-top: var(--ds-space-0-5);
}

.oa-status-badge {
    display: inline-flex;
    align-items: center;
    gap: var(--ds-space-2);
    padding: var(--ds-space-2) var(--ds-space-2-5);
    border-radius: var(--ds-radius-lg);
    border: 1px solid var(--ds-badge-success-border, rgba(34, 197, 94, 0.2));
    background: rgba(255, 255, 255, 0.45);
    width: fit-content;
    max-width: 100%;
}

.oa-status-badge--link,
.oa-status-badge--link:hover,
.oa-status-badge--link:visited {
    color: var(--ds-badge-success-color, #15803D);
    text-decoration: none;
}

.oa-status-badge__text {
    display: flex;
    flex-direction: column;
    line-height: 1.05;
    font-weight: 700;
    text-transform: lowercase;
}

.oa-license-copy {
    margin-top: var(--ds-space-2);
}

.sidebar-oa-card {
    padding: var(--ds-space-3-5) var(--ds-space-4);
    background: var(--ds-badge-success-bg);
    border-color: var(--ds-badge-success-border);
    display: flex;
    gap: var(--ds-space-2-5);
    align-items: flex-start;
}

.sidebar-oa-icon {
    width: var(--ds-space-6);
    height: var(--ds-space-6);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    color: inherit;
}

.sidebar-oa-icon .oa-status-icon {
    width: 100%;
    height: 100%;
    margin-top: 0;
    object-fit: contain;
}

.sidebar-oa-text {
    font-size: var(--ds-font-size-sm);
    color: var(--ds-badge-success-color);
    line-height: 1.55;
}

.sidebar-oa-text a {
    color: var(--ds-badge-success-color);
    font-weight: 600;
}

.sidebar-oa-text a:hover {
    color: var(--ds-badge-success-color);
    text-decoration: underline;
}

.sidebar-oa-text a:visited {
    color: var(--ds-badge-success-color);
}

.sidebar-oa-card--empty {
    background: var(--ds-color-bg);
    border-color: var(--ds-color-border);
}

.sidebar-oa-card--empty .sidebar-oa-text {
    color: var(--ds-color-muted);
}