/* --- DARK MODE GLOBAL OVERRIDES --- */
body.dark-mode {
    --page-bg: #000000 !important;
    --sidebar-bg: rgba(5, 5, 5, 0.95);
    --card-glass-bg: rgba(15, 15, 15, 0.7);
    --text-main: #ffffff;
    --text-muted: #e2e8f0;
    --text-gray: #a1a1aa;
    --border-light: rgba(255, 255, 255, 0.08);
    --btn-active-bg: rgba(255, 255, 255, 0.05);
    --white-90: #050505;
    --white-83: #000000;
    --nav-active-bg: rgba(255, 255, 255, 0.1);
    --dark-blue-alpha: rgba(255, 255, 255, 0.05);
    --deep-navy: #ffffff;
    --slate-dark: #ffffff;
    --mobile-nav-bg: #050505;
    --mobile-nav-bubble-bg: #111111;
    background-color: #000000 !important;
}

body.dark-mode .page-frosted-overlay {
    background: rgba(0, 0, 0, 0.85);
    backdrop-filter: blur(40px);
}

body.dark-mode .page-background-base {
    filter: blur(30px) brightness(0.3) contrast(1.2) desaturate(0.7);
}

body.dark-mode .bg-blur-1 {
    background: radial-gradient(circle, rgba(90, 28, 255, 0.08) 0%, rgba(255, 255, 255, 0) 70%);
    filter: blur(160px);
}

body.dark-mode .bg-blur-2 {
    background: radial-gradient(circle, rgba(0, 102, 255, 0.08) 0%, rgba(255, 255, 255, 0) 70%);
    filter: blur(160px);
}

body.dark-mode .bg-blur-3 {
    background: radial-gradient(circle, rgba(139, 92, 246, 0.05) 0%, rgba(255, 255, 255, 0) 70%);
    filter: blur(160px);
}

/* Text Visibility Overrides */
body.dark-mode h1,
body.dark-mode h2,
body.dark-mode h3,
body.dark-mode p,
body.dark-mode span:not(.logo-text):not(.risk-text):not(.scan-text):not(.text-blue-500):not(.toggle-text):not(#toggle-text):not(.icon-gradient),
body.dark-mode i:not(.icon-no-override):not(.icon-gradient) {
    color: #ffffff !important;
    -webkit-text-fill-color: initial !important;
}

/* Sidebar Dark Mode */
body.dark-mode .toggle-icon-btn {
    background-color: rgba(255, 255, 255, 0.1) !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
}

body.dark-mode .sidebar-item.active {
    background: rgba(255, 255, 255, 0.15) !important;
}

body.dark-mode .sidebar-item.active .icon-circle {
    background: rgba(255, 255, 255, 0.25) !important;
}

/* Global Theme Toggle Dark Mode Fix */
body.dark-mode #theme-toggle {
    background-color: var(--white-90) !important;
    color: var(--text-main) !important;
    border-color: var(--border-light) !important;
}


/* AI Assistant Dark Mode */
body.dark-mode .ai-assistant-bubble {
    background: rgba(15, 15, 15, 0.85);
    border: 1px solid rgba(255, 255, 255, 0.12);
}

body.dark-mode .secure-badge {
    background: rgba(75, 195, 15, 0.2) !important;
}

/* --- PAGE SPECIFIC DARK MODE OVERRIDES --- */

/* Data Map Specific */
body.dark-mode .search-pill {
    background: rgba(20, 20, 20, 0.8);
    border: 1px solid rgba(255, 255, 255, 0.05);
}

body.dark-mode .search-pill input {
    color: white;
}

body.dark-mode .search-pill input::placeholder {
    color: rgba(255, 255, 255, 0.35) !important;
}

body.dark-mode .risk-pill {
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.05);
}

/* Request Ledger Specific */
body.dark-mode .status-tab.active {
    background: rgba(47, 97, 255, 0.2) !important;
    color: #60A5FA !important;
}

body.dark-mode .status-tab:not(.active) {
    color: #94A3B8 !important;
}

body.dark-mode .progress-circle .ring-bg {
    stroke: #262626;
}

body.dark-mode .progress-text {
    color: #ffffff !important;
}

