/* Force Dark Theme - Override all white backgrounds */

body {
    background: #000 !important;
    color: #fff !important;
}

/* All white backgrounds to dark */
.card,
.stat-card,
.member-card,
.event-card,
.proposal-card,
.product-card,
.stats-grid > div,
.members-table,
.members-table thead,
.members-table tbody,
.members-table td,
.members-table th,
.form-group input,
.form-group select,
.form-group textarea,
.modal-content,
.btn,
.btn-primary,
.btn-secondary {
    background: rgba(255, 255, 255, 0.03) !important;
    color: #fff !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
}

/* Sidebar dark */
.sidebar {
    background: #0a0a0a !important;
    border-right: 1px solid rgba(255, 255, 255, 0.1) !important;
}

.sidebar-link,
.sidebar-link span,
.sidebar a {
    color: #fff !important;
}

.sidebar-link.active,
.sidebar-link:hover {
    background: rgba(255, 255, 255, 0.08) !important;
    color: #fff !important;
    border-left-color: #667eea !important;
}

.sidebar-link svg {
    color: #fff !important;
    fill: #fff !important;
}

/* Remove all blue colors */
.text-blue-600,
.text-blue-500,
.bg-blue-500,
.bg-blue-600 {
    color: #fff !important;
    background: rgba(255, 255, 255, 0.05) !important;
}

/* Tables */
.members-table th {
    background: rgba(255, 255, 255, 0.02) !important;
    color: rgba(255, 255, 255, 0.8) !important;
}

.members-table tr:hover {
    background: rgba(255, 255, 255, 0.05) !important;
}

/* Inputs dark */
input, select, textarea {
    background: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    color: #fff !important;
}

input::placeholder {
    color: rgba(255, 255, 255, 0.4) !important;
}

/* Buttons */
.btn-primary {
    background: #667eea !important;
    color: #fff !important;
}

.btn-secondary {
    background: transparent !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    color: #fff !important;
}

.btn-danger {
    background: #ef4444 !important;
}

/* Stats cards */
.stat-value {
    color: #fff !important;
}

.stat-label {
    color: rgba(255, 255, 255, 0.6) !important;
}

/* Headers */
h1, h2, h3, h4, h5, h6 {
    color: #fff !important;
}

/* Links */
a {
    color: #667eea !important;
}

a:hover {
    color: #764ba2 !important;
}

/* FORCE EVERYTHING DARK - No exceptions */
* {
    background-color: transparent !important;
}

body {
    background: #000 !important;
}

/* All containers and boxes */
div, section, article, main, aside {
    background: transparent !important;
}

/* Specific elements that need slight background */
.sidebar,
.stats-grid > div,
.card,
.stat-card,
.members-table,
input,
select,
textarea,
.modal-content,
.event-card,
.member-card,
.proposal-card {
    background: rgba(255, 255, 255, 0.02) !important;
}

/* Table rows */
.members-table tr {
    background: transparent !important;
}

.members-table tr:nth-child(even) {
    background: rgba(255, 255, 255, 0.01) !important;
}

.members-table tr:hover {
    background: rgba(255, 255, 255, 0.05) !important;
}

/* All text white */
* {
    color: #fff !important;
}

/* Subdued text */
.stat-label,
.text-light,
small,
.subtitle {
    color: rgba(255, 255, 255, 0.6) !important;
}

/* NO BLUE anywhere */
.bg-blue-100,
.bg-blue-200,
.bg-blue-500,
.bg-blue-600,
.text-blue-500,
.text-blue-600 {
    background: rgba(255, 255, 255, 0.05) !important;
    color: #fff !important;
}

/* Buttons only purple or transparent */
.btn-primary,
button[type="submit"] {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    color: #fff !important;
    border: none !important;
}

.btn-secondary,
.btn-outline {
    background: transparent !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    color: #fff !important;
}

/* Form elements */
input:focus,
select:focus,
textarea:focus {
    border-color: #667eea !important;
    outline: none !important;
}

/* Modals - opaque background for better readability */
.modal-overlay,
#member-detail-modal,
#event-modal,
#proposal-modal,
#product-modal {
    background: rgba(0, 0, 0, 0.95) !important;
    backdrop-filter: blur(10px) !important;
}

.modal-content {
    background: #0a0a0a !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.8) !important;
}

.modal-header {
    background: rgba(255, 255, 255, 0.02) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
}

.modal-header h2,
.modal-header h3 {
    color: #fff !important;
}

.modal-close {
    color: #fff !important;
    background: transparent !important;
}