/*
 * Header/footer color customization (bg_color_type/text_color_type on
 * HeaderSettings/FooterSettings). The resolved background is applied as a
 * literal inline `background-color` on .site-header/.site-footer (inline
 * styles always win, so no specificity fight with Tailwind's utility
 * classes); the resolved text color is exposed as the --hf-text custom
 * property on those same elements so it cascades to every descendant.
 *
 * `.hf-text`/`.hf-text-muted`/`.hf-link` replace the old hardcoded
 * text-gray-* utility classes on base copy so it always stays legible
 * against a custom background; brand-accent classes (text-primary,
 * bg-primary text-white, etc.) are left untouched on purpose.
 */

.hf-text {
    color: var(--hf-text, inherit);
}

.hf-text-muted {
    color: var(--hf-text, inherit);
    opacity: 0.7;
}

.hf-link {
    color: var(--hf-text, inherit);
    transition: opacity 0.15s ease;
}

.hf-link:hover {
    opacity: 0.7;
}

.hf-hover:hover {
    background-color: rgba(127, 127, 127, 0.15);
}