/*
 * Overdrive - modern dark gaming theme for the DDO News Portal.
 *
 * The glowing accent is the active icon pack's colour (--primary-color and its
 * derived --primary-rgb / --primary-soft / --primary-strong / --primary-contrast).
 * A second, hue-shifted accent is computed from it, so every icon pack gets its
 * own palette. This file never defines a primary colour of its own.
 *
 * Everything is scoped by [data-theme="overdrive"]. The --theme-* tokens come
 * from theme.json and are emitted by the server before this stylesheet.
 * All motion is disabled under prefers-reduced-motion.
 */

/* =========================================================
   1. Palette, Bootstrap variables and page canvas
   ========================================================= */
html[data-theme="overdrive"] {
    color-scheme: dark;
    --ov-a1: var(--primary-color);
    /* Second accent: a mix that always exists, upgraded to a real hue shift when supported. */
    --ov-a2: color-mix(in srgb, var(--primary-color) 45%, #22d3ee);
    --ov-glow: rgba(var(--primary-rgb), 0.45);
    --ov-glow-soft: rgba(var(--primary-rgb), 0.16);
    --ov-bg: var(--theme-bg, #0a0d14);
    --ov-bg-2: var(--theme-bg-2, #0f1420);
    --ov-surface: var(--theme-surface, #131a29);
    --ov-surface-2: var(--theme-surface-2, #1a2338);
    --ov-text: var(--theme-text, #e8ecf6);
    --ov-muted: var(--theme-muted, #8b96b0);
    --ov-line: var(--theme-line, rgba(255, 255, 255, 0.09));
    --ov-radius: var(--theme-radius, 14px);
    --ov-cut: var(--theme-cut, 10px);
    --ov-sans: var(--theme-font-sans, system-ui, sans-serif);
    --ov-display: var(--theme-font-display, system-ui, sans-serif);
    --ov-mono: var(--theme-font-mono, ui-monospace, monospace);

    --bs-body-bg: var(--ov-bg);
    --bs-body-color: var(--ov-text);
    --bs-body-color-rgb: 232, 236, 246;
    --bs-secondary-color: var(--ov-muted);
    --bs-tertiary-bg: var(--ov-surface);
    --bs-secondary-bg: var(--ov-surface-2);
    --bs-emphasis-color: #fff;
    --bs-border-color: var(--ov-line);
    --bs-link-color: var(--ov-a2);
    --bs-link-hover-color: #fff;
    --bs-heading-color: #fff;
}

@supports (color: oklch(from red l c h)) {
    html[data-theme="overdrive"] {
        --ov-a2: oklch(from var(--primary-color) clamp(0.7, l, 0.86) c calc(h + 70));
    }
}

[data-theme="overdrive"] body {
    background: var(--ov-bg);
    color: var(--ov-text);
    font-family: var(--ov-sans);
}

/* Ambient background: faint grid plus two slowly drifting glows, behind all content. */
[data-theme="overdrive"] body::before {
    content: "";
    position: fixed;
    inset: -20vmax;
    z-index: -1;
    pointer-events: none;
    background:
        radial-gradient(38vmax 38vmax at 12% 8%, var(--ov-glow-soft), transparent 70%),
        radial-gradient(34vmax 34vmax at 88% 92%, color-mix(in srgb, var(--ov-a2) 14%, transparent), transparent 70%),
        linear-gradient(rgba(255, 255, 255, 0.025) 1px, transparent 1px) 0 0 / 48px 48px,
        linear-gradient(90deg, rgba(255, 255, 255, 0.025) 1px, transparent 1px) 0 0 / 48px 48px;
    animation: ov-drift 40s ease-in-out infinite alternate;
}

[data-theme="overdrive"] ::selection {
    background: var(--ov-a1);
    color: var(--primary-contrast);
}

[data-theme="overdrive"] h1,
[data-theme="overdrive"] h2,
[data-theme="overdrive"] h3,
[data-theme="overdrive"] h4,
[data-theme="overdrive"] h5,
[data-theme="overdrive"] h6,
[data-theme="overdrive"] .h1,
[data-theme="overdrive"] .h2,
[data-theme="overdrive"] .h3,
[data-theme="overdrive"] .h4,
[data-theme="overdrive"] .h5,
[data-theme="overdrive"] .h6 {
    font-family: var(--ov-display);
    color: #fff;
    letter-spacing: -0.02em;
}

[data-theme="overdrive"] a {
    text-underline-offset: 0.2em;
}

[data-theme="overdrive"] .text-muted,
[data-theme="overdrive"] .text-secondary,
[data-theme="overdrive"] .text-body-secondary {
    color: var(--ov-muted) !important;
}

[data-theme="overdrive"] .text-dark,
[data-theme="overdrive"] .text-body {
    color: var(--ov-text) !important;
}

[data-theme="overdrive"] .text-primary {
    color: var(--ov-a2) !important;
}

[data-theme="overdrive"] .bg-light,
[data-theme="overdrive"] .bg-white,
[data-theme="overdrive"] .bg-body,
[data-theme="overdrive"] .bg-body-tertiary {
    background-color: var(--ov-surface) !important;
    color: var(--ov-text);
}

[data-theme="overdrive"] hr,
[data-theme="overdrive"] .border,
[data-theme="overdrive"] .border-top,
[data-theme="overdrive"] .border-bottom {
    border-color: var(--ov-line) !important;
}

/* =========================================================
   2. Frame: navbar with a flowing gradient rail, footer, menus
   ========================================================= */
[data-theme="overdrive"] .site-navbar {
    background: rgba(10, 13, 20, 0.78) !important;
    -webkit-backdrop-filter: blur(14px) saturate(1.4);
    backdrop-filter: blur(14px) saturate(1.4);
    border-bottom: 1px solid var(--ov-line);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.35);
}

[data-theme="overdrive"] .site-navbar::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1px;
    height: 2px;
    background: linear-gradient(90deg, var(--ov-a1), var(--ov-a2), var(--ov-a1), var(--ov-a2));
    background-size: 300% 100%;
    animation: ov-flow 8s linear infinite;
    box-shadow: 0 0 14px var(--ov-glow);
}

[data-theme="overdrive"] .site-navbar .nav-link {
    position: relative;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    font-size: 0.74rem;
    font-weight: 700;
    transition: color 0.2s;
}

[data-theme="overdrive"] .site-navbar .nav-link::after {
    content: "";
    position: absolute;
    left: 0.5rem;
    right: 0.5rem;
    bottom: 0.15rem;
    height: 2px;
    background: var(--ov-a1);
    box-shadow: 0 0 10px var(--ov-glow);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.25s ease;
}

[data-theme="overdrive"] .site-navbar .nav-link:hover,
[data-theme="overdrive"] .site-navbar .nav-link:focus {
    color: #fff;
}

[data-theme="overdrive"] .site-navbar .nav-link:hover::after,
[data-theme="overdrive"] .site-navbar .nav-link:focus::after {
    transform: scaleX(1);
}

[data-theme="overdrive"] .navbar .form-control {
    background: var(--ov-surface);
    color: var(--ov-text);
    border: 1px solid var(--ov-line);
    border-radius: 10px 0 0 10px;
}

[data-theme="overdrive"] .navbar .btn-light,
[data-theme="overdrive"] .navbar .btn-outline-light {
    background: var(--ov-surface-2);
    color: var(--ov-text);
    border: 1px solid var(--ov-line);
    border-radius: 0 10px 10px 0;
}

[data-theme="overdrive"] .site-footer {
    position: relative;
    background: linear-gradient(180deg, var(--ov-bg-2), #05070c);
    border-top: 1px solid var(--ov-line);
}

[data-theme="overdrive"] .site-footer::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: -1px;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--ov-a1), var(--ov-a2), transparent);
    opacity: 0.8;
}

[data-theme="overdrive"] .footer-top {
    border-bottom-color: var(--ov-line);
}

[data-theme="overdrive"] .footer-social a {
    color: var(--ov-muted);
    transition: color 0.2s, transform 0.2s, text-shadow 0.2s;
}

[data-theme="overdrive"] .footer-social a:hover {
    color: var(--ov-a1);
    transform: translateY(-2px);
    text-shadow: 0 0 12px var(--ov-glow);
}

[data-theme="overdrive"] .footer-cats-label,
[data-theme="overdrive"] .footer-copy,
[data-theme="overdrive"] .footer-built {
    color: var(--ov-muted);
}

[data-theme="overdrive"] .dropdown-menu,
[data-theme="overdrive"] .category-mega-menu,
[data-theme="overdrive"] .search-dropdown {
    background: var(--ov-surface);
    color: var(--ov-text);
    border: 1px solid var(--ov-line);
    border-top: 2px solid var(--ov-a1);
    border-radius: 0 0 var(--ov-radius) var(--ov-radius);
    box-shadow: 0 24px 50px rgba(0, 0, 0, 0.55), 0 0 0 1px rgba(255, 255, 255, 0.02);
}

[data-theme="overdrive"] .dropdown-item {
    color: var(--ov-text);
}

[data-theme="overdrive"] .dropdown-item:hover,
[data-theme="overdrive"] .dropdown-item:focus {
    background: var(--ov-glow-soft);
    color: #fff;
}

[data-theme="overdrive"] .category-mega-search .input-group-text,
[data-theme="overdrive"] .search-dropdown-section-title {
    background: var(--ov-surface-2);
    color: var(--ov-muted);
    border-color: var(--ov-line);
}

[data-theme="overdrive"] .user-nav-name {
    color: var(--ov-text);
}

[data-theme="overdrive"] .user-nav-email {
    color: var(--ov-muted);
}

/* =========================================================
   3. Section headings, kickers and badges
   ========================================================= */
[data-theme="overdrive"] .section-header {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    border: 0;
    padding: 0 0 0.6rem;
    border-bottom: 1px solid var(--ov-line);
    position: relative;
}

[data-theme="overdrive"] .section-header::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -1px;
    width: 4.5rem;
    height: 2px;
    background: linear-gradient(90deg, var(--ov-a1), var(--ov-a2));
    box-shadow: 0 0 12px var(--ov-glow);
}

[data-theme="overdrive"] .section-title {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    font-family: var(--ov-display);
    font-size: 1.05rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #fff;
}

[data-theme="overdrive"] .section-title::before {
    content: "";
    flex: none;
    width: 0.62rem;
    height: 0.62rem;
    background: var(--ov-a1);
    transform: rotate(45deg);
    box-shadow: 0 0 12px var(--ov-glow);
    animation: ov-pulse 2.6s ease-in-out infinite;
}

[data-theme="overdrive"] .section-title .text-primary {
    color: var(--ov-a2) !important;
}

[data-theme="overdrive"] .section-divider {
    height: 1px;
    border: 0;
    opacity: 1;
    background: linear-gradient(90deg, transparent, var(--ov-line) 20%, var(--ov-line) 80%, transparent);
}

[data-theme="overdrive"] .latest-badge,
[data-theme="overdrive"] .hero-badge,
[data-theme="overdrive"] .art-tag {
    border-radius: 0;
    clip-path: polygon(0 0, calc(100% - 6px) 0, 100% 6px, 100% 100%, 6px 100%, 0 calc(100% - 6px));
    font-family: var(--ov-mono);
    font-size: 0.64rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    padding: 0.3em 0.85em;
    border: 0;
}

[data-theme="overdrive"] .latest-badge,
[data-theme="overdrive"] .hero-badge-cat {
    background: linear-gradient(135deg, var(--ov-a1), color-mix(in srgb, var(--ov-a1) 55%, var(--ov-a2)));
    color: var(--primary-contrast);
}

[data-theme="overdrive"] .hero-badge-live {
    animation: ov-live 1.6s ease-in-out infinite;
}

[data-theme="overdrive"] .art-tag {
    background: var(--ov-surface-2);
    color: var(--ov-text);
    transition: background 0.2s, color 0.2s, box-shadow 0.2s;
}

[data-theme="overdrive"] .art-tag:hover {
    background: var(--ov-a1);
    color: var(--primary-contrast);
    box-shadow: 0 0 18px var(--ov-glow);
}

/* =========================================================
   4. Home: headlines, cards, listings
   ========================================================= */
[data-theme="overdrive"] .latest-main-title,
[data-theme="overdrive"] .latest-small-title,
[data-theme="overdrive"] .popular-title,
[data-theme="overdrive"] .top-story-title,
[data-theme="overdrive"] .listing-title,
[data-theme="overdrive"] .article-row-title,
[data-theme="overdrive"] .art-pn-link,
[data-theme="overdrive"] .listing-count-num {
    color: #fff;
    font-family: var(--ov-display);
    font-weight: 800;
    letter-spacing: -0.015em;
    transition: color 0.2s, text-shadow 0.2s;
}

[data-theme="overdrive"] .latest-main-summary,
[data-theme="overdrive"] .listing-summary,
[data-theme="overdrive"] .article-row-summary,
[data-theme="overdrive"] .top-story-summary,
[data-theme="overdrive"] .latest-meta-author,
[data-theme="overdrive"] .art-hero-deck {
    color: var(--ov-muted);
}

[data-theme="overdrive"] .latest-meta,
[data-theme="overdrive"] .listing-meta-top,
[data-theme="overdrive"] .hero-meta {
    font-family: var(--ov-mono);
    font-size: 0.68rem;
    letter-spacing: 0.05em;
    color: var(--ov-muted);
}

[data-theme="overdrive"] .latest-main,
[data-theme="overdrive"] .latest-small-col > *,
[data-theme="overdrive"] .top-story-row,
[data-theme="overdrive"] .popular-item {
    transition: transform 0.25s ease, filter 0.25s ease;
}

[data-theme="overdrive"] .latest-main-img-wrap,
[data-theme="overdrive"] .latest-small-col a > div:first-child,
[data-theme="overdrive"] .top-story-thumb {
    border-radius: var(--ov-radius);
    overflow: hidden;
    position: relative;
    box-shadow: 0 0 0 1px var(--ov-line);
    transition: box-shadow 0.3s ease, transform 0.3s ease;
}

[data-theme="overdrive"] a:hover > .latest-main-img-wrap,
[data-theme="overdrive"] a:hover .top-story-thumb,
[data-theme="overdrive"] .latest-main:hover .latest-main-img-wrap {
    box-shadow: 0 0 0 1px var(--ov-a1), 0 14px 40px var(--ov-glow-soft), 0 0 30px var(--ov-glow-soft);
    transform: translateY(-3px);
}

[data-theme="overdrive"] .latest-main:hover .latest-main-title,
[data-theme="overdrive"] a:hover .latest-small-title,
[data-theme="overdrive"] a:hover .popular-title,
[data-theme="overdrive"] .top-story-row:hover .top-story-title,
[data-theme="overdrive"] .listing-row:hover .listing-title,
[data-theme="overdrive"] .article-row:hover .article-row-title {
    color: var(--ov-a2);
    text-shadow: 0 0 22px var(--ov-glow-soft);
}

[data-theme="overdrive"] .latest-main-img,
[data-theme="overdrive"] .latest-small-img,
[data-theme="overdrive"] .top-story-thumb img,
[data-theme="overdrive"] .popular-thumb img,
[data-theme="overdrive"] .listing-thumb,
[data-theme="overdrive"] .article-row-img,
[data-theme="overdrive"] .art-rel-img {
    transition: transform 0.5s ease, filter 0.3s ease;
}

[data-theme="overdrive"] a:hover .latest-main-img,
[data-theme="overdrive"] a:hover .latest-small-img,
[data-theme="overdrive"] .top-story-row:hover .top-story-thumb img,
[data-theme="overdrive"] .listing-row:hover .listing-thumb,
[data-theme="overdrive"] .article-row:hover .article-row-img {
    transform: scale(1.05);
    filter: saturate(1.18) brightness(1.08);
}

[data-theme="overdrive"] .hero-ticker {
    background: linear-gradient(90deg, var(--ov-surface), var(--ov-bg-2));
    border-bottom: 1px solid var(--ov-line);
    color: var(--ov-muted);
    font-family: var(--ov-mono);
}

[data-theme="overdrive"] .hero-card {
    border-radius: 0;
}

[data-theme="overdrive"] .hero-title-main,
[data-theme="overdrive"] .hero-title-side {
    font-family: var(--ov-display);
    font-weight: 800;
    letter-spacing: -0.02em;
    text-shadow: 0 2px 24px rgba(0, 0, 0, 0.6);
}

[data-theme="overdrive"] .hero-overlay {
    background: linear-gradient(180deg, transparent 30%, rgba(10, 13, 20, 0.92) 100%);
}

[data-theme="overdrive"] .hero-read-link {
    color: var(--ov-a2);
    text-shadow: 0 0 14px var(--ov-glow-soft);
}

[data-theme="overdrive"] .listing-row {
    border-bottom: 1px solid var(--ov-line);
    padding: 1.25rem 0.9rem;
    margin: 0 -0.9rem;
    border-radius: var(--ov-radius);
    transition: background 0.25s ease, box-shadow 0.25s ease;
}

[data-theme="overdrive"] .listing-row:first-child {
    padding-top: 1.25rem;
}

[data-theme="overdrive"] .listing-row:hover {
    opacity: 1;
    background: linear-gradient(90deg, var(--ov-glow-soft), transparent 60%);
    box-shadow: inset 3px 0 0 var(--ov-a1);
}

[data-theme="overdrive"] .listing-thumb,
[data-theme="overdrive"] .article-row-img {
    border-radius: 10px;
}

[data-theme="overdrive"] .listing-thumb-placeholder {
    background: var(--ov-surface-2);
    color: var(--ov-muted);
    border-radius: 10px;
}

/* Listing header bar (category, author, tag, search): every configured style becomes dark */
[data-theme="overdrive"] .listing-hero,
[data-theme="overdrive"] .listing-hero-light-borderless-compact,
[data-theme="overdrive"] .listing-hero-floating-light .listing-hero-inner,
[data-theme="overdrive"] .module-hero {
    background:
        radial-gradient(60rem 14rem at 10% 0%, var(--ov-glow-soft), transparent 70%),
        linear-gradient(180deg, var(--ov-bg-2), var(--ov-bg));
    border-bottom: 1px solid var(--ov-line);
    position: relative;
}

[data-theme="overdrive"] .listing-hero::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1px;
    height: 2px;
    background: linear-gradient(90deg, var(--ov-a1), var(--ov-a2), transparent 75%);
    box-shadow: 0 0 16px var(--ov-glow);
}

[data-theme="overdrive"] .listing-hero-title,
[data-theme="overdrive"] .listing-hero-light-borderless-compact .listing-hero-title,
[data-theme="overdrive"] .listing-hero-floating-light .listing-hero-title {
    color: #fff;
    font-family: var(--ov-display);
    font-weight: 800;
    letter-spacing: -0.03em;
}

[data-theme="overdrive"] .listing-hero-sub,
[data-theme="overdrive"] .module-hero p,
[data-theme="overdrive"] .listing-hero-light-borderless-compact .listing-hero-sub,
[data-theme="overdrive"] .art-breadcrumb,
[data-theme="overdrive"] .listing-hero-light-borderless-compact .art-breadcrumb,
[data-theme="overdrive"] .listing-hero-floating-light .art-breadcrumb,
[data-theme="overdrive"] .page-breadcrumb-plain {
    color: var(--ov-muted);
}

[data-theme="overdrive"] .art-breadcrumb a,
[data-theme="overdrive"] .listing-hero-light-borderless-compact .art-breadcrumb a,
[data-theme="overdrive"] .listing-hero-floating-light .art-breadcrumb a,
[data-theme="overdrive"] .page-breadcrumb-plain a {
    color: var(--ov-text);
}

[data-theme="overdrive"] .listing-search-input {
    background: var(--ov-surface);
    border: 1px solid var(--ov-line);
    color: var(--ov-text);
    border-radius: 10px;
}

/* Cards, category tiles, sidebars */
[data-theme="overdrive"] .card,
[data-theme="overdrive"] .list-group-item,
[data-theme="overdrive"] .search-sidebar-inner,
[data-theme="overdrive"] .page-sidebar-mobile-trigger {
    background: var(--ov-surface);
    color: var(--ov-text);
    border: 1px solid var(--ov-line);
    border-radius: var(--ov-radius);
    box-shadow: none;
}

[data-theme="overdrive"] .category-card,
[data-theme="overdrive"] .category-card.bg-light {
    background: var(--ov-surface) !important;
    border: 1px solid var(--ov-line) !important;
    border-radius: var(--ov-radius);
    transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

[data-theme="overdrive"] .category-card:hover {
    background-color: var(--ov-surface-2) !important;
    border-color: var(--ov-a1) !important;
    transform: translateY(-4px);
    box-shadow: 0 16px 40px var(--ov-glow-soft), 0 0 24px var(--ov-glow-soft);
}

[data-theme="overdrive"] .category-card .card-title,
[data-theme="overdrive"] .category-card .text-dark {
    color: #fff !important;
}

[data-theme="overdrive"] .search-cat-item,
[data-theme="overdrive"] .page-sidebar-leaf {
    color: var(--ov-text);
    border-radius: 10px;
    transition: background 0.2s, box-shadow 0.2s;
}

[data-theme="overdrive"] .search-cat-item:hover:not(:disabled),
[data-theme="overdrive"] .page-sidebar-leaf:hover {
    background: var(--ov-glow-soft);
}

[data-theme="overdrive"] .search-cat-active,
[data-theme="overdrive"] .search-cat-item.search-cat-active {
    background: var(--ov-glow-soft);
    color: #fff;
    font-weight: 700;
    box-shadow: inset 3px 0 0 var(--ov-a1);
}

[data-theme="overdrive"] .search-cat-count {
    font-family: var(--ov-mono);
    color: var(--ov-muted);
}

/* =========================================================
   5. Article page
   ========================================================= */
[data-theme="overdrive"] .art-hero-title {
    font-family: var(--ov-display);
    font-weight: 800;
    letter-spacing: -0.03em;
    text-shadow: 0 4px 40px rgba(0, 0, 0, 0.7);
}

[data-theme="overdrive"] .art-hero-overlay {
    background: linear-gradient(180deg, rgba(10, 13, 20, 0.15) 0%, rgba(10, 13, 20, 0.95) 100%);
}

[data-theme="overdrive"] .article-content {
    color: #d5dbea;
    font-size: 1.08rem;
    line-height: 1.85;
}

[data-theme="overdrive"] .article-content h2,
[data-theme="overdrive"] .article-content h3,
[data-theme="overdrive"] .article-content h4 {
    color: #fff;
    font-family: var(--ov-display);
    font-weight: 800;
    letter-spacing: -0.02em;
}

[data-theme="overdrive"] .article-content h2 {
    display: flex;
    align-items: center;
    gap: 0.6rem;
}

[data-theme="overdrive"] .article-content h2::before {
    content: "";
    flex: none;
    width: 0.5rem;
    height: 1.1em;
    background: linear-gradient(180deg, var(--ov-a1), var(--ov-a2));
    box-shadow: 0 0 14px var(--ov-glow);
}

[data-theme="overdrive"] .article-content a {
    color: var(--ov-a2);
    text-decoration: none;
    background: linear-gradient(currentColor, currentColor) 0 100% / 0 1px no-repeat;
    transition: background-size 0.3s ease, color 0.2s;
}

[data-theme="overdrive"] .article-content a:hover {
    color: #fff;
    background-size: 100% 1px;
}

[data-theme="overdrive"] .article-content blockquote {
    background: linear-gradient(90deg, var(--ov-glow-soft), transparent);
    border-left: 3px solid var(--ov-a1);
    color: #fff;
    border-radius: 0 var(--ov-radius) var(--ov-radius) 0;
}

[data-theme="overdrive"] .article-content code {
    background: var(--ov-surface-2);
    color: var(--ov-a2);
    border-radius: 6px;
    font-family: var(--ov-mono);
}

[data-theme="overdrive"] .article-content pre,
[data-theme="overdrive"] .article-content pre code.hljs,
[data-theme="overdrive"] .hljs {
    background: #0b111d;
    color: #d5dbea;
    border-radius: var(--ov-radius);
}

[data-theme="overdrive"] .article-content pre {
    border: 1px solid var(--ov-line);
}

[data-theme="overdrive"] .article-content table,
[data-theme="overdrive"] .table {
    --bs-table-bg: transparent;
    --bs-table-color: var(--ov-text);
    --bs-table-border-color: var(--ov-line);
    --bs-table-striped-bg: rgba(255, 255, 255, 0.03);
    color: var(--ov-text);
}

[data-theme="overdrive"] .article-content th {
    background: var(--ov-surface-2);
    color: #fff;
}

[data-theme="overdrive"] .article-content img,
[data-theme="overdrive"] .article-content figure img {
    border-radius: var(--ov-radius);
}

[data-theme="overdrive"] .article-content figcaption {
    color: var(--ov-muted);
    font-family: var(--ov-mono);
    font-size: 0.75rem;
}

[data-theme="overdrive"] .art-banner,
[data-theme="overdrive"] .art-banner-horizontal {
    background: var(--ov-surface);
    border: 1px dashed var(--ov-line);
    border-radius: var(--ov-radius);
}

[data-theme="overdrive"] .art-toc-title,
[data-theme="overdrive"] .art-related-title,
[data-theme="overdrive"] .art-tags-label,
[data-theme="overdrive"] .art-share-label {
    font-family: var(--ov-mono);
    font-size: 0.7rem;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--ov-muted);
}

[data-theme="overdrive"] .art-toc-link {
    color: var(--ov-muted);
    transition: color 0.2s, padding-left 0.2s;
}

[data-theme="overdrive"] .art-toc-link:hover,
[data-theme="overdrive"] .art-toc-link.active {
    color: var(--ov-a2);
    padding-left: 0.3rem;
}

[data-theme="overdrive"] .art-share-btn {
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

[data-theme="overdrive"] .art-share-btn:hover {
    transform: translateY(-3px) scale(1.06);
    box-shadow: 0 8px 24px var(--ov-glow-soft);
}

[data-theme="overdrive"] .art-pn-arrow {
    background: var(--ov-a1);
    color: var(--primary-contrast);
    transition: box-shadow 0.2s, transform 0.2s;
}

[data-theme="overdrive"] .art-pn-link:hover .art-pn-arrow {
    box-shadow: 0 0 18px var(--ov-glow);
    transform: scale(1.08);
}

[data-theme="overdrive"] .art-rel-card {
    border-radius: var(--ov-radius);
    overflow: hidden;
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

[data-theme="overdrive"] .art-rel-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 0 0 1px var(--ov-a1), 0 16px 40px var(--ov-glow-soft);
}

/* Dividers that style.css draws in light greys */
[data-theme="overdrive"] .art-tags,
[data-theme="overdrive"] .art-prevnext,
[data-theme="overdrive"] .comments-section,
[data-theme="overdrive"] .art-related {
    border-color: var(--ov-line);
}

[data-theme="overdrive"] .art-tags-label,
[data-theme="overdrive"] .art-related-title {
    color: var(--ov-muted);
}

/* Comments */
[data-theme="overdrive"] .comments-section h2,
[data-theme="overdrive"] .comment-author {
    color: #fff;
}

[data-theme="overdrive"] .comment-content {
    color: var(--ov-text);
}

[data-theme="overdrive"] .comment-time,
[data-theme="overdrive"] .comment-login-hint {
    color: var(--ov-muted);
}

[data-theme="overdrive"] .comment-form-wrap,
[data-theme="overdrive"] .comment-body {
    background: var(--ov-surface);
    border: 1px solid var(--ov-line);
    border-radius: var(--ov-radius);
}

[data-theme="overdrive"] .reply-hint {
    background: var(--ov-glow-soft);
    color: var(--ov-text);
}

/* =========================================================
   6. Controls
   ========================================================= */
[data-theme="overdrive"] .btn {
    position: relative;
    overflow: hidden;
    border-radius: 0;
    clip-path: polygon(0 0, calc(100% - var(--ov-cut)) 0, 100% var(--ov-cut), 100% 100%, var(--ov-cut) 100%, 0 calc(100% - var(--ov-cut)));
    font-family: var(--ov-display);
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    font-size: 0.78rem;
    transition: transform 0.2s ease, filter 0.2s ease, background 0.2s, color 0.2s;
}

[data-theme="overdrive"] .btn:hover {
    transform: translateY(-1px);
}

[data-theme="overdrive"] .btn::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: -60%;
    width: 40%;
    background: linear-gradient(100deg, transparent, rgba(255, 255, 255, 0.35), transparent);
    transform: skewX(-20deg);
    transition: none;
    pointer-events: none;
}

[data-theme="overdrive"] .btn:hover::after {
    animation: ov-shimmer 0.9s ease;
}

[data-theme="overdrive"] .btn-primary {
    background: linear-gradient(135deg, var(--ov-a1), color-mix(in srgb, var(--ov-a1) 60%, var(--ov-a2)));
    border: 0;
    color: var(--primary-contrast);
    filter: drop-shadow(0 0 12px var(--ov-glow-soft));
}

[data-theme="overdrive"] .btn-primary:hover,
[data-theme="overdrive"] .btn-primary:focus {
    color: var(--primary-contrast);
    filter: drop-shadow(0 0 18px var(--ov-glow)) brightness(1.08);
}

[data-theme="overdrive"] .btn-outline-primary,
[data-theme="overdrive"] .btn-outline-secondary,
[data-theme="overdrive"] .btn-outline-dark {
    background: var(--ov-surface);
    color: var(--ov-text);
    border-color: var(--ov-line);
    box-shadow: inset 0 0 0 1px var(--ov-a1);
    border-width: 0;
}

[data-theme="overdrive"] .btn-outline-primary:hover,
[data-theme="overdrive"] .btn-outline-secondary:hover,
[data-theme="overdrive"] .btn-outline-dark:hover {
    background: var(--ov-glow-soft);
    color: #fff;
}

[data-theme="overdrive"] .form-control,
[data-theme="overdrive"] .form-select,
[data-theme="overdrive"] .input-group-text,
[data-theme="overdrive"] textarea {
    background-color: var(--ov-surface);
    color: var(--ov-text);
    border: 1px solid var(--ov-line);
    border-radius: 10px;
}

[data-theme="overdrive"] .form-control::placeholder {
    color: var(--ov-muted);
}

[data-theme="overdrive"] .form-control:focus,
[data-theme="overdrive"] .form-select:focus {
    background-color: var(--ov-surface-2);
    color: #fff;
    border-color: var(--ov-a1);
    box-shadow: 0 0 0 0.2rem var(--ov-glow-soft), 0 0 20px var(--ov-glow-soft);
}

[data-theme="overdrive"] .pagination {
    --bs-pagination-bg: var(--ov-surface);
    --bs-pagination-color: var(--ov-text);
    --bs-pagination-border-color: var(--ov-line);
    --bs-pagination-hover-bg: var(--ov-glow-soft);
    --bs-pagination-hover-color: #fff;
    --bs-pagination-hover-border-color: var(--ov-a1);
    --bs-pagination-active-bg: var(--ov-a1);
    --bs-pagination-active-color: var(--primary-contrast);
    --bs-pagination-active-border-color: var(--ov-a1);
    --bs-pagination-disabled-bg: var(--ov-bg-2);
    --bs-pagination-disabled-color: var(--ov-muted);
    --bs-pagination-disabled-border-color: var(--ov-line);
    --bs-pagination-border-radius: 10px;
    gap: 0.3rem;
}

[data-theme="overdrive"] .page-link {
    border-radius: 10px !important;
    font-family: var(--ov-mono);
}

[data-theme="overdrive"] .alert {
    background: var(--ov-surface);
    color: var(--ov-text);
    border: 1px solid var(--ov-line);
    border-radius: var(--ov-radius);
}

[data-theme="overdrive"] .badge.bg-light,
[data-theme="overdrive"] .badge.text-bg-light {
    background: var(--ov-surface-2) !important;
    color: var(--ov-text) !important;
}

[data-theme="overdrive"] .cookie-consent-card,
[data-theme="overdrive"] .cookie-provider-option {
    background: var(--ov-surface);
    color: var(--ov-text);
    border: 1px solid var(--ov-line);
    border-radius: var(--ov-radius);
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.6);
}

