/* ── EvoSeedbox Dark Theme Fix v3 (2026-04-05) ──────────────────────────
 * The lagom2 default style uses light content blocks (white bg, dark text)
 * on a dark page background. When a user's browser/OS has dark mode enabled,
 * the browser may invert text to white while leaving white backgrounds,
 * causing white-on-white readability issues.
 *
 * This CSS forces proper dark styling on all content blocks when the user
 * has dark mode enabled in their browser/OS.
 * ──────────────────────────────────────────────────────────────────────── */

/* Prevent browser auto-dark-mode from partially inverting */
:root {
    color-scheme: light dark;
}

/* ── Dark mode overrides ── */
@media (prefers-color-scheme: dark) {

    /* Force dark backgrounds on all blocks */
    .list-group,
    .list-group-item,
    a.list-group-item,
    button.list-group-item {
        background-color: #1e293b !important;
        color: #e2e8f0 !important;
        border-color: #334155 !important;
    }

    a.list-group-item:hover,
    a.list-group-item:focus,
    .list-group-item:hover {
        background-color: #283548 !important;
        color: #f1f5f9 !important;
    }

    /* Department names, ticket titles — links inside list items */
    .list-group-item-heading,
    a.list-group-item .list-group-item-heading,
    .list-group-item-link .list-group-item-heading {
        color: #f1f5f9 !important;
    }

    .list-group-item-text,
    a.list-group-item .list-group-item-text {
        color: #94a3b8 !important;
    }

    .list-group-item-footer {
        color: #64748b !important;
        border-color: #334155 !important;
    }

    .list-group-item-icon {
        color: #60a5fa !important;
    }

    /* Sections */
    .section-header,
    .section-title {
        color: #f1f5f9 !important;
    }

    .section-body {
        background-color: transparent !important;
    }

    /* Panels & Cards */
    .panel,
    .panel-default,
    .panel-body,
    .panel-heading,
    .card,
    .card-body,
    .card-header {
        background-color: #1e293b !important;
        color: #e2e8f0 !important;
        border-color: #334155 !important;
    }

    .panel-heading,
    .card-header {
        background-color: #172033 !important;
        border-color: #334155 !important;
    }

    /* Forms & Inputs */
    .form-control,
    input.form-control,
    select.form-control,
    textarea.form-control,
    .markdown-editor,
    .md-editor,
    .md-editor > textarea,
    .md-editor > .md-preview {
        color: #e2e8f0 !important;
        background-color: #172033 !important;
        border-color: #334155 !important;
    }

    .form-control:focus {
        border-color: #3b82f6 !important;
        background-color: #1e293b !important;
        color: #f1f5f9 !important;
    }

    .form-control::placeholder {
        color: #64748b !important;
    }

    label,
    .form-group label,
    .control-label {
        color: #94a3b8 !important;
    }

    /* Tables */
    .table,
    .table > thead > tr > th,
    .table > tbody > tr > td,
    .table > thead > tr > td {
        color: #e2e8f0 !important;
        border-color: #334155 !important;
    }

    .table-striped > tbody > tr:nth-of-type(odd) {
        background-color: rgba(30, 41, 59, 0.5) !important;
    }

    /* Ticket replies */
    .ticket-reply {
        background-color: #1e293b !important;
        border-color: #334155 !important;
        color: #e2e8f0 !important;
    }

    .ticket-reply.staff {
        background-color: #1a2744 !important;
    }

    .ticket-reply-body,
    .ticket-reply-content,
    .ticket-reply-top {
        color: #e2e8f0 !important;
    }

    /* Modals */
    .modal-content {
        background-color: #1e293b !important;
        color: #e2e8f0 !important;
        border-color: #334155 !important;
    }

    .modal-header,
    .modal-footer {
        border-color: #334155 !important;
    }

    /* Select2 / Dropdowns */
    .select2-container--default .select2-selection--single,
    .select2-dropdown,
    .select2-results__option,
    .dropdown-menu {
        background-color: #1e293b !important;
        color: #e2e8f0 !important;
        border-color: #334155 !important;
    }

    .select2-results__option--highlighted,
    .dropdown-menu > li > a:hover {
        background-color: rgba(59, 130, 246, 0.2) !important;
        color: #f1f5f9 !important;
    }

    /* Alerts */
    .alert {
        border-color: #334155 !important;
        color: #e2e8f0 !important;
    }

    /* Breadcrumb */
    .breadcrumb {
        color: #94a3b8 !important;
        background-color: transparent !important;
    }

    .breadcrumb a {
        color: #60a5fa !important;
    }

    /* Pricing table */
    .row-pricing-table .panel-package {
        background-color: #1e293b !important;
        color: #e2e8f0 !important;
    }

    /* Knowledgebase suggestions */
    .article-content,
    .announcement-body,
    .kb-article-content {
        color: #e2e8f0 !important;
    }

    /* General text elements that might inherit dark colors */
    p, span, div, li, td, th, h1, h2, h3, h4, h5, h6, a {
        color: inherit;
    }

    /* Links */
    a {
        color: #60a5fa;
    }

    a:hover {
        color: #93c5fd;
    }

    /* Status badges */
    .status {
        opacity: 1 !important;
    }

    /* Sidebar navigation */
    .sidebar .list-group-item,
    .panel-sidebar .list-group-item {
        background-color: transparent !important;
    }
}