/* Lista compacta de ingredientes y controles de cantidad del editor de recetas. */
#recipeBuilderCard .recipe-builder-heading { align-items: flex-start; }
#recipeBuilderCard .recipe-builder-title { margin: .15rem 0 .35rem; font-size: 1.15rem; }
#recipeBuilderCard .recipe-builder-help { max-width: 42rem; margin: 0; line-height: 1.5; }
#recipeBuilderCard .recipe-catalog-tools { margin-top: 1rem; padding: .8rem; border: 1px solid var(--color-border, rgba(128,145,158,.35)); border-radius: .75rem; background: var(--color-surface-raised, rgba(128,145,158,.06)); }
#recipeBuilderCard .recipe-catalog-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: .75rem; margin-bottom: .65rem; }
#recipeBuilderCard .recipe-catalog-heading h4 { margin: 0; font-size: .98rem; }
#recipeBuilderCard .recipe-catalog-heading p { margin: .22rem 0 0; color: var(--color-text-muted, #78828a); font-size: .82rem; line-height: 1.4; }
#recipeBuilderCard .recipe-selected-count { flex: 0 0 auto; padding: .3rem .5rem; border: 1px solid var(--color-border, #ccd4dc); border-radius: 999px; color: var(--color-text-secondary, #344252); font-size: .76rem; font-weight: 750; }
#recipeBuilderCard .recipe-picker-filters { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(12rem, 1fr); gap: .65rem; }
#recipeBuilderCard .recipe-picker-filters .form-group { margin: 0; }
#recipeBuilderCard .recipe-selected-filter { display: inline-flex; min-height: 2.5rem; align-items: center; gap: .45rem; margin-top: .55rem; padding: .35rem .65rem; border: 1px solid var(--color-border, #ccd4dc); border-radius: .55rem; background: var(--color-surface, transparent); color: var(--color-text-secondary, #344252); font: inherit; font-size: .8rem; font-weight: 700; cursor: pointer; }
#recipeBuilderCard .recipe-selected-filter[aria-pressed="true"] { border-color: var(--color-primary, #df5b47); background: color-mix(in srgb, var(--color-primary, #df5b47) 10%, var(--color-surface, white)); color: var(--color-text-primary, #17202a); }
#recipeBuilderCard .recipe-selected-filter:focus-visible,
#recipeBuilderCard .recipe-supply-select:focus-visible,
#recipeBuilderCard .recipe-quantity-step:focus-visible,
#recipeBuilderCard .recipe-qty-input:focus-visible { outline: 3px solid var(--color-focus, #f3b65d); outline-offset: 2px; position: relative; z-index: 1; }
#recipeBuilderCard .recipe-picker-message { margin: .65rem 0 0; padding: .65rem .75rem; border-radius: .55rem; background: var(--color-surface, rgba(128,145,158,.08)); color: var(--color-text-secondary, #64717d); line-height: 1.45; }
#recipeBuilderCard .recipe-picker-message[hidden] { display: none; }
#recipeBuilderCard .recipe-catalog-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0; max-height: min(28rem, 46vh); overflow: auto; overscroll-behavior: contain; scroll-padding-block: .35rem; scrollbar-gutter: stable; margin-top: .55rem; padding: .15rem .2rem; }
#recipeBuilderCard .recipe-supply-card { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; min-width: 0; border: 0; border-bottom: 1px solid color-mix(in srgb, var(--color-border, #9aa5af) 46%, transparent); border-radius: 0; background: transparent; transition: background-color .14s ease; }
#recipeBuilderCard .recipe-supply-card:last-child { border-bottom-color: transparent; }
#recipeBuilderCard .recipe-supply-card.is-selected { background: color-mix(in srgb, var(--color-primary, #df5b47) 7%, var(--color-surface, white)); }
#recipeBuilderCard .recipe-supply-card:not(.is-selected):hover { background: color-mix(in srgb, var(--color-text-primary, #17202a) 4%, var(--color-surface, white)); }
#recipeBuilderCard .recipe-supply-card.is-unavailable { box-shadow: inset 3px 0 var(--color-danger, #dc4444); }
#recipeBuilderCard .recipe-supply-select { display: flex; width: 100%; min-width: 0; min-height: 2.75rem; align-items: center; gap: .6rem; padding: .3rem .55rem; border: 0; border-radius: .35rem; background: transparent; color: var(--color-text-primary, #17202a); font: inherit; text-align: left; cursor: pointer; }
#recipeBuilderCard .recipe-supply-select:active,
#recipeBuilderCard .recipe-quantity-step:active { background: color-mix(in srgb, var(--color-primary, #df5b47) 14%, var(--color-surface-raised, white)); }
#recipeBuilderCard .recipe-supply-selection-mark { display: grid; flex: 0 0 1.25rem; width: 1.25rem; height: 1.25rem; place-items: center; border: 1.5px solid var(--color-border-strong, #9aa5af); border-radius: .3rem; color: #fff; font-size: .85rem; font-weight: 900; line-height: 1; }
#recipeBuilderCard .recipe-supply-card.is-selected .recipe-supply-selection-mark { border-color: var(--color-primary, #df5b47); background: var(--color-primary, #df5b47); }
#recipeBuilderCard .recipe-supply-identity { display: grid; min-width: 0; gap: .05rem; }
#recipeBuilderCard .recipe-supply-identity strong { overflow-wrap: anywhere; font-size: .86rem; line-height: 1.22; }
#recipeBuilderCard .recipe-supply-identity small { color: var(--color-text-muted, #78828a); font-size: .73rem; }
#recipeBuilderCard .recipe-counter-controls { display: grid; grid-template-columns: minmax(0, 1fr); gap: .12rem; min-width: 0; padding: .15rem .45rem .15rem .65rem; }
#recipeBuilderCard .recipe-counter-inputs { display: flex; align-items: center; justify-content: flex-end; gap: .28rem; min-width: 0; }
#recipeBuilderCard .recipe-quantity-step { display: grid; flex: 0 0 2.5rem; width: 2.5rem; height: 2.5rem; place-items: center; border: 1px solid var(--color-border, #aab3bb); border-radius: .45rem; background: var(--color-surface-raised, #f8fafc); color: var(--color-text-primary, #17202a); font: inherit; font-size: 1.15rem; font-weight: 750; cursor: pointer; }
#recipeBuilderCard .recipe-quantity-step:hover { border-color: var(--color-primary, #df5b47); background: color-mix(in srgb, var(--color-primary, #df5b47) 8%, var(--color-surface-raised, white)); }
#recipeBuilderCard .recipe-qty-input { flex: 0 1 4rem; width: 4rem; min-width: 3.5rem; height: 2.5rem; padding-inline: .35rem; text-align: center; font-variant-numeric: tabular-nums; }
#recipeBuilderCard .recipe-qty-input[aria-invalid="true"] { border-color: var(--color-danger, #dc4444); box-shadow: 0 0 0 1px color-mix(in srgb, var(--color-danger, #dc4444) 32%, transparent); }
#recipeBuilderCard .recipe-row-unit { flex: 0 0 auto; max-width: 7rem; overflow-wrap: anywhere; color: var(--color-text-secondary, #344252); font-size: .76rem; }
#recipeBuilderCard .recipe-row-error { grid-column: 1 / -1; min-height: 0; margin: 0; color: var(--color-danger, #dc4444); font-size: .74rem; line-height: 1.3; }
#recipeBuilderCard .recipe-row-error:empty { display: none; }
@media (max-width: 560px) {
  #recipeBuilderCard .recipe-catalog-tools { padding: .65rem; }
  #recipeBuilderCard .recipe-picker-filters { grid-template-columns: minmax(0, 1fr); gap: .45rem; }
  #recipeBuilderCard .recipe-catalog-grid { max-height: min(24rem, 40vh); }
  #recipeBuilderCard .recipe-supply-card { grid-template-columns: minmax(0, 1fr); padding-block: .12rem; }
  #recipeBuilderCard .recipe-supply-select { min-height: 2.55rem; }
  #recipeBuilderCard .recipe-counter-controls { padding: 0 .45rem .3rem 1.55rem; }
  #recipeBuilderCard .recipe-counter-inputs { flex-wrap: wrap; justify-content: flex-start; }
  #recipeBuilderCard .recipe-qty-input { flex-basis: 3.25rem; width: 3.25rem; min-width: 3.25rem; }
  #recipeBuilderCard .recipe-row-unit { max-width: min(8rem, 38vw); }
}