/**
 * Housesitting - Modales
 * 
 * MODALES UNIVERSALES:
 * - jkhive-form-modal: Modal para formularios (agregar/editar)
 * - jkhive-message-modal: Modal para mensajes
 * - jkhive-alert-modal: Modal para alertas
 * 
 * MODALES ESPECÍFICOS (legacy):
 * - Modales de categorías (.jkhive-book-cat-modal)
 * - Modales de referencias (.jkhive-book-ref-modal)
 * - Modales de sagas (.jkhive-book-saga-modal)
 * - Modal de agregar/editar libro (.jkhive-add-new-book) - DEPRECADO, usar jkhive-form-modal
 * - Modal de alertas de confirmación (#jkhive-system-modal-container)
 * - Badges hexagonales reutilizables (.jkhive-hex-badge)
 * 
 * IMPORTANTE: Este archivo SOLO contiene estilos para clases específicas del CRM.
 * NO modifica clases generales como .jkhive-modal que ya existen en otros CSS.
 * 
 * MÁXIMA ESPECIFICIDAD - INMUNE A OTROS ESTILOS
 */

/* ========================================
   VARIABLES CSS (si no están definidas)
   ======================================== */
:root {
  --jk-tech-darker: #0f172a;
  --jk-tech-dark: #1e293b;
  --jk-tech-medium: #334155;
  --jk-tech-light: #475569;
  --jk-primary-blue: #0ea5e9;
  --jk-primary-blue-dark: #0284c7;
  --jk-primary-blue-darker: #075985;
  --jk-primary-blue-light: #38bdf8;
  --jk-accent-cyan: #06b6d4;
  --jk-accent-honey: #d4a017;
  --jk-accent-honey-dark: #b8860b;
  --jk-accent-honey-light: #f4c430;
  --jk-secondary-green: #14b8a6;
  --jk-metal: rgba(255, 255, 255, 0.6);
  --jk-metal-light: rgba(255, 255, 255, 0.9);
  --jk-white: #ffffff;
  --jk-shadow: 0 4px 6px rgba(0, 0, 0, 0.3);
  --jk-shadow-lg: 0 10px 25px rgba(0, 0, 0, 0.4);
  --jk-glow-blue: 0 0 20px rgba(14, 165, 233, 0.5);
  --jk-glow-neon: 0 0 20px rgba(244, 196, 48, 0.6);
}

/* ========================================
   MODALES UNIVERSALES
   ======================================== */

/* ========================================
   MODAL UNIVERSAL DE MENSAJES
   .jkhive-message-modal
   ======================================== */
html body .jkhive-message-modal,
html body #jkhive-system-modal-container .jkhive-message-modal,
body .jkhive-message-modal {
  z-index: 9999 !important;
}

html body .jkhive-message-modal.jkhive-modal[style*="display: flex"],
html body .jkhive-message-modal.jkhive-modal.active,
html body .jkhive-message-modal.jkhive-modal.show,
html body #jkhive-system-modal-container .jkhive-message-modal.jkhive-modal[style*="display: flex"],
html body #jkhive-system-modal-container .jkhive-message-modal.jkhive-modal.active,
html body #jkhive-system-modal-container .jkhive-message-modal.jkhive-modal.show,
body .jkhive-message-modal.jkhive-modal[style*="display: flex"],
body .jkhive-message-modal.jkhive-modal.active,
body .jkhive-message-modal.jkhive-modal.show {
  display: flex !important;
  position: fixed !important;
  inset: 0 !important;
  justify-content: center !important;
  align-items: center !important;
  opacity: 1 !important;
}

html body .jkhive-message-modal.jkhive-modal.active .jkhive-modal-overlay,
html body .jkhive-message-modal.jkhive-modal.show .jkhive-modal-overlay,
html body #jkhive-system-modal-container .jkhive-message-modal.jkhive-modal.active .jkhive-modal-overlay,
html body #jkhive-system-modal-container .jkhive-message-modal.jkhive-modal.show .jkhive-modal-overlay,
body .jkhive-message-modal.jkhive-modal.active .jkhive-modal-overlay,
body .jkhive-message-modal.jkhive-modal.show .jkhive-modal-overlay {
  background: rgba(244, 196, 48, 0.8) !important;
  backdrop-filter: blur(10px) !important;
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  z-index: 1 !important;
  pointer-events: auto !important;
  cursor: pointer !important;
}

html body .jkhive-message-modal.jkhive-modal.active .jkhive-modal-overlay::before,
html body .jkhive-message-modal.jkhive-modal.show .jkhive-modal-overlay::before,
html body #jkhive-system-modal-container .jkhive-message-modal.jkhive-modal.active .jkhive-modal-overlay::before,
html body #jkhive-system-modal-container .jkhive-message-modal.jkhive-modal.show .jkhive-modal-overlay::before,
body .jkhive-message-modal.jkhive-modal.active .jkhive-modal-overlay::before,
body .jkhive-message-modal.jkhive-modal.show .jkhive-modal-overlay::before {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background-image: url('../img/honeycomb-pattern.svg') !important;
  background-size: 32px 55px !important;
  background-repeat: repeat !important;
  background-position: 0 0 !important;
  pointer-events: none !important;
  z-index: 1 !important;
  opacity: 1 !important;
  filter: brightness(0) contrast(40) !important;
}

html body .jkhive-message-modal.jkhive-modal.active .jkhive-modal-overlay::after,
html body .jkhive-message-modal.jkhive-modal.show .jkhive-modal-overlay::after,
html body #jkhive-system-modal-container .jkhive-message-modal.jkhive-modal.active .jkhive-modal-overlay::after,
html body #jkhive-system-modal-container .jkhive-message-modal.jkhive-modal.show .jkhive-modal-overlay::after,
body .jkhive-message-modal.jkhive-modal.active .jkhive-modal-overlay::after,
body .jkhive-message-modal.jkhive-modal.show .jkhive-modal-overlay::after {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background-image: url('../img/honeycomb-pattern.svg') !important;
  background-size: 32px 55px !important;
  background-repeat: repeat !important;
  background-position: 16px 28px !important;
  pointer-events: none !important;
  z-index: 1 !important;
  opacity: 1 !important;
  filter: brightness(0) contrast(40) !important;
}

html body .jkhive-message-modal .jkhive-modal-content.jkhive-modal-hex,
html body #jkhive-system-modal-container .jkhive-message-modal .jkhive-modal-content.jkhive-modal-hex,
body .jkhive-message-modal .jkhive-modal-content.jkhive-modal-hex {
  width: 90% !important;
  max-width: 900px !important;
  min-width: 0 !important;
  aspect-ratio: 1 / 1.1547 !important;
  clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%) !important;
  background: linear-gradient(135deg, var(--jk-tech-darker) 0%, var(--jk-tech-dark) 50%, var(--jk-primary-blue-darker) 100%) !important;
  border: 3px solid var(--jk-accent-cyan) !important;
  border-radius: 0 !important;
  padding: 3rem 3rem !important;
  position: relative !important;
  z-index: 10 !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  margin: auto !important;
  pointer-events: auto !important;
}

html body .jkhive-message-modal .jkhive-modal-content.jkhive-modal-hex::before,
html body #jkhive-system-modal-container .jkhive-message-modal .jkhive-modal-content.jkhive-modal-hex::before,
body .jkhive-message-modal .jkhive-modal-content.jkhive-modal-hex::before {
  content: '' !important;
  position: absolute !important;
  inset: -4px !important;
  clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%) !important;
  background: linear-gradient(135deg, var(--jk-accent-cyan), var(--jk-primary-blue-light)) !important;
  z-index: 0 !important;
  opacity: 0.3 !important;
  pointer-events: none !important;
}

/* ========================================
   MODAL UNIVERSAL DE ALERTAS
   .jkhive-alert-modal
   ======================================== */
html body .jkhive-alert-modal,
html body #jkhive-system-modal-container .jkhive-alert-modal,
body .jkhive-alert-modal {
  z-index: 9999 !important;
}

html body .jkhive-alert-modal.jkhive-modal[style*="display: flex"],
html body .jkhive-alert-modal.jkhive-modal.active,
html body .jkhive-alert-modal.jkhive-modal.show,
html body #jkhive-system-modal-container .jkhive-alert-modal.jkhive-modal[style*="display: flex"],
html body #jkhive-system-modal-container .jkhive-alert-modal.jkhive-modal.active,
html body #jkhive-system-modal-container .jkhive-alert-modal.jkhive-modal.show,
body .jkhive-alert-modal.jkhive-modal[style*="display: flex"],
body .jkhive-alert-modal.jkhive-modal.active,
body .jkhive-alert-modal.jkhive-modal.show {
  display: flex !important;
  position: fixed !important;
  inset: 0 !important;
  justify-content: center !important;
  align-items: center !important;
  opacity: 1 !important;
}

html body .jkhive-alert-modal.jkhive-modal.active .jkhive-modal-overlay,
html body .jkhive-alert-modal.jkhive-modal.show .jkhive-modal-overlay,
html body #jkhive-system-modal-container .jkhive-alert-modal.jkhive-modal.active .jkhive-modal-overlay,
html body #jkhive-system-modal-container .jkhive-alert-modal.jkhive-modal.show .jkhive-modal-overlay,
body .jkhive-alert-modal.jkhive-modal.active .jkhive-modal-overlay,
body .jkhive-alert-modal.jkhive-modal.show .jkhive-modal-overlay {
  background: rgba(244, 196, 48, 0.8) !important;
  backdrop-filter: blur(10px) !important;
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  z-index: 10000 !important;
  pointer-events: auto !important;
  cursor: pointer !important;
}

html body .jkhive-alert-modal.jkhive-modal.active .jkhive-modal-overlay::before,
html body .jkhive-alert-modal.jkhive-modal.show .jkhive-modal-overlay::before,
html body #jkhive-system-modal-container .jkhive-alert-modal.jkhive-modal.active .jkhive-modal-overlay::before,
html body #jkhive-system-modal-container .jkhive-alert-modal.jkhive-modal.show .jkhive-modal-overlay::before,
body .jkhive-alert-modal.jkhive-modal.active .jkhive-modal-overlay::before,
body .jkhive-alert-modal.jkhive-modal.show .jkhive-modal-overlay::before {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background-image: url('../img/honeycomb-pattern.svg') !important;
  background-size: 32px 55px !important;
  background-repeat: repeat !important;
  background-position: 0 0 !important;
  pointer-events: none !important;
  z-index: 1 !important;
  opacity: 1 !important;
  filter: brightness(0) contrast(40) !important;
}

html body .jkhive-alert-modal.jkhive-modal.active .jkhive-modal-overlay::after,
html body .jkhive-alert-modal.jkhive-modal.show .jkhive-modal-overlay::after,
html body #jkhive-system-modal-container .jkhive-alert-modal.jkhive-modal.active .jkhive-modal-overlay::after,
html body #jkhive-system-modal-container .jkhive-alert-modal.jkhive-modal.show .jkhive-modal-overlay::after,
body .jkhive-alert-modal.jkhive-modal.active .jkhive-modal-overlay::after,
body .jkhive-alert-modal.jkhive-modal.show .jkhive-modal-overlay::after {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background-image: url('../img/honeycomb-pattern.svg') !important;
  background-size: 32px 55px !important;
  background-repeat: repeat !important;
  background-position: 16px 28px !important;
  pointer-events: none !important;
  z-index: 1 !important;
  opacity: 1 !important;
  filter: brightness(0) contrast(40) !important;
}

html body .jkhive-alert-modal .jkhive-modal-content.jkhive-modal-hex,
html body #jkhive-system-modal-container .jkhive-alert-modal .jkhive-modal-content.jkhive-modal-hex,
body .jkhive-alert-modal .jkhive-modal-content.jkhive-modal-hex {
  max-width: 306.886125px !important;
  width: 306.886125px !important;
  min-width: 306.886125px !important;
  aspect-ratio: 1 / 1.1547 !important;
  clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%) !important;
  background: linear-gradient(135deg, var(--jk-tech-darker) 0%, var(--jk-tech-dark) 50%, var(--jk-primary-blue-darker) 100%) !important;
  border: 3px solid var(--jk-accent-cyan) !important;
  border-radius: 0 !important;
  padding: 1.5rem 1.75rem !important;
  position: relative !important;
  z-index: 10001 !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  margin: auto !important;
  pointer-events: auto !important;
}

html body .jkhive-alert-modal .jkhive-modal-content.jkhive-modal-hex::before,
html body #jkhive-system-modal-container .jkhive-alert-modal .jkhive-modal-content.jkhive-modal-hex::before,
body .jkhive-alert-modal .jkhive-modal-content.jkhive-modal-hex::before {
  content: '' !important;
  position: absolute !important;
  inset: -4px !important;
  clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%) !important;
  background: linear-gradient(135deg, var(--jk-accent-cyan), var(--jk-primary-blue-light)) !important;
  z-index: 0 !important;
  opacity: 0.3 !important;
  pointer-events: none !important;
}

html body .jkhive-alert-modal .jkhive-modal-header,
html body #jkhive-system-modal-container .jkhive-alert-modal .jkhive-modal-header,
body .jkhive-alert-modal .jkhive-modal-header {
  margin-bottom: 0.75rem !important;
  text-align: center !important;
}

html body .jkhive-alert-modal .jkhive-modal-icon,
html body #jkhive-system-modal-container .jkhive-alert-modal .jkhive-modal-icon,
body .jkhive-alert-modal .jkhive-modal-icon {
  font-size: 4rem !important;
  margin-bottom: 0.5rem !important;
  color: var(--jk-accent-honey) !important;
  filter: drop-shadow(0 0 15px rgba(244, 196, 48, 0.8)) !important;
}

html body .jkhive-alert-modal .jkhive-modal-icon img,
html body .jkhive-alert-modal .jkhive-modal-icon svg,
html body #jkhive-system-modal-container .jkhive-alert-modal .jkhive-modal-icon img,
html body #jkhive-system-modal-container .jkhive-alert-modal .jkhive-modal-icon svg,
body .jkhive-alert-modal .jkhive-modal-icon img,
body .jkhive-alert-modal .jkhive-modal-icon svg {
  width: 200% !important;
  height: 200% !important;
  max-width: none !important;
  max-height: none !important;
}

html body .jkhive-alert-modal .jkhive-modal-title,
html body #jkhive-system-modal-container .jkhive-alert-modal .jkhive-modal-title,
body .jkhive-alert-modal .jkhive-modal-title {
  font-size: 1.25rem !important;
  margin-bottom: 0.4rem !important;
  color: var(--jk-accent-honey) !important;
  font-weight: 700 !important;
  text-shadow: 0 0 10px rgba(244, 196, 48, 0.5) !important;
}

html body .jkhive-alert-modal .jkhive-modal-body,
html body #jkhive-system-modal-container .jkhive-alert-modal .jkhive-modal-body,
body .jkhive-alert-modal .jkhive-modal-body {
  margin-bottom: 1rem !important;
  text-align: center !important;
}

html body .jkhive-alert-modal .jkhive-modal-description,
html body #jkhive-system-modal-container .jkhive-alert-modal .jkhive-modal-description,
body .jkhive-alert-modal .jkhive-modal-description {
  font-size: 0.95rem !important;
  line-height: 1.4 !important;
  margin-bottom: 0 !important;
  color: var(--jk-metal-light) !important;
}

html body .jkhive-alert-modal .jkhive-modal-actions,
html body #jkhive-system-modal-container .jkhive-alert-modal .jkhive-modal-actions,
body .jkhive-alert-modal .jkhive-modal-actions {
  display: block !important;
  text-align: center !important;
  margin: 0 !important;
  padding: 0 !important;
  gap: 0 !important;
  row-gap: 0 !important;
  column-gap: 0 !important;
  flex-direction: unset !important;
  flex-wrap: unset !important;
  justify-content: unset !important;
  align-items: unset !important;
  font-size: 0 !important;
  letter-spacing: 0 !important;
  word-spacing: 0 !important;
}

html body .jkhive-alert-modal .jkhive-modal-actions .jkhive-actionbutton-msgs,
html body #jkhive-system-modal-container .jkhive-alert-modal .jkhive-modal-actions .jkhive-actionbutton-msgs,
body .jkhive-alert-modal .jkhive-modal-actions .jkhive-actionbutton-msgs {
  margin: 0 !important;
  margin-left: 0 !important;
  margin-right: 1px !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding: 0 !important;
  display: inline-block !important;
  vertical-align: middle !important;
  min-width: 110px !important;
  transform: scale(0.9) !important;
  letter-spacing: 0 !important;
  word-spacing: 0 !important;
  float: none !important;
  position: relative !important;
  left: auto !important;
  right: auto !important;
  text-align: center !important;
  box-sizing: border-box !important;
}

html body .jkhive-alert-modal .jkhive-modal-actions .jkhive-actionbutton-msgs:last-child,
html body #jkhive-system-modal-container .jkhive-alert-modal .jkhive-modal-actions .jkhive-actionbutton-msgs:last-child,
body .jkhive-alert-modal .jkhive-modal-actions .jkhive-actionbutton-msgs:last-child {
  margin-right: 0 !important;
}

html body .jkhive-alert-modal .jkhive-actionbutton-msgs .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex,
html body .jkhive-alert-modal .jkhive-actionbutton-msgs .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex-honey,
html body #jkhive-system-modal-container .jkhive-alert-modal .jkhive-actionbutton-msgs .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-alert-modal .jkhive-actionbutton-msgs .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex-honey,
body .jkhive-alert-modal .jkhive-actionbutton-msgs .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex,
body .jkhive-alert-modal .jkhive-actionbutton-msgs .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex-honey {
  background: var(--jk-accent-honey) !important;
  border-color: var(--jk-accent-honey) !important;
}

html body .jkhive-alert-modal .jkhive-actionbutton-msgs .jkhive-system-modal-btn[data-action="ok"]:hover .jkhive-hex,
html body .jkhive-alert-modal .jkhive-actionbutton-msgs:hover .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-alert-modal .jkhive-actionbutton-msgs .jkhive-system-modal-btn[data-action="ok"]:hover .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-alert-modal .jkhive-actionbutton-msgs:hover .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex,
body .jkhive-alert-modal .jkhive-actionbutton-msgs .jkhive-system-modal-btn[data-action="ok"]:hover .jkhive-hex,
body .jkhive-alert-modal .jkhive-actionbutton-msgs:hover .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex {
  background: linear-gradient(135deg, #00ff88, #00cc6a, #00ff88) !important;
  border-color: #00ff88 !important;
  box-shadow: 0 0 20px rgba(0, 255, 136, 0.8), 0 0 40px rgba(0, 255, 136, 0.6), inset 0 0 20px rgba(255, 255, 255, 0.3) !important;
  filter: brightness(1.2) drop-shadow(0 0 15px rgba(0, 255, 136, 0.9)) !important;
  transform: scale(0.9) !important;
}

/* ========================================
   MODAL DE ALERTAS - jkhive-msgs-alerts
   (Compatibilidad con código existente)
   ======================================== */
html body .jkhive-msgs-alerts,
html body #jkhive-system-modal-container .jkhive-msgs-alerts,
body .jkhive-msgs-alerts {
  z-index: 9999 !important;
}

html body .jkhive-msgs-alerts.jkhive-modal[style*="display: flex"],
html body .jkhive-msgs-alerts.jkhive-modal.active,
html body .jkhive-msgs-alerts.jkhive-modal.show,
html body #jkhive-system-modal-container .jkhive-msgs-alerts.jkhive-modal[style*="display: flex"],
html body #jkhive-system-modal-container .jkhive-msgs-alerts.jkhive-modal.active,
html body #jkhive-system-modal-container .jkhive-msgs-alerts.jkhive-modal.show,
body .jkhive-msgs-alerts.jkhive-modal[style*="display: flex"],
body .jkhive-msgs-alerts.jkhive-modal.active,
body .jkhive-msgs-alerts.jkhive-modal.show {
  display: flex !important;
  position: fixed !important;
  inset: 0 !important;
  justify-content: center !important;
  align-items: center !important;
  opacity: 1 !important;
}

/* Overlay - aplicar siempre que el modal tenga la clase jkhive-msgs-alerts - MÁXIMA ESPECIFICIDAD */
html body #jkhive-system-modal-container .jkhive-msgs-alerts.jkhive-modal .jkhive-modal-overlay,
html body #jkhive-system-modal-container .jkhive-msgs-alerts.jkhive-modal.active .jkhive-modal-overlay,
html body #jkhive-system-modal-container .jkhive-msgs-alerts.jkhive-modal.show .jkhive-modal-overlay,
html body .jkhive-msgs-alerts.jkhive-modal .jkhive-modal-overlay,
html body .jkhive-msgs-alerts.jkhive-modal.active .jkhive-modal-overlay,
html body .jkhive-msgs-alerts.jkhive-modal.show .jkhive-modal-overlay,
body #jkhive-system-modal-container .jkhive-msgs-alerts.jkhive-modal .jkhive-modal-overlay,
body #jkhive-system-modal-container .jkhive-msgs-alerts.jkhive-modal.active .jkhive-modal-overlay,
body #jkhive-system-modal-container .jkhive-msgs-alerts.jkhive-modal.show .jkhive-modal-overlay,
body .jkhive-msgs-alerts.jkhive-modal .jkhive-modal-overlay,
body .jkhive-msgs-alerts.jkhive-modal.active .jkhive-modal-overlay,
body .jkhive-msgs-alerts.jkhive-modal.show .jkhive-modal-overlay {
  background: rgba(244, 196, 48, 0.8) !important;
  backdrop-filter: blur(10px) !important;
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  z-index: 10000 !important;
  pointer-events: auto !important;
  cursor: pointer !important;
}

/* Overlay ::before - textura SVG - aplicar siempre - MÁXIMA ESPECIFICIDAD */
html body #jkhive-system-modal-container .jkhive-msgs-alerts.jkhive-modal .jkhive-modal-overlay::before,
html body #jkhive-system-modal-container .jkhive-msgs-alerts.jkhive-modal.active .jkhive-modal-overlay::before,
html body #jkhive-system-modal-container .jkhive-msgs-alerts.jkhive-modal.show .jkhive-modal-overlay::before,
html body .jkhive-msgs-alerts.jkhive-modal .jkhive-modal-overlay::before,
html body .jkhive-msgs-alerts.jkhive-modal.active .jkhive-modal-overlay::before,
html body .jkhive-msgs-alerts.jkhive-modal.show .jkhive-modal-overlay::before,
body #jkhive-system-modal-container .jkhive-msgs-alerts.jkhive-modal .jkhive-modal-overlay::before,
body #jkhive-system-modal-container .jkhive-msgs-alerts.jkhive-modal.active .jkhive-modal-overlay::before,
body #jkhive-system-modal-container .jkhive-msgs-alerts.jkhive-modal.show .jkhive-modal-overlay::before,
body .jkhive-msgs-alerts.jkhive-modal .jkhive-modal-overlay::before,
body .jkhive-msgs-alerts.jkhive-modal.active .jkhive-modal-overlay::before,
body .jkhive-msgs-alerts.jkhive-modal.show .jkhive-modal-overlay::before {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background-image: url('../img/honeycomb-pattern.svg') !important;
  background-size: 32px 55px !important;
  background-repeat: repeat !important;
  background-position: 0 0 !important;
  pointer-events: none !important;
  z-index: 1 !important;
  opacity: 1 !important;
  filter: brightness(0) contrast(40) !important;
}

/* Overlay ::after - textura SVG offset - aplicar siempre - MÁXIMA ESPECIFICIDAD */
html body #jkhive-system-modal-container .jkhive-msgs-alerts.jkhive-modal .jkhive-modal-overlay::after,
html body #jkhive-system-modal-container .jkhive-msgs-alerts.jkhive-modal.active .jkhive-modal-overlay::after,
html body #jkhive-system-modal-container .jkhive-msgs-alerts.jkhive-modal.show .jkhive-modal-overlay::after,
html body .jkhive-msgs-alerts.jkhive-modal .jkhive-modal-overlay::after,
html body .jkhive-msgs-alerts.jkhive-modal.active .jkhive-modal-overlay::after,
html body .jkhive-msgs-alerts.jkhive-modal.show .jkhive-modal-overlay::after,
body #jkhive-system-modal-container .jkhive-msgs-alerts.jkhive-modal .jkhive-modal-overlay::after,
body #jkhive-system-modal-container .jkhive-msgs-alerts.jkhive-modal.active .jkhive-modal-overlay::after,
body #jkhive-system-modal-container .jkhive-msgs-alerts.jkhive-modal.show .jkhive-modal-overlay::after,
body .jkhive-msgs-alerts.jkhive-modal .jkhive-modal-overlay::after,
body .jkhive-msgs-alerts.jkhive-modal.active .jkhive-modal-overlay::after,
body .jkhive-msgs-alerts.jkhive-modal.show .jkhive-modal-overlay::after {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background-image: url('../img/honeycomb-pattern.svg') !important;
  background-size: 32px 55px !important;
  background-repeat: repeat !important;
  background-position: 16px 28px !important;
  pointer-events: none !important;
  z-index: 1 !important;
  opacity: 1 !important;
  filter: brightness(0) contrast(40) !important;
}

/* Modal content - MÁXIMA ESPECIFICIDAD - Sobrescribir TODOS los estilos base */
html body #jkhive-system-modal-container .jkhive-msgs-alerts.jkhive-modal .jkhive-modal-content.jkhive-modal-hex,
html body #jkhive-system-modal-container .jkhive-msgs-alerts.jkhive-modal.active .jkhive-modal-content.jkhive-modal-hex,
html body #jkhive-system-modal-container .jkhive-msgs-alerts.jkhive-modal.show .jkhive-modal-content.jkhive-modal-hex,
html body .jkhive-msgs-alerts.jkhive-modal .jkhive-modal-content.jkhive-modal-hex,
html body .jkhive-msgs-alerts.jkhive-modal.active .jkhive-modal-content.jkhive-modal-hex,
html body .jkhive-msgs-alerts.jkhive-modal.show .jkhive-modal-content.jkhive-modal-hex,
body #jkhive-system-modal-container .jkhive-msgs-alerts.jkhive-modal .jkhive-modal-content.jkhive-modal-hex,
body #jkhive-system-modal-container .jkhive-msgs-alerts.jkhive-modal.active .jkhive-modal-content.jkhive-modal-hex,
body #jkhive-system-modal-container .jkhive-msgs-alerts.jkhive-modal.show .jkhive-modal-content.jkhive-modal-hex,
body .jkhive-msgs-alerts.jkhive-modal .jkhive-modal-content.jkhive-modal-hex,
body .jkhive-msgs-alerts.jkhive-modal.active .jkhive-modal-content.jkhive-modal-hex,
body .jkhive-msgs-alerts.jkhive-modal.show .jkhive-modal-content.jkhive-modal-hex {
  max-width: 306.886125px !important;
  width: 306.886125px !important;
  min-width: 306.886125px !important;
  aspect-ratio: 1 / 1.1547 !important;
  clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%) !important;
  background: linear-gradient(135deg, var(--jk-tech-darker) 0%, var(--jk-tech-dark) 50%, var(--jk-primary-blue-darker) 100%) !important;
  border: 3px solid var(--jk-accent-cyan) !important;
  border-radius: 0 !important;
  padding: 1.5rem 1.75rem !important;
  position: relative !important;
  z-index: 10001 !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  margin: auto !important;
  pointer-events: auto !important;
  box-shadow: 0 20px 60px rgba(14, 165, 233, 0.4), inset 0 0 60px rgba(14, 165, 233, 0.1) !important;
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
  visibility: visible !important;
  opacity: 1 !important;
}

html body .jkhive-msgs-alerts .jkhive-modal-content.jkhive-modal-hex::-webkit-scrollbar,
html body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-modal-content.jkhive-modal-hex::-webkit-scrollbar,
body .jkhive-msgs-alerts .jkhive-modal-content.jkhive-modal-hex::-webkit-scrollbar {
  display: none !important;
}

/* Modal content ::before - borde hexagonal - MÁXIMA ESPECIFICIDAD */
html body #jkhive-system-modal-container .jkhive-msgs-alerts.jkhive-modal .jkhive-modal-content.jkhive-modal-hex::before,
html body #jkhive-system-modal-container .jkhive-msgs-alerts.jkhive-modal.active .jkhive-modal-content.jkhive-modal-hex::before,
html body #jkhive-system-modal-container .jkhive-msgs-alerts.jkhive-modal.show .jkhive-modal-content.jkhive-modal-hex::before,
html body .jkhive-msgs-alerts.jkhive-modal .jkhive-modal-content.jkhive-modal-hex::before,
html body .jkhive-msgs-alerts.jkhive-modal.active .jkhive-modal-content.jkhive-modal-hex::before,
html body .jkhive-msgs-alerts.jkhive-modal.show .jkhive-modal-content.jkhive-modal-hex::before,
body #jkhive-system-modal-container .jkhive-msgs-alerts.jkhive-modal .jkhive-modal-content.jkhive-modal-hex::before,
body #jkhive-system-modal-container .jkhive-msgs-alerts.jkhive-modal.active .jkhive-modal-content.jkhive-modal-hex::before,
body #jkhive-system-modal-container .jkhive-msgs-alerts.jkhive-modal.show .jkhive-modal-content.jkhive-modal-hex::before,
body .jkhive-msgs-alerts.jkhive-modal .jkhive-modal-content.jkhive-modal-hex::before,
body .jkhive-msgs-alerts.jkhive-modal.active .jkhive-modal-content.jkhive-modal-hex::before,
body .jkhive-msgs-alerts.jkhive-modal.show .jkhive-modal-content.jkhive-modal-hex::before {
  content: '' !important;
  position: absolute !important;
  inset: -4px !important;
  clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%) !important;
  background: linear-gradient(135deg, var(--jk-accent-cyan), var(--jk-primary-blue-light)) !important;
  z-index: -1 !important;
  opacity: 0.3 !important;
  pointer-events: none !important;
}

html body .jkhive-msgs-alerts .jkhive-modal-header,
html body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-modal-header,
body .jkhive-msgs-alerts .jkhive-modal-header {
  margin-bottom: 0.75rem !important;
  text-align: center !important;
}

html body .jkhive-msgs-alerts .jkhive-modal-icon,
html body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-modal-icon,
body .jkhive-msgs-alerts .jkhive-modal-icon {
  font-size: 4rem !important;
  margin-bottom: 0.5rem !important;
  color: var(--jk-accent-honey) !important;
  filter: drop-shadow(0 0 15px rgba(244, 196, 48, 0.8)) !important;
}

html body .jkhive-msgs-alerts .jkhive-modal-icon img,
html body .jkhive-msgs-alerts .jkhive-modal-icon svg,
html body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-modal-icon img,
html body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-modal-icon svg,
body .jkhive-msgs-alerts .jkhive-modal-icon img,
body .jkhive-msgs-alerts .jkhive-modal-icon svg {
  width: 200% !important;
  height: 200% !important;
  max-width: none !important;
  max-height: none !important;
}

html body .jkhive-msgs-alerts .jkhive-modal-title,
html body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-modal-title,
body .jkhive-msgs-alerts .jkhive-modal-title {
  font-size: 1.25rem !important;
  margin-bottom: 0.4rem !important;
  color: var(--jk-accent-honey) !important;
  font-weight: 700 !important;
  text-shadow: 0 0 10px rgba(244, 196, 48, 0.5) !important;
}

html body .jkhive-msgs-alerts .jkhive-modal-body,
html body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-modal-body,
body .jkhive-msgs-alerts .jkhive-modal-body {
  margin-bottom: 1rem !important;
  text-align: center !important;
}

html body .jkhive-msgs-alerts .jkhive-modal-description,
html body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-modal-description,
body .jkhive-msgs-alerts .jkhive-modal-description {
  font-size: 0.95rem !important;
  line-height: 1.4 !important;
  margin-bottom: 0 !important;
  color: var(--jk-metal-light) !important;
}

html body .jkhive-msgs-alerts .jkhive-modal-actions,
html body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-modal-actions,
body .jkhive-msgs-alerts .jkhive-modal-actions {
  display: block !important;
  text-align: center !important;
  margin: 0 !important;
  padding: 0 !important;
  gap: 0 !important;
  row-gap: 0 !important;
  column-gap: 0 !important;
  flex-direction: unset !important;
  flex-wrap: unset !important;
  justify-content: unset !important;
  align-items: unset !important;
  font-size: 0 !important;
  letter-spacing: 0 !important;
  word-spacing: 0 !important;
}

html body .jkhive-msgs-alerts .jkhive-modal-actions .jkhive-actionbutton-msgs,
html body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-modal-actions .jkhive-actionbutton-msgs,
body .jkhive-msgs-alerts .jkhive-modal-actions .jkhive-actionbutton-msgs {
  margin: 0 !important;
  margin-left: 0 !important;
  margin-right: 1px !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding: 0 !important;
  display: inline-block !important;
  vertical-align: middle !important;
  min-width: 110px !important;
  transform: scale(0.9) !important;
  letter-spacing: 0 !important;
  word-spacing: 0 !important;
  float: none !important;
  position: relative !important;
  left: auto !important;
  right: auto !important;
  text-align: center !important;
  box-sizing: border-box !important;
}

html body .jkhive-msgs-alerts .jkhive-modal-actions .jkhive-actionbutton-msgs:last-child,
html body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-modal-actions .jkhive-actionbutton-msgs:last-child,
body .jkhive-msgs-alerts .jkhive-modal-actions .jkhive-actionbutton-msgs:last-child {
  margin-right: 0 !important;
}

html body .jkhive-msgs-alerts .jkhive-actionbutton-msgs .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex,
html body .jkhive-msgs-alerts .jkhive-actionbutton-msgs .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex-honey,
html body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-actionbutton-msgs .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-actionbutton-msgs .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex-honey,
body .jkhive-msgs-alerts .jkhive-actionbutton-msgs .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex,
body .jkhive-msgs-alerts .jkhive-actionbutton-msgs .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex-honey {
  background: var(--jk-accent-honey) !important;
  border-color: var(--jk-accent-honey) !important;
}

