/*
 * Mierlo voor Mierlo – Interaction Contrast Lock 1.0
 * Canonical hover/focus/active/disabled states for the public site.
 * Component-scoped so the same cascade is testable in WPVibe preview and live.
 */
:root {
    --mvm-int-blue:#1966AE;
    --mvm-int-blue-hover:#155A94;
    --mvm-int-blue-deep:#0F4F88;
    --mvm-int-white:#FFFFFF;
    --mvm-int-ink:#172333;
    --mvm-int-soft:#EAF4FC;
    --mvm-int-focus:#1966AE;
}

/* Primary CTA/button family: always white on blue. Generic .btn-theme is excluded
 * here because Newsup also uses it for white secondary/pagination buttons. */
html body :where(
    a.more-link,
    .wpcf7 input[type="submit"],
    .mvm-public-search button,
    .wpem-main input[type="submit"],
    .wpem-main button[type="submit"],
    #wpforo-wrap input[type="submit"],
    #wpforo-wrap button[type="submit"],
    .ps-page .ps-btn--action,
    .ps-page .ps-btn--primary,
    .ps-page .ps-btn-primary,
    .ps-page .ps-button-action
) {
    color:var(--mvm-int-white) !important;
    -webkit-text-fill-color:var(--mvm-int-white) !important;
}

html body :where(
    a.more-link,
    .btn-theme,
    .wpcf7 input[type="submit"],
    .mvm-public-search button,
    .wpem-main input[type="submit"],
    .wpem-main button[type="submit"],
    #wpforo-wrap input[type="submit"],
    #wpforo-wrap button[type="submit"],
    .ps-page .ps-btn--action,
    .ps-page .ps-btn--primary,
    .ps-page .ps-btn-primary,
    .ps-page .ps-button-action
):hover,
html body :where(
    a.more-link,
    .btn-theme,
    .wpcf7 input[type="submit"],
    .mvm-public-search button,
    .wpem-main input[type="submit"],
    .wpem-main button[type="submit"],
    #wpforo-wrap input[type="submit"],
    #wpforo-wrap button[type="submit"],
    .ps-page .ps-btn--action,
    .ps-page .ps-btn--primary,
    .ps-page .ps-btn-primary,
    .ps-page .ps-button-action
):focus-visible {
    background:var(--mvm-int-blue-deep) !important;
    border-color:var(--mvm-int-blue-deep) !important;
    color:var(--mvm-int-white) !important;
    -webkit-text-fill-color:var(--mvm-int-white) !important;
}

/* Home button: icon must remain visible in every state. */
html body #mvm-header-v1 .mvm-home-button,
html body #mvm-header-v1 .mvm-home-button:visited {
    background:var(--mvm-int-blue) !important;
    color:var(--mvm-int-white) !important;
    -webkit-text-fill-color:var(--mvm-int-white) !important;
}
html body #mvm-header-v1 .mvm-home-button:hover,
html body #mvm-header-v1 .mvm-home-button:focus-visible {
    background:var(--mvm-int-blue-hover) !important;
    color:var(--mvm-int-white) !important;
    -webkit-text-fill-color:var(--mvm-int-white) !important;
}
html body.home #mvm-header-v1 .mvm-home-button,
html body.home #mvm-header-v1 .mvm-home-button:hover,
html body.home #mvm-header-v1 .mvm-home-button:focus-visible {
    background:var(--mvm-int-white) !important;
    color:var(--mvm-int-blue) !important;
    -webkit-text-fill-color:var(--mvm-int-blue) !important;
}
html body #mvm-header-v1 .mvm-home-button i,
html body #mvm-header-v1 .mvm-home-button svg {
    color:currentColor !important;
    fill:currentColor !important;
}

/* Main navigation and mobile navigation: never allow same-color text/background. */
html body #mvm-header-v1 .mvm-primary-nav > ul > li > a,
html body #mvm-header-v1 .mvm-primary-menu > li > a,
html body #mvm-header-v1 .mvm-primary-nav .sub-menu a {
    color:var(--mvm-int-white) !important;
    -webkit-text-fill-color:var(--mvm-int-white) !important;
}
html body #mvm-header-v1 .mvm-primary-nav > ul > li > a:hover,
html body #mvm-header-v1 .mvm-primary-nav > ul > li > a:focus-visible,
html body #mvm-header-v1 .mvm-primary-menu > li > a:hover,
html body #mvm-header-v1 .mvm-primary-menu > li > a:focus-visible {
    background:var(--mvm-int-blue-hover) !important;
    color:var(--mvm-int-white) !important;
    -webkit-text-fill-color:var(--mvm-int-white) !important;
}
html body #mvm-header-v1 .mvm-primary-nav .sub-menu a:hover,
html body #mvm-header-v1 .mvm-primary-nav .sub-menu a:focus-visible,
html body #mvm-header-v1 .mvm-primary-nav .sub-menu li.current-menu-item > a {
    background:var(--mvm-int-blue-deep) !important;
    color:var(--mvm-int-white) !important;
    -webkit-text-fill-color:var(--mvm-int-white) !important;
}

