/* ═════════════════════════════════════════════════════════════════════════════
   Task #1385782: Settlement Search Results Page — Contrast Fix
   Date: May 5, 2026

   Fixes Google Search Console contrast violations on /settlements?q=...
   Ensures ALL UI elements meet WCAG AA standards (4.5:1 for normal, 3:1 for large)

   Coverage:
   - Search filters (pills, dropdowns)
   - Settlement cards
   - Action buttons (File Now, View, etc.)
   - Badge labels (status, trending, hot, etc.)
   - Countdown timers
   - Pagination and navigation
   - Form controls
   - Typography on all backgrounds
═════════════════════════════════════════════════════════════════════════════ */

/* ─────────────────────────────────────────────────────────────────────────────
   1. GLOBAL TEXT CONTRAST FIXES
────────────────────────────────────────────────────────────────────────────── */

/* Ensure all body text is readable */
body,
body * {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Task #1386732: Removed overly broad `a { color: #1e40af !important }` rule that
   forced ALL links site-wide to blue, overriding intentional green accent links,
   footer links, card title links, and nav links. Link colors are now handled by
   component-specific CSS (design-system.css, footer-layout.css, page templates). */

/* ─────────────────────────────────────────────────────────────────────────────
   2. BUTTON & CTA CONTRAST (File Now, View, etc.)
────────────────────────────────────────────────────────────────────────────── */

button,
[role="button"],
.btn,
.button,
.cta,
.btn-primary,
.btn-secondary,
.btn-dark,
.btn-emerald,
.cta-button,
.submit-button,
.action-button,
.primary-action,
.secondary-action,
[class*="btn"],
[class*="button"],
[class*="cta"] {
  font-weight: 500;
}

/* Dark/primary background buttons → white text */
.btn-primary,
.btn-dark,
.btn-emerald,
.btn-navy,
.cta-primary,
.cta-button,
.primary-cta,
.action-button,
.submit-button,
button[type="submit"],
button.primary,
button.dark,
a.btn-primary,
a.btn-dark,
a.btn-emerald,
[class*="primary-button"],
[class*="dark-button"],
[class*="cta"][style*="background"] {
  color: #ffffff !important;
  fill: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

/* Light background buttons → dark text */
.btn-light,
.btn-white,
.btn-ghost,
button.light,
button.white,
button.ghost,
a.btn-light,
a.btn-white,
[class*="light-button"],
[class*="ghost-button"] {
  color: #1f2a37 !important;
  fill: #1f2a37 !important;
  -webkit-text-fill-color: #1f2a37 !important;
}

/* Hover/active states - maintain contrast */
/* Task #1386732: removed global button:hover blue outline. Button hover/focus
   states are handled by design-system.css. The blue outline was wrong for the
   emerald design system and bled into Crisp chat buttons. */

/* ─────────────────────────────────────────────────────────────────────────────
   3. SETTLEMENT CARD ELEMENTS
────────────────────────────────────────────────────────────────────────────── */

/* Card CTAs - "File Now", "View Settlement", etc.
   Task #1386732: uses emerald accent instead of blue for design system consistency. */
.settlement-card .btn-primary,
.settlement-card .card-cta,
.card-action,
.card-cta {
  color: #ffffff !important;
  background-color: var(--color-accent, #00875A) !important;
}

/* Card body text on light backgrounds */
.settlement-card,
.settlement-card p,
.settlement-card span,
.settlement-card h3,
.settlement-card h4 {
  color: #1f2a37 !important;
}

/* Settlement category/status labels — Task #1386732: uses emerald. */
.settlement-category,
.settlement-status,
.settlement-badge,
.status-label,
.category-label {
  color: #ffffff !important;
  background-color: var(--color-accent, #00875A) !important;
}

/* ─────────────────────────────────────────────────────────────────────────────
   4. FILTER PILLS & SEARCH CONTROLS
────────────────────────────────────────────────────────────────────────────── */

/* Active filter pills → white text on dark background
   Task #1386732: removed broad [class*="filter"][class*="active"] and
   [class*="pill"][class*="active"] selectors that matched unintended elements.
   Uses emerald instead of blue. */
.filter-pill.active,
.filter-chip.active,
.filter-tag.active,
.sort-pill.active,
.category-filter.active,
.proof-filter.active,
.difficulty-filter.active,
.payout-filter.active {
  color: #ffffff !important;
  background-color: var(--color-accent, #00875A) !important;
  font-weight: 500 !important;
}

/* Inactive filter pills → dark text on light background
   Task #1386732: removed broad [class*="filter"]:not(.active) and
   [class*="pill"]:not(.active) selectors. */
.filter-pill,
.filter-chip,
.filter-tag,
.sort-pill,
.category-filter,
.proof-filter,
.difficulty-filter,
.payout-filter {
  color: #1f2a37 !important;
  background-color: #f3f4f6 !important;
  border-color: #e5e7eb !important;
}

/* Filter dropdown/menu items */
.filter-menu,
.filter-option,
.dropdown-item {
  color: #1f2a37 !important;
}

.dropdown-item:hover,
.dropdown-item.active {
  color: #ffffff !important;
  background-color: var(--color-accent, #00875A) !important;
}

/* ─────────────────────────────────────────────────────────────────────────────
   5. BADGES & LABELS (Trending, Hot, No Proof, etc.)
────────────────────────────────────────────────────────────────────────────── */

/* Trending/Hot badge — Task #1386732: removed broad [class*="trending"] and
   [class*="hot"] selectors. They forced red backgrounds on any element with
   those strings in class names. */
.badge-trending,
.badge-hot,
.badge-popular {
  color: #ffffff !important;
  background-color: #dc2626 !important;
}

/* No Proof badge */
.badge-no-proof,
.no-proof-badge {
  color: #ffffff !important;
  background-color: #16a34a !important;
}

/* Filing Fast / Closing Soon badge */
.badge-filing-fast,
.badge-closing-soon,
.closing-soon-badge {
  color: #ffffff !important;
  background-color: #ea580c !important;
}

/* Pro/Premium badge — Task #1386732: removed broad [class*="premium"] selector.
   Uses emerald instead of blue for design system consistency. */
.badge-pro,
.badge-premium,
.pro-badge,
.premium-badge {
  color: #ffffff !important;
  background-color: var(--color-accent, #00875A) !important;
}

/* Verified/Trust badges — Task #1386732: removed broad [class*="verified"] and
   [class*="trust"] selectors. Those matched .trust-bar, .trust-item, .sr-trust,
   etc. — all of which have WHITE backgrounds and need DARK text, not white. */
.badge-verified,
.verified-badge,
.court-verified {
  color: #ffffff !important;
  background-color: #059669 !important;
}

/* Status badges (Open, Closed, etc.) — Task #1386732: removed broad [class*="status"]
   selector. It matched subscription_status, moderation_status, etc. */
.badge-open,
.badge-closed,
.badge-status,
.status-badge {
  color: #ffffff !important;
  background-color: #6b7280 !important;
}

/* General badge styling */
.badge,
[class*="badge"] {
  font-weight: 500;
}

/* ─────────────────────────────────────────────────────────────────────────────
   6. COUNTDOWN & DEADLINE TIMERS
────────────────────────────────────────────────────────────────────────────── */

/* Task #1386732: removed broad [class*="countdown"] and [class*="deadline"]
   selectors. Those matched .sr-card__deadline-date-text (needs dark text on white bg),
   deadline labels, etc. */
.countdown-timer,
.countdown-chip,
.deadline-countdown,
.timer-badge,
.closing-soon-timer {
  color: #ffffff !important;
  background-color: #dc2626 !important;
  font-weight: 600 !important;
}

/* Countdown text variants */
.countdown-days,
.countdown-label,
.deadline-text,
.time-remaining {
  color: #ffffff !important;
}

/* ─────────────────────────────────────────────────────────────────────────────
   7. PAGINATION & NAVIGATION
────────────────────────────────────────────────────────────────────────────── */

/* Task #1386732: removed [role="navigation"] — too broad, overrides header nav,
   mobile tab bar, breadcrumbs, etc. */
.pagination,
.page-nav {
  color: #1f2a37 !important;
}

.pagination [aria-current="page"] {
  color: #ffffff !important;
  background-color: var(--color-accent, #00875A) !important;
  border-color: var(--color-accent, #00875A) !important;
}

/* Non-current pagination links should have dark text, not white */
.pagination a,
.pagination button,
.page-nav a,
.page-nav button {
  color: #1f2a37 !important;
  background-color: #ffffff !important;
  border-color: #e5e7eb !important;
}

.pagination a:hover,
.pagination button:hover,
.page-nav a:hover {
  opacity: 0.85;
}

/* Disabled pagination */
.pagination a[disabled],
.pagination button[disabled],
.page-nav [disabled] {
  color: #9ca3af !important;
  background-color: #f3f4f6 !important;
  border-color: #e5e7eb !important;
  opacity: 0.6;
}

/* ─────────────────────────────────────────────────────────────────────────────
   8. FORM INPUTS & CONTROLS
────────────────────────────────────────────────────────────────────────────── */

/* Task #1386732: Scoped global form element overrides to settlement pages only.
   Global input/select/textarea overrides were bleeding into Crisp chat, header
   search, email capture forms, and other components. */
.settlements-page input,
.settlements-page select,
.settlements-page textarea {
  color: #1f2a37 !important;
  border-color: #d1d5db !important;
}

.settlements-page input::placeholder,
.settlements-page textarea::placeholder {
  color: #9ca3af !important;
  opacity: 1;
}

.settlements-page input:focus,
.settlements-page select:focus,
.settlements-page textarea:focus {
  outline: 2px solid var(--color-accent, #00875A) !important;
  outline-offset: 2px !important;
  border-color: var(--color-accent, #00875A) !important;
}

/* Task #1386732: Scoped from global `label, [class*="label"]` which matched
   every element site-wide with "label" in its class name (section-labels,
   counter-labels, card-labels). Now targets only form labels. */
.settlements-page label,
.settlements-page .filter-label {
  color: #1f2a37 !important;
  font-weight: 500 !important;
}

/* ─────────────────────────────────────────────────────────────────────────────
   9. TEXT ON COLORED BACKGROUNDS
────────────────────────────────────────────────────────────────────────────── */

/* White text on dark backgrounds */
[style*="background: #1f2a37"],
[style*="background-color: #1f2a37"],
[style*="background: #1F2A37"],
[style*="background:#00b37d"],
[style*="background:#1e40af"],
[style*="background: #1e40af"],
[style*="background-color: #1e40af"],
[style*="background:#dc2626"],
[style*="background: #dc2626"],
[class*="dark"][class*="bg"],
[class*="primary"][class*="bg"],
[class*="secondary"][class*="bg"] {
  color: #ffffff !important;
}

/* Dark text on light backgrounds */
[style*="background: #ffffff"],
[style*="background-color: #ffffff"],
[style*="background: #f3f4f6"],
[style*="background-color: #f3f4f6"],
[style*="background: #f9fafb"],
[style*="background-color: #f9fafb"],
[style*="background: #e5e7eb"],
[class*="light"][class*="bg"],
[class*="white"][class*="bg"] {
  color: #1f2a37 !important;
}

/* ─────────────────────────────────────────────────────────────────────────────
   10. SETTLEMENT PAYOUT DISPLAY
────────────────────────────────────────────────────────────────────────────── */

.payout-amount,
.settlement-payout,
.estimated-payout,
.payout-value,
.settlement-value {
  color: var(--color-accent, #00875A) !important;
  font-weight: 600 !important;
}

.payout-label,
.payout-description {
  color: #6b7280 !important;
}

/* ─────────────────────────────────────────────────────────────────────────────
   11. SOCIAL PROOF & ACTIVITY
────────────────────────────────────────────────────────────────────────────── */

/* Task #1386732: removed broad [class*="people-"] and [class*="activity-"] selectors */
.people-checked,
.people-viewed,
.activity-count {
  color: #6b7280 !important;
}

/* ─────────────────────────────────────────────────────────────────────────────
   12. FOCUS & ACCESSIBILITY STATES
────────────────────────────────────────────────────────────────────────────── */

/* Task #1386732: Removed universal *:focus { outline: blue !important } rule.
   It overrode Crisp chat focus states, custom button focus, and design-system focus.
   Focus outlines are now handled by design-system.css and component-specific CSS.
   Scoped to settlement search results only. */
.settlements-page input:focus,
.settlements-page select:focus,
.settlements-page textarea:focus {
  outline: 2px solid var(--color-accent, #00875A) !important;
  outline-offset: 2px !important;
}

/* ─────────────────────────────────────────────────────────────────────────────
   13. SORT/VIEW OPTIONS
────────────────────────────────────────────────────────────────────────────── */

/* Task #1386732: removed broad [class*="sort"] and [class*="view-toggle"] selectors */
.sort-option,
.view-option,
.sort-button,
.view-button {
  color: #1f2a37 !important;
}

.sort-option.active,
.view-option.active,
.sort-button.active {
  color: #ffffff !important;
  background-color: var(--color-accent, #00875A) !important;
}

/* ─────────────────────────────────────────────────────────────────────────────
   14. ERROR & WARNING STATES
────────────────────────────────────────────────────────────────────────────── */

/* Task #1386732: removed broad [role="alert"], [class*="error"], [class*="warning"],
   [class*="alert"] selectors. Many error/warning messages need dark text on
   light colored backgrounds — forcing white made them invisible. */

/* ─────────────────────────────────────────────────────────────────────────────
   15. SETTLEMENT DIFFICULTY INDICATORS
────────────────────────────────────────────────────────────────────────────── */

/* Task #1386732: removed broad [class*="difficulty"] selector */
.difficulty-easy,
.difficulty-medium,
.difficulty-hard {
  color: #1f2a37 !important;
  font-weight: 500 !important;
}

/* ─────────────────────────────────────────────────────────────────────────────
   16. ENFORCEMENT - Override any conflicting styles
────────────────────────────────────────────────────────────────────────────── */

/* Ensure text in cards is always readable */
.sr-card h2,
.sr-card h3,
.sr-card p,
.sr-card span {
  color: inherit !important;
}

/* Settlement card dark text on light bg */
.sr-card {
  color: #1f2a37 !important;
}

.sr-card .sr-card__title,
.sr-card .sr-card__company,
.sr-card .sr-card__category {
  color: #1f2a37 !important;
  font-weight: 600 !important;
}

/* Card CTA button - Task #1386732: uses emerald instead of blue */
.sr-card__cta,
.sr-card__button,
.sr-card .btn-primary {
  color: #ffffff !important;
  background-color: var(--color-accent, #00875A) !important;
}

/* Task #1386732: removed forced red on .sr-card__countdown.
   design-system.css handles countdown styling with emerald palette per v3.2. */

/* Card badges */
.sr-card__badge {
  color: #ffffff !important;
  font-weight: 500 !important;
}

/* ─────────────────────────────────────────────────────────────────────────────
   17. NO-SCROLL OPTIMIZATION (Performance)
────────────────────────────────────────────────────────────────────────────── */

/* Task #1386732: removed universal `* { transition: color/bg/border }` that
   applied to EVERY element site-wide. This caused performance issues (layout
   thrashing on page load), visual glitches (colors fading in on every
   interaction), and interfered with intentional transitions in design-system.css. */