/* Dark Mode Variables and Transitions */
:root {
    --bg-primary: #ffffff;
    --bg-secondary: #f3f4f6;
    --text-primary: #7cbe9a;
    --text-secondary: #5d8a70;
    --border-color: #e5e7eb;
}

.dark {
    --bg-primary: #0f172a; /* Slate 900 */
    --bg-secondary: #1e293b; /* Slate 800 */
    --text-primary: #f8fafc; /* Slate 50 */
    --text-secondary: #94a3b8; /* Slate 400 */
    --border-color: #334155; /* Slate 700 */
    --nav-bg: #0f172a;
    --sidebar-bg: #0f172a;
}

/* Smooth transitions for theme switching */
body, .bg-white, .bg-gray-50, .bg-gray-100, .bg-gray-200, .bg-gray-800, .bg-gray-900,
.text-gray-900, .text-gray-800, .text-gray-600, .text-gray-500, .text-white,
.border-gray-100, .border-gray-200, .border-gray-700, .border-gray-800,
.modern-sidebar, .modern-navbar, .card, .table, .store-card {
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 300ms;
}

/* Dark mode specific overrides */
.dark body {
    background-color: var(--bg-primary) !important;
    color: var(--text-primary) !important;
}

.dark .glass-strong {
    background: rgba(15, 23, 42, 0.8) !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
}

.dark .bg-white {
    background-color: var(--bg-secondary) !important;
    color: var(--text-primary) !important;
}

.dark .bg-light-gray {
    background-color: #020617 !important; /* Very dark slate */
}

/* General Text Overrides */
.dark .text-gray-900, 
.dark .text-gray-800, 
.dark .text-dark,
.dark .text-black {
    color: var(--text-primary) !important;
}

/* dark mode paragrah and label text color */
.dark p {
    color: var(--text-secondary) !important;
}

.dark .text-gray-600, 
.dark .text-gray-500, 
.dark .text-muted,
.dark .text-gray {
    color: var(--text-secondary) !important;
}

