/**
 * Dashboard hub — set unificado 12 iconos (Repro x8 + Alertas x4).
 * ÚLTIMA capa: pisa dash-identidad-v2, dash-inicio-mejora-visual e index-inline.
 * Layout: icono centrado en tarjeta; badge flota en esquina del wrap sin desalinear.
 */

/* ── Selectores base (máxima especificidad + .dash-hub-unified-set) ── */
html body #pg-dash.dash-serio-v1.dash-identidad-v2 .dash-tab-panel.dash-repro-tab--hub.repro-pebble-vida-20260418 .dash-hub-app-grid.dash-hub-unified-set .dash-app-card,
html body #pg-dash.dash-serio-v1.dash-identidad-v2 .dash-tab-panel.dash-alertas-tab--hub.alertas-pebble-vida-20260709 .dash-hub-app-grid.dash-hub-unified-set .dash-app-card,
html body #pg-dash.dash-serio-v1 .dash-tab-panel.dash-repro-tab--hub .dash-hub-app-grid.dash-hub-unified-set .dash-app-card,
html body #pg-dash.dash-serio-v1 .dash-tab-panel.dash-alertas-tab--hub .dash-hub-app-grid.dash-hub-unified-set .dash-app-card {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 5px !important;
  width: 100% !important;
  min-height: 96px !important;
  max-height: none !important;
  aspect-ratio: auto !important;
  margin: 0 !important;
  padding: 10px 6px 8px !important;
  position: relative !important;
  overflow: visible !important;
  background: var(--gris-0, #ffffff) !important;
  background-image: none !important;
  border: 1px solid var(--gris-300, #cbd5e1) !important;
  border-top: 1px solid var(--gris-300, #cbd5e1) !important;
  border-radius: 10px !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.95),
    0 1px 3px rgba(15, 23, 42, 0.06) !important;
  transform: none !important;
  transition: border-color 0.15s ease, box-shadow 0.15s ease !important;
  grid-template-columns: unset !important;
  grid-template-rows: unset !important;
  align-content: unset !important;
  justify-items: unset !important;
}

html body #pg-dash.dash-serio-v1.dash-identidad-v2 .dash-tab-panel .dash-hub-app-grid.dash-hub-unified-set .dash-app-card::before,
html body #pg-dash.dash-serio-v1.dash-identidad-v2 .dash-tab-panel .dash-hub-app-grid.dash-hub-unified-set .dash-app-card::after,
html body #pg-dash.dash-serio-v1 .dash-tab-panel .dash-hub-app-grid.dash-hub-unified-set .dash-app-card::before,
html body #pg-dash.dash-serio-v1 .dash-tab-panel .dash-hub-app-grid.dash-hub-unified-set .dash-app-card::after {
  content: none !important;
  display: none !important;
}

html body #pg-dash.dash-serio-v1 .dash-tab-panel .dash-hub-app-grid.dash-hub-unified-set .dash-app-card:hover,
html body #pg-dash.dash-serio-v1.dash-identidad-v2 .dash-tab-panel .dash-hub-app-grid.dash-hub-unified-set .dash-app-card:hover,
html body #pg-dash.dash-serio-v1 .dash-tab-panel .dash-hub-app-grid.dash-hub-unified-set .dash-app-card:focus-visible,
html body #pg-dash.dash-serio-v1.dash-identidad-v2 .dash-tab-panel .dash-hub-app-grid.dash-hub-unified-set .dash-app-card:focus-visible {
  border-color: var(--gris-400, #94a3b8) !important;
  border-top-color: var(--gris-400, #94a3b8) !important;
  background: var(--gris-0, #ffffff) !important;
  background-image: none !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 1),
    0 2px 8px rgba(15, 23, 42, 0.1) !important;
  transform: none !important;
}

html body #pg-dash.dash-serio-v1 .dash-tab-panel .dash-hub-app-grid.dash-hub-unified-set .dash-app-card:active,
html body #pg-dash.dash-serio-v1.dash-identidad-v2 .dash-tab-panel .dash-hub-app-grid.dash-hub-unified-set .dash-app-card:active {
  transform: scale(0.98) !important;
}

/* Wrap centrado — ancla fija 48×48 en el medio de la tarjeta */
html body #pg-dash.dash-serio-v1.dash-identidad-v2 .dash-tab-panel .dash-hub-app-grid.dash-hub-unified-set .dash-app-card__ico-wrap,
html body #pg-dash.dash-serio-v1 .dash-tab-panel .dash-hub-app-grid.dash-hub-unified-set .dash-app-card__ico-wrap {
  position: relative !important;
  display: block !important;
  flex: 0 0 auto !important;
  width: 56px !important;
  height: 56px !important;
  min-width: 56px !important;
  min-height: 56px !important;
  max-width: 56px !important;
  max-height: 56px !important;
  margin: 0 auto !important;
  align-self: center !important;
  grid-row: unset !important;
  grid-column: unset !important;
}

