/*
 * FocusRing (Story 8.1) — single keyboard focus indicator for text fields.
 * Removes stacked/double rings (border + outline + box-shadow competing).
 * One treatment only: 2px --border-focus border, no outer glow, no outline.
 * Uses :focus-visible so the ring is for keyboard focus, not mouse click.
 */

/* Native text-like inputs (API Catalog search, support modal, etc.) */
input:not([type="submit"]):not([type="button"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]):not([type="range"]):not([type="image"]):not([type="reset"]):focus-visible,
textarea:focus-visible {
    outline: none !important;
    border-color: var(--border-focus, #2D6E8D) !important;
    border-width: 2px;
    box-shadow: none !important;
}

/* MudBlazor / DHCS TextField — style only the Mud outlined border (one ring) */
.mud-input-control:has(.mud-input-slot:focus-visible) .mud-input-outlined-border,
.mud-input-control:has(input:focus-visible) .mud-input-outlined-border,
.mud-input-control:has(textarea:focus-visible) .mud-input-outlined-border,
.textfield:has(input:focus-visible) .mud-input-outlined-border,
.textfield:has(.mud-input-slot:focus-visible) .mud-input-outlined-border,
.mud-input-control:focus-within .mud-input-outlined-border {
    outline: none !important;
    border-color: var(--border-focus, #2D6E8D) !important;
    border-width: 2px !important;
    box-shadow: none !important;
}

.mud-input-slot:focus-visible,
.mud-input-slot:focus-visible input,
.mud-input-control:focus-within {
    outline: none !important;
}

/*
 * Kill a second border on wrappers that also paint their own border
 * (Home hero search historically set border on .mud-input-outlined AND Mud's border).
 */
.mud-input-control:focus-within .mud-input-outlined,
.textfield:focus-within .mud-input-outlined,
.home-search-field .mud-input-outlined:focus-within,
.home-search-field:focus-within .mud-input-outlined {
    outline: none !important;
    box-shadow: none !important;
    border-width: 0 !important;
}

/* Validation / error states stay distinct (error color, still a single ring) */
input.sm-invalid:focus-visible,
textarea.sm-invalid:focus-visible,
.sm-invalid:focus-visible,
.mud-input-error:has(input:focus-visible) .mud-input-outlined-border,
.mud-input-error:has(.mud-input-slot:focus-visible) .mud-input-outlined-border,
.mud-input-error:focus-within .mud-input-outlined-border {
    border-color: var(--dhcs-color-form-error, #e52207) !important;
    box-shadow: none !important;
    outline: none !important;
}