.ena-nutri { font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; max-width: 1100px; margin: 1rem auto; padding: 1rem; background:#fff; border:1px solid #e5e7eb; border-radius: 14px; }

/* .ena-title { font-size: 2rem; font-weight: 900 !important ; margin: .25rem 0 .75rem;  line-height: 1.15;  } */

.ena-title { font-size: 2.5rem !important ; font-weight: 900 !important ; margin: .5rem 0 1rem !important;  line-height: 1.1!important ; }
.ena-field { display:flex; flex-direction: column; gap:.25rem; }
.ena-row { display:flex; gap:1rem; flex-wrap:wrap; }
.ena-field input, .ena-field select { padding:.5rem .6rem; border:1px solid #d1d5db; border-radius: 10px; }
.ena-actions { display:flex; flex-wrap:wrap; gap:.5rem; align-items:center; }
.ena-actions button, .ena-actions .btn { border:0; border-radius: 999px; padding:.6rem 1rem; cursor:pointer; }
.ena-primary { background:#16a34a; color:#fff; }
.ena-secondary { background:#0ea5e9; color:#fff; }
.ena-danger { background:#ef4444; color:#fff; }
.ena-surface { background:#f1f5f9; }
.ena-note { font-size:.9rem; color:#475569; margin-top:.5rem; }
.ena-badge { font-size:.8rem; background:#e2e8f0; border-radius: 999px; padding:.2rem .5rem; }
.ena-grid { display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap:1rem; }
.ena-card { border:1px solid #e5e7eb; padding: .9rem; border-radius: 12px; background:#fafafa; }

/* .ena-card h4 { margin:.25rem 0 .75rem; display:flex; align-items:center; justify-content:space-between; } */

.ena-card h3 { margin:.5rem 0 1rem !important; display:flex !important; align-items:center !important; justify-content:space-between !important; font-size: 1.3rem !important; font-weight: 700 !important; }

.ena-card .del { background:#ef4444; color:#fff; border:0; border-radius: 999px; padding:.25rem .6rem; cursor:pointer; }
.ena-prof-grid { display:grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap:.6rem; }
@media (max-width: 1000px){ .ena-prof-grid { grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width: 640px){ .ena-grid { grid-template-columns: 1fr; } .ena-prof-grid { grid-template-columns: 1fr; } }
.ena-header { display:flex; align-items:center; gap:1rem; margin-bottom: .75rem; }
.ena-header.center { justify-content:center; }
.ena-header.right { justify-content:flex-end; }
.ena-logo { width:auto; display:block; }

/* ESTILOS FORZADOS - AGREGAR AL FINAL DEL ARCHIVO */
#ena-nutri-container .ena-title {
  font-size: 2.5rem !important;
  font-weight: 900 !important;
  margin: 1rem 0 1.5rem !important;
}

#ena-nutri-container .ena-actions button,
#ena-nutri-container .ena-actions .btn {
  font-size: 1.15rem !important;
  font-weight: 700 !important;
  padding: 0.8rem 1.8rem !important;
}

#ena-nutri-container .ena-card h3 {
  font-size: 2rem !important;
  font-weight: 700 !important;
}

/* FIX: evitar que selects/inputs excedan el ancho de la tarjeta */
#ena-nutri-container .ena-card,
#ena-nutri-container .ena-field { min-width: 0; }

#ena-nutri-container .ena-field input,
#ena-nutri-container .ena-field select {
  width: 90%;
  max-width: 90%;
  box-sizing: border-box;
  min-width: 0;
}

#ena-nutri-container .ena-field select {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}


/* Ajuste adicional: ancho 90% centrado dentro de la tarjeta */
#ena-nutri-container .ena-field input,
#ena-nutri-container .ena-field select {
  width: 90% !important;
  margin: 0 auto;
}


/* === FIX DEFINITIVO ANCHO FILTROS === */
#ena-nutri-container .ena-card select,
#ena-nutri-container .ena-card input[type="text"],
#ena-nutri-container .ena-card input[type="number"] {
    display: block !important;
    width: 90% !important;
    max-width: 90% !important;
    box-sizing: border-box !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

#ena-nutri-container .ena-card {
    overflow: hidden;
}


/* === OVERRIDE FLEX/MIN-WIDTH (themes suelen romper los selects) === */
#ena-nutri-container .ena-card .ena-row {
  flex-wrap: wrap !important;
  min-width: 0 !important;
}

#ena-nutri-container .ena-card .ena-field {
  min-width: 0 !important;      /* pisa inline min-width:220px */
  max-width: 100% !important;
  flex: 1 1 0% !important;
}

#ena-nutri-container .ena-card select.ena-grupo,
#ena-nutri-container .ena-card select.ena-mp {
  display: block !important;
  width: 100% !important;       /* ocupa el contenedor */
  max-width: 90% !important;    /* pero nunca supera 90% de la tarjeta */
  box-sizing: border-box !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* En caso de estilos del theme tipo max-width:none */
#ena-nutri-container .ena-card select.ena-grupo,
#ena-nutri-container .ena-card select.ena-mp,
#ena-nutri-container .ena-card select.ena-grupo *,
#ena-nutri-container .ena-card select.ena-mp * {
  max-width: 100% !important;
}


/* === FIX REAL: evitar desbordes de los selects (sin depender de inline styles) === */
#ena-nutri-container .ena-card .ena-field.ena-field-select{
  flex: 1 1 0% !important;
  min-width: 0 !important;
}

#ena-nutri-container .ena-card .ena-field.ena-field-select > select{
  display:block !important;
  width: 90% !important;     /* 90% del ancho de la tarjeta */
  max-width: 90% !important;
  box-sizing: border-box !important;
  margin: 0 auto !important; /* centrado */
}

