/* OrderItPro — Dark Theme (MarketItPro style) */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');

:root {
    --brand: #10b981;
    --brand-light: #34d399;
    --brand-dark: #059669;
    --bg: #0d0d1a;
    --bg-surface: #16213e;
    --border: #2d2d44;
    --text: #eaeaea;
    --text-muted: #6c6c80;
    --text-dim: #9ca3af;
    --success: #10b981;
    --danger: #ef4444;
    --warning: #f59e0b;
    --info: #3b82f6;
    --primary-color: #10b981;
    --bs-body-bg: #0d0d1a;
    --bs-body-color: #eaeaea;
}

* { box-sizing: border-box; }

body {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    background: var(--bg) !important;
    color: var(--text) !important;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    -webkit-font-smoothing: antialiased;
}

main { flex: 1; }

a { color: var(--brand-light); }
a:hover { color: #fff; }

/* ── Bootstrap Dark Overrides ── */

/* Navbar */
.navbar { background: rgba(13,13,26,0.9) !important; backdrop-filter: blur(12px); border-bottom: 1px solid var(--border); }
.navbar-brand { font-size: 1.4rem; font-weight: 700; color: #fff !important; }
.navbar-brand i { color: var(--brand-light); }
.navbar-dark .navbar-nav .nav-link { color: var(--text-dim) !important; font-size: 14px; font-weight: 500; border-radius: 8px; padding: 8px 14px !important; transition: all .15s; }
.navbar-dark .navbar-nav .nav-link:hover { color: #fff !important; background: rgba(255,255,255,0.05); }
.navbar-toggler { border-color: var(--border) !important; }
.navbar-toggler-icon { filter: invert(0.7); }

/* Cards */
.card { background: var(--bg-surface) !important; border: 1px solid var(--border) !important; color: var(--text) !important; box-shadow: none !important; transition: border-color .2s, transform .2s; border-radius: 16px !important; }
.card:hover { border-color: rgba(16,185,129,0.4) !important; transform: translateY(-3px); }
.card-body { color: var(--text); }
.card-title { color: var(--text) !important; font-weight: 700; }
.card-text { color: var(--text-dim) !important; }
.card-img-top { height: 200px; object-fit: cover; border-radius: 16px 16px 0 0 !important; }

/* Buttons */
.btn { font-weight: 600; border-radius: 10px; transition: all .2s; font-family: 'Inter', sans-serif; }
.btn:hover { transform: translateY(-1px); }
.btn-primary, .btn-primary:focus { background: var(--brand) !important; border-color: var(--brand) !important; color: #fff !important; }
.btn-primary:hover { background: var(--brand-dark) !important; border-color: var(--brand-dark) !important; }
.btn-outline-primary { color: var(--brand-light) !important; border-color: var(--brand) !important; }
.btn-outline-primary:hover { background: var(--brand) !important; color: #fff !important; }
.btn-light { background: rgba(255,255,255,0.1) !important; border: 1px solid var(--border) !important; color: var(--text) !important; }
.btn-light:hover { background: rgba(255,255,255,0.15) !important; color: #fff !important; }
.btn-outline-light { border-color: var(--border) !important; color: var(--text-dim) !important; }
.btn-outline-light:hover { border-color: #666 !important; color: #fff !important; }
.btn-dark { background: var(--bg-surface) !important; border-color: var(--border) !important; }
.btn-success { background: var(--success) !important; border-color: var(--success) !important; }
.btn-danger { background: var(--danger) !important; border-color: var(--danger) !important; }
.btn-warning { background: var(--warning) !important; border-color: var(--warning) !important; color: #000 !important; }
.btn-info { background: var(--info) !important; border-color: var(--info) !important; }
.btn-sm { border-radius: 8px; }

/* Forms */
.form-control, .form-select, .input-group-text {
    background: var(--bg) !important; border: 1px solid var(--border) !important;
    color: var(--text) !important; border-radius: 10px;
}
.form-control:focus, .form-select:focus {
    border-color: var(--brand) !important;
    box-shadow: 0 0 0 0.2rem rgba(16,185,129,0.15) !important;
}
.form-control::placeholder { color: var(--text-muted) !important; }
.form-label { font-weight: 600; font-size: 13px; color: var(--text-dim) !important; letter-spacing: 0.3px; }
.form-text, .text-muted { color: var(--text-muted) !important; }
.form-check-input { background-color: var(--bg) !important; border-color: var(--border) !important; }
.form-check-input:checked { background-color: var(--brand) !important; border-color: var(--brand) !important; }

/* Tables */
.table { color: var(--text) !important; --bs-table-bg: transparent; }
.table thead { background: var(--bg-surface) !important; }
.table thead th { color: var(--text-dim) !important; border-bottom: 1px solid var(--border) !important; font-size: 12px; font-weight: 600; letter-spacing: 0.5px; text-transform: uppercase; }
.table td { border-bottom: 1px solid var(--border) !important; vertical-align: middle; }
.table-hover tbody tr:hover { background: rgba(255,255,255,0.03) !important; }
.table-striped > tbody > tr:nth-of-type(odd) > * { background: rgba(255,255,255,0.02) !important; color: var(--text); }
.table-responsive { border-radius: 12px; overflow: hidden; border: 1px solid var(--border); }

/* Alerts */
.alert { border-radius: 12px; border: none; }
.alert-success { background: rgba(16,185,129,0.1) !important; color: var(--success) !important; border: 1px solid rgba(16,185,129,0.3) !important; }
.alert-danger { background: rgba(239,68,68,0.1) !important; color: var(--danger) !important; border: 1px solid rgba(239,68,68,0.3) !important; }
.alert-warning { background: rgba(245,158,11,0.1) !important; color: var(--warning) !important; border: 1px solid rgba(245,158,11,0.3) !important; }
.alert-info { background: rgba(59,130,246,0.1) !important; color: var(--info) !important; border: 1px solid rgba(59,130,246,0.3) !important; }

/* Badges */
.badge { font-weight: 600; border-radius: 6px; font-size: 11px; }
.bg-primary { background: var(--brand) !important; }
.bg-success { background: var(--success) !important; }
.bg-danger { background: var(--danger) !important; }
.bg-warning { background: var(--warning) !important; }
.bg-info { background: var(--info) !important; }
.bg-dark { background: var(--bg-surface) !important; }
.bg-light { background: rgba(255,255,255,0.05) !important; }

/* Dropdowns */
.dropdown-menu { background: var(--bg-surface) !important; border: 1px solid var(--border) !important; border-radius: 12px !important; box-shadow: 0 8px 32px rgba(0,0,0,0.4); }
.dropdown-item { color: var(--text-dim) !important; font-size: 14px; border-radius: 6px; margin: 2px 4px; padding: 8px 12px; }
.dropdown-item:hover, .dropdown-item:focus { background: rgba(255,255,255,0.05) !important; color: #fff !important; }
.dropdown-divider { border-color: var(--border) !important; }

/* Modals */
.modal-content { background: var(--bg-surface) !important; border: 1px solid var(--border) !important; color: var(--text); border-radius: 16px !important; }
.modal-header { border-bottom: 1px solid var(--border) !important; }
.modal-footer { border-top: 1px solid var(--border) !important; }
.btn-close { filter: invert(1); }

/* Pagination */
.page-link { background: var(--bg-surface) !important; border-color: var(--border) !important; color: var(--text-dim) !important; }
.page-link:hover { background: rgba(255,255,255,0.05) !important; color: #fff !important; }
.page-item.active .page-link { background: var(--brand) !important; border-color: var(--brand) !important; color: #fff !important; }

/* Progress bars */
.progress { background: var(--bg) !important; border-radius: 8px; }
.progress-bar { background: var(--brand) !important; }

/* Breadcrumbs */
.breadcrumb { background: transparent; }
.breadcrumb-item a { color: var(--brand-light); }
.breadcrumb-item.active { color: var(--text-muted); }
.breadcrumb-item + .breadcrumb-item::before { color: var(--text-muted); }

/* List groups */
.list-group-item { background: var(--bg-surface) !important; border-color: var(--border) !important; color: var(--text) !important; }
.list-group-item:hover { background: rgba(255,255,255,0.03) !important; }
.list-group-item.active { background: var(--brand) !important; border-color: var(--brand) !important; }

/* ── App-Specific Styles ── */

/* Hero / Banner overrides — kill all blue gradients */
.hero-section { background: linear-gradient(135deg, rgba(16,185,129,0.15), rgba(16,185,129,0.05)), var(--bg) !important; color: var(--text); }
.hero { background: linear-gradient(135deg, var(--brand), var(--brand-dark)) !important; }
.dashboard-header { background: linear-gradient(135deg, var(--brand), var(--brand-dark)) !important; }
/* Override any inline blue gradient banners */
[style*="rgba(13,110,253"], [style*="rgba(10,88,202"] {
    background: linear-gradient(135deg, rgba(16,185,129,0.85), rgba(5,150,105,0.9)) !important;
}
/* bg-primary cards/headers to use brand orange */
.card.bg-primary { background: var(--brand) !important; border-color: var(--brand) !important; }
.card-header.bg-primary { background: var(--brand) !important; border-color: var(--brand-dark) !important; }

/* Stats cards */
.stats-card { background: var(--bg-surface) !important; border: 1px solid var(--border); border-radius: 16px; }
.stats-card h3 { color: var(--brand-light); }
.stats-card p { color: var(--text-muted) !important; }

/* Sidebar */
.sidebar { background: var(--bg-surface) !important; border-right: 1px solid var(--border); }
.sidebar .nav-link { color: var(--text-dim) !important; border-left: 3px solid transparent; }
.sidebar .nav-link:hover, .sidebar .nav-link.active { background: rgba(255,255,255,0.05) !important; border-left-color: var(--brand); color: var(--brand-light) !important; }

/* Sticky sidebar cards — keep below content */
.col-md-3 .card.sticky-top { z-index: 1; }

/* Cart */
.cart-item { border-bottom: 1px solid var(--border) !important; }
.cart-summary { background: var(--bg-surface) !important; border: 1px solid var(--border); border-radius: 12px; }

/* Order timeline */
.order-timeline-item::before { background: var(--border) !important; }
.order-timeline-icon { background: var(--bg-surface) !important; color: var(--text-muted) !important; border: 1px solid var(--border); }
.order-timeline-item.completed .order-timeline-icon { background: var(--success) !important; color: #fff !important; border-color: var(--success); }

/* Menu */
.menu-category { background: var(--bg-surface) !important; border: 1px solid var(--border); border-radius: 12px; }
.menu-item-list li { background: var(--bg) !important; border: 1px solid var(--border); border-radius: 8px; color: var(--text); }

/* Restaurant grid */
.restaurant-grid, .menu-grid { gap: 1.5rem; }

/* Footer */
.site-footer, footer.bg-dark { background: var(--bg) !important; border-top: 1px solid var(--border) !important; }
footer .text-white-50, footer .text-muted { color: var(--text-muted) !important; }
footer a.text-white-50:hover { color: var(--brand-light) !important; }
footer h5, footer h6 { color: var(--text) !important; }
footer hr { border-color: var(--border) !important; }

/* Auth pages */
.auth-container { max-width: 450px; margin: 3rem auto; }
.auth-card { padding: 2rem; }

/* Misc Bootstrap overrides */
.bg-opacity-10 { background-color: rgba(16,185,129,0.1) !important; }
.text-primary { color: var(--brand-light) !important; }
.text-success { color: var(--success) !important; }
.text-danger { color: var(--danger) !important; }
.text-warning { color: var(--warning) !important; }
.text-info { color: var(--info) !important; }
.border { border-color: var(--border) !important; }
.border-0 { border: none !important; }
.bg-white { background: var(--bg-surface) !important; }
.bg-light, [style*="background: #f9fafb"], [style*="background: white"], .bg-body-tertiary { background: var(--bg) !important; }
.card-header { background: var(--bg) !important; border-bottom: 1px solid var(--border) !important; color: var(--text) !important; }
.card-footer { background: var(--bg) !important; border-top: 1px solid var(--border) !important; color: var(--text) !important; }
.card-subtitle { color: var(--text-dim) !important; }
.text-dark { color: var(--text) !important; }
.text-body { color: var(--text) !important; }
.text-black { color: var(--text) !important; }
.text-secondary { color: var(--text-dim) !important; }
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { color: var(--text); }
p { color: var(--text-dim); }
label { color: var(--text-dim); }
.shadow, .shadow-sm, .shadow-lg { box-shadow: 0 4px 16px rgba(0,0,0,0.3) !important; }
small, .small, small.text-muted { color: var(--text-muted) !important; }
hr { border-color: var(--border) !important; }
.opacity-75, .opacity-90 { color: var(--text-dim); }
.card-body p, .card-body span, .card-body div, .card-body td { color: var(--text-dim); }
.card-body h1, .card-body h2, .card-body h3, .card-body h4, .card-body h5, .card-body h6 { color: var(--text); }
.card-body .fw-bold, .card-body strong, .card-body b { color: var(--text); }

/* Force all Bootstrap text utilities to use dark theme colors */
.text-body-secondary { color: var(--text-muted) !important; }
.text-body-tertiary { color: var(--text-muted) !important; }
.link-body-emphasis { color: var(--brand-light) !important; }
.bg-body, .bg-body-secondary { background: var(--bg) !important; }

/* Hover shadow */
.hover-shadow { transition: border-color .2s, transform .2s; }
.hover-shadow:hover { transform: translateY(-3px); border-color: rgba(16,185,129,0.4) !important; }

/* Loading spinner */
.spinner-overlay { background: rgba(13,13,26,0.8) !important; }

/* Image preview */
.image-preview { border-radius: 12px; border: 1px solid var(--border); }

/* Responsive */
@media (max-width: 768px) {
    .restaurant-grid, .menu-grid { grid-template-columns: 1fr; }
    .sidebar { min-height: auto; }
}