/* hsb_contrast_fix_all.r1.css
   Goal: prevent low-contrast text across the site by normalizing text + card colors.
*/

:root {
  --surface: rgba(255,255,255,0.06);
  --border: rgba(255,255,255,0.14);
}

body { color: var(--text); }

/* Standard text blocks */
p, li, label, .desc, .meta, small { color: var(--text); }

/* Muted text: keep readable */
.muted, .meta, small { color: color-mix(in srgb, var(--text) 70%, transparent); }

/* Cards/panels */
.card, .hsb-card, .hsb-panel,
.card-paper, .card-product, .card-issue, .card-community {
  color: var(--text);
}

.card .body, .card-paper .body, .card-product .body, .card-issue .body, .card-community .body {
  color: var(--text);
}

/* Links */
a { color: color-mix(in srgb, var(--text) 90%, var(--accent) 10%); }
a:hover { color: var(--accent); }

/* === PATCH 2026-01-21: stronger contrast per-section === */

/* 1) If a block sets a surface background, force text to theme text */
[style*="background"], .section, .panel, .hsb-panel, .hsb-page-hero,
.ab-hero, .prod-hero, .paper-hero, .iss-hero, .pt-hero, .cm-hero, .inq-hero{
  color: var(--text);
}

/* 2) Common headings must stay readable */
h1,h2,h3,h4,h5,h6,
.section-title,.page-title,.hsb-title,
.card .title, .card-news .title, .card-prod .title,
.card-paper .title, .card-issue .title, .card-community .title{
  color: var(--text) !important;
}

/* 3) Text blocks */
.card .desc, .card .meta, .card-news .summary, .card-news .meta,
.card-prod .meta, .card-paper .meta, .card-issue .meta, .card-community .meta{
  color: var(--muted) !important;
}

/* 4) Buttons / chips on colored backgrounds */
.badge, .chip, .tag, .pill{
  color: var(--text) !important;
  background: color-mix(in srgb, var(--accent) 10%, var(--surface)) !important;
  border-color: color-mix(in srgb, var(--accent) 22%, var(--border)) !important;
}

/* 5) Safety: if someone set text color too light in LIGHT theme, pull it back */
body:not(.theme-dark) [style*="color:#fff"],
body:not(.theme-dark) [style*="color: #fff"],
body:not(.theme-dark) [style*="color:white"],
body:not(.theme-dark) [style*="color: white"]{
  color: var(--text) !important;
}


/* Text on image backgrounds: always readable */
[style*="background-image"], .hsb-bg, .ab-hero{
  color: var(--text);
}
[style*="background-image"] h1,
[style*="background-image"] h2,
[style*="background-image"] p,
.hsb-bg + .hsb-wrap .hsb-kicker,
.hsb-bg + .hsb-wrap .hsb-title,
.hsb-bg + .hsb-wrap .hsb-sub{
  text-shadow: 0 10px 28px rgba(0,0,0,.45), 0 2px 6px rgba(0,0,0,.55);
}