html body .jkhive-msgs-alerts .jkhive-actionbutton-msgs .jkhive-system-modal-btn[data-action="ok"]:hover .jkhive-hex,
html body .jkhive-msgs-alerts .jkhive-actionbutton-msgs:hover .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-actionbutton-msgs .jkhive-system-modal-btn[data-action="ok"]:hover .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-actionbutton-msgs:hover .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex,
body .jkhive-msgs-alerts .jkhive-actionbutton-msgs .jkhive-system-modal-btn[data-action="ok"]:hover .jkhive-hex,
body .jkhive-msgs-alerts .jkhive-actionbutton-msgs:hover .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex {
  background: linear-gradient(135deg, #00ff88, #00cc6a, #00ff88) !important;
  border-color: #00ff88 !important;
  box-shadow: 0 0 20px rgba(0, 255, 136, 0.8), 0 0 40px rgba(0, 255, 136, 0.6), inset 0 0 20px rgba(255, 255, 255, 0.3) !important;
  filter: brightness(1.2) drop-shadow(0 0 15px rgba(0, 255, 136, 0.9)) !important;
  transform: scale(0.9) !important;
}

/* ========================================
   BADGES HEXAGONALES REUTILIZABLES
   ======================================== */
html body .jkhive-hex-badge,
html body #jkhive-system-modal-container .jkhive-hex-badge,
body .jkhive-hex-badge {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 28px !important;
  height: calc(28px * 1.1547) !important;
  clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%) !important;
  background: linear-gradient(135deg, var(--jk-primary-blue-dark) 0%, var(--jk-primary-blue) 50%, var(--jk-primary-blue-light) 100%) !important;
  border: 1px solid var(--jk-primary-blue-light) !important;
  box-shadow: var(--jk-shadow), var(--jk-glow-blue), inset 0 0 15px rgba(14, 165, 233, 0.2) !important;
  cursor: pointer !important;
  transition: all 0.3s ease !important;
  color: var(--jk-white) !important;
  font-size: 0.75rem !important;
  font-weight: 700 !important;
  text-shadow: 0 0 8px rgba(14, 165, 233, 0.8) !important;
}

html body .jkhive-hex-badge-sm,
html body #jkhive-system-modal-container .jkhive-hex-badge-sm,
body .jkhive-hex-badge-sm {
  width: 16px !important;
  height: calc(16px * 1.1547) !important;
  font-size: 0.55rem !important;
  font-weight: 900 !important;
  min-width: 16px !important;
  letter-spacing: 0.02em !important;
}

html body .jkhive-hex-badge-xs,
html body #jkhive-system-modal-container .jkhive-hex-badge-xs,
body .jkhive-hex-badge-xs {
  width: 14px !important;
  height: calc(14px * 1.1547) !important;
  font-size: 8px !important;
  font-weight: 900 !important;
  min-width: 14px !important;
  letter-spacing: 0.02em !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5) !important;
}

html body .jkhive-hex-badge:hover:not(.jkhive-hex-badge-cyan):not(.jkhive-hex-badge-honey),
html body #jkhive-system-modal-container .jkhive-hex-badge:hover:not(.jkhive-hex-badge-cyan):not(.jkhive-hex-badge-honey),
body .jkhive-hex-badge:hover:not(.jkhive-hex-badge-cyan):not(.jkhive-hex-badge-honey) {
  transform: scale(1.1) !important;
  box-shadow: var(--jk-shadow-lg), var(--jk-glow-blue) !important;
  filter: brightness(1.3) !important;
  border-color: var(--jk-accent-cyan) !important;
}

html body .jkhive-hex-badge i,
html body #jkhive-system-modal-container .jkhive-hex-badge i,
body .jkhive-hex-badge i {
  font-size: 0.7rem !important;
  line-height: 1 !important;
}

html body .jkhive-hex-badge-cyan,
html body #jkhive-system-modal-container .jkhive-hex-badge-cyan,
body .jkhive-hex-badge-cyan {
  background: var(--jk-accent-honey, #d4a017) !important;
  background-color: var(--jk-accent-honey, #d4a017) !important;
  border: none !important;
  box-shadow: none !important;
  color: var(--jk-tech-darker) !important;
  text-shadow: none !important;
  transition: background 0.3s ease, background-color 0.3s ease, color 0.3s ease !important;
  opacity: 1 !important;
  filter: none !important;
  transform: none !important;
}

html body .jkhive-hex-badge-cyan:hover,
html body #jkhive-system-modal-container .jkhive-hex-badge-cyan:hover,
body .jkhive-hex-badge-cyan:hover {
  background: var(--jk-accent-cyan, #14b8a6) !important;
  background-color: var(--jk-accent-cyan, #14b8a6) !important;
  border: none !important;
  box-shadow: none !important;
  color: var(--jk-white) !important;
  text-shadow: none !important;
  transform: none !important;
  opacity: 1 !important;
  filter: none !important;
}

html body .jkhive-hex-badge-honey,
html body #jkhive-system-modal-container .jkhive-hex-badge-honey,
body .jkhive-hex-badge-honey {
  background: linear-gradient(135deg, var(--jk-accent-honey-dark) 0%, var(--jk-accent-honey) 50%, var(--jk-accent-honey-light) 100%) !important;
  border-color: var(--jk-accent-honey-light) !important;
  box-shadow: var(--jk-shadow), var(--jk-glow-neon), inset 0 0 15px rgba(212, 160, 23, 0.2) !important;
  color: var(--jk-tech-darker) !important;
  text-shadow: 0 0 8px rgba(244, 196, 48, 0.8) !important;
}

html body .jkhive-hex-badge-honey:hover,
html body #jkhive-system-modal-container .jkhive-hex-badge-honey:hover,
body .jkhive-hex-badge-honey:hover {
  box-shadow: var(--jk-shadow-lg), var(--jk-glow-neon) !important;
  border-color: var(--jk-accent-honey-light) !important;
}

/* Badge hexagonal horizontal para tecnologías con texto */
html body .jkhive-hex-badge-horizontal,
html body #jkhive-system-modal-container .jkhive-hex-badge-horizontal,
body .jkhive-hex-badge-horizontal {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0.35rem 0.75rem !important;
  min-width: auto !important;
  width: auto !important;
  height: 2rem !important;
  clip-path: polygon(10% 0%, 90% 0%, 100% 50%, 90% 100%, 10% 100%, 0% 50%) !important;
  background: linear-gradient(135deg, var(--jk-primary-blue-dark) 0%, var(--jk-primary-blue) 50%, var(--jk-primary-blue-light) 100%) !important;
  border: 1px solid var(--jk-primary-blue-light) !important;
  box-shadow: var(--jk-shadow), var(--jk-glow-blue), inset 0 0 15px rgba(14, 165, 233, 0.2) !important;
  cursor: default !important;
  transition: all 0.3s ease !important;
  color: var(--jk-white) !important;
  font-size: 0.75rem !important;
  font-weight: 600 !important;
  text-shadow: 0 0 8px rgba(14, 165, 233, 0.8) !important;
  white-space: nowrap !important;
  margin: 0.25rem !important;
}

html body .jkhive-hex-badge-horizontal:hover,
html body #jkhive-system-modal-container .jkhive-hex-badge-horizontal:hover,
body .jkhive-hex-badge-horizontal:hover {
  transform: scale(1.05) !important;
  box-shadow: var(--jk-shadow-lg), var(--jk-glow-blue) !important;
  filter: brightness(1.2) !important;
  border-color: var(--jk-accent-cyan) !important;
}

/* ========================================
   MODAL DE CATEGORÍAS
   .jkhive-book-cat-modal
   ======================================== */
html body .jkhive-book-cat-modal,
html body #jkhive-system-modal-container .jkhive-book-cat-modal,
body .jkhive-book-cat-modal {
  position: fixed !important;
  inset: 0 !important;
  z-index: 9999 !important;
  display: none !important;
  justify-content: center !important;
  align-items: center !important;
  opacity: 0 !important;
  transition: opacity 0.3s ease !important;
}

html body .jkhive-book-cat-modal[style*="display: flex"],
html body .jkhive-book-cat-modal.active,
html body .jkhive-book-cat-modal.show,
html body .jkhive-book-cat-modal.show.active,
html body #jkhive-system-modal-container .jkhive-book-cat-modal[style*="display: flex"],
html body #jkhive-system-modal-container .jkhive-book-cat-modal.active,
html body #jkhive-system-modal-container .jkhive-book-cat-modal.show,
html body #jkhive-system-modal-container .jkhive-book-cat-modal.show.active,
body .jkhive-book-cat-modal[style*="display: flex"],
body .jkhive-book-cat-modal.active,
body .jkhive-book-cat-modal.show,
body .jkhive-book-cat-modal.show.active {
  display: flex !important;
  opacity: 1 !important;
  visibility: visible !important;
}

html body .jkhive-book-cat-modal .jkhive-modal-overlay,
html body #jkhive-system-modal-container .jkhive-book-cat-modal .jkhive-modal-overlay,
body .jkhive-book-cat-modal .jkhive-modal-overlay {
  background: rgba(244, 196, 48, 0.8) !important;
  backdrop-filter: blur(10px) !important;
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  z-index: 1 !important;
  pointer-events: auto !important;
  cursor: pointer !important;
}

html body .jkhive-book-cat-modal .jkhive-modal-overlay::before,
html body #jkhive-system-modal-container .jkhive-book-cat-modal .jkhive-modal-overlay::before,
body .jkhive-book-cat-modal .jkhive-modal-overlay::before {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background-image: url('../img/honeycomb-pattern.svg') !important;
  background-size: 32px 55px !important;
  background-repeat: repeat !important;
  background-position: 0 0 !important;
  pointer-events: none !important;
  z-index: 1 !important;
  opacity: 1 !important;
  filter: brightness(0) contrast(40) !important;
}

html body .jkhive-book-cat-modal .jkhive-modal-overlay::after,
html body #jkhive-system-modal-container .jkhive-book-cat-modal .jkhive-modal-overlay::after,
body .jkhive-book-cat-modal .jkhive-modal-overlay::after {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background-image: url('../img/honeycomb-pattern.svg') !important;
  background-size: 32px 55px !important;
  background-repeat: repeat !important;
  background-position: 16px 28px !important;
  pointer-events: none !important;
  z-index: 1 !important;
  opacity: 1 !important;
  filter: brightness(0) contrast(40) !important;
}

html body .jkhive-book-cat-modal .jkhive-modal-content,
html body #jkhive-system-modal-container .jkhive-book-cat-modal .jkhive-modal-content,
body .jkhive-book-cat-modal .jkhive-modal-content {
  width: 90% !important;
  max-width: 920px !important;
  min-width: 0 !important;
  aspect-ratio: 1 / 1.1547 !important;
  clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%) !important;
  background: linear-gradient(135deg, var(--jk-tech-darker) 0%, var(--jk-tech-dark) 50%, var(--jk-primary-blue-darker) 100%) !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  position: relative !important;
  z-index: 2 !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  box-shadow: none !important;
  outline: none !important;
}

html body .jkhive-book-cat-modal .jkhive-modal-content::before,
html body #jkhive-system-modal-container .jkhive-book-cat-modal .jkhive-modal-content::before,
html body .jkhive-book-cat-modal .jkhive-modal-content::after,
html body #jkhive-system-modal-container .jkhive-book-cat-modal .jkhive-modal-content::after,
body .jkhive-book-cat-modal .jkhive-modal-content::before,
body .jkhive-book-cat-modal .jkhive-modal-content::after {
  display: none !important;
  content: none !important;
}

html body .jkhive-book-cat-modal .jkhive-modal-header,
html body #jkhive-system-modal-container .jkhive-book-cat-modal .jkhive-modal-header,
body .jkhive-book-cat-modal .jkhive-modal-header {
  height: 25% !important;
  width: 100% !important;
  position: relative !important;
  padding: 0 !important;
  padding-top: 20px !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: visible !important;
  z-index: 2 !important;
}

html body .jkhive-book-cat-modal .jkhive-modal-header-top,
html body #jkhive-system-modal-container .jkhive-book-cat-modal .jkhive-modal-header-top,
body .jkhive-book-cat-modal .jkhive-modal-header-top {
  height: 40% !important;
  width: 100% !important;
  display: flex !important;
  align-items: flex-end !important;
  justify-content: center !important;
  padding: 0 !important;
  padding-bottom: 0.5rem !important;
  position: relative !important;
  z-index: 3 !important;
  overflow: visible !important;
}

html body .jkhive-book-cat-modal .jkhive-modal-header-icon,
html body #jkhive-system-modal-container .jkhive-book-cat-modal .jkhive-modal-header-icon,
body .jkhive-book-cat-modal .jkhive-modal-header-icon {
  font-size: 2.1rem !important;
  color: var(--jk-accent-cyan) !important;
  filter: drop-shadow(0 0 15px rgba(6, 182, 212, 0.8)) !important;
  line-height: 1 !important;
  position: relative !important;
  z-index: 4 !important;
}

html body .jkhive-book-cat-modal .jkhive-modal-header-bottom,
html body #jkhive-system-modal-container .jkhive-book-cat-modal .jkhive-modal-header-bottom,
body .jkhive-book-cat-modal .jkhive-modal-header-bottom {
  height: 60% !important;
  width: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0.5rem 1.5rem 0.75rem 1.5rem !important;
  box-sizing: border-box !important;
  position: relative !important;
  z-index: 3 !important;
  overflow: visible !important;
  gap: 0.25rem !important;
}

html body .jkhive-book-cat-modal .jkhive-modal-header-bottom .jkhive-modal-title,
html body #jkhive-system-modal-container .jkhive-book-cat-modal .jkhive-modal-header-bottom .jkhive-modal-title,
body .jkhive-book-cat-modal .jkhive-modal-header-bottom .jkhive-modal-title {
  font-size: 1.1rem !important;
  color: var(--jk-metal-light) !important;
  font-weight: 700 !important;
  margin: 0 !important;
  text-align: center !important;
}

html body .jkhive-book-cat-modal .jkhive-modal-header-bottom .jkhive-modal-subtitle,
html body #jkhive-system-modal-container .jkhive-book-cat-modal .jkhive-modal-header-bottom .jkhive-modal-subtitle,
body .jkhive-book-cat-modal .jkhive-modal-header-bottom .jkhive-modal-subtitle {
  font-size: 0.75rem !important;
  color: var(--jk-metal) !important;
  margin: 0 !important;
  text-align: center !important;
}

html body .jkhive-book-cat-modal .jkhive-modal-body,
html body #jkhive-system-modal-container .jkhive-book-cat-modal .jkhive-modal-body,
body .jkhive-book-cat-modal .jkhive-modal-body {
  height: 50% !important;
  width: 100% !important;
  position: relative !important;
  padding: 0.75rem 1.25rem !important;
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
  z-index: 2 !important;
}

html body .jkhive-book-cat-modal .jkhive-modal-body-content,
html body #jkhive-system-modal-container .jkhive-book-cat-modal .jkhive-modal-body-content,
body .jkhive-book-cat-modal .jkhive-modal-body-content {
  flex: 1 !important;
  width: 100% !important;
  height: 100% !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding-top: 3rem !important;
  padding-right: 0.5rem !important;
  padding-bottom: 0.5rem !important;
  box-sizing: border-box !important;
  min-height: 0 !important;
  scrollbar-width: thin !important;
  scrollbar-color: var(--jk-accent-cyan) var(--jk-tech-dark) !important;
}

html body .jkhive-book-cat-modal .jkhive-modal-body-content::-webkit-scrollbar,
html body #jkhive-system-modal-container .jkhive-book-cat-modal .jkhive-modal-body-content::-webkit-scrollbar,
body .jkhive-book-cat-modal .jkhive-modal-body-content::-webkit-scrollbar {
  width: 8px !important;
}

html body .jkhive-book-cat-modal .jkhive-modal-body-content::-webkit-scrollbar-track,
html body #jkhive-system-modal-container .jkhive-book-cat-modal .jkhive-modal-body-content::-webkit-scrollbar-track,
body .jkhive-book-cat-modal .jkhive-modal-body-content::-webkit-scrollbar-track {
  background: var(--jk-tech-dark) !important;
}

html body .jkhive-book-cat-modal .jkhive-modal-body-content::-webkit-scrollbar-thumb,
html body #jkhive-system-modal-container .jkhive-book-cat-modal .jkhive-modal-body-content::-webkit-scrollbar-thumb,
body .jkhive-book-cat-modal .jkhive-modal-body-content::-webkit-scrollbar-thumb {
  background: var(--jk-accent-cyan) !important;
  border-radius: 4px !important;
}

html body .jkhive-book-cat-modal .jkhive-modal-body-content::-webkit-scrollbar-thumb:hover,
html body #jkhive-system-modal-container .jkhive-book-cat-modal .jkhive-modal-body-content::-webkit-scrollbar-thumb:hover,
body .jkhive-book-cat-modal .jkhive-modal-body-content::-webkit-scrollbar-thumb:hover {
  background: var(--jk-primary-blue-light) !important;
}

html body .jkhive-book-cat-modal .jkhive-modal-footer,
html body #jkhive-system-modal-container .jkhive-book-cat-modal .jkhive-modal-footer,
body .jkhive-book-cat-modal .jkhive-modal-footer {
  height: 25% !important;
  width: 100% !important;
  position: relative !important;
  padding: 0 !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  background: transparent !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: visible !important;
  z-index: 2 !important;
}

/* ========================================
   MODAL DE REFERENCIAS
   .jkhive-book-ref-modal
   ======================================== */
html body .jkhive-book-ref-modal,
html body #jkhive-system-modal-container .jkhive-book-ref-modal,
body .jkhive-book-ref-modal {
  z-index: 9999 !important;
}

html body .jkhive-book-ref-modal .jkhive-modal-overlay,
html body #jkhive-system-modal-container .jkhive-book-ref-modal .jkhive-modal-overlay,
body .jkhive-book-ref-modal .jkhive-modal-overlay {
  background: rgba(244, 196, 48, 0.8) !important;
  backdrop-filter: blur(10px) !important;
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  z-index: 1 !important;
  pointer-events: auto !important;
  cursor: pointer !important;
}

html body .jkhive-book-ref-modal .jkhive-modal-overlay::before,
html body #jkhive-system-modal-container .jkhive-book-ref-modal .jkhive-modal-overlay::before,
body .jkhive-book-ref-modal .jkhive-modal-overlay::before {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background-image: url('../img/honeycomb-pattern.svg') !important;
  background-size: 32px 55px !important;
  background-repeat: repeat !important;
  background-position: 0 0 !important;
  pointer-events: none !important;
  z-index: 1 !important;
  opacity: 1 !important;
  filter: brightness(0) contrast(40) !important;
}

html body .jkhive-book-ref-modal .jkhive-modal-overlay::after,
html body #jkhive-system-modal-container .jkhive-book-ref-modal .jkhive-modal-overlay::after,
body .jkhive-book-ref-modal .jkhive-modal-overlay::after {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background-image: url('../img/honeycomb-pattern.svg') !important;
  background-size: 32px 55px !important;
  background-repeat: repeat !important;
  background-position: 16px 28px !important;
  pointer-events: none !important;
  z-index: 1 !important;
  opacity: 1 !important;
  filter: brightness(0) contrast(40) !important;
}

html body .jkhive-book-ref-modal .jkhive-modal-content,
html body #jkhive-system-modal-container .jkhive-book-ref-modal .jkhive-modal-content,
body .jkhive-book-ref-modal .jkhive-modal-content {
  width: 90% !important;
  max-width: 920px !important;
  min-width: 0 !important;
  aspect-ratio: 1 / 1.1547 !important;
  clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%) !important;
  background: linear-gradient(135deg, var(--jk-tech-darker) 0%, var(--jk-tech-dark) 50%, var(--jk-primary-blue-darker) 100%) !important;
  border: 3px solid var(--jk-accent-cyan) !important;
  border-radius: 0 !important;
  padding: 0 !important;
  position: relative !important;
  z-index: 2 !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
}

html body .jkhive-book-ref-modal .jkhive-modal-content::before,
html body #jkhive-system-modal-container .jkhive-book-ref-modal .jkhive-modal-content::before,
body .jkhive-book-ref-modal .jkhive-modal-content::before {
  content: '' !important;
  position: absolute !important;
  inset: -4px !important;
  clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%) !important;
  background: linear-gradient(135deg, var(--jk-accent-cyan), var(--jk-primary-blue-light)) !important;
  z-index: 0 !important;
  opacity: 0.3 !important;
  pointer-events: none !important;
}

html body .jkhive-book-ref-modal .jkhive-modal-header,
html body #jkhive-system-modal-container .jkhive-book-ref-modal .jkhive-modal-header,
body .jkhive-book-ref-modal .jkhive-modal-header {
  height: 25% !important;
  width: 100% !important;
  position: relative !important;
  padding: 0 !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: visible !important;
  z-index: 2 !important;
}

html body .jkhive-book-ref-modal .jkhive-modal-header-top,
html body #jkhive-system-modal-container .jkhive-book-ref-modal .jkhive-modal-header-top,
body .jkhive-book-ref-modal .jkhive-modal-header-top {
  height: 40% !important;
  width: 100% !important;
  display: flex !important;
  align-items: flex-end !important;
  justify-content: center !important;
  padding: 0 !important;
  padding-bottom: 0.5rem !important;
  position: relative !important;
  z-index: 3 !important;
  overflow: visible !important;
}

html body .jkhive-book-ref-modal .jkhive-modal-header-icon,
html body .jkhive-book-ref-modal .jkhive-modal-icon,
html body #jkhive-system-modal-container .jkhive-book-ref-modal .jkhive-modal-header-icon,
html body #jkhive-system-modal-container .jkhive-book-ref-modal .jkhive-modal-icon,
body .jkhive-book-ref-modal .jkhive-modal-header-icon,
body .jkhive-book-ref-modal .jkhive-modal-icon {
  font-size: 2.1rem !important;
  color: var(--jk-accent-cyan) !important;
  filter: drop-shadow(0 0 15px rgba(6, 182, 212, 0.8)) !important;
  line-height: 1 !important;
  position: relative !important;
  z-index: 4 !important;
}

html body .jkhive-book-ref-modal .jkhive-modal-header-bottom,
html body #jkhive-system-modal-container .jkhive-book-ref-modal .jkhive-modal-header-bottom,
body .jkhive-book-ref-modal .jkhive-modal-header-bottom {
  height: 60% !important;
  width: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0.5rem 1.5rem 0.75rem 1.5rem !important;
  box-sizing: border-box !important;
  position: relative !important;
  z-index: 3 !important;
  overflow: visible !important;
  gap: 0.25rem !important;
}

html body .jkhive-book-ref-modal .jkhive-modal-header-bottom .jkhive-modal-title,
html body .jkhive-book-ref-modal .jkhive-modal-title,
html body #jkhive-system-modal-container .jkhive-book-ref-modal .jkhive-modal-header-bottom .jkhive-modal-title,
html body #jkhive-system-modal-container .jkhive-book-ref-modal .jkhive-modal-title,
body .jkhive-book-ref-modal .jkhive-modal-header-bottom .jkhive-modal-title,
body .jkhive-book-ref-modal .jkhive-modal-title {
  font-size: 1.1rem !important;
  color: var(--jk-metal-light) !important;
  font-weight: 700 !important;
  margin: 0 !important;
  text-align: center !important;
}

html body .jkhive-book-ref-modal .jkhive-modal-header-bottom .jkhive-modal-subtitle,
html body .jkhive-book-ref-modal .jkhive-modal-subtitle,
html body #jkhive-system-modal-container .jkhive-book-ref-modal .jkhive-modal-header-bottom .jkhive-modal-subtitle,
html body #jkhive-system-modal-container .jkhive-book-ref-modal .jkhive-modal-subtitle,
body .jkhive-book-ref-modal .jkhive-modal-header-bottom .jkhive-modal-subtitle,
body .jkhive-book-ref-modal .jkhive-modal-subtitle {
  font-size: 0.75rem !important;
  color: var(--jk-metal) !important;
  margin: 0 !important;
  text-align: center !important;
}

html body .jkhive-book-ref-modal .jkhive-modal-body,
html body #jkhive-system-modal-container .jkhive-book-ref-modal .jkhive-modal-body,
body .jkhive-book-ref-modal .jkhive-modal-body {
  height: 50% !important;
  width: 100% !important;
  position: relative !important;
  padding: 1rem 1.5rem !important;
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
  z-index: 2 !important;
}

html body .jkhive-book-ref-modal .jkhive-modal-body-content,
html body #jkhive-system-modal-container .jkhive-book-ref-modal .jkhive-modal-body-content,
body .jkhive-book-ref-modal .jkhive-modal-body-content {
  width: 100% !important;
  height: 100% !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding-top: 4rem !important;
  box-sizing: border-box !important;
  scrollbar-width: thin !important;
  scrollbar-color: var(--jk-primary-blue) var(--jk-tech-dark) !important;
}

html body .jkhive-book-ref-modal .jkhive-modal-body-content::-webkit-scrollbar,
html body #jkhive-system-modal-container .jkhive-book-ref-modal .jkhive-modal-body-content::-webkit-scrollbar,
body .jkhive-book-ref-modal .jkhive-modal-body-content::-webkit-scrollbar {
  width: 8px !important;
}

html body .jkhive-book-ref-modal .jkhive-modal-body-content::-webkit-scrollbar-track,
html body #jkhive-system-modal-container .jkhive-book-ref-modal .jkhive-modal-body-content::-webkit-scrollbar-track,
body .jkhive-book-ref-modal .jkhive-modal-body-content::-webkit-scrollbar-track {
  background: var(--jk-tech-dark) !important;
}

html body .jkhive-book-ref-modal .jkhive-modal-body-content::-webkit-scrollbar-thumb,
html body #jkhive-system-modal-container .jkhive-book-ref-modal .jkhive-modal-body-content::-webkit-scrollbar-thumb,
body .jkhive-book-ref-modal .jkhive-modal-body-content::-webkit-scrollbar-thumb {
  background: var(--jk-primary-blue) !important;
  border-radius: 4px !important;
}

html body .jkhive-book-ref-modal .jkhive-modal-body-content::-webkit-scrollbar-thumb:hover,
html body #jkhive-system-modal-container .jkhive-book-ref-modal .jkhive-modal-body-content::-webkit-scrollbar-thumb:hover,
body .jkhive-book-ref-modal .jkhive-modal-body-content::-webkit-scrollbar-thumb:hover {
  background: var(--jk-primary-blue-light) !important;
}

html body .jkhive-book-ref-modal .jkhive-modal-footer,
html body #jkhive-system-modal-container .jkhive-book-ref-modal .jkhive-modal-footer,
body .jkhive-book-ref-modal .jkhive-modal-footer {
  height: 25% !important;
  width: 100% !important;
  position: relative !important;
  padding: 0 !important;
  margin: 0 !important;
  margin-top: -20px !important;
  box-sizing: border-box !important;
  background: transparent !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: visible !important;
  z-index: 2 !important;
}

/* ========================================
   MODAL DE SAGAS
   .jkhive-book-saga-modal
   ======================================== */
html body .jkhive-book-saga-modal,
html body #jkhive-system-modal-container .jkhive-book-saga-modal,
body .jkhive-book-saga-modal {
  z-index: 9999 !important;
}

html body .jkhive-book-saga-modal .jkhive-modal-overlay,
html body #jkhive-system-modal-container .jkhive-book-saga-modal .jkhive-modal-overlay,
body .jkhive-book-saga-modal .jkhive-modal-overlay {
  background: rgba(244, 196, 48, 0.8) !important;
  backdrop-filter: blur(10px) !important;
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  z-index: 1 !important;
  pointer-events: auto !important;
  cursor: pointer !important;
}

html body .jkhive-book-saga-modal .jkhive-modal-overlay::before,
html body #jkhive-system-modal-container .jkhive-book-saga-modal .jkhive-modal-overlay::before,
body .jkhive-book-saga-modal .jkhive-modal-overlay::before {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background-image: url('../img/honeycomb-pattern.svg') !important;
  background-size: 32px 55px !important;
  background-repeat: repeat !important;
  background-position: 0 0 !important;
  pointer-events: none !important;
  z-index: 1 !important;
  opacity: 1 !important;
  filter: brightness(0) contrast(40) !important;
}

html body .jkhive-book-saga-modal .jkhive-modal-overlay::after,
html body #jkhive-system-modal-container .jkhive-book-saga-modal .jkhive-modal-overlay::after,
body .jkhive-book-saga-modal .jkhive-modal-overlay::after {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background-image: url('../img/honeycomb-pattern.svg') !important;
  background-size: 32px 55px !important;
  background-repeat: repeat !important;
  background-position: 16px 28px !important;
  pointer-events: none !important;
  z-index: 1 !important;
  opacity: 1 !important;
  filter: brightness(0) contrast(40) !important;
}

html body .jkhive-book-saga-modal .jkhive-modal-content,
html body #jkhive-system-modal-container .jkhive-book-saga-modal .jkhive-modal-content,
body .jkhive-book-saga-modal .jkhive-modal-content {
  width: 90% !important;
  max-width: 920px !important;
  min-width: 0 !important;
  aspect-ratio: 1 / 1.1547 !important;
  clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%) !important;
  background: linear-gradient(135deg, var(--jk-tech-darker) 0%, var(--jk-tech-dark) 50%, var(--jk-primary-blue-darker) 100%) !important;
  border: 3px solid var(--jk-accent-cyan) !important;
  border-radius: 0 !important;
  padding: 0 !important;
  position: relative !important;
  z-index: 2 !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
}

html body .jkhive-book-saga-modal .jkhive-modal-content::before,
html body #jkhive-system-modal-container .jkhive-book-saga-modal .jkhive-modal-content::before,
body .jkhive-book-saga-modal .jkhive-modal-content::before {
  content: '' !important;
  position: absolute !important;
  inset: -4px !important;
  clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%) !important;
  background: linear-gradient(135deg, var(--jk-accent-cyan), var(--jk-primary-blue-light)) !important;
  z-index: 0 !important;
  opacity: 0.3 !important;
  pointer-events: none !important;
}

html body .jkhive-book-saga-modal .jkhive-modal-header,
html body #jkhive-system-modal-container .jkhive-book-saga-modal .jkhive-modal-header,
body .jkhive-book-saga-modal .jkhive-modal-header {
  height: 25% !important;
  width: 100% !important;
  position: relative !important;
  padding: 0 !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: visible !important;
  z-index: 2 !important;
}

html body .jkhive-book-saga-modal .jkhive-modal-header-top,
html body #jkhive-system-modal-container .jkhive-book-saga-modal .jkhive-modal-header-top,
body .jkhive-book-saga-modal .jkhive-modal-header-top {
  height: 40% !important;
  width: 100% !important;
  display: flex !important;
  align-items: flex-end !important;
  justify-content: center !important;
  padding: 0 !important;
  padding-bottom: 0.5rem !important;
  position: relative !important;
  z-index: 3 !important;
  overflow: visible !important;
}

html body .jkhive-book-saga-modal .jkhive-modal-header-icon,
html body #jkhive-system-modal-container .jkhive-book-saga-modal .jkhive-modal-header-icon,
body .jkhive-book-saga-modal .jkhive-modal-header-icon {
  font-size: 2.1rem !important;
  color: var(--jk-accent-honey) !important;
  filter: drop-shadow(0 0 15px rgba(244, 196, 48, 0.8)) !important;
  line-height: 1 !important;
  position: relative !important;
  z-index: 4 !important;
}

html body .jkhive-book-saga-modal .jkhive-modal-header-bottom,
html body #jkhive-system-modal-container .jkhive-book-saga-modal .jkhive-modal-header-bottom,
body .jkhive-book-saga-modal .jkhive-modal-header-bottom {
  height: 60% !important;
  width: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0.5rem 1.5rem 0.75rem 1.5rem !important;
  box-sizing: border-box !important;
  position: relative !important;
  z-index: 3 !important;
  overflow: visible !important;
  gap: 0.25rem !important;
}

html body .jkhive-book-saga-modal .jkhive-modal-header-bottom .jkhive-modal-title,
html body #jkhive-system-modal-container .jkhive-book-saga-modal .jkhive-modal-header-bottom .jkhive-modal-title,
body .jkhive-book-saga-modal .jkhive-modal-header-bottom .jkhive-modal-title {
  font-size: 1.1rem !important;
  color: var(--jk-metal-light) !important;
  font-weight: 700 !important;
  margin: 0 !important;
  text-align: center !important;
}

html body .jkhive-book-saga-modal .jkhive-modal-header-bottom .jkhive-modal-subtitle,
html body #jkhive-system-modal-container .jkhive-book-saga-modal .jkhive-modal-header-bottom .jkhive-modal-subtitle,
body .jkhive-book-saga-modal .jkhive-modal-header-bottom .jkhive-modal-subtitle {
  font-size: 0.75rem !important;
  color: var(--jk-metal) !important;
  margin: 0 !important;
  text-align: center !important;
}

html body .jkhive-book-saga-modal .jkhive-modal-body,
html body #jkhive-system-modal-container .jkhive-book-saga-modal .jkhive-modal-body,
body .jkhive-book-saga-modal .jkhive-modal-body {
  height: 50% !important;
  width: 100% !important;
  position: relative !important;
  padding: 0.75rem 1.25rem !important;
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
  z-index: 2 !important;
}

html body .jkhive-book-saga-modal .jkhive-modal-body-content,
html body #jkhive-system-modal-container .jkhive-book-saga-modal .jkhive-modal-body-content,
body .jkhive-book-saga-modal .jkhive-modal-body-content {
  flex: 1 !important;
  width: 100% !important;
  height: 100% !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding-top: 3rem !important;
  padding-right: 0.5rem !important;
  padding-bottom: 0.5rem !important;
  box-sizing: border-box !important;
  min-height: 0 !important;
  scrollbar-width: thin !important;
  scrollbar-color: var(--jk-accent-cyan) var(--jk-tech-dark) !important;
}

html body .jkhive-book-saga-modal .jkhive-modal-body-content::-webkit-scrollbar,
html body #jkhive-system-modal-container .jkhive-book-saga-modal .jkhive-modal-body-content::-webkit-scrollbar,
body .jkhive-book-saga-modal .jkhive-modal-body-content::-webkit-scrollbar {
  width: 8px !important;
}

html body .jkhive-book-saga-modal .jkhive-modal-body-content::-webkit-scrollbar-track,
html body #jkhive-system-modal-container .jkhive-book-saga-modal .jkhive-modal-body-content::-webkit-scrollbar-track,
body .jkhive-book-saga-modal .jkhive-modal-body-content::-webkit-scrollbar-track {
  background: var(--jk-tech-dark) !important;
}

html body .jkhive-book-saga-modal .jkhive-modal-body-content::-webkit-scrollbar-thumb,
html body #jkhive-system-modal-container .jkhive-book-saga-modal .jkhive-modal-body-content::-webkit-scrollbar-thumb,
body .jkhive-book-saga-modal .jkhive-modal-body-content::-webkit-scrollbar-thumb {
  background: var(--jk-accent-cyan) !important;
  border-radius: 4px !important;
}

html body .jkhive-book-saga-modal .jkhive-modal-body-content::-webkit-scrollbar-thumb:hover,
html body #jkhive-system-modal-container .jkhive-book-saga-modal .jkhive-modal-body-content::-webkit-scrollbar-thumb:hover,
body .jkhive-book-saga-modal .jkhive-modal-body-content::-webkit-scrollbar-thumb:hover {
  background: var(--jk-primary-blue-light) !important;
}

