/* Dark Theme Variables */
[data-theme="dark"] {
    /* Base Colors */
    --primary-bg: #121212;
    --secondary-bg: #1e1e1e;
    --text-color: #ffffff;
    --link-color: #7fbfff;
    --border-color: #4d4d4d;
    
    /* Interactive States */
    --hover-bg: #2d2d2d;
    
    /* Component Colors */
    --header-bg: #1a1a1a;
    --input-bg: #2a2a2a;
    --input-text: #ffffff;
    --dropdown-bg: #1e1e1e;
    --table-stripe: #262626;
    --button-text: #ffffff;
    
    /* Grid Specific */
    --grid-header-bg: #2a2a2a;
    --grid-footer-bg: #1e1e1e;
}

/* Base Elements */
[data-theme="dark"] body {
    background-color: var(--primary-bg);
    color: var(--text-color);
}

[data-theme="dark"] a {
    color: var(--link-color);
}

/* Forms and Inputs */
[data-theme="dark"] input,
[data-theme="dark"] select,
[data-theme="dark"] textarea {
    background-color: var(--input-bg);
    color: var(--input-text);
    border-color: var(--border-color);
}

/* Navigation and Header */
[data-theme="dark"] .navbar {
    background-color: var(--header-bg) !important;
    border-color: var(--border-color);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

[data-theme="dark"] .navbar-brand,
[data-theme="dark"] .nav-link {
    color: var(--text-color) !important;
}

[data-theme="dark"] #headerRow {
    background-color: var(--header-bg);
}