/* Vault Specific */
body.dark-mode .vault-inner-card {
    background: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

body.dark-mode .vault-progress-bg {
    background: rgba(255, 255, 255, 0.1) !important;
}

body.dark-mode .vault-toggle:not(.is-on) {
    background-color: rgba(255, 255, 255, 0.1) !important;
    box-shadow: inset 0 0 11px rgba(0, 0, 0, 0.5) !important;
}

body.dark-mode .vault-badge {
    background: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
}

body.dark-mode .risk-pill-bg {
    background-color: rgba(255, 48, 145, 0.25) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

body.dark-mode .risk-pill-bg.risk-medium {
    background-color: rgba(255, 152, 0, 0.25) !important;
}

body.dark-mode .risk-pill-bg.risk-low {
    background-color: rgba(76, 175, 80, 0.25) !important;
}

/* --- ADDITIONAL VISIBILITY FIXES --- */

/* Insights Page Score Circle */
body.dark-mode .score-circle-inner-bg {
    background: radial-gradient(circle, #0f172a 0%, #000000 100%) !important;
    box-shadow: inset 0 4px 12px rgba(255, 255, 255, 0.05), inset 0 -2px 6px rgba(0, 0, 0, 0.5) !important;
}

/* Data Footprint Chart Labels (12m) */
body.dark-mode .chart-label-bg {
    background: #1e293b !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3) !important;
}

body.dark-mode .chart-label-item.text-gray-300 {
    color: #64748b !important;
    /* Slightly darker gray for inactive months in dark mode */
}

/* Data Map Tags & Labels (Hardcoded Tailwind Hex Fixes) */
body.dark-mode .text-\[\#0D0D26\] {
    color: #ffffff !important;
}

body.dark-mode .bg-\[\#F4F5F7\] {
    background-color: rgba(255, 255, 255, 0.1) !important;
}

body.dark-mode .text-\[\#4A4C63\] {
    color: #cbd5e1 !important;
}

/* Promo Card Buttons & Icons */
body.dark-mode .promo-card button.bg-white {
    background-color: rgba(255, 255, 255, 0.08) !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3) !important;
}

body.dark-mode .promo-card button.bg-white i {
    /* Ensure the color of check/cross icons is preserved and not forced to white */
    -webkit-text-fill-color: initial !important;
}

/* --- V3 VISIBILITY REFINEMENTS --- */

/* Restore Info Icon Styles (Insights Page) */
body.dark-mode .info-btn-premium {
    background: linear-gradient(135deg, var(--accent-blue), var(--accent-purple)) !important;
    border: none !important;
}

body.dark-mode .info-btn-premium i {
    -webkit-text-fill-color: #ffffff !important;
    color: #ffffff !important;
}


/* Restore Vault Badge Status Colors */
body.dark-mode .vault-badge.success span {
    color: var(--success-green) !important;
    -webkit-text-fill-color: initial !important;
}

body.dark-mode .vault-badge.error span {
    color: var(--red-pink) !important;
    -webkit-text-fill-color: initial !important;
}

/* Request Page Branding Contrast Fixes */
body.dark-mode .bg-white i.fa-apple {
    color: #ffffff !important;
    -webkit-text-fill-color: initial !important;
}

body.dark-mode .bg-white i.fa-apple {
    background: black !important;
    border-radius: 50% !important;
    width: 100% !important;
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* Use a better dark mode circle for Apple logo in requests.html */
body.dark-mode .bg-white:has(i.fa-apple) {
    background-color: #000000 !important;
}

/* Broadened Score Target for Data Map */
body.dark-mode .risk-pill-bg span,
body.dark-mode .risk-pill-bg span[class*="text-[#0D0D26]"],
body.dark-mode h3[class*="text-[#0D0D26]"] {
    color: #ffffff !important;
}

/* Vault Badge Visibility Refinements */
body.dark-mode .vault-badge.success {
    background: rgba(75, 195, 15, 0.15) !important;
    border: 1px solid rgba(75, 195, 15, 0.3) !important;
}

body.dark-mode .vault-badge.error {
    background: rgba(255, 48, 145, 0.15) !important;
    border: 1px solid rgba(255, 48, 145, 0.3) !important;
}

body.dark-mode .vault-badge.success span {
    color: #4BC30F !important;
    -webkit-text-fill-color: initial !important;
}

body.dark-mode .vault-badge.error span {
    color: #FF3091 !important;
    -webkit-text-fill-color: initial !important;
}

/* Bell Icon Container Visibility (Insights) */
body.dark-mode .bg-blue-50 {
    background-color: rgba(59, 130, 246, 0.2) !important;
    border: 1px solid rgba(59, 130, 246, 0.3) !important;
}

body.dark-mode .bg-blue-50 i {
    color: #60A5FA !important;
    -webkit-text-fill-color: initial !important;
}

/* Consolidated into V3 VISIBILITY REFINEMENTS above */

body.dark-mode i:not(.icon-no-override):not(.icon-gradient) {
    color: #ffffff !important;
    -webkit-text-fill-color: initial !important;
}

/* --- FAQ DARK MODE --- */
body.dark-mode .faq-item {
    background: rgba(15, 23, 42, 0.6);
    border-color: rgba(255, 255, 255, 0.08);
}

body.dark-mode .faq-item:hover {
    background: rgba(30, 41, 59, 0.8);
    border-color: rgba(255, 255, 255, 0.15);
}

body.dark-mode .faq-item.active {
    background: rgba(15, 23, 42, 0.95);
    border-color: var(--accent-purple);
    box-shadow: 0 0 20px rgba(90, 28, 255, 0.2);
}

body.dark-mode .question-badge {
    background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
    color: #818cf8;
    box-shadow: inset 0 2px 4px rgba(255, 255, 255, 0.05);
}

body.dark-mode .back-btn,
body.dark-mode .chevron-box {
    background: rgba(30, 41, 59, 0.6);
    border-color: rgba(255, 255, 255, 0.1);
    color: #94a3b8;
}

body.dark-mode .faq-item.active .chevron-box {
    background: linear-gradient(135deg, var(--accent-blue), var(--accent-purple));
    color: white;
    border: none;
}

body.dark-mode .faq-item.active .faq-content {
    border-top-color: rgba(255, 255, 255, 0.05);
}

/* --- REQUEST DETAILS MODAL DARK MODE --- */
body.dark-mode .modal-overlay {
    background: rgba(0, 0, 0, 0.6);
}

body.dark-mode .modal-content {
    background: #0D0D15;
    border-color: rgba(255, 255, 255, 0.08);
}

body.dark-mode .modal-header {
    border-bottom-color: rgba(255, 255, 255, 0.05);
}

body.dark-mode .modal-close-btn {
    background: rgba(255, 255, 255, 0.05);
    color: #a1a1aa;
}

body.dark-mode .modal-close-btn:hover {
    background: rgba(255, 255, 255, 0.1);
}

body.dark-mode .timeline-line {
    background: rgba(255, 255, 255, 0.05);
}

body.dark-mode .timeline-dot {
    border-color: #0D0D15;
    background: #1e293b;
}

body.dark-mode .timeline-content h4 {
    color: #ffffff !important;
}

body.dark-mode .timeline-content p {
    color: #a1a1aa !important;
}

body.dark-mode .modal-footer-info {
    border-top-color: rgba(255, 255, 255, 0.05) !important;
}

body.dark-mode .modal-footer-info p[id^="modal-"] {
    color: #ffffff !important;
}

body.dark-mode .bg-gray-100\/50 {
    background-color: rgba(255, 255, 255, 0.05) !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
    color: #ffffff !important;
}

/* --- REQUEST DETAILS SCREEN DARK MODE --- */
body.dark-mode .page-details-bg {
    background: #000000 !important;
}

body.dark-mode .hash-card {
    background: linear-gradient(135deg, rgba(30, 41, 59, 0.7) 0%, rgba(15, 23, 42, 0.4) 100%) !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
}

body.dark-mode .response-card {
    background: linear-gradient(135deg, rgba(88, 28, 135, 0.2) 0%, rgba(15, 23, 42, 0.4) 100%) !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
}

body.dark-mode .clean-info-container {
    background: #0D0D15 !important;
    border-color: rgba(255, 255, 255, 0.08) !important;
}

body.dark-mode .hash-card p,
body.dark-mode .response-card p,
body.dark-mode .timeline-content p {
    color: #cbd5e1 !important;
}

body.dark-mode .timeline-step-dot {
    border-color: #0d0d15 !important;
    background: #4285F4 !important;
}

body.dark-mode .bg-white\/50 {
    background-color: rgba(255, 255, 255, 0.05) !important;
}

/* --- FILTER MODAL DARK MODE --- */
body.dark-mode .filter-modal-content {
    background: linear-gradient(rgb(0 0 0), rgb(0 0 0 / 90%)), url(../image/bg.png) !important;
}

body.dark-mode .filter-pill {
    background: rgba(255, 255, 255, 0.05) !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
    color: #cbd5e1 !important;
}

body.dark-mode .filter-pill.active {
    background: rgba(30, 30, 45, 0.9) !important;
    color: #ffffff !important;
    background-image: linear-gradient(rgba(30, 30, 45, 0.9), rgba(30, 30, 45, 0.9)), linear-gradient(135deg, var(--orange), var(--red-pink)) !important;
}

body.dark-mode .filter-pill i:not(.icon-no-override) {
    color: inherit !important;
}

body.dark-mode .bg-red-100 {
    background-color: rgba(239, 68, 68, 0.2) !important;
}

body.dark-mode .text-red-500 {
    color: #f87171 !important;
}

body.dark-mode .text-orange-400 {
    color: #fb923c !important;
}

body.dark-mode .text-green-500 {
    color: #4ade80 !important;
}

/* --- CHAT PAGE DARK MODE --- */
body.dark-mode .chat-header {
    background: transparent;
}

body.dark-mode .welcome-logo-inner {
    background: rgba(255, 255, 255, 0.1) !important;
    border: 1px solid rgba(255, 255, 255, 0.2);
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.4);
}

body.dark-mode .chat-bubble-user {
    background: linear-gradient(135deg, rgba(47, 97, 255, 0.2) 0%, rgba(90, 28, 255, 0.2) 100%) !important;
    border: 1px solid rgba(255, 255, 255, 0.1);
    color: #ffffff !important;
}

body.dark-mode .chat-bubble-ai {
    background: rgba(30, 30, 40, 0.7) !important;
    border: 1px solid rgba(255, 255, 255, 0.1);
    color: #f1f5f9 !important;
}

body.dark-mode .chat-result-card {
    background: rgba(20, 20, 30, 0.8) !important;
    border: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.5);
}

body.dark-mode .risk-summary-box {
    background: linear-gradient(135deg, rgba(30, 30, 40, 0.8) 0%, rgba(20, 20, 30, 0.9) 100%) !important;
    border: 1px solid rgba(255, 255, 255, 0.05);
}

body.dark-mode .chat-input-bar {
    background: rgba(20, 20, 25, 0.95) !important;
    border: 1px solid rgba(255, 255, 255, 0.15);
    box-shadow: 0 -5px 25px rgba(0, 0, 0, 0.3);
}

body.dark-mode .chat-input-bar input {
    color: #ffffff !important;
}

body.dark-mode .action-chip {
    background: rgba(255, 255, 255, 0.08) !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
    color: #ffffff !important;
}

body.dark-mode .action-chip:hover {
    background: rgba(255, 255, 255, 0.15) !important;
    border-color: rgba(255, 255, 255, 0.2) !important;
}

body.dark-mode .chat-warning-banner {
    background: rgba(255, 48, 145, 0.1) !important;
    border: 1px solid rgba(255, 48, 145, 0.2);
}

body.dark-mode .chat-scroll-area::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, #3CCBFF 0%, #5A1CFF 100%);
}