/* Marco del icono (slot) — borde aquí, no en el img */
html body #pg-dash.dash-serio-v1.dash-identidad-v2 .dash-tab-panel .dash-hub-app-grid.dash-hub-unified-set .dash-app-card__ico-slot,
html body #pg-dash.dash-serio-v1 .dash-tab-panel .dash-hub-app-grid.dash-hub-unified-set .dash-app-card__ico-slot {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 100% !important;
  padding: 3px !important;
  box-sizing: border-box !important;
  border-radius: 12px !important;
  background: var(--gris-50, #f8fafc) !important;
  background-image: none !important;
  border: none !important;
  box-shadow: inset 0 0 0 1px var(--gris-200, #e2e8f0) !important;
  overflow: hidden !important;
  margin: 0 !important;
}

/* IMG limpio — anula index-inline / identidad-v2 que ponen borde en el img */
html body #pg-dash.dash-serio-v1.dash-identidad-v2 .dash-tab-panel.dash-repro-tab--hub.repro-pebble-vida-20260418 .dash-hub-app-grid.dash-hub-unified-set .dash-app-card__ico-slot img.dash-app-card__ico,
html body #pg-dash.dash-serio-v1.dash-identidad-v2 .dash-tab-panel.dash-alertas-tab--hub.alertas-pebble-vida-20260709 .dash-hub-app-grid.dash-hub-unified-set .dash-app-card__ico-slot img.dash-app-card__ico,
html body #pg-dash.dash-serio-v1.dash-identidad-v2 .dash-tab-panel .dash-hub-app-grid.dash-hub-unified-set img.dash-app-card__ico,
html body #pg-dash.dash-serio-v1 .dash-tab-panel .dash-hub-app-grid.dash-hub-unified-set img.dash-app-card__ico,
#pg-dash.dash-serio-v1 .dash-hub-app-grid.dash-hub-unified-set img.dash-app-card__ico {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  max-width: 100% !important;
  max-height: 100% !important;
  margin: 0 auto !important;
  padding: 0 !important;
  border: none !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  outline: none !important;
  filter: none !important;
  -webkit-filter: none !important;
  object-fit: contain !important;
  object-position: center center !important;
  transform: none !important;
  flex-shrink: 0 !important;
  image-rendering: auto !important;
}

html body #pg-dash.dash-serio-v1 .dash-tab-panel .dash-hub-app-grid.dash-hub-unified-set .dash-app-card:hover img.dash-app-card__ico,
html body #pg-dash.dash-serio-v1.dash-identidad-v2 .dash-tab-panel .dash-hub-app-grid.dash-hub-unified-set .dash-app-card:hover img.dash-app-card__ico,
html body #pg-dash.dash-serio-v1 .dash-tab-panel .dash-hub-app-grid.dash-hub-unified-set .dash-app-card:focus-visible img.dash-app-card__ico,
html body #pg-dash.dash-serio-v1.dash-identidad-v2 .dash-tab-panel .dash-hub-app-grid.dash-hub-unified-set .dash-app-card:focus-visible img.dash-app-card__ico {
  transform: none !important;
  filter: none !important;
  -webkit-filter: none !important;
  border: none !important;
  box-shadow: none !important;
  background: transparent !important;
}