/* Dropdowns */
[data-theme="dark"] .dropdown-menu {
    background-color: var(--dropdown-bg);
    border-color: var(--border-color);
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .dropdown-item {
    color: var(--text-color);
}

[data-theme="dark"] .dropdown-item:hover {
    background-color: var(--hover-bg);
    color: var(--text-color);
}

/* Cards and Containers */
[data-theme="dark"] .card {
    background-color: var(--secondary-bg);
    border-color: var(--border-color);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

[data-theme="dark"] div[style*="background-color: whitesmoke"],
[data-theme="dark"] .container[style*="background-color: whitesmoke"] {
    background-color: var(--secondary-bg) !important;
}

/* Tables */
[data-theme="dark"] .table {
    color: var(--text-color);
}

[data-theme="dark"] .table-striped tbody tr:nth-of-type(odd) {
    background-color: var(--table-stripe);
}

/* Modals */
[data-theme="dark"] .modal-content {
    background-color: var(--secondary-bg);
    border-color: var(--border-color);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
}

/* Buttons */
[data-theme="dark"] .btn {
    color: var(--button-text);
}

[data-theme="dark"] .btn-primary {
    color: #ffffff;
    background-color: #0d6efd;
    border-color: #0a58ca;
}

[data-theme="dark"] .btn-primary:hover {
    background-color: #0b5ed7;
    border-color: #0a58ca;
}

[data-theme="dark"] .btn-light {
    background-color: var(--secondary-bg);
    color: var(--button-text);
    border-color: var(--border-color);
}

[data-theme="dark"] .btn-secondary {
    color: var(--button-text);
    background-color: #4d4d4d;
    border-color: #404040;
}

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

/* Theme Toggle Button */
.theme-toggle {
    background: none;
    border: none;
    padding: 0.5rem;
    cursor: pointer;
    display: flex;
    align-items: center;
    color: inherit;
}

.theme-toggle:hover {
    opacity: 0.8;
}

.theme-icon {
    font-size: 1.2rem;
    display: inline-block;
    width: 1.2rem;
    height: 1.2rem;
    line-height: 1.2rem;
    text-align: center;
    color: inherit;
}

.theme-icon-moon::before {
    content: "☾";
    font-style: normal;
    font-weight: normal;
}

.theme-icon-sun::before {
    content: "☼";
    font-style: normal;
    font-weight: normal;
}

/* Tabs Navigation */
[data-theme="dark"] .nav-tabs {
    border-bottom-color: var(--border-color) !important;
}

[data-theme="dark"] .nav-tabs .nav-link {
    color: var(--text-color);
    background-color: var(--secondary-bg);
    border-color: var(--border-color);
}

[data-theme="dark"] .nav-tabs .nav-link:hover {
    background-color: var(--hover-bg);
    border-color: var(--border-color);
    color: var(--text-color);
}

[data-theme="dark"] .nav-tabs .nav-link.active,
[data-theme="dark"] .nav-tabs .nav-item.show .nav-link {
    color: var(--text-color);
    background-color: var(--primary-bg);
    border-color: var(--border-color);
    border-bottom-color: var(--primary-bg);
}

[data-theme="dark"] .tab-content {
    background-color: var(--primary-bg);
    border-left: 1px solid var(--border-color);
    border-right: 1px solid var(--border-color);
    border-bottom: 1px solid var(--border-color);
    padding: 15px;
}

/* jqGrid Styles */
[data-theme="dark"] .ui-jqgrid,
[data-theme="dark"] .ui-jqgrid .ui-jqgrid-view {
    border-color: var(--border-color) !important;
}

[data-theme="dark"] .ui-jqgrid .ui-jqgrid-hdiv,
[data-theme="dark"] .ui-jqgrid .ui-jqgrid-bdiv,
[data-theme="dark"] .ui-jqgrid .ui-jqgrid-pager,
[data-theme="dark"] .ui-jqgrid .ui-jqgrid-sdiv,
[data-theme="dark"] .ui-jqgrid .ui-jqgrid-ftable,
[data-theme="dark"] .ui-jqgrid .ui-jqgrid-btable,
[data-theme="dark"] .ui-jqgrid .ui-jqgrid-hbox {
    border-color: var(--border-color) !important;
}

[data-theme="dark"] .ui-jqgrid .ui-widget-content {
    border-color: var(--border-color) !important;
    background: var(--secondary-bg) !important;
}

[data-theme="dark"] .ui-jqgrid .ui-widget-header {
    border-color: var(--border-color) !important;
    background: var(--grid-header-bg) !important;
}

[data-theme="dark"] .ui-jqgrid .ui-state-default,
[data-theme="dark"] .ui-jqgrid .ui-widget-content .ui-state-default,
[data-theme="dark"] .ui-jqgrid .ui-widget-header .ui-state-default,
[data-theme="dark"] .ui-jqgrid .ui-state-default.ui-jqgrid-hdiv {
    background: var(--grid-header-bg) !important;
    color: var(--text-color) !important;
    border-color: var(--border-color) !important;
}

[data-theme="dark"] .ui-jqgrid .ui-state-hover,
[data-theme="dark"] .ui-jqgrid .ui-widget-content .ui-state-hover,
[data-theme="dark"] .ui-jqgrid .ui-widget-header .ui-state-hover {
    background: var(--hover-bg) !important;
    color: var(--text-color) !important;
    border-color: var(--border-color) !important;
}

[data-theme="dark"] .ui-jqgrid .ui-jqgrid-titlebar,
[data-theme="dark"] .ui-jqgrid .ui-jqgrid-caption,
[data-theme="dark"] .ui-jqgrid .ui-jqgrid-caption-rtl {
    background: var(--grid-header-bg) !important;
    border-color: var(--border-color) !important;
    color: var(--text-color) !important;
}

[data-theme="dark"] .ui-jqgrid > .ui-jqgrid-pager,
[data-theme="dark"] .ui-jqgrid > .ui-jqgrid-toppager,
[data-theme="dark"] .ui-jqgrid .ui-jqgrid-pager,
[data-theme="dark"] .ui-jqgrid .ui-jqgrid-toppager {
    background: var(--grid-footer-bg) !important;
    border-color: var(--border-color) !important;
}

[data-theme="dark"] .ui-jqgrid .ui-pg-table {
    background: var(--grid-footer-bg) !important;
}

[data-theme="dark"] .ui-jqgrid .ui-pg-table .ui-pg-button {
    background: var(--grid-footer-bg) !important;
    border-color: var(--border-color) !important;
}

[data-theme="dark"] .ui-jqgrid .ui-pg-button:hover {
    background: var(--hover-bg) !important;
}

[data-theme="dark"] .ui-jqgrid .ui-pg-input,
[data-theme="dark"] .ui-jqgrid .ui-pg-selbox {
    background: var(--input-bg) !important;
    color: var(--text-color) !important;
    border-color: var(--border-color) !important;
}

[data-theme="dark"] .ui-jqgrid .ui-separator {
    border-color: var(--border-color) !important;
}

[data-theme="dark"] .ui-jqgrid .ui-jqgrid-htable,
[data-theme="dark"] .ui-jqgrid .ui-jqgrid-btable,
[data-theme="dark"] .ui-jqgrid .ui-jqgrid-ftable {
    background-color: var(--secondary-bg) !important;
    color: var(--text-color) !important;
}

[data-theme="dark"] .ui-jqgrid tr.jqgrow td,
[data-theme="dark"] .ui-jqgrid tr.jqgroup td,
[data-theme="dark"] .ui-jqgrid tr.jqfoot td,
[data-theme="dark"] .ui-jqgrid tr.ui-subgrid td {
    background-color: var(--secondary-bg) !important;
    color: var(--text-color) !important;
}

[data-theme="dark"] .ui-jqgrid tr.jqgrow:nth-child(odd) td {
    background-color: var(--table-stripe) !important;
}

[data-theme="dark"] .ui-jqgrid .ui-jqgrid-htable th {
    background-color: var(--grid-header-bg) !important;
}

[data-theme="dark"] .ui-jqgrid .ui-jqgrid-labels th.ui-th-column {
    background-color: var(--grid-header-bg) !important;
    color: var(--text-color) !important;
    border-color: var(--border-color) !important;
}

[data-theme="dark"] .ui-jqgrid .s-ico {
    filter: invert(1);
}

/* jqGrid Search/Filter Toolbar */
[data-theme="dark"] .ui-jqgrid .ui-search-toolbar {
    background-color: var(--grid-header-bg);
    border-color: var(--border-color);
}

[data-theme="dark"] .ui-jqgrid .ui-search-toolbar input,
[data-theme="dark"] .ui-jqgrid .ui-search-toolbar select {
    background-color: var(--input-bg);
    color: var(--input-text);
    border-color: var(--border-color);
}

/* List Groups */
[data-theme="dark"] .list-group-item {
    background-color: var(--secondary-bg);
    border-color: var(--border-color);
    color: var(--text-color);
}

[data-theme="dark"] .list-group-item:hover {
    background-color: var(--hover-bg);
}

[data-theme="dark"] .list-group-item.active {
    background-color: #0d6efd;
    border-color: #0d6efd;
    color: #ffffff;
}

[data-theme="dark"] .list-group-item-action {
    color: var(--text-color);
}

[data-theme="dark"] .list-group-item-action:hover {
    background-color: var(--hover-bg);
}

[data-theme="dark"] .list-group-item.disabled,
[data-theme="dark"] .list-group-item:disabled {
    background-color: var(--secondary-bg);
    color: #6c757d;
}