/* CloviBuild Accessibility Fixes */

/* Skip link */
.sr-only, .skip-nav {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0,0,0,0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* Link underline in text */
p > a, li > a { text-decoration: underline; text-underline-offset: 2px; }
nav a, .nav-link, a.btn, a.button { text-decoration: none !important; }

/* Brand green buttons need dark text for contrast */
.btn-hero.btn-hero-primary, a[style*="background:#22C55E"], a[style*="background:#22c55e"],
[class*="btn-hero-primary"] {
  color: #052e16 !important;
}

/* Dark section context-aware labels */
.ai-section .section-label, [style*="background:#0f172a"] .section-label, .section-label { color: #4ade80 !important; }

/* Dark bento cards need light text */
.bento-card.dark p { color: #94a3b8 !important; }
.bento-card.dark h2, .bento-card.dark h3 { color: #f1f5f9 !important; }

/* Prop inputs on dark bg */
.prop-input { color: #e2e8f0; }

/* ── Hero badge dark green fix ── */
/* #166534 on dark bg = 2.5:1 FAIL → use #4ade80 = 11.33:1 */
.hero-badge {
  color: #4ade80 !important;
}

/* ── AI chat status dark green fix ── */
/* .ai-chat-status uses #166534 on dark bg */
.ai-chat-status {
  color: #4ade80 !important;
}

/* ── hero p text contrast fix ── */
/* var(--muted) = #9ca3af which is fine on dark bg, but ensure it's not overridden */
.hero p {
  color: #9ca3af !important;
}