/* =====================================================================
   hambre_cero.css — Módulo Hambre Cero (pantalla de trazabilidad del menú)
   Prefijo de clases: hc-. Colores SOLO por tokens de 00_tokens.css.
   ===================================================================== */

/* ---------- Línea de fuente bajo el título ---------- */
.hc-fuente {
    font-size: 0.85rem;
    color: var(--color-text-soft);
    margin-top: 2px;
}

/* ---------- Barra de herramientas: migas + controles ---------- */
.hc-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: var(--space-3);
}
.hc-controles {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: var(--space-3);
}
.hc-control {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 180px;
}
.hc-control label {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--color-text-soft);
    margin: 0;
}
.hc-oculto { display: none !important; }

/* ---------- Migas de pan ---------- */
.hc-migas ol {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px;
    list-style: none;
    margin: 0;
    padding: 0;
    font-size: 0.95rem;
}
.hc-migas li { display: inline-flex; align-items: center; gap: 4px; }
.hc-migas li + li::before {
    content: "→";
    color: var(--color-text-muted);
    margin: 0 4px;
}
.hc-miga-btn {
    background: none;
    border: none;
    padding: 2px 4px;
    color: var(--color-primary-2);
    text-decoration: underline;
    cursor: pointer;
    border-radius: var(--radius-sm);
    font: inherit;
}
.hc-miga-btn:hover { background: var(--color-primary-soft); }
.hc-miga-btn:focus-visible {
    outline: 2px solid var(--color-primary-2);
    outline-offset: 1px;
}
.hc-miga-actual {
    font-weight: 600;
    color: var(--color-text);
    padding: 2px 4px;
}

.hc-ayuda {
    font-size: 0.9rem;
    color: var(--color-text-soft);
    margin: var(--space-2) 0;
}

/* ---------- Grid ---------- */
.hc-grid { width: 100%; }
.hc-grid .ag-row { cursor: pointer; }

/* La cuenta de la receta: Rinde · Cantidad de la línea · Por ración.
   Separadores con box-shadow inset (no pisa el borde de foco de AG Grid). */
.ag-theme-portal .ag-header-cell.hc-cuenta-ini {
    box-shadow: inset 2px 0 0 var(--color-on-brand-soft);
}
.ag-theme-portal .ag-header-cell.hc-cuenta-fin {
    box-shadow: inset -2px 0 0 var(--color-on-brand-soft);
}
.ag-theme-portal .ag-cell.hc-cuenta { background-color: var(--color-surface-soft); }
.ag-theme-portal .ag-cell.hc-cuenta-ini {
    box-shadow: inset 2px 0 0 var(--color-primary-2);
}
.ag-theme-portal .ag-cell.hc-cuenta-fin {
    box-shadow: inset -2px 0 0 var(--color-primary-2);
}

/* Filas marcadas (además del badge con texto, que es la señal principal). */
.ag-theme-portal .ag-row.hc-fila-roja { box-shadow: inset 3px 0 0 var(--color-danger); }
.ag-theme-portal .ag-row.hc-fila-ambar { box-shadow: inset 3px 0 0 var(--color-warning); }
.ag-theme-portal .ag-row.hc-fila-ambar-fondo {
    background-color: var(--color-warning-soft);
    box-shadow: inset 3px 0 0 var(--color-warning);
}

/* ---------- Badges (cellRenderers de assets/gridComponents.js) ---------- */
.hc-cell-flex { display: inline-flex; align-items: center; gap: 6px; min-width: 0; }
.hc-cell-texto { overflow: hidden; text-overflow: ellipsis; }
.hc-cell-ok { color: var(--color-text-soft); }
.hc-badge {
    display: inline-block;
    padding: 1px 8px;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 600;
    line-height: 1.5;
    white-space: nowrap;
}
.hc-badge-rojo { background: var(--color-danger-soft); color: var(--color-danger); }
.hc-badge-ambar { background: var(--color-warning-soft); color: var(--color-warning); }
.hc-icono-info {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    border: 1px solid var(--color-info);
    color: var(--color-info);
    font-size: 0.7rem;
    font-weight: 700;
    font-style: italic;
    cursor: help;
    flex: 0 0 auto;
}

/* ---------- Nota fija bajo el grid (nivel 4) ---------- */
.hc-nota {
    font-size: 0.85rem;
    color: var(--color-text-soft);
    margin-top: var(--space-2);
}

/* ---------- Panel lateral de presentaciones ---------- */
/* Bootstrap fija el ancho con --bs-offcanvas-width (400px): se pisa la variable. */
.offcanvas.hc-panel { --bs-offcanvas-width: min(720px, 100vw); }
.hc-panel-resumen { font-size: 0.9rem; margin-bottom: var(--space-3); }

