/* Light mode baseline styles */

#toast-container {
    z-index: 1080;
}
body {
    background-color: #f8f9fa;
    color: #212529;
}

body.light-mode,
body:not(.dark-mode) {
    background-color: #f8f9fa;
    color: #212529;
    --theme-background: #f8f9fa;
    --theme-text: #212529;
}

body.light-mode .container,
body.light-mode .container-fluid,
body:not(.dark-mode) .container,
body:not(.dark-mode) .container-fluid {
    background-color: #f8f9fa;
    color: #212529;
}

body.light-mode .theme-navbar,
body:not(.dark-mode) .theme-navbar {
    background-color: #ffffff;
    border-bottom: 1px solid #dee2e6;
}

body.light-mode .theme-navbar .navbar-toggler,
body:not(.dark-mode) .theme-navbar .navbar-toggler {
    border-color: #adb5bd;
}

body.light-mode .theme-navbar .navbar-toggler-icon,
body:not(.dark-mode) .theme-navbar .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(0, 0, 0, 0.55)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

body.light-mode .theme-navbar .nav-link,
body.light-mode .theme-navbar .navbar-brand,
body:not(.dark-mode) .theme-navbar .nav-link,
body:not(.dark-mode) .theme-navbar .navbar-brand {
    color: #212529 !important;
}

body.light-mode .theme-toggle,
body:not(.dark-mode) .theme-toggle {
    display: flex;
    align-items: center;
}

body.light-mode .theme-navbar .nav-link:hover,
body.light-mode .theme-navbar .nav-link:focus,
body.light-mode .theme-navbar .navbar-brand:hover,
body.light-mode .theme-navbar .navbar-brand:focus,
body:not(.dark-mode) .theme-navbar .nav-link:hover,
body:not(.dark-mode) .theme-navbar .nav-link:focus,
body:not(.dark-mode) .theme-navbar .navbar-brand:hover,
body:not(.dark-mode) .theme-navbar .navbar-brand:focus {
    color: #0d6efd !important;
}

body.light-mode .dropdown-menu,
body:not(.dark-mode) .dropdown-menu {
    background-color: #ffffff;
    color: #212529;
    border: 1px solid #dee2e6;
}

body.light-mode .dropdown-menu .dropdown-item,
body:not(.dark-mode) .dropdown-menu .dropdown-item {
    color: #212529;
}

body.light-mode .dropdown-menu .dropdown-item:hover,
body:not(.dark-mode) .dropdown-menu .dropdown-item:hover {
    background-color: #f1f3f5;
    color: #0d6efd;
}

body.light-mode .form-control,
body.light-mode .form-select,
body.light-mode textarea,
body.light-mode input[type="date"],
body.light-mode input[type="text"],
body:not(.dark-mode) .form-control,
body:not(.dark-mode) .form-select,
body:not(.dark-mode) textarea,
body:not(.dark-mode) input[type="date"],
body:not(.dark-mode) input[type="text"] {
    background-color: #ffffff !important;
    color: #212529 !important;
    border: 1px solid #ced4da !important;
}

body.light-mode .form-control:focus,
body.light-mode .form-select:focus,
body.light-mode textarea:focus,
body.light-mode input[type="date"]:focus,
body.light-mode input[type="text"]:focus,
body:not(.dark-mode) .form-control:focus,
body:not(.dark-mode) .form-select:focus,
body:not(.dark-mode) textarea:focus,
body:not(.dark-mode) input[type="date"]:focus,
body:not(.dark-mode) input[type="text"]:focus {
    background-color: #ffffff !important;
    border-color: #86b7fe !important;
    color: #212529 !important;
    box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
}

body.light-mode .dark-mode-input,
body:not(.dark-mode) .dark-mode-input {
    background-color: #ffffff !important;
    color: #212529 !important;
    border: 1px solid #ced4da !important;
}

body.light-mode input.dark-mode-input::placeholder,
body:not(.dark-mode) input.dark-mode-input::placeholder {
    color: #6c757d;
    opacity: 1;
}

body.light-mode #totalTimeDisplay,
body:not(.dark-mode) #totalTimeDisplay {
    color: #495057 !important;
    font-weight: bold;
}

body.light-mode #searchResults,
body:not(.dark-mode) #searchResults {
    background-color: #ffffff !important;
    color: #212529;
    border: 1px solid #ced4da;
}

