:root {
  --readable-dark-text: #f8fafc;
  --readable-dark-muted: #d6deea;
}

/* Dark section readability for Avada fullwidth rows */
.fusion-fullwidth[style*="--awb-background-color:#0"],
.fusion-fullwidth[style*="background-color:#0"],
.fusion-fullwidth[style*="--awb-background-color:var(--awb-color4)"],
.fusion-fullwidth[style*="--awb-background-color:var(--awb-color5)"],
.fusion-fullwidth[style*="--awb-background-color:var(--awb-color7)"] {
  color: var(--readable-dark-text);
}

.fusion-fullwidth[style*="--awb-background-color:#0"] h1,
.fusion-fullwidth[style*="--awb-background-color:#0"] h2,
.fusion-fullwidth[style*="--awb-background-color:#0"] h3,
.fusion-fullwidth[style*="--awb-background-color:#0"] h4,
.fusion-fullwidth[style*="--awb-background-color:#0"] h5,
.fusion-fullwidth[style*="--awb-background-color:#0"] h6,
.fusion-fullwidth[style*="background-color:#0"] h1,
.fusion-fullwidth[style*="background-color:#0"] h2,
.fusion-fullwidth[style*="background-color:#0"] h3,
.fusion-fullwidth[style*="background-color:#0"] h4,
.fusion-fullwidth[style*="background-color:#0"] h5,
.fusion-fullwidth[style*="background-color:#0"] h6,
.fusion-fullwidth[style*="--awb-background-color:var(--awb-color4)"] h1,
.fusion-fullwidth[style*="--awb-background-color:var(--awb-color4)"] h2,
.fusion-fullwidth[style*="--awb-background-color:var(--awb-color4)"] h3,
.fusion-fullwidth[style*="--awb-background-color:var(--awb-color4)"] h4,
.fusion-fullwidth[style*="--awb-background-color:var(--awb-color4)"] h5,
.fusion-fullwidth[style*="--awb-background-color:var(--awb-color4)"] h6,
.fusion-fullwidth[style*="--awb-background-color:var(--awb-color5)"] h1,
.fusion-fullwidth[style*="--awb-background-color:var(--awb-color5)"] h2,
.fusion-fullwidth[style*="--awb-background-color:var(--awb-color5)"] h3,
.fusion-fullwidth[style*="--awb-background-color:var(--awb-color5)"] h4,
.fusion-fullwidth[style*="--awb-background-color:var(--awb-color5)"] h5,
.fusion-fullwidth[style*="--awb-background-color:var(--awb-color5)"] h6,
.fusion-fullwidth[style*="--awb-background-color:var(--awb-color7)"] h1,
.fusion-fullwidth[style*="--awb-background-color:var(--awb-color7)"] h2,
.fusion-fullwidth[style*="--awb-background-color:var(--awb-color7)"] h3,
.fusion-fullwidth[style*="--awb-background-color:var(--awb-color7)"] h4,
.fusion-fullwidth[style*="--awb-background-color:var(--awb-color7)"] h5,
.fusion-fullwidth[style*="--awb-background-color:var(--awb-color7)"] h6 {
  color: var(--readable-dark-text) !important;
}

.fusion-fullwidth[style*="--awb-background-color:#0"] p,
.fusion-fullwidth[style*="--awb-background-color:#0"] li,
.fusion-fullwidth[style*="background-color:#0"] p,
.fusion-fullwidth[style*="background-color:#0"] li,
.fusion-fullwidth[style*="--awb-background-color:var(--awb-color4)"] p,
.fusion-fullwidth[style*="--awb-background-color:var(--awb-color4)"] li,
.fusion-fullwidth[style*="--awb-background-color:var(--awb-color5)"] p,
.fusion-fullwidth[style*="--awb-background-color:var(--awb-color5)"] li,
.fusion-fullwidth[style*="--awb-background-color:var(--awb-color7)"] p,
.fusion-fullwidth[style*="--awb-background-color:var(--awb-color7)"] li {
  color: var(--readable-dark-muted) !important;
}

.fusion-fullwidth[style*="--awb-background-color:#0"] a,
.fusion-fullwidth[style*="background-color:#0"] a,
.fusion-fullwidth[style*="--awb-background-color:var(--awb-color4)"] a,
.fusion-fullwidth[style*="--awb-background-color:var(--awb-color5)"] a,
.fusion-fullwidth[style*="--awb-background-color:var(--awb-color7)"] a {
  color: var(--readable-dark-text) !important;
}

/* Tech/IT custom cards */
.hero-card,
.feature-card,
.pricing-card,
.compare-card,
.testimonial-card,
.cta-card,
.hg-img-card,
.hg-panel {
  color: var(--readable-dark-text);
}

.hero-card .hero-card-sub,
.hero-card .hero-card-footer,
.feature-card .feature-text,
.pricing-card .pricing-subtitle,
.pricing-card .pricing-price span,
.pricing-card .pricing-note,
.pricing-card .pricing-list,
.pricing-card .pricing-footer,
.compare-card .compare-label,
.testimonial-card .testimonial-role,
.hg-img-card p {
  color: var(--readable-dark-muted) !important;
}

.pricing-card .pricing-tag,
.pricing-card .pricing-name,
.pricing-card .pricing-price,
.pricing-card .pricing-footer strong,
.hero-card .hero-card-title,
.hero-card .hero-card-footer strong,
.feature-card h3 {
  color: var(--readable-dark-text) !important;
}