[data-theme="overdrive"] .cookie-consent-copy {
    color: var(--ov-text);
}

[data-theme="overdrive"] .cookie-provider-option small {
    color: var(--ov-muted);
}

/* Shared with the module pages (forum, marketplace, aggregator) so the dark frame stays coherent */
[data-theme="overdrive"] .forum-topic-header,
[data-theme="overdrive"] .forum-reply,
[data-theme="overdrive"] .forum-board-head,
[data-theme="overdrive"] .forum-section-row,
[data-theme="overdrive"] .forum-post aside {
    background: var(--ov-surface);
    color: var(--ov-text);
    border-color: var(--ov-line);
}

[data-theme="overdrive"] .forum-section-row,
[data-theme="overdrive"] .forum-category-row,
[data-theme="overdrive"] .forum-topic-row {
    color: var(--ov-text);
}

[data-theme="overdrive"] .forum-topic-row:hover {
    background: var(--ov-glow-soft);
}

[data-theme="overdrive"] .forum-topic-row small,
[data-theme="overdrive"] .forum-topic-stats,
[data-theme="overdrive"] .forum-topic-last,
[data-theme="overdrive"] .forum-empty,
[data-theme="overdrive"] .forum-board-head {
    color: var(--ov-muted);
}

/* =========================================================
   7. Motion
   ========================================================= */
