/*
========================================
    DARK THEME ABSTRACTED STYLES
    Abstracting Dark mode styles to use CSS variables
    This reduces post-hoc CSS and improves maintainability
========================================
*/

/* Base Elements - Using CSS Variables */
body {
    color: var(--theme-text-secondary);
    background: var(--theme-bg-primary);
}

h1, h2, h3, h4, h5, h6 {
    color: var(--theme-text-primary);
}

p {
    color: var(--theme-text-primary);
}

hr {
    border-top: 1px solid var(--theme-border-primary);
}

/* Widget Components - Using CSS Variables */
.widget {
    box-shadow: var(--theme-shadow);
}

.widget.box .widget-header {
    background: var(--theme-bg-header);
}

.widget .widget-header h4 {
    color: var(--theme-widget-heading-color);
}

/* Widget Value Styles - 确保Dark模式也使用变量 */
.widget p.w-value {
    color: var(--theme-widget-value-color);
    background: var(--theme-widget-value-bg);
    font-weight: var(--theme-widget-value-font-weight);
    text-shadow: var(--theme-widget-value-text-shadow);
}

.widget .w-value {
    color: var(--theme-widget-value-color);
    background: var(--theme-widget-value-bg);
    font-weight: var(--theme-widget-value-font-weight);
    text-shadow: var(--theme-widget-value-text-shadow);
}

/* Widget Content Styles - 确保Dark模式也使用变量 */
.widget-content-area {
    background: var(--theme-widget-content-bg);
    color: var(--theme-widget-content-color);
    border-color: var(--theme-widget-content-border);
}

/* Widget Stats Styles - 确保Dark模式也使用变量 */
.widget-stats {
    background: var(--theme-widget-stats-bg);
    color: var(--theme-widget-stats-color);
    border-color: var(--theme-widget-stats-border);
}

/* Widget Box Styles - 确保Dark模式也使用变量 */
.widget.box {
    background: var(--theme-bg-widget);
    border-color: var(--theme-border-primary);
}

/* Widget Content Text Styles - 确保Dark模式也使用变量 */
.widget .widget-content h1,
.widget .widget-content h2,
.widget .widget-content h3,
.widget .widget-content h4,
.widget .widget-content h5,
.widget .widget-content h6 {
    color: var(--theme-widget-heading-color);
}

.widget .widget-content p,
.widget .widget-content span,
.widget .widget-content div {
    color: var(--theme-widget-content-color);
}

/* Widget Number Styles - 确保Dark模式也使用变量 */
.widget .widget-number,
.widget .number,
.widget .stat-number {
    color: var(--theme-widget-value-color);
    font-weight: var(--theme-widget-value-font-weight);
    text-shadow: var(--theme-widget-value-text-shadow);
}

/* Widget Label Styles - 确保Dark模式也使用变量 */
.widget .widget-label,
.widget .label,
.widget .stat-label {
    color: var(--theme-text-secondary);
}

/* Widget Description Styles - 确保Dark模式也使用变量 */
.widget .widget-description,
.widget .description,
.widget .stat-description {
    color: var(--theme-text-muted);
}

/* Widget Icon Styles - 确保Dark模式也使用变量 */
.widget .widget-icon {
    color: var(--theme-accent-primary);
}

/* Widget Four Styles - 确保Dark模式也使用变量 */
.widget-four {
    background: var(--theme-widget-four-bg);
    border-color: var(--theme-widget-four-border);
    box-shadow: var(--theme-widget-four-shadow);
}

.widget-four .widget-header {
    background: var(--theme-widget-four-header-bg);
    border-bottom-color: var(--theme-widget-four-border);
}

.widget-four .widget-content {
    background: var(--theme-widget-four-content-bg);
}

.widget-four .widget-icon {
    background: var(--theme-widget-four-icon-bg);
    color: var(--theme-widget-four-icon-color);
}

.widget-four .widget-number {
    color: var(--theme-widget-four-number-color);
    font-weight: 600;
}

.widget-four .widget-label {
    color: var(--theme-widget-four-label-color);
}

.widget-four .widget-description {
    color: var(--theme-widget-four-description-color);
}

/* Enhanced Widget Four Styles - 确保Dark模式也使用变量 */
.widget-four .widget-icon-wrapper {
    background: var(--theme-widget-four-icon-bg);
}

.widget-four .widget-stats {
    background: var(--theme-widget-four-content-bg);
}

.widget-four .widget-chart {
    background: var(--theme-widget-four-content-bg);
}

.widget-four .widget-footer {
    background: var(--theme-bg-tertiary);
    border-top-color: var(--theme-widget-four-border);
}

/* Widget Four Variants - 确保Dark模式也使用变量 */
.widget-four.widget-box {
    background: var(--theme-widget-four-bg);
    border: 1px solid var(--theme-widget-four-border);
}

.widget-four.widget-card {
    background: var(--theme-widget-four-bg);
    border-radius: 6px;
    box-shadow: var(--theme-widget-four-shadow);
}

.widget-four.widget-stats {
    background: var(--theme-widget-four-bg);
}

/* Widget Four Content Elements - 确保Dark模式也使用变量 */
.widget-four h1,
.widget-four h2,
.widget-four h3,
.widget-four h4,
.widget-four h5,
.widget-four h6 {
    color: var(--theme-widget-four-number-color);
}

