/*
 * Communityline Portal - contrast fixes from the 2026-09-26 UI/UX audit.
 * Loaded after clp-modern.css / clp-marketplace.css. Every rule here fixes a
 * measured WCAG contrast failure; the selectors are deliberately narrow.
 */

/* ---- Dark theme: text that still used the brand navy on dark surfaces ---- */
body.dark-theme .text-color:not(.breadcrumb-area *),
body.dark-theme a.hover-underline:not(.breadcrumb-area *),
body.dark-theme .clp-locale-link.is-active,
body.dark-theme .course-overview-card p a:not([class*="btn"]),
body.dark-theme .course-overview-card .fs-14 a:not([class*="btn"]),
body.dark-theme .feedback-wrap a:not([class*="btn"]) {
    color: var(--clp-info-text, #8ab4ec) !important;
}

body.dark-theme .clp-sticky-enroll .clp-sticky-price {
    color: #f3f4f6;
}

body.dark-theme a.btn-text,
body.dark-theme .btn-text {
    color: #c3cbdd;
}

body.dark-theme .clp-alert.clp-alert-info,
body.dark-theme .clp-alert.clp-alert-info span {
    color: #b9d2f5;
}

body.dark-theme .mk-inst__stat span {
    color: #98a2b8;
}

/* Header logo strapline: grey on the dark header was 3.8:1 */
body.dark-theme .clp-logo-text span.d-block:not(.clp-logo-title) {
    color: #a8b0bd;
}

/* Course-card tags: white on the light dark-mode green was 1.8:1 */
body.dark-theme .mk-tag--best,
body.dark-theme .mk-tag--free {
    color: #062b14;
}

/* ---- Both themes ---- */
/* Course card ribbon: white on gold was 2.1:1 */
.course-badge {
    color: #3b2a00;
}
.course-badge.blue {
    color: #ffffff;
}

/* Average rating figure: gold on white was 2.1:1 */
.stats-average__count {
    color: var(--clp-warning-text, #7a5b00);
}

/* Footer brand strapline carries an inline #6b7280, which is 3.8:1 on the dark footer */
body.dark-theme .footer-item a span.d-block[style*="6b7280"] {
    color: #a8b0bd !important;
}

/* iOS Safari zooms the page when a focused field is under 16px. clp-components.css
   has a guard for this, but clp-base.css loads after it and puts .form--control back
   to 14px, so Account Security's password fields zoomed on every tap. */
@media (max-width: 767px) {
    input.form--control,
    select.form--control,
    textarea.form--control,
    input.form-control,
    select.form-control,
    textarea.form-control {
        font-size: 16px;
    }
}