/* File: /assets/css/dark-mode.css */

/* ---- Base ---- */
body.dark-mode {
    background-color: #121212 !important;
    color: #e0e0e0 !important;
    scrollbar-color: #454545 #121212;
}
body.dark-mode h1, body.dark-mode h2, body.dark-mode h3, 
body.dark-mode h4, body.dark-mode h5, body.dark-mode h6 {
    color: #f5f5f5;
}
body.dark-mode p, body.dark-mode li, body.dark-mode label, body.dark-mode span, body.dark-mode div {
    color: inherit;
}
body.dark-mode hr, body.dark-mode hr.dropdown-divider {
    border-top-color: #454d55 !important;
}
body.dark-mode a {
    color: #8ab4f8;
}
body.dark-mode a:hover {
    color: #b3d1ff;
}

/* ---- Navbar ---- */
body.dark-mode .navbar, 
body.dark-mode .navbar.bg-white, 
body.dark-mode .navbar.bg-light {
    background-color: #1f2937 !important;
    border-bottom: 1px solid #374151;
}
body.dark-mode .navbar-brand span, 
body.dark-mode .navbar .nav-link {
    color: #d1d5db !important;
}
body.dark-mode .navbar .nav-link:hover,
body.dark-mode .navbar .nav-link.active {
    color: #ffffff !important;
}
body.dark-mode .navbar-toggler {
    border-color: rgba(255, 255, 255, 0.1);
}
body.dark-mode .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28209, 213, 219, 0.8%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

/* ---- Card & Panel ---- */
body.dark-mode .card,
body.dark-mode .panel,
body.dark-mode .dashboard-section,
body.dark-mode .section-box,
body.dark-mode .content-panel,
body.dark-mode .recent-files,
body.dark-mode .recent-iptv,
body.dark-mode .recent-activity,
body.dark-mode .profile-card,
body.dark-mode .account-card {
    background-color: #1f2937 !important;
    border-color: #374151 !important;
    color: #d1d5db;
}
body.dark-mode .card-header,
body.dark-mode .panel-header,
body.dark-mode .dashboard-section-header,
body.dark-mode .section-header,
body.dark-mode .card-footer {
    background-color: #1a222e !important;
    border-color: #374151 !important;
    color: #e4e4e4;
}
body.dark-mode .card-title,
body.dark-mode .panel-title {
    color: #f3f4f6;
}

/* ---- Table ---- */
body.dark-mode .table,
body.dark-mode .dashboard-table,
body.dark-mode .recent-files-table,
body.dark-mode .recent-iptv-table,
body.dark-mode .recent-activity-table {
    color: #d1d5db;
    border-color: #374151;
    background-color: #181c22;
}
body.dark-mode .table th,
body.dark-mode .table td,
body.dark-mode .dashboard-table th,
body.dark-mode .dashboard-table td {
    border-color: #374151;
    background-color: transparent;
}
body.dark-mode .table th,
body.dark-mode .dashboard-table th,
body.dark-mode .recent-files-table th,
body.dark-mode .recent-iptv-table th,
body.dark-mode .recent-activity-table th {
    background-color: #232b3a !important;
    color: #e0e0e0 !important;
    border-color: #374151 !important;
}
body.dark-mode .table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(255,255,255,0.03);
}
body.dark-mode .table-hover tbody tr:hover {
    background-color: rgba(255,255,255,0.08);
    color: #f5f5f5;
}
body.dark-mode .table-light, 
body.dark-mode .table-light > th, 
body.dark-mode .table-light > td {
    background-color: #2c3645 !important;
    color: #e0e0e0 !important;
    border-color: #374151 !important;
}

/* Section Titles and Box Headers */
body.dark-mode .section-title,
body.dark-mode .box-title,
body.dark-mode .panel-title,
body.dark-mode .dashboard-section-title {
    color: #f3f4f6 !important;
    background: transparent;
}

