/* ==========================================================
   EMTEL Tab Icon System v2.2.45
   Iconografia SVG para todas las pestañas, sin puntos ni círculos decorativos.
   ========================================================== */
.subtab,
.excel-view-mode-tabs button,
.teacher-pay-page-tabs button,
.student-modal-tabs button,
.registration-view-tabs button,
.profile-tab,
[role="tablist"] > button {
  display: inline-flex;
  align-items: center;
  gap: .48rem;
}

.subtab .tab-icon,
.subtab > [data-icon],
.excel-view-mode-tabs button .tab-icon,
.excel-view-mode-tabs button > [data-icon],
.teacher-pay-page-tabs button .tab-icon,
.teacher-pay-page-tabs button > [data-icon],
.student-modal-tabs button .tab-icon,
.student-modal-tabs button > [data-icon],
.registration-view-tabs button .tab-icon,
.registration-view-tabs button > [data-icon],
.profile-tab .tab-icon,
.profile-tab > [data-icon],
[role="tablist"] > button .tab-icon,
[role="tablist"] > button > [data-icon] {
  display: inline-grid;
  place-items: center;
  width: 1.02rem;
  height: 1.02rem;
  min-width: 1.02rem;
  min-height: 1.02rem;
  max-width: 1.02rem;
  max-height: 1.02rem;
  flex: 0 0 1.02rem;
  color: var(--tab-icon-color, var(--color-primary-strong, #1d4ed8));
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  opacity: .94;
}

.subtab .tab-icon .icon-svg,
.subtab > [data-icon] .icon-svg,
.excel-view-mode-tabs button .icon-svg,
.teacher-pay-page-tabs button .icon-svg,
.student-modal-tabs button .icon-svg,
.registration-view-tabs button .icon-svg,
.profile-tab .icon-svg,
[role="tablist"] > button .icon-svg {
  width: 1.02rem;
  height: 1.02rem;
  stroke-width: 2.25;
}

.subtab:hover,
.excel-view-mode-tabs button:hover,
.teacher-pay-page-tabs button:hover,
.student-modal-tabs button:hover,
.registration-view-tabs button:hover,
.profile-tab:hover,
[role="tablist"] > button:hover {
  --tab-icon-color: var(--color-primary-strong, #1d4ed8);
}

.subtab.is-active,
.subtab[aria-selected="true"],
.excel-view-mode-tabs button.is-active,
.excel-view-mode-tabs button[aria-selected="true"],
.teacher-pay-page-tabs button.is-active,
.teacher-pay-page-tabs button[aria-selected="true"],
.student-modal-tabs button.is-active,
.student-modal-tabs button[aria-selected="true"],
.registration-view-tabs button.is-active,
.registration-view-tabs button[aria-selected="true"],
.profile-tab.is-active,
.profile-tab[aria-selected="true"],
[role="tablist"] > button.is-active,
[role="tablist"] > button[aria-selected="true"] {
  --tab-icon-color: currentColor;
}

/* Eliminación explícita de puntos/círculos decorativos heredados.
   La diferenciación visual debe hacerse por color del SVG, estado y texto. */
.category-dot,
.label-dot,
.field-dot,
.tab-dot,
.ui-dot,
.legend-dot,
.metric-dot,
.bullet-dot,
.status-dot,
.color-dot,
.decorative-dot,
[class*="__dot"],
[class*="-dot"]:not(.note-observation-dot) {
  display: none !important;
}

/* Si un contenedor de icono se usaba como círculo decorativo, se neutraliza
   solo en labels, categorías, chips y pestañas; no se eliminan los SVG. */
.field-label-icon,
.category-title-icon,
.subtab .icon,
.subtab .tab-icon,
.excel-view-mode-tabs button .icon,
.teacher-pay-page-tabs button .icon,
.student-modal-tabs button .icon,
.registration-view-tabs button .icon,
.profile-tab .icon {
  background: transparent !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.field-label-icon,
.category-title-icon {
  color: var(--label-icon-color, var(--color-primary-strong, #1d4ed8));
}