/* 降低优先级，确保main.css中的样式能够覆盖 */
.widget-four p:not(.outline-badge-danger):not(.outline-badge-success):not(.outline-badge-warning):not(.outline-badge-info):not(.outline-badge-primary):not(.outline-badge-secondary),
.widget-four span:not(.outline-badge-danger):not(.outline-badge-success):not(.outline-badge-warning):not(.outline-badge-info):not(.outline-badge-primary):not(.outline-badge-secondary),
.widget-four div:not(.outline-badge-danger):not(.outline-badge-success):not(.outline-badge-warning):not(.outline-badge-info):not(.outline-badge-primary):not(.outline-badge-secondary) {
    color: var(--theme-widget-four-description-color);
}

/* 进一步优化，确保特殊样式不被覆盖 */
.widget-four .outline-badge-danger {
    /* 不设置color，让main.css控制 */
}

.widget-four .outline-badge-success {
    /* 不设置color，让main.css控制 */
}

.widget-four .outline-badge-warning {
    /* 不设置color，让main.css控制 */
}

.widget-four .outline-badge-info {
    /* 不设置color，让main.css控制 */
}

.widget-four .outline-badge-primary {
    /* 不设置color，让main.css控制 */
}

.widget-four .outline-badge-secondary {
    /* 不设置color，让main.css控制 */
}

.widget-four .stat-number {
    color: var(--theme-widget-four-number-color);
    font-weight: 600;
}

.widget-four .stat-label {
    color: var(--theme-widget-four-label-color);
}

.widget-four .stat-description {
    color: var(--theme-widget-four-description-color);
}

/* Calendar & Date Styles - 确保Dark模式也使用变量 */
.calendar {
    background: var(--theme-calendar-bg);
    border-color: var(--theme-calendar-border);
}

.calendar-header {
    background: var(--theme-calendar-header-bg);
}

.calendar-day {
    background: var(--theme-calendar-day-bg);
    color: var(--theme-text-primary);
}

.calendar-day:hover {
    background: var(--theme-calendar-day-hover);
}

.calendar-today {
    background: var(--theme-calendar-today-bg);
    color: var(--theme-calendar-today-color);
}

/* Timeline Styles - 确保Dark模式也使用变量 */
.timeline {
    background: var(--theme-timeline-bg);
    border-color: var(--theme-timeline-border);
}

.timeline-item {
    background: var(--theme-timeline-item-bg);
    border-color: var(--theme-timeline-item-border);
}

.timeline-marker {
    background: var(--theme-timeline-marker-bg);
    color: var(--theme-timeline-marker-color);
}

/* Chat & Message Styles - 确保Dark模式也使用变量 */
.chat-container {
    background: var(--theme-chat-bg);
    border-color: var(--theme-chat-border);
}

.message {
    background: var(--theme-message-bg);
    border-color: var(--theme-message-border);
}

.message-sent {
    background: var(--theme-message-sent-bg);
    color: var(--theme-message-sent-color);
}

.message-received {
    background: var(--theme-message-received-bg);
    color: var(--theme-message-received-color);
}

/* Notification Styles - 确保Dark模式也使用变量 */
.notification-container {
    background: var(--theme-notification-bg);
    border-color: var(--theme-notification-border);
}

.notification-header {
    background: var(--theme-notification-header-bg);
}

.notification-item {
    background: var(--theme-notification-item-bg);
}

.notification-item:hover {
    background: var(--theme-notification-item-hover);
}

/* Search Styles - 确保Dark模式也使用变量 */
.search-container {
    background: var(--theme-search-bg);
    border-color: var(--theme-search-border);
}

.search-input {
    background: var(--theme-search-input-bg);
    border-color: var(--theme-search-input-border);
}

.search-result {
    background: var(--theme-search-result-bg);
}

.search-result:hover {
    background: var(--theme-search-result-hover);
}

/* Filter Styles - 确保Dark模式也使用变量 */
.filter-container {
    background: var(--theme-filter-bg);
    border-color: var(--theme-filter-border);
}

.filter-option {
    background: var(--theme-filter-option-bg);
}

.filter-option:hover {
    background: var(--theme-filter-option-hover);
}

.filter-option.selected {
    background: var(--theme-filter-option-selected);
    color: #ffffff;
}

/* Sort Styles - 确保Dark模式也使用变量 */
.sort-container {
    background: var(--theme-sort-bg);
    border-color: var(--theme-sort-border);
}

.sort-option {
    background: var(--theme-sort-option-bg);
}

.sort-option:hover {
    background: var(--theme-sort-option-hover);
}

.sort-option.active {
    background: var(--theme-sort-option-active);
    color: #ffffff;
}

/* Navigation Bar - Using CSS Variables */
.navbar {
    background: var(--theme-nav-bg);
}

.navbar .nav-logo a.navbar-brand .navbar-brand-name {
    color: var(--theme-text-primary);
}

.navbar .toggle-sidebar,
.navbar .sidebarCollapse {
    color: var(--theme-text-primary);
}

.navbar .dropdown-menu {
    background: var(--theme-bg-dropdown);
    border-color: var(--theme-border-primary);
    box-shadow: var(--theme-shadow-medium);
}

.navbar .dropdown-item {
    color: var(--theme-text-primary);
}

.navbar .dropdown-item.active,
.navbar .dropdown-item:active {
    color: var(--theme-text-primary);
}

/* Table Styles - Using CSS Variables */
.table {
    color: var(--theme-text-primary);
}

.table th {
    color: var(--theme-text-primary);
}