html body .jkhive-book-saga-modal .jkhive-modal-footer,
html body #jkhive-system-modal-container .jkhive-book-saga-modal .jkhive-modal-footer,
body .jkhive-book-saga-modal .jkhive-modal-footer {
  height: 25% !important;
  width: 100% !important;
  position: relative !important;
  padding: 0 !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  background: transparent !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: visible !important;
  z-index: 2 !important;
}

/* ========================================
   MODAL DE AGREGAR/EDITAR LIBRO
   .jkhive-add-new-book
   ======================================== */
html body .jkhive-add-new-book,
html body #jkhive-system-modal-container .jkhive-add-new-book,
body .jkhive-add-new-book {
  z-index: 9999 !important;
}

html body .jkhive-add-new-book.jkhive-modal[style*="display: flex"],
html body .jkhive-add-new-book.jkhive-modal.active,
html body .jkhive-add-new-book.jkhive-modal.show,
html body #jkhive-system-modal-container .jkhive-add-new-book.jkhive-modal[style*="display: flex"],
html body #jkhive-system-modal-container .jkhive-add-new-book.jkhive-modal.active,
html body #jkhive-system-modal-container .jkhive-add-new-book.jkhive-modal.show,
body .jkhive-add-new-book.jkhive-modal[style*="display: flex"],
body .jkhive-add-new-book.jkhive-modal.active,
body .jkhive-add-new-book.jkhive-modal.show {
  display: flex !important;
  position: fixed !important;
  inset: 0 !important;
  justify-content: center !important;
  align-items: center !important;
  opacity: 1 !important;
}

html body .jkhive-add-new-book.jkhive-modal.active .jkhive-modal-overlay,
html body .jkhive-add-new-book.jkhive-modal.show .jkhive-modal-overlay,
html body #jkhive-system-modal-container .jkhive-add-new-book.jkhive-modal.active .jkhive-modal-overlay,
html body #jkhive-system-modal-container .jkhive-add-new-book.jkhive-modal.show .jkhive-modal-overlay,
body .jkhive-add-new-book.jkhive-modal.active .jkhive-modal-overlay,
body .jkhive-add-new-book.jkhive-modal.show .jkhive-modal-overlay {
  background: rgba(244, 196, 48, 0.8) !important;
  backdrop-filter: blur(10px) !important;
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  z-index: 1 !important;
  pointer-events: auto !important;
  cursor: pointer !important;
}

html body .jkhive-add-new-book.jkhive-modal.active .jkhive-modal-overlay::before,
html body .jkhive-add-new-book.jkhive-modal.show .jkhive-modal-overlay::before,
html body #jkhive-system-modal-container .jkhive-add-new-book.jkhive-modal.active .jkhive-modal-overlay::before,
html body #jkhive-system-modal-container .jkhive-add-new-book.jkhive-modal.show .jkhive-modal-overlay::before,
body .jkhive-add-new-book.jkhive-modal.active .jkhive-modal-overlay::before,
body .jkhive-add-new-book.jkhive-modal.show .jkhive-modal-overlay::before {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background-image: url('../img/honeycomb-pattern.svg') !important;
  background-size: 32px 55px !important;
  background-repeat: repeat !important;
  background-position: 0 0 !important;
  pointer-events: none !important;
  z-index: 1 !important;
  opacity: 1 !important;
  filter: brightness(0) contrast(40) !important;
}

html body .jkhive-add-new-book.jkhive-modal.active .jkhive-modal-overlay::after,
html body .jkhive-add-new-book.jkhive-modal.show .jkhive-modal-overlay::after,
html body #jkhive-system-modal-container .jkhive-add-new-book.jkhive-modal.active .jkhive-modal-overlay::after,
html body #jkhive-system-modal-container .jkhive-add-new-book.jkhive-modal.show .jkhive-modal-overlay::after,
body .jkhive-add-new-book.jkhive-modal.active .jkhive-modal-overlay::after,
body .jkhive-add-new-book.jkhive-modal.show .jkhive-modal-overlay::after {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background-image: url('../img/honeycomb-pattern.svg') !important;
  background-size: 32px 55px !important;
  background-repeat: repeat !important;
  background-position: 16px 28px !important;
  pointer-events: none !important;
  z-index: 1 !important;
  opacity: 1 !important;
  filter: brightness(0) contrast(40) !important;
}

html body .jkhive-add-new-book .jkhive-modal-content,
html body #jkhive-system-modal-container .jkhive-add-new-book .jkhive-modal-content,
body .jkhive-add-new-book .jkhive-modal-content {
  width: 90% !important;
  max-width: 900px !important;
  min-width: 0 !important;
  aspect-ratio: 1 / 1.1547 !important;
  clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%) !important;
  background: linear-gradient(135deg, var(--jk-tech-darker) 0%, var(--jk-tech-dark) 50%, var(--jk-primary-blue-darker) 100%) !important;
  border: 3px solid var(--jk-accent-cyan) !important;
  border-radius: 0 !important;
  padding: 0 !important;
  position: relative !important;
  z-index: 10 !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  margin: auto !important;
  pointer-events: auto !important;
}

html body .jkhive-add-new-book .jkhive-modal-content::before,
html body #jkhive-system-modal-container .jkhive-add-new-book .jkhive-modal-content::before,
body .jkhive-add-new-book .jkhive-modal-content::before {
  content: '' !important;
  position: absolute !important;
  inset: -4px !important;
  clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%) !important;
  background: linear-gradient(135deg, var(--jk-accent-cyan), var(--jk-primary-blue-light)) !important;
  z-index: 0 !important;
  opacity: 0.3 !important;
  pointer-events: none !important;
}

html body .jkhive-add-new-book .jkhive-modal-header,
html body #jkhive-system-modal-container .jkhive-add-new-book .jkhive-modal-header,
body .jkhive-add-new-book .jkhive-modal-header {
  height: 25% !important;
  width: 100% !important;
  position: relative !important;
  padding: 0 !important;
  margin: 0 !important;
  margin-top: 20px !important;
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: visible !important;
  z-index: 2 !important;
}

html body .jkhive-add-new-book .jkhive-modal-header-top,
html body #jkhive-system-modal-container .jkhive-add-new-book .jkhive-modal-header-top,
body .jkhive-add-new-book .jkhive-modal-header-top {
  height: 40% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding-top: 8px !important;
  padding-bottom: 0.25rem !important;
  position: relative !important;
}

html body .jkhive-add-new-book .jkhive-modal-header-icon,
html body #jkhive-system-modal-container .jkhive-add-new-book .jkhive-modal-header-icon,
body .jkhive-add-new-book .jkhive-modal-header-icon {
  font-size: 3rem !important;
  color: var(--jk-accent-honey) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  filter: drop-shadow(0 0 15px rgba(244, 196, 48, 0.8)) !important;
  position: relative !important;
  top: 8px !important;
}

html body .jkhive-add-new-book .jkhive-modal-header-bottom,
html body #jkhive-system-modal-container .jkhive-add-new-book .jkhive-modal-header-bottom,
body .jkhive-add-new-book .jkhive-modal-header-bottom {
  height: 60% !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-start !important;
  padding: 0.5rem 2rem 0.75rem !important;
  padding-top: calc(0.5rem + 8px) !important;
  text-align: center !important;
  gap: 0.5rem !important;
}

html body .jkhive-add-new-book .jkhive-modal-title,
html body #jkhive-system-modal-container .jkhive-add-new-book .jkhive-modal-title,
body .jkhive-add-new-book .jkhive-modal-title {
  font-size: 1.5rem !important;
  font-weight: 700 !important;
  color: var(--jk-accent-honey) !important;
  margin: 0 !important;
  text-shadow: 0 0 10px rgba(244, 196, 48, 0.5) !important;
}

html body .jkhive-add-new-book .jkhive-modal-body,
html body #jkhive-system-modal-container .jkhive-add-new-book .jkhive-modal-body,
body .jkhive-add-new-book .jkhive-modal-body {
  height: 50% !important;
  width: 100% !important;
  padding: 1.5rem 2rem !important;
  box-sizing: border-box !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  z-index: 2 !important;
  position: relative !important;
  margin-top: 20px !important;
}

html body .jkhive-add-new-book .jkhive-modal-body::-webkit-scrollbar,
html body #jkhive-system-modal-container .jkhive-add-new-book .jkhive-modal-body::-webkit-scrollbar,
body .jkhive-add-new-book .jkhive-modal-body::-webkit-scrollbar {
  width: 8px !important;
}

html body .jkhive-add-new-book .jkhive-modal-body::-webkit-scrollbar-track,
html body #jkhive-system-modal-container .jkhive-add-new-book .jkhive-modal-body::-webkit-scrollbar-track,
body .jkhive-add-new-book .jkhive-modal-body::-webkit-scrollbar-track {
  background: transparent !important;
}

html body .jkhive-add-new-book .jkhive-modal-body::-webkit-scrollbar-thumb,
html body #jkhive-system-modal-container .jkhive-add-new-book .jkhive-modal-body::-webkit-scrollbar-thumb,
body .jkhive-add-new-book .jkhive-modal-body::-webkit-scrollbar-thumb {
  background: var(--jk-primary-blue) !important;
  border-radius: 4px !important;
}

html body .jkhive-add-new-book .jkhive-modal-body::-webkit-scrollbar-thumb:hover,
html body #jkhive-system-modal-container .jkhive-add-new-book .jkhive-modal-body::-webkit-scrollbar-thumb:hover,
body .jkhive-add-new-book .jkhive-modal-body::-webkit-scrollbar-thumb:hover {
  background: var(--jk-primary-blue-light) !important;
}

html body .jkhive-add-new-book .jkhive-modal-footer,
html body #jkhive-system-modal-container .jkhive-add-new-book .jkhive-modal-footer,
body .jkhive-add-new-book .jkhive-modal-footer {
  height: 25% !important;
  width: 100% !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: center !important;
  padding-top: 3% !important;
  z-index: 2 !important;
  position: relative !important;
  flex-shrink: 0 !important;
}

/* Contenedor de acciones del modal */
html body .jkhive-add-new-book .jkhive-modal-footer .jkhive-modal-actions,
html body #jkhive-system-modal-container .jkhive-add-new-book .jkhive-modal-footer .jkhive-modal-actions,
body .jkhive-add-new-book .jkhive-modal-footer .jkhive-modal-actions {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 1rem !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Botones de acción en el footer del modal */
html body .jkhive-add-new-book .jkhive-modal-footer .jkhive-actionbutton-med,
html body #jkhive-system-modal-container .jkhive-add-new-book .jkhive-modal-footer .jkhive-actionbutton-med,
body .jkhive-add-new-book .jkhive-modal-footer .jkhive-actionbutton-med {
  width: 65.17px !important;
  height: calc(65.17px * 1.1547) !important;
  position: relative !important;
  margin: 0 !important;
  z-index: 1 !important;
  display: block !important;
  transform: none !important;
  overflow: visible !important;
  clip-path: none !important;
}

/* Hexágono de los botones - tamaño base y color amarillo miel inicial */
html body .jkhive-add-new-book .jkhive-modal-footer .jkhive-actionbutton-med .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-add-new-book .jkhive-modal-footer .jkhive-actionbutton-med .jkhive-hex,
body .jkhive-add-new-book .jkhive-modal-footer .jkhive-actionbutton-med .jkhive-hex {
  width: 65.17px !important;
  height: calc(65.17px * 1.1547) !important;
  background: var(--jk-accent-honey-light, #f4c430) !important;
  margin: 0 auto !important;
  border: none !important;
  box-shadow: var(--jk-shadow-lg), 0 0 20px rgba(244, 196, 48, 0.6) !important;
  clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%) !important;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
  transform-origin: center center !important;
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  pointer-events: none !important;
}

/* Hexágono interno (contenido) - 2px más pequeño */
html body .jkhive-add-new-book .jkhive-modal-footer .jkhive-actionbutton-med .jkhive-hex::after,
html body #jkhive-system-modal-container .jkhive-add-new-book .jkhive-modal-footer .jkhive-actionbutton-med .jkhive-hex::after,
body .jkhive-add-new-book .jkhive-modal-footer .jkhive-actionbutton-med .jkhive-hex::after {
  content: '' !important;
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  width: calc(65.17px - 4px) !important;
  height: calc((65.17px - 4px) * 1.1547) !important;
  background: var(--jk-tech-dark) !important;
  clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%) !important;
  z-index: 1 !important;
  pointer-events: none !important;
  transition: background 0.3s ease, transform 0.3s ease !important;
}

/* Ocultar ::before */
html body .jkhive-add-new-book .jkhive-modal-footer .jkhive-actionbutton-med .jkhive-hex::before,
html body #jkhive-system-modal-container .jkhive-add-new-book .jkhive-modal-footer .jkhive-actionbutton-med .jkhive-hex::before,
body .jkhive-add-new-book .jkhive-modal-footer .jkhive-actionbutton-med .jkhive-hex::before {
  display: none !important;
}

/* Contenido del hexágono - clase editorial */
html body .jkhive-add-new-book .jkhive-modal-footer .jkhive-actionbutton-med .jkhive-hex-content,
html body #jkhive-system-modal-container .jkhive-add-new-book .jkhive-modal-footer .jkhive-actionbutton-med .jkhive-hex-content,
body .jkhive-add-new-book .jkhive-modal-footer .jkhive-actionbutton-med .jkhive-hex-content {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  width: 100% !important;
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  z-index: 3 !important;
  padding: 0 !important;
}

html body .jkhive-add-new-book .jkhive-modal-footer .jkhive-actionbutton-med .jkhive-hex-content.jkhive-hex-content-editorial,
html body #jkhive-system-modal-container .jkhive-add-new-book .jkhive-modal-footer .jkhive-actionbutton-med .jkhive-hex-content.jkhive-hex-content-editorial,
body .jkhive-add-new-book .jkhive-modal-footer .jkhive-actionbutton-med .jkhive-hex-content.jkhive-hex-content-editorial {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
}

/* Iconos de los botones */
html body .jkhive-add-new-book .jkhive-modal-footer .jkhive-actionbutton-med .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-add-new-book .jkhive-modal-footer .jkhive-actionbutton-med .jkhive-hex-icon,
body .jkhive-add-new-book .jkhive-modal-footer .jkhive-actionbutton-med .jkhive-hex-icon {
  font-size: 1.46625rem !important;
  color: var(--jk-accent-honey-light, #f4c430) !important;
  transition: color 0.3s ease, transform 0.3s ease !important;
  z-index: 4 !important;
  position: relative !important;
}

/* Hover de los botones - escala y glow (igual que books.php) */
html body .jkhive-add-new-book .jkhive-modal-footer .jkhive-actionbutton-med:hover .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-add-new-book .jkhive-modal-footer .jkhive-actionbutton-med:hover .jkhive-hex,
body .jkhive-add-new-book .jkhive-modal-footer .jkhive-actionbutton-med:hover .jkhive-hex {
  background: var(--jk-accent-honey-light, #f4c430) !important;
  transform: scale(1.05) !important;
  box-shadow: var(--jk-shadow-lg), 0 0 30px rgba(244, 196, 48, 0.8) !important;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

html body .jkhive-add-new-book .jkhive-modal-footer .jkhive-actionbutton-med:hover .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-add-new-book .jkhive-modal-footer .jkhive-actionbutton-med:hover .jkhive-hex-icon,
body .jkhive-add-new-book .jkhive-modal-footer .jkhive-actionbutton-med:hover .jkhive-hex-icon {
  color: var(--jk-accent-honey-light, #f4c430) !important;
  transform: rotate(180deg) !important;
}

/* Botones dentro del actionbutton */
html body .jkhive-add-new-book .jkhive-modal-footer .jkhive-actionbutton-med > button,
html body #jkhive-system-modal-container .jkhive-add-new-book .jkhive-modal-footer .jkhive-actionbutton-med > button,
body .jkhive-add-new-book .jkhive-modal-footer .jkhive-actionbutton-med > button {
  background: none !important;
  border: none !important;
  padding: 0 !important;
  cursor: pointer !important;
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  position: relative !important;
  z-index: 10 !important;
}

/* ========================================
   MODAL UNIVERSAL DE FORMULARIOS
   .jkhive-form-modal
   COPIADO EXACTAMENTE DE .jkhive-book-cat-modal
   ESPECIFICIDAD MÁXIMA para asegurar que siempre se apliquen
   ======================================== */
html body .jkhive-form-modal,
html body #jkhive-system-modal-container .jkhive-form-modal,
body .jkhive-form-modal {
  position: fixed !important;
  inset: 0 !important;
  z-index: 9999 !important;
  display: none !important;
  justify-content: center !important;
  align-items: center !important;
  opacity: 0 !important;
  transition: opacity 0.3s ease !important;
}

html body .jkhive-form-modal[style*="display: flex"],
html body .jkhive-form-modal.active,
html body .jkhive-form-modal.show,
html body .jkhive-form-modal.show.active,
html body #jkhive-system-modal-container .jkhive-form-modal[style*="display: flex"],
html body #jkhive-system-modal-container .jkhive-form-modal.active,
html body #jkhive-system-modal-container .jkhive-form-modal.show,
html body #jkhive-system-modal-container .jkhive-form-modal.show.active,
body .jkhive-form-modal[style*="display: flex"],
body .jkhive-form-modal.active,
body .jkhive-form-modal.show,
body .jkhive-form-modal.show.active {
  display: flex !important;
  opacity: 1 !important;
  visibility: visible !important;
}

html body .jkhive-form-modal .jkhive-modal-overlay,
html body #jkhive-system-modal-container .jkhive-form-modal .jkhive-modal-overlay,
body .jkhive-form-modal .jkhive-modal-overlay {
  background: rgba(244, 196, 48, 0.8) !important;
  backdrop-filter: blur(10px) !important;
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  z-index: 1 !important;
  pointer-events: auto !important;
  cursor: pointer !important;
}

html body .jkhive-form-modal .jkhive-modal-overlay::before,
html body #jkhive-system-modal-container .jkhive-form-modal .jkhive-modal-overlay::before,
body .jkhive-form-modal .jkhive-modal-overlay::before {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background-image: url('../img/honeycomb-pattern.svg') !important;
  background-size: 32px 55px !important;
  background-repeat: repeat !important;
  background-position: 0 0 !important;
  pointer-events: none !important;
  z-index: 1 !important;
  opacity: 1 !important;
  filter: brightness(0) contrast(40) !important;
}

html body .jkhive-form-modal .jkhive-modal-overlay::after,
html body #jkhive-system-modal-container .jkhive-form-modal .jkhive-modal-overlay::after,
body .jkhive-form-modal .jkhive-modal-overlay::after {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background-image: url('../img/honeycomb-pattern.svg') !important;
  background-size: 32px 55px !important;
  background-repeat: repeat !important;
  background-position: 16px 28px !important;
  pointer-events: none !important;
  z-index: 1 !important;
  opacity: 1 !important;
  filter: brightness(0) contrast(40) !important;
}

/* SOBRESCRIBIR CUALQUIER ESTILO DE modals.css - ESPECIFICIDAD MÁXIMA */
html body .jkhive-form-modal .jkhive-modal-content,
html body .jkhive-form-modal.jkhive-modal .jkhive-modal-content,
html body .jkhive-form-modal.jkhive-modal.show .jkhive-modal-content,
html body .jkhive-form-modal.jkhive-modal.active .jkhive-modal-content,
html body #jkhive-system-modal-container .jkhive-form-modal .jkhive-modal-content,
html body #jkhive-system-modal-container .jkhive-form-modal.jkhive-modal .jkhive-modal-content,
html body #jkhive-system-modal-container .jkhive-form-modal.jkhive-modal.show .jkhive-modal-content,
html body #jkhive-system-modal-container .jkhive-form-modal.jkhive-modal.active .jkhive-modal-content,
body .jkhive-form-modal .jkhive-modal-content,
body .jkhive-form-modal.jkhive-modal .jkhive-modal-content,
body .jkhive-form-modal.jkhive-modal.show .jkhive-modal-content,
body .jkhive-form-modal.jkhive-modal.active .jkhive-modal-content {
  width: 90% !important;
  max-width: 700px !important;
  min-width: 0 !important;
  max-height: none !important;
  aspect-ratio: 1 / 1.1547 !important;
  clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%) !important;
  background: linear-gradient(135deg, var(--jk-tech-darker) 0%, var(--jk-tech-dark) 50%, var(--jk-primary-blue-darker) 100%) !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  position: relative !important;
  z-index: 2 !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  box-shadow: none !important;
  outline: none !important;
  animation: none !important;
  scrollbar-width: auto !important;
  -ms-overflow-style: auto !important;
}

html body .jkhive-form-modal .jkhive-modal-content::before,
html body #jkhive-system-modal-container .jkhive-form-modal .jkhive-modal-content::before,
html body .jkhive-form-modal .jkhive-modal-content::after,
html body #jkhive-system-modal-container .jkhive-form-modal .jkhive-modal-content::after,
body .jkhive-form-modal .jkhive-modal-content::before,
body .jkhive-form-modal .jkhive-modal-content::after {
  display: none !important;
  content: none !important;
}

html body .jkhive-form-modal .jkhive-modal-header,
html body #jkhive-system-modal-container .jkhive-form-modal .jkhive-modal-header,
body .jkhive-form-modal .jkhive-modal-header {
  height: 25% !important;
  width: 100% !important;
  position: relative !important;
  padding: 0 !important;
  padding-top: 20px !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: visible !important;
  z-index: 2 !important;
}

html body .jkhive-form-modal .jkhive-modal-header-top,
html body #jkhive-system-modal-container .jkhive-form-modal .jkhive-modal-header-top,
body .jkhive-form-modal .jkhive-modal-header-top {
  height: 40% !important;
  width: 100% !important;
  display: flex !important;
  align-items: flex-end !important;
  justify-content: center !important;
  padding: 0 !important;
  padding-bottom: 0.5rem !important;
  position: relative !important;
  z-index: 3 !important;
  overflow: visible !important;
}

html body .jkhive-form-modal .jkhive-modal-header-icon,
html body #jkhive-system-modal-container .jkhive-form-modal .jkhive-modal-header-icon,
body .jkhive-form-modal .jkhive-modal-header-icon {
  font-size: 2.1rem !important;
  color: var(--jk-accent-cyan) !important;
  filter: drop-shadow(0 0 15px rgba(6, 182, 212, 0.8)) !important;
  line-height: 1 !important;
  position: relative !important;
  z-index: 4 !important;
}

html body .jkhive-form-modal .jkhive-modal-header-bottom,
html body #jkhive-system-modal-container .jkhive-form-modal .jkhive-modal-header-bottom,
body .jkhive-form-modal .jkhive-modal-header-bottom {
  height: 60% !important;
  width: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0.5rem 1.5rem 0.75rem 1.5rem !important;
  box-sizing: border-box !important;
  position: relative !important;
  z-index: 3 !important;
  overflow: visible !important;
  gap: 0.25rem !important;
}

html body .jkhive-form-modal .jkhive-modal-header-bottom .jkhive-modal-title,
html body #jkhive-system-modal-container .jkhive-form-modal .jkhive-modal-header-bottom .jkhive-modal-title,
body .jkhive-form-modal .jkhive-modal-header-bottom .jkhive-modal-title {
  font-size: 1.1rem !important;
  color: var(--jk-metal-light) !important;
  font-weight: 700 !important;
  margin: 0 !important;
  text-align: center !important;
}

html body .jkhive-form-modal .jkhive-modal-header-bottom .jkhive-modal-subtitle,
html body #jkhive-system-modal-container .jkhive-form-modal .jkhive-modal-header-bottom .jkhive-modal-subtitle,
body .jkhive-form-modal .jkhive-modal-header-bottom .jkhive-modal-subtitle {
  font-size: 0.75rem !important;
  color: var(--jk-metal) !important;
  margin: 0 !important;
  text-align: center !important;
}

html body .jkhive-form-modal .jkhive-modal-body,
html body #jkhive-system-modal-container .jkhive-form-modal .jkhive-modal-body,
body .jkhive-form-modal .jkhive-modal-body {
  height: 50% !important;
  width: 100% !important;
  position: relative !important;
  padding: 0.75rem 1.25rem !important;
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
  z-index: 2 !important;
}

html body .jkhive-form-modal .jkhive-modal-body-content,
html body #jkhive-system-modal-container .jkhive-form-modal .jkhive-modal-body-content,
body .jkhive-form-modal .jkhive-modal-body-content {
  flex: 1 !important;
  width: 100% !important;
  height: 100% !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding-top: 3rem !important;
  padding-right: 0.5rem !important;
  padding-bottom: 0.5rem !important;
  box-sizing: border-box !important;
  min-height: 0 !important;
  scrollbar-width: thin !important;
  scrollbar-color: var(--jk-accent-cyan) var(--jk-tech-dark) !important;
}

html body .jkhive-form-modal .jkhive-modal-body-content::-webkit-scrollbar,
html body #jkhive-system-modal-container .jkhive-form-modal .jkhive-modal-body-content::-webkit-scrollbar,
body .jkhive-form-modal .jkhive-modal-body-content::-webkit-scrollbar {
  width: 8px !important;
}

html body .jkhive-form-modal .jkhive-modal-body-content::-webkit-scrollbar-track,
html body #jkhive-system-modal-container .jkhive-form-modal .jkhive-modal-body-content::-webkit-scrollbar-track,
body .jkhive-form-modal .jkhive-modal-body-content::-webkit-scrollbar-track {
  background: var(--jk-tech-dark) !important;
}

html body .jkhive-form-modal .jkhive-modal-body-content::-webkit-scrollbar-thumb,
html body #jkhive-system-modal-container .jkhive-form-modal .jkhive-modal-body-content::-webkit-scrollbar-thumb,
body .jkhive-form-modal .jkhive-modal-body-content::-webkit-scrollbar-thumb {
  background: var(--jk-accent-cyan) !important;
  border-radius: 4px !important;
}

html body .jkhive-form-modal .jkhive-modal-body-content::-webkit-scrollbar-thumb:hover,
html body #jkhive-system-modal-container .jkhive-form-modal .jkhive-modal-body-content::-webkit-scrollbar-thumb:hover,
body .jkhive-form-modal .jkhive-modal-body-content::-webkit-scrollbar-thumb:hover {
  background: var(--jk-primary-blue-light) !important;
}

html body .jkhive-form-modal .jkhive-modal-footer,
html body #jkhive-system-modal-container .jkhive-form-modal .jkhive-modal-footer,
body .jkhive-form-modal .jkhive-modal-footer {
  height: 25% !important;
  width: 100% !important;
  position: relative !important;
  padding: 0 !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  background: transparent !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: visible !important;
  z-index: 2 !important;
}

html body .jkhive-form-modal .jkhive-modal-footer .jkhive-modal-actions,
html body #jkhive-system-modal-container .jkhive-form-modal .jkhive-modal-footer .jkhive-modal-actions,
body .jkhive-form-modal .jkhive-modal-footer .jkhive-modal-actions {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 1rem !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Botones de acción - INMUNES A ESTILOS EXTERNOS - PRIORIDAD MÁXIMA */
html body .jkhive-form-modal .jkhive-modal-footer .jkhive-actionbutton-med,
html body #jkhive-system-modal-container .jkhive-form-modal .jkhive-modal-footer .jkhive-actionbutton-med,
body .jkhive-form-modal .jkhive-modal-footer .jkhive-actionbutton-med {
  width: 65.17px !important;
  height: calc(65.17px * 1.1547) !important;
  position: relative !important;
  margin: 0 !important;
  z-index: 1 !important;
  display: block !important;
  transform: none !important;
  overflow: visible !important;
  clip-path: none !important;
}

/* SOBRESCRIBIR CUALQUIER ESTILO DE jk-hive.css - ESPECIFICIDAD MÁXIMA */
html body .jkhive-form-modal .jkhive-modal-footer .jkhive-actionbutton-med .jkhive-hex,
html body .jkhive-form-modal.jkhive-modal .jkhive-modal-footer .jkhive-actionbutton-med .jkhive-hex,
html body .jkhive-form-modal.jkhive-modal.active .jkhive-modal-footer .jkhive-actionbutton-med .jkhive-hex,
html body .jkhive-form-modal.jkhive-modal.show .jkhive-modal-footer .jkhive-actionbutton-med .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-form-modal .jkhive-modal-footer .jkhive-actionbutton-med .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-form-modal.jkhive-modal .jkhive-modal-footer .jkhive-actionbutton-med .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-form-modal.jkhive-modal.active .jkhive-modal-footer .jkhive-actionbutton-med .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-form-modal.jkhive-modal.show .jkhive-modal-footer .jkhive-actionbutton-med .jkhive-hex,
body .jkhive-form-modal .jkhive-modal-footer .jkhive-actionbutton-med .jkhive-hex,
body .jkhive-form-modal.jkhive-modal .jkhive-modal-footer .jkhive-actionbutton-med .jkhive-hex,
body .jkhive-form-modal.jkhive-modal.active .jkhive-modal-footer .jkhive-actionbutton-med .jkhive-hex,
body .jkhive-form-modal.jkhive-modal.show .jkhive-modal-footer .jkhive-actionbutton-med .jkhive-hex {
  width: 65.17px !important;
  height: calc(65.17px * 1.1547) !important;
  background: var(--jk-accent-honey-light, #f4c430) !important;
  margin: 0 auto !important;
  border: none !important;
  box-shadow: var(--jk-shadow-lg), 0 0 20px rgba(244, 196, 48, 0.6) !important;
  clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%) !important;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
  transform-origin: center center !important;
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  pointer-events: none !important;
}

html body .jkhive-form-modal .jkhive-modal-footer .jkhive-actionbutton-med .jkhive-hex::after,
html body #jkhive-system-modal-container .jkhive-form-modal .jkhive-modal-footer .jkhive-actionbutton-med .jkhive-hex::after,
body .jkhive-form-modal .jkhive-modal-footer .jkhive-actionbutton-med .jkhive-hex::after {
  content: '' !important;
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  width: calc(65.17px - 4px) !important;
  height: calc((65.17px - 4px) * 1.1547) !important;
  background: var(--jk-tech-dark) !important;
  clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%) !important;
  z-index: 1 !important;
  pointer-events: none !important;
  transition: background 0.3s ease, transform 0.3s ease !important;
}

html body .jkhive-form-modal .jkhive-modal-footer .jkhive-actionbutton-med .jkhive-hex::before,
html body #jkhive-system-modal-container .jkhive-form-modal .jkhive-modal-footer .jkhive-actionbutton-med .jkhive-hex::before,
body .jkhive-form-modal .jkhive-modal-footer .jkhive-actionbutton-med .jkhive-hex::before {
  display: none !important;
}

html body .jkhive-form-modal .jkhive-modal-footer .jkhive-actionbutton-med .jkhive-hex-content,
html body #jkhive-system-modal-container .jkhive-form-modal .jkhive-modal-footer .jkhive-actionbutton-med .jkhive-hex-content,
body .jkhive-form-modal .jkhive-modal-footer .jkhive-actionbutton-med .jkhive-hex-content {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  width: 100% !important;
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  z-index: 3 !important;
  padding: 0 !important;
}

html body .jkhive-form-modal .jkhive-modal-footer .jkhive-actionbutton-med .jkhive-hex-content.jkhive-hex-content-editorial,
html body #jkhive-system-modal-container .jkhive-form-modal .jkhive-modal-footer .jkhive-actionbutton-med .jkhive-hex-content.jkhive-hex-content-editorial,
body .jkhive-form-modal .jkhive-modal-footer .jkhive-actionbutton-med .jkhive-hex-content.jkhive-hex-content-editorial {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
}

/* Color inicial: amarillo miel metálico para ambos botones - ESTILOS ORIGINALES */
/* Incluir tanto .jkhive-modal-actions directo como dentro de .jkhive-modal-footer */
html body .jkhive-form-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex,
html body .jkhive-form-modal .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex,
html body .jkhive-form-modal.jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex,
html body .jkhive-form-modal.jkhive-modal .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex,
html body .jkhive-form-modal.jkhive-modal.active .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex,
html body .jkhive-form-modal.jkhive-modal.active .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex,
html body .jkhive-form-modal.jkhive-modal.show .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex,
html body .jkhive-form-modal.jkhive-modal.show .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-form-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-form-modal .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-form-modal.jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-form-modal.jkhive-modal .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-form-modal.jkhive-modal.active .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-form-modal.jkhive-modal.active .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-form-modal.jkhive-modal.show .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-form-modal.jkhive-modal.show .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex,
body .jkhive-form-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex,
body .jkhive-form-modal .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex,
body .jkhive-form-modal.jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex,
body .jkhive-form-modal.jkhive-modal .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex,
body .jkhive-form-modal.jkhive-modal.active .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex,
body .jkhive-form-modal.jkhive-modal.active .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex,
body .jkhive-form-modal.jkhive-modal.show .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex,
body .jkhive-form-modal.jkhive-modal.show .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex {
  background: var(--jk-accent-honey-light, #f4c430) !important;
  border-color: var(--jk-accent-honey-light, #f4c430) !important;
  box-shadow: var(--jk-shadow-lg), 0 0 20px rgba(244, 196, 48, 0.6) !important;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

/* Posicionamiento relativo para tooltips */
html body .jkhive-form-modal .jkhive-modal-actions .jkhive-actionbutton-med button[data-tooltip],
html body #jkhive-system-modal-container .jkhive-form-modal .jkhive-modal-actions .jkhive-actionbutton-med button[data-tooltip],
body .jkhive-form-modal .jkhive-modal-actions .jkhive-actionbutton-med button[data-tooltip] {
  position: relative !important;
}

html body .jkhive-form-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex-icon,
html body .jkhive-form-modal .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex-icon,
html body .jkhive-form-modal.jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex-icon,
html body .jkhive-form-modal.jkhive-modal .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex-icon,
html body .jkhive-form-modal.jkhive-modal.active .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex-icon,
html body .jkhive-form-modal.jkhive-modal.active .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex-icon,
html body .jkhive-form-modal.jkhive-modal.show .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex-icon,
html body .jkhive-form-modal.jkhive-modal.show .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-form-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-form-modal .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-form-modal.jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-form-modal.jkhive-modal .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-form-modal.jkhive-modal.active .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-form-modal.jkhive-modal.active .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-form-modal.jkhive-modal.show .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-form-modal.jkhive-modal.show .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex-icon,
body .jkhive-form-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex-icon,
body .jkhive-form-modal .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex-icon,
body .jkhive-form-modal.jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex-icon,
body .jkhive-form-modal.jkhive-modal .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex-icon,
body .jkhive-form-modal.jkhive-modal.active .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex-icon,
body .jkhive-form-modal.jkhive-modal.active .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex-icon,
body .jkhive-form-modal.jkhive-modal.show .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex-icon,
body .jkhive-form-modal.jkhive-modal.show .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex-icon {
  color: #ffffff !important;
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
  font-size: 1.46625rem !important; /* 1.275rem * 1.15 = Agrandar 15% */
}

/* Ocultar textos */
html body .jkhive-form-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex-text,
html body #jkhive-system-modal-container .jkhive-form-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex-text,
body .jkhive-form-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex-text {
  display: none !important;
}

/* ANULAR la regla general de jk-hive.css que convierte botones amarillos a cyan en hover */
html body .jkhive-form-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body .jkhive-form-modal.jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body .jkhive-form-modal.jkhive-modal.active .jkhive-modal-actions .jkhive-actionbutton-med:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body .jkhive-form-modal.jkhive-modal.show .jkhive-modal-actions .jkhive-actionbutton-med:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body #jkhive-system-modal-container .jkhive-form-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body #jkhive-system-modal-container .jkhive-form-modal.jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body #jkhive-system-modal-container .jkhive-form-modal.jkhive-modal.active .jkhive-modal-actions .jkhive-actionbutton-med:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body #jkhive-system-modal-container .jkhive-form-modal.jkhive-modal.show .jkhive-modal-actions .jkhive-actionbutton-med:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
body .jkhive-form-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
body .jkhive-form-modal.jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
body .jkhive-form-modal.jkhive-modal.active .jkhive-modal-actions .jkhive-actionbutton-med:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
body .jkhive-form-modal.jkhive-modal.show .jkhive-modal-actions .jkhive-actionbutton-med:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green) {
  /* NO aplicar el estilo cyan general - los estilos específicos se aplicarán después */
  background: var(--jk-accent-honey-light, #f4c430) !important;
  border-color: var(--jk-accent-honey-light, #f4c430) !important;
  transform: scale(1) !important;
  box-shadow: var(--jk-shadow-lg), 0 0 20px rgba(244, 196, 48, 0.6) !important;
}

/* Hover: Cancelar (botón izquierda con type="button") - Rojo metálico brillante */
html body .jkhive-form-modal .jkhive-modal-actions .jkhive-actionbutton-med button[type="button"]:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body .jkhive-form-modal .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med button[type="button"]:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body .jkhive-form-modal.jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med button[type="button"]:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body .jkhive-form-modal.jkhive-modal .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med button[type="button"]:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body .jkhive-form-modal.jkhive-modal.active .jkhive-modal-actions .jkhive-actionbutton-med button[type="button"]:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body .jkhive-form-modal.jkhive-modal.active .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med button[type="button"]:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body .jkhive-form-modal.jkhive-modal.show .jkhive-modal-actions .jkhive-actionbutton-med button[type="button"]:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body .jkhive-form-modal.jkhive-modal.show .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med button[type="button"]:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body .jkhive-form-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="button"] .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body .jkhive-form-modal .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="button"] .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body .jkhive-form-modal.jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="button"] .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body .jkhive-form-modal.jkhive-modal .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="button"] .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body .jkhive-form-modal.jkhive-modal.active .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="button"] .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body .jkhive-form-modal.jkhive-modal.active .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="button"] .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body .jkhive-form-modal.jkhive-modal.show .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="button"] .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body .jkhive-form-modal.jkhive-modal.show .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="button"] .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body #jkhive-system-modal-container .jkhive-form-modal .jkhive-modal-actions .jkhive-actionbutton-med button[type="button"]:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body #jkhive-system-modal-container .jkhive-form-modal.jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med button[type="button"]:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body #jkhive-system-modal-container .jkhive-form-modal.jkhive-modal.active .jkhive-modal-actions .jkhive-actionbutton-med button[type="button"]:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body #jkhive-system-modal-container .jkhive-form-modal.jkhive-modal.show .jkhive-modal-actions .jkhive-actionbutton-med button[type="button"]:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body #jkhive-system-modal-container .jkhive-form-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="button"] .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body #jkhive-system-modal-container .jkhive-form-modal.jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="button"] .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body #jkhive-system-modal-container .jkhive-form-modal.jkhive-modal.active .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="button"] .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body #jkhive-system-modal-container .jkhive-form-modal.jkhive-modal.show .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="button"] .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
body .jkhive-form-modal .jkhive-modal-actions .jkhive-actionbutton-med button[type="button"]:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
body .jkhive-form-modal.jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med button[type="button"]:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
body .jkhive-form-modal.jkhive-modal.active .jkhive-modal-actions .jkhive-actionbutton-med button[type="button"]:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
body .jkhive-form-modal.jkhive-modal.show .jkhive-modal-actions .jkhive-actionbutton-med button[type="button"]:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
body .jkhive-form-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="button"] .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
body .jkhive-form-modal.jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="button"] .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
body .jkhive-form-modal.jkhive-modal.active .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="button"] .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
body .jkhive-form-modal.jkhive-modal.show .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="button"] .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
body .jkhive-form-modal.jkhive-modal.show .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="button"] .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green) {
  background: linear-gradient(135deg, #ff3366, #cc0033, #ff3366) !important;
  border-color: #ff3366 !important;
  box-shadow: 
    0 0 20px rgba(255, 51, 102, 0.8),
    0 0 40px rgba(255, 51, 102, 0.6),
    inset 0 0 20px rgba(255, 255, 255, 0.3) !important;
  filter: brightness(1.2) drop-shadow(0 0 15px rgba(255, 51, 102, 0.9)) !important;
  transform: scale(1.05) !important;
}

/* Hover: Cancelar - Rotar ícono 180° */
html body .jkhive-form-modal .jkhive-modal-actions .jkhive-actionbutton-med button[type="button"]:hover .jkhive-hex-icon,
html body .jkhive-form-modal .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med button[type="button"]:hover .jkhive-hex-icon,
html body .jkhive-form-modal.jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med button[type="button"]:hover .jkhive-hex-icon,
html body .jkhive-form-modal.jkhive-modal .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med button[type="button"]:hover .jkhive-hex-icon,
html body .jkhive-form-modal.jkhive-modal.active .jkhive-modal-actions .jkhive-actionbutton-med button[type="button"]:hover .jkhive-hex-icon,
html body .jkhive-form-modal.jkhive-modal.active .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med button[type="button"]:hover .jkhive-hex-icon,
html body .jkhive-form-modal.jkhive-modal.show .jkhive-modal-actions .jkhive-actionbutton-med button[type="button"]:hover .jkhive-hex-icon,
html body .jkhive-form-modal.jkhive-modal.show .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med button[type="button"]:hover .jkhive-hex-icon,
html body .jkhive-form-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="button"] .jkhive-hex-icon,
html body .jkhive-form-modal .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="button"] .jkhive-hex-icon,
html body .jkhive-form-modal.jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="button"] .jkhive-hex-icon,
html body .jkhive-form-modal.jkhive-modal .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="button"] .jkhive-hex-icon,
html body .jkhive-form-modal.jkhive-modal.active .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="button"] .jkhive-hex-icon,
html body .jkhive-form-modal.jkhive-modal.active .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="button"] .jkhive-hex-icon,
html body .jkhive-form-modal.jkhive-modal.show .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="button"] .jkhive-hex-icon,
html body .jkhive-form-modal.jkhive-modal.show .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="button"] .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-form-modal .jkhive-modal-actions .jkhive-actionbutton-med button[type="button"]:hover .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-form-modal .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med button[type="button"]:hover .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-form-modal.jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med button[type="button"]:hover .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-form-modal.jkhive-modal .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med button[type="button"]:hover .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-form-modal.jkhive-modal.active .jkhive-modal-actions .jkhive-actionbutton-med button[type="button"]:hover .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-form-modal.jkhive-modal.active .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med button[type="button"]:hover .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-form-modal.jkhive-modal.show .jkhive-modal-actions .jkhive-actionbutton-med button[type="button"]:hover .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-form-modal.jkhive-modal.show .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med button[type="button"]:hover .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-form-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="button"] .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-form-modal .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="button"] .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-form-modal.jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="button"] .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-form-modal.jkhive-modal .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="button"] .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-form-modal.jkhive-modal.active .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="button"] .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-form-modal.jkhive-modal.active .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="button"] .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-form-modal.jkhive-modal.show .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="button"] .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-form-modal.jkhive-modal.show .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="button"] .jkhive-hex-icon,
body .jkhive-form-modal .jkhive-modal-actions .jkhive-actionbutton-med button[type="button"]:hover .jkhive-hex-icon,
body .jkhive-form-modal .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med button[type="button"]:hover .jkhive-hex-icon,
body .jkhive-form-modal.jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med button[type="button"]:hover .jkhive-hex-icon,
body .jkhive-form-modal.jkhive-modal .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med button[type="button"]:hover .jkhive-hex-icon,
body .jkhive-form-modal.jkhive-modal.active .jkhive-modal-actions .jkhive-actionbutton-med button[type="button"]:hover .jkhive-hex-icon,
body .jkhive-form-modal.jkhive-modal.active .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med button[type="button"]:hover .jkhive-hex-icon,
body .jkhive-form-modal.jkhive-modal.show .jkhive-modal-actions .jkhive-actionbutton-med button[type="button"]:hover .jkhive-hex-icon,
body .jkhive-form-modal.jkhive-modal.show .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med button[type="button"]:hover .jkhive-hex-icon,
body .jkhive-form-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="button"] .jkhive-hex-icon,
body .jkhive-form-modal .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="button"] .jkhive-hex-icon,
body .jkhive-form-modal.jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="button"] .jkhive-hex-icon,
body .jkhive-form-modal.jkhive-modal .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="button"] .jkhive-hex-icon,
body .jkhive-form-modal.jkhive-modal.active .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="button"] .jkhive-hex-icon,
body .jkhive-form-modal.jkhive-modal.active .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="button"] .jkhive-hex-icon,
body .jkhive-form-modal.jkhive-modal.show .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="button"] .jkhive-hex-icon,
body .jkhive-form-modal.jkhive-modal.show .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="button"] .jkhive-hex-icon {
  color: #ffffff !important;
  transform: rotate(180deg) !important; /* Gira 180° */
}

