/**
 * AXIS Theme - Dark Mode Stylesheet
 * Separate file for better performance
 */

/* Dark mode color overrides */
.dark-mode {
	--axis-text: #E2E8F0;
	--axis-text-secondary: #94A3B8;
	--axis-background: #0F172A;
	--axis-surface: #1E293B;
	--axis-border: #334155;
}

/* CRITICAL: Body background in dark mode */
html.dark-mode body {
	background-color: #0F172A !important;
	background: #0F172A !important;
}

html.dark-mode .pkp_structure_page,
html.dark-mode .pkp_structure_main,
html.dark-mode main {
	background-color: #0F172A;
}

/* Component-specific dark mode adjustments */
.dark-mode {
	/* Header */
	.axis-header {
		background: var(--axis-surface);
		border-bottom-color: var(--axis-border);
	}
	
	/* Footer */
	.axis-footer {
		background: var(--axis-surface);
		border-top-color: var(--axis-border);
	}
	
	/* Cards */
	.axis-article-card,
	.axis-issue-card,
	.axis-most-viewed-item,
	.axis-article-item {
		background: var(--axis-surface);
		border-color: var(--axis-border);
	}
	
	/* Sidebar blocks */
	.axis-sidebar__block {
		background: var(--axis-surface);
		border-color: var(--axis-border);
	}
	
	/* Stats bar */
	.axis-stats-bar {
		background: var(--axis-surface);
		border-color: var(--axis-border);
	}
	
	/* Issue spotlight */
	.axis-issue-spotlight {
		background: var(--axis-surface);
		border-color: var(--axis-border);
	}
	
	/* Buttons need visible borders in dark mode */
	.axis-btn--primary {
		border: 2px solid rgba(255, 255, 255, 0.3);
		
		&:hover {
			border-color: rgba(255, 255, 255, 0.5);
		}
	}
	
	.axis-btn--secondary {
		border-color: var(--axis-primary);
		background: transparent;
		
		&:hover {
			background: var(--axis-primary);
			border-color: var(--axis-primary);
		}
	}
	
	/* Icon buttons */
	.axis-icon-button {
		border-color: var(--axis-border);
		
		&:hover {
			background: rgba(255, 255, 255, 0.05);
		}
	}
	
	/* Forms */
	.axis-search-input,
	.axis-sidebar__search-input {
		background: var(--axis-background);
		border-color: var(--axis-border);
		color: var(--axis-text);
		
		&:focus {
			border-color: var(--axis-primary);
		}
		
		&::placeholder {
			color: var(--axis-text-secondary);
		}
	}
	
	/* Meta sections */
	.axis-article-detail__meta,
	.axis-article-detail__authors {
		background: var(--axis-surface);
	}
	
	/* Archive year header */
	.axis-archive-year__header {
		background: var(--axis-surface);
		
		&:hover {
			background: lighten(#1E293B, 5%);
		}
	}
	
	/* Rich content tables */
	.axis-rich-content,
	.axis-content-block {
		table {
			border-color: var(--axis-border);
			
			th, td {
				border-color: var(--axis-border);
			}
			
			th {
				background: var(--axis-surface);
			}
		}
		
		iframe {
			border-color: var(--axis-border);
		}
	}
	
	/* Keywords */
	.axis-keyword {
		background: var(--axis-surface);
		border-color: var(--axis-border);
	}
	
	/* Citation box */
	.axis-citation-box {
		background: var(--axis-surface);
	}
	
	/* Hero overlay adjustment */
	.axis-hero__overlay {
		background: linear-gradient(to bottom, rgba(0,0,0,0.5), rgba(0,0,0,0.8));
	}
	
	/* Back to top button - needs border */
	.axis-back-to-top {
		background: var(--axis-primary);
		border: 2px solid rgba(255, 255, 255, 0.3);
		
		&:hover {
			border-color: rgba(255, 255, 255, 0.5);
		}
	}
	
	/* View count box */
	.axis-view-count {
		background: var(--axis-surface);
		border-color: var(--axis-primary);
	}
	
	/* Galley links adjustment */
	.axis-article-card__galley-link {
		background: var(--axis-surface);
		border-color: var(--axis-border);
		color: var(--axis-text);
		
		&:hover {
			background: var(--axis-primary);
			border-color: var(--axis-primary);
			color: white;
		}
	}
	
	/* Mobile menu toggle */
	.axis-hamburger-line {
		background: var(--axis-text);
	}
	
	/* Language select */
	.axis-select {
		background: var(--axis-surface);
		border-color: var(--axis-border);
		color: var(--axis-text);
	}
	
	/* Section policy blocks */
	.axis-section-policy {
		border-color: var(--axis-border);
	}
	
	/* Empty state icons */
	.axis-empty-state__icon {
		color: var(--axis-text-secondary);
	}
}

/* ========================================================================
   ISSUE PAGE - DARK MODE
   ======================================================================== */

/* Section title (Table of Contents) */
html.dark-mode .axis-section__title {
	color: var(--axis-text);
}

/* Issue header */
html.dark-mode .axis-issue-header__title {
	color: var(--axis-text);
}

html.dark-mode .axis-issue-header__date {
	color: var(--axis-text-secondary);
}

/* Issue files section */
html.dark-mode .axis-issue-files__title {
	color: var(--axis-text);
}

/* Article cards in issue page */
html.dark-mode .axis-article-card {
	background: var(--axis-surface);
	border-color: var(--axis-border);
}

html.dark-mode .axis-article-card__title {
	color: var(--axis-text);
}

html.dark-mode .axis-article-card__title a {
	color: var(--axis-text);
}

html.dark-mode .axis-article-card__authors {
	color: var(--axis-text-secondary);
}

html.dark-mode .axis-article-card__section {
	color: var(--axis-primary);
}

/* Article placeholder (when no cover image) */
html.dark-mode .axis-article-card__image--placeholder {
	background: var(--axis-surface);
}

html.dark-mode .axis-article-placeholder {
	background: linear-gradient(135deg, rgba(99, 102, 241, 0.1) 0%, rgba(139, 92, 246, 0.1) 100%);
}

html.dark-mode .axis-article-placeholder__icon {
	color: var(--axis-text-secondary);
}

/* Smooth transition for dark mode toggle */
.axis-theme,
.axis-theme *,
.axis-theme *::before,
.axis-theme *::after {
	transition: background-color 0.3s ease, 
	            border-color 0.3s ease, 
	            color 0.3s ease;
}

/* ========================================================================
   Glassmorphism for Dark Mode
   ======================================================================== */

/* Hero description glass effect - Dark mode */
html.dark-mode .axis-hero__description-wrapper {
	background: rgba(0, 0, 0, 0.3);
	border: 1px solid rgba(255, 255, 255, 0.1);
	box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.3);
}