/* Badge — esquina de la TARJETA (no del icono); no desplaza el centro visual */
html body #pg-dash.dash-serio-v1.dash-identidad-v2 .dash-tab-panel .dash-hub-app-grid.dash-hub-unified-set .dash-app-card > .dash-app-card__badge,
html body #pg-dash.dash-serio-v1 .dash-tab-panel .dash-hub-app-grid.dash-hub-unified-set .dash-app-card > .dash-app-card__badge,
#pg-dash.dash-serio-v1 .dash-hub-app-grid.dash-hub-unified-set .dash-app-card > .dash-app-card__badge {
  position: absolute !important;
  top: 4px !important;
  right: 4px !important;
  left: auto !important;
  bottom: auto !important;
  transform: none !important;
  min-width: 18px !important;
  height: 18px !important;
  padding: 0 5px !important;
  font-size: 8px !important;
  font-weight: 900 !important;
  line-height: 18px !important;
  border: 1px solid var(--gris-300, #cbd5e1) !important;
  background: var(--gris-100, #f1f5f9) !important;
  background-image: none !important;
  color: var(--texto-fuerte, #0f172a) !important;
  -webkit-text-fill-color: var(--texto-fuerte, #0f172a) !important;
  border-radius: 999px !important;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.12) !important;
  z-index: 5 !important;
  pointer-events: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  white-space: nowrap !important;
}

html body #pg-dash.dash-serio-v1 .dash-tab-panel .dash-hub-app-grid.dash-hub-unified-set .dash-app-card > .dash-app-card__badge[hidden] {
  display: none !important;
}

/* Etiquetas — sin MAYÚSCULAS ni ellipsis de una línea */
html body #pg-dash.dash-serio-v1.dash-identidad-v2 .dash-tab-panel.dash-repro-tab--hub.repro-pebble-vida-20260418 .dash-hub-app-grid.dash-hub-unified-set .dash-app-card__lbl,
html body #pg-dash.dash-serio-v1.dash-identidad-v2 .dash-tab-panel.dash-alertas-tab--hub.alertas-pebble-vida-20260709 .dash-hub-app-grid.dash-hub-unified-set .dash-app-card__lbl,
html body #pg-dash.dash-serio-v1.dash-identidad-v2 .dash-tab-panel.dash-repro-tab--hub .dash-hub-app-grid.dash-hub-unified-set .dash-app-card__lbl,
html body #pg-dash.dash-serio-v1.dash-identidad-v2 .dash-tab-panel.dash-alertas-tab--hub .dash-hub-app-grid.dash-hub-unified-set .dash-app-card__lbl,
html body #pg-dash.dash-serio-v1 .dash-tab-panel .dash-hub-app-grid.dash-hub-unified-set .dash-app-card__lbl,
#pg-dash.dash-serio-v1 .dash-hub-app-grid.dash-hub-unified-set .dash-app-card__lbl {
  display: -webkit-box !important;
  flex: 0 0 auto !important;
  align-self: stretch !important;
  width: 100% !important;
  max-width: 100% !important;
  min-height: calc(1.15em * 2) !important;
  max-height: calc(1.15em * 2) !important;
  margin: 0 !important;
  padding: 0 1px !important;
  font-size: 8px !important;
  font-weight: 800 !important;
  line-height: 1.15 !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  text-transform: none !important;
  color: var(--texto-fuerte, #0f172a) !important;
  -webkit-text-fill-color: var(--texto-fuerte, #0f172a) !important;
  white-space: normal !important;
  overflow: hidden !important;
  overflow-wrap: anywhere !important;
  word-break: normal !important;
  hyphens: none !important;
  -webkit-hyphens: none !important;
  text-overflow: clip !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  grid-row: unset !important;
}

@media (min-width: 520px) {
  html body #pg-dash.dash-serio-v1 .dash-tab-panel .dash-hub-app-grid.dash-hub-unified-set .dash-app-card,
  html body #pg-dash.dash-serio-v1.dash-identidad-v2 .dash-tab-panel .dash-hub-app-grid.dash-hub-unified-set .dash-app-card {
    min-height: 100px !important;
    max-height: none !important;
    padding: 10px 6px 8px !important;
  }
}

@media (max-width: 360px) {
  html body #pg-dash.dash-serio-v1 .dash-tab-panel .dash-hub-app-grid.dash-hub-unified-set .dash-app-card,
  html body #pg-dash.dash-serio-v1.dash-identidad-v2 .dash-tab-panel .dash-hub-app-grid.dash-hub-unified-set .dash-app-card {
    min-height: 90px !important;
    padding: 8px 4px 6px !important;
  }

  html body #pg-dash.dash-serio-v1 .dash-tab-panel .dash-hub-app-grid.dash-hub-unified-set .dash-app-card__ico-wrap,
  html body #pg-dash.dash-serio-v1.dash-identidad-v2 .dash-tab-panel .dash-hub-app-grid.dash-hub-unified-set .dash-app-card__ico-wrap {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    min-height: 42px !important;
    max-width: 42px !important;
    max-height: 42px !important;
  }

  html body #pg-dash.dash-serio-v1 .dash-tab-panel .dash-hub-app-grid.dash-hub-unified-set .dash-app-card__ico-slot,
  html body #pg-dash.dash-serio-v1.dash-identidad-v2 .dash-tab-panel .dash-hub-app-grid.dash-hub-unified-set .dash-app-card__ico-slot {
    padding: 5px !important;
  }
}