/* =====================================================
   ESM 68 - Ajuste visual de módulos
   Mantiene la luz hover existente.
   Corrige textos fuera y quita borde feo del módulo.
   ===================================================== */

/* Quitar borde/outline feo de las tarjetas sin tocar la luz del icono */
#appPanel .modulo-card,
#appPanel .module-card,
#appPanel [data-modulo]{
  outline: none !important;
  border-color: rgba(255,255,255,.08) !important;
  box-shadow: 0 10px 24px rgba(0,0,0,.25) !important;
  overflow: hidden !important;
  min-height: 178px !important;
  height: auto !important;
  padding: 16px 12px 14px 12px !important;
  box-sizing: border-box !important;
}

/* Evita borde raro en hover del cuadro */
#appPanel .modulo-card:hover,
#appPanel .module-card:hover,
#appPanel [data-modulo]:hover{
  outline: none !important;
  border-color: rgba(255,255,255,.12) !important;
  box-shadow: 0 12px 26px rgba(0,0,0,.30) !important;
}

/* Mantiene el icono arriba con espacio suficiente */
#appPanel .modulo-card .icono,
#appPanel .modulo-card .icono-glass,
#appPanel .modulo-card .esm-icono-app3d-wrap,
#appPanel .module-card .icono,
#appPanel [data-modulo] .icono{
  margin-bottom: 8px !important;
  flex-shrink: 0 !important;
}

/* Textos siempre dentro del cuadro */
#appPanel .modulo-card h1,
#appPanel .modulo-card h2,
#appPanel .modulo-card h3,
#appPanel .modulo-card h4,
#appPanel .modulo-card strong,
#appPanel .modulo-card .modulo-titulo,
#appPanel .modulo-card .module-title,
#appPanel .modulo-card .titulo-modulo,
#appPanel .modulo-card .nombre-modulo,
#appPanel .module-card h1,
#appPanel .module-card h2,
#appPanel .module-card h3,
#appPanel .module-card h4,
#appPanel [data-modulo] h3,
#appPanel [data-modulo] strong{
  max-width: 100% !important;
  width: 100% !important;
  margin: 6px auto 4px auto !important;
  padding: 0 4px !important;
  box-sizing: border-box !important;
  text-align: center !important;
  font-size: clamp(12px, .9vw, 15px) !important;
  line-height: 1.12 !important;
  max-height: 38px !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  word-break: normal !important;
  overflow-wrap: break-word !important;
}

/* Descripción debajo, también encerrada */
#appPanel .modulo-card p,
#appPanel .modulo-card .descripcion,
#appPanel .modulo-card .module-description,
#appPanel .module-card p,
#appPanel [data-modulo] p{
  max-width: 100% !important;
  margin: 2px auto 0 auto !important;
  padding: 0 6px !important;
  box-sizing: border-box !important;
  text-align: center !important;
  font-size: clamp(10.5px, .75vw, 12px) !important;
  line-height: 1.18 !important;
  max-height: 44px !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 3 !important;
  -webkit-box-orient: vertical !important;
}

/* Si algún span interno estaba empujando fuera */
#appPanel .modulo-card span,
#appPanel .module-card span,
#appPanel [data-modulo] span{
  max-width: 100% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* Mantener flechas ocultas */
#appPanel .modulo-card .flecha,
#appPanel .modulo-card .arrow,
#appPanel .modulo-card .modulo-flecha,
#appPanel .modulo-card .module-arrow,
#appPanel .modulo-card .btn-abrir,
#appPanel .modulo-card .abrir,
#appPanel .modulo-card .open-module,
#appPanel .modulo-card .entrar,
#appPanel .modulo-card [class*="flecha"],
#appPanel .modulo-card [class*="arrow"],
#appPanel .module-card [class*="flecha"],
#appPanel .module-card [class*="arrow"]{
  display:none !important;
}