/* Page description wrapper glass effect - Dark mode */
html.dark-mode .axis-page-description-wrapper {
	background: rgba(0, 0, 0, 0.3);
	border: 1px solid rgba(255, 255, 255, 0.1);
	box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.3);
}


/* ============================================
   ENHANCED NAVIGATION - DARK MODE
   ============================================ */

/* Navigation links in dark mode - button visible by default */
html.dark-mode .axis-nav-list a {
    color: rgba(255, 255, 255, 0.9);
    border-color: rgba(255, 255, 255, 0.15);
    background: transparent;
}

html.dark-mode .axis-nav-list a:hover {
    color: #818CF8;
    border-color: #818CF8;
    background: rgba(129, 140, 248, 0.08);
    box-shadow: 0 0 15px rgba(129, 140, 248, 0.1);
}

/* Active page in dark mode - filled button with glow */
html.dark-mode .axis-nav-list li.current-menu-item > a,
html.dark-mode .axis-nav-list a[aria-current="page"] {
    color: #818CF8;
    background: rgba(129, 140, 248, 0.15);
    border-color: #818CF8;
    box-shadow: inset 0 -3px 0 0 #818CF8,
                0 0 20px rgba(129, 140, 248, 0.15);
}

/* Animated underline in dark mode */
html.dark-mode .axis-nav-list a::before {
    background: linear-gradient(90deg, #818CF8, #A78BFA);
}

/* Dropdown menu in dark mode - enhanced */
html.dark-mode .axis-nav-list ul {
    background: #1E293B;
    border-color: rgba(255, 255, 255, 0.1);
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.4),
                0 0 20px rgba(129, 140, 248, 0.1);
}

html.dark-mode .axis-nav-list ul a {
    color: rgba(255, 255, 255, 0.85);
}

