/**
 * Cassiopeia Dark Mode - Korrigierte Version
 * Speicherort: /media/templates/site/cassiopeia/css/user.css
 */

/* System-Dark-Mode (Browser/OS Preference) */
@media (prefers-color-scheme: dark) {
    :root {
        --cassiopeia-dark-bg: #1a1e24;
        --cassiopeia-dark-surface: #252a33;
        --cassiopeia-dark-surface-hover: #2f3540;
        --cassiopeia-dark-text: #e0e0e0;
        --cassiopeia-dark-text-muted: #a0a5ad;
        --cassiopeia-dark-border: #3a4050;
        --cassiopeia-dark-primary: #6ea8fe;
        --cassiopeia-dark-primary-hover: #5c9af0;
    }

    body {
        background-color: var(--cassiopeia-dark-bg);
        color: var(--cassiopeia-dark-text);
    }

    /* ALLE Module und deren Inhalte auf helle Schrift erzwingen */
    .moduletable,
    .module,
    .mod-custom,
    .moduletable *:not(.btn-primary):not(.btn-danger),
    .module *:not(.btn-primary):not(.btn-danger) {
        color: var(--cassiopeia-dark-text);
    }

    /* Header & Navigation */
    .header,
    .container-header,
    nav.navbar {
        background-color: var(--cassiopeia-dark-surface) !important;
        border-bottom: 1px solid var(--cassiopeia-dark-border);
    }

    /* Cards & Content Boxes */
    .card,
    .moduletable,
    .blog-item,
    .item-page,
    .com-content-article {
        background-color: var(--cassiopeia-dark-surface);
        border-color: var(--cassiopeia-dark-border);
    }

    /* Modul-Header */
    .moduletable h1,
    .moduletable h2,
    .moduletable h3,
    .moduletable h4,
    .moduletable h5,
    .moduletable h6,
    .card-header,
    .card-title {
        color: #ffffff !important;
    }

    /* Modul-Inhalte (Listen, Texte, etc.) */
    .moduletable p,
    .moduletable li,
    .moduletable span:not(.badge),
    .moduletable div:not(.btn),
    .latest-news li,
    .mod-articlesnews li,
    .mod-relateditems li {
        color: var(--cassiopeia-dark-text) !important;
    }

    /* Modul-Links */
    .moduletable a:not(.btn),
    .module a:not(.btn) {
        color: var(--cassiopeia-dark-primary) !important;
    }

    .moduletable a:not(.btn):hover,
    .module a:not(.btn):hover {
        color: var(--cassiopeia-dark-primary-hover) !important;
    }

    /* Typography */
    h1, h2, h3, h4, h5, h6,
    .h1, .h2, .h3, .h4, .h5, .h6 {
        color: #ffffff;
    }

    /* Form Elements */
    input:not(.btn),
    textarea,
    select,
    .form-control {
        background-color: var(--cassiopeia-dark-surface);
        border-color: var(--cassiopeia-dark-border);
        color: var(--cassiopeia-dark-text);
    }

    input:not(.btn):focus,
    textarea:focus,
    select:focus,
    .form-control:focus {
        background-color: var(--cassiopeia-dark-surface-hover);
        border-color: var(--cassiopeia-dark-primary);
        color: var(--cassiopeia-dark-text);
    }

    /* Buttons */
    .btn-primary {
        background-color: var(--cassiopeia-dark-primary);
        border-color: var(--cassiopeia-dark-primary);
        color: #ffffff;
    }

    .btn-primary:hover {
        background-color: var(--cassiopeia-dark-primary-hover);
        border-color: var(--cassiopeia-dark-primary-hover);
    }

    .btn-secondary {
        background-color: var(--cassiopeia-dark-surface);
        border-color: var(--cassiopeia-dark-border);
        color: var(--cassiopeia-dark-text);
    }

    /* Tables */
    .table {
        color: var(--cassiopeia-dark-text);
        border-color: var(--cassiopeia-dark-border);
    }

    /* Footer */
    footer,
    .container-footer {
        background-color: var(--cassiopeia-dark-surface);
        border-top: 1px solid var(--cassiopeia-dark-border);
    }

    /* Navigation Menu */
    .mod-menu,
    .nav-pills > li > a,
    .navbar-nav .nav-link {
        color: var(--cassiopeia-dark-text) !important;
    }

    .mod-menu:hover,
    .nav-pills > li > a:hover,
    .navbar-nav .nav-link:hover {
        background-color: var(--cassiopeia-dark-surface-hover);
        color: #ffffff !important;
    }

    /* Breadcrumbs */
    .breadcrumb {
        background-color: transparent;
    }

    .breadcrumb-item {
        color: var(--cassiopeia-dark-text);
    }

    .breadcrumb-item + .breadcrumb-item::before {
        color: var(--cassiopeia-dark-text-muted);
    }

    /* Pagination */
    .pagination > li > a,
    .pagination > li > span {
        background-color: var(--cassiopeia-dark-surface);
        border-color: var(--cassiopeia-dark-border);
        color: var(--cassiopeia-dark-text);
    }

    .pagination > li.active > a {
        background-color: var(--cassiopeia-dark-primary);
        border-color: var(--cassiopeia-dark-primary);
        color: #ffffff;
    }

    /* Alerts */
    .alert-info {
        background-color: rgba(110, 168, 254, 0.15);
        border-color: var(--cassiopeia-dark-primary);
        color: var(--cassiopeia-dark-text);
    }

    .alert-danger {
        background-color: rgba(248, 113, 113, 0.15);
        border-color: var(--cassiopeia-dark-danger);
        color: var(--cassiopeia-dark-text);
    }

    /* List Groups */
    .list-group-item {
        background-color: var(--cassiopeia-dark-surface);
        border-color: var(--cassiopeia-dark-border);
        color: var(--cassiopeia-dark-text);
    }

    /* Dropdowns */
    .dropdown-menu {
        background-color: var(--cassiopeia-dark-surface);
        border-color: var(--cassiopeia-dark-border);
    }

    .dropdown-item {
        color: var(--cassiopeia-dark-text);
    }

    .dropdown-item:hover {
        background-color: var(--cassiopeia-dark-surface-hover);
    }

    /* Modal */
    .modal-content {
        background-color: var(--cassiopeia-dark-surface);
        border-color: var(--cassiopeia-dark-border);
    }

    .modal-header {
        border-bottom-color: var(--cassiopeia-dark-border);
    }

    .modal-footer {
        border-top-color: var(--cassiopeia-dark-border);
    }
}