.table td {
    color: var(--theme-text-primary);
}

/* Enhanced Table Styles - 确保Dark模式也使用变量 */
/*
.table {
    background: var(--theme-table-bg);
    border-color: var(--theme-table-border);
    color: var(--theme-text-primary);
}

.table thead th {
    background: var(--theme-table-header-bg);
    color: var(--theme-text-primary);
    border-color: var(--theme-table-header-border);
}

.table tbody tr {
    background: var(--theme-table-cell-bg);
    border-color: var(--theme-table-row-border);
}

.table tbody tr:hover {
    background: var(--theme-table-hover-row-bg);
}

.table tbody tr td {
    background: var(--theme-table-cell-bg);
    color: var(--theme-text-primary);
    border-color: var(--theme-table-row-border);
}

.table tbody tr td:hover {
    background: var(--theme-table-cell-hover-bg);
}

.table tbody tr td a {
    color: var(--theme-text-link);
}

.table tbody tr td a:hover {
    color: var(--theme-text-link-hover);
}

.table tbody tr td .btn {
    color: inherit;
}
*/

/*
.table tbody tr td .badge {
    color: #ffffff;
}
*/

/* Table Variants - 确保Dark模式也使用变量 */
.table-striped tbody tr:nth-of-type(odd) {
    background: var(--theme-table-striped-odd);
}

.table-striped tbody tr:nth-of-type(even) {
    background: var(--theme-table-striped-even);
}

.table-bordered {
    border-color: var(--theme-table-bordered-border);
}

.table-bordered th,
.table-bordered td {
    border-color: var(--theme-table-bordered-cell-border);
}

.table-hover tbody tr:hover {
    background: var(--theme-table-hover-row-bg);
}

.table-hover tbody tr:hover td {
    background: var(--theme-table-hover-cell-bg);
}

.table-condensed th,
.table-condensed td {
    padding: var(--theme-table-condensed-padding);
    border-color: var(--theme-table-condensed-border);
}

/* Table Responsive - 确保Dark模式也使用变量 */
.table-responsive {
    background: var(--theme-table-responsive-bg);
    border-color: var(--theme-table-responsive-border);
    box-shadow: var(--theme-table-responsive-shadow);
}

/* Table Footer - 确保Dark模式也使用变量 */
.table tfoot th,
.table tfoot td {
    background: var(--theme-table-footer-bg);
    border-color: var(--theme-table-footer-border);
    color: var(--theme-text-primary);
}

/* Table Caption - 确保Dark模式也使用变量 */
.table caption {
    color: var(--theme-table-caption-color);
}

/* Table Empty State - 确保Dark模式也使用变量 */
.table tbody tr.empty-row td {
    background: var(--theme-table-empty-bg);
    color: var(--theme-table-empty-color);
    text-align: center;
    padding: 2rem;
}

/* Table Selection - 确保Dark模式也使用变量 */
.table tbody tr.selected {
    background: var(--theme-table-cell-selected-bg);
}

.table tbody tr.selected td {
    color: var(--theme-table-cell-selected-color);
}

/* Table Actions - 确保Dark模式也使用变量 */
.table .actions-column {
    background: var(--theme-table-cell-bg);
}

.table .actions-column .btn {
    margin: 0 0.25rem;
}

/* Table Status - 确保Dark模式也使用变量 */
.table .status-column {
    background: var(--theme-table-cell-bg);
}

.table .status-column .status-badge {
    font-size: 0.75rem;
    padding: 0.25rem 0.5rem;
}

/* Form Styles - Using CSS Variables */
.form-control {
    background: var(--theme-input-bg);
    border-color: var(--theme-input-border);
    color: var(--theme-text-primary);
}

.form-control:focus {
    border-color: var(--theme-input-focus-border);
    box-shadow: var(--theme-input-focus-shadow);
}

/* Card Styles - Using CSS Variables */
.card {
    background: var(--theme-bg-widget);
    border-color: var(--theme-border-primary);
}

.card-header {
    background: var(--theme-bg-header);
    border-bottom-color: var(--theme-border-primary);
}

.card-body {
    /*background: var(--theme-bg-content);*/
    background: #1b2e4b;
}

/* Button Styles - Using CSS Variables */
.btn-outline-primary {
    color: var(--theme-accent-primary);
    border-color: var(--theme-accent-primary);
}

.btn-outline-primary:hover {
    background: var(--theme-accent-primary);
    color: var(--theme-bg-widget);
}

/* Selection Colors - Using CSS Variables */
::-moz-selection {
    color: var(--theme-accent-primary);
    background: transparent;
}

::selection {
    color: var(--theme-accent-primary);
    background: transparent;
}

/* Enhanced Widget Styles - Using CSS Variables */
.widget.box .widget-header {
    background: var(--theme-widget-heading-bg);
}

.widget .widget-header h4 {
    color: var(--theme-widget-heading-color);
}

/* Enhanced Navigation Styles - Using CSS Variables */
.navbar-nav .nav-link {
    color: var(--theme-nav-link);
}

.navbar-nav .nav-link:hover {
    color: var(--theme-nav-link-hover);
}

.navbar-nav .nav-link.active {
    color: var(--theme-nav-link-active);
}

/* Enhanced Dropdown Styles - Using CSS Variables */
.dropdown-toggle::after {
    border-top-color: var(--theme-text-secondary);
}

.dropdown-divider {
    border-top-color: var(--theme-border-primary);
}

