/* ===========================================================================
   Site overrides — readability and polish on top of the vendor template.
   Loaded AFTER public/assets/css/style.css so these rules win without !important.
   =========================================================================== */

/* The template ships --bs-secondary-color as #cfd3d7 (a near-white grey),
   which makes Bootstrap's .text-muted nearly invisible on white and tinted
   backgrounds. Lift it to a slate-600 that clears WCAG AA on white. */
:root,
[data-bs-theme="light"] {
    --bs-secondary-color: #475569;
    --bs-secondary-color-rgb: 71, 85, 105;
    --bs-tertiary-color: #64748b;
    --bs-tertiary-color-rgb: 100, 116, 139;
    --bs-body-color: #1f2937;
    --bs-body-color-rgb: 31, 41, 55;
    --bs-link-color: #1d3b53;
    --bs-link-hover-color: #14283d;
}

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

/* Bootstrap's utility uses --bs-secondary-color in 5.3+, but the vendor
   template also overrides .text-muted to that same colour. Pin both so the
   change actually lands. */
.text-muted,
small.text-muted,
.small.text-muted,
.text-secondary {
    color: #475569 !important;
}

/* Cards with tinted backgrounds (bg-warning bg-opacity-15, etc.) need an
   even firmer subtitle colour because the tint reduces effective contrast. */
.kms-feature-card .text-muted,
.kms-feature-card small,
.kms-topic-card p,
.kms-topic-card .text-muted,
.kms-doc-card .text-muted,
.kms-article-card .text-muted,
.kms-stat-card .text-muted {
    color: #334155 !important;
    font-weight: 500;
}

/* Slight typographic lift: tighter line-height, clearer headings. */
.kms-feature-card h6,
.kms-topic-card h5,
.kms-doc-card h5,
.kms-article-card h5 {
    color: #0f172a;
    font-weight: 700;
}

.kms-feature-card,
.kms-topic-card,
.kms-doc-card,
.kms-article-card,
.kms-stat-card {
    border: 1px solid rgba(15, 23, 42, 0.06);
}

/* Make card hover feel intentional rather than glitchy. */
.kms-feature-card:hover,
.kms-topic-card:hover,
.kms-doc-card:hover,
.kms-article-card:hover {
    border-color: rgba(29, 59, 83, 0.18);
}

/* "Platform at a glance" cards — solidify the surface and darken the labels.
   The vendor template makes these translucent over a tinted gradient, which
   sucks contrast out of the small caption text. */
.kms-stats-wrap {
    background: linear-gradient(135deg, rgba(94, 121, 86, 0.08) 0%, rgba(29, 59, 83, 0.06) 100%);
    border: 1px solid rgba(15, 23, 42, 0.08);
}

.kms-stat-card {
    background: #ffffff;
    border: 1px solid rgba(15, 23, 42, 0.08);
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.kms-stat-card .h3 {
    color: #0f172a;
    font-weight: 700;
    letter-spacing: -0.01em;
}

.kms-stat-card .fw-semibold {
    color: #0f172a;
    font-weight: 700 !important;
}

.kms-stat-card .small,
.kms-stat-card .small.text-muted,
.kms-stat-card .text-muted {
    color: #1f2937 !important;
    font-weight: 600;
    letter-spacing: 0.01em;
}

.kms-stat-card:hover {
    border-color: rgba(29, 59, 83, 0.22);
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.08);
}

/* Stat-card label (the only text now that the counts have been removed). */
.kms-stat-card .kms-stat-label {
    color: #0f172a;
    font-weight: 700;
    font-size: 1.05rem;
    line-height: 1.25;
    letter-spacing: -0.005em;
}

/* Footer text on the bg-light strip — give it real legibility. */
footer .text-muted,
footer small.text-muted {
    color: #475569 !important;
}

/* Pagination + secondary buttons should not look faded into the page. */
.btn-outline-secondary {
    color: #334155;
    border-color: #cbd5e1;
}
.btn-outline-secondary:hover {
    background: #334155;
    border-color: #334155;
    color: #fff;
}

/* "View Climate Topic Categories" style outline button — strengthen its
   resting state so it reads as a CTA, not a placeholder. */
.btn-outline-primary {
    border-width: 1.5px;
}

/* Badge/eyebrow legibility on the hero. */
.hero-eyebrow,
.kms-summit-eyebrow,
.kms-chip {
    color: #1f4d35;
}

/* Form labels — they often inherit .text-muted on sign-in/profile pages. */
.form-label,
label {
    color: #1f2937;
    font-weight: 500;
}

/* Make placeholder text in inputs visible but distinctly secondary. */
.form-control::placeholder {
    color: #94a3b8;
    opacity: 1;
}

/* Tabs that show document categories below the hero — selected state. */
.nav-pills .nav-link {
    color: #334155;
}
.nav-pills .nav-link.active {
    color: #fff;
}