/* ═════════════════════════════════════════════════════════════════════
 * Solution Makers — Padrão global do botão X de fechar modais
 * Toda página HTML da plataforma deve incluir:  <link rel="stylesheet" href="/modal-x.css">
 * Garante que o X de fechar fica SEMPRE no canto superior direito do modal,
 * independente do CSS específico do módulo.
 * ═════════════════════════════════════════════════════════════════════ */

/* Header do modal — espaço à direita para o X + posicionamento relativo */
.modal-h,
.modal-header,
.dlg-h,
[class*="modal"] > [class*="header"]:first-child {
  position: relative !important;
  padding-right: 50px !important;
}

/* Botão fechar dentro do header — sempre canto superior direito */
.modal-h > button:last-child,
.modal-header > button:last-child,
.dlg-h > button:last-child,
.modal-h button[onclick*="closeModal"],
.modal-h button[onclick*="close"],
.modal-header button[onclick*="closeModal"],
.modal-header button[onclick*="close"] {
  position: absolute !important;
  right: 10px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 32px !important;
  height: 32px !important;
  min-width: 32px !important;
  padding: 0 !important;
  border: none !important;
  background: transparent !important;
  font-size: 18px !important;
  line-height: 1 !important;
  cursor: pointer !important;
  border-radius: 6px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: var(--t3, #94a3b8) !important;
  margin: 0 !important;
}
.modal-h > button:last-child:hover,
.modal-header > button:last-child:hover,
.dlg-h > button:last-child:hover {
  background: rgba(239, 68, 68, 0.08) !important;
  color: #ef4444 !important;
}