/* ==========================================================================
   Focus state for every form control, app-wide.

   One look everywhere: the border turns brand blue. No glow, no ring, no grey
   halo, no browser outline — the border IS the focus indicator.

   This file is the DEFAULT. It carries no !important and needs none: the 62
   per-page rules that used to set their own focus border, shadow or outline
   were rewritten to this same invariant, so nothing is left to fight. If a new
   page adds a focus style that disagrees, fix it there rather than adding
   weight here.

   Buttons, links, cards and summaries are deliberately untouched — their
   :focus-visible outlines are the only visible focus a keyboard user gets on a
   control that has no border to colour.
   ========================================================================== */

input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):focus,
select:focus,
textarea:focus,
[contenteditable="true"]:focus,
.phone-field:focus-within {
    outline: none;
    box-shadow: none;
    border-color: var(--dark-blue, #1f2937);
}

/* The phone picker's inner input is borderless — the wrapper above shows the state,
   so this must not paint a second one. */
.phone-field .pf-number:focus { border-color: transparent; }

/* Windows High Contrast substitutes its own colours, so a border alone can vanish.
   Restore a real outline there rather than leaving keyboard users with no focus. */
@media (forced-colors: active) {
    input:focus, select:focus, textarea:focus, [contenteditable="true"]:focus {
        outline: 2px solid Highlight;
    }
}