/* Button Group Styles - Using CSS Variables */
.btn-group {
    background: var(--theme-btn-group-bg);
    border-color: var(--theme-btn-group-border);
    box-shadow: var(--theme-btn-group-shadow);
}

.btn-group .btn {
    border-color: var(--theme-border-primary);
}

/* Panel Styles - Using CSS Variables */
.panel {
    background: var(--theme-panel-bg);
    border-color: var(--theme-panel-border);
}

.panel-heading {
    background: var(--theme-panel-header-bg);
    border-bottom-color: var(--theme-panel-border);
}

.panel-body {
    background: var(--theme-panel-body-bg);
}

/* Well Styles - Using CSS Variables */
.well {
    background: var(--theme-well-bg);
    border-color: var(--theme-well-border);
}

/* Jumbotron Styles - Using CSS Variables */
.jumbotron {
    background: var(--theme-jumbotron-bg);
    border-color: var(--theme-jumbotron-border);
}

/* Thumbnail Styles - Using CSS Variables */
.thumbnail {
    background: var(--theme-thumbnail-bg);
    border-color: var(--theme-thumbnail-border);
}

.thumbnail .caption {
    background: var(--theme-thumbnail-caption-bg);
}

/* Media Styles - Using CSS Variables */
.media {
    background: var(--theme-media-bg);
    border-color: var(--theme-media-border);
}

.media-heading {
    color: var(--theme-media-heading-color);
}

/* Figure Styles - Using CSS Variables */
figure {
    background: var(--theme-figure-bg);
    border-color: var(--theme-figure-border);
}

figcaption {
    color: var(--theme-figure-caption-color);
}

/* Code Styles - Using CSS Variables */
code {
    background: var(--theme-code-bg);
    color: var(--theme-code-color);
    border-color: var(--theme-code-border);
}

pre {
    background: var(--theme-pre-bg);
    color: var(--theme-pre-color);
    border-color: var(--theme-pre-border);
}

/* Blockquote Styles - Using CSS Variables */
blockquote {
    background: var(--theme-blockquote-bg);
    border-left-color: var(--theme-blockquote-border);
    color: var(--theme-blockquote-color);
}

blockquote footer {
    color: var(--theme-blockquote-footer-color);
}

.navbar .navbar-item .nav-item.dropdown.notification-dropdown .nav-link:hover {
    background: transparent;
    border: none;
    color: #d3d3d3;
}

/* 登录页面主题切换按钮样式 - 确保Dark模式也使用变量 */
.theme-toggle-container {
    position: fixed;
    top: 20px;
    right: 20px;
    z-index: 1000;
}

.theme-toggle-btn {
    background: var(--theme-btn-outline-primary-bg);
    border-color: var(--theme-btn-outline-primary-border);
    color: var(--theme-btn-outline-primary-color);
    padding: 0.5rem 1rem;
    border-radius: 6px;
    font-weight: 600;
    transition: all 0.3s ease;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.theme-toggle-btn:hover {
    background: var(--theme-btn-outline-primary-hover-bg);
    border-color: var(--theme-btn-outline-primary-hover-border);
    color: var(--theme-btn-outline-primary-hover-color);
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
}

.theme-toggle-btn:focus {
    background: var(--theme-btn-outline-primary-focus-bg);
    border-color: var(--theme-btn-outline-primary-focus-border);
    color: var(--theme-btn-outline-primary-focus-color);
    box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.25);
}

.theme-toggle-btn i {
    margin-right: 8px;
    font-size: 16px;
}

.theme-toggle-btn span {
    font-size: 14px;
    font-weight: 600;
}

/* 进一步优化登录页面主题切换按钮样式 - 确保Dark模式也使用变量 */
.theme-toggle-btn {
    position: relative;
    overflow: hidden;
    z-index: 1;
}

.theme-toggle-btn::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
    transition: left 0.5s;
    z-index: -1;
}

.theme-toggle-btn:hover::before {
    left: 100%;
}

/* 确保登录页面按钮文字在所有状态下都清晰可见 */
.theme-toggle-btn:hover i,
.theme-toggle-btn:hover span {
    color: #ffffff;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
}

.theme-toggle-btn:focus i,
.theme-toggle-btn:focus span {
    color: var(--theme-btn-outline-primary-color);
}

/* 添加登录页面按钮激活状态的样式 */
.theme-toggle-btn:active {
    transform: translateY(0);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

/* Dashboard页面主题切换按钮样式 - 确保Dark模式也使用变量 */
.theme-toggle-container-dashboard {
    display: inline-block;
    margin-right: 10px;
}

.theme-toggle-container-dashboard .theme-toggle-btn {
    background: var(--theme-btn-outline-primary-bg);
    border-color: var(--theme-btn-outline-primary-border);
    color: var(--theme-btn-outline-primary-color);
    padding: 0.375rem 0.75rem;
    border-radius: 4px;
    font-size: 14px;
    font-weight: 500;
    transition: all 0.2s ease;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    border: 1px solid var(--theme-btn-outline-primary-border);
}

.theme-toggle-container-dashboard .theme-toggle-btn:hover {
    background: var(--theme-accent-primary);
    border-color: var(--theme-accent-primary);
    color: #ffffff;
    transform: translateY(-1px);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
}

.theme-toggle-container-dashboard .theme-toggle-btn:focus {
    background: var(--theme-btn-outline-primary-bg);
    border-color: var(--theme-btn-outline-primary-border);
    color: var(--theme-btn-outline-primary-color);
    box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.25);
}