/* Hover: Guardar (botón derecha con type="submit") - Verde metálico brillante */
html body .jkhive-form-modal .jkhive-modal-actions .jkhive-actionbutton-med button[type="submit"]:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body .jkhive-form-modal .jkhive-modal-footer .jkhive-modal-actions .jkhive-actionbutton-med button[type="submit"]:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body .jkhive-form-modal.jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med button[type="submit"]:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body .jkhive-form-modal.jkhive-modal.active .jkhive-modal-actions .jkhive-actionbutton-med button[type="submit"]:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body .jkhive-form-modal.jkhive-modal.show .jkhive-modal-actions .jkhive-actionbutton-med button[type="submit"]:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body .jkhive-form-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="submit"] .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body .jkhive-form-modal.jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="submit"] .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body .jkhive-form-modal.jkhive-modal.active .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="submit"] .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body .jkhive-form-modal.jkhive-modal.show .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="submit"] .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body #jkhive-system-modal-container .jkhive-form-modal .jkhive-modal-actions .jkhive-actionbutton-med button[type="submit"]:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body #jkhive-system-modal-container .jkhive-form-modal.jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med button[type="submit"]:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body #jkhive-system-modal-container .jkhive-form-modal.jkhive-modal.active .jkhive-modal-actions .jkhive-actionbutton-med button[type="submit"]:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body #jkhive-system-modal-container .jkhive-form-modal.jkhive-modal.show .jkhive-modal-actions .jkhive-actionbutton-med button[type="submit"]:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body #jkhive-system-modal-container .jkhive-form-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="submit"] .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body #jkhive-system-modal-container .jkhive-form-modal.jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="submit"] .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body #jkhive-system-modal-container .jkhive-form-modal.jkhive-modal.active .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="submit"] .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body #jkhive-system-modal-container .jkhive-form-modal.jkhive-modal.show .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="submit"] .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
body .jkhive-form-modal .jkhive-modal-actions .jkhive-actionbutton-med button[type="submit"]:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
body .jkhive-form-modal.jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med button[type="submit"]:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
body .jkhive-form-modal.jkhive-modal.active .jkhive-modal-actions .jkhive-actionbutton-med button[type="submit"]:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
body .jkhive-form-modal.jkhive-modal.show .jkhive-modal-actions .jkhive-actionbutton-med button[type="submit"]:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
body .jkhive-form-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="submit"] .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
body .jkhive-form-modal.jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="submit"] .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
body .jkhive-form-modal.jkhive-modal.active .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="submit"] .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
body .jkhive-form-modal.jkhive-modal.show .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="submit"] .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green) {
  background: linear-gradient(135deg, #00ff88, #00cc6a, #00ff88) !important;
  border-color: #00ff88 !important;
  box-shadow: 
    0 0 20px rgba(0, 255, 136, 0.8),
    0 0 40px rgba(0, 255, 136, 0.6),
    inset 0 0 20px rgba(255, 255, 255, 0.3) !important;
  filter: brightness(1.2) drop-shadow(0 0 15px rgba(0, 255, 136, 0.9)) !important;
  transform: scale(1.05) !important;
}

/* Hover: Guardar - Voltear ícono 180° sobre su eje */
html body .jkhive-form-modal .jkhive-modal-actions .jkhive-actionbutton-med button[type="submit"]:hover .jkhive-hex-icon,
html body .jkhive-form-modal.jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med button[type="submit"]:hover .jkhive-hex-icon,
html body .jkhive-form-modal.jkhive-modal.active .jkhive-modal-actions .jkhive-actionbutton-med button[type="submit"]:hover .jkhive-hex-icon,
html body .jkhive-form-modal.jkhive-modal.show .jkhive-modal-actions .jkhive-actionbutton-med button[type="submit"]:hover .jkhive-hex-icon,
html body .jkhive-form-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="submit"] .jkhive-hex-icon,
html body .jkhive-form-modal.jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="submit"] .jkhive-hex-icon,
html body .jkhive-form-modal.jkhive-modal.active .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="submit"] .jkhive-hex-icon,
html body .jkhive-form-modal.jkhive-modal.show .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="submit"] .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-form-modal .jkhive-modal-actions .jkhive-actionbutton-med button[type="submit"]:hover .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-form-modal.jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med button[type="submit"]:hover .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-form-modal.jkhive-modal.active .jkhive-modal-actions .jkhive-actionbutton-med button[type="submit"]:hover .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-form-modal.jkhive-modal.show .jkhive-modal-actions .jkhive-actionbutton-med button[type="submit"]:hover .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-form-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="submit"] .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-form-modal.jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="submit"] .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-form-modal.jkhive-modal.active .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="submit"] .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-form-modal.jkhive-modal.show .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="submit"] .jkhive-hex-icon,
body .jkhive-form-modal .jkhive-modal-actions .jkhive-actionbutton-med button[type="submit"]:hover .jkhive-hex-icon,
body .jkhive-form-modal.jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med button[type="submit"]:hover .jkhive-hex-icon,
body .jkhive-form-modal.jkhive-modal.active .jkhive-modal-actions .jkhive-actionbutton-med button[type="submit"]:hover .jkhive-hex-icon,
body .jkhive-form-modal.jkhive-modal.show .jkhive-modal-actions .jkhive-actionbutton-med button[type="submit"]:hover .jkhive-hex-icon,
body .jkhive-form-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="submit"] .jkhive-hex-icon,
body .jkhive-form-modal.jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="submit"] .jkhive-hex-icon,
body .jkhive-form-modal.jkhive-modal.active .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="submit"] .jkhive-hex-icon,
body .jkhive-form-modal.jkhive-modal.show .jkhive-modal-actions .jkhive-actionbutton-med:hover button[type="submit"] .jkhive-hex-icon {
  color: #ffffff !important;
  transform: scaleX(-1) !important; /* Voltea 180° sobre su eje */
}

/* Botón cerrar - debe estar visible y funcionar */
html body .jkhive-form-modal .jkhive-modal-close,
html body #jkhive-system-modal-container .jkhive-form-modal .jkhive-modal-close,
body .jkhive-form-modal .jkhive-modal-close {
  display: block !important;
  position: absolute !important;
  top: 0.75rem !important;
  right: 0.75rem !important;
  z-index: 100 !important;
  pointer-events: auto !important;
  cursor: pointer !important;
  background: rgba(239, 68, 68, 0.2) !important;
  border: 2px solid rgb(239, 68, 68) !important;
  color: rgb(239, 68, 68) !important;
  width: 40px !important;
  height: 40px !important;
  border-radius: 50% !important;
  font-size: 1.5rem !important;
  line-height: 1 !important;
  text-align: center !important;
}

html body .jkhive-form-modal .jkhive-modal-footer .jkhive-actionbutton-med > button,
html body #jkhive-system-modal-container .jkhive-form-modal .jkhive-modal-footer .jkhive-actionbutton-med > button,
body .jkhive-form-modal .jkhive-modal-footer .jkhive-actionbutton-med > button {
  background: none !important;
  border: none !important;
  padding: 0 !important;
  cursor: pointer !important;
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  position: relative !important;
  z-index: 10 !important;
}

html body .jkhive-form-modal .jkhive-modal-footer .jkhive-actionbutton-med > button,
html body #jkhive-system-modal-container .jkhive-form-modal .jkhive-modal-footer .jkhive-actionbutton-med > button,
body .jkhive-form-modal .jkhive-modal-footer .jkhive-actionbutton-med > button {
  background: none !important;
  border: none !important;
  padding: 0 !important;
  cursor: pointer !important;
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  position: relative !important;
  z-index: 10 !important;
}

/* ========================================
   MODAL DE PERFIL PROFESIONAL
   #modal-profile (usa .jkhive-book-cat-modal)
   Solo estilos específicos adicionales
   ======================================== */
html body #modal-profile.jkhive-book-cat-modal .jkhive-modal-description,
html body #jkhive-system-modal-container #modal-profile.jkhive-book-cat-modal .jkhive-modal-description,
body #modal-profile.jkhive-book-cat-modal .jkhive-modal-description {
  color: var(--jk-metal) !important;
  font-size: 0.9rem !important;
  line-height: 1.6 !important;
  margin-bottom: 1rem !important;
}

html body #modal-profile.jkhive-book-cat-modal .jkhive-modal-footer,
html body #jkhive-system-modal-container #modal-profile.jkhive-book-cat-modal .jkhive-modal-footer,
body #modal-profile.jkhive-book-cat-modal .jkhive-modal-footer {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
}

/* ========================================
   MODAL DE ALERTAS DE CONFIRMACIÓN
   #jkhive-system-modal-container
   ======================================== */
html body #jkhive-system-modal-container,
body #jkhive-system-modal-container {
  position: static !important;
  z-index: auto !important;
  pointer-events: none !important;
}

html body #jkhive-system-modal-container .jkhive-modal,
body #jkhive-system-modal-container .jkhive-modal {
  position: fixed !important;
  inset: 0 !important;
  z-index: 10001 !important;
  pointer-events: auto !important;
  display: none !important;
  justify-content: center !important;
  align-items: center !important;
  opacity: 0 !important;
  transition: opacity 0.3s ease !important;
}

html body #jkhive-system-modal-container .jkhive-modal.show,
html body #jkhive-system-modal-container .jkhive-modal.active,
html body #jkhive-system-modal-container .jkhive-modal.show.active,
body #jkhive-system-modal-container .jkhive-modal.show,
body #jkhive-system-modal-container .jkhive-modal.active {
  display: flex !important;
  opacity: 1 !important;
  visibility: visible !important;
}

html body #jkhive-system-modal-container .jkhive-modal-overlay,
body #jkhive-system-modal-container .jkhive-modal-overlay {
  z-index: 10000 !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

html body #jkhive-system-modal-container .jkhive-modal-content,
body #jkhive-system-modal-container .jkhive-modal-content {
  z-index: 10001 !important;
  text-align: center !important;
}

html body #jkhive-system-modal-container .jkhive-modal-icon,
body #jkhive-system-modal-container .jkhive-modal-icon {
  font-size: 4rem !important;
  margin-bottom: 1.5rem !important;
  filter: drop-shadow(0 0 20px currentColor) !important;
}

html body #jkhive-system-modal-container .jkhive-modal-title,
body #jkhive-system-modal-container .jkhive-modal-title {
  font-size: 2rem !important;
  margin-bottom: 1rem !important;
}

html body #jkhive-system-modal-container .jkhive-modal-description,
body #jkhive-system-modal-container .jkhive-modal-description {
  font-size: 1.1rem !important;
  line-height: 1.6 !important;
  color: var(--jk-metal-light) !important;
  margin-bottom: 0 !important;
}

/* ========================================
   FORMULARIOS DENTRO DE MODALES
   ======================================== */
html body .jkhive-book-cat-modal .jkhive-form-group,
html body .jkhive-book-ref-modal .jkhive-form-group,
html body .jkhive-book-saga-modal .jkhive-form-group,
html body .jkhive-add-new-book .jkhive-form-group,
html body #jkhive-system-modal-container .jkhive-book-cat-modal .jkhive-form-group,
html body #jkhive-system-modal-container .jkhive-book-ref-modal .jkhive-form-group,
html body #jkhive-system-modal-container .jkhive-book-saga-modal .jkhive-form-group,
html body #jkhive-system-modal-container .jkhive-add-new-book .jkhive-form-group,
body .jkhive-book-cat-modal .jkhive-form-group,
body .jkhive-book-ref-modal .jkhive-form-group,
body .jkhive-book-saga-modal .jkhive-form-group,
body .jkhive-add-new-book .jkhive-form-group {
  margin-bottom: 0 !important;
  display: flex !important;
  flex-direction: column !important;
}

html body .jkhive-book-cat-modal .jkhive-form-label-wrapper,
html body .jkhive-book-ref-modal .jkhive-form-label-wrapper,
html body .jkhive-book-saga-modal .jkhive-form-label-wrapper,
html body .jkhive-add-new-book .jkhive-form-label-wrapper,
html body #jkhive-system-modal-container .jkhive-book-cat-modal .jkhive-form-label-wrapper,
html body #jkhive-system-modal-container .jkhive-book-ref-modal .jkhive-form-label-wrapper,
html body #jkhive-system-modal-container .jkhive-book-saga-modal .jkhive-form-label-wrapper,
html body #jkhive-system-modal-container .jkhive-add-new-book .jkhive-form-label-wrapper,
body .jkhive-book-cat-modal .jkhive-form-label-wrapper,
body .jkhive-book-ref-modal .jkhive-form-label-wrapper,
body .jkhive-book-saga-modal .jkhive-form-label-wrapper,
body .jkhive-add-new-book .jkhive-form-label-wrapper {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  margin-bottom: 0.35rem !important;
  gap: 0.5rem !important;
  width: 100% !important;
}

html body .jkhive-book-cat-modal .jkhive-form-label,
html body .jkhive-book-ref-modal .jkhive-form-label,
html body .jkhive-book-saga-modal .jkhive-form-label,
html body .jkhive-add-new-book .jkhive-form-label,
html body #jkhive-system-modal-container .jkhive-book-cat-modal .jkhive-form-label,
html body #jkhive-system-modal-container .jkhive-book-ref-modal .jkhive-form-label,
html body #jkhive-system-modal-container .jkhive-book-saga-modal .jkhive-form-label,
html body #jkhive-system-modal-container .jkhive-add-new-book .jkhive-form-label,
body .jkhive-book-cat-modal .jkhive-form-label,
body .jkhive-book-ref-modal .jkhive-form-label,
body .jkhive-book-saga-modal .jkhive-form-label,
body .jkhive-add-new-book .jkhive-form-label {
  font-size: 0.85rem !important;
  margin-bottom: 0 !important;
  color: var(--jk-metal-light) !important;
  flex-shrink: 0 !important;
  white-space: nowrap !important;
}

html body .jkhive-book-cat-modal .jkhive-form-input,
html body .jkhive-book-ref-modal .jkhive-form-input,
html body .jkhive-book-saga-modal .jkhive-form-input,
html body .jkhive-add-new-book .jkhive-form-input,
html body #jkhive-system-modal-container .jkhive-book-cat-modal .jkhive-form-input,
html body #jkhive-system-modal-container .jkhive-book-ref-modal .jkhive-form-input,
html body #jkhive-system-modal-container .jkhive-book-saga-modal .jkhive-form-input,
html body #jkhive-system-modal-container .jkhive-add-new-book .jkhive-form-input,
body .jkhive-book-cat-modal .jkhive-form-input,
body .jkhive-book-ref-modal .jkhive-form-input,
body .jkhive-book-saga-modal .jkhive-form-input,
body .jkhive-add-new-book .jkhive-form-input {
  padding: 0.5rem 0.75rem !important;
  font-size: 0.9rem !important;
  margin-bottom: 0 !important;
  width: 100% !important;
  box-sizing: border-box !important;
  background: rgba(15, 23, 42, 0.4) !important;
  color: var(--jk-text-primary, rgba(255, 255, 255, 0.95)) !important;
  border: 1px solid rgba(14, 165, 233, 0.2) !important;
  border-radius: 0.375rem !important;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
  font-family: inherit !important;
}

html body .jkhive-book-cat-modal .jkhive-form-input:focus,
html body .jkhive-book-ref-modal .jkhive-form-input:focus,
html body .jkhive-book-saga-modal .jkhive-form-input:focus,
html body .jkhive-add-new-book .jkhive-form-input:focus,
html body #jkhive-system-modal-container .jkhive-book-cat-modal .jkhive-form-input:focus,
html body #jkhive-system-modal-container .jkhive-book-ref-modal .jkhive-form-input:focus,
html body #jkhive-system-modal-container .jkhive-book-saga-modal .jkhive-form-input:focus,
html body #jkhive-system-modal-container .jkhive-add-new-book .jkhive-form-input:focus,
body .jkhive-book-cat-modal .jkhive-form-input:focus,
body .jkhive-book-ref-modal .jkhive-form-input:focus,
body .jkhive-book-saga-modal .jkhive-form-input:focus,
body .jkhive-add-new-book .jkhive-form-input:focus {
  outline: none !important;
  border-color: var(--jk-accent-cyan) !important;
  background: rgba(15, 23, 42, 0.6) !important;
  box-shadow: 0 0 0 3px rgba(14, 165, 233, 0.1), 0 0 15px rgba(14, 165, 233, 0.2) !important;
}

html body .jkhive-book-cat-modal textarea.jkhive-form-input,
html body .jkhive-book-ref-modal textarea.jkhive-form-input,
html body .jkhive-book-saga-modal textarea.jkhive-form-input,
html body .jkhive-add-new-book textarea.jkhive-form-input,
html body #jkhive-system-modal-container .jkhive-book-cat-modal textarea.jkhive-form-input,
html body #jkhive-system-modal-container .jkhive-book-ref-modal textarea.jkhive-form-input,
html body #jkhive-system-modal-container .jkhive-book-saga-modal textarea.jkhive-form-input,
html body #jkhive-system-modal-container .jkhive-add-new-book textarea.jkhive-form-input,
body .jkhive-book-cat-modal textarea.jkhive-form-input,
body .jkhive-book-ref-modal textarea.jkhive-form-input,
body .jkhive-book-saga-modal textarea.jkhive-form-input,
body .jkhive-add-new-book textarea.jkhive-form-input {
  min-height: 60px !important;
  resize: vertical !important;
  font-family: inherit !important;
  line-height: 1.6 !important;
}

html body .jkhive-book-cat-modal .jkhive-form-group small,
html body .jkhive-book-ref-modal .jkhive-form-group small,
html body .jkhive-book-saga-modal .jkhive-form-group small,
html body .jkhive-add-new-book .jkhive-form-group small,
html body #jkhive-system-modal-container .jkhive-book-cat-modal .jkhive-form-group small,
html body #jkhive-system-modal-container .jkhive-book-ref-modal .jkhive-form-group small,
html body #jkhive-system-modal-container .jkhive-book-saga-modal .jkhive-form-group small,
html body #jkhive-system-modal-container .jkhive-add-new-book .jkhive-form-group small,
body .jkhive-book-cat-modal .jkhive-form-group small,
body .jkhive-book-ref-modal .jkhive-form-group small,
body .jkhive-book-saga-modal .jkhive-form-group small,
body .jkhive-add-new-book .jkhive-form-group small {
  font-size: 0.7rem !important;
  color: var(--jk-metal) !important;
  display: inline-block !important;
  margin: 0 !important;
  text-align: right !important;
  flex-shrink: 1 !important;
  white-space: normal !important;
  line-height: 1.2 !important;
}

/* ========================================
   RESPONSIVE
   ======================================== */
@media (max-width: 768px) {
  html body .jkhive-book-cat-modal .jkhive-modal-content,
  html body .jkhive-book-ref-modal .jkhive-modal-content,
  html body .jkhive-book-saga-modal .jkhive-modal-content,
  html body .jkhive-add-new-book .jkhive-modal-content,
  html body .jkhive-form-modal .jkhive-modal-content,
  html body #jkhive-system-modal-container .jkhive-book-cat-modal .jkhive-modal-content,
  html body #jkhive-system-modal-container .jkhive-book-ref-modal .jkhive-modal-content,
  html body #jkhive-system-modal-container .jkhive-book-saga-modal .jkhive-modal-content,
  html body #jkhive-system-modal-container .jkhive-add-new-book .jkhive-modal-content,
  html body #jkhive-system-modal-container .jkhive-form-modal .jkhive-modal-content,
  body .jkhive-book-cat-modal .jkhive-modal-content,
  body .jkhive-book-ref-modal .jkhive-modal-content,
  body .jkhive-book-saga-modal .jkhive-modal-content,
  body .jkhive-add-new-book .jkhive-modal-content,
  body .jkhive-form-modal .jkhive-modal-content {
    width: 95% !important;
  }
  
  html body .jkhive-book-cat-modal .jkhive-modal-header-icon,
  html body .jkhive-book-ref-modal .jkhive-modal-header-icon,
  html body .jkhive-book-ref-modal .jkhive-modal-icon,
  html body .jkhive-book-saga-modal .jkhive-modal-header-icon,
  html body .jkhive-add-new-book .jkhive-modal-header-icon,
  html body .jkhive-form-modal .jkhive-modal-header-icon,
  html body #jkhive-system-modal-container .jkhive-book-cat-modal .jkhive-modal-header-icon,
  html body #jkhive-system-modal-container .jkhive-book-ref-modal .jkhive-modal-header-icon,
  html body #jkhive-system-modal-container .jkhive-book-ref-modal .jkhive-modal-icon,
  html body #jkhive-system-modal-container .jkhive-book-saga-modal .jkhive-modal-header-icon,
  html body #jkhive-system-modal-container .jkhive-add-new-book .jkhive-modal-header-icon,
  html body #jkhive-system-modal-container .jkhive-form-modal .jkhive-modal-header-icon,
  body .jkhive-book-cat-modal .jkhive-modal-header-icon,
  body .jkhive-book-ref-modal .jkhive-modal-header-icon,
  body .jkhive-book-ref-modal .jkhive-modal-icon,
  body .jkhive-book-saga-modal .jkhive-modal-header-icon,
  body .jkhive-add-new-book .jkhive-modal-header-icon,
  body .jkhive-form-modal .jkhive-modal-header-icon {
    font-size: 1.8rem !important;
  }
  
  html body .jkhive-book-cat-modal .jkhive-modal-header-bottom .jkhive-modal-title,
  html body .jkhive-book-ref-modal .jkhive-modal-header-bottom .jkhive-modal-title,
  html body .jkhive-book-ref-modal .jkhive-modal-title,
  html body .jkhive-book-saga-modal .jkhive-modal-header-bottom .jkhive-modal-title,
  html body .jkhive-add-new-book .jkhive-modal-title,
  html body .jkhive-form-modal .jkhive-modal-header-bottom .jkhive-modal-title,
  html body #jkhive-system-modal-container .jkhive-book-cat-modal .jkhive-modal-header-bottom .jkhive-modal-title,
  html body #jkhive-system-modal-container .jkhive-book-ref-modal .jkhive-modal-header-bottom .jkhive-modal-title,
  html body #jkhive-system-modal-container .jkhive-book-ref-modal .jkhive-modal-title,
  html body #jkhive-system-modal-container .jkhive-book-saga-modal .jkhive-modal-header-bottom .jkhive-modal-title,
  html body #jkhive-system-modal-container .jkhive-add-new-book .jkhive-modal-title,
  html body #jkhive-system-modal-container .jkhive-form-modal .jkhive-modal-header-bottom .jkhive-modal-title,
  body .jkhive-book-cat-modal .jkhive-modal-header-bottom .jkhive-modal-title,
  body .jkhive-book-ref-modal .jkhive-modal-header-bottom .jkhive-modal-title,
  body .jkhive-book-ref-modal .jkhive-modal-title,
  body .jkhive-book-saga-modal .jkhive-modal-header-bottom .jkhive-modal-title,
  body .jkhive-add-new-book .jkhive-modal-title,
  body .jkhive-form-modal .jkhive-modal-header-bottom .jkhive-modal-title {
    font-size: 0.95rem !important;
  }
  
  html body .jkhive-book-cat-modal .jkhive-modal-header-bottom .jkhive-modal-subtitle,
  html body .jkhive-book-ref-modal .jkhive-modal-header-bottom .jkhive-modal-subtitle,
  html body .jkhive-book-ref-modal .jkhive-modal-subtitle,
  html body .jkhive-book-saga-modal .jkhive-modal-header-bottom .jkhive-modal-subtitle,
  html body #jkhive-system-modal-container .jkhive-book-cat-modal .jkhive-modal-header-bottom .jkhive-modal-subtitle,
  html body #jkhive-system-modal-container .jkhive-book-ref-modal .jkhive-modal-header-bottom .jkhive-modal-subtitle,
  html body #jkhive-system-modal-container .jkhive-book-ref-modal .jkhive-modal-subtitle,
  html body #jkhive-system-modal-container .jkhive-book-saga-modal .jkhive-modal-header-bottom .jkhive-modal-subtitle,
  body .jkhive-book-cat-modal .jkhive-modal-header-bottom .jkhive-modal-subtitle,
  body .jkhive-book-ref-modal .jkhive-modal-header-bottom .jkhive-modal-subtitle,
  body .jkhive-book-ref-modal .jkhive-modal-subtitle,
  body .jkhive-book-saga-modal .jkhive-modal-header-bottom .jkhive-modal-subtitle {
    font-size: 0.7rem !important;
  }
  
  html body #jkhive-system-modal-container .jkhive-modal-content,
  body #jkhive-system-modal-container .jkhive-modal-content {
    max-width: 90% !important;
    padding: 2rem 1.5rem !important;
  }
  
  html body #jkhive-system-modal-container .jkhive-modal-icon,
  body #jkhive-system-modal-container .jkhive-modal-icon {
    font-size: 3rem !important;
  }
  
  html body #jkhive-system-modal-container .jkhive-modal-title,
  body #jkhive-system-modal-container .jkhive-modal-title {
    font-size: 1.5rem !important;
  }
  
  html body #jkhive-system-modal-container .jkhive-modal-description,
  body #jkhive-system-modal-container .jkhive-modal-description {
    font-size: 1rem !important;
  }
}

