/* Color Contrast Fixes - Fixing white text on light backgrounds */

/* ===== CRITICAL FIXES ===== */

/* Fix all headings that are set to white in the main CSS */
h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
    color: #495057 !important; /* Dark gray instead of white for all headings */
}

/* Override white headings on light backgrounds */
.bg-white h1, .bg-white h2, .bg-white h3, .bg-white h4, .bg-white h5, .bg-white h6,
.bg-light h1, .bg-light h2, .bg-light h3, .bg-light h4, .bg-light h5, .bg-light h6,
.card h1, .card h2, .card h3, .card h4, .card h5, .card h6,
.modal h1, .modal h2, .modal h3, .modal h4, .modal h5, .modal h6,
.form-section h1, .form-section h2, .form-section h3, .form-section h4, .form-section h5, .form-section h6 {
    color: #495057 !important; /* Dark gray for headings on light backgrounds */
}

/* Keep white headings only on confirmed dark backgrounds */
.bg-dark h1, .bg-dark h2, .bg-dark h3, .bg-dark h4, .bg-dark h5, .bg-dark h6,
.bg-primary h1, .bg-primary h2, .bg-primary h3, .bg-primary h4, .bg-primary h5, .bg-primary h6,
.bg-success h1, .bg-success h2, .bg-success h3, .bg-success h4, .bg-success h5, .bg-success h6,
.bg-danger h1, .bg-danger h2, .bg-danger h3, .bg-danger h4, .bg-danger h5, .bg-danger h6,
.bg-warning h1, .bg-warning h2, .bg-warning h3, .bg-warning h4, .bg-warning h5, .bg-warning h6,
.bg-info h1, .bg-info h2, .bg-info h3, .bg-info h4, .bg-info h5, .bg-info h6,
.card-header h1, .card-header h2, .card-header h3, .card-header h4, .card-header h5, .card-header h6,
.navbar-dark h1, .navbar-dark h2, .navbar-dark h3, .navbar-dark h4, .navbar-dark h5, .navbar-dark h6 {
    color: #ffffff !important; /* Keep white text on dark backgrounds */
}

/* Fix form labels that are white on light backgrounds */
.form-label {
    color: #495057 !important; /* Dark gray instead of white */
}

/* Fix section titles that are white on light backgrounds */
.address-form-title, 
.emergency-form-title,
.address-section-title,
.contact-section-title {
    color: #495057 !important; /* Dark gray instead of white */
}

/* Fix type labels that are white on light backgrounds */
.type-label {
    color: #495057 !important; /* Dark gray instead of white */
}

/* Fix address and emergency details that are white on light backgrounds */
.address-details, 
.emergency-details {
    color: #495057 !important; /* Dark gray instead of white */
}

/* Fix filter labels that are white on light backgrounds */
.filter-label {
    color: #495057 !important; /* Dark gray instead of white */
}

/* Fix navigation links that might be white on light backgrounds */
.nav-link {
    color: #495057 !important; /* Dark gray instead of white */
}

/* Fix navigation active states - keep white text only on dark gradients */
.nav-item.active .nav-link {
    color: #ffffff !important; /* Keep white on dark gradient backgrounds */
}

/* Fix buttons that have white text on light backgrounds */
.btn-outline-secondary {
    color: #495057 !important; /* Dark gray instead of white */
    background-color: #ffffff !important;
}

/* Fix edit and action links that are white on light backgrounds */
.edit-link {
    color: #007bff !important; /* Blue instead of white */
}

.edit-link:hover {
    color: #0056b3 !important; /* Darker blue on hover */
}

/* ===== SPECIFIC COMPONENT FIXES ===== */

/* Fix client form sidebar text */
.client-form-sidebar .form-label,
.client-form-sidebar .nav-section-title,
.client-form-sidebar .sidebar-title {
    color: #495057 !important; /* Dark gray for better contrast */
}

/* Fix team member form text */
.team-member-form .form-label {
    color: #495057 !important; /* Dark gray for better contrast */
}

/* Fix service form text */
.service-form .form-label {
    color: #495057 !important; /* Dark gray for better contrast */
}

/* Fix product form text */
.product-form .form-label {
    color: #495057 !important; /* Dark gray for better contrast */
}

/* Fix appointment form text */
.appointment-form .form-label {
    color: #495057 !important; /* Dark gray for better contrast */
}

/* Fix sale form text */
.sale-form .form-label {
    color: #495057 !important; /* Dark gray for better contrast */
}

/* ===== MODAL AND OVERLAY FIXES ===== */

/* Fix modal titles that might be white on light backgrounds */
.modal-title {
    color: #495057 !important; /* Dark gray instead of white */
}

/* Fix form field labels in modals */
.modal .form-label {
    color: #495057 !important; /* Dark gray for better contrast */
}

/* Fix dropdown and select text */
.form-select,
.form-control {
    color: #495057 !important; /* Dark gray text */
}

/* Fix placeholder text */
.form-control::placeholder {
    color: #6c757d !important; /* Medium gray for placeholders */
}

/* ===== TABLE AND LIST FIXES ===== */