.theme-toggle-container-dashboard .theme-toggle-btn i {
    margin-right: 6px;
    font-size: 14px;
}

.theme-toggle-container-dashboard .theme-toggle-btn span {
    font-size: 13px;
    font-weight: 500;
}

/* 进一步优化Dashboard页面主题切换按钮样式 - 确保Dark模式也使用变量 */
.theme-toggle-container-dashboard .theme-toggle-btn {
    position: relative;
    overflow: hidden;
    z-index: 1;
}

.theme-toggle-container-dashboard .theme-toggle-btn::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
    transition: left 0.5s;
    z-index: -1;
}

.theme-toggle-container-dashboard .theme-toggle-btn:hover::before {
    left: 100%;
}

/* 确保按钮文字在所有状态下都清晰可见 */
.theme-toggle-container-dashboard .theme-toggle-btn:hover i,
.theme-toggle-container-dashboard .theme-toggle-btn:hover span {
    color: #ffffff;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
}

.theme-toggle-container-dashboard .theme-toggle-btn:focus i,
.theme-toggle-container-dashboard .theme-toggle-btn:focus span {
    color: var(--theme-btn-outline-primary-color);
}

/* 添加按钮激活状态的样式 */
.theme-toggle-container-dashboard .theme-toggle-btn:active {
    transform: translateY(0);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
}

/* Bootstrap Select Picker Styles - 确保Dark模式也使用变量 */
.bootstrap-select {
    background: var(--theme-selectpicker-bg);
    border-color: var(--theme-selectpicker-border);
    color: var(--theme-selectpicker-color);
}

.bootstrap-select:hover {
    background: var(--theme-selectpicker-hover-bg);
    border-color: var(--theme-selectpicker-hover-border);
    color: var(--theme-selectpicker-hover-color);
}

.bootstrap-select:focus {
    background: var(--theme-selectpicker-focus-bg);
    border-color: var(--theme-selectpicker-focus-border);
    box-shadow: var(--theme-selectpicker-focus-shadow);
}

/* Selectpicker Dropdown Toggle - 确保Dark模式也使用变量 */
.bootstrap-select .dropdown-toggle {
    background: var(--theme-selectpicker-dropdown-toggle-bg);
    border-color: var(--theme-selectpicker-dropdown-toggle-border);
    color: var(--theme-selectpicker-dropdown-toggle-color);
}

.bootstrap-select .dropdown-toggle:hover {
    background: var(--theme-selectpicker-dropdown-toggle-hover-bg);
    border-color: var(--theme-selectpicker-dropdown-toggle-hover-border);
    color: var(--theme-selectpicker-dropdown-toggle-hover-color);
}

.bootstrap-select .dropdown-toggle:focus {
    background: var(--theme-selectpicker-dropdown-toggle-focus-bg);
    border-color: var(--theme-selectpicker-dropdown-toggle-focus-border);
    box-shadow: var(--theme-selectpicker-dropdown-toggle-focus-shadow);
}

/* Selectpicker Button Group - 确保Dark模式也使用变量 */
.bootstrap-select.btn-group > .dropdown-toggle {
    background: var(--theme-selectpicker-dropdown-toggle-bg);
    border-color: var(--theme-selectpicker-dropdown-toggle-border);
    color: var(--theme-selectpicker-dropdown-toggle-color);
    margin-top: 3px;
}

.bootstrap-select.btn-group > .dropdown-toggle:hover {
    background: var(--theme-selectpicker-dropdown-toggle-hover-bg);
    border-color: var(--theme-selectpicker-dropdown-toggle-hover-border);
    color: var(--theme-selectpicker-dropdown-toggle-hover-color);
}

/* Selectpicker Caret/Arrow - 确保Dark模式也使用变量 */
.bootstrap-select .dropdown-toggle .caret {
    border-top-color: var(--theme-selectpicker-caret-color);
}

.bootstrap-select .dropdown-toggle:hover .caret {
    border-top-color: var(--theme-selectpicker-caret-hover-color);
}

.bootstrap-select .dropdown-toggle:focus .caret {
    border-top-color: var(--theme-selectpicker-caret-focus-color);
}

/* Selectpicker Filter Option - 确保Dark模式也使用变量 */
.bootstrap-select .dropdown-toggle .filter-option {
    color: var(--theme-selectpicker-filter-option-color);
}

.bootstrap-select .dropdown-toggle:hover .filter-option {
    color: var(--theme-selectpicker-filter-option-hover-color);
}

.bootstrap-select .dropdown-toggle:focus .filter-option {
    color: var(--theme-selectpicker-filter-option-focus-color);
}

/* Selectpicker Placeholder - 确保Dark模式也使用变量 */
.bootstrap-select .dropdown-toggle.bs-placeholder {
    color: var(--theme-selectpicker-placeholder-color);
}

.bootstrap-select .dropdown-toggle.bs-placeholder:hover,
.bootstrap-select .dropdown-toggle.bs-placeholder:focus,
.bootstrap-select .dropdown-toggle.bs-placeholder:active {
    color: var(--theme-selectpicker-placeholder-hover-color);
}

/* Selectpicker Dropdown Menu - 确保Dark模式也使用变量 */
.bootstrap-select .dropdown-menu {
    background: var(--theme-selectpicker-dropdown-menu-bg);
    border-color: var(--theme-selectpicker-dropdown-menu-border);
    box-shadow: var(--theme-selectpicker-dropdown-menu-shadow);
}