body.dark-mode .chat-scroll-area::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(180deg, #FFAA2C 0%, #FF3091 100%);
}

body.dark-mode .score-badge {
    background: rgba(46, 125, 50, 0.2) !important;
    color: #81C784 !important;
    border: 1px solid rgba(46, 125, 50, 0.3);
}

body.dark-mode .data-map-link-chip {
    background: rgba(30, 30, 45, 0.9) !important;
    border-color: rgba(255, 255, 255, 0.1);
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.5);
}

body.dark-mode .data-map-link-chip span,
body.dark-mode .data-map-link-chip b {
    color: #ffffff !important;
}

body.dark-mode .copy-circle-btn {
    box-shadow: 0 4px 14px rgba(66, 133, 244, 0.2) !important;
}

body.dark-mode .copy-circle-btn {
    box-shadow: 0 4px 14px rgba(66, 133, 244, 0.2) !important;
}

body.dark-mode .deadline-pill {
    background: rgba(255, 51, 102, 0.15) !important;
    color: #FF3366 !important;
}

body.dark-mode .copy-circle-btn {
    box-shadow: 0 4px 14px rgba(66, 133, 244, 0.2) !important;
}

body.dark-mode .bg-white\/50 {
    background-color: rgba(255, 255, 255, 0.05) !important;
}

