/* ========================================
   KERNTHEMEN-SEITE - SIDEBAR & RESPONSIVE FIXES
======================================== */

/* ========================================
   SIDEBAR FIXES - Entfernt Browser-Defaults
======================================== */

/* UL Element: Entferne Browser-Standard padding-left */
.sidebar-links {
    margin: 0;
    padding: 0;
    padding-left: 0 !important;
    /* Überschreibt Browser-Defaults */
    list-style: none;
}

/* LI Elemente: Kein extra Spacing */
.sidebar-links li {
    margin: 0;
    padding: 0;
    list-style: none;
}

/* Links: Kompakteres Padding */
.sidebar-links a {
    padding: var(--space-1) var(--space-2);
    /* Reduziert von space-2/space-3 */
    margin: 0;
}

/* Sidebar Container: Etwas weniger Innenabstand */
.sidebar-nav {
    padding: var(--space-3);
}

/* Sidebar Titel: Kompakter */
.sidebar-title {
    margin-bottom: var(--space-2);
    padding-bottom: var(--space-1);
}

/* ========================================
   RESPONSIVE - TABLET
======================================== */
@media (max-width: 1024px) {
    .content-wrapper {
        grid-template-columns: 1fr;
    }

    /* Sidebar nicht sticky - einfach am Anfang */
    .sidebar {
        position: static;
        margin-bottom: var(--space-4);
        background: var(--white);
        box-shadow: var(--shadow-md);
    }

    .sidebar-nav {
        padding: var(--space-3);
        border-radius: var(--radius-lg);
    }

    .sidebar-title {
        font-size: var(--text-base);
        margin-bottom: var(--space-2);
        padding-bottom: var(--space-1);
    }

    /* Vertikale Liste */
    .sidebar-links {
        flex-direction: column;
        gap: 0;
        padding: 0;
        margin: 0;
    }

    .sidebar-links li {
        margin: 0;
        padding: 0;
    }

    .sidebar-links a {
        padding: var(--space-1) var(--space-2);
        font-size: var(--text-sm);
        border-bottom: 1px solid var(--gray-100);
    }

    .sidebar-links li:last-child a {
        border-bottom: none;
    }

    /* Icons normale Größe */
    .sidebar-links a span:first-child {
        font-size: var(--text-lg);
    }
}

/* ========================================
   RESPONSIVE - MOBILE
======================================== */
@media (max-width: 768px) {

    /* Sidebar extra kompakt */
    .sidebar {
        margin-bottom: var(--space-3);
    }

    .sidebar-nav {
        padding: var(--space-2);
    }

    .sidebar-title {
        font-size: var(--text-sm);
        margin-bottom: var(--space-2);
        padding-bottom: var(--space-1);
    }

    .sidebar-links {
        padding: 0;
        margin: 0;
    }

    .sidebar-links li {
        margin: 0;
        padding: 0;
    }

    .sidebar-links a {
        padding: var(--space-1) var(--space-2);
        font-size: var(--text-xs);
    }

    .sidebar-links a span:first-child {
        font-size: var(--text-sm);
        margin-right: var(--space-1);
    }

    /* Theme Stats Grid - auf mobile stapeln */
    .theme-stats {
        grid-template-columns: 1fr !important;
    }

    /* Theme Header - Icon und Text stapeln */
    .theme-header {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    .theme-icon {
        width: 64px;
        height: 64px;
        font-size: var(--text-4xl);
    }

    .theme-header-content h2 {
        font-size: var(--text-3xl);
    }

    /* Highlight Boxen - weniger Padding */
    .theme-highlight {
        padding: var(--space-3);
    }

    .theme-highlight h4 {
        font-size: var(--text-lg);
    }

    /* Action Items - weniger Padding */
    .theme-actions {
        padding: var(--space-4);
    }

    .theme-actions h4 {
        font-size: var(--text-xl);
    }

    /* Stat Boxes - kleinere Schrift */
    .stat-number {
        font-size: var(--text-3xl);
    }

    /* Text lesbarer auf Mobile */
    .theme-text {
        font-size: var(--text-sm);
    }

    .theme-highlight p,
    .theme-actions li {
        font-size: var(--text-sm);
    }

    /* CTA Section - Buttons stapeln */
    .cta-buttons {
        flex-direction: column;
    }

    .btn-cta-primary,
    .btn-cta-secondary {
        width: 100%;
        text-align: center;
    }
}

/* ========================================
   RESPONSIVE - EXTRA KLEINE GERÄTE
======================================== */
@media (max-width: 480px) {
    .sidebar-nav {
        padding: var(--space-2);
    }

    .sidebar-title {
        font-size: var(--text-base);
    }

    .sidebar-links a {
        font-size: var(--text-xs);
        padding: var(--space-1) var(--space-2);
    }

    .theme-section {
        margin-bottom: var(--space-8);
    }

    .stat-number {
        font-size: var(--text-2xl);
    }

    .stat-label {
        font-size: var(--text-xs);
    }
}

/* ========================================
   THEME-SPEZIFISCHE ERWEITERUNGEN
   (für Wald-Artikel und ähnliche Inhalte)
======================================== */

/* Subheadings innerhalb der Theme-Artikel */
.theme-subheading {
    color: var(--petrol-main);
    font-size: var(--text-2xl);
    margin: var(--space-4) 0 var(--space-3) 0;
}

/* Feature Boxes (für detaillierte Listen wie beim Wald-Artikel) */
.theme-feature-box {
    background: var(--gray-50);
    border-radius: var(--radius-xl);
    padding: var(--space-4);
    margin: var(--space-4) 0;
}

.theme-feature-box h4 {
    color: var(--petrol-dark);
    margin-bottom: var(--space-2);
    font-size: var(--text-lg);
}

.theme-feature-box ul {
    margin-left: var(--space-4);
    color: var(--gray-700);
    line-height: 1.8;
    list-style-type: disc;
}

.theme-feature-box li {
    margin-bottom: var(--space-1);
}

/* Responsive für theme-feature-box */
@media (max-width: 768px) {
    .theme-feature-box {
        padding: var(--space-3);
    }

    .theme-feature-box h4 {
        font-size: var(--text-base);
    }

    .theme-feature-box ul {
        margin-left: var(--space-3);
        font-size: var(--text-sm);
    }
}

@media (max-width: 480px) {
    .theme-subheading {
        font-size: var(--text-xl);
    }
}