/* Selectpicker Dropdown Items - 确保Dark模式也使用变量 */
.bootstrap-select .dropdown-menu .dropdown-item {
    background: var(--theme-selectpicker-dropdown-item-bg);
    color: var(--theme-selectpicker-dropdown-item-color);
}

.bootstrap-select .dropdown-menu .dropdown-item:hover {
    background: var(--theme-selectpicker-dropdown-item-hover-bg);
    color: var(--theme-selectpicker-dropdown-item-hover-color);
}

.bootstrap-select .dropdown-menu .dropdown-item.active,
.bootstrap-select .dropdown-menu .dropdown-item:active {
    background: var(--theme-selectpicker-dropdown-item-active-bg);
    color: var(--theme-selectpicker-dropdown-item-active-color);
}

.bootstrap-select .dropdown-menu .dropdown-item:focus {
    background: var(--theme-selectpicker-dropdown-item-focus-bg);
    color: var(--theme-selectpicker-dropdown-item-focus-color);
}

/* Selectpicker Dropdown Item Inner - 确保Dark模式也使用变量 */
.bootstrap-select .dropdown-menu .dropdown-item span.dropdown-item-inner {
    background: var(--theme-selectpicker-dropdown-item-inner-bg);
    color: var(--theme-selectpicker-dropdown-item-inner-color);
    padding: var(--theme-selectpicker-dropdown-item-inner-padding);
}

.bootstrap-select .dropdown-menu .dropdown-item span.dropdown-item-inner:not([class*="bg-"]):hover {
    background: var(--theme-selectpicker-dropdown-item-inner-hover-bg);
    color: var(--theme-selectpicker-dropdown-item-inner-hover-color);
}

/* Selectpicker Dropdown Header - 确保Dark模式也使用变量 */
.bootstrap-select .dropdown-header {
    background: var(--theme-selectpicker-dropdown-header-bg);
    color: var(--theme-selectpicker-dropdown-header-color);
    padding: var(--theme-selectpicker-dropdown-header-padding);
}

/* Selectpicker Popover Title - 确保Dark模式也使用变量 */
.bootstrap-select .dropdown-menu .popover-title {
    background: var(--theme-selectpicker-popover-title-bg);
    color: var(--theme-selectpicker-popover-title-color);
    padding: var(--theme-selectpicker-popover-title-padding);
}

/* Selectpicker No Results - 确保Dark模式也使用变量 */
.bootstrap-select .no-results {
    background: var(--theme-selectpicker-no-results-bg);
    color: var(--theme-selectpicker-no-results-color);
    padding: var(--theme-selectpicker-no-results-padding);
    margin: var(--theme-selectpicker-no-results-margin);
}

/* Selectpicker Notify - 确保Dark模式也使用变量 */
.bootstrap-select .notify {
    background: var(--theme-selectpicker-notify-bg);
    border-color: var(--theme-selectpicker-notify-border);
    color: var(--theme-selectpicker-notify-color);
    box-shadow: var(--theme-selectpicker-notify-shadow);
}

/* Selectpicker Check Mark - 确保Dark模式也使用变量 */
.bootstrap-select .dropdown-menu .dropdown-item span.check-mark {
    color: var(--theme-selectpicker-check-mark-color);
    font-size: var(--theme-selectpicker-check-mark-size);
    margin-top: var(--theme-selectpicker-check-mark-margin);
}

/* Selectpicker Sizes - 确保Dark模式也使用变量 */
.bootstrap-select.btn-group.form-control-sm .dropdown-toggle {
    height: var(--theme-selectpicker-sm-height);
    padding: var(--theme-selectpicker-sm-padding);
    font-size: var(--theme-selectpicker-sm-font-size);
}

.bootstrap-select.btn-group.form-control-lg .dropdown-toggle {
    height: var(--theme-selectpicker-lg-height);
    padding: var(--theme-selectpicker-lg-padding);
    font-size: var(--theme-selectpicker-lg-font-size);
}

/* Selectpicker Variants - 确保Dark模式也使用变量 */
.bootstrap-select.btn-primary .dropdown-toggle {
    background: var(--theme-selectpicker-primary-bg);
    border-color: var(--theme-selectpicker-primary-border);
    color: var(--theme-selectpicker-primary-color);
}

.bootstrap-select.btn-primary .dropdown-toggle:hover {
    background: var(--theme-selectpicker-primary-hover-bg);
    border-color: var(--theme-selectpicker-primary-hover-border);
    color: var(--theme-selectpicker-primary-hover-color);
}

.bootstrap-select.btn-success .dropdown-toggle {
    background: var(--theme-selectpicker-success-bg);
    border-color: var(--theme-selectpicker-success-border);
    color: var(--theme-selectpicker-success-color);
}

.bootstrap-select.btn-success .dropdown-toggle:hover {
    background: var(--theme-selectpicker-success-hover-bg);
    border-color: var(--theme-selectpicker-success-hover-border);
    color: var(--theme-selectpicker-success-hover-color);
}

.bootstrap-select.btn-warning .dropdown-toggle {
    background: var(--theme-selectpicker-warning-bg);
    border-color: var(--theme-selectpicker-warning-border);
    color: var(--theme-selectpicker-warning-color);
}

