/* Dark mode variable overrides */
[data-theme="dark"] {
    --bg-dark: #0d0d0d;
    --bg-darker: #080808;
    --bg-light: #1a1a1a;
    --bg-card: #1e1e1e;
    --text-white: #ffffff;
    --text-gray: #999;
    --text-dark: #e0ddd8;
    --border-subtle: rgba(255, 255, 255, 0.12);
    --accent-orange: #e87c3e;
    --accent-green: #5a9a6e;
}

/* Body text color */
[data-theme="dark"] body {
    color: var(--text-dark);
}

/* ---- Hero info card (white bg, keep dark text) ---- */
[data-theme="dark"] .hero-info-card {
    background: rgba(30, 30, 30, 0.95);
}
[data-theme="dark"] .hero-info-card p {
    color: #e0ddd8;
}

/* ---- Content block (beige → dark) ---- */

/* ---- Blog intro ---- */
[data-theme="dark"] .blog-intro-left {
    color: var(--text-dark);
}
[data-theme="dark"] .blog-intro-title {
    color: var(--text-dark);
}

/* ---- Topic cards ---- */
[data-theme="dark"] .topic-card-body h3 {
    color: var(--text-dark);
}
[data-theme="dark"] .topic-card-body p {
    color: #999;
}
[data-theme="dark"] .topic-card-num {
    color: #555;
}

/* ---- Recommended cards ---- */
[data-theme="dark"] .rec-card-body h3 {
    color: var(--text-dark);
}
[data-theme="dark"] .rec-card-body p {
    color: #999;
}
[data-theme="dark"] .rec-card-link {
    color: var(--accent-green);
}
[data-theme="dark"] .rec-card-link img,
[data-theme="dark"] .topic-card-link img,
[data-theme="dark"] .recommended-all-link img {
    filter: invert(48%) sepia(17%) saturate(1024%) hue-rotate(95deg) brightness(93%) contrast(86%);
}

/* ---- Blog cards ---- */
[data-theme="dark"] .blog-card-title {
    color: var(--text-dark);
}
[data-theme="dark"] .blog-card-excerpt {
    color: #999;
}
[data-theme="dark"] .blog-card-date {
    color: #888;
}
[data-theme="dark"] .blog-card-date span {
    color: #888;
}
[data-theme="dark"] .blog-tag {
    background: #2a2a2a;
    color: #bbb;
}
[data-theme="dark"] .blog-card-link {
    color: var(--accent-green);
}
[data-theme="dark"] .blog-card-link img {
    filter: brightness(1.6);
}

/* ---- Blog filters ---- */
[data-theme="dark"] .tag-pill {
    background: #222;
    color: #ccc;
    border-color: #333;
}
[data-theme="dark"] .tag-pill.active,
[data-theme="dark"] .tag-pill:hover {
    background: var(--accent-green);
    color: #fff;
    border-color: var(--accent-green);
}

/* ---- Blog search ---- */
[data-theme="dark"] .blog-search-input {
    color: var(--text-dark);
}
[data-theme="dark"] .blog-search-input::placeholder {
    color: #666;
}

/* ---- About section ---- */
[data-theme="dark"] .about-team-card {
    background: #333;
    border-color: #444;
}

/* ---- Junction button ---- */
[data-theme="dark"] .junction-btn {
    background: #222;
    color: var(--text-dark);
    box-shadow: 0 6px 30px rgba(0, 0, 0, 0.5);
}

/* ---- Post page ---- */
[data-theme="dark"] .post-body {
    color: #ccc;
}
[data-theme="dark"] .post-body h2,
[data-theme="dark"] .post-body h3,
[data-theme="dark"] .post-body h4 {
    color: var(--text-dark);
}
[data-theme="dark"] .post-body blockquote {
    border-color: var(--accent-orange);
    color: #bbb;
}
[data-theme="dark"] .post-body a {
    color: var(--accent-orange);
}
[data-theme="dark"] .post-author-name {
    color: var(--text-dark);
}
[data-theme="dark"] .post-author-role {
    color: #888;
}
[data-theme="dark"] .post-meta-item {
    color: #888;
}
[data-theme="dark"] .post-meta-dot {
    background: #555;
}
[data-theme="dark"] .post-social h5 {
    color: var(--text-dark);
}
[data-theme="dark"] .post-social-icon {
    background: #222;
    border-color: #333;
}
[data-theme="dark"] .post-social-icon:hover {
    background: #333;
}
[data-theme="dark"] .post-social-icon img {
    filter: invert(0.85);
}