/* Fix table headers */
.table th {
    color: #495057 !important; /* Dark gray for headers */
}

/* Fix table data */
.table td {
    color: #495057 !important; /* Dark gray for data */
}

/* Fix list items */
.list-group-item {
    color: #495057 !important; /* Dark gray for list items */
}

/* ===== CARD AND PANEL FIXES ===== */

/* Fix card headers */
.card-header h5,
.card-header h6 {
    color: #495057 !important; /* Dark gray for card headers */
}

/* Fix card body text */
.card-body {
    color: #495057 !important; /* Dark gray for card content */
}

/* Fix card body headings specifically */
.card-body h1, .card-body h2, .card-body h3, .card-body h4, .card-body h5, .card-body h6 {
    color: #495057 !important; /* Dark gray for card body headings */
}

/* Fix panel titles */
.panel-title {
    color: #495057 !important; /* Dark gray for panel titles */
}

/* ===== BUTTON AND ACTION FIXES ===== */

/* Fix secondary buttons that might have white text */
.btn-secondary {
    color: #ffffff !important; /* Keep white on dark background */
    background-color: #6c757d !important;
}

/* Fix outline buttons */
.btn-outline-primary {
    color: #007bff !important; /* Blue text */
    border-color: #007bff !important;
    background-color: transparent !important;
}

.btn-outline-primary:hover {
    color: #ffffff !important; /* White text on hover */
    background-color: #007bff !important;
}

/* Fix light buttons */
.btn-light {
    color: #495057 !important; /* Dark text on light background */
    background-color: #f8f9fa !important;
    border-color: #dee2e6 !important;
}

/* ===== DASHBOARD AND WIDGET FIXES ===== */

/* Fix dashboard widget text */
.dash-widget h5,
.dash-widget h6 {
    color: #495057 !important; /* Dark gray for better contrast */
}

/* Fix dashboard stats text */
.stats-text {
    color: #495057 !important; /* Dark gray for stats */
}

/* ===== STATUS AND BADGE FIXES ===== */

/* Fix status badges */
.badge {
    color: #ffffff !important; /* Keep white text on colored badges */
}

.badge-light {
    color: #495057 !important; /* Dark text on light badges */
    background-color: #f8f9fa !important;
}

/* Fix alert text */
.alert {
    color: #495057 !important; /* Dark gray for alert text */
}

.alert-success {
    background-color: #d4edda !important;
    color: #155724 !important;
    border-color: #c3e6cb !important;
}

.alert-danger {
    background-color: #f8d7da !important;
    color: #721c24 !important;
    border-color: #f5c6cb !important;
}

.alert-warning {
    background-color: #fff3cd !important;
    color: #856404 !important;
    border-color: #ffeaa7 !important;
}

.alert-info {
    background-color: #d1ecf1 !important;
    color: #0c5460 !important;
    border-color: #bee5eb !important;
}

/* ===== INPUT AND FORM FIXES ===== */

/* Fix input group text */
.input-group-text {
    color: #495057 !important; /* Dark gray for input group text */
    background-color: #e9ecef !important;
}

/* Fix form check labels */
.form-check-label {
    color: #495057 !important; /* Dark gray for check labels */
}

/* Fix form text helpers */
.form-text {
    color: #6c757d !important; /* Medium gray for helper text */
}

/* ===== NAVIGATION FIXES ===== */

/* Fix breadcrumb text */
.breadcrumb {
    background-color: transparent !important;
}

.breadcrumb-item {
    color: #495057 !important; /* Dark gray for breadcrumbs */
}

.breadcrumb-item.active {
    color: #6c757d !important; /* Medium gray for active breadcrumb */
}

/* Fix pagination text */
.pagination .page-link {
    color: #007bff !important; /* Blue for pagination links */
}

.pagination .page-link:hover {
    color: #0056b3 !important; /* Darker blue on hover */
}

.pagination .page-item.active .page-link {
    color: #ffffff !important; /* White text on active page */
    background-color: #007bff !important;
    border-color: #007bff !important;
}

/* ===== UTILITY CLASSES ===== */

/* Override any remaining white text on light backgrounds */
.text-white-on-light {
    color: #495057 !important; /* Use dark gray instead */
}

/* Ensure proper contrast for important text */
.text-important {
    color: #495057 !important; /* Dark gray for important text */
    font-weight: 600 !important;
}

/* Fix any remaining contrast issues */
.low-contrast-fix {
    color: #495057 !important; /* Dark gray for better contrast */
}

/* ===== RESPONSIVE FIXES ===== */

@media (max-width: 768px) {
    /* Ensure mobile text is readable */
    .mobile-text-fix {
        color: #495057 !important; /* Dark gray for mobile */
    }
}

/* ===== ACCESSIBILITY IMPROVEMENTS ===== */

/* Ensure minimum contrast ratios */
.high-contrast-text {
    color: #212529 !important; /* Very dark gray for maximum contrast */
}

/* Fix focus states for better accessibility */
.form-control:focus,
.form-select:focus {
    border-color: #007bff !important;
    box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25) !important;
}