/* ---------- Móvil ---------- */
@media (max-width: 767px) {
    .hc-toolbar, .hc-controles { flex-direction: column; align-items: stretch; }
    .hc-control { min-width: 0; }
}

/* =====================================================================
   Fase 2 — Cabecera de vigencia de fuentes (hc-cab-)
   ===================================================================== */
.hc-cab { margin-top: var(--space-2); }
.hc-cab-lista {
    list-style: none;
    margin: 0;
    padding: 0;
    font-size: 0.82rem;
    color: var(--color-text-soft);
}
.hc-cab-linea { display: flex; gap: var(--space-2); line-height: 1.5; }
.hc-cab-fuente {
    flex: 0 0 3.2em;
    font-weight: 700;
    color: var(--color-text);
}
.hc-cab-ambar { color: var(--color-warning); font-weight: 600; }
.hc-cab-linea.hc-cab-ambar .hc-cab-fuente { color: var(--color-warning); }
.hc-cab-na { font-size: 0.82rem; color: var(--color-text-muted); margin: 0; }

/* =====================================================================
   Fase 2 — Pantalla 1: raciones planificadas (hc-rac-)
   ===================================================================== */
.hc-seccion { margin-bottom: var(--space-4); }
.hc-seccion-titulo { font-size: 1.05rem; font-weight: 700; margin: 0; }
.hc-filtros {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: var(--space-3);
    margin: var(--space-3) 0;
}
.hc-filtros .hc-control { flex: 1 1 200px; min-width: 180px; }
.hc-fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
.hc-legend {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--color-text-soft);
    margin: 0 0 4px 0;
    float: none;
    width: auto;
}
.hc-radios label { font-size: 0.9rem; display: block; }
.hc-modal .hc-control { margin-bottom: var(--space-3); }
.hc-barra-guardar { margin-bottom: var(--space-2); align-items: center; }
.hc-pendientes { font-size: 0.88rem; color: var(--color-text-soft); margin: 0; }

/* Lote elegido en el grid de lotes. */
.ag-theme-portal .ag-row.hc-fila-sel {
    background-color: var(--color-primary-soft);
    box-shadow: inset 3px 0 0 var(--color-primary-2);
    font-weight: 600;
}
.hc-grid-rac .ag-row { cursor: default; }

/* Celdas editables (BORRADOR) y editadas sin guardar. */
.ag-theme-portal .ag-cell.hc-editable { background-color: var(--color-info-soft); cursor: text; }
.ag-theme-portal .ag-cell.hc-editada {
    background-color: var(--color-warning-soft);
    box-shadow: inset 0 -2px 0 var(--color-warning);
    font-weight: 700;
}
.ag-theme-portal .ag-cell.hc-control-ambar { color: var(--color-warning); font-weight: 600; }

/* Pie: totales de lo filtrado. */
.hc-totales { margin-top: var(--space-3); }
.hc-totales-titulo { font-size: 0.9rem; font-weight: 600; margin: 0 0 var(--space-1) 0; }
.hc-totales-tabla { border-collapse: collapse; font-size: 0.9rem; min-width: min(100%, 460px); }
.hc-totales-tabla th, .hc-totales-tabla td {
    padding: 4px 12px;
    border-bottom: 1px solid var(--color-border, #e3e8ef);
    text-align: left;
}
.hc-totales-tabla .hc-num { text-align: right; font-variant-numeric: tabular-nums; }
.hc-totales-tabla .hc-num-fuerte { font-weight: 700; }

/* Toasts arriba a la derecha. */
.hc-toasts {
    position: fixed;
    top: 72px;
    right: 16px;
    z-index: 1080;
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    max-width: min(420px, calc(100vw - 32px));
}

@media (max-width: 767px) {
    .hc-filtros { flex-direction: column; align-items: stretch; }
    .hc-filtros .hc-control { flex: 1 1 auto; min-width: 0; }
    .hc-cab-linea { display: block; margin-bottom: 4px; }
    .hc-cab-fuente { display: inline; margin-right: 6px; }
    .hc-totales-tabla { width: 100%; }
}

/* =========================================================
   Fase 3 — Plan de compra (hc-pla-)
   ========================================================= */
.hc-pla-params { align-items: flex-end; }
.hc-pla-params .hc-control { flex: 1 1 180px; min-width: 160px; }
.hc-pla-params .hc-control-rango { flex: 1 1 300px; min-width: 290px; }
.hc-pla-params .hc-control-colchon { flex: 0 1 140px; min-width: 120px; }
.hc-pla-resumen {
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--color-text);
    margin: 0 0 var(--space-2) 0;
}
.hc-pla-pie {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2) var(--space-4);
    font-size: 0.9rem;
    color: var(--color-text-soft);
    margin-top: var(--space-2);
}
.hc-pla-pie strong { color: var(--color-text); }
.hc-pla-pie .hc-cab-ambar { font-weight: 600; }
.ag-theme-portal .ag-cell.hc-sin-precio { color: var(--color-warning); font-weight: 600; }
.hc-pla-drill { margin-top: var(--space-3); }
.hc-pla-drill-cab {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: var(--space-2);
    flex-wrap: wrap;
}
.hc-pla-param-msg:empty { display: none; }
@media (max-width: 767px) {
    .hc-pla-params { align-items: stretch; }
    .hc-pla-params .hc-control,
    .hc-pla-params .hc-control-rango,
    .hc-pla-params .hc-control-colchon { flex: 1 1 auto; min-width: 0; }
    .hc-pla-drill-cab { flex-direction: column; align-items: stretch; }
}