/* ---- Sources ---- */
[data-theme="dark"] .post-sources {
    border-color: #333;
}
[data-theme="dark"] .sources-toggle {
    color: var(--text-dark);
}
[data-theme="dark"] .sources-list a {
    color: var(--accent-orange);
}
[data-theme="dark"] .sources-list li {
    color: #999;
}

/* ---- Comments section ---- */
[data-theme="dark"] .comments-title {
    color: var(--text-dark);
}
[data-theme="dark"] .comment-avatar {
    background: #333;
    color: #ccc;
}
[data-theme="dark"] .comment-author {
    color: var(--text-dark);
}
[data-theme="dark"] .comment-date {
    color: #777;
}
[data-theme="dark"] .comment-text {
    color: #bbb;
}
[data-theme="dark"] .comment-replies {
    border-left-color: rgba(255,255,255,0.12);
}
[data-theme="dark"] .comments-list > .comment-item + .comment-item,
[data-theme="dark"] .comments-list > .comment-replies + .comment-item {
    border-top-color: rgba(255,255,255,0.08);
}
[data-theme="dark"] .comment-form-inline textarea {
    color: var(--text-dark);
}
[data-theme="dark"] .comments-show-more {
    background: rgba(255,255,255,0.06);
    border-color: rgba(255,255,255,0.1);
    color: #999;
}
[data-theme="dark"] .comments-show-more:hover {
    background: rgba(255,255,255,0.1);
    color: #e0ddd8;
}
[data-theme="dark"] .comment-form textarea {
    color: var(--text-dark);
}
[data-theme="dark"] .comment-form textarea::placeholder {
    color: #666;
}
[data-theme="dark"] .comment-login-prompt p {
    color: #999;
}
[data-theme="dark"] .comment-notice {
    background: #1a2e1f;
    border-color: #2a4a35;
    color: #8fc9a0;
}

/* ---- Related section ---- */
[data-theme="dark"] .related-header h3 {
    color: var(--text-dark);
}

/* ---- Blog section ---- */

/* ---- Inner hero (subpages) ---- */
[data-theme="dark"] .inner-hero-overlay {
    background: linear-gradient(to bottom, rgba(0,0,0,0.5), rgba(0,0,0,0.7));
}

/* ---- FAQ ---- */
[data-theme="dark"] .faq-tab {
    background: #222;
    color: #ccc;
    border-color: #333;
}
[data-theme="dark"] .faq-tab.active {
    background: var(--accent-green);
    color: #fff;
    border-color: var(--accent-green);
}
[data-theme="dark"] .faq-item {
    border-color: #2a2a2a;
}
[data-theme="dark"] .faq-question {
    color: var(--text-dark);
}
[data-theme="dark"] .faq-question:hover {
    color: var(--accent-orange);
}
[data-theme="dark"] .faq-answer-inner {
    color: #aaa;
}
[data-theme="dark"] .faq-search input {
    color: var(--text-dark);
}
[data-theme="dark"] .faq-search input::placeholder {
    color: #666;
}

/* ---- Emergency / Notfall ---- */
[data-theme="dark"] .emergency-card h3 {
    color: var(--text-dark);
}
[data-theme="dark"] .emergency-card p {
    color: #999;
}
[data-theme="dark"] .emergency-filter {
    background: #222;
    color: #ccc;
    border-color: #333;
}
[data-theme="dark"] .emergency-filter.active {
    background: var(--accent-green);
    color: #fff;
}
[data-theme="dark"] .emergency-bento-card h3 {
    color: var(--text-dark);
}

/* ---- Services / Leistungen ---- */

/* ---- Contact / Kontakt ---- */
[data-theme="dark"] .contact-bento-card h3 {
    color: var(--text-dark);
}
[data-theme="dark"] .contact-form-left h2 {
    color: var(--text-dark);
}
[data-theme="dark"] .contact-form-left p {
    color: #999;
}
[data-theme="dark"] .form-input,
[data-theme="dark"] .form-textarea {
    color: var(--text-dark);
}
[data-theme="dark"] .form-input::placeholder,
[data-theme="dark"] .form-textarea::placeholder {
    color: #666;
}
[data-theme="dark"] .form-label {
    color: #aaa;
}

