/* 
 * EBVN Dashboard v2 Dark Mode Styles
 */

/* Override variables for dark mode */
:root.dark-mode {
  --orange: rgb(255, 99, 31);
  --blue: rgb(68, 90, 190);
  --light-gray: #323232;
  --medium-gray: #444444;
  --dark-gray: #e0e0e0;
  --border-color: #444444;
  --bg-color: #222222;
  --card-bg: #333333;
  --text-color: #e0e0e0;
  --text-muted: #aaaaaa;
  --sidebar-bg: #2a2a2a;
  --sidebar-header-bg: #1a1a1a;
  --transition-speed: 0.3s;
}

/* Global Styles */
.dark-mode body {
  color: var(--text-color);
  background-color: var(--bg-color);
}

/* Sidebar Styles */
.dark-mode .sidebar {
  background: var(--sidebar-bg);
  box-shadow: 2px 0 5px rgba(0, 0, 0, 0.2);
}

.dark-mode .sidebar-header {
  background: var(--sidebar-header-bg);
}

.dark-mode .sidebar ul li a {
  color: var(--text-color);
}

.dark-mode .sidebar ul li a:hover {
  background: var(--light-gray);
}

.dark-mode .sidebar ul li.active a {
  background: rgba(255, 99, 31, 0.2);
}

.dark-mode .sidebar .list-unstyled li {
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

/* Content Styles */
.dark-mode .navbar {
  background-color: var(--card-bg) !important;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
}

.dark-mode .navbar .navbar-brand {
  color: var(--text-color);
}

/* Search Bar Styles */
.dark-mode .search-container .input-group {
  background: var(--light-gray);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
}

.dark-mode .search-container .input-group:hover,
.dark-mode .search-container .input-group:focus-within {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
  background: var(--medium-gray);
}

.dark-mode .search-container .form-control {
  color: var(--text-color);
}

.dark-mode .search-container .form-control::placeholder {
  color: var(--text-muted);
}

.dark-mode .search-container .input-group-text {
  color: var(--orange);
}

.dark-mode .search-container .btn {
  color: var(--text-muted);
}

/* User Menu */
.dark-mode .user-menu .btn-link {
  color: var(--text-color);
}

/* Dashboard Grid */
.dark-mode .dashboard-grid {
  background-color: var(--bg-color);
}

/* Widget Placeholder Styles */
.dark-mode .widget-placeholder {
  border: 2px dashed #555555;
  background-color: rgba(30, 30, 30, 0.7);
}

.dark-mode .widget-placeholder:hover {
  border-color: var(--orange);
  background-color: rgba(255, 99, 31, 0.1);
}

.dark-mode .widget-placeholder i {
  color: #777777;
}

.dark-mode .widget-placeholder p {
  color: var(--text-muted);
}

/* Widget Styles */
.dark-mode .widget-container {
  background: var(--card-bg);
}

.dark-mode .widget-container .card {
  background: var(--card-bg);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
}

.dark-mode .widget {
  background: var(--card-bg);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
}

.dark-mode .widget-header {
  background-color: var(--light-gray);
  border-bottom: 1px solid var(--border-color);
}

/* Specific card widget header styles */
.dark-mode .card .widget-header {
  background-color: var(--light-gray);
}

.dark-mode .card .widget-title {
  color: var(--text-color);
}

/* Table Styles */
.dark-mode .table {
  color: var(--text-color);
}

.dark-mode .table thead th {
  background-color: var(--light-gray);
  border-bottom: 2px solid var(--border-color);
  color: var(--text-color);
}

.dark-mode .table td, .dark-mode .table th {
  border-top: 1px solid var(--border-color);
}

.dark-mode .table-hover tbody tr:hover {
  background-color: rgba(255, 255, 255, 0.05);
}

/* Modal Styles */
.dark-mode .modal-content {
  background-color: var(--card-bg);
  color: var(--text-color);
}

.dark-mode .modal-header {
  border-bottom: 1px solid var(--border-color);
}

.dark-mode .modal-footer {
  border-top: 1px solid var(--border-color);
}

.dark-mode .widget-option {
  background: var(--light-gray);
}

.dark-mode .widget-option span {
  color: var(--text-color);
}

/* Document widget styles */
.dark-mode .document-icon {
  background-color: var(--light-gray);
}

.dark-mode .document-item {
  border-bottom: 1px solid var(--border-color);
}

.dark-mode .document-info p {
  color: var(--text-muted);
}

/* Activity log widget styles */
.dark-mode .activity-item {
  border-bottom: 1px solid var(--border-color);
}

.dark-mode .activity-time {
  color: var(--text-muted);
}

/* Statistics widget styles */
.dark-mode .stats-card {
  background-color: var(--light-gray);
}

.dark-mode .stats-card-header {
  background-color: var(--medium-gray);
}

/* Form elements */
.dark-mode .form-control,
.dark-mode .form-select {
  background-color: var(--light-gray);
  border-color: var(--border-color);
  color: var(--text-color);
}

.dark-mode .form-control:focus,
.dark-mode .form-select:focus {
  background-color: var(--medium-gray);
  color: var(--text-color);
}

.dark-mode .form-check-input {
  background-color: var(--light-gray);
  border-color: var(--border-color);
}

.dark-mode .form-check-input:checked {
  background-color: var(--orange);
  border-color: var(--orange);
}

/* Button styles */
.dark-mode .btn-secondary {
  background-color: var(--medium-gray);
  border-color: var(--border-color);
}

.dark-mode .btn-outline-secondary {
  color: var(--text-color);
  border-color: var(--border-color);
}

.dark-mode .btn-outline-secondary:hover {
  background-color: var(--medium-gray);
  color: var(--text-color);
}

/* Custom adjustments for specific widgets */
.dark-mode .card-body {
  background-color: var(--card-bg);
}

.dark-mode .list-group-item {
  background-color: var(--card-bg);
  border-color: var(--border-color);
  color: var(--text-color);
}

/* Export widget styling */
.dark-mode .widget-export-indicator {
  background-color: rgba(30, 30, 30, 0.8);
  color: var(--text-color);
}