/* Custom Futuristic Theme - Based on background.gif */

:root {
    --primary-dark: #0a0e1a;
    --primary-blue: #1a237e;
    --accent-blue: #2196f3;
    --accent-cyan: #00e5ff;
    --accent-light-cyan: #00ffff;
    --text-light: #e0e0e0;
    --text-muted: #90a4ae;
    --card-bg: rgba(13, 21, 37, 0.95);
    --card-border: rgba(0, 229, 255, 0.3);
    --sidebar-bg: linear-gradient(180deg, #0a0e1a 0%, #0d1525 100%);
}

/* Main body and wrapper */
body {
    background: var(--primary-dark) !important;
}

.wrapper {
    background: var(--primary-dark);
}

/* Content wrapper */
.content-wrapper {
    background: linear-gradient(135deg, #0a0e1a 0%, #0d1525 50%, #0a1628 100%) !important;
}

/* Sidebar styling */
.main-sidebar {
    background: linear-gradient(180deg, #0a0e1a 0%, #0d1525 100%) !important;
}

.sidebar-dark-primary .nav-sidebar > .nav-item > .nav-link.active,
.sidebar-dark-primary .nav-sidebar > .nav-item.menu-open > .nav-link {
    background: linear-gradient(90deg, rgba(0, 229, 255, 0.2) 0%, rgba(33, 150, 243, 0.1) 100%) !important;
    color: var(--accent-cyan) !important;
    border-left: 3px solid var(--accent-cyan);
}

.sidebar-dark-primary .nav-sidebar .nav-link {
    color: var(--text-light) !important;
}

.sidebar-dark-primary .nav-sidebar .nav-link:hover {
    background: rgba(0, 229, 255, 0.1) !important;
    color: var(--accent-cyan) !important;
}

/* Submenu (treeview) styling */
.sidebar-dark-primary .nav-treeview {
    background: rgba(0, 0, 0, 0.2) !important;
    padding-left: 0.5rem !important;
}

.sidebar-dark-primary .nav-treeview > .nav-item > .nav-link {
    color: var(--text-light) !important;
    background: transparent !important;
    padding-left: 2.5rem !important;
    font-size: 0.9rem;
}

.sidebar-dark-primary .nav-treeview > .nav-item > .nav-link:hover {
    background: rgba(0, 229, 255, 0.15) !important;
    color: var(--accent-cyan) !important;
}

.sidebar-dark-primary .nav-treeview > .nav-item > .nav-link.active {
    background: rgba(0, 229, 255, 0.2) !important;
    color: var(--accent-cyan) !important;
    border-left: 2px solid var(--accent-cyan);
    margin-left: 0.5rem;
}

.sidebar-dark-primary .nav-header {
    color: var(--accent-cyan) !important;
    text-transform: uppercase;
    font-size: 0.75rem;
    letter-spacing: 1px;
}

/* Brand/Logo area */
.brand-link {
    background: rgba(0, 229, 255, 0.1) !important;
    border-bottom: 1px solid rgba(0, 229, 255, 0.2) !important;
}

.brand-link .brand-text {
    color: var(--accent-cyan) !important;
}

/* Navbar */
.main-header {
    background: linear-gradient(90deg, #0a0e1a 0%, #0d1525 100%) !important;
    border-bottom: 1px solid rgba(0, 229, 255, 0.2) !important;
}

.main-header .nav-link {
    color: var(--text-light) !important;
}

.main-header .nav-link:hover {
    color: var(--accent-cyan) !important;
}

/* Cards */
.card {
    background: var(--card-bg) !important;
    border: 1px solid var(--card-border) !important;
    box-shadow: 0 0 20px rgba(0, 229, 255, 0.1) !important;
}

.card-header {
    background: rgba(0, 229, 255, 0.05) !important;
    border-bottom: 1px solid var(--card-border) !important;
    color: var(--text-light) !important;
}

.card-title {
    color: var(--accent-cyan) !important;
}

.card-body {
    color: var(--text-light) !important;
}

.card-footer {
    background: rgba(0, 229, 255, 0.05) !important;
    border-top: 1px solid var(--card-border) !important;
}

/* Card outlines */
.card-primary.card-outline {
    border-top: 3px solid var(--accent-cyan) !important;
}

.card-warning.card-outline {
    border-top: 3px solid #ffc107 !important;
}

.card-danger.card-outline {
    border-top: 3px solid #ff5252 !important;
}

/* Small boxes (info boxes) */
.small-box {
    border: 1px solid var(--card-border) !important;
    box-shadow: 0 0 15px rgba(0, 229, 255, 0.15) !important;
}

.small-box.bg-info {
    background: linear-gradient(135deg, #0d47a1 0%, #1565c0 100%) !important;
}

.small-box.bg-success {
    background: linear-gradient(135deg, #00695c 0%, #00897b 100%) !important;
}

.small-box.bg-warning {
    background: linear-gradient(135deg, #e65100 0%, #f57c00 100%) !important;
}

.small-box.bg-danger {
    background: linear-gradient(135deg, #b71c1c 0%, #c62828 100%) !important;
}

.small-box .icon {
    color: rgba(255, 255, 255, 0.3) !important;
}

.small-box-footer {
    background: rgba(0, 0, 0, 0.2) !important;
    color: rgba(255, 255, 255, 0.8) !important;
}

.small-box-footer:hover {
    background: rgba(0, 229, 255, 0.2) !important;
    color: var(--accent-cyan) !important;
}

/* Buttons */
.btn-primary {
    background: linear-gradient(135deg, #1565c0 0%, #1976d2 100%) !important;
    border-color: var(--accent-blue) !important;
    box-shadow: 0 0 10px rgba(0, 229, 255, 0.3) !important;
}

.btn-primary:hover {
    background: linear-gradient(135deg, #1976d2 0%, #2196f3 100%) !important;
    box-shadow: 0 0 20px rgba(0, 229, 255, 0.5) !important;
}

.btn-flat.btn-primary {
    background: linear-gradient(135deg, #1565c0 0%, #1976d2 100%) !important;
}

/* Form controls */
.form-control {
    background: rgba(13, 21, 37, 0.8) !important;
    border: 1px solid rgba(0, 229, 255, 0.3) !important;
    color: var(--text-light) !important;
}

.form-control:focus {
    background: rgba(13, 21, 37, 0.95) !important;
    border-color: var(--accent-cyan) !important;
    box-shadow: 0 0 10px rgba(0, 229, 255, 0.3) !important;
}

.form-control::placeholder {
    color: var(--text-muted) !important;
}

/* Labels */
label {
    color: var(--text-light) !important;
}

/* Content header */
.content-header h1 {
    color: var(--accent-cyan) !important;
    text-shadow: 0 0 10px rgba(0, 229, 255, 0.3);
}

/* Text colors */
.text-muted {
    color: var(--text-muted) !important;
}

/* Tables */
.table {
    color: var(--text-light) !important;
}

.table thead th {
    background: rgba(0, 229, 255, 0.1) !important;
    border-bottom: 2px solid var(--card-border) !important;
    color: var(--accent-cyan) !important;
}

.table td, .table th {
    border-top: 1px solid rgba(0, 229, 255, 0.1) !important;
}

/* Dropdown menus */
.dropdown-menu {
    background: var(--card-bg) !important;
    border: 1px solid var(--card-border) !important;
}

.dropdown-item {
    color: var(--text-light) !important;
}

.dropdown-item:hover {
    background: rgba(0, 229, 255, 0.1) !important;
    color: var(--accent-cyan) !important;
}

/* User menu */
.user-menu .dropdown-menu {
    background: var(--card-bg) !important;
}

/* Alerts */
.alert-success {
    background: rgba(0, 105, 92, 0.3) !important;
    border-color: #00897b !important;
    color: #80cbc4 !important;
}

.alert-warning {
    background: rgba(230, 81, 0, 0.3) !important;
    border-color: #f57c00 !important;
    color: #ffcc80 !important;
}

/* Modal */
.modal-content {
    background: var(--card-bg) !important;
    border: 1px solid var(--card-border) !important;
}

.modal-header {
    border-bottom: 1px solid var(--card-border) !important;
}

.modal-header.bg-danger {
    background: linear-gradient(135deg, #b71c1c 0%, #c62828 100%) !important;
}

.modal-footer {
    border-top: 1px solid var(--card-border) !important;
}

/* Preloader */
.preloader {
    background: var(--primary-dark) !important;
}

/* Scrollbar */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: var(--primary-dark);
}

::-webkit-scrollbar-thumb {
    background: rgba(0, 229, 255, 0.3);
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: rgba(0, 229, 255, 0.5);
}

/* Footer */
.main-footer {
    background: rgba(10, 14, 26, 0.95) !important;
    border-top: 1px solid rgba(0, 229, 255, 0.2) !important;
    color: var(--text-muted) !important;
}

/* Links */
a {
    color: var(--accent-cyan);
}

a:hover {
    color: var(--accent-light-cyan);
}

/* Glow effects for interactive elements */
.nav-link:hover .nav-icon,
.sidebar .nav-link:hover .nav-icon {
    text-shadow: 0 0 10px var(--accent-cyan);
}

/* Input group */
.input-group-text {
    background: rgba(0, 229, 255, 0.1) !important;
    border: 1px solid rgba(0, 229, 255, 0.3) !important;
    color: var(--accent-cyan) !important;
}