/* Presentación Porciones reutilizando literalmente las tarjetas de Stock. */
#view[data-route="stock"] .sk-stock-title { display:flex; align-items:center; justify-content:space-between; gap:12px 16px; flex-wrap:wrap; }
#view[data-route="stock"] .sk-stock-title > div:first-child { min-width:0; flex:1 1 220px; }
/* Cabecera de Stock: 1) «+» (acción principal), 2) Historial, 3) herramientas secundarias (Porciones y ⋮). */
#view[data-route="stock"] .sk-stock-acciones { display:flex; align-items:center; gap:8px; flex:none; }
#view[data-route="stock"] .sk-plus { flex:none; display:inline-flex; align-items:center; justify-content:center; width:56px; height:56px; border:0; border-radius:18px; background:var(--accent-solid); color:#fffaf2; font:inherit; font-size:34px; font-weight:600; line-height:1; cursor:pointer; touch-action:manipulation; box-shadow:0 4px 0 color-mix(in srgb, var(--accent-solid) 60%, #000), 0 10px 18px color-mix(in srgb, var(--accent-solid) 32%, transparent); transition:transform .12s var(--ease), box-shadow .12s var(--ease); }
#view[data-route="stock"] .sk-plus:hover { transform:translateY(-2px); box-shadow:0 6px 0 color-mix(in srgb, var(--accent-solid) 60%, #000), 0 14px 22px color-mix(in srgb, var(--accent-solid) 36%, transparent); }
#view[data-route="stock"] .sk-plus:active { transform:translateY(3px); box-shadow:0 1px 0 color-mix(in srgb, var(--accent-solid) 60%, #000); }
#view[data-route="stock"] .sk-plus:focus-visible, #view[data-route="stock"] .sk-mas:focus-visible { outline:3px solid var(--text); outline-offset:3px; }
#view[data-route="stock"] .sk-stock-history-toggle { flex:none; min-height:44px; padding:0 14px; gap:7px; border-radius:12px; font-weight:700; }
#view[data-route="stock"] .sk-stock-history-toggle svg { width:18px; height:18px; flex:none; }
#view[data-route="stock"] .sk-stock-portions { flex:none; min-height:44px; padding:0 14px; border:1px solid var(--accent-solid); color:var(--accent); font-weight:750; }
#view[data-route="stock"] .sk-stock-portions:hover { background:var(--accent-soft); }
#view[data-route="stock"] .sk-mas { flex:none; display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; border:1px solid var(--border-strong); border-radius:12px; background:var(--surface); color:var(--text); cursor:pointer; touch-action:manipulation; }
#view[data-route="stock"] .sk-mas:hover, #view[data-route="stock"] .sk-mas[aria-expanded="true"] { background:var(--surface-2); }
#view[data-route="stock"] .sk-mas svg { width:20px; height:20px; }
/* celular: fila 1 = «+», Historial (ocupa lo que sobra) y ⋮; fila 2 = Porciones a todo el ancho. Nada se superpone ni se corta desde 320 px. */
@media (max-width: 480px) {
  #view[data-route="stock"] .sk-stock-acciones { display:grid; grid-template-columns:auto minmax(0, 1fr) auto; flex:1 1 100%; min-width:0; gap:8px; }
  #view[data-route="stock"] .sk-plus { width:52px; height:52px; font-size:32px; }
  #view[data-route="stock"] .sk-stock-history-toggle { grid-column:2; grid-row:1; justify-content:center; min-width:0; }
  #view[data-route="stock"] .sk-mas { grid-column:3; grid-row:1; }
  #view[data-route="stock"] .sk-stock-portions { grid-column:1 / -1; grid-row:2; min-width:0; }
}
.sp-page { min-width:0; }
.sp-section { display:grid; gap:12px; min-width:0; }
.sp-section > h3 { margin:8px 0 0; color:var(--accent); font-size:20px; }
.sp-grid { min-width:0; }
.sp-product { min-height:0; padding:12px; gap:5px; }
.sp-product .spc-name { display:flex; align-items:center; gap:6px; min-width:0; padding-right:0; white-space:normal; }
.sp-product-icon { display:inline-grid; place-items:center; width:27px; height:27px; flex:none; border-radius:8px; background:var(--accent-soft); }
.sp-product-name { flex:1; min-width:0; overflow-wrap:anywhere; }
.sp-main-status { flex:none; border-radius:999px; padding:4px 6px; font-size:10px; line-height:1.1; font-weight:850; white-space:nowrap; }
.sp-main-status.is-available { color:var(--ok); background:var(--ok-soft); }
.sp-main-status.is-empty { color:var(--danger); background:var(--danger-soft); }
.sp-main-status.is-unconfigured { color:var(--text-muted); background:var(--surface-2); }
.sp-portion-options { display:grid; gap:3px; margin-top:3px; }
.sp-portion-option { display:flex; justify-content:space-between; align-items:center; gap:5px; min-width:0; padding:4px 2px; border-bottom:1px solid var(--border); font-size:12px; line-height:1.2; }
.sp-portion-option:last-child { border-bottom:0; }
.sp-portion-option > span:first-child { min-width:0; font-weight:700; overflow-wrap:anywhere; }
.sp-status { flex:none; font-size:12px; }
.sp-portion-option.is-available { color:var(--ok); }
.sp-portion-option.is-empty { color:var(--danger); }
.sp-portion-option.is-unconfigured { color:var(--text-muted); }
@media(max-width:600px) {
  .sp-grid.sk-prod-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
  .sp-product { min-height:0; padding:9px; }
  .sp-product .spc-name { font-size:13px; }
  .sp-product-icon { width:23px; height:23px; }
  .sp-main-status { padding:4px; font-size:9px; }
  .sp-portion-option { font-size:11px; }
}