/* ========================================
   MODAL DE ELIMINAR LIBRO
   .jkhive-book-delete-modal
   ======================================== */
html body .jkhive-book-delete-modal,
html body #jkhive-system-modal-container .jkhive-book-delete-modal,
body .jkhive-book-delete-modal {
  z-index: 9999 !important;
}

html body .jkhive-book-delete-modal .jkhive-modal-overlay,
html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-modal-overlay,
body .jkhive-book-delete-modal .jkhive-modal-overlay {
  background: rgba(244, 196, 48, 0.8) !important;
  backdrop-filter: blur(10px) !important;
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  z-index: 1 !important;
  pointer-events: auto !important;
  cursor: pointer !important;
}

html body .jkhive-book-delete-modal .jkhive-modal-overlay::before,
html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-modal-overlay::before,
body .jkhive-book-delete-modal .jkhive-modal-overlay::before {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background-image: url('../img/honeycomb-pattern.svg') !important;
  background-size: 32px 55px !important;
  background-repeat: repeat !important;
  background-position: 0 0 !important;
  pointer-events: none !important;
  z-index: 1 !important;
  opacity: 1 !important;
  filter: brightness(0) contrast(40) !important;
}

html body .jkhive-book-delete-modal .jkhive-modal-overlay::after,
html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-modal-overlay::after,
body .jkhive-book-delete-modal .jkhive-modal-overlay::after {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background-image: url('../img/honeycomb-pattern.svg') !important;
  background-size: 32px 55px !important;
  background-repeat: repeat !important;
  background-position: 16px 28px !important;
  pointer-events: none !important;
  z-index: 1 !important;
  opacity: 1 !important;
  filter: brightness(0) contrast(40) !important;
}

html body .jkhive-book-delete-modal .jkhive-modal-content,
html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-modal-content,
body .jkhive-book-delete-modal .jkhive-modal-content {
  width: 90% !important;
  max-width: 700px !important;
  min-width: 0 !important;
  aspect-ratio: 1 / 1.1547 !important;
  clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%) !important;
  background: linear-gradient(135deg, var(--jk-tech-darker) 0%, var(--jk-tech-dark) 50%, var(--jk-primary-blue-darker) 100%) !important;
  border: 3px solid var(--jk-accent-cyan) !important;
  border-radius: 0 !important;
  padding: 0 !important;
  position: relative !important;
  z-index: 2 !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
}

html body .jkhive-book-delete-modal .jkhive-modal-content::before,
html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-modal-content::before,
body .jkhive-book-delete-modal .jkhive-modal-content::before {
  content: '' !important;
  position: absolute !important;
  inset: -4px !important;
  clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%) !important;
  background: linear-gradient(135deg, var(--jk-accent-cyan), var(--jk-primary-blue-light)) !important;
  z-index: 0 !important;
  opacity: 0.3 !important;
  pointer-events: none !important;
}

html body .jkhive-book-delete-modal .jkhive-modal-header,
html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-modal-header,
body .jkhive-book-delete-modal .jkhive-modal-header {
  height: 25% !important;
  width: 100% !important;
  position: relative !important;
  padding: 0 !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: visible !important;
  z-index: 2 !important;
}

html body .jkhive-book-delete-modal .jkhive-modal-header-top,
html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-modal-header-top,
body .jkhive-book-delete-modal .jkhive-modal-header-top {
  height: 40% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding-top: 15px !important;
  padding-bottom: 0.5rem !important;
  position: relative !important;
}

html body .jkhive-book-delete-modal .jkhive-modal-header-icon,
html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-modal-header-icon,
body .jkhive-book-delete-modal .jkhive-modal-header-icon {
  font-size: 3.5rem !important;
  color: var(--jk-accent-honey) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  filter: drop-shadow(0 0 15px rgba(244, 196, 48, 0.8)) !important;
  position: relative !important;
  top: 15px !important;
}

html body .jkhive-book-delete-modal .jkhive-modal-header-bottom,
html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-modal-header-bottom,
body .jkhive-book-delete-modal .jkhive-modal-header-bottom {
  height: 60% !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-start !important;
  padding: 1rem 2rem 1rem !important;
  padding-top: calc(1rem + 15px) !important;
  text-align: center !important;
}

html body .jkhive-book-delete-modal .jkhive-modal-title,
html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-modal-title,
body .jkhive-book-delete-modal .jkhive-modal-title {
  font-size: 1.75rem !important;
  font-weight: 700 !important;
  color: var(--jk-accent-honey) !important;
  margin: 0 0 0.5rem 0 !important;
  text-shadow: 0 0 10px rgba(244, 196, 48, 0.5) !important;
}

html body .jkhive-book-delete-modal .jkhive-modal-subtitle,
html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-modal-subtitle,
body .jkhive-book-delete-modal .jkhive-modal-subtitle {
  font-size: 0.95rem !important;
  color: var(--jk-metal-light) !important;
  margin: 0 !important;
  line-height: 1.4 !important;
}

html body .jkhive-book-delete-modal .jkhive-modal-subtitle strong,
html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-modal-subtitle strong,
body .jkhive-book-delete-modal .jkhive-modal-subtitle strong {
  color: var(--jk-accent-honey) !important;
  font-weight: 700 !important;
}

html body .jkhive-book-delete-modal .jkhive-modal-body,
html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-modal-body,
body .jkhive-book-delete-modal .jkhive-modal-body {
  height: 50% !important;
  width: 100% !important;
  padding: 1.5rem 2rem !important;
  box-sizing: border-box !important;
  overflow-y: auto !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: center !important;
  z-index: 2 !important;
}

html body .jkhive-book-delete-modal .jkhive-delete-options,
html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-delete-options,
body .jkhive-book-delete-modal .jkhive-delete-options {
  display: flex !important;
  flex-direction: column !important;
  gap: 2rem !important;
  align-items: center !important;
  width: 100% !important;
  max-width: 550px !important;
}

html body .jkhive-book-delete-modal .jkhive-delete-option,
html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-delete-option,
body .jkhive-book-delete-modal .jkhive-delete-option {
  display: flex !important;
  align-items: center !important;
  gap: 1.5rem !important;
  width: 100% !important;
  padding: 1rem !important;
  background: rgba(15, 23, 42, 0.3) !important;
  border: 1px solid rgba(14, 165, 233, 0.2) !important;
  border-radius: 8px !important;
  transition: all 0.3s ease !important;
}

html body .jkhive-book-delete-modal .jkhive-delete-option:hover,
html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-delete-option:hover,
body .jkhive-book-delete-modal .jkhive-delete-option:hover {
  background: rgba(15, 23, 42, 0.5) !important;
  border-color: rgba(14, 165, 233, 0.4) !important;
  transform: translateX(5px) !important;
}

html body .jkhive-book-delete-modal .jkhive-delete-option .jkhive-actionbutton-med,
html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-delete-option .jkhive-actionbutton-med,
body .jkhive-book-delete-modal .jkhive-delete-option .jkhive-actionbutton-med {
  flex-shrink: 0 !important;
}

html body .jkhive-book-delete-modal .jkhive-delete-option-info,
html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-delete-option-info,
body .jkhive-book-delete-modal .jkhive-delete-option-info {
  flex: 1 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 0.5rem !important;
}

html body .jkhive-book-delete-modal .jkhive-delete-option-title,
html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-delete-option-title,
body .jkhive-book-delete-modal .jkhive-delete-option-title {
  font-size: 1.1rem !important;
  font-weight: 700 !important;
  color: var(--jk-metal-light) !important;
  margin: 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 0.5rem !important;
}

html body .jkhive-book-delete-modal .jkhive-delete-option-title::before,
html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-delete-option-title::before,
body .jkhive-book-delete-modal .jkhive-delete-option-title::before {
  content: '' !important;
  width: 4px !important;
  height: 1.1rem !important;
  background: currentColor !important;
  border-radius: 2px !important;
}

html body .jkhive-book-delete-modal .jkhive-delete-option:first-child .jkhive-delete-option-title::before,
html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-delete-option:first-child .jkhive-delete-option-title::before,
body .jkhive-book-delete-modal .jkhive-delete-option:first-child .jkhive-delete-option-title::before {
  background: #dc2626 !important;
}

html body .jkhive-book-delete-modal .jkhive-delete-option:last-child .jkhive-delete-option-title::before,
html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-delete-option:last-child .jkhive-delete-option-title::before,
body .jkhive-book-delete-modal .jkhive-delete-option:last-child .jkhive-delete-option-title::before {
  background: var(--jk-secondary-green) !important;
}

html body .jkhive-book-delete-modal .jkhive-delete-option-description,
html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-delete-option-description,
body .jkhive-book-delete-modal .jkhive-delete-option-description {
  font-size: 0.9rem !important;
  color: var(--jk-metal) !important;
  margin: 0 !important;
  line-height: 1.5 !important;
  padding-left: 1.5rem !important;
}

html body .jkhive-book-delete-modal .jkhive-delete-option-description strong,
html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-delete-option-description strong,
body .jkhive-book-delete-modal .jkhive-delete-option-description strong {
  color: #dc2626 !important;
  font-weight: 700 !important;
}

html body .jkhive-book-delete-modal .jkhive-modal-body::-webkit-scrollbar,
html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-modal-body::-webkit-scrollbar,
body .jkhive-book-delete-modal .jkhive-modal-body::-webkit-scrollbar {
  width: 8px !important;
}

html body .jkhive-book-delete-modal .jkhive-modal-body::-webkit-scrollbar-track,
html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-modal-body::-webkit-scrollbar-track,
body .jkhive-book-delete-modal .jkhive-modal-body::-webkit-scrollbar-track {
  background: transparent !important;
}

html body .jkhive-book-delete-modal .jkhive-modal-body::-webkit-scrollbar-thumb,
html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-modal-body::-webkit-scrollbar-thumb,
body .jkhive-book-delete-modal .jkhive-modal-body::-webkit-scrollbar-thumb {
  background: var(--jk-primary-blue) !important;
  border-radius: 4px !important;
}

html body .jkhive-book-delete-modal .jkhive-modal-body::-webkit-scrollbar-thumb:hover,
html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-modal-body::-webkit-scrollbar-thumb:hover,
body .jkhive-book-delete-modal .jkhive-modal-body::-webkit-scrollbar-thumb:hover {
  background: var(--jk-primary-blue-light) !important;
}

html body .jkhive-book-delete-modal .jkhive-modal-footer,
html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-modal-footer,
body .jkhive-book-delete-modal .jkhive-modal-footer {
  height: 25% !important;
  width: 100% !important;
  padding: 1rem 2rem 1.5rem !important;
  box-sizing: border-box !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  z-index: 2 !important;
}

html body .jkhive-book-delete-modal .jkhive-modal-footer .jkhive-actionbutton-med,
html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-modal-footer .jkhive-actionbutton-med,
body .jkhive-book-delete-modal .jkhive-modal-footer .jkhive-actionbutton-med {
  max-width: 200px !important;
}

