/* 
 * Agentic Tourism Admin - Monochromatic Theme
 * Sophisticated black, white, grey, and metallic color palette
 */

:root {
    /* Monochromatic Palette */
    --mono-black: #000000;
    --mono-charcoal: #111827;
    --mono-slate-900: #0f172a;
    --mono-slate-800: #1e293b;
    --mono-slate-700: #334155;
    --mono-slate-600: #475569;
    --mono-slate-500: #64748b;
    --mono-slate-400: #94a3b8;
    --mono-slate-300: #cbd5e1;
    --mono-slate-200: #e2e8f0;
    --mono-slate-100: #f1f5f9;
    --mono-slate-50: #f8fafc;
    --mono-white: #ffffff;
    
    /* Metallic Accents */
    --metal-silver: linear-gradient(135deg, #9ca3af 0%, #d1d5db 50%, #9ca3af 100%);
    --metal-steel: linear-gradient(135deg, #4b5563 0%, #6b7280 50%, #4b5563 100%);
    --metal-charcoal: linear-gradient(135deg, #1f2937 0%, #374151 50%, #1f2937 100%);
    --metal-platinum: linear-gradient(135deg, #e5e7eb 0%, #f3f4f6 50%, #e5e7eb 100%);
}

/* Body & Background */
body {
    background: linear-gradient(135deg, #f9fafb 0%, #f3f4f6 50%, #e5e7eb 100%) !important;
    color: var(--mono-slate-700) !important;
}

/* Navbar */
.navbar {
    background: var(--mono-white) !important;
    border-bottom: 1px solid var(--mono-slate-200) !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05) !important;
}

.navbar-nav .nav-link {
    color: var(--mono-slate-700) !important;
}

.navbar-nav .nav-link:hover {
    color: var(--mono-charcoal) !important;
}

/* Sidebar - Black background with white text for maximum contrast */
#sidebarMenu.sidebar {
    background: var(--mono-black) !important;
    border-right: 1px solid var(--mono-slate-800) !important;
}

#sidebarMenu .nav-link {
    color: var(--mono-white) !important;
    padding: 0.5rem 0.75rem !important;
    margin: 0.125rem 0.5rem !important;
    font-size: 0.875rem !important;
    border-radius: 6px !important;
}

#sidebarMenu .nav-link .feather {
    width: 16px !important;
    height: 16px !important;
    margin-right: 0.5rem !important;
}

#sidebarMenu .nav-link.active {
    background: var(--mono-white) !important;
    color: var(--mono-black) !important;
    box-shadow: 0 2px 8px rgba(255, 255, 255, 0.2) !important;
}

#sidebarMenu .nav-link:hover:not(.active) {
    background: var(--mono-slate-800) !important;
    color: var(--mono-white) !important;
}

#sidebarMenu .nav-divider {
    border-top: 1px solid var(--mono-slate-700) !important;
    margin: 0.75rem 0 !important;
}

#sidebarMenu small {
    color: var(--mono-slate-400) !important;
    font-size: 0.7rem !important;
    padding: 0.25rem 0.75rem !important;
    display: block !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    margin-top: 0.5rem !important;
}

#sidebarMenu .position-sticky {
    padding-top: 0.75rem !important;
}

/* Buttons - Monochromatic */
.btn-primary {
    background: var(--mono-charcoal) !important;
    border: none !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15) !important;
    color: var(--mono-white) !important;
}

.btn-primary:hover {
    background: var(--mono-black) !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25) !important;
}

.btn-outline-primary {
    border: 2px solid var(--mono-slate-700) !important;
    color: var(--mono-slate-700) !important;
    background: transparent !important;
}

.btn-outline-primary:hover {
    background: var(--mono-slate-700) !important;
    color: var(--mono-white) !important;
}

.btn-secondary {
    background: var(--mono-slate-500) !important;
    border: none !important;
    color: var(--mono-white) !important;
}

.btn-secondary:hover {
    background: var(--mono-slate-600) !important;
}

.btn-outline-secondary {
    border: 2px solid var(--mono-slate-400) !important;
    color: var(--mono-slate-600) !important;
    background: transparent !important;
}

.btn-outline-secondary:hover {
    background: var(--mono-slate-400) !important;
    color: var(--mono-white) !important;
}

/* Badges - Monochromatic */
.badge.bg-primary,
.badge-primary {
    background: var(--mono-charcoal) !important;
    color: var(--mono-white) !important;
}

.badge.bg-success,
.badge-success {
    background: var(--mono-slate-700) !important;
    color: var(--mono-white) !important;
}

.badge.bg-warning,
.badge-warning {
    background: var(--mono-slate-400) !important;
    color: var(--mono-slate-900) !important;
}

.badge.bg-info,
.badge-info {
    background: var(--mono-slate-500) !important;
    color: var(--mono-white) !important;
}

.badge.bg-secondary {
    background: var(--mono-slate-600) !important;
    color: var(--mono-white) !important;
}

/* Text Colors - Monochromatic */
.text-primary {
    color: var(--mono-charcoal) !important;
}

.text-success {
    color: var(--mono-slate-700) !important;
}

.text-warning {
    color: var(--mono-slate-600) !important;
}

