/*!
Improved Color Scheme and Visibility - CSS Version
*/

/* ========================================
   IMPROVED COLOR SCHEME
   ======================================== */

:root {
    --improved-text-color: #2c3e50;
    --improved-text-light: #34495e;
    --improved-text-muted: #7f8c8d;
    --improved-bg-light: #f8f9fa;
    --improved-bg-white: #ffffff;
    --improved-border-color: #dee2e6;
    --improved-border-light: #e9ecef;
    
    /* Enhanced primary colors with better contrast */
    --improved-primary: #2980b9;
    --improved-primary-light: #3498db;
    --improved-primary-dark: #1f5f85;
    --improved-secondary: #8e44ad;
    --improved-success: #27ae60;
    --improved-warning: #f39c12;
    --improved-danger: #e74c3c;
    --improved-info: #17a2b8;
}

/* ========================================
   GLOBAL IMPROVEMENTS
   ======================================== */

/* Override dark theme with better contrast */
body[data-background-color="dark"],
body[data-background-color="dark2"] {
    background-color: var(--improved-bg-light) !important;
    color: var(--improved-text-color) !important;
}

/* Improve main content area */
.main-panel {
    background-color: var(--improved-bg-light) !important;
    color: var(--improved-text-color) !important;
}

/* Better sidebar contrast */
.sidebar[data-background-color="dark"],
.sidebar[data-background-color="dark2"] {
    background-color: var(--improved-bg-white) !important;
    border-right: 1px solid var(--improved-border-color) !important;
}

.sidebar[data-background-color="dark"] .nav > .nav-item a,
.sidebar[data-background-color="dark2"] .nav > .nav-item a {
    color: var(--improved-text-color) !important;
}

.sidebar[data-background-color="dark"] .nav > .nav-item a:hover,
.sidebar[data-background-color="dark2"] .nav > .nav-item a:hover {
    background-color: rgba(41, 128, 185, 0.1) !important;
    color: var(--improved-primary) !important;
}

.sidebar[data-background-color="dark"] .nav > .nav-item a.active,
.sidebar[data-background-color="dark2"] .nav > .nav-item a.active {
    background-color: rgba(41, 128, 185, 0.15) !important;
    color: var(--improved-primary) !important;
    font-weight: 600 !important;
}

.sidebar[data-background-color="dark"] .user .info a > span,
.sidebar[data-background-color="dark2"] .user .info a > span {
    color: var(--improved-text-color) !important;
}

/* ========================================
   CHECKBOX AND FORM IMPROVEMENTS
   ======================================== */

/* Enhanced checkbox visibility */
.form-check [type="checkbox"]:not(:checked) + .form-check-sign:before,
.form-check [type="checkbox"]:checked + .form-check-sign:before,
.form-check [type="checkbox"] + .form-check-sign:before {
    border: 2px solid var(--improved-border-color) !important;
    background: var(--improved-bg-white) !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1) !important;
}

.form-check [type="checkbox"]:checked + .form-check-sign:before {
    background: var(--improved-primary) !important;
    border-color: var(--improved-primary) !important;
}

.form-check [type="checkbox"]:checked + .form-check-sign:after {
    color: var(--improved-bg-white) !important;
    font-weight: 900 !important;
}

.form-check [type="checkbox"] + .form-check-sign {
    color: var(--improved-text-color) !important;
    font-weight: 500 !important;
}

/* Improve radio buttons */
.form-radio [type="radio"]:not(:checked) + .form-radio-sign:before,
.form-radio [type="radio"]:checked + .form-radio-sign:before {
    border: 2px solid var(--improved-border-color) !important;
    background: var(--improved-bg-white) !important;
}

.form-radio [type="radio"]:checked + .form-radio-sign:after {
    color: var(--improved-primary) !important;
}

.form-radio [type="radio"] + .form-radio-sign {
    color: var(--improved-text-color) !important;
}

/* ========================================
   FORM CONTROLS IMPROVEMENTS
   ======================================== */