#ena-nutri-container .ena-card .ena-field.ena-field-select > label{
  width: 90% !important;
  margin: 0 auto !important;
}


/* === ROBUST: el contenedor real suele ser .ena-nutri (no siempre #ena-nutri-container) === */
.ena-nutri .ena-card { overflow: hidden !important; }

.ena-nutri .ena-card .ena-row { flex-wrap: wrap !important; min-width: 0 !important; }

.ena-nutri .ena-card .ena-field.ena-field-select{
  flex: 1 1 0% !important;
  min-width: 0 !important;
  max-width: 100% !important;
}

.ena-nutri .ena-card .ena-field.ena-field-select > label{
  display:block !important;
  width: 90% !important;
  max-width: 90% !important;
  margin: 0 auto .25rem !important;
  box-sizing: border-box !important;
}

.ena-nutri .ena-card .ena-field.ena-field-select > select{
  display:block !important;
  width: 90% !important;
  max-width: 90% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
  margin: 0 auto !important;
}

/* Seguridad extra si el theme fuerza width/max-width raros en selects */
.ena-nutri .ena-card select.ena-grupo,
.ena-nutri .ena-card select.ena-mp{
  width: 90% !important;
  max-width: 90% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}


/* === FIX POR PADDING (más confiable que width cuando el theme mete estilos raros) === */
.ena-nutri, .ena-nutri * { box-sizing: border-box !important; }

.ena-nutri .ena-card { overflow: hidden !important; }

/* Para Grupo y Materia prima: el margen se logra con padding interno del contenedor */
.ena-nutri .ena-card .ena-field.ena-field-select {
  padding-left: 5% !important;
  padding-right: 5% !important;
  min-width: 0 !important;
  max-width: 100% !important;
}

.ena-nutri .ena-card .ena-field.ena-field-select > label,
.ena-nutri .ena-card .ena-field.ena-field-select > select {
  width: 100% !important;      /* ocupa el contenedor (que ya tiene padding 5%+5%) */
  max-width: 100% !important;
  display: block !important;
}

.ena-nutri .ena-card .ena-field.ena-field-select > select {
  margin: 0 !important;         /* evita empujes laterales */
}


/* JS width enforcement: asegurar que nada pueda desbordar visualmente */
.ena-nutri .ena-card { overflow: hidden !important; }
.ena-nutri select.ena-grupo, .ena-nutri select.ena-mp { max-width: 100% !important; }


/* === FIX DEFINITIVO: usar GRID en la fila superior (evita overflow por flex/min-width del theme) === */
.ena-card .ena-row-top{
  display: grid !important;
  grid-template-columns: minmax(0,1fr) minmax(0,1fr) minmax(0,180px);
  gap: 1rem !important;
  align-items: end;
}

.ena-card .ena-row-top .ena-field{
  min-width: 0 !important;
  max-width: 100% !important;
}

.ena-card .ena-row-top select,
.ena-card .ena-row-top input{
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

@media (max-width: 720px){
  .ena-card .ena-row-top{
    grid-template-columns: 1fr !important;
  }
}
