/**
 * Text Contrast & Visibility Fix - SS Infotech
 * Global CSS Override for Perfect Readability
 * Ensures WCAG AA Compliance (4.5:1 contrast ratio minimum)
 * Last Updated: December 10, 2025
 */

/* ========================================
   GLOBAL TEXT COLOR FIXES
======================================== */

/* Default text on light backgrounds */
body {
    color: #1A1A1A !important;
    background-color: #f8f9fa !important;
}

/* All headings - Dark on light backgrounds */
h1,
h2,
h3,
h4,
h5,
h6 {
    color: #0D0D0D !important;
    font-weight: 700 !important;
}

/* Paragraphs and general text */
p,
span,
div,
li,
td,
th,
label {
    color: #1A1A1A !important;
}

/* Links - High contrast */
a {
    color: #007BFF !important;
    text-decoration: none !important;
}

a:hover {
    color: #0056b3 !important;
    text-decoration: underline !important;
}

/* Remove any opacity or transparency on text */
/* * {
    opacity: 1 !important;
} */

/* Remove light grey text colors */
.text-muted,
.text-secondary {
    color: #555555 !important;
}

/* ========================================
   NAVIGATION MENU - HIGH CONTRAST
======================================== */

/* Desktop Navigation */
.navbar {
    background-color: #FFFFFF !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1) !important;
}

.navbar-brand {
    color: #000000 !important;
}