/* COLOR INICIAL: Hexágono amarillo miel metálico */
html body .jkhive-book-delete-modal .jkhive-actionbutton-med .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-actionbutton-med .jkhive-hex,
body .jkhive-book-delete-modal .jkhive-actionbutton-med .jkhive-hex {
  background: var(--jk-accent-honey-light, #f4c430) !important;
  box-shadow: var(--jk-shadow-lg), 0 0 20px rgba(244, 196, 48, 0.6) !important;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

html body .jkhive-book-delete-modal .jkhive-actionbutton-med:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-actionbutton-med:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
body .jkhive-book-delete-modal .jkhive-actionbutton-med:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green) {
  background: var(--jk-accent-honey-light, #f4c430) !important;
  border-color: var(--jk-accent-honey-light, #f4c430) !important;
  transform: scale(1) !important;
  box-shadow: var(--jk-shadow-lg), 0 0 20px rgba(244, 196, 48, 0.6) !important;
}

html body .jkhive-book-delete-modal .jkhive-actionbutton-med .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-actionbutton-med .jkhive-hex-icon,
body .jkhive-book-delete-modal .jkhive-actionbutton-med .jkhive-hex-icon {
  color: #ffffff !important;
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

html body .jkhive-book-delete-modal .jkhive-modal-footer .jkhive-actionbutton-med .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-modal-footer .jkhive-actionbutton-med .jkhive-hex-icon,
body .jkhive-book-delete-modal .jkhive-modal-footer .jkhive-actionbutton-med .jkhive-hex-icon {
  font-size: 1.46625rem !important;
}

html body .jkhive-book-delete-modal .jkhive-actionbutton-med .jkhive-hex-text,
html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-actionbutton-med .jkhive-hex-text,
body .jkhive-book-delete-modal .jkhive-actionbutton-med .jkhive-hex-text {
  color: #ffffff !important;
}

html body .jkhive-book-delete-modal .jkhive-modal-footer .jkhive-actionbutton-med .jkhive-hex-text,
html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-modal-footer .jkhive-actionbutton-med .jkhive-hex-text,
body .jkhive-book-delete-modal .jkhive-modal-footer .jkhive-actionbutton-med .jkhive-hex-text {
  display: none !important;
}

/* HOVER: Botón Eliminar - Rojo metálico brillante */
html body .jkhive-book-delete-modal .jkhive-delete-option:first-child button:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body .jkhive-book-delete-modal .jkhive-delete-option:first-child .jkhive-actionbutton-med:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-delete-option:first-child button:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-delete-option:first-child .jkhive-actionbutton-med:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
body .jkhive-book-delete-modal .jkhive-delete-option:first-child button:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
body .jkhive-book-delete-modal .jkhive-delete-option:first-child .jkhive-actionbutton-med:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green) {
  background: linear-gradient(135deg, #ff3366, #cc0033, #ff3366) !important;
  box-shadow: 0 0 20px rgba(255, 51, 102, 0.8), 0 0 40px rgba(255, 51, 102, 0.6), inset 0 0 20px rgba(255, 255, 255, 0.3) !important;
  filter: brightness(1.2) drop-shadow(0 0 15px rgba(255, 51, 102, 0.9)) !important;
  transform: scale(1.05) !important;
}

html body .jkhive-book-delete-modal .jkhive-delete-option:first-child button:hover .jkhive-hex-icon,
html body .jkhive-book-delete-modal .jkhive-delete-option:first-child .jkhive-actionbutton-med:hover .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-delete-option:first-child button:hover .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-delete-option:first-child .jkhive-actionbutton-med:hover .jkhive-hex-icon,
body .jkhive-book-delete-modal .jkhive-delete-option:first-child button:hover .jkhive-hex-icon,
body .jkhive-book-delete-modal .jkhive-delete-option:first-child .jkhive-actionbutton-med:hover .jkhive-hex-icon {
  color: #ffffff !important;
  transform: rotate(-45deg) !important;
}

/* HOVER: Botón Desactivar - Gris metálico brillante */
html body .jkhive-book-delete-modal .jkhive-delete-option:last-child button:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body .jkhive-book-delete-modal .jkhive-delete-option:last-child .jkhive-actionbutton-med:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-delete-option:last-child button:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-delete-option:last-child .jkhive-actionbutton-med:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
body .jkhive-book-delete-modal .jkhive-delete-option:last-child button:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
body .jkhive-book-delete-modal .jkhive-delete-option:last-child .jkhive-actionbutton-med:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green) {
  background: linear-gradient(135deg, #94a3b8, #64748b, #94a3b8) !important;
  box-shadow: 0 0 20px rgba(148, 163, 184, 0.8), 0 0 40px rgba(148, 163, 184, 0.6), inset 0 0 20px rgba(255, 255, 255, 0.3) !important;
  filter: brightness(1.2) drop-shadow(0 0 15px rgba(148, 163, 184, 0.9)) !important;
  transform: scale(1.05) !important;
}

html body .jkhive-book-delete-modal .jkhive-delete-option:last-child button:hover .jkhive-hex-icon,
html body .jkhive-book-delete-modal .jkhive-delete-option:last-child .jkhive-actionbutton-med:hover .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-delete-option:last-child button:hover .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-delete-option:last-child .jkhive-actionbutton-med:hover .jkhive-hex-icon,
body .jkhive-book-delete-modal .jkhive-delete-option:last-child button:hover .jkhive-hex-icon,
body .jkhive-book-delete-modal .jkhive-delete-option:last-child .jkhive-actionbutton-med:hover .jkhive-hex-icon {
  color: #ffffff !important;
  transform: scaleX(-1) !important;
}

/* HOVER: Botón Cancelar - Rojo metálico brillante */
html body .jkhive-book-delete-modal .jkhive-modal-footer button:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body .jkhive-book-delete-modal .jkhive-modal-footer .jkhive-actionbutton-med:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-modal-footer button:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-modal-footer .jkhive-actionbutton-med:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
body .jkhive-book-delete-modal .jkhive-modal-footer button:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
body .jkhive-book-delete-modal .jkhive-modal-footer .jkhive-actionbutton-med:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green) {
  background: linear-gradient(135deg, #ff3366, #cc0033, #ff3366) !important;
  box-shadow: 0 0 20px rgba(255, 51, 102, 0.8), 0 0 40px rgba(255, 51, 102, 0.6), inset 0 0 20px rgba(255, 255, 255, 0.3) !important;
  filter: brightness(1.2) drop-shadow(0 0 15px rgba(255, 51, 102, 0.9)) !important;
  transform: scale(1.05) !important;
}

html body .jkhive-book-delete-modal .jkhive-modal-footer button:hover .jkhive-hex-icon,
html body .jkhive-book-delete-modal .jkhive-modal-footer .jkhive-actionbutton-med:hover .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-modal-footer button:hover .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-modal-footer .jkhive-actionbutton-med:hover .jkhive-hex-icon,
body .jkhive-book-delete-modal .jkhive-modal-footer button:hover .jkhive-hex-icon,
body .jkhive-book-delete-modal .jkhive-modal-footer .jkhive-actionbutton-med:hover .jkhive-hex-icon {
  color: #ffffff !important;
  transform: rotate(180deg) !important;
}

@media (max-width: 768px) {
  html body .jkhive-book-delete-modal .jkhive-modal-content,
  html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-modal-content,
  body .jkhive-book-delete-modal .jkhive-modal-content {
    max-width: 95% !important;
    width: 95% !important;
  }
  
  html body .jkhive-book-delete-modal .jkhive-modal-header-icon,
  html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-modal-header-icon,
  body .jkhive-book-delete-modal .jkhive-modal-header-icon {
    font-size: 2.5rem !important;
  }
  
  html body .jkhive-book-delete-modal .jkhive-modal-title,
  html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-modal-title,
  body .jkhive-book-delete-modal .jkhive-modal-title {
    font-size: 1.5rem !important;
  }
  
  html body .jkhive-book-delete-modal .jkhive-modal-subtitle,
  html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-modal-subtitle,
  body .jkhive-book-delete-modal .jkhive-modal-subtitle {
    font-size: 0.85rem !important;
  }
  
  html body .jkhive-book-delete-modal .jkhive-delete-option,
  html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-delete-option,
  body .jkhive-book-delete-modal .jkhive-delete-option {
    flex-direction: column !important;
    gap: 1rem !important;
    text-align: center !important;
  }
  
  html body .jkhive-book-delete-modal .jkhive-delete-option-info,
  html body #jkhive-system-modal-container .jkhive-book-delete-modal .jkhive-delete-option-info,
  body .jkhive-book-delete-modal .jkhive-delete-option-info {
    align-items: center !important;
  }
}

/* ========================================
   MODALES DE MENSAJERÍA
   .jkhive-modal-msgs-form
   ======================================== */
html body .jkhive-modal-msgs-form .jkhive-modal-overlay,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form .jkhive-modal-overlay,
body .jkhive-modal-msgs-form .jkhive-modal-overlay {
  background: rgba(244, 196, 48, 0.8) !important;
  backdrop-filter: blur(10px) !important;
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  z-index: 1 !important;
  pointer-events: auto !important;
  cursor: pointer !important;
}

html body .jkhive-modal-msgs-form .jkhive-modal-overlay::before,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form .jkhive-modal-overlay::before,
body .jkhive-modal-msgs-form .jkhive-modal-overlay::before {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background-image: url('../img/honeycomb-pattern.svg') !important;
  background-size: 32px 55px !important;
  background-repeat: repeat !important;
  background-position: 0 0 !important;
  pointer-events: none !important;
  z-index: 1 !important;
  opacity: 1 !important;
  filter: brightness(0) contrast(40) !important;
}

html body .jkhive-modal-msgs-form .jkhive-modal-overlay::after,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form .jkhive-modal-overlay::after,
body .jkhive-modal-msgs-form .jkhive-modal-overlay::after {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background-image: url('../img/honeycomb-pattern.svg') !important;
  background-size: 32px 55px !important;
  background-repeat: repeat !important;
  background-position: 16px 28px !important;
  pointer-events: none !important;
  z-index: 1 !important;
  opacity: 1 !important;
  filter: brightness(0) contrast(40) !important;
}

html body .jkhive-modal-msgs-form .jkhive-modal-content,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form .jkhive-modal-content,
body .jkhive-modal-msgs-form .jkhive-modal-content {
  max-width: 920.658375px !important;
  width: 920.658375px !important;
  padding: 2rem 2.5rem !important;
}

html body .jkhive-modal-msgs-form .jkhive-modal-content.jkhive-modal-hex,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form .jkhive-modal-content.jkhive-modal-hex,
body .jkhive-modal-msgs-form .jkhive-modal-content.jkhive-modal-hex {
  aspect-ratio: 1 / 1.1547 !important;
  min-height: auto !important;
  width: 920.658375px !important;
  min-width: 920.658375px !important;
  max-width: 920.658375px !important;
  clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%) !important;
  padding-top: 3rem !important;
  padding-bottom: 3rem !important;
  padding-left: 3rem !important;
  padding-right: 3rem !important;
}

html body .jkhive-modal-msgs-form .jkhive-modal-content.jkhive-modal-hex::before,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form .jkhive-modal-content.jkhive-modal-hex::before,
body .jkhive-modal-msgs-form .jkhive-modal-content.jkhive-modal-hex::before {
  clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%) !important;
}

html body .jkhive-modal-msgs-form .jkhive-modal-icon,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form .jkhive-modal-icon,
body .jkhive-modal-msgs-form .jkhive-modal-icon {
  font-size: 2.5rem !important;
  margin-bottom: 0.75rem !important;
}

html body .jkhive-modal-msgs-form .jkhive-modal-title,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form .jkhive-modal-title,
body .jkhive-modal-msgs-form .jkhive-modal-title {
  font-size: 1.5rem !important;
  margin-bottom: 1rem !important;
  font-weight: 600 !important;
}

html body .jkhive-modal-msgs-form .jkhive-modal-header-compact,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form .jkhive-modal-header-compact,
body .jkhive-modal-msgs-form .jkhive-modal-header-compact {
  display: flex !important;
  flex-direction: row !important;
  justify-content: center !important;
  align-items: flex-start !important;
  gap: 2rem !important;
  margin-bottom: 1.5rem !important;
  width: 100% !important;
}

html body .jkhive-modal-msgs-form .jkhive-modal-header-compact .recipient-column,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form .jkhive-modal-header-compact .recipient-column,
body .jkhive-modal-msgs-form .jkhive-modal-header-compact .recipient-column {
  width: 20% !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 0.5rem !important;
}

html body .jkhive-modal-msgs-form .jkhive-modal-header-compact .recipient-label-wrapper,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form .jkhive-modal-header-compact .recipient-label-wrapper,
body .jkhive-modal-msgs-form .jkhive-modal-header-compact .recipient-label-wrapper {
  display: flex !important;
  align-items: center !important;
  gap: 0.75rem !important;
  justify-content: center !important;
  margin-bottom: 0.25rem !important;
}

html body .jkhive-modal-msgs-form .jkhive-modal-header-compact .recipient-label,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form .jkhive-modal-header-compact .recipient-label,
body .jkhive-modal-msgs-form .jkhive-modal-header-compact .recipient-label {
  color: var(--jk-text-secondary, rgba(255, 255, 255, 0.7)) !important;
  font-weight: 500 !important;
  font-size: 0.9rem !important;
  margin: 0 !important;
}

html body .jkhive-modal-msgs-form .recipient-users-dropdown,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form .recipient-users-dropdown,
body .jkhive-modal-msgs-form .recipient-users-dropdown {
  position: absolute !important;
  top: 100% !important;
  left: 0 !important;
  margin-top: 0.5rem !important;
  background: var(--jk-tech-darker, rgba(10, 14, 39, 0.95)) !important;
  border: 2px solid var(--jk-accent-cyan, rgba(14, 165, 233, 0.5)) !important;
  border-radius: 0.5rem !important;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5) !important;
  min-width: 200px !important;
  max-width: 300px !important;
  max-height: 300px !important;
  overflow-y: auto !important;
  z-index: 1000 !important;
  display: none !important;
}

html body .jkhive-modal-msgs-form .recipient-users-dropdown.show,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form .recipient-users-dropdown.show,
body .jkhive-modal-msgs-form .recipient-users-dropdown.show {
  display: block !important;
}

html body .jkhive-modal-msgs-form .recipient-user-item,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form .recipient-user-item,
body .jkhive-modal-msgs-form .recipient-user-item {
  padding: 0.75rem 1rem !important;
  cursor: pointer !important;
  color: var(--jk-text-primary, rgba(255, 255, 255, 0.9)) !important;
  border-bottom: 1px solid var(--jk-tech-dark, rgba(20, 30, 50, 0.5)) !important;
  transition: all 0.2s ease !important;
}

html body .jkhive-modal-msgs-form .recipient-user-item:hover:not(.disabled),
html body #jkhive-system-modal-container .jkhive-modal-msgs-form .recipient-user-item:hover:not(.disabled),
body .jkhive-modal-msgs-form .recipient-user-item:hover:not(.disabled) {
  background: var(--jk-primary-blue-darker, rgba(14, 165, 233, 0.2)) !important;
  color: var(--jk-text-primary, rgba(255, 255, 255, 1)) !important;
}

html body .jkhive-modal-msgs-form .recipient-user-item.disabled,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form .recipient-user-item.disabled,
body .jkhive-modal-msgs-form .recipient-user-item.disabled {
  opacity: 0.5 !important;
  cursor: not-allowed !important;
  color: var(--jk-text-secondary, rgba(255, 255, 255, 0.5)) !important;
}

html body .jkhive-modal-msgs-form .recipient-user-item:last-child,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form .recipient-user-item:last-child,
body .jkhive-modal-msgs-form .recipient-user-item:last-child {
  border-bottom: none !important;
}

html body .jkhive-modal-msgs-form .messaging-recipients-header .recipient-bullets-container,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form .messaging-recipients-header .recipient-bullets-container,
body .jkhive-modal-msgs-form .messaging-recipients-header .recipient-bullets-container {
  display: inline-flex !important;
  flex-wrap: wrap !important;
  gap: 0.5rem !important;
  align-items: center !important;
  justify-content: center !important;
}

html body .jkhive-modal-msgs-form .recipient-bullet,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form .recipient-bullet,
body .jkhive-modal-msgs-form .recipient-bullet {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.5rem !important;
  padding: 0.375rem 0.75rem !important;
  background: var(--jk-tech-dark, rgba(20, 30, 50, 0.8)) !important;
  border: 1px solid var(--jk-accent-cyan, rgba(14, 165, 233, 0.5)) !important;
  border-radius: 1rem !important;
  color: var(--jk-text-primary, rgba(255, 255, 255, 0.9)) !important;
  font-size: 0.875rem !important;
  transition: all 0.2s ease !important;
}

html body .jkhive-modal-msgs-form .recipient-bullet.from-user,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form .recipient-bullet.from-user,
body .jkhive-modal-msgs-form .recipient-bullet.from-user {
  background: var(--jk-primary-blue-darker, rgba(14, 165, 233, 0.2)) !important;
  border-color: var(--jk-accent-cyan, rgba(14, 165, 233, 0.7)) !important;
}

html body .jkhive-modal-msgs-form .recipient-bullet .remove-bullet,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form .recipient-bullet .remove-bullet,
body .jkhive-modal-msgs-form .recipient-bullet .remove-bullet {
  display: none !important;
  cursor: pointer !important;
  color: var(--jk-accent-red, #ef4444) !important;
  font-size: 0.75rem !important;
  padding: 0.125rem 0.25rem !important;
  border-radius: 50% !important;
  transition: all 0.2s ease !important;
}

html body .jkhive-modal-msgs-form .recipient-bullet:hover .remove-bullet,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form .recipient-bullet:hover .remove-bullet,
body .jkhive-modal-msgs-form .recipient-bullet:hover .remove-bullet {
  display: inline-flex !important;
}

html body .jkhive-modal-msgs-form .recipient-bullet.from-user .remove-bullet,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form .recipient-bullet.from-user .remove-bullet,
body .jkhive-modal-msgs-form .recipient-bullet.from-user .remove-bullet {
  display: none !important;
}

html body .jkhive-modal-msgs-form .messaging-subject-compact,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form .messaging-subject-compact,
body .jkhive-modal-msgs-form .messaging-subject-compact {
  width: 25% !important;
  margin-top: 0.5rem !important;
  margin-left: auto !important;
  padding: 0.5rem 0.75rem !important;
  background: var(--jk-tech-dark, rgba(20, 30, 50, 0.6)) !important;
  border: 1px solid var(--jk-accent-cyan, rgba(14, 165, 233, 0.3)) !important;
  border-radius: 0.5rem !important;
  font-size: 0.875rem !important;
  color: var(--jk-text-secondary, rgba(255, 255, 255, 0.7)) !important;
  text-align: right !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

html body .jkhive-modal-msgs-form .messaging-subject-compact .subject-label,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form .messaging-subject-compact .subject-label,
body .jkhive-modal-msgs-form .messaging-subject-compact .subject-label {
  font-weight: 500 !important;
  margin-right: 0.5rem !important;
}

html body .jkhive-modal-msgs-form .messaging-form-actions-compact,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form .messaging-form-actions-compact,
body .jkhive-modal-msgs-form .messaging-form-actions-compact {
  display: flex !important;
  align-items: center !important;
  gap: 0.5rem !important;
  margin-top: 0.5rem !important;
  width: 100% !important;
  justify-content: center !important;
}

html body .jkhive-modal-msgs-form .messaging-form-actions-compact .jkhive-actionbutton-small,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form .messaging-form-actions-compact .jkhive-actionbutton-small,
body .jkhive-modal-msgs-form .messaging-form-actions-compact .jkhive-actionbutton-small {
  margin: 0 !important;
}

html body .jkhive-modal-msgs-form .messaging-form,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form .messaging-form,
body .jkhive-modal-msgs-form .messaging-form {
  display: flex !important;
  flex-direction: column !important;
  gap: 1.5rem !important;
}

html body .jkhive-modal-msgs-form .form-group,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form .form-group,
body .jkhive-modal-msgs-form .form-group {
  display: flex !important;
  flex-direction: column !important;
  gap: 0.5rem !important;
}

html body .jkhive-modal-msgs-form .form-label,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form .form-label,
body .jkhive-modal-msgs-form .form-label {
  color: var(--jk-text-primary, rgba(255, 255, 255, 0.9)) !important;
  font-weight: 500 !important;
  font-size: 0.95rem !important;
}

html body .jkhive-modal-msgs-form .form-control,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form .form-control,
body .jkhive-modal-msgs-form .form-control {
  width: 100% !important;
  padding: 0.875rem 1rem !important;
  background: var(--jk-bg-primary, rgba(20, 30, 50, 0.8)) !important;
  color: var(--jk-text-primary, rgba(255, 255, 255, 0.9)) !important;
  border: 2px solid var(--jk-accent-blue, rgba(14, 165, 233, 0.5)) !important;
  border-radius: 0.5rem !important;
  font-size: 0.95rem !important;
  transition: all 0.2s ease !important;
}

html body .jkhive-modal-msgs-form .form-control:focus,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form .form-control:focus,
body .jkhive-modal-msgs-form .form-control:focus {
  outline: none !important;
  border-color: var(--jk-accent-cyan, rgba(14, 165, 233, 1)) !important;
  box-shadow: 0 0 10px rgba(14, 165, 233, 0.3) !important;
}

html body .jkhive-modal-msgs-form .form-control::placeholder,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form .form-control::placeholder,
body .jkhive-modal-msgs-form .form-control::placeholder {
  color: var(--jk-text-secondary, rgba(255, 255, 255, 0.5)) !important;
}

html body .jkhive-modal-msgs-form textarea.form-control,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form textarea.form-control,
body .jkhive-modal-msgs-form textarea.form-control {
  min-height: 150px !important;
  resize: vertical !important;
  font-family: inherit !important;
}

html body .jkhive-modal-msgs-form .attachments-bullets-container,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form .attachments-bullets-container,
body .jkhive-modal-msgs-form .attachments-bullets-container {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0.5rem !important;
  margin-top: 0.75rem !important;
  padding-top: 0.75rem !important;
  border-top: 1px solid var(--jk-tech-dark, rgba(20, 30, 50, 0.5)) !important;
}

html body .jkhive-modal-msgs-form .attachment-bullet,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form .attachment-bullet,
body .jkhive-modal-msgs-form .attachment-bullet {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.5rem !important;
  padding: 0.375rem 0.75rem !important;
  background: var(--jk-tech-dark, rgba(20, 30, 50, 0.8)) !important;
  border: 1px solid var(--jk-accent-cyan, rgba(14, 165, 233, 0.5)) !important;
  border-radius: 1rem !important;
  color: var(--jk-text-primary, rgba(255, 255, 255, 0.9)) !important;
  font-size: 0.875rem !important;
  transition: all 0.2s ease !important;
}

html body .jkhive-modal-msgs-form .attachment-bullet .remove-attachment,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form .attachment-bullet .remove-attachment,
body .jkhive-modal-msgs-form .attachment-bullet .remove-attachment {
  cursor: pointer !important;
  color: var(--jk-accent-red, #ef4444) !important;
  font-size: 0.75rem !important;
  padding: 0.125rem 0.25rem !important;
  border-radius: 50% !important;
  transition: all 0.2s ease !important;
}

html body .jkhive-modal-msgs-form .attachment-bullet .remove-attachment:hover,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form .attachment-bullet .remove-attachment:hover,
body .jkhive-modal-msgs-form .attachment-bullet .remove-attachment:hover {
  background: var(--jk-accent-red, rgba(239, 68, 68, 0.2)) !important;
}

html body .jkhive-modal-msgs-form .jkhive-modal-actions,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form .jkhive-modal-actions,
body .jkhive-modal-msgs-form .jkhive-modal-actions {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 1rem !important;
  margin-top: 1.5rem !important;
}

html body .jkhive-modal-msgs-form[data-state="reply"] .jkhive-modal-actions,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form[data-state="reply"] .jkhive-modal-actions,
body .jkhive-modal-msgs-form[data-state="reply"] .jkhive-modal-actions {
  justify-content: space-between !important;
  padding: 0 2rem !important;
}

/* Botones de acción en modal de responder - Color inicial: amarillo miel metálico */
html body .jkhive-modal-msgs-form[data-state="reply"] .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form[data-state="reply"] .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex,
body .jkhive-modal-msgs-form[data-state="reply"] .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex {
  background: var(--jk-accent-honey, #d4a017) !important;
  border-color: var(--jk-accent-honey, #d4a017) !important;
}

/* Hover: Cancelar - Rojo metálico brillante */
html body .jkhive-modal-msgs-form[data-state="reply"] .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-system-modal-btn[data-action="cancel"]:hover .jkhive-hex,
html body .jkhive-modal-msgs-form[data-state="reply"] .jkhive-modal-actions .jkhive-actionbutton-med:hover .jkhive-system-modal-btn[data-action="cancel"] .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form[data-state="reply"] .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-system-modal-btn[data-action="cancel"]:hover .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form[data-state="reply"] .jkhive-modal-actions .jkhive-actionbutton-med:hover .jkhive-system-modal-btn[data-action="cancel"] .jkhive-hex,
body .jkhive-modal-msgs-form[data-state="reply"] .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-system-modal-btn[data-action="cancel"]:hover .jkhive-hex,
body .jkhive-modal-msgs-form[data-state="reply"] .jkhive-modal-actions .jkhive-actionbutton-med:hover .jkhive-system-modal-btn[data-action="cancel"] .jkhive-hex {
  background: linear-gradient(135deg, #ff3366, #cc0033, #ff3366) !important;
  border-color: #ff3366 !important;
  box-shadow: 0 0 20px rgba(255, 51, 102, 0.8), 0 0 40px rgba(255, 51, 102, 0.6), inset 0 0 20px rgba(255, 255, 255, 0.3) !important;
  filter: brightness(1.2) drop-shadow(0 0 15px rgba(255, 51, 102, 0.9)) !important;
  transform: scale(0.9) !important;
}

/* Hover: Enviar - Verde oscuro metálico brillante */
html body .jkhive-modal-msgs-form[data-state="reply"] .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-system-modal-btn[data-action="send"]:hover .jkhive-hex,
html body .jkhive-modal-msgs-form[data-state="reply"] .jkhive-modal-actions .jkhive-actionbutton-med:hover .jkhive-system-modal-btn[data-action="send"] .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form[data-state="reply"] .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-system-modal-btn[data-action="send"]:hover .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form[data-state="reply"] .jkhive-modal-actions .jkhive-actionbutton-med:hover .jkhive-system-modal-btn[data-action="send"] .jkhive-hex,
body .jkhive-modal-msgs-form[data-state="reply"] .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-system-modal-btn[data-action="send"]:hover .jkhive-hex,
body .jkhive-modal-msgs-form[data-state="reply"] .jkhive-modal-actions .jkhive-actionbutton-med:hover .jkhive-system-modal-btn[data-action="send"] .jkhive-hex {
  background: linear-gradient(135deg, #00ff88, #00cc6a, #00ff88) !important;
  border-color: #00ff88 !important;
  box-shadow: 0 0 20px rgba(0, 255, 136, 0.8), 0 0 40px rgba(0, 255, 136, 0.6), inset 0 0 20px rgba(255, 255, 255, 0.3) !important;
  filter: brightness(1.2) drop-shadow(0 0 15px rgba(0, 255, 136, 0.9)) !important;
  transform: scale(0.9) !important;
}

/* Botones adjuntar y agregar CC en modal de responder - Color inicial: amarillo miel metálico */
html body .jkhive-modal-msgs-form[data-state="reply"] .messaging-form-actions-compact .attach-file-btn .jkhive-hex,
html body .jkhive-modal-msgs-form[data-state="reply"] .messaging-form-actions-compact .add-cc-btn .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form[data-state="reply"] .messaging-form-actions-compact .attach-file-btn .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form[data-state="reply"] .messaging-form-actions-compact .add-cc-btn .jkhive-hex,
body .jkhive-modal-msgs-form[data-state="reply"] .messaging-form-actions-compact .attach-file-btn .jkhive-hex,
body .jkhive-modal-msgs-form[data-state="reply"] .messaging-form-actions-compact .add-cc-btn .jkhive-hex {
  background: var(--jk-accent-honey, #d4a017) !important;
  border-color: var(--jk-accent-honey, #d4a017) !important;
}

/* Hover: Cyan metálico brillante */
html body .jkhive-modal-msgs-form[data-state="reply"] .messaging-form-actions-compact .attach-file-btn:hover .jkhive-hex,
html body .jkhive-modal-msgs-form[data-state="reply"] .messaging-form-actions-compact .add-cc-btn:hover .jkhive-hex,
html body .jkhive-modal-msgs-form[data-state="reply"] .messaging-form-actions-compact .jkhive-actionbutton-small:hover .attach-file-btn .jkhive-hex,
html body .jkhive-modal-msgs-form[data-state="reply"] .messaging-form-actions-compact .jkhive-actionbutton-small:hover .add-cc-btn .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form[data-state="reply"] .messaging-form-actions-compact .attach-file-btn:hover .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form[data-state="reply"] .messaging-form-actions-compact .add-cc-btn:hover .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form[data-state="reply"] .messaging-form-actions-compact .jkhive-actionbutton-small:hover .attach-file-btn .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form[data-state="reply"] .messaging-form-actions-compact .jkhive-actionbutton-small:hover .add-cc-btn .jkhive-hex,
body .jkhive-modal-msgs-form[data-state="reply"] .messaging-form-actions-compact .attach-file-btn:hover .jkhive-hex,
body .jkhive-modal-msgs-form[data-state="reply"] .messaging-form-actions-compact .add-cc-btn:hover .jkhive-hex,
body .jkhive-modal-msgs-form[data-state="reply"] .messaging-form-actions-compact .jkhive-actionbutton-small:hover .attach-file-btn .jkhive-hex,
body .jkhive-modal-msgs-form[data-state="reply"] .messaging-form-actions-compact .jkhive-actionbutton-small:hover .add-cc-btn .jkhive-hex {
  background: linear-gradient(135deg, #06b6d4, #0891b2, #06b6d4) !important;
  border-color: #06b6d4 !important;
  box-shadow: 0 0 20px rgba(6, 182, 212, 0.8), 0 0 40px rgba(6, 182, 212, 0.6), inset 0 0 20px rgba(255, 255, 255, 0.3) !important;
  filter: brightness(1.2) drop-shadow(0 0 15px rgba(6, 182, 212, 0.9)) !important;
  transform: scale(0.9) !important;
}

/* Scrollbar personalizado */
html body .jkhive-modal-msgs-form .recipient-users-dropdown::-webkit-scrollbar,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form .recipient-users-dropdown::-webkit-scrollbar,
body .jkhive-modal-msgs-form .recipient-users-dropdown::-webkit-scrollbar {
  width: 8px !important;
}

html body .jkhive-modal-msgs-form .recipient-users-dropdown::-webkit-scrollbar-track,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form .recipient-users-dropdown::-webkit-scrollbar-track,
body .jkhive-modal-msgs-form .recipient-users-dropdown::-webkit-scrollbar-track {
  background: var(--jk-tech-dark, rgba(20, 30, 50, 0.5)) !important;
}

html body .jkhive-modal-msgs-form .recipient-users-dropdown::-webkit-scrollbar-thumb,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form .recipient-users-dropdown::-webkit-scrollbar-thumb,
body .jkhive-modal-msgs-form .recipient-users-dropdown::-webkit-scrollbar-thumb {
  background: var(--jk-accent-cyan, rgba(14, 165, 233, 0.5)) !important;
  border-radius: 4px !important;
}

html body .jkhive-modal-msgs-form .recipient-users-dropdown::-webkit-scrollbar-thumb:hover,
html body #jkhive-system-modal-container .jkhive-modal-msgs-form .recipient-users-dropdown::-webkit-scrollbar-thumb:hover,
body .jkhive-modal-msgs-form .recipient-users-dropdown::-webkit-scrollbar-thumb:hover {
  background: var(--jk-accent-cyan, rgba(14, 165, 233, 0.8)) !important;
}

@media (max-width: 1200px) {
  html body .jkhive-modal-msgs-form .jkhive-modal-content,
  html body #jkhive-system-modal-container .jkhive-modal-msgs-form .jkhive-modal-content,
  body .jkhive-modal-msgs-form .jkhive-modal-content {
    max-width: 80vw !important;
    width: 80vw !important;
  }
  
  html body .jkhive-modal-msgs-form .jkhive-modal-content.jkhive-modal-hex,
  html body #jkhive-system-modal-container .jkhive-modal-msgs-form .jkhive-modal-content.jkhive-modal-hex,
  body .jkhive-modal-msgs-form .jkhive-modal-content.jkhive-modal-hex {
    width: 80vw !important;
    min-width: 80vw !important;
    max-width: 80vw !important;
  }
}

@media (max-width: 768px) {
  html body .jkhive-modal-msgs-form .jkhive-modal-header-compact,
  html body #jkhive-system-modal-container .jkhive-modal-msgs-form .jkhive-modal-header-compact,
  body .jkhive-modal-msgs-form .jkhive-modal-header-compact {
    flex-direction: column !important;
    gap: 1rem !important;
  }
  
  html body .jkhive-modal-msgs-form .jkhive-modal-header-compact .recipient-column,
  html body #jkhive-system-modal-container .jkhive-modal-msgs-form .jkhive-modal-header-compact .recipient-column,
  body .jkhive-modal-msgs-form .jkhive-modal-header-compact .recipient-column {
    width: 100% !important;
  }
  
  html body .jkhive-modal-msgs-form .messaging-subject-compact,
  html body #jkhive-system-modal-container .jkhive-modal-msgs-form .messaging-subject-compact,
  body .jkhive-modal-msgs-form .messaging-subject-compact {
    width: 100% !important;
    margin-left: 0 !important;
    text-align: left !important;
  }
}

/* ========================================
   MODAL DE VISTA DE MENSAJE
   .jkhive-modal-message-view
   ======================================== */
html body .jkhive-modal-message-view .jkhive-modal-message-content,
html body #jkhive-system-modal-container .jkhive-modal-message-view .jkhive-modal-message-content,
body .jkhive-modal-message-view .jkhive-modal-message-content {
  transition: opacity 0.3s ease, transform 0.3s ease, max-width 0.3s ease, width 0.3s ease !important;
  display: flex !important;
  flex-direction: column !important;
  padding: 3rem 3rem !important;
  height: 100% !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  position: relative !important;
}

html body .jkhive-modal-message-view .jkhive-modal-header,
html body #jkhive-system-modal-container .jkhive-modal-message-view .jkhive-modal-header,
body .jkhive-modal-message-view .jkhive-modal-header {
  text-align: center !important;
  margin-bottom: 1rem !important;
}

html body .jkhive-modal-message-view .messaging-modal-actions-centered,
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-modal-actions-centered,
body .jkhive-modal-message-view .messaging-modal-actions-centered {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 0.75rem !important;
  margin: 1.5rem 0 !important;
  padding: 0 2rem !important;
}

html body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small,
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small,
body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small {
  margin: 0 !important;
}

html body .jkhive-modal-message-view .messaging-modal-thread,
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-modal-thread,
body .jkhive-modal-message-view .messaging-modal-thread {
  flex: 1 !important;
  max-height: calc(45vh * 0.8) !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding: 0 0.5rem !important;
  margin: 15px auto 0 auto !important;
  width: 100% !important;
  scroll-behavior: smooth !important;
  background: transparent !important;
}

html body .jkhive-modal-message-view .messaging-modal-footer-spacer,
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-modal-footer-spacer,
body .jkhive-modal-message-view .messaging-modal-footer-spacer {
  height: 6rem !important;
  min-height: 6rem !important;
  width: 100% !important;
  flex-shrink: 0 !important;
  background: transparent !important;
}

html body .jkhive-modal-message-view .messaging-modal-footer,
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-modal-footer,
body .jkhive-modal-message-view .messaging-modal-footer {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  position: absolute !important;
  bottom: 70px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: 100% !important;
  padding: 0 3rem !important;
  box-sizing: border-box !important;
  padding-top: 1.5rem !important;
  background: transparent !important;
  z-index: 10 !important;
}

html body .jkhive-modal-message-view .messaging-modal-thread::-webkit-scrollbar,
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-modal-thread::-webkit-scrollbar,
body .jkhive-modal-message-view .messaging-modal-thread::-webkit-scrollbar {
  width: 8px !important;
}

html body .jkhive-modal-message-view .messaging-modal-thread::-webkit-scrollbar-track,
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-modal-thread::-webkit-scrollbar-track,
body .jkhive-modal-message-view .messaging-modal-thread::-webkit-scrollbar-track {
  background: var(--jk-tech-dark, rgba(20, 30, 50, 0.5)) !important;
}

html body .jkhive-modal-message-view .messaging-modal-thread::-webkit-scrollbar-thumb,
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-modal-thread::-webkit-scrollbar-thumb,
body .jkhive-modal-message-view .messaging-modal-thread::-webkit-scrollbar-thumb {
  background: var(--jk-accent-cyan, rgba(14, 165, 233, 0.5)) !important;
  border-radius: 4px !important;
}

html body .jkhive-modal-message-view .messaging-modal-thread::-webkit-scrollbar-thumb:hover,
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-modal-thread::-webkit-scrollbar-thumb:hover,
body .jkhive-modal-message-view .messaging-modal-thread::-webkit-scrollbar-thumb:hover {
  background: var(--jk-accent-cyan, rgba(14, 165, 233, 0.8)) !important;
}

/* Mensaje más reciente - background semi-transparente */
html body .jkhive-modal-message-view .messaging-modal-thread .messaging-thread-message.messaging-thread-latest,
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-modal-thread .messaging-thread-message.messaging-thread-latest,
body .jkhive-modal-message-view .messaging-modal-thread .messaging-thread-message.messaging-thread-latest {
  background: rgba(244, 196, 48, 0.08) !important;
  backdrop-filter: blur(2px) !important;
  position: relative !important;
  padding: 1.5rem !important;
  border-radius: 8px !important;
  border: 2px solid var(--jk-accent-honey, #d4a017) !important;
  margin-bottom: 2rem !important;
}

html body .jkhive-modal-message-view .messaging-thread-latest-container,
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-thread-latest-container,
body .jkhive-modal-message-view .messaging-thread-latest-container {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  width: 100% !important;
}

html body .jkhive-modal-message-view .messaging-thread-membrete,
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-thread-membrete,
body .jkhive-modal-message-view .messaging-thread-membrete {
  display: flex !important;
  width: 100% !important;
  height: 10% !important;
  min-height: 50px !important;
  border-bottom: 1px solid var(--jk-accent-cyan, rgba(14, 165, 233, 0.3)) !important;
  padding: 0.35rem !important;
  box-sizing: border-box !important;
}

html body .jkhive-modal-message-view .messaging-thread-membrete .membrete-section,
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-thread-membrete .membrete-section,
body .jkhive-modal-message-view .messaging-thread-membrete .membrete-section {
  width: 20% !important;
  height: 100% !important;
  display: flex !important;
  align-items: flex-start !important;
  padding: 0 0.25rem !important;
  box-sizing: border-box !important;
  border-right: 1px solid var(--jk-accent-cyan, rgba(14, 165, 233, 0.2)) !important;
}

html body .jkhive-modal-message-view .messaging-thread-membrete .membrete-section:last-child,
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-thread-membrete .membrete-section:last-child,
body .jkhive-modal-message-view .messaging-thread-membrete .membrete-section:last-child {
  border-right: none !important;
  width: 40% !important;
}

html body .jkhive-modal-message-view .messaging-thread-membrete .membrete-content,
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-thread-membrete .membrete-content,
body .jkhive-modal-message-view .messaging-thread-membrete .membrete-content {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 0.25rem !important;
  width: 100% !important;
  height: 100% !important;
}

html body .jkhive-modal-message-view .messaging-thread-membrete .membrete-section-subject .membrete-content,
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-thread-membrete .membrete-section-subject .membrete-content,
body .jkhive-modal-message-view .messaging-thread-membrete .membrete-section-subject .membrete-content {
  color: var(--jk-text-primary, rgba(255, 255, 255, 0.9)) !important;
  font-size: 0.9rem !important;
  font-weight: 500 !important;
  align-items: center !important;
}

html body .jkhive-modal-message-view .messaging-thread-membrete .messaging-thread-latest-badge,
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-thread-membrete .messaging-thread-latest-badge,
body .jkhive-modal-message-view .messaging-thread-membrete .messaging-thread-latest-badge {
  background: var(--jk-accent-honey, #d4a017) !important;
  color: var(--jk-tech-dark, #0a0e27) !important;
  padding: 0.3rem 0.8rem !important;
  border-radius: 1rem !important;
  font-size: 0.75rem !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  font-weight: 600 !important;
  flex-shrink: 0 !important;
}

html body .jkhive-modal-message-view .messaging-thread-latest-body,
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-thread-latest-body,
body .jkhive-modal-message-view .messaging-thread-latest-body {
  height: 85% !important;
  width: 100% !important;
  padding: 0.5rem !important;
  box-sizing: border-box !important;
  overflow-y: auto !important;
}

html body .jkhive-modal-message-view .messaging-thread-latest-actions,
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-thread-latest-actions,
body .jkhive-modal-message-view .messaging-thread-latest-actions {
  height: 5% !important;
  min-height: 40px !important;
  width: 100% !important;
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
  gap: 0.75rem !important;
  padding: 0.35rem 0.5rem !important;
  box-sizing: border-box !important;
  border-top: 1px solid var(--jk-accent-cyan, rgba(14, 165, 233, 0.3)) !important;
}

html body .jkhive-modal-message-view .messaging-thread-latest-actions .jkhive-actionbutton-small,
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-thread-latest-actions .jkhive-actionbutton-small,
body .jkhive-modal-message-view .messaging-thread-latest-actions .jkhive-actionbutton-small {
  margin: 0 !important;
}

/* Color inicial: amarillo miel metálico para todos los botones del modal de mensajes */
html body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small .jkhive-hex,
html body .jkhive-modal-message-view .messaging-modal-footer .jkhive-actionbutton-med .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-modal-footer .jkhive-actionbutton-med .jkhive-hex,
body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small .jkhive-hex,
body .jkhive-modal-message-view .messaging-modal-footer .jkhive-actionbutton-med .jkhive-hex {
  background: var(--jk-accent-honey, #d4a017) !important;
  border-color: var(--jk-accent-honey, #d4a017) !important;
}

/* ANULAR la regla general de jk-hive.css que convierte botones amarillos a cyan en hover */
html body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body .jkhive-modal-message-view .messaging-modal-footer .jkhive-actionbutton-med:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-modal-footer .jkhive-actionbutton-med:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
body .jkhive-modal-message-view .messaging-modal-footer .jkhive-actionbutton-med:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green) {
  background: var(--jk-accent-honey, #d4a017) !important;
  border-color: var(--jk-accent-honey, #d4a017) !important;
  transform: scale(1) !important;
  box-shadow: none !important;
}

/* Hover: Responder - Cyan metálico brillante */
html body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Responder"] .jkhive-hex,
html body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small a[data-tooltip="Responder"]:hover .jkhive-hex,
html body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Responder"]:hover .jkhive-hex,
html body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small a[data-tooltip="Responder"]:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Responder"] .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Responder"] .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small a[data-tooltip="Responder"]:hover .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Responder"]:hover .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small a[data-tooltip="Responder"]:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Responder"] .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Responder"] .jkhive-hex,
body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small a[data-tooltip="Responder"]:hover .jkhive-hex,
body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Responder"]:hover .jkhive-hex,
body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small a[data-tooltip="Responder"]:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Responder"] .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green) {
  background: linear-gradient(135deg, #06b6d4, #0891b2, #06b6d4) !important;
  border-color: #06b6d4 !important;
  box-shadow: 0 0 20px rgba(6, 182, 212, 0.8), 0 0 40px rgba(6, 182, 212, 0.6), inset 0 0 20px rgba(255, 255, 255, 0.3) !important;
  filter: brightness(1.2) drop-shadow(0 0 15px rgba(6, 182, 212, 0.9)) !important;
  transform: scale(0.9) !important;
}

/* Hover: Reenviar - Verde metálico brillante */
html body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Reenviar"] .jkhive-hex,
html body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small a[data-tooltip="Reenviar"]:hover .jkhive-hex,
html body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Reenviar"]:hover .jkhive-hex,
html body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small a[data-tooltip="Reenviar"]:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Reenviar"] .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Reenviar"] .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small a[data-tooltip="Reenviar"]:hover .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Reenviar"]:hover .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small a[data-tooltip="Reenviar"]:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Reenviar"] .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Reenviar"] .jkhive-hex,
body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small a[data-tooltip="Reenviar"]:hover .jkhive-hex,
body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Reenviar"]:hover .jkhive-hex,
body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small a[data-tooltip="Reenviar"]:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Reenviar"] .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green) {
  background: linear-gradient(135deg, #00ff88, #00cc6a, #00ff88) !important;
  border-color: #00ff88 !important;
  box-shadow: 0 0 20px rgba(0, 255, 136, 0.8), 0 0 40px rgba(0, 255, 136, 0.6), inset 0 0 20px rgba(255, 255, 255, 0.3) !important;
  filter: brightness(1.2) drop-shadow(0 0 15px rgba(0, 255, 136, 0.9)) !important;
  transform: scale(0.9) !important;
}

/* Hover: Destacar - Amarillo metálico brillante */
html body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Destacar"] .jkhive-hex,
html body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small a[data-tooltip="Destacar"]:hover .jkhive-hex,
html body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Destacar"]:hover .jkhive-hex,
html body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Destacado"] .jkhive-hex,
html body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small a[data-tooltip="Destacado"]:hover .jkhive-hex,
html body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Destacado"]:hover .jkhive-hex,
html body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small a[data-tooltip="Destacar"]:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Destacar"] .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small a[data-tooltip="Destacado"]:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Destacado"] .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Destacar"] .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small a[data-tooltip="Destacar"]:hover .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Destacar"]:hover .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Destacado"] .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small a[data-tooltip="Destacado"]:hover .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Destacado"]:hover .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small a[data-tooltip="Destacar"]:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Destacar"] .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small a[data-tooltip="Destacado"]:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Destacado"] .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Destacar"] .jkhive-hex,
body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small a[data-tooltip="Destacar"]:hover .jkhive-hex,
body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Destacar"]:hover .jkhive-hex,
body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Destacado"] .jkhive-hex,
body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small a[data-tooltip="Destacado"]:hover .jkhive-hex,
body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Destacado"]:hover .jkhive-hex,
body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small a[data-tooltip="Destacar"]:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Destacar"] .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small a[data-tooltip="Destacado"]:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Destacado"] .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green) {
  background: linear-gradient(135deg, #ffd700, #ffed4e, #ffd700) !important;
  border-color: #ffd700 !important;
  box-shadow: 0 0 20px rgba(255, 215, 0, 0.8), 0 0 40px rgba(255, 215, 0, 0.6), inset 0 0 20px rgba(255, 255, 255, 0.3) !important;
  filter: brightness(1.2) drop-shadow(0 0 15px rgba(255, 215, 0, 0.9)) !important;
  transform: scale(0.9) !important;
}

/* Hover: Archivar - Azul metálico brillante */
html body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Archivar"] .jkhive-hex,
html body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small a[data-tooltip="Archivar"]:hover .jkhive-hex,
html body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Archivar"]:hover .jkhive-hex,
html body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small a[data-tooltip="Archivar"]:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Archivar"] .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Archivar"] .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small a[data-tooltip="Archivar"]:hover .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Archivar"]:hover .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small a[data-tooltip="Archivar"]:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Archivar"] .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Archivar"] .jkhive-hex,
body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small a[data-tooltip="Archivar"]:hover .jkhive-hex,
body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Archivar"]:hover .jkhive-hex,
body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small a[data-tooltip="Archivar"]:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Archivar"] .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green) {
  background: linear-gradient(135deg, #3b82f6, #2563eb, #3b82f6) !important;
  border-color: #3b82f6 !important;
  box-shadow: 0 0 20px rgba(59, 130, 246, 0.8), 0 0 40px rgba(59, 130, 246, 0.6), inset 0 0 20px rgba(255, 255, 255, 0.3) !important;
  filter: brightness(1.2) drop-shadow(0 0 15px rgba(59, 130, 246, 0.9)) !important;
  transform: scale(0.9) !important;
}

/* Hover: Eliminar - Rojo metálico brillante */
html body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Eliminar"] .jkhive-hex,
html body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small a[data-tooltip="Eliminar"]:hover .jkhive-hex,
html body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Eliminar"]:hover .jkhive-hex,
html body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small a[data-tooltip="Eliminar"]:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Eliminar"] .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Eliminar"] .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small a[data-tooltip="Eliminar"]:hover .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Eliminar"]:hover .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small a[data-tooltip="Eliminar"]:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Eliminar"] .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Eliminar"] .jkhive-hex,
body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small a[data-tooltip="Eliminar"]:hover .jkhive-hex,
body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Eliminar"]:hover .jkhive-hex,
body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small a[data-tooltip="Eliminar"]:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
body .jkhive-modal-message-view .messaging-modal-actions-centered .jkhive-actionbutton-small:hover a[data-tooltip="Eliminar"] .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green) {
  background: linear-gradient(135deg, #ff3366, #cc0033, #ff3366) !important;
  border-color: #ff3366 !important;
  box-shadow: 0 0 20px rgba(255, 51, 102, 0.8), 0 0 40px rgba(255, 51, 102, 0.6), inset 0 0 20px rgba(255, 255, 255, 0.3) !important;
  filter: brightness(1.2) drop-shadow(0 0 15px rgba(255, 51, 102, 0.9)) !important;
  transform: scale(0.9) !important;
}

/* Hover: Salir - Verde oscuro metálico brillante */
html body .jkhive-modal-message-view .messaging-modal-footer .jkhive-actionbutton-med:hover .jkhive-hex,
html body .jkhive-modal-message-view .messaging-modal-footer .jkhive-actionbutton-med > a:hover .jkhive-hex,
html body .jkhive-modal-message-view .messaging-modal-footer .jkhive-actionbutton-med a[data-tooltip="Salir"]:hover .jkhive-hex,
html body .jkhive-modal-message-view .messaging-modal-footer .jkhive-actionbutton-med:hover a[data-tooltip="Salir"] .jkhive-hex,
html body .jkhive-modal-message-view .messaging-modal-footer .jkhive-actionbutton-med:hover a[data-tooltip="Salir"]:hover .jkhive-hex,
html body .jkhive-modal-message-view .messaging-modal-footer .jkhive-actionbutton-med a[data-tooltip="Salir"]:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body .jkhive-modal-message-view .messaging-modal-footer .jkhive-actionbutton-med:hover a[data-tooltip="Salir"] .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-modal-footer .jkhive-actionbutton-med:hover .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-modal-footer .jkhive-actionbutton-med > a:hover .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-modal-footer .jkhive-actionbutton-med a[data-tooltip="Salir"]:hover .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-modal-footer .jkhive-actionbutton-med:hover a[data-tooltip="Salir"] .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-modal-footer .jkhive-actionbutton-med:hover a[data-tooltip="Salir"]:hover .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-modal-footer .jkhive-actionbutton-med a[data-tooltip="Salir"]:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
html body #jkhive-system-modal-container .jkhive-modal-message-view .messaging-modal-footer .jkhive-actionbutton-med:hover a[data-tooltip="Salir"] .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
body .jkhive-modal-message-view .messaging-modal-footer .jkhive-actionbutton-med:hover .jkhive-hex,
body .jkhive-modal-message-view .messaging-modal-footer .jkhive-actionbutton-med > a:hover .jkhive-hex,
body .jkhive-modal-message-view .messaging-modal-footer .jkhive-actionbutton-med a[data-tooltip="Salir"]:hover .jkhive-hex,
body .jkhive-modal-message-view .messaging-modal-footer .jkhive-actionbutton-med:hover a[data-tooltip="Salir"] .jkhive-hex,
body .jkhive-modal-message-view .messaging-modal-footer .jkhive-actionbutton-med:hover a[data-tooltip="Salir"]:hover .jkhive-hex,
body .jkhive-modal-message-view .messaging-modal-footer .jkhive-actionbutton-med a[data-tooltip="Salir"]:hover .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green),
body .jkhive-modal-message-view .messaging-modal-footer .jkhive-actionbutton-med:hover a[data-tooltip="Salir"] .jkhive-hex:not(.jkhive-hex-submit):not(.jkhive-hex-cyan):not(.jkhive-hex-red):not(.jkhive-hex-green) {
  background: linear-gradient(135deg, #00ff88, #00cc6a, #00ff88) !important;
  border-color: #00ff88 !important;
  box-shadow: 0 0 20px rgba(0, 255, 136, 0.8), 0 0 40px rgba(0, 255, 136, 0.6), inset 0 0 20px rgba(255, 255, 255, 0.3) !important;
  filter: brightness(1.2) drop-shadow(0 0 15px rgba(0, 255, 136, 0.9)) !important;
  transform: scale(0.9) !important;
}

/* ========================================
   ESTILOS OVERRIDE PARA BOTONES DE MENSAJERÍA
   ======================================== */
/* Contenedor de acciones - eliminar TODOS los espacios */
html body #jkhive-system-modal-container .jkhive-modal-msgs-vp .jkhive-modal-actions,
html body #jkhive-system-modal-container .jkhive-modal-msgs-e .jkhive-modal-actions,
html body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-modal-actions,
body #jkhive-system-modal-container .jkhive-modal-msgs-vp .jkhive-modal-actions,
body #jkhive-system-modal-container .jkhive-modal-msgs-e .jkhive-modal-actions,
body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-modal-actions {
  display: block !important;
  gap: 0 !important;
  row-gap: 0 !important;
  column-gap: 0 !important;
  justify-content: unset !important;
  flex-wrap: unset !important;
  flex-direction: unset !important;
  align-items: unset !important;
  font-size: 0 !important;
  letter-spacing: 0 !important;
  word-spacing: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* BOTONES - ELIMINAR TODOS LOS MÁRGENES Y APLICAR SOLO 1px DE SEPARACIÓN */
html body #jkhive-system-modal-container .jkhive-modal-msgs-vp .jkhive-modal-actions .jkhive-actionbutton-msgs,
html body #jkhive-system-modal-container .jkhive-modal-msgs-e .jkhive-modal-actions .jkhive-actionbutton-msgs,
html body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-modal-actions .jkhive-actionbutton-msgs,
body #jkhive-system-modal-container .jkhive-modal-msgs-vp .jkhive-modal-actions .jkhive-actionbutton-msgs,
body #jkhive-system-modal-container .jkhive-modal-msgs-e .jkhive-modal-actions .jkhive-actionbutton-msgs,
body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-modal-actions .jkhive-actionbutton-msgs {
  margin: 0 !important;
  margin-left: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding: 0 !important;
  display: inline-block !important;
  vertical-align: middle !important;
  min-width: 110px !important;
  transform: scale(0.9) !important;
  letter-spacing: 0 !important;
  word-spacing: 0 !important;
  float: none !important;
  position: relative !important;
  left: auto !important;
  right: auto !important;
  text-align: center !important;
  box-sizing: border-box !important;
  margin-right: 1px !important;
}

/* Sobrescribir completamente el estilo cyan general de jk-hive.css */
html body #jkhive-system-modal-container .jkhive-modal-msgs-vp .jkhive-actionbutton-msgs:hover .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal-msgs-e .jkhive-actionbutton-msgs:hover .jkhive-hex,
body #jkhive-system-modal-container .jkhive-modal-msgs-vp .jkhive-actionbutton-msgs:hover .jkhive-hex,
body #jkhive-system-modal-container .jkhive-modal-msgs-e .jkhive-actionbutton-msgs:hover .jkhive-hex {
  transform: scale(0.9) !important;
}

/* Hover en el botón o en el link - verde metálico brilloso para OK */
html body #jkhive-system-modal-container .jkhive-modal-msgs-vp .jkhive-actionbutton-msgs:hover .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal-msgs-e .jkhive-actionbutton-msgs:hover .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal-msgs-vp .jkhive-actionbutton-msgs .jkhive-system-modal-btn[data-action="ok"]:hover .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal-msgs-e .jkhive-actionbutton-msgs .jkhive-system-modal-btn[data-action="ok"]:hover .jkhive-hex,
body #jkhive-system-modal-container .jkhive-modal-msgs-vp .jkhive-actionbutton-msgs:hover .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex,
body #jkhive-system-modal-container .jkhive-modal-msgs-e .jkhive-actionbutton-msgs:hover .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex,
body #jkhive-system-modal-container .jkhive-modal-msgs-vp .jkhive-actionbutton-msgs .jkhive-system-modal-btn[data-action="ok"]:hover .jkhive-hex,
body #jkhive-system-modal-container .jkhive-modal-msgs-e .jkhive-actionbutton-msgs .jkhive-system-modal-btn[data-action="ok"]:hover .jkhive-hex {
  background: linear-gradient(135deg, #00ff88, #00cc6a, #00ff88) !important;
  border-color: #00ff88 !important;
  box-shadow: 0 0 20px rgba(0, 255, 136, 0.8), 0 0 40px rgba(0, 255, 136, 0.6), inset 0 0 20px rgba(255, 255, 255, 0.3) !important;
  filter: brightness(1.2) drop-shadow(0 0 15px rgba(0, 255, 136, 0.9)) !important;
  transform: scale(0.9) !important;
}

/* Botón Aceptar en modal de alertas - inicialmente amarillo miel metálico */
html body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-actionbutton-msgs .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-actionbutton-msgs .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex-honey,
body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-actionbutton-msgs .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex,
body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-actionbutton-msgs .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex-honey {
  background: var(--jk-accent-honey) !important;
  border-color: var(--jk-accent-honey) !important;
}

/* Hover en el botón o en el link - verde metálico brilloso para OK en alertas */
html body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-actionbutton-msgs:hover .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-actionbutton-msgs:hover .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex-honey,
html body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-actionbutton-msgs .jkhive-system-modal-btn[data-action="ok"]:hover .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-actionbutton-msgs .jkhive-system-modal-btn[data-action="ok"]:hover .jkhive-hex-honey,
html body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-actionbutton-msgs a:hover .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-actionbutton-msgs a:hover .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex-honey,
html body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-actionbutton-msgs a .jkhive-system-modal-btn[data-action="ok"]:hover .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-actionbutton-msgs a .jkhive-system-modal-btn[data-action="ok"]:hover .jkhive-hex-honey,
body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-actionbutton-msgs:hover .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex,
body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-actionbutton-msgs:hover .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex-honey,
body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-actionbutton-msgs .jkhive-system-modal-btn[data-action="ok"]:hover .jkhive-hex,
body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-actionbutton-msgs .jkhive-system-modal-btn[data-action="ok"]:hover .jkhive-hex-honey,
body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-actionbutton-msgs a:hover .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex,
body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-actionbutton-msgs a:hover .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex-honey,
body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-actionbutton-msgs a .jkhive-system-modal-btn[data-action="ok"]:hover .jkhive-hex,
body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-actionbutton-msgs a .jkhive-system-modal-btn[data-action="ok"]:hover .jkhive-hex-honey {
  background: linear-gradient(135deg, #00ff88, #00cc6a, #00ff88) !important;
  border-color: #00ff88 !important;
  box-shadow: 0 0 20px rgba(0, 255, 136, 0.8), 0 0 40px rgba(0, 255, 136, 0.6), inset 0 0 20px rgba(255, 255, 255, 0.3) !important;
  filter: brightness(1.2) drop-shadow(0 0 15px rgba(0, 255, 136, 0.9)) !important;
  transform: scale(0.9) !important;
}

/* Hover en el botón o en el link - rojo metálico brilloso para Cancel */
html body #jkhive-system-modal-container .jkhive-modal-msgs-vp .jkhive-actionbutton-msgs:hover .jkhive-system-modal-btn[data-action="cancel"] .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal-msgs-e .jkhive-actionbutton-msgs:hover .jkhive-system-modal-btn[data-action="cancel"] .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal-msgs-vp .jkhive-actionbutton-msgs .jkhive-system-modal-btn[data-action="cancel"]:hover .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal-msgs-e .jkhive-actionbutton-msgs .jkhive-system-modal-btn[data-action="cancel"]:hover .jkhive-hex,
body #jkhive-system-modal-container .jkhive-modal-msgs-vp .jkhive-actionbutton-msgs:hover .jkhive-system-modal-btn[data-action="cancel"] .jkhive-hex,
body #jkhive-system-modal-container .jkhive-modal-msgs-e .jkhive-actionbutton-msgs:hover .jkhive-system-modal-btn[data-action="cancel"] .jkhive-hex,
body #jkhive-system-modal-container .jkhive-modal-msgs-vp .jkhive-actionbutton-msgs .jkhive-system-modal-btn[data-action="cancel"]:hover .jkhive-hex,
body #jkhive-system-modal-container .jkhive-modal-msgs-e .jkhive-actionbutton-msgs .jkhive-system-modal-btn[data-action="cancel"]:hover .jkhive-hex {
  background: linear-gradient(135deg, #ff3366, #cc0033, #ff3366) !important;
  border-color: #ff3366 !important;
  box-shadow: 0 0 20px rgba(255, 51, 102, 0.8), 0 0 40px rgba(255, 51, 102, 0.6), inset 0 0 20px rgba(255, 255, 255, 0.3) !important;
  filter: brightness(1.2) drop-shadow(0 0 15px rgba(255, 51, 102, 0.9)) !important;
  transform: scale(0.9) !important;
}

/* Último botón sin margen derecho */
html body #jkhive-system-modal-container .jkhive-modal-msgs-vp .jkhive-modal-actions .jkhive-actionbutton-msgs:last-child,
html body #jkhive-system-modal-container .jkhive-modal-msgs-e .jkhive-modal-actions .jkhive-actionbutton-msgs:last-child,
html body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-modal-actions .jkhive-actionbutton-msgs:last-child,
body #jkhive-system-modal-container .jkhive-modal-msgs-vp .jkhive-modal-actions .jkhive-actionbutton-msgs:last-child,
body #jkhive-system-modal-container .jkhive-modal-msgs-e .jkhive-modal-actions .jkhive-actionbutton-msgs:last-child,
body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-modal-actions .jkhive-actionbutton-msgs:last-child {
  margin-right: 0 !important;
}

/* SOBRESCRIBIR TODOS LOS ESTILOS DE .jkhive-actionbutton-med QUE ESTÉN INTERFIRIENDO */
html body #jkhive-system-modal-container .jkhive-modal-msgs-vp .jkhive-modal-actions .jkhive-actionbutton-med,
html body #jkhive-system-modal-container .jkhive-modal-msgs-e .jkhive-modal-actions .jkhive-actionbutton-med,
html body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-modal-actions .jkhive-actionbutton-med,
body #jkhive-system-modal-container .jkhive-modal-msgs-vp .jkhive-modal-actions .jkhive-actionbutton-med,
body #jkhive-system-modal-container .jkhive-modal-msgs-e .jkhive-modal-actions .jkhive-actionbutton-med,
body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-modal-actions .jkhive-actionbutton-med {
  margin: 0 !important;
  margin-right: 0 !important;
  padding: 0 !important;
}

/* Texto en negrita para los botones */
html body #jkhive-system-modal-container .jkhive-modal-msgs-vp .jkhive-actionbutton-msgs .jkhive-hex-text,
html body #jkhive-system-modal-container .jkhive-modal-msgs-e .jkhive-actionbutton-msgs .jkhive-hex-text,
html body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-actionbutton-msgs .jkhive-hex-text,
body #jkhive-system-modal-container .jkhive-modal-msgs-vp .jkhive-actionbutton-msgs .jkhive-hex-text,
body #jkhive-system-modal-container .jkhive-modal-msgs-e .jkhive-actionbutton-msgs .jkhive-hex-text,
body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-actionbutton-msgs .jkhive-hex-text {
  font-weight: bold !important;
}

/* ========================================
   MODALES DE LIBROS - ESTILOS BASE
   ======================================== */
/* Modal agregar/editar libro - .jkhive-add-new-book */
html body .jkhive-add-new-book,
html body #jkhive-system-modal-container .jkhive-add-new-book,
body .jkhive-add-new-book {
  z-index: 9999 !important;
}

html body .jkhive-add-new-book.jkhive-modal[style*="display: flex"],
html body .jkhive-add-new-book.jkhive-modal.active,
html body .jkhive-add-new-book.jkhive-modal.show,
html body #jkhive-system-modal-container .jkhive-add-new-book.jkhive-modal[style*="display: flex"],
html body #jkhive-system-modal-container .jkhive-add-new-book.jkhive-modal.active,
html body #jkhive-system-modal-container .jkhive-add-new-book.jkhive-modal.show,
body .jkhive-add-new-book.jkhive-modal[style*="display: flex"],
body .jkhive-add-new-book.jkhive-modal.active,
body .jkhive-add-new-book.jkhive-modal.show {
  display: flex !important;
  position: fixed !important;
  inset: 0 !important;
  justify-content: center !important;
  align-items: center !important;
  opacity: 1 !important;
}

html body .jkhive-add-new-book.jkhive-modal.active .jkhive-modal-overlay,
html body .jkhive-add-new-book.jkhive-modal.show .jkhive-modal-overlay,
html body #jkhive-system-modal-container .jkhive-add-new-book.jkhive-modal.active .jkhive-modal-overlay,
html body #jkhive-system-modal-container .jkhive-add-new-book.jkhive-modal.show .jkhive-modal-overlay,
body .jkhive-add-new-book.jkhive-modal.active .jkhive-modal-overlay,
body .jkhive-add-new-book.jkhive-modal.show .jkhive-modal-overlay {
  background: rgba(244, 196, 48, 0.8) !important;
  backdrop-filter: blur(10px) !important;
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  z-index: 1 !important;
  pointer-events: auto !important;
  cursor: pointer !important;
}

html body .jkhive-add-new-book .jkhive-modal-content,
html body #jkhive-system-modal-container .jkhive-add-new-book .jkhive-modal-content,
body .jkhive-add-new-book .jkhive-modal-content {
  width: 90% !important;
  max-width: 900px !important;
  min-width: 0 !important;
  aspect-ratio: 1 / 1.1547 !important;
  clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%) !important;
  background: linear-gradient(135deg, var(--jk-tech-darker) 0%, var(--jk-tech-dark) 50%, var(--jk-primary-blue-darker) 100%) !important;
  border: 3px solid var(--jk-accent-cyan) !important;
  border-radius: 0 !important;
  padding: 0 !important;
  position: relative !important;
  z-index: 10 !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  margin: auto !important;
  pointer-events: auto !important;
}

html body .jkhive-add-new-book .jkhive-modal-content::before,
html body #jkhive-system-modal-container .jkhive-add-new-book .jkhive-modal-content::before,
body .jkhive-add-new-book .jkhive-modal-content::before {
  content: '' !important;
  position: absolute !important;
  inset: -4px !important;
  clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%) !important;
  background: linear-gradient(135deg, var(--jk-accent-cyan), var(--jk-primary-blue-light)) !important;
  z-index: 0 !important;
  opacity: 0.3 !important;
  pointer-events: none !important;
}

/* Modal categorías de libros - .jkhive-book-cat-modal */
html body .jkhive-book-cat-modal,
html body #jkhive-system-modal-container .jkhive-book-cat-modal,
body .jkhive-book-cat-modal {
  z-index: 9999 !important;
}

html body .jkhive-book-cat-modal .jkhive-modal-content,
html body #jkhive-system-modal-container .jkhive-book-cat-modal .jkhive-modal-content,
body .jkhive-book-cat-modal .jkhive-modal-content {
  width: 90% !important;
  max-width: 800px !important;
  min-width: 0 !important;
  aspect-ratio: 1 / 1.1547 !important;
  clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%) !important;
  background: linear-gradient(135deg, var(--jk-tech-darker) 0%, var(--jk-tech-dark) 50%, var(--jk-primary-blue-darker) 100%) !important;
  border: 3px solid var(--jk-accent-cyan) !important;
  border-radius: 0 !important;
  padding: 0 !important;
  position: relative !important;
  z-index: 10 !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
}

/* Modal referencias de libros - .jkhive-book-ref-modal */
html body .jkhive-book-ref-modal,
html body #jkhive-system-modal-container .jkhive-book-ref-modal,
body .jkhive-book-ref-modal {
  z-index: 9999 !important;
}

html body .jkhive-book-ref-modal .jkhive-modal-content,
html body #jkhive-system-modal-container .jkhive-book-ref-modal .jkhive-modal-content,
body .jkhive-book-ref-modal .jkhive-modal-content {
  width: 90% !important;
  max-width: 800px !important;
  min-width: 0 !important;
  aspect-ratio: 1 / 1.1547 !important;
  clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%) !important;
  background: linear-gradient(135deg, var(--jk-tech-darker) 0%, var(--jk-tech-dark) 50%, var(--jk-primary-blue-darker) 100%) !important;
  border: 3px solid var(--jk-accent-cyan) !important;
  border-radius: 0 !important;
  padding: 0 !important;
  position: relative !important;
  z-index: 10 !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
}

/* Modal sagas de libros - .jkhive-book-saga-modal */
html body .jkhive-book-saga-modal,
html body #jkhive-system-modal-container .jkhive-book-saga-modal,
body .jkhive-book-saga-modal {
  z-index: 9999 !important;
}

html body .jkhive-book-saga-modal .jkhive-modal-content,
html body #jkhive-system-modal-container .jkhive-book-saga-modal .jkhive-modal-content,
body .jkhive-book-saga-modal .jkhive-modal-content {
  width: 90% !important;
  max-width: 800px !important;
  min-width: 0 !important;
  aspect-ratio: 1 / 1.1547 !important;
  clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%) !important;
  background: linear-gradient(135deg, var(--jk-tech-darker) 0%, var(--jk-tech-dark) 50%, var(--jk-primary-blue-darker) 100%) !important;
  border: 3px solid var(--jk-accent-cyan) !important;
  border-radius: 0 !important;
  padding: 0 !important;
  position: relative !important;
  z-index: 10 !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
}