/* Active top-level item stays blue; activity is conveyed by weight + underline. */
html body #mvm-header-v1 .mvm-primary-nav > ul > li:is(.current-menu-item,.current_page_item,.current-menu-parent,.current-menu-ancestor) > a,
html body #mvm-header-v1 .mvm-primary-menu > li:is(.current-menu-item,.current_page_item,.current-menu-parent,.current-menu-ancestor) > a {
    background:var(--mvm-int-blue-hover) !important;
    color:var(--mvm-int-white) !important;
    -webkit-text-fill-color:var(--mvm-int-white) !important;
    font-weight:800 !important;
    box-shadow:inset 0 -3px 0 var(--mvm-int-white) !important;
}

/* Search/menu utility buttons. */
html body #mvm-header-v1 :where(.mvm-menu-toggle,.mvm-header-search-form button):hover,
html body #mvm-header-v1 :where(.mvm-menu-toggle,.mvm-header-search-form button):focus-visible {
    background:var(--mvm-int-blue-deep) !important;
    color:var(--mvm-int-white) !important;
    -webkit-text-fill-color:var(--mvm-int-white) !important;
}

/* Tags and pagination. */
html body :where(
    .newsup-tags a[rel="tag"],
    .mg-sidebar .tagcloud a,
    .wp-block-tag-cloud a,
    .navigation.pagination .page-numbers
):hover,
html body :where(
    .newsup-tags a[rel="tag"],
    .mg-sidebar .tagcloud a,
    .wp-block-tag-cloud a,
    .navigation.pagination .page-numbers
):focus-visible {
    background:var(--mvm-int-blue-deep) !important;
    border-color:var(--mvm-int-blue-deep) !important;
    color:var(--mvm-int-white) !important;
    -webkit-text-fill-color:var(--mvm-int-white) !important;
}

/* Footer tags remain a deliberate inverse style. */
html body footer :where(.tagcloud a,.tag-cloud-link):hover,
html body footer :where(.tagcloud a,.tag-cloud-link):focus-visible {
    background:var(--mvm-int-blue-deep) !important;
    border-color:var(--mvm-int-white) !important;
    color:var(--mvm-int-white) !important;
    -webkit-text-fill-color:var(--mvm-int-white) !important;
}

/* Disabled elements: readable but unmistakably inactive. */
html body :where(button,input[type="button"],input[type="submit"],a.button,.button):disabled,
html body :where(button,input[type="button"],input[type="submit"],a.button,.button)[aria-disabled="true"] {
    opacity:.58 !important;
    cursor:not-allowed !important;
    box-shadow:none !important;
    transform:none !important;
}

/* Keyboard focus must remain visible on both light and dark surfaces. */
html body :where(a,button,input,select,textarea,summary):focus-visible {
    outline:3px solid var(--mvm-int-focus) !important;
    outline-offset:2px !important;
}

/* Dark mode: secondary/light buttons should not become blue-on-blue. */
html body.mvm-header-dark :where(.button-secondary,.wp-block-button.is-style-outline .wp-block-button__link):hover,
html body.mvm-header-dark :where(.button-secondary,.wp-block-button.is-style-outline .wp-block-button__link):focus-visible {
    background:#263746 !important;
    border-color:#78BAF3 !important;
    color:#FFFFFF !important;
    -webkit-text-fill-color:#FFFFFF !important;
}

html body.mvm-header-dark :where(a,button,input,select,textarea,summary):focus-visible {
    outline-color:#78BAF3 !important;
}

/* Header focus follows the actual icon/text color: white on blue, blue on active Home. */
html body #mvm-header-v1 :where(a,button):focus-visible {
    outline:2px solid currentColor !important;
    outline-offset:2px !important;
}