.text-info {
    color: var(--mono-slate-500) !important;
}

.text-muted {
    color: var(--mono-slate-400) !important;
}

/* Icons - Metallic Tones */
i[data-feather].text-primary,
.feather.text-primary {
    color: var(--mono-charcoal) !important;
}

i[data-feather].text-success,
.feather.text-success {
    color: var(--mono-slate-700) !important;
}

i[data-feather].text-warning,
.feather.text-warning {
    color: var(--mono-slate-500) !important;
}

i[data-feather].text-info,
.feather.text-info {
    color: var(--mono-slate-600) !important;
}

i[data-feather].text-purple,
.feather.text-purple {
    color: var(--mono-slate-800) !important;
}

/* Cards */
.card {
    border: 1px solid var(--mono-slate-200) !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05) !important;
}

/* Default white background for cards without specific styling */
.card:not([style*="background"]) {
    background: var(--mono-white) !important;
}

.card-header {
    background: var(--mono-slate-100) !important;
    border-bottom: 1px solid var(--mono-slate-200) !important;
}

/* Allow dark card headers to override default */
.card-header[style*="background"] {
    border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
}

.bg-light {
    background-color: var(--mono-slate-50) !important;
}

/* Alerts - Monochromatic */
.alert-primary {
    background-color: var(--mono-slate-100) !important;
    border-color: var(--mono-slate-300) !important;
    color: var(--mono-slate-900) !important;
}

.alert-success {
    background-color: var(--mono-slate-100) !important;
    border-color: var(--mono-slate-300) !important;
    color: var(--mono-slate-900) !important;
}

.alert-warning {
    background-color: var(--mono-slate-50) !important;
    border-color: var(--mono-slate-200) !important;
    color: var(--mono-slate-800) !important;
}

.alert-info {
    background-color: var(--mono-slate-100) !important;
    border-color: var(--mono-slate-300) !important;
    color: var(--mono-slate-900) !important;
}

/* Table Enhancements */
.table-hover tbody tr:hover {
    background-color: var(--mono-slate-50) !important;
}

.table thead th {
    background-color: var(--mono-slate-100) !important;
    color: var(--mono-slate-900) !important;
    border-bottom: 2px solid var(--mono-slate-300) !important;
}

/* Form Controls */
.form-control:focus,
.form-select:focus {
    border-color: var(--mono-slate-400) !important;
    box-shadow: 0 0 0 0.2rem rgba(100, 116, 139, 0.25) !important;
}

/* Progress Bars */
.progress-bar {
    background-color: var(--mono-slate-700) !important;
}

/* Borders */
.border-primary {
    border-color: var(--mono-slate-300) !important;
}

.border-success {
    border-color: var(--mono-slate-300) !important;
}

/* Background Utilities */
.bg-primary {
    background-color: var(--mono-charcoal) !important;
}

.bg-success {
    background-color: var(--mono-slate-700) !important;
}

.bg-primary-subtle {
    background-color: var(--mono-slate-100) !important;
}

/* Metallic Gradient Accents for Special Elements */
.metallic-silver {
    background: var(--metal-silver) !important;
    color: var(--mono-slate-900) !important;
}

.metallic-steel {
    background: var(--metal-steel) !important;
    color: var(--mono-white) !important;
}

.metallic-charcoal {
    background: var(--metal-charcoal) !important;
    color: var(--mono-white) !important;
}

.metallic-platinum {
    background: var(--metal-platinum) !important;
    color: var(--mono-slate-900) !important;
}

/* Dropdown */
.dropdown-menu {
    border: 1px solid var(--mono-slate-200) !important;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1) !important;
}

.dropdown-item:hover {
    background-color: var(--mono-slate-100) !important;
}

/* Links */
a {
    color: var(--mono-slate-700) !important;
}

a:hover {
    color: var(--mono-charcoal) !important;
}

/* Feature Icons */
.feature-icon {
    color: var(--mono-slate-600) !important;
}

/* Charts & Analytics - Use different shades of grey */
.chart-primary {
    color: var(--mono-slate-900) !important;
}

.chart-secondary {
    color: var(--mono-slate-700) !important;
}

.chart-tertiary {
    color: var(--mono-slate-500) !important;
}

/* Stat Cards - Metallic Borders */
.stat-card {
    border-left: 4px solid var(--mono-slate-700) !important;
}

.stat-card:hover {
    border-left-color: var(--mono-charcoal) !important;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1) !important;
}

/* Mobile Account Section - Black text on white background */
.mobile-account-header {
    color: var(--mono-black) !important;
    background: var(--mono-white) !important;
    font-weight: 600 !important;
    border-radius: 6px !important;
    margin: 0.5rem !important;
}

#sidebarMenu .mobile-account-link {
    background: var(--mono-white) !important;
    color: var(--mono-black) !important;
    border: 1px solid var(--mono-slate-200) !important;
}

#sidebarMenu .mobile-account-link:hover {
    background: var(--mono-slate-100) !important;
    color: var(--mono-black) !important;
    border-color: var(--mono-slate-300) !important;
}

#sidebarMenu .mobile-account-link .feather {
    color: var(--mono-black) !important;
}