body.light-mode #searchResults li:hover,
body:not(.dark-mode) #searchResults li:hover {
    background-color: #f1f3f5;
    color: #0d6efd;
}

body.light-mode .stat-card,
body:not(.dark-mode) .stat-card {
    background: #ffffff;
    color: #212529;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08);
}

body.light-mode .stat-card:hover,
body:not(.dark-mode) .stat-card:hover {
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.12);
}

body.light-mode .calendar table,
body:not(.dark-mode) .calendar table {
    background-color: #ffffff;
    color: #212529;
    border-collapse: collapse;
}

body.light-mode .calendar th,
body.light-mode .calendar td,
body:not(.dark-mode) .calendar th,
body:not(.dark-mode) .calendar td {
    padding: 10px;
    border: 1px solid #dee2e6;
    text-align: center;
}

body.light-mode .notification,
body:not(.dark-mode) .notification {
    background: #ffffff;
    color: #212529;
    border-left: 5px solid #0d6efd;
}

body.light-mode #emailSzModal .modal-content,
body:not(.dark-mode) #emailSzModal .modal-content {
    background-color: #ffffff;
    color: #212529;
    border: 1px solid #dee2e6;
}

body.light-mode #emailSzModal .btn-secondary,
body:not(.dark-mode) #emailSzModal .btn-secondary {
    background-color: #6c757d;
    border-color: #6c757d;
    color: #ffffff;
}

body.light-mode #emailSzModal .btn-primary,
body:not(.dark-mode) #emailSzModal .btn-primary {
    background-color: #0d6efd;
    border-color: #0d6efd;
    color: #ffffff;
}

body.light-mode #emailSzModal .btn-close,
body:not(.dark-mode) #emailSzModal .btn-close {
    filter: none;
}

body.light-mode #emailSzModal .modal-header,
body.light-mode #emailSzModal .modal-footer,
body:not(.dark-mode) #emailSzModal .modal-header,
body:not(.dark-mode) #emailSzModal .modal-footer {
    border-color: #dee2e6;
}

body.light-mode #emailSzModal .form-label,
body:not(.dark-mode) #emailSzModal .form-label {
    color: #212529;
}

body.light-mode #emailSzModal input[type="email"],
body:not(.dark-mode) #emailSzModal input[type="email"] {
    background-color: #ffffff;
    color: #212529;
    border: 1px solid #ced4da;
}

body.light-mode #emailSzModal input[type="email"]::placeholder,
body:not(.dark-mode) #emailSzModal input[type="email"]::placeholder {
    color: #6c757d;
}

body.light-mode .theme-toggle .form-check-label,
body:not(.dark-mode) .theme-toggle .form-check-label {
    color: #212529;
}

body.light-mode .theme-toggle .form-check-input,
body:not(.dark-mode) .theme-toggle .form-check-input {
    background-color: #e9ecef;
    border-color: #adb5bd;
}

body.light-mode .theme-toggle .form-check-input:checked,
body:not(.dark-mode) .theme-toggle .form-check-input:checked {
    background-color: #0d6efd;
    border-color: #0d6efd;
}

body.light-mode #global-suggestions,
body:not(.dark-mode) #global-suggestions {
    background-color: #ffffff !important;
    color: #212529;
    border: 1px solid #ced4da;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

body.light-mode #global-suggestions li,
body:not(.dark-mode) #global-suggestions li {
    border-bottom: 1px solid #e9ecef;
}

body.light-mode #global-suggestions li:hover,
body:not(.dark-mode) #global-suggestions li:hover {
    background-color: #f8f9fa;
    color: #0d6efd;
}

body.light-mode .group-header,
body:not(.dark-mode) .group-header {
    background-color: #f1f3f5;
    color: #212529;
    border-top: 2px solid #e9ecef;
    border-bottom: 2px solid #e9ecef;
}

body.light-mode .group-header td,
body:not(.dark-mode) .group-header td {
    padding: 0.75rem;
    vertical-align: middle;
}

body.light-mode .group-header button.toggle-group,
body:not(.dark-mode) .group-header button.toggle-group {
    border: 1px solid #ced4da;
    background-color: #ffffff;
    color: #212529;
}

body.light-mode .group-header button.toggle-group:hover,
body:not(.dark-mode) .group-header button.toggle-group:hover {
    background-color: #e9ecef;
}
