/**
 * Index Pages Styles - Dark Theme
 * Shared styles for blog and education index pages
 */

/* Override heading colors for dark theme - Accessibility */
.bg-dark-gradient .heading-1,
.bg-dark-gradient h1 {
    color: #ffffff !important;
}

/* Ensure full height on index pages */
.bg-dark-gradient {
    min-height: 100vh;
}

/* Dark theme breadcrumb */
.bg-dark-gradient .breadcrumbs {
    background-color: #0f172a;
    border-color: rgba(255, 255, 255, 0.1);
}

.bg-dark-gradient .breadcrumbs ol {
    color: var(--dark-slate-300);
}

.bg-dark-gradient .breadcrumbs a {
    color: var(--dark-slate-300) !important;
}

.bg-dark-gradient .breadcrumbs a:hover {
    color: var(--amber-400) !important;
}

.bg-dark-gradient .breadcrumbs span {
    color: var(--dark-slate-600) !important;
}

.bg-dark-gradient .breadcrumbs [aria-current="page"] {
    color: #ffffff !important;
}

/* Article cards with dark theme */
.bg-dark-gradient .card {
    background: rgba(30, 41, 59, 0.5);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: var(--radius-lg);
    padding: var(--space-6);
    transition: all var(--transition-base);
}

.bg-dark-gradient .card:hover {
    background: rgba(30, 41, 59, 0.7);
    border-color: rgba(251, 191, 36, 0.3);
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.3);
}

/* Article card title */
.bg-dark-gradient .article-title {
    font-family: var(--font-sans);
    color: #ffffff !important;
}

.bg-dark-gradient .article-title a {
    color: #ffffff !important;
}

.bg-dark-gradient .article-title a:hover {
    color: var(--amber-400) !important;
}

/* Article date */
.bg-dark-gradient .article-date {
    font-family: var(--font-sans);
    color: var(--dark-slate-400) !important;
}

/* Article description */
.bg-dark-gradient .article-description {
    font-family: var(--font-serif);
    color: var(--dark-slate-300) !important;
}

/* Read more link */
.bg-dark-gradient .card a[href]:last-of-type {
    color: var(--amber-400) !important;
}

.bg-dark-gradient .card a[href]:last-of-type:hover {
    color: var(--amber-300) !important;
}

/* No content message */
.bg-dark-gradient .no-content-message {
    font-family: var(--font-serif);
    color: var(--dark-slate-300) !important;
}

/* Add extra spacing before footer on index pages */
.index-page-content main {
    padding-bottom: 8rem !important;
}