/* ===========================================================================
   EL ALTA DE PRODUCTO Y LAS TRADUCCIONES — la piel de las dos pantallas de la
   tanda P6 de precios (docs\arquitectura\precios-impuestos-y-promociones-
   2026-09-29.md, §8 y §9)

   Va DESPUES de plano-precios.css y, como ella, no declara fichas propias:
   todo sale de las `--plano-*` de plano.css. Zonas en vez de tarjetas (papel,
   esquina de muro 20/6), campos rellenos con subrayado al enfocar, pastillas
   para las ayudas y la tinta morada solo para la accion («Dar de alta»).

   Dos gramaticas de tabla, con el corte en 720 px como el resto de la web:
   por encima, filas en rejilla (local | un canal por columna | accion); por
   debajo, cada local es un bloque con sus canales uno debajo de otro y la
   accion al pie.
   =========================================================================== */

.alta {
    display: flex;
    flex-direction: column;
    gap: 1.75rem;
    max-inline-size: 1200px;
}

.alta-zona {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    padding: 1.25rem 1.5rem;
    border-radius: var(--plano-radio-zona) var(--plano-radio-zona-corto);
    background-color: var(--plano-hoja);
    box-shadow: inset 2px 2px 0 0 var(--plano-muro);
    min-inline-size: 0;
}

.alta-rotulo {
    margin: 0;
    font-family: var(--plano-familia);
    font-size: var(--plano-t-12);
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    font-variation-settings: 'wdth' 75;
    color: var(--plano-tinta-2);
}

.alta-cabecera-zona {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
}

.alta-campo {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    min-inline-size: 0;
}

.alta-campo > label {
    font-size: var(--plano-t-13);
    font-weight: 560;
    color: var(--plano-tinta-2);
}

.alta-par {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr));
    gap: 0.75rem;
}

/* EL CAMPO. Un `input` pelado con la piel de campo relleno del sistema: la
   misma que la de las cifras de la pizarra (plano-precios.css). 44 px de alto
   (objetivo de toque) y el subrayado de 2 px al enfocar. */
.alta-entrada {
    box-sizing: border-box;
    inline-size: 100%;
    min-block-size: var(--plano-toque);
    padding: 0.35rem 0.75rem;
    border: none;
    border-radius: var(--plano-radio-control);
    background-color: rgba(42, 26, 62, 0.05);
    color: var(--plano-tinta);
    font-family: var(--plano-familia);
    font-size: var(--plano-t-15);
    transition: background-color var(--plano-tiempo) var(--plano-curva), box-shadow var(--plano-tiempo) var(--plano-curva);
}

.alta-entrada:hover { background-color: rgba(42, 26, 62, 0.08); }

.alta-entrada:focus {
    outline: none;
    box-shadow: inset 0 -2px 0 0 var(--plano-morado);
}

.alta-entrada:disabled {
    background-color: var(--plano-papel-hondo);
    background-image: var(--plano-trama-suave);
    color: var(--plano-tinta-2);
}

.alta-entrada[aria-invalid="true"] { box-shadow: inset 0 -2px 0 0 var(--plano-arcilla-honda); }

.alta-entrada-grande {
    min-block-size: 52px;
    font-size: var(--plano-t-20);
    font-weight: 600;
}

.alta-cifra {
    text-align: end;
    font-variant-numeric: tabular-nums;
}

.alta-moneda { max-inline-size: 6rem; text-transform: uppercase; }

.alta-nota {
    margin: 0;
    font-size: var(--plano-t-13);
    color: var(--plano-tinta-2);
}

.alta-error-campo {
    margin: 0;
    font-size: var(--plano-t-13);
    color: var(--plano-arcilla-honda);
}

/* LAS TRADUCCIONES DEBAJO DEL NOMBRE: una linea por idioma, con su codigo en
   versalita, el texto y el estado. «sin revisar» en mostaza con palabra (la
   regla de la palabra: el color solo nunca vale). */
.alta-traducciones {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    padding-inline-start: 0.75rem;
    border-inline-start: 2px solid var(--plano-linea-fina);
}

