/* Editor de carta. Usa las variables y piezas de estilo.css (barra, cuerpo, caja, llave, tabla). */
.herramientas{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.buscar{flex:1;min-width:200px;max-width:420px;height:42px;background:var(--panel);border:1px solid var(--linea2);border-radius:10px;padding:0 13px;font-size:15px}
.tenue{color:var(--tenue);font-size:14px}
.secciones{display:grid;gap:18px}
.vacio{color:var(--tenue);font-size:14px}

.cat-carta{background:var(--panel);border:1px solid var(--linea);border-radius:14px;padding:14px 16px;display:grid;gap:10px}
.cat-carta .tit{display:flex;align-items:center;gap:10px}
.cat-carta .tit h2{margin:0;font-size:17px}
.cat-carta .tit small{color:var(--tenue)}
.cat-carta .tit .btn{margin-left:auto}

.prods{list-style:none;margin:0;padding:0;display:grid}
.prod{border-top:1px solid var(--linea)}
.prod:first-child{border-top:0}
.prod .resumen{display:grid;grid-template-columns:32px minmax(0,1fr) auto auto auto;align-items:center;gap:12px;padding:9px 0}
.prod .emoji{font-size:22px;text-align:center}
.prod .nom{min-width:0;display:grid}
.prod .nom b{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.prod .nom small{color:var(--tenue);font-size:12.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.prod .estrella{color:var(--sis)}
.prod .precio{font-size:14.5px}
.prod.agotado .nom b,.prod.agotado .precio{color:var(--tenue);text-decoration:line-through}
@media (max-width:560px){
  .prod .resumen{grid-template-columns:28px minmax(0,1fr) auto;row-gap:6px}
  .prod .precio{grid-column:2}
  .prod .llave{justify-self:end}
}

.editor{display:grid;gap:12px;margin:2px 0 12px;padding:14px;background:var(--panel2);border:1px solid var(--linea2);border-radius:12px}
.editor .nota{font-size:13px;color:var(--hum)}
.grilla{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px 12px}
.grilla .ancho2{grid-column:span 3}
.grilla .todo,.menu-semana .todo{grid-column:1/-1}
@media (max-width:700px){.grilla{grid-template-columns:1fr 1fr}.grilla .ancho2{grid-column:span 1}}
.campo{display:grid;gap:5px;font-size:12.5px;color:var(--suave);font-weight:600}
.campo input,.campo select,.campo textarea,.tabla-menu input{width:100%;background:var(--fondo);border:1px solid var(--linea2);border-radius:8px;padding:8px 10px;font-size:15px;color:var(--txt);font-weight:400}
.campo textarea{resize:vertical}
.campo input:focus,.campo select:focus,.campo textarea:focus,.tabla-menu input:focus{border-color:var(--sis);outline:none}
.franjas{border:1px solid var(--linea);border-radius:10px;padding:8px 12px;margin:0;display:flex;flex-wrap:wrap;gap:6px 16px}
.franjas legend{font-size:12.5px;color:var(--suave);font-weight:600;padding:0 4px}
.marca-op{display:inline-flex;align-items:center;gap:6px;font-size:14px;cursor:pointer}
.marca-op small{color:var(--tenue);font-family:var(--mono);font-size:11.5px}
.marca-op input{accent-color:var(--sis);width:16px;height:16px}
.marcas{display:flex;gap:18px;flex-wrap:wrap}
.editor .error,.menu-semana .error{color:var(--mal);font-size:14px;min-height:1.2em}
.acciones{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.acciones .espacio{flex:1}

.menu-semana{display:grid;gap:14px;margin-top:12px}
.tabla-menu{overflow-x:auto}
.tabla-menu .tabla th[scope=row]{font-weight:600;white-space:nowrap}
.tabla-menu input{min-width:170px;font-size:14.5px}
