/* Shared accessibility rules; see docs/accessibility for scope and decisions. */
.accessibility-skip-link {
    position: fixed;
    top: -100px;
    left: 1rem;
    z-index: 100000;
}
.accessibility-skip-link:focus {
    top: 1rem;
    padding: .75rem 1rem;
    background: #fff;
    color: #111;
    outline: 2px solid currentColor;
}

/* Aydem decisions in Aydem (1) (1).docx. Keep brand artwork unchanged. */
:root {
    --a11y-purple: #923c8c;
}

body .header-kntnt-shortcuts-button.fast-toggle {
    color: #b85e00;
}

body .kntnt-fix-fast-menu-main .menu-button .desc {
    color: #c2410c;
}

body main > .home-campaing .splide-header p,
body main > .home-campaing .splide-header .button-1.outline:not(:hover):not(:active) {
    color: #666666;
}

/* The document's inline-link section excludes navigation and action buttons. */
body main :is(.page-text, .blog-text, .event-text, .campaign-text, .product-text, p)
    a[href]:not(.button-1, .button-2, .btn, .mobile-invoice-btn, .stretched-link, [role="button"], [data-bs-toggle]),
body main :is(.page-text, .blog-text, .event-text, .campaign-text, .product-text, p)
    a[href]:not(.button-1, .button-2, .btn, .mobile-invoice-btn, .stretched-link, [role="button"], [data-bs-toggle]) :is(span, strong, b, em) {
    color: var(--a11y-purple) !important;
    text-decoration-line: underline;
    text-underline-offset: .15em;
    text-decoration-thickness: .08em;
}

/* Explicit selectors override the legacy red !important error labels. */
body label.error,
body .error-style,
body .form-error,
body .invalid-feedback,
body form .text-danger,
body .alert-danger,
body .information-update-errors-title,
body .information-update-errors-icon,
body .information-update-errors ul {
    color: var(--a11y-purple) !important;
}

/* White separation keeps the purple ring visible on both light and colored UI. */
body :is(a[href], button, input, select, textarea, summary, [role="button"], [tabindex]):focus-visible {
    outline: 3px solid var(--a11y-purple) !important;
    outline-offset: 3px !important;
    box-shadow: 0 0 0 3px #fff !important;
}

@media (forced-colors: active) {
    body :is(a[href], button, input, select, textarea, summary, [role="button"], [tabindex]):focus-visible {
        outline-color: Highlight !important;
        box-shadow: none !important;
    }
}