/* =========================================================
   Simulador de compra (hc-sim-) — colores del diseño aprobado
   (docs/diseno/simulador.dc.html)
   ========================================================= */
:root {
    --hc-sim-mas: #8A4B00;          /* más que OSS */
    --hc-sim-menos: #1F5FA8;        /* menos que OSS */
    --hc-sim-igual: #566079;
    --hc-sim-oro: #C8961E;          /* elegido / pendiente */
    --hc-sim-oro-fondo: #FBF3DF;
    --hc-sim-oro-texto: #7A5A0A;
    --hc-sim-reparto: #7A4A0B;
    --hc-sim-azul: #1D3557;
    --hc-sim-borde: #D7DDE7;
    --hc-sim-linea: #E3E8F0;
    --hc-sim-suave: #F4F6FA;
    --hc-sim-texto: #14213D;
    --hc-sim-texto-2: #566079;
    --hc-sim-gris: #6B7488;
}
.hc-sim { font-variant-numeric: tabular-nums; }
.hc-sim-subtitulo { margin: 4px 0 0; font-size: 0.95rem; color: var(--hc-sim-texto-2); max-width: 720px; }
.hc-sim .hc-seccion-titulo { color: var(--hc-sim-texto); }

/* ---------- 1. Entrada ---------- */
.hc-sim-params { align-items: flex-end; }
.hc-sim-params .hc-control { min-width: 0; }
.hc-sim-params .SingleDatePickerInput { border-radius: 8px; }
.hc-sim-control-colchon { width: 100px; }
.hc-sim .btn.hc-sim-btn-sec {
    background: #FFFFFF; color: var(--hc-sim-azul); border: 1px solid var(--hc-sim-azul);
    font-weight: 600; min-height: 40px; border-radius: 8px;
}
.hc-sim .btn.hc-sim-btn-sec:hover:not(:disabled) { background: var(--hc-sim-suave); }
.hc-sim .btn.hc-sim-calcular {
    background: var(--hc-sim-azul); color: #FFFFFF; border: 0; font-weight: 700;
    min-height: 40px; padding: 0 22px; border-radius: 8px;
}
.hc-sim .btn.hc-sim-calcular.hc-sim-calcular-pendiente {
    background: var(--hc-sim-oro); color: var(--hc-sim-texto);
}
.hc-sim .btn:focus-visible,
.hc-sim-input:focus-visible,
.hc-sim-tarjeta:focus-visible,
.hc-sim-menu:focus-visible { outline: 2px solid var(--hc-sim-oro); outline-offset: 1px; }
.hc-sim-tabla-scroll { overflow-x: auto; margin-top: var(--space-3); min-width: 0; max-width: 100%; }
.hc-sim-tabla {
    display: flex; flex-direction: column; min-width: 760px;
    border: 1px solid var(--hc-sim-borde); border-radius: 10px; overflow: hidden;
}
.hc-sim-fila {
    display: grid;
    grid-template-columns: minmax(200px, 2fr) repeat(4, minmax(96px, 1fr)) minmax(110px, 0.9fr);
    gap: 12px; align-items: center; padding: 10px 16px;
    border-top: 1px solid var(--hc-sim-linea); background: #FFFFFF;
}
#hc-sim-tabla > .hc-sim-fila:nth-child(even) { background: #FAFBFD; }
.hc-sim-cargando { padding: 10px 16px; margin: 0; }
.hc-sim-fila-cab {
    background: var(--hc-sim-azul) !important; color: #FFFFFF; font-size: 0.75rem;
    font-weight: 600; letter-spacing: 0.02em; border-top: 0;
}
.hc-sim-fila-total {
    background: var(--hc-sim-suave) !important; font-weight: 600; padding: 12px 16px;
}
.hc-sim-fila-total .hc-num { text-align: right; padding-right: 8px; }
.hc-sim-proy { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.hc-sim-proy-nombre { font-size: 0.9rem; font-weight: 600; color: var(--hc-sim-texto); }
.hc-sim-proy-reparto { font-size: 0.75rem; color: var(--hc-sim-reparto); }
.hc-sim-casilla { display: flex; flex-direction: column; gap: 2px; }
/* position: relative contiene el .visually-hidden (absoluto): si no, queda fuera del scroll de la tabla y ensancha la página en móvil. */
.hc-sim-casilla-label { margin: 0; display: block; position: relative; }
.hc-sim-input {
    height: 36px; width: 100%; box-sizing: border-box; border: 1px solid #C3CBD9;
    border-radius: 6px; padding: 0 8px; font: inherit; font-size: 0.9rem;
    text-align: right; color: var(--hc-sim-texto); background: #FFFDF6;
}
.hc-sim-input.hc-sim-invalido { border: 2px solid var(--color-danger); background: #FFF5F5; }
.hc-sim-oss { font-size: 0.7rem; color: var(--hc-sim-gris); text-align: right; }
.hc-sim-delta { text-align: right; font-size: 0.8rem; font-weight: 600; }
.hc-sim-mas { color: var(--hc-sim-mas); }
.hc-sim-menos { color: var(--hc-sim-menos); }
.hc-sim-igual { color: var(--hc-sim-igual); }
.hc-sim-pendiente {
    margin-top: var(--space-3); font-size: 0.85rem; color: var(--hc-sim-oro-texto);
    background: var(--hc-sim-oro-fondo); border-radius: 8px; padding: 10px 14px;
}

/* ---------- 2. Centros ---------- */
.hc-sim-centros { display: flex; flex-direction: column; gap: 12px; margin: var(--space-4) 0; }
.hc-sim-centros-cab {
    display: flex; justify-content: space-between; align-items: baseline; gap: 16px; flex-wrap: wrap;
}
.hc-sim-resumen { font-size: 0.9rem; color: var(--hc-sim-texto-2); }
.hc-sim-tarjetas { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; }
.hc-sim-tarjetas:empty { display: none; }
.hc-sim-tarjeta {
    display: flex; flex-direction: column; gap: 6px; text-align: left; padding: 16px;
    border-radius: 12px; font: inherit; color: var(--hc-sim-texto); cursor: pointer;
    min-height: 44px; background: #FFFFFF; border: 1px solid var(--hc-sim-borde);
}
.hc-sim-tarjeta:hover { border-color: var(--hc-sim-oro); }
.hc-sim-tarjeta-sel { background: var(--hc-sim-oro-fondo); border: 2px solid var(--hc-sim-oro); }
.hc-sim-tarjeta-nombre { font-size: 0.95rem; font-weight: 700; }
.hc-sim-tarjeta-costo { font-size: 1.375rem; font-weight: 700; letter-spacing: -0.01em; }
.hc-sim-tarjeta-sub { font-size: 0.75rem; color: var(--hc-sim-texto-2); }
.hc-sim-tarjeta-pie {
    display: flex; justify-content: space-between; gap: 8px; font-size: 0.8rem;
    color: #34405A; border-top: 1px solid var(--hc-sim-linea); padding-top: 8px;
}
.hc-sim-tarjeta-delta { font-size: 0.75rem; font-weight: 600; }

/* ---------- 3 + 4. Matriz y panel ---------- */
.hc-sim-res {
    display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 18px; align-items: start;
}
.hc-sim-matriz { min-width: 0; }
.hc-sim-grid .ag-row.hc-sim-fila-cat { background: var(--hc-sim-suave); }
.hc-sim-cat {
    font-size: 0.75rem; font-weight: 700; letter-spacing: 0.04em; color: #34405A;
    white-space: nowrap;
}
.hc-sim-insumo { display: flex; flex-direction: column; line-height: 1.2; min-width: 0; padding-top: 4px; }
.hc-sim-insumo-nombre { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hc-sim-mono { font-family: "IBM Plex Mono", ui-monospace, Consolas, monospace; font-size: 0.7rem; color: var(--hc-sim-gris); }
.ag-theme-portal .ag-cell.hc-sim-celda { cursor: pointer; }
.ag-theme-portal .ag-cell.hc-sim-celda:hover { background: var(--hc-sim-oro-fondo); }
.ag-theme-portal .ag-cell.hc-sim-cero { color: #9AA3B5; }
.ag-theme-portal .ag-cell.hc-sim-total { font-weight: 600; }
.ag-theme-portal .ag-cell-focus.hc-sim-celda {
    background: var(--hc-sim-oro-fondo); outline: 2px solid var(--hc-sim-oro); outline-offset: -2px;
}
.hc-sim-panel {
    padding: 20px; display: flex; flex-direction: column; gap: 14px;
    position: sticky; top: 16px; max-height: calc(100vh - 32px); overflow-y: auto;
}
.hc-sim-panel-sup { font-size: 0.75rem; color: var(--hc-sim-texto-2); }
.hc-sim-panel-titulo { margin: 0; font-size: 1.1rem; font-weight: 700; color: var(--hc-sim-texto); }
.hc-sim-panel-total { font-size: 1.6rem; font-weight: 700; letter-spacing: -0.01em; }
.hc-sim-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.hc-sim-chip { font-size: 0.7rem; font-weight: 600; border-radius: 999px; padding: 3px 9px; }
.hc-sim-chip-oro { background: var(--hc-sim-oro-fondo); color: var(--hc-sim-oro-texto); }
.hc-sim-chip-wms { background: #F3E6D3; color: var(--hc-sim-reparto); }
.hc-sim-chip-oss { background: #DDF0EE; color: #0E5A57; }
.hc-sim-chip-sap { background: #E4E9F2; color: var(--hc-sim-azul); }
.hc-sim-menus { display: flex; flex-direction: column; gap: 8px; }
.hc-sim-menu {
    display: flex; flex-direction: column; gap: 4px; padding: 10px 12px; border-radius: 8px;
    text-align: left; font: inherit; color: var(--hc-sim-texto); cursor: pointer;
    min-height: 44px; background: #FFFFFF; border: 1px solid var(--hc-sim-borde);
}
.hc-sim-menu:hover { border-color: var(--hc-sim-oro); }
.hc-sim-menu-sel { background: var(--hc-sim-oro-fondo); border: 2px solid var(--hc-sim-oro); }
.hc-sim-menu-cab {
    display: flex; justify-content: space-between; gap: 8px; font-size: 0.75rem;
    color: var(--hc-sim-texto-2);
}
.hc-sim-menu-nombre { font-size: 0.9rem; font-weight: 600; }
.hc-sim-menu-cuenta { font-size: 0.75rem; color: var(--hc-sim-texto-2); }
.hc-sim-menu-pie { display: flex; justify-content: space-between; gap: 8px; font-size: 0.8rem; color: #34405A; }
.hc-sim-menu-pie strong { color: var(--hc-sim-texto); }
.hc-sim-suma {
    display: flex; justify-content: space-between; font-size: 0.9rem; font-weight: 700;
    border-top: 2px solid var(--hc-sim-texto); padding-top: 8px;
}
.hc-sim-receta-wrap { display: flex; flex-direction: column; gap: 8px; border-top: 1px solid var(--hc-sim-linea); padding-top: 14px; }
.hc-sim-receta { width: 100%; font-size: 0.75rem; border-collapse: collapse; }
.hc-sim-receta th { color: var(--hc-sim-texto-2); font-weight: 600; border-bottom: 1px solid var(--hc-sim-linea); padding: 6px 4px; }
.hc-sim-receta td { padding: 6px 4px; border-bottom: 1px solid #EEF1F6; }
.hc-sim-receta .hc-num { text-align: right; }
.hc-sim-receta-sel td { background: var(--hc-sim-oro-fondo); font-weight: 600; }
.hc-sim-guardar { align-items: flex-end; margin-bottom: var(--space-3); }
.hc-sim-guardar .hc-control { min-width: 260px; }

/* El tema del portal pinta todo <button> (y :hover) con el degradé primario
   (z_theme.css / zz_design_v2.css, cargados después): las tarjetas-botón del
   simulador necesitan más especificidad para conservar su fondo. */
.hc-sim button.hc-sim-tarjeta, .hc-sim button.hc-sim-tarjeta:hover,
.hc-sim button.hc-sim-menu, .hc-sim button.hc-sim-menu:hover {
    background: #FFFFFF; color: var(--hc-sim-texto); box-shadow: none;
}
.hc-sim button.hc-sim-tarjeta:hover, .hc-sim button.hc-sim-menu:hover { border-color: var(--hc-sim-oro); }
.hc-sim button.hc-sim-tarjeta-sel, .hc-sim button.hc-sim-tarjeta-sel:hover,
.hc-sim button.hc-sim-menu-sel, .hc-sim button.hc-sim-menu-sel:hover {
    background: var(--hc-sim-oro-fondo); border: 2px solid var(--hc-sim-oro);
}

/* ---------- Simulador: escuelas sin centro (aviso-botón y ventana) ---------- */
.hc-sim button.hc-sim-aviso-btn, .hc-sim button.hc-sim-aviso-btn:hover {
    display: flex; align-items: center; gap: 12px; width: 100%; text-align: left;
    font: inherit; font-size: 0.9rem; color: var(--hc-sim-oro-texto);
    background: var(--hc-sim-oro-fondo); border: 1px solid #EBD9A8;
    border-left: 4px solid var(--hc-sim-oro); border-radius: 8px;
    padding: 10px 14px; cursor: pointer; box-shadow: none; min-height: 44px;
}
.hc-sim button.hc-sim-aviso-btn:hover { border-color: var(--hc-sim-oro); }
.hc-sim-aviso-texto { flex: 1 1 auto; }
.hc-sim-aviso-ver { flex: 0 0 auto; font-weight: 700; white-space: nowrap; text-decoration: underline; }
.hc-sim-sc-texto { font-size: 0.9rem; color: var(--hc-sim-texto-2); max-width: 820px; }
.hc-sim-pildoras { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: var(--space-3); }
.hc-sim-pildora {
    font-size: 0.8rem; font-weight: 600; border-radius: 999px; padding: 4px 10px;
    background: var(--hc-sim-oro-fondo); color: var(--hc-sim-oro-texto);
}
.hc-sim-sc-scroll { overflow-x: auto; }
.hc-sim-sc-tabla { width: 100%; min-width: 820px; border-collapse: collapse; font-size: 0.85rem; }
.hc-sim-sc-tabla th {
    background: var(--hc-sim-azul); color: #FFFFFF; font-weight: 600; font-size: 0.75rem;
    padding: 8px 10px; text-align: left; white-space: nowrap;
}
.hc-sim-sc-tabla td { padding: 7px 10px; border-bottom: 1px solid var(--hc-sim-linea); color: var(--hc-sim-texto); }
.hc-sim-sc-tabla tbody tr:nth-child(even) td { background: #FAFBFD; }
.hc-sim-sc-tabla .hc-num { text-align: right; }
.hc-sim-sc-tabla th.hc-num { text-align: right; }
.hc-sim-sc-tabla .hc-num-fuerte { font-weight: 700; }
.hc-sim-sc-total th, .hc-sim-sc-total td {
    background: var(--hc-sim-suave) !important; color: var(--hc-sim-texto); font-weight: 700;
    border-top: 2px solid var(--hc-sim-texto);
}
.hc-sim-sc-pie { justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.hc-sim-sc-fuente { font-size: 0.8rem; color: var(--hc-sim-texto-2); }
@media (max-width: 767px) {
    .hc-sim button.hc-sim-aviso-btn { flex-wrap: wrap; }
    .hc-sim-sc-pie { flex-direction: column; align-items: stretch; }
}

/* ---------- Simulador: aviso sin centro según el diseño ---------- */
.hc-sim button.hc-sim-aviso-btn, .hc-sim button.hc-sim-aviso-btn:hover {
    border: 1px solid #E8C877; border-left: 1px solid #E8C877; color: var(--hc-sim-texto);
    border-radius: 10px; padding: 14px 18px; gap: 14px;
}
.hc-sim button.hc-sim-aviso-btn:hover { border-color: var(--hc-sim-oro); }
.hc-sim-aviso-tag {
    font-size: 0.7rem; font-weight: 700; letter-spacing: 0.06em; background: var(--hc-sim-oro);
    color: var(--hc-sim-texto); border-radius: 6px; padding: 4px 8px; flex: 0 0 auto;
}
.hc-sim-aviso-ver { color: var(--hc-sim-reparto); text-decoration: none; }
.hc-sim-pildora { background: #FFFFFF; color: var(--hc-sim-texto); border: 1px solid var(--hc-sim-borde); font-weight: 400; padding: 5px 12px; }
.hc-sim-pildoras { background: #F7F8FB; padding: 12px; border-radius: 8px; }
.hc-sim-sc-escuela { font-weight: 600; }
.hc-sim-sc-distrito { color: var(--hc-sim-texto-2) !important; }

/* ---------- Simulador, sección 5: menú del día y costo de insumos ---------- */
.hc-sim-costo { display: flex; flex-direction: column; gap: 18px; }
.hc-sim-costo-cab { display: flex; justify-content: space-between; align-items: flex-end; gap: 20px; flex-wrap: wrap; }
.hc-sim-cproys { display: flex; gap: 8px; flex-wrap: wrap; }
.hc-sim button.hc-sim-cproy, .hc-sim button.hc-sim-cproy:hover {
    min-height: 40px; padding: 0 14px; border-radius: 999px; font: inherit; font-size: 0.8rem;
    font-weight: 600; cursor: pointer; background: #FFFFFF; color: var(--hc-sim-azul);
    border: 1px solid #C3CBD9; box-shadow: none;
}
.hc-sim button.hc-sim-cproy:hover { border-color: var(--hc-sim-azul); }
.hc-sim button.hc-sim-cproy-sel, .hc-sim button.hc-sim-cproy-sel:hover {
    background: var(--hc-sim-azul); color: #FFFFFF; border-color: var(--hc-sim-azul);
}
.hc-sim-cproy-pct { font-weight: 400; color: var(--hc-sim-texto-2); }
.hc-sim button.hc-sim-cproy-sel .hc-sim-cproy-pct { color: #C9D2E3; }
.hc-sim-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.hc-sim-kpis:empty { display: none; }
.hc-sim-kpi {
    display: flex; flex-direction: column; gap: 4px; padding: 14px 16px; border-radius: 10px;
    background: #F7F8FB; border: 1px solid var(--hc-sim-linea);
}
.hc-sim-kpi-nombre { display: flex; align-items: center; gap: 8px; font-size: 0.8rem; font-weight: 600; color: #34405A; }
.hc-sim-punto { width: 10px; height: 10px; border-radius: 999px; flex: 0 0 auto; display: inline-block; }
.hc-sim-kpi-valor { font-size: 1.5rem; font-weight: 700; letter-spacing: -0.01em; color: var(--hc-sim-texto); }
.hc-sim-kpi-sub { font-size: 0.75rem; color: var(--hc-sim-texto-2); }
.hc-sim-kpi-pie { font-size: 0.75rem; color: #34405A; border-top: 1px solid var(--hc-sim-linea); padding-top: 6px; margin-top: 2px; }
.hc-sim-kpi-ambar { font-size: 0.75rem; font-weight: 600; color: var(--hc-sim-mas); }
.hc-sim-costo-cuerpo { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 18px; align-items: start; }
.hc-sim-costo-izq { min-width: 0; }
.hc-sim-tb-scroll { overflow-x: auto; border: 1px solid var(--hc-sim-borde); border-radius: 10px; }
.hc-sim-tb { display: flex; flex-direction: column; font-size: 0.8rem; }
.hc-sim-tb-fila { display: grid; border-top: 1px solid #EEF1F6; background: #FFFFFF; }
.hc-sim-tb-fila.hc-sim-tb-primera { border-top: 1px solid var(--hc-sim-borde); }
.hc-sim-tb-cab { background: var(--hc-sim-azul); color: #FFFFFF; font-weight: 600; border-top: 0; }
.hc-sim-tb-cab > div { padding: 10px 12px; border-left: 1px solid #2E4A72; }
.hc-sim-tb-cab > div:first-child { padding-left: 14px; border-left: 0; }
.hc-sim-tb-etq { display: flex; align-items: center; gap: 8px; padding: 10px 14px; font-weight: 700; color: var(--hc-sim-texto); }
.hc-sim-tb-etq.hc-sim-tb-sub { font-weight: 500; color: #34405A; padding-left: 32px; }
.hc-sim-tb-completa { background: #F4F6FA; border-top: 1px solid var(--hc-sim-borde); }
.hc-sim-tb-completa .hc-sim-tb-etq { padding-left: 32px; }
.hc-sim-tc-wrap { display: flex; border-left: 1px solid var(--hc-sim-linea); }
.hc-sim .hc-sim-tc, .hc-sim button.hc-sim-tc, .hc-sim button.hc-sim-tc:hover {
    display: flex; flex-direction: column; justify-content: space-between; gap: 6px; width: 100%;
    padding: 10px 12px; text-align: left; font: inherit; border: 0; background: #FFFFFF;
    color: var(--hc-sim-texto); min-height: 44px; box-shadow: none; border-radius: 0;
}
.hc-sim button.hc-sim-tc { cursor: pointer; }
.hc-sim button.hc-sim-tc:hover { background: var(--hc-sim-oro-fondo); }
.hc-sim .hc-sim-tc-vacia, .hc-sim .hc-sim-tc-completa, .hc-sim .hc-sim-tc-doble {
    border-left: 1px solid var(--hc-sim-linea);
}
.hc-sim .hc-sim-tc-vacia { color: #9AA3B5; justify-content: center; }
.hc-sim .hc-sim-tc-completa { background: #F4F6FA; align-items: flex-end; justify-content: center; }
.hc-sim .hc-sim-tc-completa .hc-sim-tc-costo { font-size: 1rem; }
.hc-sim button.hc-sim-tc-sel, .hc-sim button.hc-sim-tc-sel:hover {
    background: var(--hc-sim-oro-fondo); outline: 2px solid var(--hc-sim-oro); outline-offset: -2px;
}
.hc-sim-tc-nombre {
    font-size: 0.75rem; line-height: 1.3; color: #34405A; overflow: hidden;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
}
.hc-sim-tc-costo { font-size: 0.95rem; font-weight: 700; color: var(--hc-sim-texto); text-align: right; align-self: flex-end; }
.hc-sim button.hc-sim-tc-menu, .hc-sim button.hc-sim-tc-menu:hover {
    display: flex; flex-direction: column; gap: 2px; padding: 4px 6px; text-align: left; font: inherit;
    background: #FFFFFF; color: var(--hc-sim-texto); border: 1px dashed #E8C877; border-radius: 6px;
    cursor: pointer; box-shadow: none; min-height: 44px;
}
.hc-sim button.hc-sim-tc-menu:hover { background: var(--hc-sim-oro-fondo); }
.hc-sim-tc-parcial { font-size: 0.75rem; font-weight: 600; text-align: right; }
.hc-sim-tc-suma { font-size: 0.75rem; color: var(--hc-sim-texto-2); text-align: right; }
.hc-sim-tc-suma .hc-sim-tc-costo { margin-left: 4px; }
.hc-sim-etq-ambar {
    align-self: flex-start; font-size: 0.7rem; font-weight: 700; border-radius: 999px; padding: 1px 8px;
    background: var(--hc-sim-oro-fondo); color: var(--hc-sim-mas); border: 1px solid #E8C877;
}
td.hc-sim-etq-ambar { border-radius: 0; border: 0; background: transparent; }
.hc-sim-tb-prom {
    display: flex; flex-direction: column; justify-content: center; align-items: flex-end; gap: 2px;
    padding: 10px 12px; border-left: 1px solid var(--hc-sim-linea); text-align: right;
}
.hc-sim-tb-completa .hc-sim-tb-prom { background: #F4F6FA; }
.hc-sim-prom-valor { font-weight: 700; }
.hc-sim-prom-adj, .hc-sim-prom-ratio { font-size: 0.7rem; color: var(--hc-sim-texto-2); white-space: nowrap; }
.hc-sim-prom-ratio { font-weight: 600; color: #34405A; }
.hc-sim-info { margin-left: 4px; cursor: help; color: var(--hc-sim-azul); }
.hc-sim-info:focus-visible { outline: 2px solid var(--hc-sim-oro); border-radius: 4px; }
.hc-sim-costo-pie {
    margin: 0; padding: 10px 14px; font-size: 0.75rem; color: var(--hc-sim-texto-2);
    background: #F7F8FB; border: 1px solid var(--hc-sim-linea); border-top: 0;
    border-radius: 0 0 10px 10px;
}
.hc-sim-receta-panel {
    border: 1px solid var(--hc-sim-borde); border-radius: 12px; padding: 18px;
    display: flex; flex-direction: column; gap: 12px; background: #FFFFFF;
}
.hc-sim-rc-top td { font-weight: 700; }
.hc-sim-rc-top td:last-child { color: var(--hc-sim-mas); }
.hc-sim-rc-peso { margin: 0; font-size: 0.75rem; color: var(--hc-sim-texto-2); }
.hc-sim-rc-prestada { margin: 0; font-size: 0.75rem; color: var(--hc-sim-reparto); }
.hc-sim-prom-sinprecio { margin-left: 6px; white-space: normal; }
@media (max-width: 1279px) {
    .hc-sim-costo-cuerpo { grid-template-columns: minmax(0, 1fr); }
    .hc-sim-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
    .hc-sim-costo-cab { flex-direction: column; align-items: stretch; }
    .hc-sim-kpis { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 1279px) {
    .hc-sim-tarjetas { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .hc-sim-res { grid-template-columns: minmax(0, 1fr); }
    .hc-sim-panel { position: static; max-height: none; }
}
@media (max-width: 767px) {
    .hc-sim-tarjetas { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .hc-sim-tarjeta { padding: 12px; }
    .hc-sim-tarjeta-costo { font-size: 1.15rem; }
    .hc-sim-tarjeta-pie { flex-direction: column; gap: 2px; }
    .hc-sim-params, .hc-sim-guardar { align-items: stretch; }
    .hc-sim-control-colchon, .hc-sim-guardar .hc-control { width: auto; min-width: 0; }
}