/* Card styles in dark mode */
.dark .card,
.dark .bg-white.shadow-sm, 
.dark .bg-white.shadow-lg,
.dark .store-card,
.dark .stat-card {
    background-color: var(--bg-secondary) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

.dark .card-header,
.dark .store-card-header {
    background-color: rgba(255, 255, 255, 0.02) !important;
    border-bottom-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

.dark .card-body,
.dark .store-card-body {
    color: var(--text-primary) !important;
}

.dark .store-info-label {
    color: var(--text-secondary) !important;
}

.dark .store-info-value {
    color: var(--text-primary) !important;
}

/* Navbar in Dark Mode */
.dark .modern-navbar {
    background-color: var(--nav-bg) !important;
    border-bottom-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

.dark .page-title,
.dark .modern-signin-btn {
    color: var(--text-primary) !important;
}

.dark .notification-btn, 
.dark .message-btn,
.dark .sidebar-toggle {
    color: var(--text-primary) !important;
    background-color: transparent !important;
}

.dark .user-name {
    color: var(--text-primary) !important;
}

.dark .user-role {
    color: var(--text-secondary) !important;
}

/* Sidebar in Dark Mode */
.dark .modern-sidebar,
.dark #sidebar {
    background-color: var(--sidebar-bg) !important;
    border-right-color: var(--border-color) !important;
}

.dark .sidebar-brand-text {
    color: var(--text-primary) !important;
}

.dark .sidebar-header {
    border-bottom-color: var(--border-color) !important;
}

.dark .nav-section-title {
    color: var(--text-secondary) !important;
}

.dark .nav-link {
    color: var(--text-secondary) !important;
}

.dark .nav-link:hover, 
.dark .nav-link.active {
    background-color: rgba(255, 255, 255, 0.05) !important;
    color: var(--text-primary) !important;
}

.dark .nav-link.active i, 
.dark .nav-link:hover i {
    color: var(--text-primary) !important;
}

/* Tables in Dark Mode */
.dark .table,
.dark .modern-table {
    color: var(--text-primary) !important;
    background-color: var(--bg-secondary) !important;
    border-color: var(--border-color) !important;
}

.dark .table thead,
.dark .modern-table thead {
    background-color: rgba(255, 255, 255, 0.02) !important;
}

.dark .table thead th,
.dark .modern-table thead tr th {
    background-color: rgba(255, 255, 255, 0.05) !important; /* Slightly lighter than row */
    color: var(--text-primary) !important;
    border-bottom-color: var(--border-color) !important;
}

.dark .table td,
.dark .table th,
.dark .modern-table tbody tr,
.dark .modern-table tbody tr td {
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

.dark .table-striped > tbody > tr:nth-of-type(odd) > * {
    color: var(--text-primary) !important;
    box-shadow: inset 0 0 0 9999px rgba(255, 255, 255, 0.02) !important;
}

.dark .table-hover > tbody > tr:hover > * {
    color: var(--text-primary) !important;
    box-shadow: inset 0 0 0 9999px rgba(255, 255, 255, 0.04) !important;
}

/* DataTables Specifics */
.dark .dataTables_wrapper .dataTables_length,
.dark .dataTables_wrapper .dataTables_filter,
.dark .dataTables_wrapper .dataTables_info,
.dark .dataTables_wrapper .dataTables_processing,
.dark .dataTables_wrapper .dataTables_paginate {
    color: var(--text-secondary) !important;
}

.dark .dataTables_wrapper .dataTables_filter input,
.dark .dataTables_wrapper .dataTables_length select {
    background-color: var(--bg-primary) !important; /* Darker input bg */
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

/* Form Elements and Labels in Dark Mode - High Specificity Overrides */
html.dark label,
html.dark .form-label,
html.dark .booking-form label,
html.dark .booking-form .form-label,
[data-bs-theme="dark"] label,
[data-bs-theme="dark"] .booking-form label {
    color: #f8fafc !important; /* Brighter Slate 50 */
}

html.dark label span,
html.dark label i,
[data-bs-theme="dark"] label span,
[data-bs-theme="dark"] label i {
    color: inherit !important;
}

html.dark input[type="text"],
html.dark input[type="email"],
html.dark input[type="password"],
html.dark input[type="number"],
html.dark input[type="date"],
html.dark input[type="search"],
html.dark textarea,
html.dark select,
html.dark .form-control,
html.dark .form-select,
html.dark .booking-form .light-input,
html.dark .light-input,
[data-bs-theme="dark"] .form-control,
[data-bs-theme="dark"] .light-input {
    background-color: #0f172a !important; /* Slate 900 */
    border-color: #334155 !important; /* Slate 700 */
    color: #f8fafc !important;
}

html.dark input::placeholder,
html.dark textarea::placeholder,
html.dark .booking-form .light-input::placeholder,
[data-bs-theme="dark"] input::placeholder {
    color: #94a3b8 !important; /* Slate 400 */
}

/* Specific Booking Form Group Overrides */
html.dark .location-group,
html.dark .location-type-select,
html.dark .location-address-input,
html.dark .time-select,
html.dark .btn-group .booking-type-btn {
    background-color: #0f172a !important; /* Slate 900 */
    color: #f8fafc !important;
    border-color: #334155 !important;
}

html.dark .location-group:hover,
html.dark .location-group:focus-within {
    border-color: var(--primary-color) !important;
}

html.dark .location-type-select {
    border-right: 2px solid #334155 !important;
}

html.dark .location-address-input:focus {
    background-color: rgba(3, 129, 100, 0.1) !important;
}

/* Measurement Guideline Button in dark cards */
html.dark .btn-outline-primary {
    color: #4ade80 !important; /* Brighter green */
    border-color: #4ade80 !important;
}

html.dark .btn-outline-primary:hover {
    background-color: #4ade80 !important;
    color: #0f172a !important;
}

/* Dropdowns in Dark Mode */
.dark .dropdown-menu {
    background-color: var(--bg-secondary) !important;
    border-color: var(--border-color) !important;
}

.dark .dropdown-item {
    color: var(--text-primary) !important;
}

.dark .dropdown-item:hover, 
.dark .dropdown-item:focus {
    background-color: rgba(255, 255, 255, 0.1) !important;
    color: var(--text-primary) !important;
}

.dark .dropdown-header h6 {
    color: var(--text-primary) !important;
}

.dark .dropdown-divider {
    border-top-color: var(--border-color) !important;
}

/* Navbar Scrolled State */
.dark nav.bg-transparent.scrolled {
    background-color: rgba(15, 23, 42, 0.95) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
}

/* Client specific overrides */
.dark .client-layout .client-main-content {
    background-color: var(--bg-primary) !important;
}

.dark .unread-notification {
    background-color: rgba(3, 129, 100, 0.1) !important; /* Dark green background for unread */
    border-left-color: var(--primary-color) !important;
}

.dark .notification-icon {
    background-color: rgba(255, 255, 255, 0.05) !important;
    color: var(--text-primary) !important;
}

/* Gradient text adjustments */
.dark .text-transparent {
    filter: brightness(1.2); /* Make gradients pop more on dark bg */
}