/* ---- About bio page ---- */
[data-theme="dark"] .about-bio-card h2,
[data-theme="dark"] .about-bio-name {
    color: var(--text-dark);
}
[data-theme="dark"] .about-bio-card p {
    color: #aaa;
}
[data-theme="dark"] .timeline-item h3 {
    color: var(--text-dark);
}
[data-theme="dark"] .timeline-item p {
    color: #999;
}
[data-theme="dark"] .timeline-line {
    background: #555;
}

[data-theme="dark"] .about-timeline::before {
    background: rgba(255,255,255,0.25);
}
[data-theme="dark"] .timeline-dot {
    background: var(--accent-orange);
    border-color: #0e0e0e;
}

[data-theme="dark"] .timeline-marker {
    border-color: #0e0e0e;
}

[data-theme="dark"] .focus-card h3 {
    color: var(--text-dark);
}
[data-theme="dark"] .focus-card p {
    color: #999;
}

[data-theme="dark"] .about-stat-label {
    color: #999;
}


/* ---- Legal pages ---- */
[data-theme="dark"] .legal-content {
    color: #bbb;
}
[data-theme="dark"] .legal-content h2,
[data-theme="dark"] .legal-content h3 {
    color: var(--text-dark);
}

/* ---- Konto (account) ---- */
[data-theme="dark"] .post-section .container-md {
    color: var(--text-dark);
}

/* ---- Auth pages (login/register) ---- */
[data-theme="dark"] .auth-card h2 {
    color: var(--text-dark);
}
[data-theme="dark"] .auth-card label {
    color: #ccc;
}
[data-theme="dark"] .auth-card input[type="text"],
[data-theme="dark"] .auth-card input[type="email"],
[data-theme="dark"] .auth-card input[type="password"] {
    color: var(--text-dark);
}

/* ---- Carousel ---- */

/* ---- Footer ---- */
[data-theme="dark"] .footer-wrap {
    background: var(--bg-darker);
}
[data-theme="dark"] .footer-toggle {
    background: #222;
    color: var(--text-dark);
}
[data-theme="dark"] .footer-toggle:hover {
    background: #2a2a2a;
}

/* ---- Scroll to top ---- */
[data-theme="dark"] .scroll-top-float {
    background: #222;
    box-shadow: 0 4px 16px rgba(0,0,0,0.5);
}

/* ---- Dark mode toggle ---- */
.theme-toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: none;
    background: transparent;
    cursor: pointer;
    transition: background 0.2s;
    padding: 0;
    color: var(--text-white);
}
.theme-toggle:hover {
    background: rgba(255, 255, 255, 0.1);
}

.theme-toggle-icon {
    width: 18px;
    height: 18px;
    transition: transform 0.3s;
}

.theme-toggle .icon-sun { display: none; }
.theme-toggle .icon-moon { display: block; }

[data-theme="dark"] .theme-toggle .icon-sun { display: block; }
[data-theme="dark"] .theme-toggle .icon-moon { display: none; }

/* Mobile nav theme toggle (icon in lang switcher row) */
.mobile-theme-toggle .icon-sun { display: none; }
.mobile-theme-toggle .icon-moon { display: block; }
[data-theme="dark"] .mobile-theme-toggle .icon-sun { display: block; }
[data-theme="dark"] .mobile-theme-toggle .icon-moon { display: none; }

/* ---- Images in dark mode ---- */
[data-theme="dark"] .post-social-icon img,
[data-theme="dark"] .blog-search-icon,
[data-theme="dark"] .faq-search svg,
[data-theme="dark"] .blog-card-date img {
    filter: invert(0.7);
}

/* Spinning star SVG is fill="black", invert to white in dark mode */
[data-theme="dark"] .dark-text-star {
    filter: invert(1);
}

/* Dark text circles use var(--text-dark) which flips light — keep visible */
[data-theme="dark"] .dark-text-circle {
    background: #e0ddd8;
}

/* ---- CMS carousel ---- */
[data-theme="dark"] .cms-carousel-caption {
    color: #ccc;
}

/* ---- Bookmarks ---- */
[data-theme="dark"] .bookmark-btn {
    background: rgba(30, 30, 30, 0.9);
    color: #999;
}

[data-theme="dark"] .bookmark-btn:hover {
    background: #2a2a2a;
}

[data-theme="dark"] .bookmark-btn-post {
    background: none;
    border-color: var(--border-subtle);
}

[data-theme="dark"] .bookmark-btn-post:hover {
    background: rgba(255,255,255,0.05);
}

