/* utilities-extension.css — Extensiones del framework EBCGG v3
   Justificación: completa familias existentes (z, max-h, bg) + agrega
   positioning utilities (left/top) faltantes. Cada clase tiene >2 usos
   en código productivo y completa un pattern existente.
   Carga DESPUÉS de ebcgg.min.css. */

/* z-index — completa eb-z-{1,50} */
.eb-z-0    { z-index: 0; }
.eb-z-10   { z-index: 10; }

/* positioning — pattern absolute overlay top:0; left:0 */
.eb-left-0   { left: 0; }
.eb-top-0    { top: 0; }
.eb-top-full { top: 100%; }   /* dropdown alignment */
.eb-top-1-2  { top: 50%; }    /* vertical center reference */

/* max-height — completa eb-max-h-{180,280} */
.eb-max-h-240 { max-height: 240px; }
.eb-max-h-360 { max-height: 360px; }

/* background — completa eb-bg-{surface,surface-2,bg} */
.eb-bg-border      { background: var(--eb-border); }
.eb-bg-transparent { background: transparent; }

/* Pase 2 (2026-05-02 sprint inline cleanup):
   eb-dropdown-panel — patrón típico de menu desplegable bajo trigger
   (8+ usos en buyers/NewRequest, RequestDetail, exportbrazil dropdowns).
   No componible con utilities existentes (faltaba eb-right-0). */
.eb-dropdown-panel {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  z-index: 50;
  max-height: 240px;
  overflow-y: auto;
  background: var(--eb-surface);
  border: 1px solid var(--eb-border);
  border-radius: var(--eb-radius);
  box-shadow: var(--eb-shadow-md);
  margin-top: 4px;
}

/* positioning utilities — completan eb-left-0, eb-top-0 existentes */
.eb-right-0  { right: 0; }
.eb-bottom-0 { bottom: 0; }

/* inset shorthand (top:0; right:0; bottom:0; left:0) — patrón overlay */
.eb-inset-0 {
  top: 0; right: 0; bottom: 0; left: 0;
}

/* Pase 3 inline cleanup (2026-05-02):
   eb-min-h-row — altura estándar de input/button row (38px ≈ form-input height).
   Justificación: 8+ usos en buyers/NewRequest, RequestDetail, suppliers/NewProduct
   para alinear toggles y dropdown triggers con form-input. No componible. */
.eb-min-h-row { min-height: 38px; }

/* Square icon containers — patrón container fixed-size para emoji/icon centrado.
   8+ usos en buyers/NewRequest (commodity picker), exportbrazil (commodity grid). */
.eb-square-36 { width: 36px; height: 36px; flex-shrink: 0; }
.eb-square-48 { width: 48px; height: 48px; flex-shrink: 0; }

/* Icon column en option lists (16px width + center align) — checkmarks en dropdowns.
   6+ usos en NewRequest. No componible (16px arbitrario). */
.eb-icon-col { width: 16px; text-align: center; flex-shrink: 0; }

/* Dropdown panels con max-height variables. Extiende eb-dropdown-panel.
   Para dropdowns con muchos items necesitan más altura que el default 240. */
.eb-dropdown-panel-lg { max-height: 360px; }
.eb-dropdown-panel-xl { max-height: 480px; }

/* eb-rounded-none — borderRadius: 0 explícito (botones segmentados, etc.) */
.eb-rounded-none { border-radius: 0; }