/* Better form controls */
.form-control {
    border: 2px solid var(--improved-border-color) !important;
    background-color: var(--improved-bg-white) !important;
    color: var(--improved-text-color) !important;
    border-radius: 6px !important;
}

.form-control:focus {
    border-color: var(--improved-primary) !important;
    box-shadow: 0 0 0 0.2rem rgba(41, 128, 185, 0.25) !important;
    background-color: var(--improved-bg-white) !important;
}

.form-control::placeholder {
    color: var(--improved-text-muted) !important;
    opacity: 1 !important;
}

/* Better labels */
label,
.form-label {
    color: var(--improved-text-color) !important;
    font-weight: 600 !important;
    margin-bottom: 0.5rem !important;
}

/* ========================================
   CARD AND CONTENT IMPROVEMENTS
   ======================================== */

/* Enhanced cards */
.card {
    background-color: var(--improved-bg-white) !important;
    border: 1px solid var(--improved-border-color) !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1) !important;
}

.card .card-header {
    background-color: var(--improved-bg-light) !important;
    border-bottom: 1px solid var(--improved-border-color) !important;
}

.card .card-header .card-title {
    color: var(--improved-text-color) !important;
    font-weight: 600 !important;
}

.card .card-body {
    color: var(--improved-text-color) !important;
}

/* Better text contrast */
h1, h2, h3, h4, h5, h6 {
    color: var(--improved-text-color) !important;
}

p, div, span {
    color: var(--improved-text-color) !important;
}

.text-muted {
    color: var(--improved-text-muted) !important;
}

/* ========================================
   BUTTON IMPROVEMENTS
   ======================================== */

/* Enhanced buttons */
.btn {
    border-radius: 6px !important;
    font-weight: 600 !important;
    border: 2px solid transparent !important;
}

.btn-primary {
    background-color: var(--improved-primary) !important;
    border-color: var(--improved-primary) !important;
    color: var(--improved-bg-white) !important;
}

.btn-primary:hover {
    background-color: var(--improved-primary-dark) !important;
    border-color: var(--improved-primary-dark) !important;
}

.btn-secondary {
    background-color: var(--improved-secondary) !important;
    border-color: var(--improved-secondary) !important;
    color: var(--improved-bg-white) !important;
}

.btn-success {
    background-color: var(--improved-success) !important;
    border-color: var(--improved-success) !important;
    color: var(--improved-bg-white) !important;
}

.btn-warning {
    background-color: var(--improved-warning) !important;
    border-color: var(--improved-warning) !important;
    color: var(--improved-bg-white) !important;
}

.btn-danger {
    background-color: var(--improved-danger) !important;
    border-color: var(--improved-danger) !important;
    color: var(--improved-bg-white) !important;
}

.btn-info {
    background-color: var(--improved-info) !important;
    border-color: var(--improved-info) !important;
    color: var(--improved-bg-white) !important;
}

/* ========================================
   TABLE IMPROVEMENTS
   ======================================== */

/* Better table styling */
.table {
    color: var(--improved-text-color) !important;
}

.table th {
    background-color: var(--improved-bg-light) !important;
    color: var(--improved-text-color) !important;
    border-color: var(--improved-border-color) !important;
    font-weight: 600 !important;
}

.table td {
    border-color: var(--improved-border-light) !important;
    color: var(--improved-text-color) !important;
}

.table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(41, 128, 185, 0.05) !important;
}

/* ========================================
   NAVIGATION IMPROVEMENTS
   ======================================== */

/* Better navigation */
.navbar {
    background-color: var(--improved-bg-white) !important;
    border-bottom: 1px solid var(--improved-border-color) !important;
}

.navbar .navbar-nav .nav-link {
    color: var(--improved-text-color) !important;
}

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

/* ========================================
   ALERT IMPROVEMENTS
   ======================================== */

/* Enhanced alerts */
.alert {
    border: none !important;
    border-left: 4px solid !important;
    border-radius: 6px !important;
}