/* Fix for Chat Page Delete Button */
body.dark-mode .bg-red-50 {
    background-color: rgba(239, 68, 68, 0.15) !important;
    border-color: rgba(239, 68, 68, 0.3) !important;
}

body.dark-mode .bg-red-50 i {
    color: #f87171 !important;
    /* text-red-400 */
    -webkit-text-fill-color: initial !important;
}

/* --- CONTACT PAGE DARK MODE --- */
body.dark-mode.contact-page-body { background: #000000 !important; }
body.dark-mode .ticket-card { background: rgba(15, 15, 20, 0.8) !important; border-color: rgba(255, 255, 255, 0.08) !important; box-shadow: 0 10px 40px rgba(0, 0, 0, 0.4) !important; }
body.dark-mode .status-badge-pill { background: rgba(255, 255, 255, 0.05) !important; }
body.dark-mode .status-badge-pill span { color: #ffffff !important; }
body.dark-mode .filter-tab:not(.active) { color: #94A3B8 !important; }
body.dark-mode .filter-tab.active { background: rgba(255, 255, 255, 0.1) !important; color: #ffffff !important; }
body.dark-mode .read-more-link { color: #94A3B8 !important; }
body.dark-mode .close-btn { background: rgba(255, 255, 255, 0.08) !important; border-color: rgba(255, 255, 255, 0.1) !important; color: #ffffff !important; }
body.dark-mode .contact-icon-small { background: rgba(90, 28, 255, 0.2) !important; color: #A78BFA !important; }
body.dark-mode .status-open { background: rgba(59, 130, 246, 0.15) !important; color: #60A5FA !important; }
body.dark-mode .status-pending { background: rgba(139, 92, 246, 0.15) !important; color: #A78BFA !important; }
body.dark-mode .status-resolved { background: rgba(16, 185, 129, 0.15) !important; color: #34D399 !important; }

/* Dark Mode for Modal */
body.dark-mode .create-ticket-modal { background: #111118; box-shadow: 0 25px 50px rgba(0, 0, 0, 0.5); }
body.dark-mode .modal-title { color: #ffffff; }
body.dark-mode .form-input { background: rgba(255, 255, 255, 0.05); border-color: rgba(255, 255, 255, 0.1); color: #ffffff; }

/* --- SPLASH DARK MODE --- */
body.dark-mode.splash-body {
    background-color: #000000;
}

body.dark-mode.splash-body .circle-3 { background-color: #050505; }
body.dark-mode.splash-body .circle-2 { background-color: #0a0a0a; }
body.dark-mode.splash-body .circle-1 { background-color: #111111; }

body.dark-mode.splash-body .splash-center {
    background: #111111;
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.8);
    border: 1px solid rgba(255, 255, 255, 0.05);
}

body.dark-mode.splash-body .brand-text-splash {
    color: #ffffff;
}

body.dark-mode.splash-body .lang-dropdown-splash {
    background: #111111;
    border-color: rgba(255, 255, 255, 0.1);
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.8);
}

body.dark-mode.splash-body .lang-option-splash {
    color: #e2e8f0;
}

body.dark-mode.splash-body .lang-option-splash:hover {
    background-color: #1a1a1a;
    color: #ffffff;
}

body.dark-mode.splash-body .lang-dropdown-splash::-webkit-scrollbar-thumb {
    border-color: #111111;
}

body.dark-mode.splash-body .google-btn-splash {
    background-color: #111111;
    color: #ffffff;
    border: 1px solid rgba(255, 255, 255, 0.1);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.4);
}

body.dark-mode.splash-body .text-\[\#84849A\] {
    color: #a1a1aa !important;
}

body.dark-mode.splash-body #theme-toggle {
    background-color: #111111 !important;
    color: #ffffff !important;
    border-color: rgba(255,255,255,0.1) !important;
}

/* --- ONBOARDING DARK MODE --- */
body.dark-mode .pill-delete {
    background-image: linear-gradient(#000000, #000000), linear-gradient(to right, #FFAA2C, #FF3091) !important;
}

body.dark-mode .pill-protect {
    background-image: linear-gradient(#000000, #000000), linear-gradient(to right, #3CCBFF, #5A1CFF) !important;
}

body.dark-mode {
    background: #000000;
    color: white;
    --onboarding-title: #ffffff;
    --onboarding-text: #cbd5e1;
}

body.dark-mode .card-registration,
body.dark-mode .card-identify,
body.dark-mode .card-dsar {
    background: rgba(255, 255, 255, 0.05);
    border-color: rgba(255, 255, 255, 0.1);
}

body.dark-mode .dot:not(.active) {
    background: #334155;
}

body.dark-mode .dot.active {
    background: linear-gradient(90deg, #FF7E5F, #FEB47B);
}

body.dark-mode .bubble-purple,
body.dark-mode .bubble-orange {
    background: #111111;
    color: white;
}

body.dark-mode #prev-arrow,
body.dark-mode #next-arrow {
    background-image: linear-gradient(#18181b, #18181b), linear-gradient(90deg, #FFAA2C, #FF3091);
    color: white !important;
}

/* Consent Card Icon Container Dark Mode */
body.dark-mode .consent-card .bg-white {
    background: rgba(255, 255, 255, 0.1) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2) !important;
}

body.dark-mode .icon-gradient {
    background: linear-gradient(180deg, #3CCCFF 0%, #5A1CFF 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}
/* --- PRIVACY SWEEP DARK MODE --- */
body.dark-mode .progress-container {
    background: rgba(255, 255, 255, 0.05);
}

body.dark-mode .mobile-nav-item.active-nav .nav-icon-wrapper {
    background: rgba(255, 48, 145, 0.2);
}

/* --- BUSINESS DIRECTORY DARK MODE --- */
body.dark-mode .directory-card {
    background: rgba(15, 15, 15, 0.45);
    border-color: rgba(255, 255, 255, 0.08);
    backdrop-filter: blur(30px);
    -webkit-backdrop-filter: blur(30px);
}

body.dark-mode .directory-card::before {
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0) 100%);
}

body.dark-mode .card-title {
    color: #FFFFFF !important;
}

body.dark-mode .directory-card:hover {
    background: rgba(25, 25, 25, 0.6);
    border-color: rgba(255, 255, 255, 0.15);
}

body.dark-mode .risk-badge-mini {
    background: rgba(225, 29, 72, 0.2);
    color: #FB7185;
}

body.dark-mode .company-logo-large {
    background: rgb(37 99 235 / var(--tw-bg-opacity, 1));
    border-color: rgba(255, 255, 255, 0.05);
}

/* --- BUSINESS PROFILE DARK MODE --- */
body.dark-mode {
    --bp-datamap-bg: var(--card-glass-bg, rgba(15, 15, 15, 0.7));
    --bp-datamap-border: var(--border-light, rgba(255, 255, 255, 0.08));
    --bp-contacts-bg: var(--card-glass-bg, rgba(15, 15, 15, 0.7));
    --bp-contacts-border: var(--border-light, rgba(255, 255, 255, 0.08));
    --bp-inset-shadow: none;
    --bp-icon-bg: rgb(29 28 28);
}

body.dark-mode .glass-pill-btn {
    background: rgba(255, 255, 255, 0.1);
    border-color: rgba(255, 255, 255, 0.1);
}

body.dark-mode .glass-pill-btn:hover {
    background: rgba(255, 255, 255, 0.15);
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.3);
}

/* Branding logo exception - don't invert specific branding */
body.dark-mode .usflag, 
body.dark-mode .logo-container img {
    filter: none !important;
}

/* --- USER PROFILE DARK MODE OVERRIDES --- */
body.dark-mode.user-profile-body {
    background: #000000 !important;
}

body.dark-mode .profile-edit-settings-pill {
    background: rgba(15, 23, 42, 0.6);
    border: 1px solid rgba(255, 255, 255, 0.1);
}

body.dark-mode .deadline-alert-banner {
    background: linear-gradient(135deg, rgba(255, 48, 145, 0.15) 0%, rgba(255, 170, 44, 0.15) 100%);
    border: 1px solid rgba(255, 48, 145, 0.25);
}

body.dark-mode .deadline-alert-banner span.alert-text,
body.dark-mode .deadline-alert-banner h4,
body.dark-mode .deadline-alert-banner p {
    color: #ffffff !important;
}

body.dark-mode .badges-container-card {
    background: var(--card-glass-bg) !important;
    border: 1px solid rgba(255, 255, 255, 0.05) !important;
}

body.dark-mode .activity-container-card {
    background: var(--card-glass-bg) !important;
    border: 1px solid rgba(255, 255, 255, 0.05) !important;
}

body.dark-mode .badge-card {
    background: rgba(30, 41, 59, 0.8) !important;
    border: none !important;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15) !important;
}

body.dark-mode .badge-card:hover {
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.3);
}

body.dark-mode .profile-btn-white {
    background: rgba(30, 41, 59, 0.8);
    color: #3CCBFF;
    border: 1px solid rgba(60, 203, 255, 0.15);
}

body.dark-mode .profile-btn-white:hover {
    background: rgba(15, 23, 42, 0.8);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.3);
}

body.dark-mode .secure-badge-green {
    background: rgba(75, 195, 15, 0.18);
    border: 1px solid rgba(75, 195, 15, 0.3);
    color: #5eff1a;
}

body.dark-mode .profile-edit-settings-pill a svg {
    stroke: #ffffff !important;
}

body.dark-mode .profile-edit-settings-pill a:hover svg {
    stroke: url(#hoverBlueGradient) !important;
}

body.dark-mode .mobile-main-content-card {
    background: linear-gradient(135deg, rgba(60, 203, 255, 0.12) 0%, rgba(90, 28, 255, 0.12) 100%) !important;
    border: 1px solid rgba(255, 255, 255, 0.06) !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2) !important;
}

body.dark-mode .modal-content {
    background: rgba(15, 23, 42, 0.9) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3) !important;
}

body.dark-mode .modal-content h2 {
    color: #ffffff !important;
}

body.dark-mode .modal-label {
    color: #3CCBFF !important;
}

body.dark-mode .modal-input {
    background: rgba(15, 23, 42, 0.6) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    color: #ffffff !important;
}

body.dark-mode .modal-input:focus {
    border-color: #3CCBFF !important;
    box-shadow: 0 0 0 3px rgba(60, 203, 255, 0.15) !important;
}

body.dark-mode .modal-close-btn {
    background: rgba(255, 255, 255, 0.06) !important;
    color: #ffffff !important;
}

body.dark-mode .modal-close-btn:hover {
    background: rgba(255, 255, 255, 0.1) !important;
}

/* --- ACCOUNT SETTINGS PAGE DARK MODE OVERRIDES --- */
body.dark-mode .settings-card-blue,
body.dark-mode .settings-card-purple,
body.dark-mode .settings-card-blue.glass-card,
body.dark-mode .settings-card-purple.glass-card {
    background: var(--card-glass-bg) !important;
    box-shadow: none !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
}

/* Inner rows in the settings cards */
body.dark-mode .settings-card-blue .bg-white\/40,
body.dark-mode .settings-card-blue .dark\:bg-slate-900\/40,
body.dark-mode .settings-card-blue .border-white\/60,
body.dark-mode .settings-card-blue .dark\:border-slate-800\/60,
body.dark-mode .settings-card-blue .bg-white,
body.dark-mode .settings-card-blue .dark\:bg-slate-800 {
    background-color: rgba(255, 255, 255, 0.05) !important;
    border-color: rgba(255, 255, 255, 0.08) !important;
    box-shadow: none !important;
}

/* Force circular dots inside toggle switches to remain white in dark mode (high specificity) */
body.dark-mode .settings-card-blue .custom-switch div,
body.dark-mode .notification-card .custom-switch div,
body.dark-mode .custom-switch div {
    background-color: #ffffff !important;
}

/* Ensure toggle-text colors (ON/OFF labels) are readable on the white dot */
body.dark-mode .settings-card-blue .custom-switch .toggle-text,
body.dark-mode .notification-card .custom-switch .toggle-text,
body.dark-mode .custom-switch .toggle-text {
    -webkit-text-fill-color: initial !important;
}

body.dark-mode .settings-card-blue .custom-switch.is-on .toggle-text,
body.dark-mode .notification-card .custom-switch.is-on .toggle-text,
body.dark-mode .custom-switch.is-on .toggle-text {
    color: #2563eb !important;
    -webkit-text-fill-color: #2563eb !important;
}

body.dark-mode .settings-card-blue .custom-switch:not(.is-on) .toggle-text,
body.dark-mode .notification-card .custom-switch:not(.is-on) .toggle-text,
body.dark-mode .custom-switch:not(.is-on) .toggle-text {
    color: #94a3b8 !important;
    -webkit-text-fill-color: #94a3b8 !important;
}

/* Handle switch capsule wrapper when OFF in dark mode */
body.dark-mode .settings-card-blue .custom-switch:not(.is-on),
body.dark-mode .notification-card .custom-switch:not(.is-on),
body.dark-mode .custom-switch:not(.is-on) {
    background: #334155 !important;
}

body.dark-mode .settings-card-blue h4,
body.dark-mode .settings-card-blue p,
body.dark-mode .settings-card-blue span,
body.dark-mode .settings-card-blue h2 {
    color: #ffffff !important;
}

/* Row 2: Notification Cards */
body.dark-mode .notification-card {
    background: var(--card-glass-bg) !important;
    border-color: rgba(255, 255, 255, 0.08) !important;
    box-shadow: none !important;
}

body.dark-mode .notification-card h3 {
    color: #ffffff !important;
}

body.dark-mode .notification-item {
    background: rgba(255, 255, 255, 0.05) !important;
    border-color: rgba(255, 255, 255, 0.08) !important;
    box-shadow: none !important;
}

body.dark-mode .notification-item span {
    color: #ffffff !important;
}

/* Unchecked checkbox & radio circular/square borders */
body.dark-mode .notification-item .border-\[\#1f235d\]\/20 {
    border-color: rgba(255, 255, 255, 0.2) !important;
}

/* AI Coach Pills active & inactive states */
body.dark-mode .coach-pill {
    color: rgba(255, 255, 255, 0.6) !important;
    border-color: rgba(255, 255, 255, 0.15) !important;
}

body.dark-mode .coach-pill.active {
    color: #ffffff !important;
    background: rgba(255, 255, 255, 0.1) !important;
    font-weight: 800 !important;
}

body.dark-mode .coach-pill span {
    color: inherit !important;
    -webkit-text-fill-color: initial !important;
}

/* Explain Suggestion Button */
body.dark-mode .explain-btn {
    background: #000000 !important;
    box-shadow: none !important;
    border: 1px solid rgba(60, 203, 255, 0.4) !important;
    color: #3CCBFF !important;
}

body.dark-mode .explain-btn:hover {
    background: rgba(60, 203, 255, 0.1) !important;
}

/* Transparency Log timeline */
body.dark-mode .timeline-step-dot {
    border-color: #000000 !important;
}

body.dark-mode .timeline-content h4 {
    color: #7C7E9E !important;
}

body.dark-mode .timeline-content p {
    color: #ffffff !important;
}

/* Settings Page Background adaptation for Dark Mode */
body.dark-mode .settings-page-bg-tint {
    background: #000000 !important;
}

body.dark-mode .settings-page-bg-image {
    opacity: 0 !important;
}


