/* ================================================================
   ENEA PROGETTI UE — WCAG 2.4.7 Focus Visible Fixes
   Correzioni per violazioni di focus visibility identificate in test.php
   Principi: G195 (usare outline e background) e F78 (outline sempre visibile)
   ================================================================ */

/* Override jQuery UI outline removal - G195 fix */
.ui-menu .ui-menu-item,
.ui-dialog .ui-dialog-titlebar,
.ui-controlgroup > .ui-controlgroup-item,
.ui-button,
.ui-widget {
  outline: 2px solid var(--col-border-focus) !important;
  outline-offset: 2px !important;
}

/* Focus visible styles con design token */
:focus-visible {
  outline: 3px solid #005fcc !important;
  outline-offset: 2px !important;
  border-radius: 2px;
}

/* Rimuovi outline solo quando focus-visible è supportato */
:focus:not(:focus-visible) {
  outline: none !important;
}

/* Input styles - G195 fix per 1_struttura_protected.php */
input[type="text"]:focus,
input[type="password"]:focus,
input[type="email"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="url"]:focus,
textarea:focus,
select:focus {
  outline: 3px solid var(--col-border-focus) !important;
  outline-offset: 2px !important;
  border-color: var(--col-sky) !important;
  box-shadow: 0 0 0 3px rgba(13, 43, 82, 0.1) !important;
}

/* Bottoni - F78 fix */
button:focus,
.btn:focus,
.btn-accessible:focus,
input[type="button"]:focus,
input[type="submit"]:focus,
input[type="reset"]:focus {
  outline: 3px solid var(--col-border-focus) !important;
  outline-offset: 2px !important;
  box-shadow: 0 0 0 3px rgba(13, 43, 82, 0.1) !important;
}

/* Link focus styles */
a:focus,
.link-accessible:focus {
  outline: 3px solid var(--col-border-focus) !important;
  outline-offset: 2px !important;
  border-radius: 2px;
  text-decoration: underline !important;
}

/* Tabella e elementi interattivi */
.data-table tbody tr:focus-within,
.projects-table tbody tr:focus-within {
  outline: 3px solid var(--col-border-focus) !important;
  outline-offset: -2px !important;
}

.sort-link:focus,
.pagination-list a:focus {
  outline: 3px solid var(--col-border-focus) !important;
  outline-offset: 2px !important;
  background: var(--col-sky-light) !important;
}

/* Modal e dialoghi */
.modal-close:focus,
.modal-content:focus {
  outline: 3px solid var(--col-border-focus) !important;
  outline-offset: 2px !important;
}

/* Form elements specifici */
.form-input:focus,
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus {
  outline: 3px solid var(--col-border-focus) !important;
  outline-offset: 2px !important;
  border-color: var(--col-sky) !important;
  box-shadow: 0 0 0 3px rgba(26, 79, 138, 0.1) !important;
}

/* Elementi custom con tabindex */
[tabindex="0"]:focus {
  outline: 3px solid var(--col-border-focus) !important;
  outline-offset: 2px !important;
}

/* Skip navigation links */
.skip-links a:focus {
  outline: 3px solid var(--col-border-focus) !important;
  outline-offset: 2px !important;
  background: var(--col-white) !important;
  color: var(--col-text) !important;
  text-decoration: underline !important;
}

/* High contrast mode support */
@media (prefers-contrast: high) {
  :focus-visible {
    outline: 4px solid !important;
    outline-color: Highlight !important;
    outline-offset: 2px !important;
  }
}

/* Reduced motion - mantieni focus ma senza animazioni */
@media (prefers-reduced-motion: reduce) {
  :focus-visible {
    transition: none !important;
  }
}

/* Fix specific per jQuery UI components */
.ui-state-focus,
.ui-widget-content .ui-state-focus,
.ui-widget-header .ui-state-focus {
  outline: 3px solid var(--col-border-focus) !important;
  outline-offset: 2px !important;
  border: 1px solid var(--col-sky) !important;
  box-shadow: 0 0 0 2px rgba(13, 43, 82, 0.1) !important;
}

/* Fix per elementi che rimuovono outline in jQuery UI */
.ui-menu .ui-menu-item:focus,
.ui-dialog .ui-dialog-titlebar:focus {
  outline: 3px solid var(--col-border-focus) !important;
  outline-offset: 2px !important;
}

/* Fix per Firefox */
::-moz-focus-inner {
  border: 2px solid var(--col-border-focus) !important;
  padding: 0 !important;
}

/* Fix per Chrome/Safari */
::-webkit-focus-ring {
  outline: 3px solid var(--col-border-focus) !important;
  outline-offset: 2px !important;
}

/* Elementi specifici del progetto */
.table-toolbar button:focus,
.rep-toolbar button:focus {
  outline: 3px solid var(--col-border-focus) !important;
  outline-offset: 2px !important;
}

/* Area report e schede */
#area_rep:focus,
#areaSchede:focus {
  outline: 3px solid var(--col-border-focus) !important;
  outline-offset: 2px !important;
}

/* Responsive focus adjustments */
@media (max-width: 768px) {
  :focus-visible {
    outline-width: 2px !important;
    outline-offset: 1px !important;
  }
}