.brand-name {
    background: linear-gradient(135deg, #0A47A3, #1E90FF) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}

.nav-link {
    color: #000000 !important;
    font-weight: 600 !important;
}

.nav-link:hover {
    color: #007BFF !important;
    background-color: rgba(0, 123, 255, 0.1) !important;
}

.nav-link.active {
    color: #FFFFFF !important;
    background: linear-gradient(135deg, #007BFF, #0A47A3) !important;
}

.nav-link i {
    color: inherit !important;
}

/* Dropdown Menu */
.dropdown-menu {
    background-color: #FFFFFF !important;
    border: 1px solid #CCCCCC !important;
}

.dropdown-item {
    color: #1A1A1A !important;
}

.dropdown-item:hover {
    background-color: rgba(0, 123, 255, 0.1) !important;
    color: #007BFF !important;
}

/* ========================================
   BUTTONS - WHITE TEXT ON COLORED BG
======================================== */

.btn {
    font-weight: 600 !important;
    border: none !important;
}

.btn-primary {
    background: linear-gradient(135deg, #007BFF, #0A47A3) !important;
    color: #FFFFFF !important;
    border: none !important;
}

.btn-primary:hover {
    background: linear-gradient(135deg, #0056b3, #0088cc) !important;
    color: #FFFFFF !important;
}

.btn-outline-primary {
    border: 2px solid #007BFF !important;
    color: #007BFF !important;
    background: transparent !important;
}

.btn-outline-primary:hover {
    background: #007BFF !important;
    color: #FFFFFF !important;
}

.btn-secondary {
    background-color: #6c757d !important;
    color: #FFFFFF !important;
}

.btn-success {
    background-color: #28a745 !important;
    color: #FFFFFF !important;
}

.btn-danger {
    background-color: #dc3545 !important;
    color: #FFFFFF !important;
}

.btn-warning {
    background-color: #ffc107 !important;
    color: #000000 !important;
}

.btn-info {
    background-color: #17a2b8 !important;
    color: #FFFFFF !important;
}

/* ========================================
   FORM FIELDS - HIGH CONTRAST
======================================== */

.form-control,
.form-select,
input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
input[type="tel"],
input[type="url"],
input[type="search"],
textarea,
select {
    background-color: #FFFFFF !important;
    color: #1A1A1A !important;
    border: 1px solid #CCCCCC !important;
    padding: 0.75rem 1rem !important;
    border-radius: 0.375rem !important;
}

.form-control:focus,
.form-select:focus,
input:focus,
textarea:focus,
select:focus {
    background-color: #FFFFFF !important;
    color: #1A1A1A !important;
    border-color: #007BFF !important;
    box-shadow: 0 0 0 0.25rem rgba(0, 123, 255, 0.25) !important;
    outline: none !important;
}

.form-control::placeholder,
input::placeholder,
textarea::placeholder {
    color: #666666 !important;
    opacity: 1 !important;
}

.form-label,
label {
    color: #1A1A1A !important;
    font-weight: 600 !important;
    margin-bottom: 0.5rem !important;
}

/* ========================================
   CARDS & CONTAINERS
======================================== */

/* Light background cards */
.card {
    background-color: #FFFFFF !important;
    border: 1px solid #E0E0E0 !important;
    color: #1A1A1A !important;
}

.card-title {
    color: #0D0D0D !important;
    font-weight: 700 !important;
}

.card-text {
    color: #222222 !important;
}

/* Product Cards */
.product-card {
    background-color: #FFFFFF !important;
    border: 1px solid #E0E0E0 !important;
}

.product-title {
    color: #0D0D0D !important;
}

.product-title a {
    color: #0D0D0D !important;
}

.product-title a:hover {
    color: #007BFF !important;
}

.product-description {
    color: #222222 !important;
}

.product-category {
    color: #007BFF !important;
}

.product-price .price-value {
    color: #007BFF !important;
    font-weight: 700 !important;
}

.product-price .price-label {
    color: #555555 !important;
}

/* ========================================
   SIDEBAR & INFO BOXES
======================================== */

/* Blue background sections - WHITE TEXT */
.sidebar,
.info-box,
.feature-box,
.highlight-box,
[style*="background: #0A47A3"],
[style*="background-color: #0A47A3"],
[class*="bg-primary"],
[class*="bg-info"] {
    color: #FFFFFF !important;
}

.sidebar h1,
.sidebar h2,
.sidebar h3,
.sidebar h4,
.sidebar h5,
.sidebar h6,
.info-box h1,
.info-box h2,
.info-box h3,
.info-box h4,
.info-box h5,
.info-box h6,
.feature-box h1,
.feature-box h2,
.feature-box h3,
.feature-box h4,
.feature-box h5,
.feature-box h6,
.bg-primary h1,
.bg-primary h2,
.bg-primary h3,
.bg-primary h4,
.bg-primary h5,
.bg-primary h6 {
    color: #FFFFFF !important;
}

.sidebar p,
.info-box p,
.feature-box p,
.bg-primary p {
    color: #FFFFFF !important;
}

/* White background cards - DARK TEXT */
.card-white,
.bg-white,
[style*="background: #fff"],
[style*="background-color: #fff"],
[style*="background: white"] {
    background-color: #FFFFFF !important;
}

.card-white h1,
.card-white h2,
.card-white h3,
.card-white h4,
.card-white h5,
.card-white h6,
.bg-white h1,
.bg-white h2,
.bg-white h3,
.bg-white h4,
.bg-white h5,
.bg-white h6 {
    color: #0D0D0D !important;
}

.card-white p,
.bg-white p {
    color: #222222 !important;
}

/* ========================================
   FOOTER - WHITE TEXT ON DARK BG
======================================== */

.main-footer,
footer,
.footer {
    background: linear-gradient(135deg, #1e293b 0%, #0f172a 100%) !important;
    color: #FFFFFF !important;
}

.footer-heading,
.main-footer h1,
.main-footer h2,
.main-footer h3,
.main-footer h4,
.main-footer h5,
.main-footer h6,
footer h1,
footer h2,
footer h3,
footer h4,
footer h5,
footer h6 {
    color: #FFFFFF !important;
    font-weight: 700 !important;
}

.footer-text,
.main-footer p,
footer p {
    color: #FFFFFF !important;
}

.footer-links a,
.main-footer a,
footer a {
    color: #FFFFFF !important;
}

.footer-links a:hover,
.main-footer a:hover,
footer a:hover {
    color: #00C2FF !important;
}

.footer-contact li,
.footer-contact a {
    color: #FFFFFF !important;
}

.footer-contact i {
    color: #00C2FF !important;
}

.social-link {
    background: rgba(255, 255, 255, 0.1) !important;
    color: #FFFFFF !important;
}

.social-link:hover {
    background: #00C2FF !important;
    color: #FFFFFF !important;
}

.footer-copyright,
.footer-developer {
    color: #FFFFFF !important;
}

.footer-developer strong {
    color: #00C2FF !important;
}

/* ========================================
   DARK SECTIONS - WHITE TEXT
======================================== */

.dark-section,
.bg-dark,
[class*="bg-dark"],
[style*="background: #1e1e1e"],
[style*="background-color: #1e1e1e"],
[style*="background: #222831"],
[style*="background-color: #222831"] {
    background-color: #1e293b !important;
    color: #FFFFFF !important;
}

.dark-section h1,
.dark-section h2,
.dark-section h3,
.dark-section h4,
.dark-section h5,
.dark-section h6,
.bg-dark h1,
.bg-dark h2,
.bg-dark h3,
.bg-dark h4,
.bg-dark h5,
.bg-dark h6 {
    color: #FFFFFF !important;
}

.dark-section p,
.bg-dark p {
    color: #FFFFFF !important;
}

.dark-section a,
.bg-dark a {
    color: #00C2FF !important;
}

.dark-section a:hover,
.bg-dark a:hover {
    color: #FFFFFF !important;
}

/* ========================================
   TABLES - HIGH CONTRAST
======================================== */

.table {
    color: #1A1A1A !important;
}

.table th {
    background-color: #f8f9fa !important;
    color: #0D0D0D !important;
    font-weight: 700 !important;
    border-bottom: 2px solid #CCCCCC !important;
}

.table td {
    color: #1A1A1A !important;
    border-bottom: 1px solid #E0E0E0 !important;
}

.table tr:hover {
    background-color: rgba(0, 123, 255, 0.05) !important;
}

/* ========================================
   BADGES & LABELS
======================================== */

.badge {
    font-weight: 600 !important;
}

.badge-primary {
    background-color: #007BFF !important;
    color: #FFFFFF !important;
}

.badge-success {
    background-color: #28a745 !important;
    color: #FFFFFF !important;
}

.badge-danger {
    background-color: #dc3545 !important;
    color: #FFFFFF !important;
}

.badge-warning {
    background-color: #ffc107 !important;
    color: #000000 !important;
}

.badge-info {
    background-color: #17a2b8 !important;
    color: #FFFFFF !important;
}

.badge-secondary {
    background-color: #6c757d !important;
    color: #FFFFFF !important;
}

/* ========================================
   ALERTS - HIGH CONTRAST
======================================== */

.alert {
    border-width: 1px !important;
    border-style: solid !important;
}

.alert-success {
    background-color: #d4edda !important;
    border-color: #28a745 !important;
    color: #155724 !important;
}

.alert-danger {
    background-color: #f8d7da !important;
    border-color: #dc3545 !important;
    color: #721c24 !important;
}

.alert-warning {
    background-color: #fff3cd !important;
    border-color: #ffc107 !important;
    color: #856404 !important;
}

.alert-info {
    background-color: #d1ecf1 !important;
    border-color: #17a2b8 !important;
    color: #0c5460 !important;
}

/* ========================================
   BREADCRUMBS
======================================== */

.breadcrumb {
    background-color: #f8f9fa !important;
    padding: 0.75rem 1rem !important;
    border-radius: 0.375rem !important;
}

.breadcrumb-item {
    color: #555555 !important;
}

.breadcrumb-item a {
    color: #007BFF !important;
}

.breadcrumb-item a:hover {
    color: #0056b3 !important;
}

.breadcrumb-item.active {
    color: #1A1A1A !important;
}

/* ========================================
   PAGINATION
======================================== */

.pagination .page-link {
    background-color: #FFFFFF !important;
    border: 1px solid #CCCCCC !important;
    color: #007BFF !important;
}

.pagination .page-link:hover {
    background-color: #007BFF !important;
    border-color: #007BFF !important;
    color: #FFFFFF !important;
}

.pagination .page-link.active,
.pagination .page-item.active .page-link {
    background-color: #007BFF !important;
    border-color: #007BFF !important;
    color: #FFFFFF !important;
}

/* ========================================
   MODALS
======================================== */

.modal-content {
    background-color: #FFFFFF !important;
    color: #1A1A1A !important;
}

.modal-header {
    border-bottom: 1px solid #E0E0E0 !important;
}

.modal-title {
    color: #0D0D0D !important;
}

.modal-body {
    color: #1A1A1A !important;
}

.modal-footer {
    border-top: 1px solid #E0E0E0 !important;
}

.modal-close,
.close {
    color: #1A1A1A !important;
}

/* ========================================
   SECTION HEADERS
======================================== */

.section-header {
    margin-bottom: 2rem !important;
}

.section-title {
    color: #0D0D0D !important;
    font-weight: 800 !important;
    background: linear-gradient(135deg, #007BFF, #0A47A3) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}

.section-subtitle {
    color: #555555 !important;
}

/* ========================================
   CATEGORY CARDS
======================================== */

.category-card {
    background-color: #FFFFFF !important;
    border: 1px solid #E0E0E0 !important;
}

.category-name {
    color: #0D0D0D !important;
    font-weight: 700 !important;
}

.category-desc {
    color: #222222 !important;
}

/* ========================================
   REMOVE PROBLEMATIC STYLES
======================================== */

/* Remove any filters that might affect text visibility */
.blur,
[style*="filter: blur"],
[style*="opacity: 0.6"],
[style*="opacity: 0.7"],
[style*="opacity: 0.8"] {
    filter: none !important;
    opacity: 1 !important;
}

/* Remove light grey text colors */
[style*="color: #ccc"],
[style*="color: #d4d4d4"],
[style*="color: #e0e0e0"],
[style*="color: #cccccc"] {
    color: #1A1A1A !important;
}

/* ========================================
   MOBILE RESPONSIVENESS
======================================== */

@media (max-width: 768px) {

    /* Ensure all text is readable on mobile */
    body {
        font-size: 16px !important;
    }

    h1 {
        font-size: 1.75rem !important;
    }

    h2 {
        font-size: 1.5rem !important;
    }

    h3 {
        font-size: 1.25rem !important;
    }

    h4 {
        font-size: 1.125rem !important;
    }

    h5,
    h6 {
        font-size: 1rem !important;
    }

    /* Mobile navigation */
    .navbar-collapse {
        background-color: #FFFFFF !important;
        padding: 1rem !important;
        border-radius: 0.5rem !important;
        margin-top: 1rem !important;
    }

    .nav-link {
        color: #000000 !important;
        padding: 0.75rem 1rem !important;
    }

    .nav-link:hover {
        color: #007BFF !important;
        background-color: rgba(0, 123, 255, 0.1) !important;
    }

    /* Mobile buttons - larger touch targets */
    .btn {
        min-height: 44px !important;
        padding: 0.75rem 1.25rem !important;
    }

    /* Mobile forms */
    .form-control,
    input,
    textarea,
    select {
        font-size: 16px !important;
        min-height: 44px !important;
    }
}

/* ========================================
   PRINT STYLES
======================================== */

@media print {
    body {
        color: #000000 !important;
        background: #FFFFFF !important;
    }

    a {
        color: #000000 !important;
        text-decoration: underline !important;
    }

    .btn {
        border: 1px solid #000000 !important;
        color: #000000 !important;
        background: transparent !important;
    }
}

/* ========================================
   ACCESSIBILITY ENHANCEMENTS
======================================== */

/* Focus states for keyboard navigation */
a:focus,
button:focus,
input:focus,
textarea:focus,
select:focus,
.btn:focus {
    outline: 2px solid #007BFF !important;
    outline-offset: 2px !important;
}

/* Skip to content link */
.skip-to-content {
    position: absolute;
    top: -40px;
    left: 0;
    background: #007BFF !important;
    color: #FFFFFF !important;
    padding: 8px 16px !important;
    text-decoration: none !important;
    z-index: 10000;
}

.skip-to-content:focus {
    top: 0;
}

/* High contrast mode support */
@media (prefers-contrast: high) {
    * {
        border-color: #000000 !important;
    }

    body {
        color: #000000 !important;
        background: #FFFFFF !important;
    }

    .btn-primary {
        background: #0000FF !important;
        color: #FFFFFF !important;
    }
}

/* ========================================
   END OF TEXT CONTRAST FIX
======================================== */