/*
 * Accessibility & Contrast Fixes
 * Prevents white-on-white text visibility issues
 */

/* CORE PRINCIPLE: White backgrounds must have black text, dark backgrounds must have white text */

/* === UNIVERSAL CONTRAST RULES === */

/* Force proper contrast for all white/light background elements */
.bg-white, .bg-info, .bg-warning, .bg-success,
.card, .dropdown-menu, .tooltip, .popover, .alert,
.badge-light, .badge-white, .list-group-item, .table,
.form-control, .form-select, .breadcrumb,
input, textarea, select, option {
    background-color: #ffffff !important;
    color: #212529 !important;
    border-color: #dee2e6 !important;
}

/* Modals - white background except for social network */
.modal-content:not(.social-network-dashboard .modal-content) {
    background-color: #ffffff !important;
    color: #212529 !important;
}

.bg-light {
    color: #212529 !important;
}

/* Light backgrounds without forced background color */
.bg-light {
    color: #212529 !important;
}

/* Social Network Dashboard - Allow theme adaptation with glass morphism */
.social-network-dashboard .card,
.social-network-dashboard .card-body,
.social-network-dashboard .card-header,
.social-network-dashboard .card-footer,
.social-network-dashboard .card-title,
.social-network-dashboard .card-text,
.social-network-dashboard .card-subtitle,
.social-network-dashboard .list-group-item,
.social-network-dashboard .text-muted,
.social-network-dashboard .badge.bg-light {
    /* Override global accessibility rules to allow transparent/glass morphism */
    background-color: transparent !important;
    color: inherit !important;
}

/* Social Network Modals - Transparent glass morphism with white text */
.social-network-dashboard .modal-content,
.social-network-dashboard .modal-header,
.social-network-dashboard .modal-body,
.social-network-dashboard .modal-footer {
    background-color: transparent !important;
    color: #ffffff !important;
}

.social-network-dashboard .modal-title,
.social-network-dashboard .form-label,
.social-network-dashboard .form-text {
    color: #ffffff !important;
}

/* Social Network transparent buttons - inherit theme colors */
.social-network-dashboard .btn-outline-primary,
.social-network-dashboard .btn-outline-secondary,
.social-network-dashboard .btn-outline-success,
.social-network-dashboard .btn-outline-danger,
.social-network-dashboard .btn-outline-warning,
.social-network-dashboard .btn-outline-info {
    background: transparent !important;
    border: 1px solid currentColor !important;
    color: inherit !important;
}

.social-network-dashboard .btn:hover {
    background: rgba(255, 255, 255, 0.1) !important;
}

/* Force proper contrast for dark background elements */
.bg-primary, .bg-dark, .bg-secondary, .bg-danger,
.badge-primary, .badge-dark, .badge-secondary, .badge-danger,
.btn-primary, .btn-dark, .btn-secondary, .btn-danger {
    background-color: var(--bs-dark, #212529) !important;
    color: #ffffff !important;
}

/* Button outline variants contrast fixes */
.btn-light, 
.btn-outline-primary, 
.btn-outline-secondary, 
.btn-outline-success, 
.btn-outline-danger, 
.btn-outline-warning, 
.btn-outline-info, 
.btn-outline-dark {
    color: #212529 !important;
    border: 1px solid #ced4da !important;
}

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

/* Cards - Always white background with black text */
.card, .card-body, .card-header, .card-footer {
    /* background-color: #ffffff !important; */
    color: #212529 !important;
    /* border: 1px solid #dee2e6 !important; */
}

.card-title, .card-text, .card-subtitle {
    color: #212529 !important;
}

/* Modals - Always white background with black text (except social network) */
body:not(.social-network-dashboard) .modal-content,
body:not(.social-network-dashboard) .modal-header,
body:not(.social-network-dashboard) .modal-body,
body:not(.social-network-dashboard) .modal-footer {
    background-color: #ffffff !important;
    color: #212529 !important;
}

body:not(.social-network-dashboard) .modal-title {
    color: #212529 !important;
}

/* Forms - Always readable (except social network) */
body:not(.social-network-dashboard) .form-label,
body:not(.social-network-dashboard) .form-text {
    color: #212529 !important;
}

body:not(.social-network-dashboard) .form-control,
body:not(.social-network-dashboard) .form-select {
    background-color: #ffffff !important;
    color: #212529 !important;
    border: 1px solid #ced4da !important;
}

body:not(.social-network-dashboard) .form-control:focus,
body:not(.social-network-dashboard) .form-select:focus {
    background-color: #ffffff !important;
    color: #212529 !important;
    border-color: #86b7fe !important;
    box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25) !important;
}

body:not(.social-network-dashboard) .form-control::placeholder,
body:not(.social-network-dashboard) .form-select::placeholder {
    color: #6c757d !important;
    opacity: 1 !important;
}