.bootstrap-select.btn-warning .dropdown-toggle:hover {
    background: var(--theme-selectpicker-warning-hover-bg);
    border-color: var(--theme-selectpicker-warning-hover-border);
    color: var(--theme-selectpicker-warning-hover-color);
}

.bootstrap-select.btn-danger .dropdown-toggle {
    background: var(--theme-selectpicker-danger-bg);
    border-color: var(--theme-selectpicker-danger-border);
    color: var(--theme-selectpicker-danger-color);
}

.bootstrap-select.btn-danger .dropdown-toggle:hover {
    background: var(--theme-selectpicker-danger-hover-bg);
    border-color: var(--theme-selectpicker-danger-hover-border);
    color: var(--theme-selectpicker-danger-hover-color);
}

.bootstrap-select.btn-info .dropdown-toggle {
    background: var(--theme-selectpicker-info-bg);
    border-color: var(--theme-selectpicker-info-border);
    color: var(--theme-selectpicker-info-color);
}

.bootstrap-select.btn-info .dropdown-toggle:hover {
    background: var(--theme-selectpicker-info-hover-bg);
    border-color: var(--theme-selectpicker-info-hover-border);
    color: var(--theme-selectpicker-info-hover-color);
}

/* Selectpicker Show State - 确保Dark模式也使用变量 */
.bootstrap-select.show .dropdown-toggle {
    border-color: var(--theme-input-focus-border);
    color: var(--theme-text-primary);
}

/* Selectpicker Outline Variants - 确保Dark模式也使用变量 */
.bootstrap-select.show .dropdown-toggle.btn-outline-primary {
    border-color: var(--theme-accent-primary);
}

.bootstrap-select.show .dropdown-toggle.btn-outline-info {
    border-color: var(--theme-accent-info);
}

.bootstrap-select.show .dropdown-toggle.btn-outline-success {
    border-color: var(--theme-accent-success);
}

.bootstrap-select.show .dropdown-toggle.btn-outline-warning {
    border-color: var(--theme-accent-warning);
}

.bootstrap-select.show .dropdown-toggle.btn-outline-danger {
    border-color: var(--theme-accent-danger);
}

/* Selectpicker Divider - 确保Dark模式也使用变量 */
.bootstrap-select .dropdown-divider {
    border-color: var(--theme-border-primary);
}

/* 修复Dark模式下selectpicker下拉菜单的背景色 */
.dropdown-menu.select-dropdown.open.show {
    background-color: var(--theme-bg-primary) !important;
}

/* Select2 Styles - 确保Dark模式也使用变量 */
.select2-container--default .select2-selection--single {
    background: var(--theme-select2-bg);
    border: 1px solid var(--theme-select2-border);
    color: var(--theme-text-primary);
}

.select2-container--default .select2-selection--single:hover {
    border-color: var(--theme-input-focus-border);
}

.select2-container--default .select2-selection--single:focus {
    border-color: var(--theme-input-focus-border);
    box-shadow: var(--theme-input-focus-shadow);
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    color: var(--theme-text-primary);
    background: transparent;
}

.select2-container--default .select2-selection--single .select2-selection__placeholder {
    color: var(--theme-text-muted);
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    border-left-color: var(--theme-border-primary);
}

.select2-container--default .select2-selection--single .select2-selection__arrow b {
    border-top-color: var(--theme-text-secondary);
}

.select2-container--default .select2-selection--single:hover .select2-selection__arrow b {
    border-top-color: var(--theme-text-primary);
}

.select2-container--default .select2-selection--single:focus .select2-selection__arrow b {
    border-top-color: var(--theme-accent-primary);
}

/* Select2 Multiple Selection */
.select2-container--default .select2-selection--multiple {
    background: var(--theme-select2-bg);
    border: 1px solid var(--theme-select2-border);
}

.select2-container--default .select2-selection--multiple:hover {
    border-color: var(--theme-input-focus-border);
}

.select2-container--default .select2-selection--multiple:focus {
    border-color: var(--theme-input-focus-border);
    box-shadow: var(--theme-input-focus-shadow);
}

.select2-container--default .select2-selection--multiple .select2-selection__choice {
    background: var(--theme-select2-option-selected);
    color: var(--theme-select2-option-selected-color);
    border-color: var(--theme-select2-option-selected);
}

.select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
    color: var(--theme-select2-option-selected-color);
}

.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover {
    color: var(--theme-select2-option-selected-color);
    background: rgba(255, 255, 255, 0.2);
}

/* Select2 Dropdown */
.select2-dropdown {
    background: var(--theme-select2-bg);
    border-color: var(--theme-select2-border);
    box-shadow: var(--theme-shadow-medium);
}

.select2-container--default .select2-results__option {
    color: var(--theme-text-primary);
    background: var(--theme-select2-option-bg);
}

.select2-container--default .select2-results__option:hover {
    background: var(--theme-select2-option-hover);
    color: var(--theme-text-primary);
}

.select2-container--default .select2-results__option[aria-selected=true] {
    background: var(--theme-select2-option-selected);
    color: var(--theme-select2-option-selected-color);
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background: var(--theme-select2-option-selected);
    color: var(--theme-select2-option-selected-color);
}

/* Select2 Search Box */
.select2-container--default .select2-search--dropdown .select2-search__field {
    background: var(--theme-select2-search-bg);
    border-color: var(--theme-select2-search-border);
    color: var(--theme-text-primary);
}