html.dark-mode .axis-nav-list ul a:hover {
    background: rgba(129, 140, 248, 0.15);
    color: #818CF8;
    box-shadow: 0 2px 8px rgba(129, 140, 248, 0.2);
}

/* Dropdown arrow in dark mode */
html.dark-mode .axis-nav-list > li:has(ul) > a::after {
    color: rgba(255, 255, 255, 0.5);
}

html.dark-mode .axis-nav-list > li:has(ul):hover > a::after {
    color: #818CF8;
}

/* Hamburger menu in dark mode - simple */
html.dark-mode .axis-mobile-menu-toggle {
    border-color: rgba(255, 255, 255, 0.2);
}

html.dark-mode .axis-hamburger-line {
    background: rgba(255, 255, 255, 0.9);
}

/* Header in dark mode - frosted glass effect */
html.dark-mode .axis-header {
    background: rgba(15, 23, 42, 0.95);
    backdrop-filter: blur(12px);
    border-bottom-color: rgba(255, 255, 255, 0.1);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}

html.dark-mode .axis-header.scrolled {
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.5),
                0 0 40px rgba(129, 140, 248, 0.1);
    border-bottom-color: rgba(129, 140, 248, 0.2);
}

/* Read more link in dark mode */
html.dark-mode .axis-footer__read-more {
    color: #818CF8;
}

html.dark-mode .axis-footer__read-more::before {
    background: #818CF8;
}

html.dark-mode .axis-footer__read-more:hover {
    color: #10B981;
}

html.dark-mode .axis-footer__read-more:hover::before {
    background: #10B981;
}

/* Hero read more link in dark mode */
html.dark-mode .axis-hero__read-more {
    color: rgba(255, 255, 255, 0.95);
    background: rgba(255, 255, 255, 0.1);
    border-color: rgba(255, 255, 255, 0.25);
}

html.dark-mode .axis-hero__read-more:hover {
    background: rgba(255, 255, 255, 0.2);
    border-color: rgba(255, 255, 255, 0.4);
}

html.dark-mode .axis-hero__read-more::before {
    background: rgba(255, 255, 255, 0.85);
}

/* ============================================================================

/* ============================================================================
   CUSTOM BLOCKS - DARK MODE (TITLE OUTSIDE)
   ========================================================================== */

html.dark-mode .axis-custom-blocks-section {
    background: rgba(255, 255, 255, 0.02);
    border-top-color: rgba(255, 255, 255, 0.1);
    border-bottom-color: rgba(255, 255, 255, 0.1);
}

html.dark-mode .axis-custom-block {
    background: rgba(255, 255, 255, 0.03);
    border-color: rgba(255, 255, 255, 0.1);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}

html.dark-mode .axis-custom-block-wrapper:hover .axis-custom-block {
    background: rgba(255, 255, 255, 0.05);
    border-color: #818CF8;
    box-shadow: 0 4px 12px rgba(129, 140, 248, 0.15);
}

html.dark-mode .axis-custom-block__title {
    color: #818CF8;
}

html.dark-mode .axis-custom-block-wrapper:hover .axis-custom-block__title {
    color: #34D399;
}

html.dark-mode .axis-custom-blocks-scroll::-webkit-scrollbar-thumb {
    background: rgba(129, 140, 248, 0.5);
}

html.dark-mode .axis-custom-blocks-scroll::-webkit-scrollbar-thumb:hover {
    background: #818CF8;
}

html.dark-mode .axis-custom-block::-webkit-scrollbar-thumb {
    background: #818CF8;  /* Bright indigo */
}

html.dark-mode .axis-custom-block::-webkit-scrollbar-thumb:hover {
    background: #34D399;  /* Bright green */
}

html.dark-mode .axis-custom-block:hover {
    scrollbar-color: #818CF8 rgba(255, 255, 255, 0.05);
}

html.dark-mode .axis-custom-block::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.05);
}


/* ============================================================================
   FULL-WIDTH MODE - DARK MODE
   ========================================================================== */

html.dark-mode .axis-custom-blocks-section--full {
    background: rgba(255, 255, 255, 0.01);
    border-bottom-color: rgba(255, 255, 255, 0.08);
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.05);
}


/* ============================================================================
   EARLY VIEW BADGE - DARK MODE
   ========================================================================== */

html.dark-mode .axis-badge--early-view {
    background-color: #064E3B; /* Dark green background */
    color: #6EE7B7; /* Light green text */
    border-color: #6EE7B7; /* Light green border */
}