/* Confirmación inicial de Hay / No hay */
#view[data-route="stock"] .sk-confirmar-disp { display:flex; flex-direction:column; align-items:flex-start; gap:2px; width:100%; min-height:56px; margin-bottom:14px; border:1px solid var(--accent-solid); background:var(--accent-soft); color:var(--accent); text-align:left; }
#view[data-route="stock"] .sk-confirmar-disp span { font-size:13px; font-weight:500; }
.cd-lista { display:flex; flex-direction:column; gap:8px; max-height:55vh; overflow:auto; margin-top:8px; }
.cd-fila { display:flex; justify-content:space-between; align-items:center; gap:10px; padding:8px 0; border-bottom:1px solid var(--line, rgba(128,128,128,.25)); }
.cd-nombre { display:flex; flex-direction:column; min-width:0; }
.cd-nombre small { opacity:.7; }
.cd-opc { display:flex; gap:12px; flex:none; }
.cd-opc label { display:flex; align-items:center; gap:4px; min-height:44px; font-weight:700; }

/* Revisión de vínculos del Stock */
.rv-sec { margin-top: 14px; }
.rv-sec h4 { margin: 0 0 4px; }

.rv-acciones { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; justify-content: flex-end; }
.rv-acciones select { min-height: 36px; padding: 2px 8px; border: 1px solid var(--line, #d1d5db); border-radius: 10px; background: var(--surface, #fff); color: inherit; }
.rv-verdura { flex-direction: column; align-items: stretch; gap: 8px; }
.rv-verdura .rv-acciones { justify-content: flex-start; }
.rv-verdura .rv-acciones select { flex: 1 1 160px; min-width: 0; }
.rv-verdura .rv-acciones .btn { min-height: 40px; }
@media (max-width: 520px) { .rv-verdura .rv-acciones select { flex-basis: 100%; } .rv-verdura .rv-acciones { max-width: 100%; } .rv-verdura .rv-acciones [data-vincular-verdura] { flex: 1 1 100%; } }
#view[data-route="stock"] .sk-confirmar-disp { white-space: normal; height: auto; max-width: 100%; box-sizing: border-box; overflow-wrap: anywhere; line-height: 1.3; padding-block: 10px; }
#view[data-route="stock"] .sk-confirmar-disp span { white-space: normal; }

/* ---- Disponibilidad: colores del estado (verde HAY · rojo NO HAY · amarillo HAY PARA X) y pantalla «+» de cambio rápido ---- */
.sk-prod-card.sk-estado-hay { border-left: 5px solid #2e8b57; }
.sk-prod-card.sk-estado-no-hay { border-left: 5px solid #c0392b; }
.sk-prod-card.sk-estado-limitado { border-left: 5px solid #e0a800; }
.sd-wrap { max-width: 100%; }
.sd-leyenda { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; margin: 4px 0 10px; font-size: 13px; font-weight: 600; }
.sd-dot { display: inline-block; width: 12px; height: 12px; border-radius: 50%; vertical-align: -1px; }
.sd-dot.hay { background: #2e8b57; } .sd-dot.no-hay { background: #c0392b; } .sd-dot.limitado { background: #e0a800; }
.sd-buscar { width: 100%; box-sizing: border-box; min-height: 44px; padding: 6px 12px; margin-bottom: 10px; border: 1px solid var(--line, #d1d5db); border-radius: 12px; background: var(--surface, #fff); color: inherit; font-size: 16px; }
.sd-grupo { margin-bottom: 16px; }
.sd-grupo h3 { margin: 6px 0 8px; font-size: 16px; }
.sd-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; }
.sd-item { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.sd-tile { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 2px; min-height: 64px; padding: 8px 12px; border: 2px solid transparent; border-radius: 14px; text-align: left; cursor: pointer; color: #fff; overflow-wrap: anywhere; white-space: normal; }
.sd-tile .sd-nombre { font-weight: 700; font-size: 15px; line-height: 1.2; }
.sd-tile .sd-estado { font-size: 12px; font-weight: 800; letter-spacing: .04em; opacity: .95; }
.sd-tile.hay { background: #2e8b57; } .sd-tile.no-hay { background: #c0392b; } .sd-tile.limitado { background: #e0a800; color: #1f1f1f; }
.sd-tile:disabled { opacity: .55; cursor: default; }
.sd-x { align-self: stretch; min-height: 32px; padding: 2px 8px; border: 1px dashed var(--line, #9ca3af); border-radius: 10px; background: transparent; color: inherit; font-size: 12px; cursor: pointer; }

/* Disponibilidad rápida: los ingredientes de las personalizaciones llevan su propio título */
.sd-sep { margin: 22px 0 6px; font-size: 15px; font-weight: 700; }