.alert-primary {
    background-color: rgba(41, 128, 185, 0.1) !important;
    border-left-color: var(--improved-primary) !important;
    color: var(--improved-text-color) !important;
}

.alert-success {
    background-color: rgba(39, 174, 96, 0.1) !important;
    border-left-color: var(--improved-success) !important;
    color: var(--improved-text-color) !important;
}

.alert-warning {
    background-color: rgba(243, 156, 18, 0.1) !important;
    border-left-color: var(--improved-warning) !important;
    color: var(--improved-text-color) !important;
}

.alert-danger {
    background-color: rgba(231, 76, 60, 0.1) !important;
    border-left-color: var(--improved-danger) !important;
    color: var(--improved-text-color) !important;
}

/* ========================================
   RESPONSIVE IMPROVEMENTS
   ======================================== */

@media (max-width: 768px) {
    .sidebar {
        background-color: var(--improved-bg-white) !important;
    }
    
    .main-panel {
        background-color: var(--improved-bg-light) !important;
    }
}

/* ========================================
   CUSTOM UTILITIES
   ======================================== */

/* Text utilities */
.text-improved-primary { color: var(--improved-primary) !important; }
.text-improved-secondary { color: var(--improved-secondary) !important; }
.text-improved-success { color: var(--improved-success) !important; }
.text-improved-warning { color: var(--improved-warning) !important; }
.text-improved-danger { color: var(--improved-danger) !important; }
.text-improved-info { color: var(--improved-info) !important; }

/* Background utilities */
.bg-improved-light { background-color: var(--improved-bg-light) !important; }
.bg-improved-white { background-color: var(--improved-bg-white) !important; }

/* Border utilities */
.border-improved { border-color: var(--improved-border-color) !important; }
.border-improved-light { border-color: var(--improved-border-light) !important; }

/* ========================================
   SPECIFIC FIXES FOR COMMON ISSUES
   ======================================== */

/* Fix breadcrumb visibility */
.breadcrumbs {
    color: var(--improved-text-color) !important;
}

.breadcrumbs li a {
    color: var(--improved-text-color) !important;
}

/* Fix page title visibility */
.page-title {
    color: var(--improved-text-color) !important;
}

/* Fix metric labels */
.metric-label {
    color: var(--improved-text-color) !important;
}

/* Fix badge visibility */
.badge {
    color: var(--improved-bg-white) !important;
}

/* Fix dropdown menu */
.dropdown-menu {
    background-color: var(--improved-bg-white) !important;
    border: 1px solid var(--improved-border-color) !important;
}

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

.dropdown-item:hover {
    background-color: var(--improved-bg-light) !important;
}

/* Fix pagination */
.pagination > li > a,
.pagination > li > span {
    color: var(--improved-text-color) !important;
    border-color: var(--improved-border-color) !important;
}

.pagination > li.active > a,
.pagination > li.active > span {
    background-color: var(--improved-primary) !important;
    border-color: var(--improved-primary) !important;
    color: var(--improved-bg-white) !important;
}

/* Fix progress bars */
.progress {
    background-color: var(--improved-border-light) !important;
}

.progress-bar {
    background-color: var(--improved-primary) !important;
}

/* Fix modal */
.modal-content {
    background-color: var(--improved-bg-white) !important;
    border: 1px solid var(--improved-border-color) !important;
}

.modal-header {
    background-color: var(--improved-bg-light) !important;
    border-bottom: 1px solid var(--improved-border-color) !important;
}

.modal-title {
    color: var(--improved-text-color) !important;
}

/* Fix tooltip */
.tooltip .tooltip-inner {
    background-color: var(--improved-text-color) !important;
    color: var(--improved-bg-white) !important;
}

/* Fix popover */
.popover {
    background-color: var(--improved-bg-white) !important;
    border: 1px solid var(--improved-border-color) !important;
}

.popover-header {
    background-color: var(--improved-bg-light) !important;
    border-bottom: 1px solid var(--improved-border-color) !important;
    color: var(--improved-text-color) !important;
}

.popover-body {
    color: var(--improved-text-color) !important;
}