html.dark-mode .axis-badge--early-view:hover {
    background-color: #6EE7B7;
    color: #064E3B;
}

html.dark-mode .axis-badge--early-view svg {
    stroke: #6EE7B7;
}

html.dark-mode .axis-badge--early-view:hover svg {
    stroke: #064E3B;
}


/* ============================================================================
   FORTHCOMING ISSUE PAGE - DARK MODE
   ========================================================================== */

html.dark-mode .axis-forthcoming-header {
    background: linear-gradient(135deg, 
        rgba(255, 255, 255, 0.03) 0%, 
        rgba(255, 255, 255, 0.01) 100%);
    border-color: rgba(255, 255, 255, 0.1);
}

html.dark-mode .axis-forthcoming-header .axis-page-header__icon {
    background: var(--axis-primary);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
}

html.dark-mode .axis-forthcoming-header .axis-page-header__stats {
    border-top-color: rgba(255, 255, 255, 0.1);
}


/* ============================================================================
   ARTICLE DETAIL - EARLY VIEW BADGE - DARK MODE
   ========================================================================== */

html.dark-mode .axis-badge--early-view-detail {
    background-color: #064E3B; /* Dark green background */
    color: #6EE7B7; /* Light green text */
    border-color: #6EE7B7; /* Light green border */
}

html.dark-mode .axis-badge--early-view-detail svg {
    stroke: #6EE7B7;
}

html.dark-mode .axis-badge--early-view-detail:hover {
    background-color: #6EE7B7;
    color: #064E3B;
}

html.dark-mode .axis-badge--early-view-detail:hover svg {
    stroke: #064E3B;
}


/* ============================================================================
   ARTICLE DETAIL PAGE - DARK MODE (COMPREHENSIVE)
   Matching EXACT class names from article.tpl template
   ========================================================================== */

/* Main article page wrapper */
html.dark-mode .axis-article-page {
    background: var(--axis-background);
}

/* ========== ARTICLE HEADER ========== */
html.dark-mode .axis-article-header {
    color: var(--axis-text);
}

html.dark-mode .axis-article-header__title {
    color: var(--axis-text);
}

html.dark-mode .axis-article-header__subtitle {
    color: var(--axis-text-secondary);
}

/* ========== AUTHORS ========== */
html.dark-mode .axis-article-authors {
    color: var(--axis-text);
}

html.dark-mode .axis-author-list {
    color: var(--axis-text);
}

html.dark-mode .axis-author-item {
    color: var(--axis-text);
}

html.dark-mode .axis-author-name {
    color: var(--axis-text);
}

html.dark-mode .axis-author-name sup,
html.dark-mode .axis-author-affiliation-number {
    color: var(--axis-primary);
}

html.dark-mode .axis-author-orcid {
    color: #A6CE39;
}

html.dark-mode .axis-author-orcid svg {
    fill: #A6CE39;
}

/* Affiliations */
html.dark-mode .axis-affiliation-list {
    color: var(--axis-text-secondary);
}

html.dark-mode .axis-affiliation-item {
    color: var(--axis-text-secondary);
}

html.dark-mode .axis-affiliation-number {
    color: var(--axis-primary);
}

html.dark-mode .axis-affiliation-text {
    color: var(--axis-text-secondary);
}

/* ========== BADGES ========== */
html.dark-mode .axis-article-badges {
    color: var(--axis-text);
}

html.dark-mode .axis-badge {
    background: var(--axis-surface);
    color: var(--axis-text);
    border-color: var(--axis-border);
}

html.dark-mode .axis-badge--type {
    background: rgba(129, 140, 248, 0.15);
    color: #818CF8;
    border-color: rgba(129, 140, 248, 0.3);
}

html.dark-mode .axis-badge--doi {
    background: rgba(234, 179, 8, 0.15);
    color: #FCD34D;
    border-color: rgba(234, 179, 8, 0.3);
}

html.dark-mode .axis-badge--doi a,
html.dark-mode .axis-badge--doi .axis-badge__text {
    color: #FCD34D;
}

html.dark-mode .axis-badge__icon--doi svg {
    fill: #FCD34D;
}

/* ========== ARTICLE MAIN CONTENT ========== */
html.dark-mode .axis-article-main {
    color: var(--axis-text);
}