/* Input elements - Universal fix */
input[type="text"], input[type="email"], input[type="password"],
input[type="number"], input[type="tel"], input[type="url"],
input[type="search"], input[type="date"], input[type="time"],
input[type="datetime-local"], input[type="month"], input[type="week"],
textarea, select {
    background-color: #ffffff !important;
    color: #212529 !important;
    border: 1px solid #ced4da !important;
}

input:focus, textarea:focus, select:focus {
    background-color: #ffffff !important;
    color: #212529 !important;
}

/* Dropdowns */
.dropdown-menu {
    background-color: #ffffff !important;
    color: #212529 !important;
    border: 1px solid #dee2e6 !important;
}

/* Ensure dropdown starts hidden and shows correctly when toggled */
ul.dropdown-menu:not(.show),
ul.dropdown-menu-modern:not(.show),
.dropdown-menu:not(.show),
.dropdown-menu-modern:not(.show) {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
}

ul.dropdown-menu.show,
ul.dropdown-menu-modern.show,
.dropdown-menu.show,
.dropdown-menu-modern.show {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    transform: none !important;
    position: absolute !important;
    z-index: 9999 !important;
}

.dropdown-item {
    color: #212529 !important;
}

.dropdown-item:hover, .dropdown-item:focus {
    background-color: #f8f9fa !important;
    color: #212529 !important;
}

/* Alerts - Proper contrast based on alert type */
.alert {
    border: 1px solid transparent !important;
}

.alert-success {
    background-color: #d1e7dd !important;
    color: #0f5132 !important;
    border-color: #badbcc !important;
}

.alert-danger {
    background-color: #f8d7da !important;
    color: #842029 !important;
    border-color: #f5c2c7 !important;
}

.alert-warning {
    background-color: #fff3cd !important;
    color: #664d03 !important;
    border-color: #ffecb5 !important;
}

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

.alert-primary {
    background-color: #cfe2ff !important;
    color: #084298 !important;
    border-color: #b6d4fe !important;
}

.alert-secondary {
    background-color: #e2e3e5 !important;
    color: #383d41 !important;
    border-color: #d3d6d8 !important;
}

.alert-light {
    background-color: #fefefe !important;
    color: #686868 !important;
    border-color: #fdfdfe !important;
}

.alert-dark {
    background-color: #d3d3d4 !important;
    color: #1b1e21 !important;
    border-color: #c6c8ca !important;
}

/* Tables */
.table {
    background-color: #ffffff !important;
    color: #212529 !important;
}

.table th, .table td {
    color: #212529 !important;
    border-color: #dee2e6 !important;
}

.table-striped > tbody > tr:nth-of-type(odd) > td {
    background-color: #f8f9fa !important;
}

/* List Groups */
.list-group-item {
    background-color: #ffffff !important;
    color: #212529 !important;
    border: 1px solid #dee2e6 !important;
}

.list-group-item:hover {
    background-color: #f8f9fa !important;
    color: #212529 !important;
}

.list-group-item.active {
    background-color: #0d6efd !important;
    color: #ffffff !important;
}

/* Badges */
.badge {
    display: inline-block !important;
}

.badge-light, .badge-white {
    background-color: #f8f9fa !important;
    color: #212529 !important;
}

.badge-dark {
    background-color: #212529 !important;
    color: #ffffff !important;
}

/* Buttons - Context-aware colors */
.btn-light, .btn-outline-primary, .btn-outline-secondary,
.btn-outline-success, .btn-outline-danger, .btn-outline-warning,
.btn-outline-info, .btn-outline-dark {
    background-color: hsla(0, 0%, 100%, 0.865) !important;
    color: #212529 !important;
    border: 1px solid #ced4da !important;
}

.btn-primary, .btn-secondary, .btn-success, .btn-danger, .btn-dark {
    color: #ffffff !important;
}

.btn-warning, .btn-info {
    color: #212529 !important;
}

/* Navigation */
.nav-tabs .nav-link {
    color: #212529 !important;
}

.nav-tabs .nav-link.active {
    background-color: #ffffff !important;
    color: #212529 !important;
}

.nav-pills .nav-link.active {
    background-color: #0d6efd !important;
    color: #ffffff !important;
}

/* Breadcrumbs */
.breadcrumb {
    background-color: #f8f9fa !important;
}

.breadcrumb-item {
    color: #212529 !important;
}

.breadcrumb-item.active {
    color: #6c757d !important;
}

/* Pagination */
.page-link {
    background-color: #ffffff !important;
    color: #0d6efd !important;
    border: 1px solid #dee2e6 !important;
}

.page-item.active .page-link {
    background-color: #0d6efd !important;
    color: #ffffff !important;
}

.page-item.disabled .page-link {
    background-color: #ffffff !important;
    color: #6c757d !important;
}

/* Progress bars */
.progress {
    background-color: #e9ecef !important;
}

.progress-bar {
    background-color: #0d6efd !important;
    color: #ffffff !important;
}

