/**
 * Keyboard accessibility: shared focus ring.
 *
 * One ring for every focusable element, shown only for keyboard focus (:focus-visible), so mouse
 * clicks on buttons and links stay unchanged. Outline (not box-shadow) so it survives forced-colors
 * mode and does not fight component box-shadows.
 *
 * many component rules set `outline: none` on :focus with higher
 * specificity than :focus-visible; this single override is simpler than chasing each selector.
 */

:root {
    --at-focus-ring-color: #388BFF;      /* Atlassian color.border.focused, ~3.3:1 on white */
    --at-focus-ring-width: 2px;
    --at-focus-ring-offset: 2px;
}

:focus-visible {
    outline: var(--at-focus-ring-width) solid var(--at-focus-ring-color) !important;
    outline-offset: var(--at-focus-ring-offset) !important;
}

/* Inputs keep their own border; an inset ring avoids overlapping neighbouring labels. */
input:not([type="checkbox"]):not([type="radio"]):focus-visible,
textarea:focus-visible,
select:focus-visible {
    outline-offset: 0 !important;
}

/* Select2 multi: focus sits on the tiny inline search field, so ring the whole selection box. */
.select2-container .select2-search__field:focus-visible {
    outline: none !important;
}
.select2-container .select2-selection:has(.select2-search__field:focus-visible) {
    outline: var(--at-focus-ring-width) solid var(--at-focus-ring-color) !important;
    outline-offset: 0 !important;
}

.a11y-label-focus {
    outline: var(--at-focus-ring-width) solid var(--at-focus-ring-color) !important;
    outline-offset: var(--at-focus-ring-offset) !important;
}

#eventTypeRadio .a11y-label-focus,
.radio-group-segmented .a11y-label-focus,
.fin-chart-type-option:focus-visible {
    outline-offset: -2px !important;
}

.at-tooltip-wrapper.a11y-show-hint .tooltip {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0px);
}

.change-date-button:has(.change-date-input:focus-visible) {
    outline: var(--at-focus-ring-width) solid var(--at-focus-ring-color) !important;
    outline-offset: var(--at-focus-ring-offset) !important;
}

.dropDownMenu ul.options:focus-visible {
    outline: none !important;
}
.dropDownMenu ul.options:focus-visible .ui-state-focus {
    outline: var(--at-focus-ring-width) solid var(--at-focus-ring-color) !important;
    outline-offset: -2px !important;
}

.mainAdminNavigationAction:has(:focus-visible) {
    overflow: visible !important;
}

.teamChooser:has(:focus-visible) {
    overflow: visible !important;
}

.issuePart-property:has(:focus-visible) {
    overflow: visible !important;
}

.worklog-attribute-actions-imgs span:focus-visible {
    outline: none !important;
}

.worklog-attribute-actions-imgs span:focus-visible img {
    outline: var(--at-focus-ring-width) solid var(--at-focus-ring-color);
    outline-offset: var(--at-focus-ring-offset);
    border-radius: 6px;
}

a:focus-visible:has(> .reportGadgetSectionBlock) {
    outline: none !important;
}

a:focus-visible > .reportGadgetSectionBlock .reportSectionBlock {
    outline: var(--at-focus-ring-width) solid var(--at-focus-ring-color);
    outline-offset: var(--at-focus-ring-offset);
}

td.show-hidden-fields {
    display: inline-block;
    white-space: nowrap;
    width: auto !important;
    margin-left: 0 !important;
}

#showPreviousIssues:focus-visible,
#loadMoreIssues:focus-visible {
    height: auto !important;
    padding-bottom: 0 !important;
}

.issueAccordionInfo:focus-visible,
a.issueCategoryRow:focus-visible,
.categoryContainer .fc-event:focus-visible,
.actionPanel__tab:focus-visible,
.templatesFilterContainer__header:focus-visible,
.templatesFilterContainer__item:focus-visible,
.issue-favourite-toggle:focus-visible,
.ui-multiselect-checkboxes label:focus-visible,
.worklogQtip .worklogRecord:focus-visible {
    outline-offset: calc(-1 * var(--at-focus-ring-width)) !important;
}

.dropdown-menu ul li > a:focus-visible,
.dropdown-menu ul li label:focus-visible {
    outline-offset: calc(-1 * var(--at-focus-ring-width)) !important;
    background-color: #EBECF0;
}

.select2-selection__choice__remove:focus-visible {
    outline: none !important;
}
.select2-selection__choice:has(> .select2-selection__choice__remove:focus-visible) {
    outline: var(--at-focus-ring-width) solid var(--at-focus-ring-color) !important;
    outline-offset: calc(-1 * var(--at-focus-ring-width)) !important;
}

.a11y-toolbar-right {
    float: right;
    display: flex;
    align-items: flex-start;
}
.a11y-toolbar-right > .tooltip-panel-action {
    float: none !important;
}
.a11y-toolbar-right > .a11y-toolbar-empty {
    margin-left: 0;
}

.tabulator-tableholder:focus-visible:has(.a11y-grid-active),
.tabulator:has(.tabulator-header .a11y-grid-active) .tabulator-tableholder:focus-visible {
    outline: none !important;
}
.tabulator-tableholder:focus-visible .a11y-grid-active,
.tabulator:has(.tabulator-tableholder:focus-visible) .tabulator-header .a11y-grid-active {
    outline: var(--at-focus-ring-width) solid var(--at-focus-ring-color) !important;
    outline-offset: -2px !important;
}

table[data-a11y-table]:focus-visible:has(.a11y-grid-active) {
    outline: none !important;
}
table[data-a11y-table]:focus-visible .a11y-grid-active {
    outline: var(--at-focus-ring-width) solid var(--at-focus-ring-color) !important;
    outline-offset: -2px !important;
}

#workDetailsGraphs:focus-visible {
    outline: none !important;
}
canvas.a11y-chart-ringed:focus-visible {
    outline: none !important;
}
.a11y-chart-bar-focus {
    position: absolute;
    pointer-events: none;
    border-radius: 5px;
    outline: var(--at-focus-ring-width) solid var(--at-focus-ring-color);
    outline-offset: var(--at-focus-ring-offset);
}

.daterangepicker .ranges li.a11y-range-active {
    outline: var(--at-focus-ring-width) solid var(--at-focus-ring-color) !important;
    outline-offset: -2px !important;
}

.a11y-sr-only {
    position: absolute !important;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

@media (forced-colors: active) {
    :focus-visible {
        outline-color: Highlight !important;
    }
}

.exclude-mode-switch input {
    display: block !important;
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    opacity: 0;
    z-index: 1;
    cursor: pointer;
}
.exclude-mode-switch:has(input:focus-visible) .exclude-mode-slider {
    outline: var(--at-focus-ring-width) solid var(--at-focus-ring-color);
    outline-offset: var(--at-focus-ring-offset);
}
