@font-face {
  font-family: "IBM Plex Sans";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/assets/fonts/ibm-plex/IBMPlexSans-Regular.woff2") format("woff2");
}
@font-face {
  font-family: "IBM Plex Sans";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/assets/fonts/ibm-plex/IBMPlexSans-Medium.woff2") format("woff2");
}
@font-face {
  font-family: "IBM Plex Sans";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/assets/fonts/ibm-plex/IBMPlexSans-SemiBold.woff2") format("woff2");
}
@font-face {
  font-family: "IBM Plex Sans";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/assets/fonts/ibm-plex/IBMPlexSans-Bold.woff2") format("woff2");
}
@font-face {
  font-family: "IBM Plex Sans Condensed";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/assets/fonts/ibm-plex/IBMPlexSansCondensed-Regular.woff2") format("woff2");
}
@font-face {
  font-family: "IBM Plex Sans Condensed";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/assets/fonts/ibm-plex/IBMPlexSansCondensed-Medium.woff2") format("woff2");
}
@font-face {
  font-family: "IBM Plex Sans Condensed";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/assets/fonts/ibm-plex/IBMPlexSansCondensed-SemiBold.woff2") format("woff2");
}
@font-face {
  font-family: "IBM Plex Sans Condensed";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/assets/fonts/ibm-plex/IBMPlexSansCondensed-SemiBold.woff2") format("woff2");
}
@font-face {
  font-family: "IBM Plex Mono";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/assets/fonts/ibm-plex/IBMPlexMono-Regular.woff2") format("woff2");
}
@font-face {
  font-family: "IBM Plex Mono";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/assets/fonts/ibm-plex/IBMPlexMono-Medium.woff2") format("woff2");
}
@font-face {
  font-family: "IBM Plex Mono";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/assets/fonts/ibm-plex/IBMPlexMono-Medium.woff2") format("woff2");
}
@font-face {
  font-family: "IBM Plex Mono";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/assets/fonts/ibm-plex/IBMPlexMono-Medium.woff2") format("woff2");
}

:root {
  --font-ui: "IBM Plex Sans", "Helvetica Neue", Arial, sans-serif;
  --font-condensed: "IBM Plex Sans Condensed", "Arial Narrow", sans-serif;
  --font-mono: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  --focus-visible-color: var(--color-focus, var(--color-accent, var(--accent, #2e7d32)));
}

html,
body,
button,
input,
select,
textarea {
  font-family: var(--font-ui) !important;
}

table th,
thead th {
  font-family: var(--font-condensed) !important;
}

code,
pre,
kbd,
samp,
.font-mono {
  font-family: var(--font-mono) !important;
  font-variant-numeric: tabular-nums;
}

/* El foco de teclado debe sobrevivir a los estilos particulares de cada módulo. */
:where(button, input, select, textarea, summary, a[href], [tabindex]):focus-visible {
  outline: 2px solid var(--focus-visible-color) !important;
  outline-offset: 2px !important;
}

:where(button, [role="tab"])[aria-pressed="true"],
:where(button, [role="tab"])[aria-selected="true"] {
  box-shadow: inset 0 0 0 2px var(--focus-visible-color);
}

select option:checked {
  background: var(--focus-visible-color);
  color: #fff;
}