/*
 * DPUK host overrides. The Dementias Hub stylesheet sets these inside .assets-body (the wrapper in _LayoutWPs) with
 * !important, which beats components.css:
 *   - every link #EB0082 (4.3:1 on white),
 *   - .btn-primary white on #EB3A8A (3.8:1), as a 25px pill,
 *   - .page-link on #D3D3D3, which leaves the current page white on grey.
 * Each rule restates the components.css value with !important, only on themed pages (.dp-page) and never in
 * template or CMS content (.dp-content), which keeps the host styling it was written for.
 * The host's pill shape is kept, and given to every button so primary and secondary match.
 * The host's purple headings and list items are left alone: they are on-brand and 9.1:1 on white.
 */

.assets-body .dp-page a:not(.btn, .dropdown-item, .nav-link, .dp-chip, .dp-content *) {
    color: var(--dp-color-link) !important;
}

    .assets-body .dp-page a:not(.btn, .dropdown-item, .nav-link, .dp-chip, .dp-content *):hover {
        color: var(--dp-color-link-hover) !important;
    }

.assets-body .dp-page a.dp-chip,
.assets-body .dp-page a.dp-chip:hover {
    color: var(--dp-color-text) !important;
}

.assets-body .dp-page a.dp-chip[aria-current="page"] {
    color: var(--dp-color-on-action) !important;
}

.assets-body .dp-page .btn:not(.dp-content *) {
    border-radius: 25px !important;
}

.assets-body .dp-page a.btn-outline-secondary:not(.dp-content *) {
    color: var(--dp-color-text) !important;
}

.assets-body .dp-page a.btn-outline-danger:not(.dp-content *) {
    color: var(--dp-status-withdrawn-fg) !important;
}

.assets-body .dp-page .btn-primary:not(.dp-content *) {
    background-color: var(--dp-color-action) !important;
    border-color: var(--dp-color-action) !important;
    color: var(--dp-color-on-action) !important;
    font-weight: 500 !important;
}

    .assets-body .dp-page .btn-primary:not(.dp-content *):is(:hover, :focus, :active, .active) {
        background-color: var(--dp-color-action-hover) !important;
        border-color: var(--dp-color-action-hover) !important;
    }

.assets-body .dp-page .dp-pagination .page-link {
    background-color: var(--dp-color-surface) !important;
    color: var(--dp-color-link) !important;
}

    .assets-body .dp-page .dp-pagination .page-link:hover {
        background-color: var(--dp-color-surface-subtle) !important;
        color: var(--dp-color-link-hover) !important;
    }

.assets-body .dp-page .dp-pagination .page-item.active .page-link {
    background-color: var(--dp-color-action) !important;
    color: var(--dp-color-on-action) !important;
}

.assets-body .dp-page .dp-pagination .page-item.disabled .page-link {
    background-color: var(--dp-color-surface) !important;
    color: var(--dp-color-text-muted) !important;
}