html.dark-mode .axis-article-main p,
html.dark-mode .axis-article-main div {
    color: var(--axis-text);
}

html.dark-mode .axis-article-main hr {
    border-color: var(--axis-border);
}

/* Section titles */
html.dark-mode .axis-article-section-title {
    color: var(--axis-text);
    border-bottom-color: var(--axis-border);
}

/* ========== ABSTRACT ========== */
html.dark-mode .axis-article-abstract {
    color: var(--axis-text);
}

html.dark-mode .axis-article-abstract__content {
    color: var(--axis-text);
}

html.dark-mode .axis-article-abstract__content p {
    color: var(--axis-text);
}

/* ========== AUTHOR BIOGRAPHIES (accordion) ========== */
html.dark-mode .axis-article-author-bios {
    color: var(--axis-text);
}

html.dark-mode .axis-author-bio-accordion {
    background: rgba(255, 255, 255, 0.04);
    border-color: rgba(255, 255, 255, 0.1);
}

html.dark-mode .axis-author-bio-accordion__summary:hover {
    background: rgba(255, 255, 255, 0.06);
}

html.dark-mode .axis-author-bio-accordion[open] .axis-author-bio-accordion__summary {
    border-bottom-color: rgba(255, 255, 255, 0.1);
}

html.dark-mode .axis-author-bio-accordion__title {
    color: var(--axis-text);
}

html.dark-mode .axis-author-bio-accordion__affiliation {
    color: var(--axis-text-secondary);
}

html.dark-mode .axis-author-bio-accordion__chevron {
    color: var(--axis-text-secondary);
}

html.dark-mode .axis-author-bio-accordion__text,
html.dark-mode .axis-author-bio-accordion__text p {
    color: var(--axis-text);
}

/* ========== REFERENCES ========== */
html.dark-mode .axis-article-references {
    color: var(--axis-text);
}

html.dark-mode .axis-reference-list {
    color: var(--axis-text);
}

html.dark-mode .axis-reference-item {
    color: var(--axis-text);
    border-bottom-color: var(--axis-border);
}

html.dark-mode .axis-references-raw {
    color: var(--axis-text);
}

/* Reference toggle */
html.dark-mode .axis-reference-toggle {
    color: var(--axis-text);
}

html.dark-mode .axis-reference-toggle-btn {
    color: var(--axis-primary);
}

/* ========== CITATION ========== */
html.dark-mode .axis-article-citation {
    color: var(--axis-text);
}

html.dark-mode .axis-citation-tab-buttons {
    border-bottom-color: var(--axis-border);
}

html.dark-mode .axis-citation-tab-button {
    color: var(--axis-text-secondary);
    background: transparent;
}

html.dark-mode .axis-citation-tab-button--active {
    color: var(--axis-primary);
    background: var(--axis-surface);
    border-color: var(--axis-border);
    border-bottom-color: var(--axis-background);
}

html.dark-mode .axis-citation-output {
    background: var(--axis-surface);
    color: var(--axis-text);
    border-color: var(--axis-border);
}

html.dark-mode .axis-citation-downloads {
    border-top-color: var(--axis-border);
}

html.dark-mode .axis-citation-download-btn {
    background: var(--axis-surface);
    color: var(--axis-text);
    border-color: var(--axis-border);
}

html.dark-mode .axis-citation-download-btn:hover {
    background: var(--axis-primary);
    color: white;
    border-color: var(--axis-primary);
}

/* ========== SIDEBAR ========== */
html.dark-mode .axis-article-sidebar {
    /* No background - just border-right like reference */
}

html.dark-mode .axis-sidebar-block {
    border-bottom-color: var(--axis-border);
}

html.dark-mode .axis-sidebar-block__title {
    color: var(--axis-text-secondary);
}

html.dark-mode .axis-sidebar-block__content {
    color: var(--axis-text);
}

html.dark-mode .axis-sidebar-block__subtitle {
    color: var(--axis-text-secondary);
}

html.dark-mode .axis-sidebar-link {
    color: var(--axis-text);
}

html.dark-mode .axis-sidebar-link:hover {
    color: var(--axis-primary);
}

/* Issue cover in sidebar */
html.dark-mode .axis-issue-cover {
    border-color: var(--axis-border);
}

html.dark-mode .axis-issue-cover__image {
    border-color: var(--axis-border);
}

