/* --- Ajustes generales del popup lookup modal --- */
.modal-dialog { 
  max-width: 60% !important;  /* ancho máximo relativo a la pantalla */
  width: 40% !important;      /* ancho base del modal */
  margin: auto;               /* centra el modal */
}

/* Controla la altura general del modal */
.modal-content {
  max-height: 90vh !important;    /* máximo 90% de altura visible */
  height: auto !important;        /* altura automática */
  display: flex;
  flex-direction: column;
  overflow: hidden;               /* evita scrolls dobles */
}

/* Contenedor principal de la ventana de asociación (lookup) */
.entity-associate {
  display: flex;
  flex-direction: column;
  height: 100%;
}

/* --- Oculta por completo la sección "Selected Records" y headers relacionados --- */
.entity-associate .selected-records,
.entity-associate .selected-records *,
.entity-associate .selected-records .card-header,
.entity-associate .selected-records .panel-heading,
.entity-associate .selected-records .header,
.entity-associate .selected-records .selected-records-header {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  max-height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}

/* --- Oculta el header visual que contiene el título "Selected records" --- */
.entity-associate .content-panel.card.portal-card-default .card-header h2,
.entity-associate .content-panel.card.portal-card-default .card-header,
.entity-associate .content-panel.card.portal-card-default {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  max-height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
}

/* --- Ajuste visual del contenedor principal del grid --- */
.entity-associate .selected-records + *,
.entity-associate .selected-records ~ * {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* --- La grilla principal ocupa el 80% del modal --- */
.entity-associate .view-grid {
  flex: 0 0 80% !important;
  max-height: 60% !important;
  height: 60% !important;
  overflow-y: auto !important;
  padding: 8px !important;
  margin: 0 !important;
  box-sizing: border-box !important;
}

/* --- Footer (botones) ocupa el 20% restante --- */
.modal-footer {
  flex: 0 0 20% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  padding: 10px 20px !important;
  box-sizing: border-box !important;
  border-top: 1px solid #ddd !important;
}

/* --- Scrollbar opcional (más estético) --- */
.entity-associate .view-grid::-webkit-scrollbar {
  width: 6px;
}
.entity-associate .view-grid::-webkit-scrollbar-thumb {
  background-color: #ccc;
  border-radius: 3px;
}