[data-theme="dark"] .saved-article-item:hover {
    background: rgba(255,255,255,0.05);
}

[data-theme="dark"] .saved-article-remove {
    background: none;
}

[data-theme="dark"] .saved-toggle-btn {
    color: var(--text-dark) !important;
    border-color: rgba(255,255,255,0.15) !important;
}

[data-theme="dark"] .saved-toggle-btn:hover {
    background: rgba(255,255,255,0.05) !important;
}

[data-theme="dark"] .my-comment-item:hover {
    background: rgba(255,255,255,0.05);
}

[data-theme="dark"] .my-comment-delete:hover {
    color: #e74c3c;
}

[data-theme="dark"] .comment-profession {
    background: rgba(255,255,255,0.08);
    color: #aaa;
}
[data-theme="dark"] .konto-card {
    background: var(--bg-light) !important;
    box-shadow: none;
}
[data-theme="dark"] .konto-card input[type="text"],
[data-theme="dark"] .konto-card input[type="email"],
[data-theme="dark"] .konto-card input[type="password"] {
    border-color: rgba(255,255,255,0.2) !important;
}
[data-theme="dark"] .konto-card--danger {
    background: #2a1a1a !important;
    border-color: #4a2020;
}

[data-theme="dark"] .comment-profession--verified {
    color: #6db87d;
    background: rgba(109,184,125,0.12);
}

[data-theme="dark"] .comment-report-btn {
    color: #777;
}
[data-theme="dark"] .comment-report-btn:hover {
    color: #e74c3c;
}
[data-theme="dark"] .comment-report-btn.reported {
    color: #e74c3c;
}

[data-theme="dark"] .emergency-email {
    color: #5a9a6e;
}
[data-theme="dark"] .emergency-email:hover {
    color: #7dbb8f;
}

[data-theme="dark"] .vote-btn {
    color: #777;
}
[data-theme="dark"] .vote-btn:hover {
    background: rgba(255,255,255,0.06);
}
[data-theme="dark"] .vote-btn-static {
    color: #666;
}

/* ---- Language switcher dark ---- */
[data-theme="dark"] .lang-switcher {
    background: rgba(255,255,255,0.08);
}

[data-theme="dark"] .lang-btn {
    color: #999;
}

[data-theme="dark"] .lang-btn:hover {
    color: #e0ddd8;
}

[data-theme="dark"] .lang-btn.active {
    background: rgba(255,255,255,0.15);
    color: #e0ddd8;
    box-shadow: none;
}

[data-theme="dark"] .theme-toggle {
    background: rgba(255,255,255,0.08);
    color: #e0ddd8;
}

[data-theme="dark"] .theme-toggle:hover {
    background: rgba(255,255,255,0.12);
}

[data-theme="dark"] .nav-account-btn {
    background: rgba(255,255,255,0.08);
    color: #e0ddd8;
}

[data-theme="dark"] .nav-account-btn:hover {
    background: rgba(255,255,255,0.12);
}

/* =============================================
   ALL PAGES: Gray backgrounds + bento cards
   Sections get gray backgrounds with visible
   card separation for visual distinction.
   ============================================= */

[data-theme="dark"] body {
    background: #1e1e1e;
}

/* Section backgrounds — gray for section distinction */
[data-theme="dark"] .content-block,
[data-theme="dark"] .blog-section,
[data-theme="dark"] .faq-section,
[data-theme="dark"] .emergency-section,
[data-theme="dark"] .emergency-bento-section,
[data-theme="dark"] .contact-bento-section,
[data-theme="dark"] .contact-form-section,
[data-theme="dark"] .services-table-section,
[data-theme="dark"] .services-cards-section,
[data-theme="dark"] .about-bio-section,
[data-theme="dark"] .about-timeline-section,
[data-theme="dark"] .about-focus-section,
[data-theme="dark"] .about-stats-section,
[data-theme="dark"] .about-callout-section,
[data-theme="dark"] .about-section,
[data-theme="dark"] .post-section,
[data-theme="dark"] .comments-section,
[data-theme="dark"] .related-section,
[data-theme="dark"] .legal-section,
[data-theme="dark"] .carousel-section,
[data-theme="dark"] .dark-text-section {
    background: #1e1e1e;
}

