/* V439 · Estados interactivos globales
   Capa final para tap highlight y focus-visible.
   No altera layout, dimensiones, colores base ni lógica funcional. */

:root {
  --interactive-focus-ring: 0 0 0 3px rgba(14, 165, 233, .34);
}

/* Chrome Android / WebView / WebKit: elimina el highlight rectangular nativo
   solo en superficies realmente interactivas. */
button,
a[href],
summary,
[role="button"],
label[for],
input[type="button"],
input[type="submit"],
input[type="reset"] {
  -webkit-tap-highlight-color: transparent;
}

/*
 * Los CSS legacy contienen outline y box-shadow !important con selectores
 * locales de distinta especificidad. Una capa de normalización dedicada evita
 * enumerar pantallas: en la cascada CSS, los !important de una capa declarada
 * prevalecen sobre !important no estratificados (unlayered).
 */
@layer interactive-states-v439 {
  :where(
    button,
    a[href],
    summary,
    [role="button"],
    label[for],
    input[type="button"],
    input[type="submit"],
    input[type="reset"]
  ):focus-visible {
    outline: none !important;
    outline-offset: 0 !important;
    box-shadow: var(--interactive-focus-ring) !important;
  }

  /* Controles compuestos cuyo foco real vive en un input oculto. */
  #packageAccordionStay .package-stay-file-input:focus-visible + .package-stay-upload-button,
  .user-switch-control input:focus-visible + span,
  .atenas-toggle-input:focus-visible + .atenas-toggle {
    outline: none !important;
    outline-offset: 0 !important;
    box-shadow: var(--interactive-focus-ring) !important;
  }

  /* Forced Colors: el sistema necesita outline real, no box-shadow. */
  @media (forced-colors: active) {
    :where(
      button,
      a[href],
      summary,
      [role="button"],
      label[for],
      input[type="button"],
      input[type="submit"],
      input[type="reset"]
    ):focus-visible {
      outline: 2px solid CanvasText !important;
      outline-offset: 2px !important;
      box-shadow: none !important;
    }
  }
}