@keyframes ov-flow {
    to { background-position: 300% 0; }
}

@keyframes ov-drift {
    from { transform: translate3d(0, 0, 0) scale(1); }
    to { transform: translate3d(-3vmax, 2vmax, 0) scale(1.08); }
}

@keyframes ov-pulse {
    0%, 100% { transform: rotate(45deg) scale(1); opacity: 1; }
    50% { transform: rotate(45deg) scale(0.7); opacity: 0.55; }
}

@keyframes ov-live {
    0%, 100% { box-shadow: 0 0 0 0 rgba(230, 57, 70, 0.55); }
    50% { box-shadow: 0 0 0 7px rgba(230, 57, 70, 0); }
}

@keyframes ov-shimmer {
    from { left: -60%; }
    to { left: 130%; }
}

@keyframes ov-rise {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: none; }
}

@keyframes ov-progress {
    from { transform: scaleX(0); }
    to { transform: scaleX(1); }
}

/* Staggered entrance for the main content blocks */
[data-theme="overdrive"] .latest-main,
[data-theme="overdrive"] .latest-small-col,
[data-theme="overdrive"] .top-story-row,
[data-theme="overdrive"] .popular-item,
[data-theme="overdrive"] .listing-row,
[data-theme="overdrive"] .article-row,
[data-theme="overdrive"] .category-card,
[data-theme="overdrive"] .art-rel-card {
    animation: ov-rise 0.6s cubic-bezier(0.2, 0.7, 0.2, 1) both;
}

