/*
 * Shared form focus treatment.
 *
 * Text-like controls use one clear blue border and a soft filled background.
 * Interactive controls such as buttons and links keep their existing
 * focus-visible outline for keyboard accessibility.
 */
:root {
    --tik67-form-focus-border: #1565ff;
    --tik67-form-focus-fill: #e8f0ff;
}

:where(
    input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="color"]):not([type="hidden"]):not([type="submit"]):not([type="button"]):not([type="reset"]),
    select,
    textarea
):is(:focus, :focus-visible) {
    border-color: var(--tik67-form-focus-border) !important;
    outline: 0 !important;
    outline-offset: 0 !important;
    background-color: var(--tik67-form-focus-fill) !important;
    box-shadow: none !important;
    caret-color: var(--tik67-form-focus-border);
}

/* Composite fields draw the same single focus border on their outer shell. */
:where(
    .select2-container--focus .select2-selection,
    .select2-container--open .select2-selection,
    .v-select:focus-within .vs__dropdown-toggle,
    .multiselect:focus-within .multiselect__tags,
    .multiselect--active .multiselect__tags,
    .vue-tel-input:focus-within,
    .ep-phone-control:focus-within,
    .ep-country-search:focus-within,
    .ps-search:focus-within,
    .tickety-sidebar__search:focus-within,
    .form-group-default:focus-within,
    .event-ai__composer form:focus-within
) {
    border-color: var(--tik67-form-focus-border) !important;
    outline: 0 !important;
    outline-offset: 0 !important;
    background-color: var(--tik67-form-focus-fill) !important;
    box-shadow: none !important;
}

/* Inner editors inherit the focused shell instead of drawing another line. */
:where(
    .select2-search__field,
    .vs__search,
    .multiselect__input,
    .ps-search input,
    .ps-search select,
    .ps-phone-control > input,
    .tickety-sidebar__search input[type="search"],
    .event-ai__composer textarea,
    .ep-phone-control > input,
    .ep-country-search > input
):is(:focus, :focus-visible) {
    border: 0 !important;
    outline: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

/* File drop zones are compound controls and must also show only one line. */
.cashless-upload:focus-within {
    border-color: var(--tik67-form-focus-border) !important;
    outline: 0 !important;
    outline-offset: 0 !important;
    box-shadow: none !important;
}