/* Manueller Dark Mode (per Klasse) */
.dark-mode {
    --cassiopeia-dark-bg: #1a1e24;
    --cassiopeia-dark-surface: #252a33;
    --cassiopeia-dark-surface-hover: #2f3540;
    --cassiopeia-dark-text: #e0e0e0;
    --cassiopeia-dark-text-muted: #a0a5ad;
    --cassiopeia-dark-border: #3a4050;
    --cassiopeia-dark-primary: #6ea8fe;
}

.dark-mode body {
    background-color: var(--cassiopeia-dark-bg);
    color: var(--cassiopeia-dark-text);
}

.dark-mode .moduletable,
.dark-mode .module,
.dark-mode .moduletable *:not(.btn-primary):not(.btn-danger),
.dark-mode .module *:not(.btn-primary):not(.btn-danger) {
    color: var(--cassiopeia-dark-text) !important;
}

.dark-mode .card,
.dark-mode .moduletable,
.dark-mode .blog-item,
.dark-mode .item-page {
    background-color: var(--cassiopeia-dark-surface);
    border-color: var(--cassiopeia-dark-border);
}

.dark-mode .moduletable h1,
.dark-mode .moduletable h2,
.dark-mode .moduletable h3,
.dark-mode .moduletable h4,
.dark-mode .moduletable h5,
.dark-mode .moduletable h6 {
    color: #ffffff !important;
}

.dark-mode .moduletable a:not(.btn) {
    color: var(--cassiopeia-dark-primary) !important;
}


/* Normale Textdarstellung fuer das Temperatur-Modul */
.temperature-module .temperature-value,
.temperature-module .temperature-unit {
    font-size: 1rem;        /* Normale Schriftgroesse */
    font-weight: normal;    /* Normale Schriftstaerke (nicht fett) */
    line-height: 1.5;       /* Normale Zeilenhoehe */
}

/* Dark Mode bleibt erhalten */
@media (prefers-color-scheme: dark) {
    .temperature-module .temperature-value {
        color: #ffffff !important;
    }
}

.dark-mode .temperature-module .temperature-value {
    color: #ffffff !important;
}