.alta-traduccion {
    display: grid;
    grid-template-columns: 2.5rem minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 0.5rem;
}

.alta-idioma {
    font-size: var(--plano-t-12);
    font-weight: 700;
    letter-spacing: 0.06em;
    color: var(--plano-tinta-2);
}

.alta-estado {
    display: inline-flex;
    align-items: center;
    min-block-size: 24px;
    padding: 0 0.6rem;
    border-radius: var(--plano-pildora);
    font-size: var(--plano-t-12);
    font-weight: 600;
    white-space: nowrap;
}

.alta-estado-sinrevisar { background-color: var(--plano-mostaza-aguada); color: var(--plano-mostaza-honda); }
.alta-estado-desactualizada { background-color: var(--plano-arcilla-aguada); color: var(--plano-arcilla-honda); }
.alta-estado-revisada { background-color: var(--plano-salvia-aguada); color: var(--plano-salvia); }
.alta-estado-falta { background-color: var(--plano-papel-hondo); color: var(--plano-tinta-2); }

/* LAS AYUDAS: pastillas de texto, la familia mas floja del sistema. */
.alta-ayudas {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
}

.alta-pastilla {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    min-block-size: var(--plano-toque);
    padding: 0.3rem 0.9rem;
    border: none;
    border-radius: var(--plano-radio-control);
    background-color: rgba(42, 26, 62, 0.05);
    color: var(--plano-tinta);
    font-family: var(--plano-familia);
    font-size: var(--plano-t-13);
    font-weight: 540;
    cursor: pointer;
    white-space: nowrap;
    transition: background-color var(--plano-tiempo) var(--plano-curva), color var(--plano-tiempo) var(--plano-curva);
}

.alta-pastilla:hover:not(:disabled) { background-color: var(--plano-morado-aguada); color: var(--plano-morado); }

.alta-pastilla:disabled {
    background-color: var(--plano-papel-hondo);
    background-image: var(--plano-trama-suave);
    color: var(--plano-tinta-2);
    cursor: default;
}

.alta-pastilla[aria-expanded="true"],
.alta-pastilla[aria-checked="true"],
.alta-pastilla[aria-selected="true"] {
    background-color: var(--plano-tinta);
    color: var(--plano-papel);
}

.alta-pastilla:focus-visible,
.alta-boton:focus-visible {
    outline: var(--plano-foco-grosor, 2px) solid var(--plano-morado);
    outline-offset: 2px;
}

.alta-boton {
    min-block-size: var(--plano-toque);
    padding: 0 1.15rem;
    border: none;
    border-radius: var(--plano-radio-control);
    background-color: var(--plano-morado);
    color: var(--plano-papel);
    font-family: var(--plano-familia);
    font-size: var(--plano-t-15);
    font-weight: 560;
    box-shadow: 0 2px 0 0 var(--plano-morado-honda);
    cursor: pointer;
}

.alta-boton:hover { background-color: var(--plano-morado-honda); }

.alta-casilla {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    min-block-size: var(--plano-toque);
    font-size: var(--plano-t-13);
    cursor: pointer;
}

.alta-casilla input { inline-size: 18px; block-size: 18px; accent-color: var(--plano-morado); }

.alta-bloque {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 0.75rem;
    padding: 0.75rem;
    border-radius: var(--plano-radio-zona-corto);
    background-color: var(--plano-morado-aguada);
}

.alta-bloque > label {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    font-size: var(--plano-t-13);
    font-weight: 560;
    min-inline-size: 7rem;
}

/* De dónde sale el cambio de «Copiar a otra moneda» (la tabla de cambios, a mano o que falta): una línea
   entera debajo de los campos. */
.alta-bloque > .alta-ayuda {
    flex-basis: 100%;
    order: 10;
    font-size: var(--plano-t-13);
    color: var(--plano-tinta-2);
}

/* LAS PRESENTACIONES: filas en rejilla, la primera columna ancha y tres cifras
   por moneda. */