/* ========================================
   SISTEMA DE MENSAJES DEL SISTEMA
   #jkhive-system-modal-container
   ======================================== */

/* Asegurar que el contenedor no interfiera con el posicionamiento de los modales */
html body #jkhive-system-modal-container,
body #jkhive-system-modal-container {
  position: fixed !important;
  inset: 0 !important;
  z-index: 10000 !important;
  pointer-events: none !important;
  display: block !important;
  visibility: visible !important;
}

/* Asegurar que los modales del sistema de mensajes aparezcan por encima de otros modales */
html body #jkhive-system-modal-container .jkhive-modal,
body #jkhive-system-modal-container .jkhive-modal {
  position: fixed !important;
  inset: 0 !important;
  z-index: 10001 !important;
  pointer-events: auto !important;
  display: none !important;
  justify-content: center !important;
  align-items: center !important;
  opacity: 0 !important;
  transition: opacity 0.3s ease !important;
}

/* Selectores más específicos para asegurar que los modales se muestren */
html body #jkhive-system-modal-container .jkhive-modal.show,
html body #jkhive-system-modal-container .jkhive-modal.active,
html body #jkhive-system-modal-container .jkhive-modal.show.active,
html body #jkhive-system-modal-container .jkhive-modal.jkhive-modal-msgs-vp.show,
html body #jkhive-system-modal-container .jkhive-modal.jkhive-modal-msgs-vp.active,
html body #jkhive-system-modal-container .jkhive-modal.jkhive-modal-msgs-vp.show.active,
html body #jkhive-system-modal-container .jkhive-modal.jkhive-modal-msgs-e.show,
html body #jkhive-system-modal-container .jkhive-modal.jkhive-modal-msgs-e.active,
html body #jkhive-system-modal-container .jkhive-modal.jkhive-modal-msgs-e.show.active,
html body #jkhive-system-modal-container .jkhive-modal.jkhive-msgs-alerts.show,
html body #jkhive-system-modal-container .jkhive-modal.jkhive-msgs-alerts.active,
html body #jkhive-system-modal-container .jkhive-modal.jkhive-msgs-alerts.show.active,
body #jkhive-system-modal-container .jkhive-modal.show,
body #jkhive-system-modal-container .jkhive-modal.active {
  display: flex !important;
  opacity: 1 !important;
  visibility: visible !important;
}



/* Overlay genérico para otros modales del sistema (sin textura) */
html body #jkhive-system-modal-container .jkhive-modal-overlay:not(.jkhive-msgs-alerts .jkhive-modal-overlay),
body #jkhive-system-modal-container .jkhive-modal-overlay:not(.jkhive-msgs-alerts .jkhive-modal-overlay) {
  z-index: 10000 !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  position: absolute !important;
  inset: 0 !important;
  background: rgba(244, 196, 48, 0.8) !important;
  backdrop-filter: blur(10px) !important;
}

/* Contenido genérico para otros modales del sistema (rectangular) */
html body #jkhive-system-modal-container .jkhive-modal-content:not(.jkhive-modal-hex),
body #jkhive-system-modal-container .jkhive-modal-content:not(.jkhive-modal-hex) {
  z-index: 10001 !important;
  position: relative !important;
  text-align: center !important;
  background: linear-gradient(135deg, var(--jk-tech-darker) 0%, var(--jk-tech-dark) 50%, var(--jk-primary-blue-darker) 100%) !important;
  border: 3px solid var(--jk-accent-cyan) !important;
  border-radius: 20px !important;
  padding: 3rem 2.5rem !important;
  max-width: 700px !important;
  max-height: 90vh !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  box-shadow: 0 20px 60px rgba(14, 165, 233, 0.4), inset 0 0 60px rgba(14, 165, 233, 0.1) !important;
  animation: modalSlideIn 0.4s ease-out !important;
}

html body #jkhive-system-modal-container .jkhive-modal-content::-webkit-scrollbar,
body #jkhive-system-modal-container .jkhive-modal-content::-webkit-scrollbar {
  display: none !important;
}

html body #jkhive-system-modal-container .jkhive-system-modal-btn,
body #jkhive-system-modal-container .jkhive-system-modal-btn {
  cursor: pointer !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  text-decoration: none !important;
}

html body #jkhive-system-modal-container .jkhive-system-modal-btn:hover,
body #jkhive-system-modal-container .jkhive-system-modal-btn:hover {
  text-decoration: none !important;
}

/* Asegurar que los action buttons en el modal se vean bien */
html body #jkhive-system-modal-container .jkhive-modal-actions .jkhive-actionbutton-med,
body #jkhive-system-modal-container .jkhive-modal-actions .jkhive-actionbutton-med {
  min-width: 150px !important;
}

/* Action buttons específicos de mensajería - MÁXIMA ESPECIFICIDAD CON ID */
/* SEPARACIÓN MÍNIMA DE 1px */
html body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-modal-actions .jkhive-actionbutton-msgs,
body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-modal-actions .jkhive-actionbutton-msgs {
  margin: 0 !important;
  margin-left: 0 !important;
  margin-right: 1px !important; /* Separación horizontal MÍNIMA de 1px */
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding: 0 !important;
  display: inline-block !important;
  vertical-align: middle !important;
  min-width: 110px !important;
  transform: scale(0.9) !important;
  letter-spacing: 0 !important;
  word-spacing: 0 !important;
  float: none !important;
  position: relative !important;
  left: auto !important;
  right: auto !important;
  text-align: center !important;
  box-sizing: border-box !important;
}

html body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-modal-actions .jkhive-actionbutton-msgs:last-child,
body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-modal-actions .jkhive-actionbutton-msgs:last-child {
  margin-right: 0 !important;
}

/* Link dentro del botón */
html body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-modal-actions .jkhive-actionbutton-msgs > a,
body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-modal-actions .jkhive-actionbutton-msgs > a {
  margin: 0 !important;
  padding: 0 !important;
  display: block !important;
  text-align: center !important;
  width: 100% !important;
  font-size: 1rem !important; /* Restaurar tamaño de fuente */
}

/* Hexágono dentro del botón */
html body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-actionbutton-msgs .jkhive-hex,
body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-actionbutton-msgs .jkhive-hex {
  margin: 0 auto !important;
  display: block !important;
  margin-left: auto !important;
  margin-right: auto !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* ============================================
   MODAL DE ALERTAS - ESTILOS EXACTOS COMO LOS QUE FUNCIONAN
   Replicando el patrón exacto de jkhive-modal-msgs-vp y jkhive-modal-msgs-e
   ============================================ */
html body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-actionbutton-msgs .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-actionbutton-msgs .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex-honey,
body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-actionbutton-msgs .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex,
body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-actionbutton-msgs .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex-honey {
  background: var(--jk-accent-honey) !important;
  border-color: var(--jk-accent-honey) !important;
}

html body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-actionbutton-msgs .jkhive-system-modal-btn[data-action="ok"]:hover .jkhive-hex,
body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-actionbutton-msgs .jkhive-system-modal-btn[data-action="ok"]:hover .jkhive-hex {
  /* Verde oscuro metálico brillante */
  background: linear-gradient(135deg, #00ff88, #00cc6a, #00ff88) !important;
  border-color: #00ff88 !important;
  box-shadow: 
    0 0 20px rgba(0, 255, 136, 0.8),
    0 0 40px rgba(0, 255, 136, 0.6),
    inset 0 0 20px rgba(255, 255, 255, 0.3) !important;
  filter: brightness(1.2) drop-shadow(0 0 15px rgba(0, 255, 136, 0.9)) !important;
  transform: scale(0.9) !important;
}

/* SOBRESCRIBIR ESTILOS GENERALES PARA MODALES DE MENSAJERÍA (otros tipos) */
html body #jkhive-system-modal-container .jkhive-modal-msgs-vp .jkhive-modal-actions .jkhive-actionbutton-msgs,
html body #jkhive-system-modal-container .jkhive-modal-msgs-e .jkhive-modal-actions .jkhive-actionbutton-msgs,
body #jkhive-system-modal-container .jkhive-modal-msgs-vp .jkhive-modal-actions .jkhive-actionbutton-msgs,
body #jkhive-system-modal-container .jkhive-modal-msgs-e .jkhive-modal-actions .jkhive-actionbutton-msgs {
  min-width: 110px !important;
  margin-right: 1px !important;
}

html body #jkhive-system-modal-container .jkhive-modal-msgs-vp .jkhive-modal-actions .jkhive-actionbutton-msgs:last-child,
html body #jkhive-system-modal-container .jkhive-modal-msgs-e .jkhive-modal-actions .jkhive-actionbutton-msgs:last-child,
body #jkhive-system-modal-container .jkhive-modal-msgs-vp .jkhive-modal-actions .jkhive-actionbutton-msgs:last-child,
body #jkhive-system-modal-container .jkhive-modal-msgs-e .jkhive-modal-actions .jkhive-actionbutton-msgs:last-child {
  margin-right: 0 !important;
}

/* SOBRESCRIBIR TODOS LOS ESTILOS DE .jkhive-actionbutton-med DENTRO DE MODALES DE MENSAJERÍA */
html body #jkhive-system-modal-container .jkhive-modal-msgs-vp .jkhive-modal-actions .jkhive-actionbutton-med,
html body #jkhive-system-modal-container .jkhive-modal-msgs-e .jkhive-modal-actions .jkhive-actionbutton-med,
html body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-modal-actions .jkhive-actionbutton-med,
body #jkhive-system-modal-container .jkhive-modal-msgs-vp .jkhive-modal-actions .jkhive-actionbutton-med,
body #jkhive-system-modal-container .jkhive-modal-msgs-e .jkhive-modal-actions .jkhive-actionbutton-med,
body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-modal-actions .jkhive-actionbutton-med {
  margin: 0 !important;
  margin-right: 0 !important;
  padding: 0 !important;
}

/* Header, icono, título para alertas */
html body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-modal-header,
body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-modal-header {
  margin-bottom: 0.75rem !important;
}

html body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-modal-icon,
body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-modal-icon {
  font-size: 4rem !important; /* Duplicado: 2rem * 2 = 4rem (100% más grande) */
  margin-bottom: 0.5rem !important;
}

/* Agrandar imágenes y SVGs dentro del ícono */
html body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-modal-icon img,
html body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-modal-icon svg,
body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-modal-icon img,
body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-modal-icon svg {
  width: 200% !important; /* Duplicar tamaño (100% más grande) */
  height: 200% !important;
  max-width: none !important;
  max-height: none !important;
}

html body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-modal-title,
body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-modal-title {
  font-size: 1.25rem !important;
  margin-bottom: 0.4rem !important;
}

html body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-modal-body,
body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-modal-body {
  margin-bottom: 1rem !important;
}

html body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-modal-description,
body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-modal-description {
  font-size: 0.95rem !important;
  line-height: 1.4 !important;
  margin-bottom: 0 !important;
}

/* ACCIONES - BOTONES JUNTOS - ESTILO COMPLETAMENTE INDEPENDIENTE */
html body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-modal-actions,
body #jkhive-system-modal-container .jkhive-msgs-alerts .jkhive-modal-actions {
  display: block !important;
  text-align: center !important;
  margin: 0 !important;
  padding: 0 !important;
  gap: 0 !important;
  row-gap: 0 !important;
  column-gap: 0 !important;
  flex-direction: unset !important;
  flex-wrap: unset !important;
  justify-content: unset !important;
  align-items: unset !important;
  font-size: 0 !important; /* Eliminar espacio entre elementos inline-block */
  letter-spacing: 0 !important;
  word-spacing: 0 !important;
}

/* Estilos genéricos para otros modales del sistema */
html body #jkhive-system-modal-container .jkhive-modal-icon:not(.jkhive-msgs-alerts .jkhive-modal-icon),
body #jkhive-system-modal-container .jkhive-modal-icon:not(.jkhive-msgs-alerts .jkhive-modal-icon) {
  font-size: 4rem !important;
  margin-bottom: 1.5rem !important;
  filter: drop-shadow(0 0 20px currentColor) !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

html body #jkhive-system-modal-container .jkhive-modal-title:not(.jkhive-msgs-alerts .jkhive-modal-title),
body #jkhive-system-modal-container .jkhive-modal-title:not(.jkhive-msgs-alerts .jkhive-modal-title) {
  font-size: 2rem !important;
  margin-bottom: 1rem !important;
  color: var(--jk-accent-honey) !important;
  font-weight: 700 !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

html body #jkhive-system-modal-container .jkhive-modal-description:not(.jkhive-msgs-alerts .jkhive-modal-description),
html body #jkhive-system-modal-container .jkhive-modal-body p:not(.jkhive-msgs-alerts .jkhive-modal-body p),
body #jkhive-system-modal-container .jkhive-modal-description:not(.jkhive-msgs-alerts .jkhive-modal-description),
body #jkhive-system-modal-container .jkhive-modal-body p:not(.jkhive-msgs-alerts .jkhive-modal-body p) {
  font-size: 1.1rem !important;
  line-height: 1.6 !important;
  color: var(--jk-metal-light) !important;
  margin-bottom: 0 !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

html body #jkhive-system-modal-container .jkhive-modal-header:not(.jkhive-msgs-alerts .jkhive-modal-header),
body #jkhive-system-modal-container .jkhive-modal-header:not(.jkhive-msgs-alerts .jkhive-modal-header) {
  text-align: center !important;
  margin-bottom: 2rem !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

html body #jkhive-system-modal-container .jkhive-modal-body:not(.jkhive-msgs-alerts .jkhive-modal-body),
body #jkhive-system-modal-container .jkhive-modal-body:not(.jkhive-msgs-alerts .jkhive-modal-body) {
  margin-bottom: 2rem !important;
  text-align: center !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

html body #jkhive-system-modal-container .jkhive-modal-actions,
body #jkhive-system-modal-container .jkhive-modal-actions {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 1rem !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* Responsive */
@media (max-width: 768px) {
  html body #jkhive-system-modal-container .jkhive-modal-content,
  body #jkhive-system-modal-container .jkhive-modal-content {
    max-width: 90% !important;
    padding: 2rem 1.5rem !important;
  }
  
  html body #jkhive-system-modal-container .jkhive-modal-icon,
  body #jkhive-system-modal-container .jkhive-modal-icon {
    font-size: 3rem !important;
  }
  
  html body #jkhive-system-modal-container .jkhive-modal-title,
  body #jkhive-system-modal-container .jkhive-modal-title {
    font-size: 1.5rem !important;
  }
  
  html body #jkhive-system-modal-container .jkhive-modal-description,
  html body #jkhive-system-modal-container .jkhive-modal-body p,
  body #jkhive-system-modal-container .jkhive-modal-description,
  body #jkhive-system-modal-container .jkhive-modal-body p {
    font-size: 1rem !important;
  }
  
  html body #jkhive-system-modal-container .jkhive-modal-actions,
  body #jkhive-system-modal-container .jkhive-modal-actions {
    flex-direction: column !important;
    align-items: center !important;
  }
  
  html body #jkhive-system-modal-container .jkhive-modal-actions .jkhive-actionbutton-med,
  body #jkhive-system-modal-container .jkhive-modal-actions .jkhive-actionbutton-med {
    width: 100% !important;
    max-width: 200px !important;
  }
}

/* ========================================
   BOTONES DE ACCIÓN UNIVERSALES PARA TODOS LOS MODALES
   Estilos individualizados, blindados e inmunes
   ======================================== */

/* Contenedor de acciones - UNIVERSAL */
html body .jkhive-modal .jkhive-modal-actions,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions,
body .jkhive-modal .jkhive-modal-actions {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 1rem !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* Botones de acción - TAMAÑO MEDIUM UNIVERSAL */
html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med {
  width: 65.17px !important;
  height: calc(65.17px * 1.1547) !important;
  position: relative !important;
  margin: 0 !important;
  z-index: 1 !important;
  display: block !important;
  transform: none !important;
  overflow: visible !important;
  clip-path: none !important;
  flex-shrink: 0 !important;
}

/* Hexágono base de los botones - UNIVERSAL */
html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex {
  width: 65.17px !important;
  height: calc(65.17px * 1.1547) !important;
  margin: 0 auto !important;
  border: none !important;
  clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%) !important;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
  transform-origin: center center !important;
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  pointer-events: none !important;
}

/* Hexágono interno (contenido) - UNIVERSAL */
html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex::after,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex::after,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex::after {
  content: '' !important;
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  width: calc(65.17px - 4px) !important;
  height: calc((65.17px - 4px) * 1.1547) !important;
  background: var(--jk-tech-dark) !important;
  clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%) !important;
  z-index: 1 !important;
  pointer-events: none !important;
  transition: background 0.3s ease, transform 0.3s ease !important;
}

/* Ocultar ::before */
html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex::before,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex::before,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex::before {
  display: none !important;
}

/* Contenido del hexágono - UNIVERSAL */
html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex-content,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex-content,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex-content {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  width: 100% !important;
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  z-index: 3 !important;
  padding: 0 !important;
}

/* Clase editorial para contenido */
html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex-content.jkhive-hex-content-editorial,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex-content.jkhive-hex-content-editorial,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex-content.jkhive-hex-content-editorial {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
}

/* Iconos de los botones - UNIVERSAL */
html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex-icon,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex-icon {
  font-size: 1.46625rem !important;
  transition: color 0.3s ease, transform 0.3s ease !important;
  z-index: 4 !important;
  position: relative !important;
}

/* Botones dentro del actionbutton - UNIVERSAL */
html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med > button,
html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med > a,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med > button,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med > a,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med > button,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med > a {
  background: none !important;
  border: none !important;
  padding: 0 !important;
  cursor: pointer !important;
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  position: relative !important;
  z-index: 10 !important;
  text-decoration: none !important;
}

/* ========================================
   BOTÓN ACEPTAR (OK) - VERDE METÁLICO BRILLANTE
   ======================================== */
