/* Theme System - Light and Dark Mode */

/* Light Mode - Default */
:root, body.theme-light {
    --text-primary: #000000;
    --text-secondary: #666;
    --bg-container: transparent;
    --border-color: #e5e5e5;
    --link-color: #000000;
    --link-hover-color: #000000;
    --header-text: #ffffff;
    --header-link-color: #ffffff;
}

/* Dark Mode */
body.theme-dark {
    --text-primary: #ffffff;
    --text-secondary: #e0e0e0;
    --bg-container: transparent;
    --border-color: #444;
    --link-color: #ffffff;
    --link-hover-color: #ffffff;
    --header-text: #ffffff;
    --header-link-color: #ffffff;
}

/* Header styling */
.navbar-custom.theme-light {
    background-color: #3b73ab !important;
}

.navbar-custom.theme-dark {
    background-color: #1a3a52 !important;
}

.navbar-custom .navbar-brand,
.navbar-custom .nav-link {
    color: var(--header-link-color) !important;
}

.navbar-custom .nav-link:hover,
.navbar-custom .nav-link:focus {
    color: var(--header-text) !important;
    opacity: 0.8;
}

.navbar-custom .btn {
    color: var(--header-text) !important;
}

.navbar-custom .btn img {
    /* Icon colors are handled by JavaScript */
}

/* Dark Mode Text Colors */
body.theme-dark .container-main {
    color: var(--text-primary);
}

body.theme-dark .container-main * {
    color: inherit;
}

/* Text elements in dark mode */
body.theme-dark .container-main p,
body.theme-dark .container-main h1,
body.theme-dark .container-main h2,
body.theme-dark .container-main h3,
body.theme-dark .container-main h4,
body.theme-dark .container-main h5,
body.theme-dark .container-main h6,
body.theme-dark .container-main span,
body.theme-dark .container-main label,
body.theme-dark .container-main div,
body.theme-dark .container-main li,
body.theme-dark .container-main td,
body.theme-dark .container-main th {
    color: var(--text-primary);
}

/* Links in dark mode */
body.theme-dark .container-main a {
    color: var(--link-color);
    text-decoration: none;
}

body.theme-dark .container-main a:hover,
body.theme-dark .container-main a:focus {
    color: var(--link-hover-color);
    text-decoration: underline;
}

/* Form elements in dark mode */
body.theme-dark .container-main input[type="text"],
body.theme-dark .container-main input[type="email"],
body.theme-dark .container-main input[type="password"],
body.theme-dark .container-main input[type="search"],
body.theme-dark .container-main input[type="url"],
body.theme-dark .container-main textarea,
body.theme-dark .container-main select {
    background-color: #2d2d2d;
    color: var(--text-primary);
    border-color: var(--border-color);
}

body.theme-dark .container-main input[type="text"]::placeholder,
body.theme-dark .container-main input[type="email"]::placeholder,
body.theme-dark .container-main input[type="password"]::placeholder,
body.theme-dark .container-main textarea::placeholder {
    color: var(--text-secondary);
}

/* Tables in dark mode */
body.theme-dark .container-main table {
    color: var(--text-primary);
    border-color: var(--border-color);
}

body.theme-dark .container-main table th {
    background-color: rgba(0, 0, 0, 0.2);
    color: var(--text-primary);
    border-color: var(--border-color);
}

body.theme-dark .container-main table td {
    border-color: var(--border-color);
}

body.theme-dark .container-main table tbody tr:hover {
    background-color: rgba(255, 255, 255, 0.05);
}

/* Cards and panels in dark mode */
body.theme-dark .container-main .card,
body.theme-dark .container-main .panel {
    background-color: rgba(0, 0, 0, 0.3);
    border-color: var(--border-color);
    color: var(--text-primary);
}

body.theme-dark .container-main .card-header,
body.theme-dark .container-main .panel-heading {
    background-color: rgba(0, 0, 0, 0.4);
    border-color: var(--border-color);
    color: var(--text-primary);
}

/* Buttons in dark mode */
body.theme-dark .container-main .btn-primary {
    background-color: #0056b3;
    border-color: #0056b3;
}

body.theme-dark .container-main .btn-primary:hover {
    background-color: #003d82;
    border-color: #003d82;
}

body.theme-dark .container-main .btn-secondary {
    background-color: #555;
    border-color: #555;
    color: var(--text-primary);
}

body.theme-dark .container-main .btn-secondary:hover {
    background-color: #666;
    border-color: #666;
}

body.theme-dark .container-main .btn-light {
    background-color: #ddd;
    border-color: #ddd;
    color: #333;
}

body.theme-dark .container-main .btn-light:hover {
    background-color: #ccc;
    border-color: #ccc;
}

body.theme-dark .container-main .btn-outline-light {
    color: var(--text-primary);
    border-color: var(--text-primary);
}

body.theme-dark .container-main .btn-outline-light:hover {
    background-color: rgba(255, 255, 255, 0.1);
    border-color: var(--link-color);
    color: var(--link-color);
}

/* Border and divider styling in dark mode */
body.theme-dark .container-main .border,
body.theme-dark .container-main .border-top,
body.theme-dark .container-main .border-bottom,
body.theme-dark .container-main .border-left,
body.theme-dark .container-main .border-right {
    border-color: var(--border-color) !important;
}

/* Alert styling in dark mode */
body.theme-dark .container-main .alert-info {
    background-color: rgba(23, 162, 184, 0.2);
    border-color: #17a2b8;
    color: var(--text-primary);
}

body.theme-dark .container-main .alert-warning {
    background-color: rgba(255, 193, 7, 0.2);
    border-color: #ffc107;
    color: var(--text-primary);
}

body.theme-dark .container-main .alert-danger {
    background-color: rgba(220, 53, 69, 0.2);
    border-color: #dc3545;
    color: var(--text-primary);
}

body.theme-dark .container-main .alert-success {
    background-color: rgba(40, 167, 69, 0.2);
    border-color: #28a745;
    color: var(--text-primary);
}

/* Footer in dark mode */
body.theme-dark .footer {
    background-color: rgba(0, 0, 0, 0.3);
    color: var(--text-primary);
    border-top-color: var(--border-color);
}

/* Badge styling in dark mode */
body.theme-dark .container-main .badge {
    background-color: rgba(0, 0, 0, 0.4);
    color: var(--text-primary);
}

body.theme-dark .container-main .badge-primary {
    background-color: #0056b3;
}

body.theme-dark .container-main .badge-secondary {
    background-color: #555;
}

/* Modals in dark mode */
body.theme-dark .modal-content {
    background-color: #2d2d2d;
    color: var(--text-primary);
    border-color: var(--border-color);
}

body.theme-dark .modal-header {
    background-color: rgba(0, 0, 0, 0.3);
    border-color: var(--border-color);
}

body.theme-dark .modal-footer {
    background-color: rgba(0, 0, 0, 0.3);
    border-color: var(--border-color);
}

/* Dropdowns in dark mode */
body.theme-dark .dropdown-menu {
    background-color: #2d2d2d;
    border-color: var(--border-color);
}

body.theme-dark .dropdown-menu .dropdown-item {
    color: var(--text-primary);
}

body.theme-dark .dropdown-menu .dropdown-item:hover,
body.theme-dark .dropdown-menu .dropdown-item:focus {
    background-color: rgba(0, 0, 0, 0.3);
    color: var(--link-color);
}
