/* =============================================================================
   Revisar nombres (/revisar-nombres)
   -----------------------------------------------------------------------------
   Estas reglas vivían en catalogo-global.css y se borraron en el rediseño de
   «Arma tu inventario» (43932fa, 2026-08-18): la pantalla se quedó sin una sola
   regla durante tres semanas y se pintaba como divs apilados. Hoja propia para
   que el próximo rediseño de la otra pantalla no la vuelva a arrastrar.

   Sólo tokens --ic-* / --lc-*: la hoja está en el barrido de SustratoVisualTests.
   ============================================================================= */

.cg-wrap {
    display: flex;
    flex-direction: column;
    gap: var(--ic-space-3, 12px);
    /* Deja aire para la barra de resumen fija del pie. */
    padding-bottom: calc(var(--ic-touch-min, 48px) + var(--ic-space-6, 24px));
}

/* ── Encabezado ────────────────────────────────────────────────────────────── */

.cg-intro {
    display: flex;
    align-items: flex-start;
    gap: var(--ic-space-3, 12px);
}

.cg-intro__volver {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: none;
    width: var(--ic-touch-min, 48px);
    height: var(--ic-touch-min, 48px);
    margin-left: -8px;
    border: 0;
    border-radius: 12px;
    background: transparent;
    color: var(--ic-text);
    cursor: pointer;
}

.cg-intro__volver:hover { background: var(--ic-surface-2); }

.cg-intro__title {
    font-size: var(--ic-text-lg, 1.125rem);
    font-weight: 600;
    color: var(--ic-text);
}

.cg-intro__sub {
    margin-top: 4px;
    font-size: var(--ic-text-sm, 0.875rem);
    color: var(--ic-text-tertiary);
}

/* ── Aviso de que nada se aplica solo: es lo que hace segura esta pantalla ── */

.nz-nota {
    padding: var(--ic-space-3, 12px);
    border-radius: var(--ic-radius-md, 12px);
    background: var(--ic-surface-2);
    color: var(--ic-text-tertiary);
    font-size: var(--ic-text-sm, 0.875rem);
}

/* ── Secciones ─────────────────────────────────────────────────────────────── */

.nz-seccion {
    display: flex;
    flex-direction: column;
    gap: var(--ic-space-2, 8px);
}

.nz-seccion__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--ic-space-3, 12px);
    flex-wrap: wrap;
    margin-top: var(--ic-space-4, 16px);
}

.nz-seccion__title {
    font-size: var(--ic-text-md, 1rem);
    font-weight: 600;
    color: var(--ic-text);
}

.nz-seccion__sub {
    font-size: var(--ic-text-xs, 0.8125rem);
    color: var(--ic-text-tertiary);
}

/* ── Filas ─────────────────────────────────────────────────────────────────── */

.nz-fila {
    display: flex;
    align-items: center;
    gap: var(--ic-space-3, 12px);
    min-height: var(--ic-touch-min, 48px);
    padding: var(--ic-space-3, 12px);
    border: 1px solid var(--ic-border);
    border-radius: var(--ic-radius-md, 12px);
    background: var(--ic-surface);
}

.nz-fila--aplicada { opacity: .55; }

.nz-fila__check { flex: 0 0 auto; }

.nz-fila__cuerpo { flex: 1 1 auto; min-width: 0; }

/* El nombre viejo y el propuesto, uno junto al otro: es la decisión que se toma. */
.nz-cambio {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
    font-size: var(--ic-text-sm, 0.875rem);
}

.nz-cambio__viejo { color: var(--ic-text-tertiary); text-decoration: line-through; }

.nz-cambio__flecha { color: var(--ic-text-tertiary); }

.nz-cambio__nuevo { font-weight: 600; color: var(--ic-text); }

.nz-fila__meta {
    margin-top: 2px;
    font-size: var(--ic-text-xs, 0.8125rem);
    color: var(--ic-text-tertiary);
}

.nz-fila__elegir { margin-top: var(--ic-space-2, 8px); max-width: 420px; }

/* ── Barra de resumen del pie ──────────────────────────────────────────────── */

.cg-resumen {
    position: sticky;
    bottom: 0;
    z-index: 4;
    display: flex;
    align-items: center;
    gap: var(--ic-space-3, 12px);
    min-height: var(--ic-touch-min, 48px);
    padding: var(--ic-space-2, 8px) var(--ic-space-3, 12px);
    background: var(--ic-chrome-bg, var(--ic-surface));
    border-top: 1px solid var(--ic-border);
    /* En móvil la barra queda encima del área del gesto de inicio. */
    padding-bottom: calc(var(--ic-space-2, 8px) + env(safe-area-inset-bottom, 0px));
}

.cg-resumen__texto {
    flex: 1 1 auto;
    min-width: 0;
    font-size: var(--ic-text-sm, 0.875rem);
    color: var(--ic-text);
}

.cg-resumen__hint {
    display: block;
    font-size: var(--ic-text-xs, 0.8125rem);
    color: var(--ic-text-tertiary);
}