/* Splash — app-specific styles only. Base styles in ecosystem-base.css */

/* ── Layout overrides ─────────────────────────────────────────── */
.container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 24px;
}

.content-narrow {
    max-width: 960px;
    margin: 0 auto;
}

main {
    padding: 32px 0;
}

/* Hero: see ecosystem-components.css */
/* Buttons: see ecosystem-components.css */

/* ── btn-outline override (splash uses 2px brand-colored border) ── */
.btn-outline {
    background: transparent;
    border: 2px solid var(--brand-primary);
    color: var(--brand-primary);
}
.btn-outline:hover { background: var(--brand-primary); color: var(--text-inverse); }

/* Cards: see ecosystem-components.css */

/* ── Stat Cards (splash uses .stat-* not .eco-stat-*) ────────── */
.stat-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 16px;
    margin-bottom: 32px;
}

.stat-card {
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    padding: 20px;
    text-align: center;
    box-shadow: var(--shadow);
    position: relative;
}

.stat-value {
    font-size: 2rem;
    font-weight: 800;
    color: var(--brand-primary);
    line-height: 1.2;
}

.stat-label {
    font-size: 0.85rem;
    color: var(--text-muted);
    margin-top: 4px;
}

/* Badges: see ecosystem-components.css */
/* Forms: see ecosystem-components.css */
/* Alerts: see ecosystem-components.css */
/* Tables: see ecosystem-components.css */
/* Post Cards: see ecosystem-components.css */
/* News Cards: see ecosystem-components.css */
/* Profile Card: see ecosystem-components.css */
/* Profile View: see ecosystem-components.css */
/* Comments: see ecosystem-components.css */
/* Like Button: see ecosystem-components.css */

/* ── Pagination (splash uses .pagination not .eco-pagination) ── */
.pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-top: 32px;
}

.pagination a,
.pagination span {
    padding: 8px 14px;
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    font-size: 0.85rem;
    color: var(--text-secondary);
    text-decoration: none;
    transition: all 0.2s;
}

.pagination a:hover {
    background: var(--bg-hover);
    border-color: var(--brand-primary);
    color: var(--brand-primary);
}

.pagination .active {
    background: var(--brand-primary);
    color: var(--text-inverse);
    border-color: var(--brand-primary);
    font-weight: 600;
}

.pagination .disabled {
    opacity: 0.4;
    pointer-events: none;
}

/* Section Headers: see ecosystem-components.css */
/* Filter Bar: see ecosystem-components.css */
/* Footer styles: see ecosystem-components.css */
/* Auth Pages: see ecosystem-components.css */
/* Article / Post Body: see ecosystem-components.css */
/* Info Sections: see ecosystem-components.css */
/* Pinned indicator: see ecosystem-components.css */
/* Tags: see ecosystem-components.css */
/* Empty State: see ecosystem-components.css */

/* =================================================================
   Theme-Specific Enhancements
   ================================================================= */

/* Auth card gradient border: see ecosystem-components.css */
/* Cyber Neon btn-primary glow: see ecosystem-components.css */

/* ── Neon Spectrum Multi-color Stat Accents (splash .stat-card) ── */
[data-theme="neon-spectrum"] .stat-card:nth-child(1) .stat-value { color: #00ff88; }
[data-theme="neon-spectrum"] .stat-card:nth-child(2) .stat-value { color: #00ccff; }
[data-theme="neon-spectrum"] .stat-card:nth-child(3) .stat-value { color: #ff6600; }
[data-theme="neon-spectrum"] .stat-card:nth-child(4) .stat-value { color: #ff0066; }
[data-theme="neon-spectrum"] .stat-card:nth-child(5) .stat-value { color: #aa00ff; }

[data-theme="spectrum-holo"] .stat-card:nth-child(1) .stat-value { color: #00ff88; }
[data-theme="spectrum-holo"] .stat-card:nth-child(2) .stat-value { color: #00ccff; }
[data-theme="spectrum-holo"] .stat-card:nth-child(3) .stat-value { color: #ff6600; }
[data-theme="spectrum-holo"] .stat-card:nth-child(4) .stat-value { color: #ff0066; }
[data-theme="spectrum-holo"] .stat-card:nth-child(5) .stat-value { color: #aa00ff; }

/* ── Responsive ───────────────────────────────────────────────── */
@media (max-width: 768px) {
    .stat-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 480px) {
    .stat-grid { grid-template-columns: 1fr; }
}