html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med[data-action="ok"] .jkhive-hex,
html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med button[data-action="ok"] .jkhive-hex,
html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med[data-action="ok"] .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med button[data-action="ok"] .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med[data-action="ok"] .jkhive-hex,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med button[data-action="ok"] .jkhive-hex,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex {
  background: var(--jk-secondary-green, #14b8a6) !important;
  box-shadow: var(--jk-shadow-lg), 0 0 20px rgba(20, 184, 166, 0.6) !important;
}

html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med[data-action="ok"] .jkhive-hex-icon,
html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med button[data-action="ok"] .jkhive-hex-icon,
html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med[data-action="ok"] .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med button[data-action="ok"] .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex-icon,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med[data-action="ok"] .jkhive-hex-icon,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med button[data-action="ok"] .jkhive-hex-icon,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex-icon {
  color: #ffffff !important;
}

/* Hover: Aceptar - Verde metálico brillante */
html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med[data-action="ok"]:hover .jkhive-hex,
html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover button[data-action="ok"] .jkhive-hex,
html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med[data-action="ok"]:hover .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover button[data-action="ok"] .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med[data-action="ok"]:hover .jkhive-hex,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover button[data-action="ok"] .jkhive-hex,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex {
  background: linear-gradient(135deg, #00ff88, #00cc6a, #00ff88) !important;
  box-shadow: 0 0 20px rgba(0, 255, 136, 0.8), 0 0 40px rgba(0, 255, 136, 0.6), inset 0 0 20px rgba(255, 255, 255, 0.3) !important;
  filter: brightness(1.2) drop-shadow(0 0 15px rgba(0, 255, 136, 0.9)) !important;
  transform: scale(1.05) !important;
}

html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med[data-action="ok"]:hover .jkhive-hex-icon,
html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover button[data-action="ok"] .jkhive-hex-icon,
html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med[data-action="ok"]:hover .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover button[data-action="ok"] .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex-icon,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med[data-action="ok"]:hover .jkhive-hex-icon,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover button[data-action="ok"] .jkhive-hex-icon,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex-icon {
  color: #ffffff !important;
  transform: rotate(180deg) !important;
}

/* ========================================
   BOTÓN GUARDAR (SAVE) - AZUL/CYAN METÁLICO BRILLANTE
   ======================================== */
html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med[data-action="save"] .jkhive-hex,
html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med button[data-action="save"] .jkhive-hex,
html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-system-modal-btn[data-action="save"] .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med[data-action="save"] .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med button[data-action="save"] .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-system-modal-btn[data-action="save"] .jkhive-hex,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med[data-action="save"] .jkhive-hex,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med button[data-action="save"] .jkhive-hex,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-system-modal-btn[data-action="save"] .jkhive-hex {
  background: linear-gradient(135deg, var(--jk-primary-blue-dark, #0284c7) 0%, var(--jk-primary-blue, #0ea5e9) 50%, var(--jk-primary-blue-light, #38bdf8) 100%) !important;
  box-shadow: var(--jk-shadow-lg), 0 0 20px rgba(14, 165, 233, 0.6) !important;
}

html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med[data-action="save"] .jkhive-hex-icon,
html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med button[data-action="save"] .jkhive-hex-icon,
html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-system-modal-btn[data-action="save"] .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med[data-action="save"] .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med button[data-action="save"] .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-system-modal-btn[data-action="save"] .jkhive-hex-icon,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med[data-action="save"] .jkhive-hex-icon,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med button[data-action="save"] .jkhive-hex-icon,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-system-modal-btn[data-action="save"] .jkhive-hex-icon {
  color: #ffffff !important;
}

/* Hover: Guardar - Cyan metálico brillante */
html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med[data-action="save"]:hover .jkhive-hex,
html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover button[data-action="save"] .jkhive-hex,
html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover .jkhive-system-modal-btn[data-action="save"] .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med[data-action="save"]:hover .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover button[data-action="save"] .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover .jkhive-system-modal-btn[data-action="save"] .jkhive-hex,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med[data-action="save"]:hover .jkhive-hex,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover button[data-action="save"] .jkhive-hex,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover .jkhive-system-modal-btn[data-action="save"] .jkhive-hex {
  background: linear-gradient(135deg, var(--jk-accent-cyan, #06b6d4) 0%, var(--jk-primary-blue-light, #38bdf8) 50%, var(--jk-accent-cyan, #06b6d4) 100%) !important;
  box-shadow: 0 0 20px rgba(6, 182, 212, 0.8), 0 0 40px rgba(6, 182, 212, 0.6), inset 0 0 20px rgba(255, 255, 255, 0.3) !important;
  filter: brightness(1.2) drop-shadow(0 0 15px rgba(6, 182, 212, 0.9)) !important;
  transform: scale(1.05) !important;
}

html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med[data-action="save"]:hover .jkhive-hex-icon,
html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover button[data-action="save"] .jkhive-hex-icon,
html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover .jkhive-system-modal-btn[data-action="save"] .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med[data-action="save"]:hover .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover button[data-action="save"] .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover .jkhive-system-modal-btn[data-action="save"] .jkhive-hex-icon,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med[data-action="save"]:hover .jkhive-hex-icon,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover button[data-action="save"] .jkhive-hex-icon,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover .jkhive-system-modal-btn[data-action="save"] .jkhive-hex-icon {
  color: #ffffff !important;
  transform: rotate(180deg) !important;
}

/* ========================================
   BOTÓN CANCELAR (CANCEL) - ROJO METÁLICO BRILLANTE
   ======================================== */
html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med[data-action="cancel"] .jkhive-hex,
html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med button[data-action="cancel"] .jkhive-hex,
html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-system-modal-btn[data-action="cancel"] .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med[data-action="cancel"] .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med button[data-action="cancel"] .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-system-modal-btn[data-action="cancel"] .jkhive-hex,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med[data-action="cancel"] .jkhive-hex,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med button[data-action="cancel"] .jkhive-hex,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-system-modal-btn[data-action="cancel"] .jkhive-hex {
  background: var(--jk-accent-honey, #d4a017) !important;
  box-shadow: var(--jk-shadow-lg), 0 0 20px rgba(212, 160, 23, 0.6) !important;
}

html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med[data-action="cancel"] .jkhive-hex-icon,
html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med button[data-action="cancel"] .jkhive-hex-icon,
html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-system-modal-btn[data-action="cancel"] .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med[data-action="cancel"] .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med button[data-action="cancel"] .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-system-modal-btn[data-action="cancel"] .jkhive-hex-icon,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med[data-action="cancel"] .jkhive-hex-icon,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med button[data-action="cancel"] .jkhive-hex-icon,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-system-modal-btn[data-action="cancel"] .jkhive-hex-icon {
  color: #ffffff !important;
}

/* Hover: Cancelar - Rojo metálico brillante */
html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med[data-action="cancel"]:hover .jkhive-hex,
html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover button[data-action="cancel"] .jkhive-hex,
html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover .jkhive-system-modal-btn[data-action="cancel"] .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med[data-action="cancel"]:hover .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover button[data-action="cancel"] .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover .jkhive-system-modal-btn[data-action="cancel"] .jkhive-hex,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med[data-action="cancel"]:hover .jkhive-hex,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover button[data-action="cancel"] .jkhive-hex,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover .jkhive-system-modal-btn[data-action="cancel"] .jkhive-hex {
  background: linear-gradient(135deg, #ff3366, #cc0033, #ff3366) !important;
  box-shadow: 0 0 20px rgba(255, 51, 102, 0.8), 0 0 40px rgba(255, 51, 102, 0.6), inset 0 0 20px rgba(255, 255, 255, 0.3) !important;
  filter: brightness(1.2) drop-shadow(0 0 15px rgba(255, 51, 102, 0.9)) !important;
  transform: scale(1.05) !important;
}

html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med[data-action="cancel"]:hover .jkhive-hex-icon,
html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover button[data-action="cancel"] .jkhive-hex-icon,
html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover .jkhive-system-modal-btn[data-action="cancel"] .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med[data-action="cancel"]:hover .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover button[data-action="cancel"] .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover .jkhive-system-modal-btn[data-action="cancel"] .jkhive-hex-icon,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med[data-action="cancel"]:hover .jkhive-hex-icon,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover button[data-action="cancel"] .jkhive-hex-icon,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover .jkhive-system-modal-btn[data-action="cancel"] .jkhive-hex-icon {
  color: #ffffff !important;
  transform: rotate(180deg) !important;
}

/* ========================================
   BOTÓN SALIR (EXIT) - AMARILLO MIEL METÁLICO
   ======================================== */
html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med[data-action="exit"] .jkhive-hex,
html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med button[data-action="exit"] .jkhive-hex,
html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-system-modal-btn[data-action="exit"] .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med[data-action="exit"] .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med button[data-action="exit"] .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-system-modal-btn[data-action="exit"] .jkhive-hex,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med[data-action="exit"] .jkhive-hex,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med button[data-action="exit"] .jkhive-hex,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-system-modal-btn[data-action="exit"] .jkhive-hex {
  background: var(--jk-accent-honey-light, #f4c430) !important;
  box-shadow: var(--jk-shadow-lg), 0 0 20px rgba(244, 196, 48, 0.6) !important;
}

html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med[data-action="exit"] .jkhive-hex-icon,
html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med button[data-action="exit"] .jkhive-hex-icon,
html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-system-modal-btn[data-action="exit"] .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med[data-action="exit"] .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med button[data-action="exit"] .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-system-modal-btn[data-action="exit"] .jkhive-hex-icon,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med[data-action="exit"] .jkhive-hex-icon,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med button[data-action="exit"] .jkhive-hex-icon,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-system-modal-btn[data-action="exit"] .jkhive-hex-icon {
  color: var(--jk-tech-darker, #0f172a) !important;
}

/* Hover: Salir - Amarillo miel metálico brillante */
html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med[data-action="exit"]:hover .jkhive-hex,
html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover button[data-action="exit"] .jkhive-hex,
html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover .jkhive-system-modal-btn[data-action="exit"] .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med[data-action="exit"]:hover .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover button[data-action="exit"] .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover .jkhive-system-modal-btn[data-action="exit"] .jkhive-hex,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med[data-action="exit"]:hover .jkhive-hex,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover button[data-action="exit"] .jkhive-hex,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover .jkhive-system-modal-btn[data-action="exit"] .jkhive-hex {
  background: linear-gradient(135deg, var(--jk-accent-honey-dark, #b8860b) 0%, var(--jk-accent-honey, #d4a017) 50%, var(--jk-accent-honey-light, #f4c430) 100%) !important;
  box-shadow: var(--jk-shadow-lg), 0 0 30px rgba(244, 196, 48, 0.9), 0 0 60px rgba(212, 160, 23, 0.6) !important;
  transform: scale(1.05) !important;
}

html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med[data-action="exit"]:hover .jkhive-hex-icon,
html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover button[data-action="exit"] .jkhive-hex-icon,
html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover .jkhive-system-modal-btn[data-action="exit"] .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med[data-action="exit"]:hover .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover button[data-action="exit"] .jkhive-hex-icon,
html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover .jkhive-system-modal-btn[data-action="exit"] .jkhive-hex-icon,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med[data-action="exit"]:hover .jkhive-hex-icon,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover button[data-action="exit"] .jkhive-hex-icon,
body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med:hover .jkhive-system-modal-btn[data-action="exit"] .jkhive-hex-icon {
  color: var(--jk-tech-darker, #0f172a) !important;
  transform: rotate(180deg) !important;
}

/* ========================================
   RESPONSIVE - PANTALLA CHICA
   ======================================== */
@media (max-width: 768px) {
  /* Contenedor de acciones - columna en móvil */
  html body .jkhive-modal .jkhive-modal-actions,
  html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions,
  body .jkhive-modal .jkhive-modal-actions {
    flex-direction: column !important;
    align-items: center !important;
    gap: 0.75rem !important;
  }

  /* Botones de acción - ancho completo en móvil */
  html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med,
  html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med,
  body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med {
    width: 100% !important;
    max-width: 200px !important;
    height: calc(200px * 0.32585 * 1.1547) !important; /* Proporcional al ancho */
  }

  /* Hexágono de los botones - ajuste proporcional */
  html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex,
  html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex,
  body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex {
    width: 100% !important;
    max-width: 200px !important;
    height: calc(200px * 0.32585 * 1.1547) !important;
  }

  /* Hexágono interno - ajuste proporcional */
  html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex::after,
  html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex::after,
  body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex::after {
    width: calc(100% - 4px) !important;
    max-width: calc(200px - 4px) !important;
    height: calc((200px * 0.32585 - 4px) * 1.1547) !important;
  }

  /* Iconos - tamaño reducido en móvil */
  html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex-icon,
  html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex-icon,
  body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex-icon {
    font-size: 1.2rem !important;
  }

  /* ========================================
     RESPONSIVE UNIVERSAL PARA TODOS LOS MODALES
     ======================================== */

  /* Contenedor del modal - UNIVERSAL */
  html body .jkhive-modal,
  html body #jkhive-system-modal-container .jkhive-modal,
  body .jkhive-modal {
    padding: 0.5rem !important;
  }

  /* Content del modal - UNIVERSAL */
  html body .jkhive-modal .jkhive-modal-content,
  html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-content,
  body .jkhive-modal .jkhive-modal-content {
    width: 95% !important;
    max-width: 95% !important;
    min-width: 0 !important;
    padding: 2rem 1.5rem !important;
    max-height: 90vh !important;
  }

  /* Modales hexagonales - ajuste proporcional */
  html body .jkhive-modal .jkhive-modal-content.jkhive-modal-hex,
  html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-content.jkhive-modal-hex,
  body .jkhive-modal .jkhive-modal-content.jkhive-modal-hex {
    width: 95% !important;
    max-width: 95% !important;
    padding: 2rem 1.5rem !important;
    aspect-ratio: 1 / 1.1547 !important;
    max-height: 90vh !important;
  }

  /* Header del modal - UNIVERSAL */
  html body .jkhive-modal .jkhive-modal-header,
  html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-header,
  body .jkhive-modal .jkhive-modal-header {
    margin-bottom: 1rem !important;
    padding: 0.5rem 0 !important;
  }

  /* Iconos del header - UNIVERSAL */
  html body .jkhive-modal .jkhive-modal-header-icon,
  html body .jkhive-modal .jkhive-modal-icon,
  html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-header-icon,
  html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-icon,
  body .jkhive-modal .jkhive-modal-header-icon,
  body .jkhive-modal .jkhive-modal-icon {
    font-size: 2.5rem !important;
    margin-bottom: 0.75rem !important;
  }

  /* Título del modal - UNIVERSAL */
  html body .jkhive-modal .jkhive-modal-title,
  html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-title,
  body .jkhive-modal .jkhive-modal-title {
    font-size: 1.5rem !important;
    margin-bottom: 0.5rem !important;
  }

  /* Subtítulo del modal - UNIVERSAL */
  html body .jkhive-modal .jkhive-modal-subtitle,
  html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-subtitle,
  body .jkhive-modal .jkhive-modal-subtitle {
    font-size: 0.9rem !important;
  }

  /* Body del modal - UNIVERSAL */
  html body .jkhive-modal .jkhive-modal-body,
  html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-body,
  body .jkhive-modal .jkhive-modal-body {
    padding: 1rem !important;
    font-size: 0.9rem !important;
  }

  /* Descripción del modal - UNIVERSAL */
  html body .jkhive-modal .jkhive-modal-description,
  html body .jkhive-modal .jkhive-modal-body p,
  html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-description,
  html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-body p,
  body .jkhive-modal .jkhive-modal-description,
  body .jkhive-modal .jkhive-modal-body p {
    font-size: 0.9rem !important;
    line-height: 1.5 !important;
  }

  /* Footer del modal - UNIVERSAL */
  html body .jkhive-modal .jkhive-modal-footer,
  html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-footer,
  body .jkhive-modal .jkhive-modal-footer {
    padding: 0.75rem 0 !important;
  }

  /* Botón de cerrar - UNIVERSAL */
  html body .jkhive-modal .jkhive-modal-close,
  html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-close,
  body .jkhive-modal .jkhive-modal-close {
    width: 32px !important;
    height: 32px !important;
    font-size: 1.2rem !important;
    top: 0.5rem !important;
    right: 0.5rem !important;
  }

  /* Modales específicos - jkhive-add-new-book */
  html body .jkhive-add-new-book .jkhive-modal-header-icon,
  html body #jkhive-system-modal-container .jkhive-add-new-book .jkhive-modal-header-icon,
  body .jkhive-add-new-book .jkhive-modal-header-icon {
    font-size: 2.5rem !important;
    top: 4px !important;
  }

  html body .jkhive-add-new-book .jkhive-modal-title,
  html body #jkhive-system-modal-container .jkhive-add-new-book .jkhive-modal-title,
  body .jkhive-add-new-book .jkhive-modal-title {
    font-size: 1.3rem !important;
  }
}

/* ========================================
   RESPONSIVE - PANTALLA MUY PEQUEÑA (480px)
   ======================================== */
@media (max-width: 480px) {
  /* Contenedor del modal - UNIVERSAL */
  html body .jkhive-modal,
  html body #jkhive-system-modal-container .jkhive-modal,
  body .jkhive-modal {
    padding: 0.25rem !important;
  }

  /* Content del modal - UNIVERSAL */
  html body .jkhive-modal .jkhive-modal-content,
  html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-content,
  body .jkhive-modal .jkhive-modal-content {
    width: 98% !important;
    max-width: 98% !important;
    padding: 1.5rem 1rem !important;
    max-height: 95vh !important;
  }

  /* Modales hexagonales - ajuste muy pequeño */
  html body .jkhive-modal .jkhive-modal-content.jkhive-modal-hex,
  html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-content.jkhive-modal-hex,
  body .jkhive-modal .jkhive-modal-content.jkhive-modal-hex {
    width: 98% !important;
    max-width: 98% !important;
    padding: 1.5rem 1rem !important;
  }

  /* Iconos del header - UNIVERSAL */
  html body .jkhive-modal .jkhive-modal-header-icon,
  html body .jkhive-modal .jkhive-modal-icon,
  html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-header-icon,
  html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-icon,
  body .jkhive-modal .jkhive-modal-header-icon,
  body .jkhive-modal .jkhive-modal-icon {
    font-size: 2rem !important;
    margin-bottom: 0.5rem !important;
  }

  /* Título del modal - UNIVERSAL */
  html body .jkhive-modal .jkhive-modal-title,
  html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-title,
  body .jkhive-modal .jkhive-modal-title {
    font-size: 1.2rem !important;
  }

  /* Body del modal - UNIVERSAL */
  html body .jkhive-modal .jkhive-modal-body,
  html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-body,
  body .jkhive-modal .jkhive-modal-body {
    padding: 0.75rem !important;
    font-size: 0.85rem !important;
  }

  /* Botones de acción - más pequeños */
  html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med,
  html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med,
  body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med {
    max-width: 150px !important;
  }

  html body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex-icon,
  html body #jkhive-system-modal-container .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex-icon,
  body .jkhive-modal .jkhive-modal-actions .jkhive-actionbutton-med .jkhive-hex-icon {
    font-size: 1rem !important;
  }
}

/* ========================================
   MODAL UNIVERSAL DE ALERTAS - jkhive-modals-alert
   Estilos extraídos de modals.css (.jkhive-msgs-alerts)
   Con textura SVG, tamaño correcto y colores según tipo (success/error)
   ======================================== */
html body .jkhive-modals-alert,
html body #jkhive-system-modal-container .jkhive-modals-alert,
body .jkhive-modals-alert {
  z-index: 9999 !important;
}

html body .jkhive-modals-alert.jkhive-modal[style*="display: flex"],
html body .jkhive-modals-alert.jkhive-modal.active,
html body .jkhive-modals-alert.jkhive-modal.show,
html body #jkhive-system-modal-container .jkhive-modals-alert.jkhive-modal[style*="display: flex"],
html body #jkhive-system-modal-container .jkhive-modals-alert.jkhive-modal.active,
html body #jkhive-system-modal-container .jkhive-modals-alert.jkhive-modal.show,
body .jkhive-modals-alert.jkhive-modal[style*="display: flex"],
body .jkhive-modals-alert.jkhive-modal.active,
body .jkhive-modals-alert.jkhive-modal.show {
  display: flex !important;
  position: fixed !important;
  inset: 0 !important;
  justify-content: center !important;
  align-items: center !important;
  opacity: 1 !important;
}

/* Overlay con honeycomb pattern - MÁXIMA ESPECIFICIDAD */
html body #jkhive-system-modal-container .jkhive-modals-alert.jkhive-modal .jkhive-modal-overlay,
html body #jkhive-system-modal-container .jkhive-modals-alert.jkhive-modal.active .jkhive-modal-overlay,
html body #jkhive-system-modal-container .jkhive-modals-alert.jkhive-modal.show .jkhive-modal-overlay,
html body .jkhive-modals-alert.jkhive-modal .jkhive-modal-overlay,
html body .jkhive-modals-alert.jkhive-modal.active .jkhive-modal-overlay,
html body .jkhive-modals-alert.jkhive-modal.show .jkhive-modal-overlay,
body #jkhive-system-modal-container .jkhive-modals-alert.jkhive-modal .jkhive-modal-overlay,
body #jkhive-system-modal-container .jkhive-modals-alert.jkhive-modal.active .jkhive-modal-overlay,
body #jkhive-system-modal-container .jkhive-modals-alert.jkhive-modal.show .jkhive-modal-overlay,
body .jkhive-modals-alert.jkhive-modal .jkhive-modal-overlay,
body .jkhive-modals-alert.jkhive-modal.active .jkhive-modal-overlay,
body .jkhive-modals-alert.jkhive-modal.show .jkhive-modal-overlay {
  background: rgba(244, 196, 48, 0.8) !important;
  backdrop-filter: blur(10px) !important;
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  z-index: 10000 !important;
  pointer-events: auto !important;
  cursor: pointer !important;
}

/* Primera capa de textura honeycomb SVG */
html body #jkhive-system-modal-container .jkhive-modals-alert.jkhive-modal .jkhive-modal-overlay::before,
html body #jkhive-system-modal-container .jkhive-modals-alert.jkhive-modal.active .jkhive-modal-overlay::before,
html body #jkhive-system-modal-container .jkhive-modals-alert.jkhive-modal.show .jkhive-modal-overlay::before,
html body .jkhive-modals-alert.jkhive-modal .jkhive-modal-overlay::before,
html body .jkhive-modals-alert.jkhive-modal.active .jkhive-modal-overlay::before,
html body .jkhive-modals-alert.jkhive-modal.show .jkhive-modal-overlay::before,
body #jkhive-system-modal-container .jkhive-modals-alert.jkhive-modal .jkhive-modal-overlay::before,
body #jkhive-system-modal-container .jkhive-modals-alert.jkhive-modal.active .jkhive-modal-overlay::before,
body #jkhive-system-modal-container .jkhive-modals-alert.jkhive-modal.show .jkhive-modal-overlay::before,
body .jkhive-modals-alert.jkhive-modal .jkhive-modal-overlay::before,
body .jkhive-modals-alert.jkhive-modal.active .jkhive-modal-overlay::before,
body .jkhive-modals-alert.jkhive-modal.show .jkhive-modal-overlay::before {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background-image: url('../img/honeycomb-pattern.svg') !important;
  background-size: 32px 55px !important;
  background-repeat: repeat !important;
  background-position: 0 0 !important;
  pointer-events: none !important;
  z-index: 1 !important;
  opacity: 1 !important;
  filter: brightness(0) contrast(40) !important;
}

/* Segunda capa de textura honeycomb SVG para mayor densidad */
html body #jkhive-system-modal-container .jkhive-modals-alert.jkhive-modal .jkhive-modal-overlay::after,
html body #jkhive-system-modal-container .jkhive-modals-alert.jkhive-modal.active .jkhive-modal-overlay::after,
html body #jkhive-system-modal-container .jkhive-modals-alert.jkhive-modal.show .jkhive-modal-overlay::after,
html body .jkhive-modals-alert.jkhive-modal .jkhive-modal-overlay::after,
html body .jkhive-modals-alert.jkhive-modal.active .jkhive-modal-overlay::after,
html body .jkhive-modals-alert.jkhive-modal.show .jkhive-modal-overlay::after,
body #jkhive-system-modal-container .jkhive-modals-alert.jkhive-modal .jkhive-modal-overlay::after,
body #jkhive-system-modal-container .jkhive-modals-alert.jkhive-modal.active .jkhive-modal-overlay::after,
body #jkhive-system-modal-container .jkhive-modals-alert.jkhive-modal.show .jkhive-modal-overlay::after,
body .jkhive-modals-alert.jkhive-modal .jkhive-modal-overlay::after,
body .jkhive-modals-alert.jkhive-modal.active .jkhive-modal-overlay::after,
body .jkhive-modals-alert.jkhive-modal.show .jkhive-modal-overlay::after {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background-image: url('../img/honeycomb-pattern.svg') !important;
  background-size: 32px 55px !important;
  background-repeat: repeat !important;
  background-position: 16px 28px !important;
  pointer-events: none !important;
  z-index: 1 !important;
  opacity: 1 !important;
  filter: brightness(0) contrast(40) !important;
}

/* Contenedor del modal - tamaño fijo hexagonal */
html body .jkhive-modals-alert .jkhive-modal-content,
html body #jkhive-system-modal-container .jkhive-modals-alert .jkhive-modal-content,
body .jkhive-modals-alert .jkhive-modal-content {
  max-width: 306.886125px !important;
  width: 306.886125px !important;
  padding: 1.5rem 1.75rem !important;
}

/* Hexágono compacto y equilátero */
html body .jkhive-modals-alert .jkhive-modal-content.jkhive-modal-hex,
html body #jkhive-system-modal-container .jkhive-modals-alert .jkhive-modal-content.jkhive-modal-hex,
body .jkhive-modals-alert .jkhive-modal-content.jkhive-modal-hex {
  aspect-ratio: 1 / 1.1547 !important;
  min-height: auto !important;
  width: 306.886125px !important;
  min-width: 306.886125px !important;
  max-width: 306.886125px !important;
  clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%) !important;
  background: linear-gradient(135deg, var(--jk-tech-darker) 0%, var(--jk-tech-dark) 50%, var(--jk-primary-blue-darker) 100%) !important;
  border: 3px solid var(--jk-accent-cyan) !important;
  border-radius: 0 !important;
  position: relative !important;
  z-index: 10001 !important;
  overflow: hidden !important;
  box-shadow: 0 20px 60px rgba(14, 165, 233, 0.4), inset 0 0 60px rgba(14, 165, 233, 0.1) !important;
}

/* Borde hexagonal con ::before */
html body .jkhive-modals-alert .jkhive-modal-content.jkhive-modal-hex::before,
html body #jkhive-system-modal-container .jkhive-modals-alert .jkhive-modal-content.jkhive-modal-hex::before,
body .jkhive-modals-alert .jkhive-modal-content.jkhive-modal-hex::before {
  content: '' !important;
  position: absolute !important;
  inset: -4px !important;
  clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%) !important;
  background: linear-gradient(135deg, var(--jk-accent-cyan), var(--jk-primary-blue-light)) !important;
  z-index: -1 !important;
  opacity: 0.3 !important;
  pointer-events: none !important;
}

/* Header */
html body .jkhive-modals-alert .jkhive-modal-header,
html body #jkhive-system-modal-container .jkhive-modals-alert .jkhive-modal-header,
body .jkhive-modals-alert .jkhive-modal-header {
  margin-bottom: 0.75rem !important;
}

/* Icono - tamaño aumentado */
html body .jkhive-modals-alert .jkhive-modal-icon,
html body #jkhive-system-modal-container .jkhive-modals-alert .jkhive-modal-icon,
body .jkhive-modals-alert .jkhive-modal-icon {
  font-size: 4rem !important;
  margin-bottom: 0.5rem !important;
}

/* Icono - color verde para success */
html body .jkhive-modals-alert.jkhive-modals-alert-success .jkhive-modal-icon,
html body #jkhive-system-modal-container .jkhive-modals-alert.jkhive-modals-alert-success .jkhive-modal-icon,
body .jkhive-modals-alert.jkhive-modals-alert-success .jkhive-modal-icon {
  color: var(--jk-secondary-green) !important;
  filter: drop-shadow(0 0 20px rgba(20, 184, 166, 0.8)) !important;
}

/* Icono - color rojo para error */
html body .jkhive-modals-alert.jkhive-modals-alert-error .jkhive-modal-icon,
html body #jkhive-system-modal-container .jkhive-modals-alert.jkhive-modals-alert-error .jkhive-modal-icon,
body .jkhive-modals-alert.jkhive-modals-alert-error .jkhive-modal-icon {
  color: #ef4444 !important;
  filter: drop-shadow(0 0 20px rgba(239, 68, 68, 0.8)) !important;
}

/* Icono - color amarillo para warning */
html body .jkhive-modals-alert.jkhive-modals-alert-warning .jkhive-modal-icon,
html body #jkhive-system-modal-container .jkhive-modals-alert.jkhive-modals-alert-warning .jkhive-modal-icon,
body .jkhive-modals-alert.jkhive-modals-alert-warning .jkhive-modal-icon {
  color: var(--jk-accent-honey) !important;
  filter: drop-shadow(0 0 20px rgba(212, 160, 23, 0.8)) !important;
}

/* Icono - color cyan para info */
html body .jkhive-modals-alert.jkhive-modals-alert-info .jkhive-modal-icon,
html body #jkhive-system-modal-container .jkhive-modals-alert.jkhive-modals-alert-info .jkhive-modal-icon,
body .jkhive-modals-alert.jkhive-modals-alert-info .jkhive-modal-icon {
  color: var(--jk-accent-cyan) !important;
  filter: drop-shadow(0 0 20px rgba(6, 182, 212, 0.8)) !important;
}

/* Agrandar imágenes y SVGs dentro del ícono */
html body .jkhive-modals-alert .jkhive-modal-icon img,
html body .jkhive-modals-alert .jkhive-modal-icon svg,
html body #jkhive-system-modal-container .jkhive-modals-alert .jkhive-modal-icon img,
html body #jkhive-system-modal-container .jkhive-modals-alert .jkhive-modal-icon svg,
body .jkhive-modals-alert .jkhive-modal-icon img,
body .jkhive-modals-alert .jkhive-modal-icon svg {
  width: 200% !important;
  height: 200% !important;
  max-width: none !important;
  max-height: none !important;
}

/* Título */
html body .jkhive-modals-alert .jkhive-modal-title,
html body #jkhive-system-modal-container .jkhive-modals-alert .jkhive-modal-title,
body .jkhive-modals-alert .jkhive-modal-title {
  font-size: 1.25rem !important;
  margin-bottom: 0.4rem !important;
}

/* Body */
html body .jkhive-modals-alert .jkhive-modal-body,
html body #jkhive-system-modal-container .jkhive-modals-alert .jkhive-modal-body,
body .jkhive-modals-alert .jkhive-modal-body {
  margin-bottom: 1rem !important;
}

/* Descripción */
html body .jkhive-modals-alert .jkhive-modal-description,
html body #jkhive-system-modal-container .jkhive-modals-alert .jkhive-modal-description,
body .jkhive-modals-alert .jkhive-modal-description {
  font-size: 0.95rem !important;
  line-height: 1.4 !important;
  margin-bottom: 0 !important;
}

/* Acciones - botones juntos */
html body .jkhive-modals-alert .jkhive-modal-actions,
html body #jkhive-system-modal-container .jkhive-modals-alert .jkhive-modal-actions,
body .jkhive-modals-alert .jkhive-modal-actions {
  display: block !important;
  text-align: center !important;
  margin: 0 !important;
  padding: 0 !important;
  gap: 0 !important;
  row-gap: 0 !important;
  column-gap: 0 !important;
  flex-direction: unset !important;
  flex-wrap: unset !important;
  justify-content: unset !important;
  align-items: unset !important;
  font-size: 0 !important;
  letter-spacing: 0 !important;
  word-spacing: 0 !important;
}

/* Action buttons específicos */
html body #jkhive-system-modal-container .jkhive-modals-alert .jkhive-modal-actions .jkhive-actionbutton-msgs,
html body .jkhive-modals-alert .jkhive-modal-actions .jkhive-actionbutton-msgs,
body #jkhive-system-modal-container .jkhive-modals-alert .jkhive-modal-actions .jkhive-actionbutton-msgs,
body .jkhive-modals-alert .jkhive-modal-actions .jkhive-actionbutton-msgs {
  margin: 0 !important;
  margin-left: 0 !important;
  margin-right: 1px !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding: 0 !important;
  display: inline-block !important;
  vertical-align: middle !important;
  min-width: 110px !important;
  transform: scale(0.9) !important;
  letter-spacing: 0 !important;
  word-spacing: 0 !important;
  float: none !important;
  position: relative !important;
  left: auto !important;
  right: auto !important;
  text-align: center !important;
  box-sizing: border-box !important;
}

/* Último botón sin margen derecho */
html body .jkhive-modals-alert .jkhive-modal-actions .jkhive-actionbutton-msgs:last-child,
html body #jkhive-system-modal-container .jkhive-modals-alert .jkhive-modal-actions .jkhive-actionbutton-msgs:last-child,
body .jkhive-modals-alert .jkhive-modal-actions .jkhive-actionbutton-msgs:last-child,
body #jkhive-system-modal-container .jkhive-modals-alert .jkhive-modal-actions .jkhive-actionbutton-msgs:last-child {
  margin-right: 0 !important;
}

/* Link dentro del botón */
html body .jkhive-modals-alert .jkhive-modal-actions .jkhive-actionbutton-msgs > a,
html body #jkhive-system-modal-container .jkhive-modals-alert .jkhive-modal-actions .jkhive-actionbutton-msgs > a,
body .jkhive-modals-alert .jkhive-modal-actions .jkhive-actionbutton-msgs > a,
body #jkhive-system-modal-container .jkhive-modals-alert .jkhive-modal-actions .jkhive-actionbutton-msgs > a {
  margin: 0 !important;
  padding: 0 !important;
  display: block !important;
  text-align: center !important;
  width: 100% !important;
  font-size: 1rem !important;
}

/* Hexágono dentro del botón */
html body .jkhive-modals-alert .jkhive-actionbutton-msgs .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modals-alert .jkhive-actionbutton-msgs .jkhive-hex,
body .jkhive-modals-alert .jkhive-actionbutton-msgs .jkhive-hex,
body #jkhive-system-modal-container .jkhive-modals-alert .jkhive-actionbutton-msgs .jkhive-hex {
  margin: 0 auto !important;
  display: block !important;
  margin-left: auto !important;
  margin-right: auto !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* Botón OK - color inicial amarillo miel */
html body .jkhive-modals-alert .jkhive-actionbutton-msgs .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex,
html body .jkhive-modals-alert .jkhive-actionbutton-msgs .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex-honey,
html body #jkhive-system-modal-container .jkhive-modals-alert .jkhive-actionbutton-msgs .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modals-alert .jkhive-actionbutton-msgs .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex-honey,
body .jkhive-modals-alert .jkhive-actionbutton-msgs .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex,
body .jkhive-modals-alert .jkhive-actionbutton-msgs .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex-honey,
body #jkhive-system-modal-container .jkhive-modals-alert .jkhive-actionbutton-msgs .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex,
body #jkhive-system-modal-container .jkhive-modals-alert .jkhive-actionbutton-msgs .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex-honey {
  background: var(--jk-accent-honey) !important;
  border-color: var(--jk-accent-honey) !important;
}

/* Botón OK - hover verde metálico brillante */
html body .jkhive-modals-alert .jkhive-actionbutton-msgs .jkhive-system-modal-btn[data-action="ok"]:hover .jkhive-hex,
html body .jkhive-modals-alert .jkhive-actionbutton-msgs:hover .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modals-alert .jkhive-actionbutton-msgs .jkhive-system-modal-btn[data-action="ok"]:hover .jkhive-hex,
html body #jkhive-system-modal-container .jkhive-modals-alert .jkhive-actionbutton-msgs:hover .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex,
body .jkhive-modals-alert .jkhive-actionbutton-msgs .jkhive-system-modal-btn[data-action="ok"]:hover .jkhive-hex,
body .jkhive-modals-alert .jkhive-actionbutton-msgs:hover .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex,
body #jkhive-system-modal-container .jkhive-modals-alert .jkhive-actionbutton-msgs .jkhive-system-modal-btn[data-action="ok"]:hover .jkhive-hex,
body #jkhive-system-modal-container .jkhive-modals-alert .jkhive-actionbutton-msgs:hover .jkhive-system-modal-btn[data-action="ok"] .jkhive-hex {
  background: linear-gradient(135deg, #00ff88, #00cc6a, #00ff88) !important;
  border-color: #00ff88 !important;
  box-shadow: 
    0 0 20px rgba(0, 255, 136, 0.8),
    0 0 40px rgba(0, 255, 136, 0.6),
    inset 0 0 20px rgba(255, 255, 255, 0.3) !important;
  filter: brightness(1.2) drop-shadow(0 0 15px rgba(0, 255, 136, 0.9)) !important;
  transform: scale(0.9) !important;
}

/* ========================================
   RESPONSIVE - MODAL DE ALERTAS
   ======================================== */
@media (max-width: 768px) {
  html body .jkhive-modals-alert .jkhive-modal-content.jkhive-modal-hex,
  html body #jkhive-system-modal-container .jkhive-modals-alert .jkhive-modal-content.jkhive-modal-hex,
  body .jkhive-modals-alert .jkhive-modal-content.jkhive-modal-hex {
    width: 90% !important;
    max-width: 90% !important;
    min-width: 0 !important;
    padding: 1.25rem 1.5rem !important;
  }
  
  html body .jkhive-modals-alert .jkhive-modal-icon,
  html body #jkhive-system-modal-container .jkhive-modals-alert .jkhive-modal-icon,
  body .jkhive-modals-alert .jkhive-modal-icon {
    font-size: 3rem !important;
  }
  
  html body .jkhive-modals-alert .jkhive-modal-title,
  html body #jkhive-system-modal-container .jkhive-modals-alert .jkhive-modal-title,
  body .jkhive-modals-alert .jkhive-modal-title {
    font-size: 1.1rem !important;
  }
  
  html body .jkhive-modals-alert .jkhive-modal-description,
  html body #jkhive-system-modal-container .jkhive-modals-alert .jkhive-modal-description,
  body .jkhive-modals-alert .jkhive-modal-description {
    font-size: 0.85rem !important;
  }
}

@media (max-width: 480px) {
  html body .jkhive-modals-alert .jkhive-modal-content.jkhive-modal-hex,
  html body #jkhive-system-modal-container .jkhive-modals-alert .jkhive-modal-content.jkhive-modal-hex,
  body .jkhive-modals-alert .jkhive-modal-content.jkhive-modal-hex {
    width: 95% !important;
    max-width: 95% !important;
    min-width: 0 !important;
    padding: 1rem 1.25rem !important;
  }
  
  html body .jkhive-modals-alert .jkhive-modal-icon,
  html body #jkhive-system-modal-container .jkhive-modals-alert .jkhive-modal-icon,
  body .jkhive-modals-alert .jkhive-modal-icon {
    font-size: 2.5rem !important;
  }
  
  html body .jkhive-modals-alert .jkhive-modal-title,
  html body #jkhive-system-modal-container .jkhive-modals-alert .jkhive-modal-title,
  body .jkhive-modals-alert .jkhive-modal-title {
    font-size: 1rem !important;
  }
  
  html body .jkhive-modals-alert .jkhive-modal-description,
  html body #jkhive-system-modal-container .jkhive-modals-alert .jkhive-modal-description,
  body .jkhive-modals-alert .jkhive-modal-description {
    font-size: 0.8rem !important;
  }
  
  html body .jkhive-modals-alert .jkhive-modal-actions .jkhive-actionbutton-msgs,
  html body #jkhive-system-modal-container .jkhive-modals-alert .jkhive-modal-actions .jkhive-actionbutton-msgs,
  body .jkhive-modals-alert .jkhive-modal-actions .jkhive-actionbutton-msgs,
  body #jkhive-system-modal-container .jkhive-modals-alert .jkhive-modal-actions .jkhive-actionbutton-msgs {
    min-width: 90px !important;
    transform: scale(0.85) !important;
  }
}