/* Homepage: one continuous card from content-block through dark-text-section */
[data-theme="dark"] .page-home .content-block,
[data-theme="dark"] .page-home .about-section,
[data-theme="dark"] .page-home .dark-text-section {
    background: #242424;
}
[data-theme="dark"] .about-wave-divider,
[data-theme="dark"] .about-wave-divider .wave-desktop path,
[data-theme="dark"] .about-wave-divider .wave-mobile rect,
[data-theme="dark"] .about-wave-divider .wave-mobile path {
    fill: #242424;
    background: #242424;
}

/* Rounded top on first section, rounded bottom on last */
[data-theme="dark"] .page-home .content-block {
    border-radius: 28px 28px 0 0;
}
[data-theme="dark"] .page-home .about-section {
    border-radius: 0;
}
[data-theme="dark"] .page-home .dark-text-section {
    border-radius: 0 0 28px 28px;
}

/* Cards — visible against section backgrounds */
[data-theme="dark"] .blog-card {
    background: #2e2e2e;
    border-color: #3a3a3a;
}
[data-theme="dark"] .blog-card:hover {
    background: #353535;
}
[data-theme="dark"] .emergency-card {
    background: #2e2e2e;
    border-color: #3a3a3a;
}
[data-theme="dark"] .emergency-bento-card {
    background: #2e2e2e;
}
[data-theme="dark"] .contact-bento-card {
    background: #2e2e2e;
}
[data-theme="dark"] .carousel-card {
    background: #2e2e2e;
    border-color: #3a3a3a;
}
[data-theme="dark"] .services-card {
    background: #2e2e2e;
    border-color: #3a3a3a;
}
[data-theme="dark"] .services-table-right {
    background: #2e2e2e;
}
[data-theme="dark"] .about-bio-card {
    background: #2e2e2e;
}
[data-theme="dark"] .focus-card {
    background: #2e2e2e;
    border-color: #3a3a3a;
}
[data-theme="dark"] .about-stat {
    background: #2e2e2e;
    border-color: #3a3a3a;
}
[data-theme="dark"] .about-callout {
    background: #2e2e2e;
}
[data-theme="dark"] .faq-item {
    border-color: #3a3a3a;
}
[data-theme="dark"] .comment-item {
    border-color: #3a3a3a;
}
[data-theme="dark"] .post-social-icon {
    background: #2e2e2e;
    border-color: #3a3a3a;
}
[data-theme="dark"] .post-body blockquote {
    background: #2e2e2e;
}
[data-theme="dark"] .comment-form-inline textarea,
[data-theme="dark"] .comment-form textarea {
    background: #282828;
    border-color: #3a3a3a;
}
[data-theme="dark"] .comment-login-prompt {
    background: #282828;
    border-color: #3a3a3a;
}
[data-theme="dark"] .auth-card {
    background: #2e2e2e;
}
[data-theme="dark"] .auth-card input[type="text"],
[data-theme="dark"] .auth-card input[type="email"],
[data-theme="dark"] .auth-card input[type="password"] {
    background: #232323;
    border-color: #3a3a3a;
}
[data-theme="dark"] .blog-search {
    background: #282828;
    border-color: #3a3a3a;
}
[data-theme="dark"] .faq-search {
    background: #282828;
    border-color: #3a3a3a;
}
[data-theme="dark"] .form-input,
[data-theme="dark"] .form-textarea {
    background: #282828;
    border-color: #3a3a3a;
}
[data-theme="dark"] .tag-pill {
    background: #2e2e2e;
    border-color: #3a3a3a;
}
[data-theme="dark"] .faq-tab {
    background: #2e2e2e;
    border-color: #3a3a3a;
}
[data-theme="dark"] .emergency-filter {
    background: #2e2e2e;
    border-color: #3a3a3a;
}

/* Navbar matches dark tone */
[data-theme="dark"] .navbar.scrolled {
    background: rgba(20, 20, 20, 0.92);
}

/* Footer */
[data-theme="dark"] .footer {
    background: #141414;
}

/* Timeline dot border matches section bg */
[data-theme="dark"] .timeline-dot {
    border-color: #1e1e1e;
}
[data-theme="dark"] .timeline-marker {
    border-color: #1e1e1e;
}

/* Homepage topic/rec cards need visible separation */
[data-theme="dark"] .topic-card {
    background: #2e2e2e;
    border-color: #3a3a3a;
}
[data-theme="dark"] .topic-card:hover {
    border-color: #4a4a4a;
}
[data-theme="dark"] .rec-card {
    background: #2e2e2e;
}
[data-theme="dark"] .about-card {
    background: #333;
    border-color: #444;
}