/* Keywords in sidebar */
html.dark-mode .axis-keywords-text {
    color: var(--axis-text);
}

/* ========== GALLEY BUTTONS ========== */
html.dark-mode .axis-galley-list {
    color: var(--axis-text);
}

html.dark-mode .axis-galley-button {
    background: var(--axis-primary);
    color: white;
    border-color: var(--axis-primary);
}

html.dark-mode .axis-galley-button:hover {
    background: var(--axis-secondary);
    border-color: var(--axis-secondary);
}

html.dark-mode .axis-galley-button--supplementary {
    background: var(--axis-surface);
    color: var(--axis-text);
    border-color: var(--axis-border);
}

html.dark-mode .axis-galley-button--supplementary:hover {
    background: var(--axis-primary);
    color: white;
    border-color: var(--axis-primary);
}

/* ========== SUPPLEMENTARY FILES ========== */
html.dark-mode .axis-supplementary-section {
    color: var(--axis-text);
}

html.dark-mode .axis-supplementary-title {
    color: var(--axis-text-secondary);
}

html.dark-mode .axis-supplementary-divider {
    border-color: var(--axis-border);
}

/* ========== METADATA ========== */
html.dark-mode .axis-metadata-item {
    color: var(--axis-text);
}

html.dark-mode .axis-metadata-label {
    color: var(--axis-text-secondary);
}

html.dark-mode .axis-metadata-value {
    color: var(--axis-text);
}

/* ========== SHARE ICONS ========== */
html.dark-mode .axis-share-inline {
    color: var(--axis-text);
}

html.dark-mode .axis-share-label {
    color: var(--axis-text-secondary);
}

html.dark-mode .axis-share-icons {
    color: var(--axis-text);
}

html.dark-mode .axis-share-icon {
    color: var(--axis-text);
    background: var(--axis-surface);
    border-color: var(--axis-border);
}

html.dark-mode .axis-share-icon:hover {
    color: var(--axis-primary);
    border-color: var(--axis-primary);
}

/* ========== CATEGORY LINKS ========== */
html.dark-mode .axis-category-inline {
    color: var(--axis-text);
}

html.dark-mode .axis-category-link-inline {
    color: var(--axis-primary);
}

html.dark-mode .axis-category-link-inline:hover {
    color: var(--axis-secondary);
}

/* ========== ARTICLE COVER IMAGE ========== */
html.dark-mode .axis-article-cover-wrapper {
    border-color: var(--axis-border);
}

html.dark-mode .axis-article-cover__image {
    border-color: var(--axis-border);
}

html.dark-mode .axis-citation-box pre,
html.dark-mode .axis-citation-box code {
    background: var(--axis-background);
    color: var(--axis-text);
}

/* Article detail meta sections */
html.dark-mode .axis-article-detail__meta,
html.dark-mode .axis-article-detail__authors {
    background: var(--axis-surface);
    border-color: var(--axis-border);
}

html.dark-mode .axis-meta-item__label {
    color: var(--axis-text-secondary);
}

html.dark-mode .axis-meta-item__value {
    color: var(--axis-text);
}

html.dark-mode .axis-meta-item__value a {
    color: var(--axis-primary);
}

/* Share buttons */
html.dark-mode .axis-share-btn {
    background: var(--axis-surface);
    color: var(--axis-text);
    border-color: var(--axis-border);
}

html.dark-mode .axis-share-btn:hover {
    background: var(--axis-primary);
    color: white;
    border-color: var(--axis-primary);
}

/* Supplementary files */
html.dark-mode .axis-supplementary-file {
    background: var(--axis-surface);
    border-color: var(--axis-border);
}

html.dark-mode .axis-supplementary-file:hover {
    border-color: var(--axis-primary);
}

/* License info */
html.dark-mode .axis-license-info {
    background: var(--axis-surface);
    color: var(--axis-text-secondary);
    border-color: var(--axis-border);
}

/* How to cite section */
html.dark-mode .axis-how-to-cite {
    background: var(--axis-surface);
    border-color: var(--axis-border);
}

html.dark-mode .axis-how-to-cite__text {
    color: var(--axis-text);
}

/* Article detail section title */
html.dark-mode .axis-article-detail__section-title {
    color: var(--axis-text);
    border-bottom-color: var(--axis-border);
}

/* Horizontal rule/divider */
html.dark-mode .axis-article-main hr {
    border-color: var(--axis-border);
}