[data-theme="overdrive"] .latest-small-col:nth-child(2),
[data-theme="overdrive"] .top-story-row:nth-child(2),
[data-theme="overdrive"] .listing-row:nth-child(2),
[data-theme="overdrive"] .article-row:nth-child(2) { animation-delay: 0.07s; }
[data-theme="overdrive"] .latest-small-col:nth-child(3),
[data-theme="overdrive"] .top-story-row:nth-child(3),
[data-theme="overdrive"] .listing-row:nth-child(3),
[data-theme="overdrive"] .article-row:nth-child(3) { animation-delay: 0.14s; }
[data-theme="overdrive"] .latest-small-col:nth-child(4),
[data-theme="overdrive"] .top-story-row:nth-child(4),
[data-theme="overdrive"] .listing-row:nth-child(4),
[data-theme="overdrive"] .article-row:nth-child(4) { animation-delay: 0.21s; }
[data-theme="overdrive"] .top-story-row:nth-child(5),
[data-theme="overdrive"] .listing-row:nth-child(5),
[data-theme="overdrive"] .article-row:nth-child(5) { animation-delay: 0.28s; }
[data-theme="overdrive"] .listing-row:nth-child(n+6),
[data-theme="overdrive"] .article-row:nth-child(n+6) { animation-delay: 0.35s; }

/* Reading progress bar on browsers with scroll-driven animations */
@supports (animation-timeline: scroll()) {
    [data-theme="overdrive"] body:has(.article-content)::after {
        content: "";
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        height: 3px;
        z-index: 2000;
        background: linear-gradient(90deg, var(--ov-a1), var(--ov-a2));
        box-shadow: 0 0 12px var(--ov-glow);
        transform-origin: left;
        transform: scaleX(0);
        animation: ov-progress linear both;
        animation-timeline: scroll(root block);
    }
}

@media (max-width: 767.98px) {
    [data-theme="overdrive"] .listing-row {
        margin: 0;
        padding: 1rem 0.5rem;
    }

    [data-theme="overdrive"] .section-title {
        font-size: 0.95rem;
        letter-spacing: 0.08em;
    }
}

@media (prefers-reduced-motion: reduce) {
    [data-theme="overdrive"] *,
    [data-theme="overdrive"] *::before,
    [data-theme="overdrive"] *::after {
        animation: none !important;
        transition: none !important;
        scroll-behavior: auto !important;
    }
}