.alta-presentaciones {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.alta-fila {
    display: grid;
    grid-template-columns: minmax(12rem, 2fr) repeat(var(--alta-monedas, 3), minmax(6.5rem, 1fr)) minmax(4.5rem, auto);
    align-items: center;
    gap: 0.5rem;
    padding-block: 0.35rem;
    border-block-end: 1px solid var(--plano-linea-fina);
}

.alta-fila-cabecera {
    font-size: var(--plano-t-12);
    font-weight: 600;
    color: var(--plano-tinta-2);
}

.alta-presentacion {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.alta-num { text-align: end; }

.alta-oculto {
    position: absolute;
    inline-size: 1px;
    block-size: 1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
}

.alta-errores-lista,
.alta-avisos {
    margin: 0;
    padding: 0.6rem 0.9rem 0.6rem 2rem;
    border-radius: var(--plano-esquina-muro, 6px);
    font-size: var(--plano-t-13);
}

.alta-errores-lista { background-color: var(--plano-arcilla-aguada); color: var(--plano-tinta); }
.alta-avisos { background-color: var(--plano-mostaza-aguada); color: var(--plano-tinta); }

.alta-textos { display: flex; flex-direction: column; gap: 0.6rem; }

.alta-locales {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem 1.25rem;
}

.alta-casilla-conjunto { font-weight: 600; }

/* LO QUE RESULTA: una fila por local y una columna por canal. La celda dice el
   precio, de donde sale y el impuesto, en tres renglones. */
.alta-tabla { display: flex; flex-direction: column; }

.alta-tabla-fila {
    display: grid;
    /* Mínimos pensados para tres canales en una tableta (768 px): con los de antes (10 + 3 × 8 + 9 rem) la columna
       de «Excepción» se salía 15 px de la tarjeta con la sala, la barra y la terraza de T000006 (preparación de la
       publicación, 2026-09-30). El precio y su origen caben en 6,5 rem. La columna de la acción es FIJA: con «auto»
       cada fila (una rejilla por fila) la ensanchaba a su contenido, y la fila con la excepción abierta («propio»,
       el precio y «Quitar excepción») desalineaba sus precios de los de las demás filas; ahora su contenido se parte
       en dos renglones dentro de la columna. */
    grid-template-columns: minmax(8rem, 1.4fr) repeat(var(--alta-canales, 1), minmax(6.5rem, 1fr)) 11rem;
    align-items: center;
    gap: 0.75rem;
    padding: 0.5rem 0.25rem;
    border-block-end: 1px solid var(--plano-linea-fina);
}

.alta-tabla-cabecera {
    font-size: var(--plano-t-12);
    font-weight: 600;
    color: var(--plano-tinta-2);
}

.alta-tabla-fila-sinventa {
    background-color: var(--plano-papel-hondo);
    background-image: var(--plano-trama-suave);
    color: var(--plano-tinta-2);
}

.alta-tabla-fila-propia { background-color: var(--plano-morado-aguada); }

.alta-local { display: flex; flex-direction: column; gap: 0.1rem; min-inline-size: 0; }

.alta-celda { display: flex; flex-direction: column; align-items: flex-end; gap: 0.05rem; }

.alta-precio {
    font-size: var(--plano-t-15);
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

.alta-origen,
.alta-impuesto {
    font-size: var(--plano-t-12);
    color: var(--plano-tinta-2);
}

.alta-impuesto { font-variant-numeric: tabular-nums; }

/* El cambio programado del impuesto (configuración fiscal con fechas): «10 % hasta el 31/12» y «12 % desde el 01/01». */
.alta-impuesto-cambio {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    font-size: var(--plano-t-12);
    color: var(--plano-tinta-2);
    font-variant-numeric: tabular-nums;
    text-align: end;
}

.alta-impuesto-nuevo { color: var(--plano-tinta); font-weight: 600; }

.alta-accion {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 0.4rem;
}

.alta-propia {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: var(--plano-t-12);
    color: var(--plano-tinta-2);
}

.alta-propia .alta-entrada { inline-size: 6.5rem; }

.alta-conjuntos { margin: 0; padding-inline-start: 1.25rem; font-size: var(--plano-t-13); }

.alta-conjuntos .alta-entrada { inline-size: 6.5rem; display: inline-block; }

/* «Por lista de precios» (2026-10-04): la pizarra de la ficha de siempre, de solo lectura, debajo de lo que
   resulta. La pastilla abre y cierra; la pizarra trae su piel (plano-precios.css). */
.alta-tarifas { display: flex; flex-direction: column; align-items: flex-start; gap: 0.6rem; margin-block-start: 0.4rem; }

.alta-tarifas-vista { align-self: stretch; }

/* El ancla del enlace de la ficha de siempre recibe el foco por programa: sin anillo de foco en la sección entera. */
.alta-zona:focus { outline: none; }

.alta-resumen {
    padding: 0.6rem 0.9rem;
    border-radius: var(--plano-esquina-muro, 6px);
    background-color: var(--plano-arcilla-aguada);
    color: var(--plano-tinta);
    font-size: var(--plano-t-13);
}

.alta-resumen ul { margin: 0.35rem 0 0; padding-inline-start: 1.25rem; }

.alta-pie { position: sticky; bottom: 0; background-color: var(--plano-papel); padding-block: 0.5rem; z-index: 1; }

/* El estado del pie es nowrap en todas las fichas (app.css); aquí lleva además el enlace a la ficha completa,
   que en el teléfono no cabe en una línea (2026-09-29: 507 px de documento a 375). */
.alta-pie .crud-ficha-estado { white-space: normal; min-width: 0; flex: 1 1 12rem; }

.alta-pie a { margin-inline-start: 0.75rem; color: var(--plano-morado); }

.alta-aviso-externo {
    margin: 0;
    padding: 0.6rem 0.9rem;
    border-radius: var(--plano-esquina-muro, 6px);
    background-color: var(--plano-mostaza-aguada);
    font-size: var(--plano-t-13);
}

.alta-importar { position: relative; }

/* LA LINEA DEL SERVICIO DE TRADUCCION: discreta, encima de las zonas; sin servicio, en tinta de aviso. */
.traducciones-servicio { margin-block-end: 0.75rem; }

.traducciones-servicio:not([data-estado="activo"]) { color: var(--limpia-aviso-tinta, var(--plano-tinta-2)); }

/* LA REVISION DE TRADUCCIONES: original | traduccion | estado. */
.traducciones-resumen p { margin: 0; font-size: var(--plano-t-13); }

.traducciones-tabla { display: flex; flex-direction: column; }

.traducciones-fila {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr) minmax(8rem, auto);
    align-items: center;
    gap: 0.75rem;
    padding: 0.45rem 0.25rem;
    border-block-end: 1px solid var(--plano-linea-fina);
}

.traducciones-original { display: flex; flex-direction: column; min-inline-size: 0; }

.traducciones-estado { display: flex; flex-wrap: wrap; align-items: center; gap: 0.4rem; }

/* IMPORTAR Y EXPORTAR (importador Excel F1, tarea 11): el filtro a su ancho, la tarjeta del trabajo y las tablas del resumen,
   las líneas y el historial, que desplazan DENTRO de su caja (nitida.css §4.7) y no ensanchan la página a 360 px. */
.libro-exportar { display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem; }

.libro-filtro { flex: 0 1 16rem; min-inline-size: 11rem; max-inline-size: 16rem; }

.libro-trabajo { display: flex; flex-direction: column; gap: 0.75rem; min-inline-size: 0; }

.libro-trabajo-cabeza { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; }

.libro-trabajo-cabeza .alta-nota { overflow-wrap: anywhere; }

.libro-veredicto { margin: 0; font-weight: 600; }

/* La caja es la que desplaza (y se alcanza con el teclado: axe, «scrollable-region-focusable»); el contenedor de MudBlazor, no. */
.libro-tabla-caja { position: relative; max-inline-size: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }

.libro-tabla-caja:focus-visible { outline: var(--plano-foco-grosor, 2px) solid var(--plano-morado); outline-offset: 2px; }

.libro-tabla .mud-table-container { overflow: visible; }

.libro-acciones { white-space: nowrap; }

/* El interruptor de «Sin cambios» medía 38 px de alto: con el dedo, los 44 del toque. */
.libro-ver-todo .mud-switch { min-block-size: var(--plano-toque); }


/* POR DEBAJO DE 720 px: cada fila es un bloque. ------------------------------- */

@media (max-width: 719.98px) {
    .alta-zona { padding: 1rem; }

    .alta-fila-cabecera,
    .alta-tabla-cabecera { display: none; }

    .alta-fila {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .alta-fila > .alta-presentacion,
    .alta-fila > .alta-acciones-fila { grid-column: 1 / -1; }

    .alta-fila > [role=cell].alta-num::before {
        display: block;
        font-size: var(--plano-t-12);
        color: var(--plano-tinta-2);
        text-align: start;
    }

    .alta-fila > [role=cell].alta-num:nth-of-type(3n+2)::before { content: "Principal"; }
    .alta-fila > [role=cell].alta-num:nth-of-type(3n+3)::before { content: "Añadido"; }
    .alta-fila > [role=cell].alta-num:nth-of-type(3n+4)::before { content: "Suplemento"; }

    .alta-tabla-fila {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .alta-tabla-fila > .alta-local,
    .alta-tabla-fila > .alta-accion { grid-column: 1 / -1; }

    .alta-tabla-fila > .alta-accion { justify-content: flex-start; }

    .alta-celda { align-items: flex-start; }

    .alta-celda::before {
        content: attr(data-canal);
        font-size: var(--plano-t-12);
        font-weight: 600;
        color: var(--plano-tinta-2);
    }

    .alta-traduccion { grid-template-columns: 2.25rem minmax(0, 1fr); }

    .alta-traduccion > .alta-estado,
    .alta-traduccion > .alta-pastilla { grid-column: 2; justify-self: start; }

    .traducciones-fila { grid-template-columns: minmax(0, 1fr); }
}

/* LO DE COCINA Y EL BOTÓN (2026-10-07, argus-t4-escritura §11): las categorías del TPV en fila, cada una con su
   «Quitar», y el color del botón con su muestra. */
.alta-categorias {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.alta-categoria-tpv {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding-inline-start: 0.6rem;
    border-radius: var(--plano-radio-control);
    background-color: rgba(42, 26, 62, 0.05);
    font-size: var(--plano-t-13);
}

.alta-color {
    display: flex;
    align-items: center;
    gap: 0.6rem;
}

.alta-muestra {
    inline-size: 2.75rem;
    block-size: 2.75rem;
    flex: none;
    border-radius: var(--plano-radio-control);
    box-shadow: inset 0 0 0 1px rgba(42, 26, 62, 0.18);
}

.alta-selector-color {
    inline-size: 4rem;
    padding: 0.2rem;
}

/* LOS PRECIOS DEL MENÚ CON EL SISTEMA NUEVO (2026-10-11, docs/central/precios-del-menu-2026-10-11.md). En la ficha del menú
   las piezas del alta (precio base, dónde se vende, lo que resulta) van DENTRO de la zona «Precios» de la ficha, que ya es una
   zona: sin el fondo ni el muro de .alta-zona (una zona dentro de otra sería una tarjeta en una tarjeta), separadas por la
   regla fina. Las excepciones de tarifa que quedan, debajo de lo que resulta, con su rótulo. */
.alta-subzona {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    min-inline-size: 0;
}

.alta-subzona + .alta-subzona {
    padding-block-start: 1.25rem;
    border-block-start: 1px solid var(--plano-linea-fina);
}

.alta-precio-base {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 11rem), 1fr));
    gap: 0.75rem;
    max-inline-size: 36rem;
}

.alta-tarifas-propias {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    padding: 0.75rem 0.9rem;
    border-radius: var(--plano-radio-control);
    background-color: var(--plano-mostaza-aguada);
}

.alta-tarifas-propias .alta-conjuntos li { padding-block: 0.15rem; }