/* Tooltips and Popovers */
.tooltip-inner {
    background-color: #000000 !important;
    color: #ffffff !important;
}

.popover {
    background-color: #ffffff !important;
    color: #212529 !important;
    border: 1px solid #dee2e6 !important;
}

.popover-header {
    background-color: #f8f9fa !important;
    color: #212529 !important;
}

.popover-body {
    color: #212529 !important;
}

/* Text utility classes */
.text-muted {
    color: #6c757d !important;
}

.text-dark {
    color: #212529 !important;
}

.text-light {
    color: #f8f9fa !important;
}

.text-primary {
    color: #0d6efd !important;
}

.text-secondary {
    color: #6c757d !important;
}

.text-success {
    color: #198754 !important;
}

.text-danger {
    color: #dc3545 !important;
}

.text-warning {
    color: #ffc107 !important;
}

.text-info {
    color: #0dcaf0 !important;
}

/* === UNIVERSAL FIXES === */

/* Placeholder text */
::placeholder {
    color: #6c757d !important;
    opacity: 1 !important;
}

/* Labels */
label {
    color: #212529 !important;
}

/* Links on white backgrounds */
a {
    color: #0d6efd !important;
}

a:hover, a:focus {
    color: #0b5ed7 !important;
}

/* Prevent any white text on white backgrounds (except social network) */
.bg-white *, .bg-light *, .dropdown-menu *, .list-group-item *, .table *,
.alert-light *, .alert-warning *, .alert-info *,
.alert-success *, .badge-light *, .form-control *,
input *, textarea *, select * {
    color: inherit !important;
}

body:not(.social-network-dashboard) .card *,
body:not(.social-network-dashboard) .modal-content * {
    color: inherit !important;
}

/* Force inheritance for nested elements in white containers (except social network) */
.bg-white, .bg-light, .dropdown-menu, .list-group-item, .table,
.alert-light, .alert-warning, .alert-info, .alert-success {
    color: #212529 !important;
}

body:not(.social-network-dashboard) .card,
body:not(.social-network-dashboard) .modal-content {
    color: #212529 !important;
}

/* === ACCESSIBILITY ENHANCEMENTS === */

/* Focus indicators */
.btn:focus, .form-control:focus, .form-select:focus,
.list-group-item:focus, .dropdown-item:focus, .nav-link:focus {
    outline: 2px solid #0d6efd !important;
    outline-offset: 2px !important;
}

/* High contrast mode support */
@media (prefers-contrast: high) {
    .card, .modal-content, .dropdown-menu {
        border: 2px solid #000000 !important;
    }

    .form-control, .form-select, input, textarea, select {
        border: 2px solid #000000 !important;
    }
}

/* Reduced motion support */
@media (prefers-reduced-motion: reduce) {
    * {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}

/* Print styles */
@media print {
    * {
        background-color: #ffffff !important;
        color: #000000 !important;
    }
}

/* CRITICAL DROPDOWN FIX - Must be last to override everything */
/* Force hide all dropdown menus that don't have .show class - override inline styles */
ul[class*="dropdown-menu"]:not(.show),
[class*="dropdown-menu"]:not(.show)[style],
[class*="dropdown-menu"]:not(.show) {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    transform: translateY(-10px) !important;
}

/* Show all dropdown menus that have .show class */
ul[class*="dropdown-menu"].show,
[class*="dropdown-menu"].show[style],
[class*="dropdown-menu"].show {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: absolute !important;
    z-index: 9999 !important;
    transform: translateY(0) !important;
}

/* Force reset any Bootstrap Popper positioning that might be causing issues */
[data-bs-popper="static"]:not(.show) {
    display: none !important;
    visibility: hidden !important;
}

/* Nuclear option - force all dropdowns to start hidden regardless of any other rules */
html body .dropdown-menu,
html body .dropdown-menu-modern,
html body .dropdown-menu-end {
    display: none !important;
}

html body .dropdown-menu.show,
html body .dropdown-menu-modern.show,
html body .dropdown-menu-end.show {
    display: block !important;
}

/* Target the exact elements from console - ultra specific */
ul.dropdown-menu.dropdown-menu-end.dropdown-menu-modern[data-bs-popper="static"]:not(.show) {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    background-color: red !important; /* TEST RULE - to verify CSS is loading */
}

ul.dropdown-menu.dropdown-menu-end.dropdown-menu-modern[data-bs-popper="static"].show {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Remove blue focus outline from all clickable elements */
button:focus,
button:active,
.btn:focus,
.btn:active,
a:focus,
a:active,
input:focus,
textarea:focus,
select:focus,
.form-control:focus,
.form-select:focus,
.dropdown-toggle:focus,
.dropdown-item:focus,
.nav-link:focus,
*:focus {
    outline: none !important;
    box-shadow: none !important;
    border-color: transparent !important;
}

/* Ensure plan features text is white */
.card-body div[style*="color: white"] {
    color: #ffffff !important;
}