/* ---- Buttons ---- */
body.dark-mode .btn-light {
    background-color: #4b5563;
    border-color: #4b5563;
    color: #f3f4f6;
}
body.dark-mode .btn-light:hover {
    background-color: #5a6675;
    border-color: #5a6675;
}
body.dark-mode .btn-outline-secondary {
    color: #adb5bd;
    border-color: #4b5563;
}
body.dark-mode .btn-outline-secondary:hover {
    color: #ffffff;
    background-color: #4b5563;
}
body.dark-mode .btn-primary {
    background-color: var(--primary-color, #2563eb) !important;
    border-color: var(--primary-color, #2563eb) !important;
    color: #fff;
}
body.dark-mode .btn-primary:hover {
    filter: brightness(110%);
}

/* Action icons in tables (preview, download, etc) */
body.dark-mode .btn-outline-info, 
body.dark-mode .btn-outline-success, 
body.dark-mode .btn-outline-danger,
body.dark-mode .btn-outline-primary {
    background: transparent;
    color: #a3bffa;
    border-color: #4b5563;
}
body.dark-mode .btn-outline-info:hover,
body.dark-mode .btn-outline-success:hover,
body.dark-mode .btn-outline-danger:hover,
body.dark-mode .btn-outline-primary:hover {
    background: #374151;
    color: #fff;
    border-color: #5a6675;
}
body.dark-mode .btn,
body.dark-mode .btn-sm,
body.dark-mode .btn-link {
    color: inherit;
}
body.dark-mode .btn-link {
    color: #8ab4f8;
}

/* ---- Alerts ---- */
body.dark-mode .alert {
    border-width: 1px;
}
body.dark-mode .alert-success {
    background-color: #102c11;
    color: #a3e9a4;
    border-color: #1a431b;
}
body.dark-mode .alert-danger {
    background-color: #3b1110;
    color: #f5c6cb;
    border-color: #58151c;
}
body.dark-mode .alert-warning {
    background-color: #4d3800;
    color: #ffeeba;
    border-color: #664d03;
}
body.dark-mode .alert-info {
    background-color: #0c2a3a;
    color: #bee5eb;
    border-color: #0c5460;
}

/* ---- Modals ---- */
body.dark-mode .modal-content {
    background-color: #1f2937 !important;
    color: #d1d5db;
    border-color: #374151;
}
body.dark-mode .modal-header {
    border-bottom-color: #374151 !important;
}
body.dark-mode .modal-header .btn-close {
    filter: invert(1) grayscale(100%) brightness(200%);
}
body.dark-mode .modal-footer {
    border-top-color: #374151 !important;
}

/* ---- Forms ---- */
body.dark-mode .form-control,
body.dark-mode .form-select {
    background-color: #374151 !important;
    color: #e0e0e0 !important;
    border-color: #4b5563 !important;
}
body.dark-mode .form-control:focus,
body.dark-mode .form-select:focus {
    border-color: var(--primary-color, #8ab4f8) !important;
    box-shadow: 0 0 0 0.25rem rgba(138,180,248,0.35);
}
body.dark-mode .form-control::placeholder {
    color: #9ca3af;
}
body.dark-mode .form-check-input {
    background-color: #4b5563;
    border-color: #6b7280;
}
body.dark-mode .form-check-input:checked {
    background-color: var(--primary-color, #0d6efd);
    border-color: var(--primary-color, #0d6efd);
}
body.dark-mode .input-group-text {
    background-color: #374151;
    border-color: #4b5563;
    color: #d1d5db;
}

/* ---- Dropdowns ---- */
body.dark-mode .dropdown-menu {
    background-color: #2c3645 !important;
    border-color: #374151 !important;
    box-shadow: 0 0.5rem 1rem rgba(0,0,0,0.3);
}
body.dark-mode .dropdown-item {
    color: #d1d5db !important;
}
body.dark-mode .dropdown-item:hover,
body.dark-mode .dropdown-item:focus {
    background-color: #374151 !important;
    color: #ffffff !important;
}
body.dark-mode .dropdown-divider {
    border-top-color: #374151 !important;
}

/* ---- Mobile bottom nav, PWA banners ---- */
body.dark-mode .mobile-bottom-nav {
    background: #1f2937 !important; 
    border-top-color: #374151 !important;
}
body.dark-mode .mobile-bottom-nav a, 
body.dark-mode .mobile-bottom-nav button {
    color: #9ca3af;
}
body.dark-mode .mobile-bottom-nav a.active, 
body.dark-mode .mobile-bottom-nav button.active {
    color: #ffcf4a !important;
}
body.dark-mode #pwa-install-banner {
    background: linear-gradient(135deg, #374151, #1f2937);
    color: #e0e0e0;
}
body.dark-mode #pwa-install-button {
   background-color: #4b5563;
   color: #f3f4f6;
}
body.dark-mode #pwa-install-button:hover {
   background-color: #5a6675;
}
body.dark-mode #pwa-dismiss-button {
   background-color: rgba(0,0,0,0.25); 
   color: #adb5bd;
}
body.dark-mode #pwa-dismiss-button:hover {
   background-color: rgba(0,0,0,0.35);
}

/* ---- Miscellaneous / custom classes from your dashboard ---- */
body.dark-mode .text-primary {
    color: var(--primary-color, #8ab4f8) !important;
}
body.dark-mode .text-muted {
    color: #868e96 !important;
}
body.dark-mode .section-title, 
body.dark-mode .dashboard-title, 
body.dark-mode .profile-label, 
body.dark-mode .profile-value {
    color: #f3f4f6 !important;
}
body.dark-mode .activity-log, body.dark-mode .recent-activity {
    background: #181c22 !important;
    color: #b0b3b8 !important;
    border-radius: 8px;
}
body.dark-mode .activity-log li, body.dark-mode .recent-activity li {
    color: #b0b3b8 !important;
}

/* ---- Make icons pop a bit more in dark ---- */
body.dark-mode .bi, 
body.dark-mode .fa, 
body.dark-mode .material-icons {
    color: #8ab4f8 !important;
}

/* ---- Table cell overflow fix for dark tables ---- */
body.dark-mode td, body.dark-mode th {
    background: none !important;
}