@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

body {
    font-family: 'Inter', sans-serif !important;
    background: #ffffff !important; /* Pure white background */
    color: #333333 !important;
}

/* Overall Wrapper */
.wrapper {
    background: transparent !important;
}

/* Sidebar Styling */
.main-sidebar {
    background: #2d3748 !important; /* Dark Slate Sidebar */
    border-right: none !important;
}

/* Top Navbar */
.main-header.navbar {
    background: #ffffff !important;
    border-bottom: 1px solid #e2e8f0 !important;
    box-shadow: 0 1px 2px rgba(0,0,0,0.05);
    padding: 0.5rem 1rem !important;
}

.main-header .nav-link {
    color: #4a5568 !important;
}

/* Sidebar Branding & Profile */
.brand-link {
    background: #1a202c !important; /* Darker slate for logo area */
    border-bottom: 1px solid rgba(255,255,255,0.05) !important;
    padding: 1.2rem 1rem !important;
    text-align: center;
}
.brand-text {
    color: #ffffff !important;
    font-weight: 600 !important;
    font-size: 1.25rem !important;
}

/* Sidebar Section Header (YOUR TOOLS) */
.nav-header {
    color: #a0aec0 !important;
    font-size: 0.75rem !important;
    font-weight: 700 !important;
    text-transform: uppercase;
    padding-top: 1.5rem !important;
    letter-spacing: 0.5px;
}

/* Sidebar Links */
.nav-sidebar .nav-item .nav-link {
    border-radius: 4px !important;
    color: #e2e8f0 !important;
    margin-bottom: 2px !important;
    padding: 0.6rem 1rem !important;
    font-weight: 500 !important;
}

.nav-sidebar .nav-item .nav-link:hover, .nav-sidebar .nav-item .nav-link.active {
    background: #4a5568 !important; /* Lighter slate on hover/active */
    color: #ffffff !important;
}

.nav-sidebar .nav-item .nav-link i {
    color: #a0aec0 !important;
    margin-right: 0.5rem;
}
.nav-sidebar .nav-item .nav-link:hover i, .nav-sidebar .nav-item .nav-link.active i {
    color: #3b82f6 !important; /* Blue icon on active state like the first screenshot */
}

/* Main Content Background */
.content-wrapper {
    background: #ffffff !important;
}

/* Headings */
.content-header h1 {
    font-weight: 600 !important;
    color: #1a202c !important;
    font-size: 1.5rem !important;
}
.content-header .subtitle {
    font-size: 0.85rem;
    color: #4a5568;
    font-weight: 600;
}
.content-header .version-text {
    font-size: 0.85rem;
    color: #718096;
    font-weight: 600;
}

/* Clean Cards */
.card {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 4px !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05) !important;
    margin-bottom: 1.5rem !important;
}

/* Card Header */
.card-header {
    background: transparent !important;
    border-bottom: 1px solid #e2e8f0 !important;
    padding: 1rem 1.25rem !important;
}

.card-title {
    font-weight: 600 !important;
    font-size: 1rem !important;
    color: #1a202c !important;
}

/* Form Controls */
.form-control {
    background: #ffffff !important;
    border: 1px solid #cbd5e1 !important;
    color: #4a5568 !important;
    border-radius: 4px !important;
    padding: 0.5rem 0.75rem !important;
    font-size: 0.9rem !important;
    box-shadow: none !important;
}

.form-control:focus {
    border-color: #007bff !important;
    box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.25) !important;
}

.form-group label {
    font-weight: 600 !important;
    color: #1a202c !important;
    font-size: 0.85rem !important;
}

/* Buttons */
.btn-primary {
    background: #007bff !important; /* Bright Blue */
    border: none !important;
    border-radius: 4px !important;
    font-weight: 600 !important;
    color: #ffffff !important;
}
.btn-primary:hover { background: #0056b3 !important; }

.btn-danger {
    background: #dc3545 !important;
    border: none !important;
    border-radius: 4px !important;
}

.btn-warning {
    background: #ffc107 !important;
    color: #212529 !important;
    border: none !important;
    font-weight: 700 !important;
    border-radius: 4px !important;
}

/* Table overrides */
.table th {
    border-top: none !important;
    border-bottom: 1px solid #e2e8f0 !important;
    font-weight: 600 !important;
    color: #1a202c !important;
    font-size: 0.85rem !important;
}
.table td {
    vertical-align: middle !important;
    border-bottom: 1px solid #e2e8f0 !important;
    color: #1a202c !important;
    font-size: 0.9rem !important;
}
.table-striped tbody tr:nth-of-type(odd) {
    background-color: #f8fafc !important;
}

/* Promo Banner */
.promo-banner {
    background: #007bff !important;
    border-radius: 4px !important;
    padding: 1.5rem !important;
    text-align: center !important;
    color: white !important;
    margin-bottom: 1.5rem !important;
}
.promo-banner h4 {
    font-weight: 700 !important;
    font-size: 1.25rem !important;
    margin-bottom: 0.5rem !important;
}
.promo-banner p {
    font-size: 0.9rem !important;
    margin-bottom: 1rem !important;
}

/* Footer override */
.main-footer {
    background: #ffffff !important;
    border-top: 1px solid #e2e8f0 !important;
    color: #718096 !important;
    text-align: center;
    padding: 1rem !important;
    font-size: 0.85rem !important;
}
.main-footer strong {
    color: #1a202c !important;
}

/* --- DARK MODE OVERRIDES --- */
body.dark-mode {
    background: #1a202c !important;
    color: #e2e8f0 !important;
}
body.dark-mode .content-wrapper,
body.dark-mode .main-header.navbar {
    background: #1a202c !important;
    border-color: #2d3748 !important;
}
body.dark-mode .card,
body.dark-mode .modal-content {
    background: #2d3748 !important;
    border-color: #1a202c !important;
    color: #e2e8f0 !important;
}
body.dark-mode .card-title,
body.dark-mode .content-header h1,
body.dark-mode .nav-header,
body.dark-mode .form-group label {
    color: #f7fafc !important;
}
body.dark-mode .table th,
body.dark-mode .table td {
    color: #e2e8f0 !important;
    border-color: #4a5568 !important;
}
body.dark-mode .table-striped tbody tr:nth-of-type(odd) {
    background-color: #2a3441 !important;
}
body.dark-mode .form-control {
    background: #1a202c !important;
    border-color: #4a5568 !important;
    color: #e2e8f0 !important;
}
body.dark-mode .form-control:focus {
    background: #2d3748 !important;
    color: #fff !important;
}
body.dark-mode .main-header .nav-link,
body.dark-mode .main-header .nav-link i,
body.dark-mode .navbar-nav .nav-link {
    color: #e2e8f0 !important;
}
body.dark-mode .modal-header .close {
    color: #fff !important;
}
body.dark-mode .modal-body p {
    color: #a0aec0 !important;
}
body.dark-mode .content-header .subtitle,
body.dark-mode .content-header .version-text {
    color: #a0aec0 !important;
}
body.dark-mode .main-footer {
    background: #1a202c !important;
    border-color: #2d3748 !important;
    color: #a0aec0 !important;
}
body.dark-mode .main-footer strong {
    color: #e2e8f0 !important;
}