/* Dark Mode CSS for Food Truck Application */

/* Base styles */
body {
    background-color: #121212;
    color: #ffffff;
    font-weight: 500;
}

/* Text elements */
p, span, div, h1, h2, h3, h4, h5, h6, a, button, input, select, textarea, label, li, td, th {
    color: #ffffff !important;
    font-weight: 500;
}

/* Make headings bolder */
h1, h2, h3, h4, h5, h6, .navbar-brand, .card-title {
    font-weight: 700 !important;
}

/* Form elements */
.form-control, .form-select, textarea {
    background-color: #222222 !important;
    border: 1px solid #444444 !important;
    color: #ffffff !important;
}

.form-control:focus, .form-select:focus, textarea:focus {
    background-color: #222222 !important;
    border-color: #28a745 !important;
    color: #ffffff !important;
    box-shadow: 0 0 0 0.25rem rgba(40, 167, 69, 0.25) !important;
}

/* Form text and labels */
.form-text, label, .form-label {
    color: #ffffff !important;
    font-weight: bold !important;
}

/* Buttons */
.btn-primary {
    background-color: #28a745 !important;
    border-color: #28a745 !important;
    color: #ffffff !important;
}

.btn-primary:hover {
    background-color: #218838 !important;
    border-color: #1e7e34 !important;
}

.btn-secondary {
    background-color: #6c757d !important;
    border-color: #6c757d !important;
}

.btn-outline-secondary {
    color: #ffffff !important;
    border-color: #6c757d !important;
}

.btn-outline-secondary:hover {
    background-color: #6c757d !important;
}

.btn-outline-light {
    color: #ffffff !important;
    border-color: #f8f9fa !important;
}

.btn {
    font-weight: 600 !important;
}

/* Cards */
.card {
    background-color: #1e1e1e !important;
    border: 1px solid #333333 !important;
}

.card-body {
    background-color: #1e1e1e !important;
}

.card-header, .card-footer {
    background-color: #252525 !important;
    border-color: #333333 !important;
}

.card-text, .card-subtitle {
    color: #ffffff !important;
}

/* Tables */
.table {
    color: #ffffff !important;
}

.table td, .table th {
    border-color: #333333 !important;
}

.table thead th {
    background-color: #252525 !important;
    border-bottom: 2px solid #333333 !important;
}

.table tbody tr:hover {
    background-color: #2c2c2c !important;
}

.table-striped tbody tr:nth-of-type(odd) {
    background-color: #1a1a1a !important;
}

/* Navbar */
.navbar {
    background-color: #121212 !important;
    border-bottom: 1px solid #333333 !important;
}

.navbar-brand, .navbar-text, .nav-link {
    color: #ffffff !important;
}

/* Sidebar */
.sidebar {
    background-color: #1a1a1a !important;
}

.sidebar-link {
    color: #ffffff !important;
}

.sidebar-link:hover, .sidebar-link.active {
    background-color: #333333 !important;
    color: #ffffff !important;
}

/* Modals */
.modal-content {
    background-color: #1e1e1e !important;
    color: #ffffff !important;
}

.modal-header, .modal-footer {
    border-color: #333333 !important;
}

/* Alerts */
.alert {
    background-color: #283238 !important;
    color: #ffffff !important;
    border-color: #333333 !important;
}

.alert-success {
    background-color: #0f401b !important;
    color: #ffffff !important;
    border-color: #0b301a !important;
}

.alert-danger {
    background-color: #471217 !important;
    color: #ffffff !important;
    border-color: #3a1012 !important;
}

.alert-info {
    background-color: #0f3a46 !important;
    color: #ffffff !important;
    border-color: #0c313c !important;
}

.alert-warning {
    background-color: #523e00 !important;
    color: #ffffff !important;
    border-color: #3f3000 !important;
}

/* Badges */
.badge {
    font-weight: 600 !important;
    color: #ffffff !important;
    display: inline-block !important;
    padding: 0.25em 0.6em !important;
}

/* Order statuses - Higher specificity for mobile compatibility */
.status-pending, 
span.status-pending, 
.badge.status-pending { 
    background-color: #FF9800 !important;
    color: #000000 !important;
}

.status-preparing, 
span.status-preparing, 
.badge.status-preparing { 
    background-color: #1E88E5 !important;
    color: #ffffff !important;
}

.status-ready, 
span.status-ready, 
.badge.status-ready { 
    background-color: #4CAF50 !important;
    color: #ffffff !important;
}

.status-delivered, 
span.status-delivered, 
.badge.status-delivered { 
    background-color: #9C27B0 !important;
    color: #ffffff !important;
}

.status-cancelled, 
span.status-cancelled, 
.badge.status-cancelled { 
    background-color: #F44336 !important;
    color: #ffffff !important;
}

/* Text utility classes */
.text-muted, .text-secondary {
    color: #b0b0b0 !important;
}

.text-primary {
    color: #28a745 !important;
}

.text-success {
    color: #5cb85c !important;
}

.text-danger {
    color: #d9534f !important;
}

.text-warning {
    color: #f0ad4e !important;
}

.text-info {
    color: #5bc0de !important;
}

/* Peek preview */
.peek-preview {
    background-color: #1e1e1e !important;
    color: #ffffff !important;
}

.peek-preview-header, .peek-preview-footer {
    background-color: #252525 !important;
    border-color: #333333 !important;
}

.peek-preview-items li {
    border-color: #333333 !important;
}

/* Dropdown menus */
.dropdown-menu {
    background-color: #1a1a1a !important;
    border-color: #333333 !important;
}

.dropdown-item {
    color: #ffffff !important;
}

.dropdown-item:hover, .dropdown-item:focus {
    background-color: #333333 !important;
    color: #ffffff !important;
}

.dropdown-divider {
    border-color: #333333 !important;
}

/* Images - ensure proper contrast */
img {
    filter: brightness(0.9) contrast(1.1);
}

/* List groups */
.list-group-item {
    background-color: #1e1e1e !important;
    border-color: #333333 !important;
    color: #ffffff !important;
}

/* Force all font weights to be at least medium */
* {
    font-weight: 500 !important;
}

strong, b, .fw-bold, .font-weight-bold {
    font-weight: 700 !important;
}

/* Override any light themed elements we might have missed */
[class*="bg-light"] {
    background-color: #1e1e1e !important;
    color: #ffffff !important;
}

[class*="text-dark"] {
    color: #ffffff !important;
}