/* ux-contrast-patch.v26.22 (rev-C) Strongest override to ensure dropdown items are BLACK in Blue/Dark themes. */ /* Menu container */ .site-header .dropdown .menu{ background:#fff !important; border:1px solid rgba(0,0,0,0.12) !important; box-shadow:0 6px 20px rgba(0,0,0,0.12) !important; border-radius:12px !important; padding:8px !important; color:#111 !important; opacity:1 !important; filter:none !important; } /* Beat theme nav link rule specifically inside dropdown */ html[data-theme="blue"] .site-header .nav .dropdown .menu a, html[data-theme="dark"] .site-header .nav .dropdown .menu a, html[data-theme="blue"] .site-header .nav .dropdown .menu *, html[data-theme="dark"] .site-header .nav .dropdown .menu *{ color:#111 !important; opacity:1 !important; filter:none !important; text-shadow:none !important; } /* Base items */ .site-header .dropdown .menu a, .site-header .dropdown .menu button{ display:block !important; margin:0 !important; padding:8px 10px !important; background:transparent !important; border:0 !important; border-radius:8px !important; box-shadow:none !important; pointer-events:auto !important; color:#111 !important; opacity:1 !important; } /* Hover */ .site-header .dropdown .menu a:hover, .site-header .dropdown .menu button:hover{ background:rgba(0,0,0,0.06) !important; color:#000 !important; } /* Disabled-looking items keep readable */ .site-header .dropdown .menu a[aria-disabled="true"], .site-header .dropdown .menu button[aria-disabled="true"], .site-header .dropdown .menu a.disabled, .site-header .dropdown .menu button.disabled{ color:#111 !important; opacity:1 !important; } /* Keep Blue/Dark form control readability */ html[data-theme="blue"] input, html[data-theme="blue"] textarea, html[data-theme="blue"] select, html[data-theme="dark"] input, html[data-theme="dark"] textarea, html[data-theme="dark"] select{ background:rgba(255,255,255,0.08) !important; color:#f6f8fc !important; border-color:rgba(255,255,255,0.25) !important; caret-color:#ffffff !important; } html[data-theme="blue"] ::placeholder, html[data-theme="dark"] ::placeholder{ color:rgba(255,255,255,0.65) !important; } html[data-theme="blue"] input:focus, html[data-theme="blue"] textarea:focus, html[data-theme="blue"] select:focus, html[data-theme="dark"] input:focus, html[data-theme="dark"] textarea:focus, html[data-theme="dark"] select:focus{ outline:2px solid rgba(255,255,255,0.35) !important; outline-offset:1px !important; border-color:rgba(255,255,255,0.45) !important; } html[data-theme="blue"] input:-webkit-autofill, html[data-theme="dark"] input:-webkit-autofill{ -webkit-text-fill-color:#f6f8fc !important; -webkit-box-shadow:0 0 0px 1000px rgba(255,255,255,0.08) inset !important; transition:background-color 10000s ease-in-out 0s !important; } /* Final Exam HUD pills: force readable text even when cards are light in Blue/Dark */ html[data-theme="blue"] .quiz-top-row .mini-pill, html[data-theme="dark"] .quiz-top-row .mini-pill{ color: #0b0f14 !important; border-color: rgba(0,0,0,.12) !important; background: rgba(255,255,255,.92) !important; } /* Ensure the gated "Begin Final Exam" label stays readable */ html[data-theme="blue"] #beginBtn.btn-pill.primary.is-gated, html[data-theme="dark"] #beginBtn.btn-pill.primary.is-gated{ color: #0b0f14 !important; background: rgba(255,255,255,.92) !important; border-color: rgba(0,0,0,.12) !important; opacity: .75 !important; /* still looks disabled */ } /* FINAL EXAM: lock UI colors for Blue/Dark so nothing turns “washed out” */ /* Progress + Score pills */ html[data-theme="blue"] #progressPill.mini-pill, html[data-theme="dark"] #progressPill.mini-pill, html[data-theme="blue"] #scorePill.mini-pill, html[data-theme="dark"] #scorePill.mini-pill{ color:#0b0f14 !important; background: rgba(255,255,255,.92) !important; border: 1px solid rgba(0,0,0,.14) !important; } /* Reset Answers button (this is NOT a mini-pill) */ html[data-theme="blue"] #resetBtn.btn-pill, html[data-theme="dark"] #resetBtn.btn-pill{ color:#0b0f14 !important; background: rgba(255,255,255,.92) !important; border: 1px solid rgba(0,0,0,.14) !important; } /* Begin Final Exam: keep primary “blue button” look in Blue/Dark (even when gated) */ html[data-theme="blue"] #beginBtn.btn-pill.primary, html[data-theme="dark"] #beginBtn.btn-pill.primary{ color:#fff !important; background: var(--brand-blue,#1E88E5) !important; border: 1px solid rgba(30,136,229,.75) !important; } /* When gated/disabled, keep it blue but visibly disabled */ html[data-theme="blue"] #beginBtn.btn-pill.primary.is-gated, html[data-theme="dark"] #beginBtn.btn-pill.primary.is-gated{ filter: saturate(.85) brightness(.92) !important; opacity: .78 !important; } /* Force PRIMARY button to stay blue in Blue/Dark (Final Exam only) */ html[data-theme="blue"] .page-final-exam #beginBtn.btn-pill.primary, html[data-theme="dark"] .page-final-exam #beginBtn.btn-pill.primary{ background: var(--brand-blue,#1E88E5) !important; color: #fff !important; border-color: rgba(30,136,229,.85) !important; } /* Even when disabled/gated, keep it blue (just “disabled looking”) */ html[data-theme="blue"] .page-final-exam #beginBtn.btn-pill.primary[disabled], html[data-theme="dark"] .page-final-exam #beginBtn.btn-pill.primary[disabled], html[data-theme="blue"] .page-final-exam #beginBtn.btn-pill.primary.is-gated, html[data-theme="dark"] .page-final-exam #beginBtn.btn-pill.primary.is-gated{ background: var(--brand-blue,#1E88E5) !important; color: #fff !important; opacity: .72 !important; filter: saturate(.85) brightness(.92) !important; } /* Force white text for the "Final Exam Status" primary link in all themes */ a.btn-pill.primary.final-exam-status-link{ color:#fff !important; } a.btn-pill.primary.final-exam-status-link:visited{ color:#fff !important; } /* Kill the old chapter timer UI (we use SeatTimeV6 instead) */ .page-course .timer-row, .page-course .timer-meter, .page-course .timer-bar, .page-course .timer-pct{ display:none !important; } /* ===== Kill legacy chapter timer UI (the dead 0:00:00 block) ===== */ /* This is NOT Seat-Time V6. We hide it globally on course pages. */ .page-course .timer-row, .page-course .timer-left, .page-course .timer-label, .page-course .timer-value, .page-course .timer-sub, .page-course .timer-meter, .page-course .timer-bar, .page-course .timer-fill, .page-course .timer-pct, .page-course [id*="timer"], .page-course [class*="timer-"]{ display:none !important; } /* FINAL EXAM: force pill readability + keep primary buttons blue in all themes */ .page-final-exam .mini-pill, .page-final-exam #progressPill, .page-final-exam #scorePill, .page-final-exam #finalScoreLine, .page-final-exam #finalPassLine{ color:#0b0f14 !important; border-color: rgba(0,0,0,.12) !important; background: rgba(0,0,0,.03) !important; } /* Force "Begin Final Exam" to keep primary background (not white) in blue/dark */ .page-final-exam #beginBtn.btn-pill.primary{ background: var(--brand-blue, #1E88E5) !important; border-color: rgba(0,0,0,.12) !important; color: #fff !important; } /* Keep Reset button readable (still on light card) */ .page-final-exam #resetBtn.btn-pill{ color:#0b0f14 !important; } /* ========================================================= ES FOOTER: normal horizontal wrapped links + clean spacing Works for: -