/* Fix button focus states */
.btn:focus {
    box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25) !important;
}

/* ===== SPECIFIC PROBLEMATIC AREAS FROM ORIGINAL CSS ===== */

/* Fix client form sidebar text that was white on light background */
.client-form-sidebar .nav-link {
    color: #495057 !important; /* Dark gray instead of white */
}

.client-form-sidebar .nav-link:hover {
    color: #007bff !important; /* Blue on hover */
}

/* Fix team member form text */
.team-member-form .nav-link {
    color: #495057 !important; /* Dark gray instead of white */
}

/* Fix service form text */
.service-form .nav-link {
    color: #495057 !important; /* Dark gray instead of white */
}

/* Fix product form text */
.product-form .nav-link {
    color: #495057 !important; /* Dark gray instead of white */
}

/* Fix appointment form text */
.appointment-form .nav-link {
    color: #495057 !important; /* Dark gray instead of white */
}

/* Fix sale form text */
.sale-form .nav-link {
    color: #495057 !important; /* Dark gray instead of white */
}

/* Fix membership form text */
.membership-form .nav-link {
    color: #495057 !important; /* Dark gray instead of white */
}

/* Fix bundle form text */
.bundle-form .nav-link {
    color: #495057 !important; /* Dark gray instead of white */
}

/* Fix coupon form text */
.coupon-form .nav-link {
    color: #495057 !important; /* Dark gray instead of white */
}

/* Fix any remaining white text in form sections */
.form-section .form-label,
.form-section .section-title,
.form-section .field-label {
    color: #495057 !important; /* Dark gray for all form labels */
}

/* Fix headings in specific page sections */
.page-header h1, .page-header h2, .page-header h3, .page-header h4, .page-header h5, .page-header h6,
.content h1, .content h2, .content h3, .content h4, .content h5, .content h6,
.main-content h1, .main-content h2, .main-content h3, .main-content h4, .main-content h5, .main-content h6,
.container h1, .container h2, .container h3, .container h4, .container h5, .container h6,
.row h1, .row h2, .row h3, .row h4, .row h5, .row h6 {
    color: #495057 !important; /* Dark gray for headings in main content areas */
}

/* Fix headings in appointment and calendar sections */
.appointment-section h1, .appointment-section h2, .appointment-section h3, .appointment-section h4, .appointment-section h5, .appointment-section h6,
.calendar-section h1, .calendar-section h2, .calendar-section h3, .calendar-section h4, .calendar-section h5, .calendar-section h6,
.drawer-section h1, .drawer-section h2, .drawer-section h3, .drawer-section h4, .drawer-section h5, .drawer-section h6 {
    color: #495057 !important; /* Dark gray for appointment and calendar headings */
}

/* Fix any remaining white text in cards */
.card .card-title,
.card .card-header h5,
.card .card-header h6 {
    color: #495057 !important; /* Dark gray for card titles */
}

/* Fix any remaining white text in modals */
.modal .modal-title,
.modal .modal-header h5,
.modal .modal-header h6 {
    color: #495057 !important; /* Dark gray for modal titles */
}

/* Fix any remaining white text in dropdowns */
.dropdown-menu .dropdown-item {
    color: #495057 !important; /* Dark gray for dropdown items */
}

.dropdown-menu .dropdown-item:hover {
    color: #ffffff !important; /* White text on hover background */
    background-color: #007bff !important;
}

/* Fix any remaining white text in tabs */
.nav-tabs .nav-link {
    color: #495057 !important; /* Dark gray for tab links */
}

.nav-tabs .nav-link.active {
    color: #007bff !important; /* Blue for active tabs */
}

/* Fix any remaining white text in accordions */
.accordion .accordion-header button {
    color: #495057 !important; /* Dark gray for accordion headers */
}

/* Fix any remaining white text in tooltips */
.tooltip .tooltip-inner {
    color: #ffffff !important; /* Keep white text in tooltips (dark background) */
}

/* Fix any remaining white text in popovers */
.popover .popover-header {
    color: #495057 !important; /* Dark gray for popover headers */
}

.popover .popover-body {
    color: #495057 !important; /* Dark gray for popover body */
}

/* ===== OVERRIDE ANY REMAINING PROBLEMATIC WHITE TEXT ===== */

/* This is a catch-all for any remaining white text on light backgrounds */
* {
    /* Only apply this if the element has white text and light background */
}

/* Specific fix for any elements that might have white text on white/light backgrounds */
.text-white {
    /* Only use white text when we're sure the background is dark */
}

/* Override white text in light contexts */
.bg-light .text-white,
.bg-white .text-white,
.card .text-white,
.modal .text-white {
    color: #495057 !important; /* Use dark gray instead */
}

/* Keep white text only on confirmed dark backgrounds */
.bg-dark .text-white,
.bg-primary .text-white,
.bg-success .text-white,
.bg-danger .text-white,
.bg-warning .text-white,
.bg-info .text-white,
.navbar-dark .text-white {
    color: #ffffff !important; /* Keep white text on dark backgrounds */
}