.select2-container--default .select2-search--dropdown .select2-search__field:focus {
    border-color: var(--theme-input-focus-border);
    box-shadow: var(--theme-input-focus-shadow);
}

/* Select2 Loading State */
.select2-container--default .select2-results__option--loading {
    background: var(--theme-bg-tertiary);
    color: var(--theme-text-muted);
}

/* Select2 Disabled State */
.select2-container--default.select2-container--disabled .select2-selection--single {
    background: var(--theme-bg-tertiary);
    color: var(--theme-text-muted);
}

.select2-container--default.select2-container--disabled .select2-selection--single .select2-selection__arrow {
    display: none;
}

/* Select2 Sizes */
.select2-container--default.select2-container--sm .select2-selection--single {
    height: 31px;
    padding: 0.375rem 0.75rem;
    font-size: 0.875rem;
}

.select2-container--default.select2-container--lg .select2-selection--single {
    height: 47px;
    padding: 0.75rem 1.5rem;
    font-size: 1.125rem;
}

/* Select2 Validation States */
.select2-container--default.select2-container--error .select2-selection--single {
    border-color: var(--theme-accent-danger);
}

.select2-container--default.select2-container--success .select2-selection--single {
    border-color: var(--theme-accent-success);
}

.select2-container--default.select2-container--warning .select2-selection--single {
    border-color: var(--theme-accent-warning);
}

.select2-container--default.select2-container--info .select2-selection--single {
    border-color: var(--theme-accent-info);
}

/* 普通Select元素样式 - 确保Dark模式也使用变量 */
select.form-control {
    background: var(--theme-input-bg);
    border-color: var(--theme-input-border);
    color: var(--theme-text-primary);
}

select.form-control:hover {
    border-color: var(--theme-input-focus-border);
}

select.form-control:focus {
    border-color: var(--theme-input-focus-border);
    box-shadow: var(--theme-input-focus-shadow);
}

select.form-control option {
    background: var(--theme-bg-widget);
    color: var(--theme-text-primary);
}

select.form-control option:hover {
    background: var(--theme-bg-tertiary);
}

select.form-control option:checked {
    background: var(--theme-accent-primary);
    color: #ffffff;
}

/* Select元素在不同尺寸下的样式 */
select.form-control.col-md-3 {
    width: 25%;
}

select.form-control.col-md-6 {
    width: 50%;
}

select.form-control.col-md-10 {
    width: 83.333333%;
}

/* Select元素的禁用状态 */
select.form-control:disabled {
    background: var(--theme-bg-tertiary);
    color: var(--theme-text-muted);
    cursor: not-allowed;
}

/* Select元素的必填状态指示 */
select.form-control[required] {
    border-left: 3px solid var(--theme-accent-danger);
}

/* Select元素在表单组中的样式 */
.form-group select.form-control {
    margin-bottom: 0.5rem;
}

/* Select元素标签样式 */
.form-group label.control-label {
    color: var(--theme-text-primary);
    font-weight: 600;
    margin-bottom: 0.5rem;
}

.form-group label.control-label .required {
    color: var(--theme-accent-danger);
}

/* 修复main.css中disabled和readonly元素的背景色问题 - 使用CSS变量 */
input[disabled], select[disabled], textarea[disabled], input[readonly], select[readonly], textarea[readonly] {
    background-color: var(--theme-bg-tertiary) !important;
    color: var(--theme-text-muted) !important;
    border-color: var(--theme-border-primary) !important;
    cursor: not-allowed !important;
}

/* Dark模式下的Tooltip样式优化 */
/* 确保H3标题在Dark模式下也能正确显示 */

/* 针对包含H3标题的tooltip进行特殊优化 */
.tooltip .tooltip-inner h3 {
    color: var(--theme-tooltip-color) !important; /* 使用主题定义的文字色 */
    background-color: transparent !important; /* 透明背景 */
    margin: 0 !important; /* 移除默认边距 */
    padding: 0 !important; /* 移除默认内边距 */
    font-size: 14px !important; /* 适中的字体大小 */
    font-weight: 600 !important; /* 加粗字体 */
    line-height: 1.4 !important; /* 合适的行高 */
    text-shadow: 0 1px 2px rgba(255, 255, 255, 0.2) !important; /* 添加淡色文字阴影 */
}

/* 针对"喊TA来验收"等特定tooltip内容的优化 */
.tooltip .tooltip-inner[data-original-title*="喊TA来验收"] h3,
.tooltip .tooltip-inner[title*="喊TA来验收"] h3 {
    color: var(--theme-tooltip-color) !important; /* 确保文字使用主题色 */
    background-color: transparent !important; /* 透明背景 */
    text-shadow: 0 1px 3px rgba(255, 255, 255, 0.3) !important; /* 淡色文字阴影 */
}

/* 通用tooltip内容优化 */
.tooltip .tooltip-inner {
    background: var(--theme-tooltip-bg) !important; /* 使用主题定义的背景色 */
    color: var(--theme-tooltip-color) !important; /* 使用主题定义的文字色 */
    border-radius: 6px !important; /* 圆角边框 */
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3) !important; /* 添加阴影效果 */
    border: 1px solid var(--theme-border-primary) !important; /* 添加主题边框色 */
    max-width: 250px !important; /* 增加最大宽度 */
    padding: 8px 12px !important; /* 增加内边距 */
    font-size: 13px !important; /* 适中的字体大小 */
    line-height: 1.4 !important; /* 合适的行高 */
}